:root{--flour:#f6f1e7;--cream:#ece3d1;--crust:#8a5329;--char:#211e1a;--wheat:#6d6a3c;--muted:#5b544a;--rule:#d6cbb5}
*{box-sizing:border-box}
body{margin:0;background:var(--flour);color:var(--char);font:400 17px/1.65 "Work Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--crust);text-underline-offset:3px}
img{display:block;max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
h1,h2,.wordmark,blockquote{font-family:"Fraunces",Georgia,serif;font-weight:400;margin:0}
h2{font-size:clamp(2rem,3.6vw,2.8rem);line-height:1.08;margin:.6rem 0 1.2rem;letter-spacing:-.01em}
.label{font:600 .72rem/1 "Work Sans",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--wheat);margin:0}
.wordmark{font-size:1.7rem;font-style:italic;color:inherit;text-decoration:none}

.hero{position:relative;min-height:min(92svh,820px);color:var(--flour);background:var(--char);display:flex}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 60%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,17,14,0) 25%,rgba(20,17,14,.55) 60%,rgba(20,17,14,.75))}
.hero-in{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;justify-content:space-between;padding-top:28px;padding-bottom:64px}
.hero-copy{margin-left:auto;max-width:440px}
.hero .label{color:#d8cc98}
h1{font-size:clamp(3.2rem,7.5vw,6.4rem);line-height:.95;font-weight:300;margin:1.1rem 0 1rem;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.lede{font-family:Fraunces,serif;font-size:clamp(1.2rem,2vw,1.55rem);line-height:1.3;margin:0 0 2rem;color:#e9e1d2}
.lede em{color:#e8c79f}
.glance{margin:0;padding-top:16px;border-top:1px solid rgba(246,241,231,.4);font-size:.95rem;letter-spacing:.02em}
.glance span{opacity:.6;margin:0 .4em}

.bake{display:grid;grid-template-columns:5fr 4fr 3fr;gap:40px;align-items:end;padding-top:clamp(72px,10vw,128px);padding-bottom:clamp(56px,8vw,96px)}
.bake-text{align-self:center}
.pillars{margin:0;border-top:1px solid var(--char)}
.pillars div{padding:16px 0;border-bottom:1px solid var(--rule)}
.pillars dt{font-family:Fraunces;font-size:1.3rem;margin-bottom:4px}
.pillars dd{margin:0;color:var(--muted);font-size:.95rem;max-width:44ch}
.story{background:var(--cream);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:clamp(64px,9vw,112px) 0;margin-bottom:clamp(56px,8vw,96px)}
.story-in{display:grid;grid-template-columns:6fr 5fr;gap:clamp(36px,6vw,88px);align-items:center}
.story-text .label{margin-bottom:1.2rem}
.story-ph{aspect-ratio:4/5}
.story-text p{max-width:60ch;margin:0 0 1rem}
.story-text .big{font-family:Fraunces;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.25;max-width:28ch;margin-bottom:1.4rem}
.ph{margin:0;overflow:hidden;background:var(--cream)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph-tall{aspect-ratio:3/4}.ph-small{aspect-ratio:3/4;margin-bottom:56px}

.quotes{display:grid;grid-template-columns:minmax(0,760px);gap:56px;padding-bottom:clamp(64px,9vw,112px)}
.quotes figure{margin:0;border-top:1px solid var(--rule);padding-top:22px}
blockquote{font-size:clamp(1.3rem,2vw,1.6rem);line-height:1.3;font-style:italic;margin-bottom:14px}
figcaption{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

.visit{background:var(--char);color:var(--flour);padding:clamp(64px,9vw,112px) 0}
.visit-in{display:grid;grid-template-columns:5fr 6fr;gap:clamp(36px,7vw,104px);align-items:center}
.visit .ph{aspect-ratio:4/5}
.visit .label{color:#d8cc98}.visit a{color:#e8c79f}
.hours{border-collapse:collapse;width:100%;max-width:440px;margin:.4rem 0 1.4rem}
.hours th,.hours td{padding:12px 0;border-top:1px solid #4a443c;font-weight:400;text-align:left}.hours td{text-align:right}
.warn{color:#d9d0c0;max-width:46ch;margin:0 0 1.6rem}
.map{display:block;position:relative;aspect-ratio:950/560;overflow:hidden;margin:0 0 1.4rem;border:1px solid #4a443c;padding:6px;background:#2b2722}
.map img{width:100%;height:100%;object-fit:cover;transition:opacity .2s}.map:hover img{opacity:.9}
.map small{position:absolute;right:6px;bottom:6px;background:rgba(33,30,26,.75);color:#d9d0c0;font-size:.66rem;padding:2px 6px}
.btn{display:inline-block;min-height:44px;padding:13px 22px;border:1px solid currentColor;text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.btn:hover{background:rgba(232,199,159,.12)}

.foot{display:flex;align-items:center;gap:32px;padding-top:32px;padding-bottom:32px;font-size:.9rem;color:var(--muted)}
.foot-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--char)}
.foot nav a{padding:10px 0}
.foot nav{display:flex;gap:24px;margin-right:auto}.foot nav a{color:var(--char)}
.foot small{font-size:.78rem}

@media (max-width:860px){
 .wrap{padding-left:22px;padding-right:22px}
 .hero{min-height:min(88svh,720px)}
 .hero-img{object-position:28% 50%}
 .hero::after{background:linear-gradient(180deg,rgba(20,17,14,.35) 0,rgba(20,17,14,.15) 30%,rgba(20,17,14,.8) 70%)}
 .hero-in{padding-bottom:40px}.hero-copy{margin-left:0}
 .bake{grid-template-columns:1fr 1fr;gap:16px}.bake-text{grid-column:1/-1;margin-bottom:24px}.ph-small{margin-bottom:0}
 .quotes{grid-template-columns:1fr;gap:32px}
 .story-in{grid-template-columns:1fr;gap:32px}
 .story-ph{aspect-ratio:3/2}
 .visit-in{grid-template-columns:1fr}.visit .ph{aspect-ratio:16/10}
 .foot{flex-direction:column;align-items:flex-start;gap:18px;padding-top:40px;padding-bottom:40px}
 .foot nav{gap:28px}
 h1{font-size:3.7rem;margin:.9rem 0 .9rem}
 .lede{font-size:1.25rem}
 .glance{font-size:.9rem;line-height:1.5}
 .map{aspect-ratio:4/3}
 .visit h2{font-size:2.1rem}
 .quotes figure{padding-top:18px}
}
.glance b{font-weight:400;white-space:nowrap}

/* --- responsive QA fixes --- */
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;left:auto}
/* Wide desktop: photo sits on the left 62%, fades into charcoal; text never covers the loaf */
@media (min-width:1200px){
 .hero-img{width:62%;object-position:0% 55%}
 .hero::after{background:linear-gradient(90deg,rgba(33,30,26,0) 0,rgba(33,30,26,0) 42%,rgba(33,30,26,.9) 54%,#211e1a 60%)}
}
/* Tablet / small laptop: text sits at the bottom over the board, with a vertical scrim */
@media (min-width:861px) and (max-width:1199px){
 .hero-copy{margin-left:0}
 .hero::after{background:linear-gradient(180deg,rgba(20,17,14,.25) 0,rgba(20,17,14,.1) 35%,rgba(20,17,14,.85) 78%)}
 .hero-img{object-position:50% 35%}
}
/* Landscape phones: short hero, stronger left scrim for legibility */
@media (max-height:500px) and (orientation:landscape){
 .hero{min-height:auto}
 .hero-in{padding-top:20px;padding-bottom:28px;gap:18px}
 .hero::after{background:linear-gradient(90deg,rgba(20,17,14,.85) 0,rgba(20,17,14,.6) 55%,rgba(20,17,14,.2) 100%)}
 h1{font-size:3rem}
}
.hours th,.hours td{white-space:nowrap}
@media (max-width:360px){
 .label{letter-spacing:.12em}
 .hours th,.hours td{font-size:.92rem}
 h1{font-size:3.1rem}
}

.foot .cred{font-size:.72rem;max-width:44ch;line-height:1.4}
@media (max-width:860px){.foot{flex-wrap:wrap;gap:16px 32px}}

/* feedback round */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.topnav{display:flex;gap:20px}
.topnav a{color:var(--flour);text-decoration:none;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:8px 0;border-bottom:1px solid rgba(246,241,231,.5)}
.glance a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(246,241,231,.5)}
.hero-cta{display:inline-block;margin-top:22px;padding:14px 22px;background:var(--flour);color:var(--char);text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.milled{border-bottom:1px solid var(--rule);background:var(--cream)}
.milled-in{display:flex;align-items:center;justify-content:center;gap:clamp(14px,4vw,48px);padding-top:26px;padding-bottom:26px}
.mi{display:flex;align-items:center;gap:12px}
.mi svg{width:34px;height:34px;flex:none;fill:none;stroke:var(--crust);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mi b{font-family:Fraunces,serif;font-weight:400;font-size:clamp(1.05rem,2vw,1.4rem);white-space:nowrap}
.dot{width:5px;height:5px;border-radius:50%;background:var(--wheat);flex:none}
.quotes{grid-template-columns:minmax(0,1fr);padding-top:clamp(56px,8vw,96px);padding-bottom:clamp(40px,6vw,72px);justify-items:center;text-align:center}
.quotes figure{border-top:0;padding-top:0;max-width:820px}
.qm{display:block;font-family:Fraunces,serif;font-size:6rem;line-height:.6;color:var(--crust);height:.5em}
.quotes blockquote{font-size:clamp(1.6rem,3.4vw,2.5rem);line-height:1.22}
.quotes figcaption{margin-top:18px}
.bake{padding-top:clamp(32px,5vw,64px)}
.visit-in{align-items:start}
.visit .map{aspect-ratio:4/5;margin:0}
.visit .map img{object-position:50% 50%}
.vbtns{display:flex;flex-wrap:wrap;gap:12px}
.btn-solid{background:#e8c79f;color:var(--char)!important;border-color:#e8c79f;font-size:.86rem;padding:17px 24px}
.btn-solid:hover{background:#f0d6b4}
@media (max-width:860px){
 .visit .map{aspect-ratio:1/1}
 .milled-in{flex-direction:column;align-items:flex-start;gap:12px;padding-top:22px;padding-bottom:22px}
 .dot{display:none}
 .vbtns .btn{flex:1 1 100%;text-align:center}
 .topnav{gap:16px}
}
@media (max-width:360px){.topnav a{font-size:.68rem;letter-spacing:.1em}.btn-solid{font-size:.76rem;letter-spacing:.08em;padding:16px 12px}}
@media (max-width:860px){
 .milled-in{flex-direction:row;justify-content:space-around;align-items:flex-start;gap:8px}
 .mi{flex-direction:column;gap:6px;text-align:center;flex:1}
 .mi b{font-size:1rem;white-space:normal}
}

/* sample build */
.visit .map{padding:0}
.visit .map img{height:100%}
.foot{padding-bottom:64px}
.story{margin-bottom:0;border-bottom:0}
.sample-badge{display:block;position:static;margin:0;padding:7px 12px;background:#000;color:#fff;text-align:center;font:500 12px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.02em;text-decoration:none;border:0;border-radius:0;box-shadow:none}
.sample-badge:hover{text-decoration:underline}
.fab{display:none}
@media(max-width:860px){
 .topbar{justify-content:center}
 .topnav{display:none}
 body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
 .fab{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:30;display:flex;gap:8px}
 .fab a{flex:1;display:flex;align-items:center;justify-content:center;min-height:52px;border-radius:2px;font:600 .82rem/1 "Work Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;background:#e8c79f;color:var(--char);box-shadow:0 6px 20px rgba(0,0,0,.22)}
 .fab a+a{background:var(--char);color:var(--flour)}
}
/* R6: brighter hero on mobile */
@media(max-width:860px){
 .hero-img{filter:brightness(1.45) contrast(1.06) saturate(1.05);object-position:40% 62%}
 .hero::after{background:linear-gradient(180deg,rgba(20,17,14,.3) 0,rgba(20,17,14,0) 22%,rgba(20,17,14,0) 42%,rgba(20,17,14,.82) 76%)}
}
/* R7: icon row clears the sticky bar on phones */
@media (max-width:860px){.hero{min-height:min(calc(100svh - 236px),720px)}.hero-in{padding-bottom:30px}}
/* R10: On the bench, hero hours, readable mobile hero, tighter mobile footer */
.bench{padding-top:clamp(56px,8vw,104px);padding-bottom:clamp(56px,8vw,96px)}
.bench h2{margin-bottom:28px}
.bench-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:28px 18px}
.bench-list img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;margin-bottom:12px}
.bench-list h3{margin:0 0 4px;font-size:1.15rem;line-height:1.25}
.bench-list p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.45}
.bench-note{margin:24px 0 0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
@media(min-width:900px){.bench-list{grid-template-columns:repeat(3,1fr);gap:44px 36px}}
.hero-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:22px}
.hero-act .hero-cta{margin-top:0}
.hero-hrs{margin:0;font-size:.9rem;color:var(--flour)}
.hero-hrs span{opacity:.7;font-size:.8rem}
@media(max-width:860px){
 .hero-img{filter:brightness(1.3) contrast(1.06) saturate(1.05)}
 .hero::after{background:linear-gradient(180deg,rgba(20,17,14,.35) 0,rgba(20,17,14,.1) 18%,rgba(20,17,14,.55) 40%,rgba(20,17,14,.88) 62%,rgba(20,17,14,.95) 100%)}
 .hero h1{text-shadow:0 2px 18px rgba(0,0,0,.45)}
 .foot{padding-bottom:20px}
}
.bench-note{text-transform:none;letter-spacing:.01em;font-size:.78rem}
/* Desktop polish (min-width only; mobile untouched) */
@media (min-width:861px){
 .bake{align-items:center}
 .ph-small{margin-bottom:0;align-self:end}
 .bench{padding-top:clamp(40px,5vw,72px)}
 .bench-list img{aspect-ratio:1/1}
 .story-text .big{max-width:24ch}
 .visit-in{align-items:center}
 .visit .map{aspect-ratio:4/3}
 .visit .map img{object-position:50% 55%}
 .warn{max-width:52ch}
}
@media (min-width:1200px){
 .hero-img{filter:brightness(1.15) contrast(1.04)}
 .hero-copy{max-width:470px}
}
@media (min-width:861px){
 .vbtns .btn{display:inline-flex;align-items:center;justify-content:center}
 .story-ph{aspect-ratio:1/1}
 .story{padding:clamp(64px,7vw,96px) 0}
 .foot small:last-child{margin-left:auto}
}
/* bottom-clearance fix: body clears fixed dock + safe area + 24px; no scroll traps */
html,body{overflow-x:clip!important}
html{overflow-y:visible}
@media(max-width:860px){body{padding-bottom:calc(62px + env(safe-area-inset-bottom) + 24px)!important}}

/* dock auto-hide when page Call/Text buttons are on screen */
.fab{transition:transform .28s ease,opacity .28s ease}
.fab.dock-off{transform:translateY(130%)!important;opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.fab{transition:none}}
/* solid dock bar (opaque, palette) + extension under safe area */
@media(max-width:860px){
 .fab{left:0;right:0;bottom:0;padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:var(--flour);border-top:1px solid var(--rule);box-shadow:0 -8px 24px rgba(33,30,26,.08)}
 .fab a{box-shadow:none}
 .fab::after{content:"";position:absolute;left:0;right:0;top:100%;height:240px;background:var(--flour);pointer-events:none}
}
/* v8: dock to screen bottom */
@media(max-width:860px){.fab{padding-bottom:calc(14px + env(safe-area-inset-bottom))!important}}
.fab::after{top:calc(100% - 1px)!important;height:160px!important}
