/* ============================================================
   Bollinger Breads — stylesheet
   Palette: cream / crust brown / baked-crust terracotta / wheat gold
   Type: Fraunces (display) + Karla (body & UI)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500;1,9..144,600&family=Karla:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

:root{
  --cream: #F5EFE2;
  --paper: #FFFDF8;
  --crust: #43301F;
  --crust-soft: #7C6046;
  --line: #E2D6BE;
  --terracotta: #B5602F;
  --terracotta-dark: #8F4A22;
  --wheat: #C9A66B;
  --open: #55704A;
  --open-bg: #E7ECDD;
  --closed: #A23E2E;
  --closed-bg: #F3DFD8;
  --shadow: 0 10px 30px -12px rgba(67, 48, 31, 0.25);
  --radius: 18px;
  --max: 1120px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--crust);
  font-family:'Karla', sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
.container{max-width:var(--max); margin:0 auto; padding:0 24px;}

h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:600;
  color:var(--crust);
  margin:0 0 .4em;
  letter-spacing:-0.01em;
}
h1{font-size:clamp(2.4rem, 5vw, 4rem); line-height:1.05;}
h2{font-size:clamp(1.7rem, 3vw, 2.4rem); line-height:1.15;}
h3{font-size:1.25rem;}
.eyebrow{
  font-family:'Karla', sans-serif;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.72rem;
  font-weight:700;
  color:var(--terracotta-dark);
}
.italic-lede{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-weight:500;
  color:var(--crust-soft);
  font-size:1.25rem;
}
p{margin:0 0 1em;}
.section{padding:88px 0;}
.section--tight{padding:56px 0;}
.section-head{max-width:640px; margin-bottom:40px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.divider{
  height:1px; background:var(--line); border:0; margin:0;
}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:'Karla', sans-serif; font-weight:700; font-size:.95rem;
  padding:15px 28px; border-radius:999px; border:2px solid transparent;
  cursor:pointer; text-decoration:none; transition:transform .15s ease, background .2s ease, box-shadow .2s ease;
}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--terracotta); color:#FFF9F1;}
.btn-primary:hover{background:var(--terracotta-dark);}
.btn-primary:disabled{background:#C9B79E; cursor:not-allowed;}
.btn-outline{background:transparent; border-color:var(--crust); color:var(--crust);}
.btn-outline:hover{background:var(--crust); color:var(--cream);}
.btn-ghost{background:transparent; color:var(--crust); padding:10px 4px;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:40;
  background:rgba(245,239,226,.9); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:12px; padding-bottom:12px;
}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand img{height:42px; width:auto;}
.brand-word{font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem; color:var(--crust);}
.brand-word small{display:block; font-family:'Karla',sans-serif; font-weight:700; letter-spacing:.14em; font-size:.58rem; color:var(--terracotta-dark); text-transform:uppercase;}
nav.main-nav{display:flex; align-items:center; gap:26px;}
nav.main-nav a{font-size:.92rem; font-weight:600; text-decoration:none; color:var(--crust-soft);}
nav.main-nav a:hover{color:var(--terracotta-dark);}
.nav-cta{display:none;}
@media(min-width:860px){.nav-cta{display:inline-flex;}}
.menu-toggle{display:none; background:none; border:0; font-size:1.6rem; color:var(--crust); cursor:pointer;}
@media(max-width:859px){
  nav.main-nav{display:none;}
  .menu-toggle{display:block;}
  nav.main-nav.open{
    display:flex; flex-direction:column; gap:0; position:absolute; top:100%; left:0; right:0;
    background:var(--paper); border-bottom:1px solid var(--line); padding:8px 24px 18px;
  }
  nav.main-nav.open a{padding:10px 0; border-bottom:1px solid var(--line);}
}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:86vh; display:flex; align-items:flex-end;
  background:#2b2015;
  overflow:hidden;
}
.hero img.hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.55;
}
.hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(43,32,21,.15) 0%, rgba(43,32,21,.55) 65%, rgba(43,32,21,.92) 100%);
}
.hero-content{position:relative; z-index:2; padding:120px 0 64px; color:#FBF4E7; width:100%;}
.hero-content .eyebrow{color:var(--wheat);}
.hero-content h1{color:#FFFBF3;}
.hero-content .italic-lede{color:#EADFC7;}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:28px;}

/* ---------- Cycle bar (signature element) ---------- */
.cycle{
  background:var(--paper); border-bottom:1px solid var(--line);
  padding:30px 0;
}
.cycle-track{
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:0; position:relative;
}
.cycle-track::before{
  content:''; position:absolute; top:19px; left:8%; right:8%; height:2px; background:var(--line); z-index:0;
}
.cycle-step{position:relative; z-index:1; text-align:center; padding:0 10px;}
.cycle-dot{
  width:40px; height:40px; border-radius:50%; background:var(--cream); border:2px solid var(--line);
  display:flex; align-items:center; justify-content:center; margin:0 auto 12px;
  font-family:'Fraunces',serif; font-weight:700; color:var(--crust-soft); font-size:1.05rem;
}
.cycle-step.active .cycle-dot{background:var(--terracotta); border-color:var(--terracotta); color:#fff; box-shadow:0 0 0 6px rgba(181,96,47,.15);}
.cycle-step h4{margin:0 0 4px; font-size:1.02rem;}
.cycle-step .cycle-when{font-size:.85rem; color:var(--crust-soft);}
.cycle-step.active h4{color:var(--terracotta-dark);}

/* ---------- Status banner ---------- */
.status-banner{
  border-radius:var(--radius); padding:20px 24px; display:flex; align-items:center; gap:16px;
  margin-top:26px; border:1px solid transparent;
}
.status-banner.is-open{background:var(--open-bg); color:var(--open); border-color:#CBDABF;}
.status-banner.is-closed{background:var(--closed-bg); color:var(--closed); border-color:#E7C3B7;}
.status-dot{width:12px; height:12px; border-radius:50%; background:currentColor; flex:0 0 auto;}
.status-banner strong{font-family:'Fraunces', serif; font-size:1.05rem; display:block;}
.status-banner span.sub{font-family:'Karla',sans-serif; font-size:.9rem; opacity:.9;}

/* ---------- Schedule ---------- */
.schedule-list{display:flex; flex-direction:column; gap:12px;}
.schedule-row{
  display:flex; align-items:center; gap:16px; background:var(--paper); border:1px solid var(--line);
  border-radius:14px; padding:14px 18px;
}
.schedule-range{
  font-family:'Fraunces', serif; font-weight:600; font-size:.95rem; color:var(--crust); flex:0 0 auto; min-width:140px;
}
.schedule-pill{
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  padding:4px 10px; border-radius:999px; flex:0 0 auto;
}
.schedule-pill.open{background:var(--open-bg); color:var(--open);}
.schedule-pill.closed{background:var(--closed-bg); color:var(--closed);}
.schedule-note{font-size:.88rem; color:var(--crust-soft);}
@media(max-width:640px){
  .schedule-row{flex-wrap:wrap;}
}

/* ---------- Menu ---------- */
.menu-category{margin-bottom:12px;}
.menu-category h3{
  font-size:1rem; text-transform:uppercase; letter-spacing:.1em; color:var(--terracotta-dark);
  border-bottom:1px solid var(--line); padding-bottom:10px; margin-bottom:18px;
}
.menu-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:18px; margin-bottom:44px;}
.item-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; display:flex; flex-direction:column; gap:10px;
}
.item-card.has-image{padding-top:0; overflow:hidden;}
.item-photo{width:100%; height:150px; object-fit:cover; border-radius:var(--radius) var(--radius) 0 0; margin-bottom:4px;}
.item-photo-placeholder{
  width:100%; height:90px; border-radius:12px; background:repeating-linear-gradient(135deg, #EFE6D2, #EFE6D2 10px, #EAE0C8 10px, #EAE0C8 20px);
  display:flex; align-items:center; justify-content:center; color:var(--crust-soft); font-size:.78rem; font-weight:600;
}
.item-top{display:flex; justify-content:space-between; align-items:baseline; gap:10px;}
.item-name{font-family:'Fraunces', serif; font-weight:600; font-size:1.08rem;}
.item-price{font-weight:700; color:var(--terracotta-dark); font-variant-numeric:tabular-nums; white-space:nowrap;}
.item-note{font-size:.83rem; color:var(--crust-soft); margin-top:-6px;}
.item-desc{font-size:.83rem; color:var(--crust-soft); margin:0; line-height:1.45;}
.item-desc a{color:var(--terracotta-dark); text-decoration:underline;}
.see-more-btn{
  background:none; border:0; padding:0; margin-left:2px; color:var(--terracotta-dark);
  font-weight:700; font-size:.83rem; cursor:pointer; text-decoration:underline; font-family:'Karla',sans-serif;
}
.see-more-btn:hover{color:var(--terracotta);}
.item-options{display:flex; flex-direction:column; gap:8px; margin-top:2px;}
.style-toggle{display:flex; gap:8px;}
.style-toggle button{
  flex:1; padding:8px 6px; border-radius:10px; border:1px solid var(--line); background:var(--cream);
  font-size:.82rem; font-weight:700; color:var(--crust-soft); cursor:pointer;
}
.style-toggle button.active{background:var(--crust); color:var(--cream); border-color:var(--crust);}
.dual-stepper{display:flex; gap:14px; margin-top:2px;}
.mini-stepper{display:flex; flex-direction:column; gap:6px; align-items:flex-start;}
.mini-label{font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--crust-soft);}
.addon-row{display:flex; align-items:center; gap:8px; font-size:.85rem; color:var(--crust-soft);}
.addon-row input{accent-color:var(--terracotta);}
.qty-row{display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:8px;}
.qty-stepper{display:flex; align-items:center; border:1px solid var(--line); border-radius:999px; overflow:hidden;}
.qty-stepper button{
  width:34px; height:34px; border:0; background:var(--cream); font-size:1.1rem; cursor:pointer; color:var(--crust);
}
.qty-stepper button:hover{background:var(--wheat); color:#fff;}
.qty-stepper .qty-value{width:34px; text-align:center; font-weight:700;}
.line-total{font-size:.85rem; font-weight:700; color:var(--crust-soft);}

/* ---------- Sticky order bar ---------- */
.order-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  background:var(--crust); color:var(--cream);
  transform:translateY(110%); transition:transform .25s ease;
  box-shadow:0 -12px 30px rgba(0,0,0,.2);
}
.order-bar.visible{transform:translateY(0);}
.order-bar .container{display:flex; align-items:center; justify-content:space-between; padding:14px 24px; gap:16px;}
.order-bar .obar-total{font-family:'Fraunces', serif; font-size:1.1rem;}
.order-bar .obar-total small{display:block; font-family:'Karla',sans-serif; font-size:.72rem; color:var(--wheat); text-transform:uppercase; letter-spacing:.1em;}

/* ---------- Fulfillment / form ---------- */
.form-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:30px;
  box-shadow:var(--shadow);
}
.field-group{margin-bottom:22px;}
.field-group > label, .field-group > .label{
  display:block; font-weight:700; font-size:.85rem; margin-bottom:8px; color:var(--crust);
}
.field-hint{font-size:.8rem; color:var(--crust-soft); margin-top:6px;}
input[type="text"], input[type="tel"], input[type="email"], textarea, select{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:12px;
  font-family:'Karla',sans-serif; font-size:.95rem; background:#FFFEFB; color:var(--crust);
}
textarea{resize:vertical; min-height:80px;}
.choice-row{display:flex; flex-wrap:wrap; gap:10px;}
.choice-pill{
  border:1px solid var(--line); border-radius:12px; padding:12px 16px; cursor:pointer;
  display:flex; flex-direction:column; gap:2px; min-width:150px; flex:1;
}
.choice-pill input{margin-right:8px;}
.choice-pill.selected{border-color:var(--terracotta); background:#FCF2E9;}
.choice-pill strong{font-size:.92rem;}
.choice-pill span{font-size:.78rem; color:var(--crust-soft);}
.summary-table{width:100%; border-collapse:collapse; margin:14px 0;}
.summary-table td{padding:6px 0; font-size:.92rem;}
.summary-table td:last-child{text-align:right; font-variant-numeric:tabular-nums;}
.summary-table tr.total td{font-weight:700; font-family:'Fraunces',serif; font-size:1.1rem; border-top:1px solid var(--line); padding-top:12px;}
.empty-cart-note{color:var(--crust-soft); font-style:italic;}

/* ---------- About ---------- */
.about-grid{display:grid; grid-template-columns:1fr; gap:36px;}
@media(min-width:860px){.about-grid{grid-template-columns:1.1fr 1fr; align-items:center;}}
.about-photo{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);}

/* ---------- Care ---------- */
.care-grid{display:grid; grid-template-columns:1fr; gap:32px; align-items:center;}
@media(min-width:860px){.care-grid{grid-template-columns:1fr 1fr;}}
.care-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px;}
.care-list li{display:flex; gap:14px; align-items:flex-start;}
.care-list .num{
  font-family:'Fraunces',serif; font-weight:700; color:var(--terracotta); font-size:1.1rem; flex:0 0 auto;
}

/* ---------- Find us / footer ---------- */
.info-strip{background:var(--crust); color:var(--cream);}
.info-strip .section{padding:64px 0;}
.info-strip h2{color:#FFF9F1;}
.info-grid{display:grid; grid-template-columns:1fr; gap:30px;}
@media(min-width:760px){.info-grid{grid-template-columns:repeat(3,1fr);}}
.info-card h4{color:var(--wheat); font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; font-family:'Karla',sans-serif; font-weight:700; margin-bottom:10px;}
.info-card p{color:#EADFC7; margin-bottom:.4em;}
.info-card a{color:#FBF4E7; text-decoration:underline;}
.site-footer{background:#39291B; color:#C9BCA4; padding:26px 0; font-size:.82rem;}
.site-footer .container{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

/* Toast */
.toast{
  position:fixed; top:20px; left:50%; transform:translateX(-50%) translateY(-140%);
  background:var(--crust); color:var(--cream); padding:14px 22px; border-radius:12px;
  font-weight:600; z-index:100; transition:transform .25s ease; box-shadow:var(--shadow);
}
.toast.show{transform:translateX(-50%) translateY(0);}

.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important; transition:none !important;}
}

:focus-visible{outline:3px solid var(--terracotta); outline-offset:2px;}