/* The Gentleman's Den: walnut + brass + bone. Cormorant Garamond / Geologica. */
:root {
  --c-primary: #9a6b2c; --c-primary-dark: #7a5220; --c-accent: #c9a15b;
  --c-ink: #241913; --c-muted: #6c5d50; --c-bg: #f3ece1; --c-surface: #e9dfcf;
  --c-dark: #241913; --c-on-dark: #efe6d6; --c-border: #d9cbb6;
  --f-head: "Cormorant Garamond", Georgia, serif; --f-body: "Geologica", system-ui, sans-serif; --fw-head: 700;
  --radius: 0; --radius-sm: 0; --nav-h: 76px;
}
body { font-weight: 300; }
h1, h2, h3 { letter-spacing: 0; }
h2 { font-size: clamp(2.2rem, 5vw, 3.4rem); }
.site-header { background: var(--c-ink); border-bottom: 1px solid #4a372a; backdrop-filter: none; }
.brand, .brand:hover { color: var(--c-on-dark); font-size: 1.3rem; }
.brand span { display: flex; flex-direction: column; }
.brand small { font-family: var(--f-body); font-weight: 400; font-size: .68rem; letter-spacing: .28em; text-transform: uppercase; color: var(--c-accent); margin-top: 3px; }
.nav-links a { color: var(--c-on-dark); font-weight: 400; font-size: .9rem; }
.nav-links a:hover { background: transparent; color: var(--c-accent); }
.nav-toggle { background: transparent; border-color: #5a4535; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { background: var(--c-on-dark); }

.den-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 28px; background: var(--c-accent); color: var(--c-ink); border: 1px solid var(--c-accent); font-family: var(--f-body); font-weight: 600; font-size: .85rem; letter-spacing: .2em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .2s, color .2s; }
.den-btn:hover { background: transparent; color: var(--c-accent); }
.den-btn--line { background: transparent; color: var(--c-accent); }
.den-btn--line:hover { background: var(--c-accent); color: var(--c-ink); }
.den-btn--block { width: 100%; }
.mobile-menu .den-btn { color: var(--c-ink); }

.den-hero { position: relative; background: var(--c-ink); color: var(--c-on-dark); padding-bottom: clamp(48px, 8vw, 96px); }
.den-hero__photo { position: relative; height: clamp(260px, 52vw, 560px); overflow: hidden; }
.den-hero__photo img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.25) brightness(.85); }
.den-hero__photo .photo-note { position: absolute; right: 14px; bottom: 14px; margin: 0; }
.den-hero__card { position: relative; margin-top: clamp(-160px, -14vw, -60px); }
.den-hero__card > * { max-width: 760px; }
.den-hero__card { padding-top: 0; }
.den-hero__card::before { content: ""; position: absolute; inset: 0 auto 0 var(--gutter); width: min(800px, calc(100% - 2 * var(--gutter))); background: var(--c-ink); z-index: -1; }
.den-hero__card { z-index: 1; }
.den-hero__place { font-size: .75rem; letter-spacing: .3em; text-transform: uppercase; color: var(--c-accent); padding-top: 34px; }
.den-hero h1 { font-size: clamp(2.8rem, 8vw, 5.6rem); font-weight: 500; line-height: 1; }
.den-hero h1 em { color: var(--c-accent); }
.den-hero .lead { color: #d8ccb8; font-size: 1.1rem; max-width: 52ch; }
.walkin-badge { display: inline-block; margin: 0 0 14px; padding: 6px 14px; background: var(--c-accent); color: var(--c-ink); font-size: .8rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.den-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

.den-about { padding: clamp(64px, 9vw, 120px) 0; }
.den-about__grid { display: grid; gap: 36px; }
@media (min-width: 900px) { .den-about__grid { grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; } }
.den-about__big { font-family: var(--f-head); font-style: italic; font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.12; color: var(--c-primary-dark); border-top: 1px solid var(--c-primary); padding-top: 22px; margin: 0; }
.den-about__photo { margin: 28px 0 0; }
.den-about__photo img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }

.den-menu { background: var(--c-surface); padding: clamp(64px, 9vw, 120px) 0; }
.menu-card { max-width: 760px; margin: 0 auto; background: var(--c-bg); padding: clamp(28px, 6vw, 64px); outline: 1px solid var(--c-primary); outline-offset: -12px; text-align: center; }
.menu-card__sub { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.menu-list { list-style: none; padding: 0; margin: 28px 0 0; text-align: left; }
.menu-list li { display: flex; align-items: baseline; gap: 10px; padding: 12px 0; }
.menu-list__name { font-family: var(--f-head); font-size: 1.35rem; font-weight: 700; line-height: 1.15; }
.menu-list__name small { display: block; font-family: var(--f-body); font-weight: 300; font-size: .8rem; color: var(--c-muted); }
.menu-list__dots { flex: 1; border-bottom: 2px dotted var(--c-primary); transform: translateY(-6px); min-width: 20px; }
.menu-list__price { font-family: var(--f-head); font-size: 1.5rem; font-weight: 700; color: var(--c-primary-dark); }

.den-paths { padding: clamp(64px, 9vw, 120px) 0; }
.den-paths h2 { text-align: center; margin-bottom: 40px; }
.paths { display: grid; gap: 0; border: 1px solid var(--c-border); }
@media (min-width: 800px) { .paths { grid-template-columns: 1fr 1fr; } }
.path { padding: clamp(28px, 5vw, 52px); }
.path--alt { background: var(--c-ink); color: var(--c-on-dark); }
.path__num { font-family: var(--f-head); font-style: italic; font-size: 2.4rem; color: var(--c-accent); }
.path h3 { font-size: 2rem; }
.path a { color: var(--c-primary-dark); font-weight: 600; }
.path--alt a { color: var(--c-accent); }

.den-hours { background: var(--c-ink); color: var(--c-on-dark); padding: clamp(64px, 9vw, 110px) 0; }
.den-hours__grid { display: grid; gap: 36px; align-items: center; }
@media (min-width: 860px) { .den-hours__grid { grid-template-columns: 1.1fr .9fr; gap: 64px; } }
.den-hours__list h2 { color: var(--c-on-dark); margin: 0 0 18px; }
.den-hours__list table { width: 100%; border-collapse: collapse; font-size: 1.05rem; }
.den-hours__list th, .den-hours__list td { padding: 12px 0; border-top: 1px solid #47362a; text-align: left; font-weight: 300; }
.den-hours__list td { text-align: right; font-variant-numeric: tabular-nums; }
.den-hours__list tr.is-today th, .den-hours__list tr.is-today td { color: var(--c-accent); font-weight: 600; }
.den-hours__tz { font-size: .9rem; color: #c3b5a6; margin: 14px 0 0; }
.den-hours__photo { margin: 0; }
.den-hours__photo img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }

.den-contact { padding: clamp(64px, 9vw, 120px) 0; }
.den-contact__grid { display: grid; gap: 36px; }
@media (min-width: 900px) { .den-contact__grid { grid-template-columns: .9fr 1.1fr; gap: 72px; } }
.den-contact__direct { font-family: var(--f-head); font-size: 1.5rem; line-height: 1.5; overflow-wrap: anywhere; }
.den-contact__direct a { color: var(--c-primary-dark); }
.den-contact .form-card { box-shadow: none; border: 1px solid var(--c-border); background: #fbf7f0; }
.den-contact .den-btn { color: var(--c-ink); }

.den-find { padding: 0 0 clamp(56px, 8vw, 96px); }
.den-find__map iframe { width: 100%; height: 340px; border: 0; filter: sepia(.35); display: block; }
.den-find__address { text-align: center; padding: 22px 0 0; }
.den-find__address strong { font-family: var(--f-head); font-size: 1.6rem; }

.den-footer { background: var(--c-ink); color: #a8988a; text-align: center; padding: 48px 0 36px; font-size: .85rem; }
.den-footer__mark { font-family: var(--f-head); font-style: italic; font-size: clamp(2rem, 6vw, 3.4rem); color: var(--c-accent); margin: 0 0 8px; line-height: 1; }
.call-bar { background: var(--c-ink); border-top-color: #4a372a; }
.call-bar .btn { border-radius: 0; }
.call-bar .btn--primary { background: var(--c-accent); color: var(--c-ink); box-shadow: none; }
.call-bar .btn--ghost { color: var(--c-accent); }
@media (max-width: 959px) { .nav-cta.den-btn { display: none; } }
@media (max-width: 640px) { .den-hero__card { margin-top: 0; } .den-hero__place { padding-top: 56px; } }
.den-hero__photo .photo-note { right: auto; left: 14px; bottom: auto; top: 14px; }
.menu-list__name { flex: 0 1 auto; min-width: 0; }
.menu-list__price { white-space: nowrap; }
