/* Golden Roost — production stylesheet
   Palette: plum #3E2038, gold #A9812F/#B08A3E, sage #7D8B6A, cream #FBF7F1 */

html { scroll-behavior: smooth; }
/* the header is position:fixed and floats over content — offset anchor
   targets so a jump-link doesn't land partially hidden underneath it */
[id] { scroll-margin-top: 96px; }
* { box-sizing: border-box; }
body {
  margin: 0;
  background: #FBF7F1;
  color: #3E2038;
  font-family: 'Jost', system-ui, sans-serif;
  overflow-x: hidden;
}
a { color: #6E3A62; text-decoration: none; }
a:hover { color: #A9812F; }
::selection { background: #E7D9AE; }
img { max-width: 100%; height: auto; display: block; }

.gr-page { background: #FBF7F1; color: #3E2038; overflow-x: hidden; }
.gr-wrap { max-width: 1280px; margin: 0 auto; padding: 0 40px; }

@keyframes gr-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes gr-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* ---------- Header ---------- */
/* position: fixed, not sticky — an animated hide/show transform fights a
   sticky element's own per-frame position recalculation during active
   scroll, so the transition can stay visually suppressed until scrolling
   fully settles. Fixed has no such recalculation to fight. */
.gr-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: rgba(251,247,241,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(62,32,56,0.10);
  transition: transform 280ms ease;
}
.gr-header.gr-header-hidden { transform: translateY(-100%); }
/* fixed removes the header from document flow — reserve its space so
   content doesn't start underneath it */
.gr-header-spacer { height: 88px; }
.gr-header-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 32px;
  min-height: 88px; display: flex; align-items: center; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
}
.gr-logo { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; flex-shrink: 0; line-height: 1; }
.gr-logo:hover { color: inherit; }
.gr-logo-eyebrow { font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: 0.44em; text-transform: uppercase; color: #A9812F; padding-left: 2px; }
.gr-logo-word { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 34px; letter-spacing: 0.06em; color: #3E2038; line-height: 1; }
.gr-logo-sub { font-family: 'Jost', sans-serif; font-size: 8px; letter-spacing: 0.26em; text-transform: uppercase; color: #8D7686; padding-left: 3px; margin-top: 3px; }

.gr-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 24px; font-size: 12px; letter-spacing: 0.13em; text-transform: uppercase; min-width: 0; }
.gr-nav a { color: #3E2038; white-space: nowrap; }
.gr-nav-soon { display: inline-flex; align-items: center; gap: 8px; }
.gr-soon-pill { font-size: 8px; letter-spacing: 0.14em; color: #A9812F; border: 1px solid rgba(176,138,62,0.5); border-radius: 999px; padding: 3px 7px; }

.gr-header-actions { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }

.gr-social {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border: 1px solid rgba(62,32,56,0.22); border-radius: 50%;
  transition: border-color 160ms ease, background-color 160ms ease;
}
.gr-social:hover { border-color: #B08A3E; background: rgba(176,138,62,0.08); }

.gr-nav-toggle {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; border: 1px solid rgba(62,32,56,0.22); border-radius: 8px;
  background: transparent; cursor: pointer; padding: 0;
}
.gr-nav-toggle span { display: block; width: 18px; height: 1px; background: #3E2038; margin: 0 auto; }

/* ---------- Buttons ---------- */
.gr-btn-primary, .gr-btn-outline {
  display: inline-flex; align-items: center; padding: 17px 34px; border-radius: 999px;
  font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}
.gr-btn-primary { background: #3E2038; color: #FBF7F1; }
.gr-btn-primary:hover { background: #B08A3E; color: #231018; }
.gr-btn-outline { gap: 10px; border: 1px solid rgba(62,32,56,0.22); color: #3E2038; }
.gr-btn-outline:hover { border-color: #7D8B6A; color: #5A6A4A; }
.gr-cta-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }

/* ---------- Photos ---------- */
.gr-photo { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.gr-photo-left { object-position: left center; }
.gr-photo-benedict { object-position: 75% 60%; }
.gr-photo-contain-light { object-fit: contain; background: #F7F2E9; }
.gr-photo-beauvine { object-position: center 70%; }
.gr-photo-cinnamon { object-position: 5% 100%; transform: scale(1.08) translateY(-1%); transform-origin: 30% 70%; }
.gr-photo-omelette { object-position: center 56%; }
.gr-photo-cake { object-position: center 44%; filter: sepia(0.12) saturate(0.9) contrast(1.05) brightness(1.02); }

/* ---------- Hero ---------- */
.gr-hero { padding: 48px 40px 0; align-items: end; }
.gr-hero-grid { display: grid; grid-template-columns: minmax(0,1.02fr) minmax(0,1fr); gap: 44px; }
.gr-hero-copy { padding-bottom: 24px; animation: gr-rise 700ms ease-out both; }
.gr-eyebrow-row { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.gr-rule { width: 44px; height: 1px; background: #B08A3E; display: block; }
.gr-eyebrow { font-size: 11px; letter-spacing: 0.34em; text-transform: uppercase; color: #A9812F; }
.gr-eyebrow-green { color: #7D8B6A; }
.gr-eyebrow-gold { color: #C9A24E; }

.gr-h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: clamp(40px,6.4vw,104px); line-height: 0.98; letter-spacing: -0.015em; margin: 0 0 26px; color: #3E2038; text-wrap: balance; }
.gr-h1 em { font-style: italic; color: #7D8B6A; }

.gr-hero-stats { display: flex; gap: 44px; margin-top: 40px; padding-top: 22px; border-top: 1px solid rgba(62,32,56,0.10); flex-wrap: wrap; }
.gr-stat-num { font-family: 'Cormorant Garamond', serif; font-size: 34px; line-height: 1; color: #B08A3E; }
.gr-stat-label { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #6D5566; margin-top: 8px; }

.gr-hero-image { position: relative; height: 640px; border-radius: 200px 200px 8px 8px; overflow: hidden; background: #EFE7DA; }

/* ---------- Marquee ---------- */
.gr-marquee { margin-top: 64px; background: #3E2038; color: #F3E9DC; padding: 16px 0; overflow: hidden; white-space: nowrap; }
.gr-marquee-track { display: inline-flex; gap: 0; animation: gr-marquee 34s linear infinite; will-change: transform; }
.gr-marquee-set { display: inline-flex; gap: 56px; padding-right: 56px; font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase; font-weight: 300; }
.gr-dot { color: #B08A3E; display: inline-flex; align-items: center; }
.gr-star { width: 1em; height: 1em; display: block; }

/* ---------- Story ---------- */
.gr-story { padding: 84px 40px; align-items: center; }
.gr-story-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.1fr); gap: 60px; }
.gr-story-collage { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: 200px 200px; gap: 16px; }
.gr-collage-tall { grid-row: span 2; border-radius: 10px; overflow: hidden; background: #EFE7DA; }
.gr-collage-cell { border-radius: 10px; overflow: hidden; background: #EFE7DA; }

.gr-h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: clamp(32px,3.8vw,60px); line-height: 1.04; margin: 22px 0 26px; color: #3E2038; text-wrap: balance; }
.gr-h2-light { color: #F5EDE1; margin: 20px 0 0; font-size: clamp(36px,4.4vw,68px); line-height: 1; }
.gr-p { font-size: 17px; line-height: 1.72; color: #5E4457; font-weight: 300; margin: 0 0 16px; max-width: 52ch; text-wrap: pretty; }
.gr-p-tight { margin-bottom: 26px; }

.gr-fact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(62,32,56,0.12); border: 1px solid rgba(62,32,56,0.12); border-radius: 8px; overflow: hidden; }
.gr-fact { background: #FBF7F1; padding: 26px 24px; }
.gr-fact-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.gr-fact-num { font-family: 'Cormorant Garamond', serif; font-size: 34px; color: #A9812F; line-height: 1; }
.gr-fact-num-green { color: #7D8B6A; }
.gr-fact-title { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: #3E2038; }
.gr-fact-title-lg { font-family: 'Cormorant Garamond', serif; font-size: 26px; color: #3E2038; margin-bottom: 6px; }
.gr-fact-body { font-size: 14px; color: #6D5566; line-height: 1.6; font-weight: 300; }

/* ---------- Section scaffolding ---------- */
.gr-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; flex-wrap: wrap; margin-bottom: 44px; }
.gr-section-pad { padding: 84px 40px; }
.gr-lead-note { font-size: 15px; line-height: 1.7; color: #5E4457; max-width: 34ch; font-weight: 300; margin: 0; text-wrap: pretty; }

/* ---------- Breakfast / Restaurant ---------- */
.gr-breakfast { background: #3E2038; color: #F5EDE1; padding: 84px 0; }
.gr-menu-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 56px; }
.gr-menu-group-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding-bottom: 14px; border-bottom: 1px solid rgba(245,237,225,0.18); margin-top: 0; }
.gr-menu-group-head-spaced { margin-top: 40px; }
.gr-kicker { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: #8B6E9A; }
.gr-kicker-note { font-size: 12px; color: rgba(245,237,225,0.5); font-weight: 300; letter-spacing: 0.06em; }
.gr-menu-item { display: flex; justify-content: space-between; gap: 24px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid rgba(245,237,225,0.10); }
.gr-item-name { font-family: 'Cormorant Garamond', serif; font-size: 27px; line-height: 1.2; }
.gr-item-desc { font-size: 14px; color: rgba(245,237,225,0.62); font-weight: 300; margin-top: 6px; max-width: 42ch; }
.gr-item-price { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: #C9A24E; white-space: nowrap; flex-shrink: 0; }
.gr-weekday { margin-top: 72px; border: 1px solid rgba(201,162,78,0.35); border-radius: 10px; padding: 44px 48px; background: rgba(245,237,225,0.03); }
.gr-weekday-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; margin-bottom: 18px; }
.gr-weekday-title { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: clamp(30px,3vw,42px); line-height: 1.05; margin: 14px 0 0; }
.gr-weekday-note { font-size: 14px; line-height: 1.65; color: rgba(245,237,225,0.62); font-weight: 300; margin: 0; max-width: 40ch; text-wrap: pretty; }
.gr-weekday-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 72px; }
.gr-weekday .gr-menu-item { padding: 20px 0; }
.gr-weekday-name { font-size: 26px; }
.gr-menu-line { padding: 16px 0; border-bottom: 1px solid rgba(245,237,225,0.10); font-size: 16px; font-weight: 300; color: rgba(245,237,225,0.78); line-height: 1.9; }
.gr-menu-footnote { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; font-size: 14px; color: rgba(245,237,225,0.6); font-weight: 300; }
.gr-dish-strip { margin-top: 56px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.gr-dish-photo { height: 300px; border-radius: 8px; overflow: hidden; background: #4B2A44; }

/* ---------- Sourcing strip ---------- */
.gr-sourcing { background: #EDEFE6; border-bottom: 1px solid rgba(62,32,56,0.08); padding: 64px 0 0; }
.gr-sourcing-eyebrow { display: block; margin-bottom: 26px; }

.gr-farm-carousel { position: relative; }
.gr-farm-viewport { overflow: hidden; }
.gr-farm-track { display: flex; gap: 16px; transition: transform 520ms cubic-bezier(0.22,0.61,0.36,1); will-change: transform; }
.gr-farm-card {
  flex: 0 0 calc((100% - (var(--gr-farm-pv, 3) - 1) * 16px) / var(--gr-farm-pv, 3));
  height: 300px; border-radius: 8px; overflow: hidden; background: #E2E5D6;
}
.gr-photo-contain { object-fit: contain; background: #6B6163; }
.gr-farm-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(62,32,56,0.14);
  background: #FBF7F1; color: #3E2038; font-size: 17px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 18px rgba(62,32,56,0.12);
  transition: background-color 160ms ease, color 160ms ease;
}
.gr-farm-arrow:hover { background: #3E2038; color: #FBF7F1; }
.gr-farm-prev { left: -14px; }
.gr-farm-next { right: -14px; }

.gr-sourcing-stats { padding: 56px 40px 64px; display: grid; grid-template-columns: minmax(0,1.25fr) repeat(2,minmax(0,1fr)); gap: 56px; align-items: start; }
.gr-sourcing-lead { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 32px; line-height: 1.15; color: #3E2038; }
.gr-big-num { font-family: 'Cormorant Garamond', serif; font-size: 50px; line-height: 1; color: #3E2038; }
.gr-big-num-sm { font-size: 40px; }
.gr-big-desc { font-size: 13px; line-height: 1.6; color: #4E5C41; margin-top: 10px; font-weight: 300; }

/* ---------- Bakery ---------- */
.gr-bakery-split { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 0 56px; align-items: start; }
.gr-bakery-photo-split { height: 320px; border-radius: 8px; overflow: hidden; background: #EFE7DA; }
.gr-bakery-split-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 34px; margin: 24px 0 0; color: #3E2038; }
.gr-bakery-desc-split { max-width: 44ch; }
.gr-bakery-desc { font-size: 16px; line-height: 1.7; color: #6D5566; font-weight: 300; margin: 10px 0 0; }
.gr-bakery-divider { align-self: stretch; display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 8px; }
.gr-bakery-divider-line { flex: 1; width: 1px; display: block; }
.gr-bakery-divider-line-top { background: linear-gradient(to bottom, rgba(62,32,56,0), rgba(62,32,56,0.16)); }
.gr-bakery-divider-line-bottom { background: linear-gradient(to top, rgba(62,32,56,0), rgba(62,32,56,0.16)); }
.gr-bakery-divider-mark { font-size: 15px; color: #B08A3E; line-height: 1; }

/* ---------- Coffee ---------- */
.gr-coffee { background: #F7F2E9; border-top: 1px solid rgba(62,32,56,0.08); border-bottom: 1px solid rgba(62,32,56,0.08); padding: 76px 0; }
.gr-coffee-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 56px; }
.gr-coffee-kicker { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: #7D8B6A; margin: 0 0 14px; }
.gr-coffee-kicker-spaced { margin-top: 36px; }
.gr-price-head { display: grid; grid-template-columns: minmax(0,1fr) 62px 62px; gap: 16px; align-items: baseline; padding-bottom: 10px; border-bottom: 1px solid rgba(62,32,56,0.18); }
.gr-price-head-note { font-size: 12px; color: #6D5566; font-weight: 300; font-style: italic; }
.gr-price-head-size { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: #8D7686; text-align: right; }
.gr-price-row { display: grid; grid-template-columns: minmax(0,1fr) 62px 62px; gap: 16px; align-items: baseline; padding: 13px 0; border-bottom: 1px solid rgba(62,32,56,0.10); }
.gr-drink-name { font-family: 'Cormorant Garamond', serif; font-size: 24px; line-height: 1.2; color: #3E2038; }
.gr-drink-desc { font-size: 13px; color: #6D5566; font-weight: 300; margin-top: 4px; line-height: 1.5; }
.gr-drink-price { font-family: 'Cormorant Garamond', serif; font-size: 19px; color: #A9812F; text-align: right; }
.gr-addon-row { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; border-bottom: 1px dotted rgba(62,32,56,0.18); font-size: 15px; font-weight: 300; color: #4A2C44; }
.gr-addon-row-plain { border-bottom: none; }
.gr-addon-price { color: #A9812F; }
.gr-tea-grid { margin-top: 56px; padding-top: 36px; border-top: 1px solid rgba(62,32,56,0.14); display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 48px 72px; }
.gr-cold-row { display: grid; grid-template-columns: minmax(0,1fr) 48px 48px; gap: 12px; align-items: baseline; padding: 10px 0; border-bottom: 1px dotted rgba(62,32,56,0.18); font-size: 15px; font-weight: 300; color: #4A2C44; }
.gr-cold-row .gr-addon-price { text-align: right; }
.gr-cold-row-last { border-bottom: none; }
.gr-tea-list { font-size: 16px; font-weight: 300; color: #4A2C44; line-height: 1.9; }

/* ---------- Farmstand / Farmstop ---------- */
.gr-farmstand { background: #F2EDE3; padding: 80px 0; border-top: 1px solid rgba(62,32,56,0.08); border-bottom: 1px solid rgba(62,32,56,0.08); }
.gr-farmstand-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 56px; align-items: start; }
.gr-farmstand-photo { height: 720px; border-radius: 8px 8px 200px 200px; overflow: hidden; background: #E6DECF; }
.gr-rule-sm { width: 34px; }
.gr-grown-by { padding-top: 34px; border-top: 1px solid rgba(62,32,56,0.14); }
.gr-grown-by .gr-eyebrow-row { margin-bottom: 26px; }
.gr-grown-by-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.gr-grown-by-card {
  display: block; background: #FBF7F1; border: 1px solid rgba(62,32,56,0.12);
  border-radius: 10px; padding: 24px 26px;
  transition: border-color 160ms ease, background-color 160ms ease;
}
.gr-grown-by-card:hover { border-color: rgba(125,139,106,0.55); background: #FDFBF7; }
.gr-grown-by-name { font-family: 'Cormorant Garamond', serif; font-size: 25px; color: #3E2038; line-height: 1.15; }
.gr-grown-by-url { font-size: 13px; font-weight: 300; color: #5E4457; margin-top: 8px; }
.gr-grown-by-link { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: #A9812F; margin-top: 16px; }

/* ---------- Cake shop teaser ---------- */
.gr-cakes-wrap { padding: 80px 40px 0; }
.gr-cake-panel { position: relative; border: 1px solid rgba(62,32,56,0.14); border-radius: 10px; overflow: hidden; background: #FBF7F1; align-items: stretch; min-height: 480px; }
.gr-cake-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); }
.gr-cake-copy { padding: 64px 60px; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.gr-cake-photo { position: relative; background: #EFE7DA; min-width: 0; min-height: 480px; overflow: hidden; }
.gr-cake-photo .gr-photo { position: absolute; inset: 0; }
.gr-cake-photo-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: #FBF7F1; }
.gr-cake-photo-cell { position: relative; min-width: 0; overflow: hidden; background: #EFE7DA; }
.gr-rule-green { background: #7D8B6A; }
.gr-eyebrow-open { color: #5A6A4A; }
.gr-cake-lede { margin-bottom: 30px; max-width: 44ch; }
.gr-btn-call { padding: 15px 26px; gap: 10px; }
.gr-btn-call:hover { background: #5A3352; color: #FBF7F1; }
.gr-nowrap { white-space: nowrap; }
.gr-cake-lead-note { font-size: 13px; color: #6D5566; font-weight: 300; }
.gr-photo-cake-hearts { object-position: center 45%; }
.gr-cake-builder { margin-top: 28px; border: 1px solid rgba(62,32,56,0.14); border-radius: 10px; background: #FBF7F1; padding: 52px 60px; }
.gr-cake-builder-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; margin-bottom: 38px; }
.gr-cake-builder-title { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: clamp(30px,3vw,42px); line-height: 1.05; margin: 14px 0 0; color: #3E2038; }
.gr-cake-builder-note { font-size: 14px; line-height: 1.65; color: #6D5566; font-weight: 300; margin: 0; max-width: 40ch; text-wrap: pretty; }
.gr-cake-cols { display: grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap: 36px 44px; }
.gr-cake-col-head { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: #7D8B6A; padding-bottom: 14px; border-bottom: 1px solid rgba(62,32,56,0.14); margin-bottom: 6px; }
.gr-cake-item { padding: 9px 0; border-bottom: 1px dotted rgba(62,32,56,0.16); font-size: 15px; font-weight: 300; color: #4A2C44; line-height: 1.45; }
.gr-cake-note { color: #8D7686; }
.gr-cake-order { margin-top: 44px; padding: 26px 30px; border-radius: 8px; background: #3E2038; color: #F5EDE1; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.gr-cake-order-title { font-family: 'Cormorant Garamond', serif; font-size: 27px; line-height: 1.2; }
.gr-cake-order-sub { font-size: 14px; font-weight: 300; color: rgba(245,237,225,0.72); margin-top: 6px; }
.gr-cake-order-sub strong { font-weight: 500; color: #E3C27A; }
.gr-cake-order-tel { font-family: 'Cormorant Garamond', serif; font-size: 30px; color: #E3C27A; white-space: nowrap; transition: color 160ms ease; }
.gr-cake-order-tel:hover { color: #F5EDE1; }

/* ---------- Gallery ---------- */
.gr-gallery-wrap { padding: 80px 40px 0; }
.gr-gallery-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-rows: 240px; grid-auto-flow: dense; gap: 16px; }
.gr-gal-cell, .gr-gal-2x2, .gr-gal-1x2, .gr-gal-2x1 { border-radius: 8px; overflow: hidden; background: #EFE7DA; }
.gr-gal-2x2 { grid-column: span 2; grid-row: span 2; }
.gr-gal-1x2 { grid-row: span 2; }
.gr-gal-2x1 { grid-column: span 2; }

/* ---------- In-the-case banner ---------- */
.gr-case-banner { margin-top: 80px; position: relative; height: 420px; overflow: hidden; background: #3E2038; }
.gr-case-photo { object-position: center 40%; }
.gr-case-overlay { position: absolute; inset: auto 0 0 0; padding: 56px 40px 40px; background: linear-gradient(to top, rgba(35,16,24,0.82), rgba(35,16,24,0)); }
.gr-case-title { font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(30px,3.2vw,46px); line-height: 1.1; color: #F5EDE1; margin-top: 12px; }

/* ---------- Visit ---------- */
#visit.gr-wrap.gr-visit-grid { padding: 80px 40px; }
.gr-visit-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 60px; align-items: start; }
.gr-hours-row { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid rgba(62,32,56,0.10); font-size: 16px; font-weight: 300; }
.gr-hours-row-last { border-bottom: none; }
.gr-hours-row span:first-child { letter-spacing: 0.04em; }
.gr-hours-val { color: #5E4457; }
.gr-hours-closed { color: #8D7686; }
.gr-contact-grid { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gr-contact-label { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #8D7686; margin-bottom: 10px; }
.gr-contact-val { font-size: 16px; line-height: 1.6; font-weight: 300; color: #4A2C44; }
.gr-tel { color: #4A2C44; }
.gr-tel:hover { color: #A9812F; }
.gr-visit-photo-wrap { display: grid; gap: 20px; }
.gr-visit-photo { height: 340px; border-radius: 8px 8px 160px 160px; overflow: hidden; background: #EFE7DA; }

/* ---------- Footer ---------- */
.gr-footer { background: #F2EDE3; border-top: 1px solid rgba(62,32,56,0.10); padding: 48px 0 32px; }
.gr-footer-flex { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; flex-wrap: wrap; }
.gr-footer-lockup { height: 132px; width: auto; }
.gr-footer-social { margin-top: 18px; }
.gr-footer-cols { display: flex; gap: 56px; flex-wrap: wrap; }
.gr-footer-col { display: grid; gap: 12px; font-size: 14px; font-weight: 300; }
.gr-footer-label { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #8D7686; }
.gr-footer-bottom { margin: 28px auto 0; padding: 20px 40px 0; border-top: 1px solid rgba(62,32,56,0.10); display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; font-size: 12px; letter-spacing: 0.08em; color: #8D7686; font-weight: 300; }
.gr-soon-inline { color: #A9812F; }

/* ---------- Events page ---------- */
.gr-nav a[aria-current="page"] { color: #A9812F; }
.gr-events-intro { padding-top: 72px; padding-bottom: 8px; }
.gr-events-title { font-size: clamp(40px,5vw,72px); margin: 0 0 20px; }
.gr-events-empty { font-size: 15px; font-weight: 300; color: #8D7686; margin: 8px 0 56px; }
.gr-events-empty a { color: #3E2038; border-bottom: 1px solid rgba(62,32,56,0.3); }
.gr-events-empty a:hover { color: #A9812F; }
.gr-events-list { padding-top: 40px; padding-bottom: 96px; display: grid; gap: 28px; }
.gr-event { border: 1px solid rgba(62,32,56,0.14); border-radius: 10px; overflow: hidden; background: #FBF7F1; }
/* the broom lies horizontally across the photo — a wide banner keeps the whole thing in frame */
.gr-event-banner { aspect-ratio: 21 / 9; background: #8E8C88; overflow: hidden; }
.gr-event-banner .gr-photo { object-position: center 55%; }
.gr-event-main { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 56px; padding: 52px 56px 56px; align-items: start; }
.gr-event-copy .gr-eyebrow-row { margin-bottom: 22px; }
.gr-event-name { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: clamp(34px,3.6vw,52px); line-height: 1.05; margin: 0; color: #3E2038; text-wrap: balance; }
.gr-event-host { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 23px; color: #7D8B6A; margin: 8px 0 26px; }
.gr-event-text { font-size: 16px; line-height: 1.75; color: #5E4457; font-weight: 300; margin: 0 0 14px; max-width: 58ch; text-wrap: pretty; }

.gr-event-card { background: #3E2038; color: #F5EDE1; border-radius: 10px; padding: 34px 32px 30px; margin-top: -120px; position: relative; box-shadow: 0 18px 40px -24px rgba(35,16,24,0.55); }
.gr-event-date { display: flex; align-items: center; gap: 16px; }
.gr-event-day { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 76px; line-height: 0.9; color: #E3C27A; }
.gr-event-month { font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; line-height: 1.7; color: #F5EDE1; }
.gr-event-month span { color: rgba(245,237,225,0.6); }
.gr-event-time { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 28px; margin: 14px 0 22px; padding-bottom: 22px; border-bottom: 1px solid rgba(245,237,225,0.16); }
.gr-event-facts { margin: 0 0 26px; padding: 0; }
.gr-event-facts > div { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 14px; padding: 10px 0; }
.gr-event-facts dt { font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: #C9A24E; padding-top: 4px; }
.gr-event-facts dd { margin: 0; font-size: 15px; font-weight: 300; color: rgba(245,237,225,0.86); line-height: 1.5; }
.gr-event-rsvp { display: flex; justify-content: center; align-items: center; gap: 10px; background: #E3C27A; color: #231018; padding: 16px 24px; border-radius: 999px; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500; transition: background-color 160ms ease; }
.gr-event-rsvp:hover { background: #F5EDE1; color: #231018; }
.gr-event-questions { margin-top: 14px; text-align: center; font-size: 13px; font-weight: 300; color: rgba(245,237,225,0.6); }
.gr-event-questions a { color: #F5EDE1; }
.gr-event-questions a:hover { color: #E3C27A; }

/* Private event rental */
.gr-rental { background: #F3ECE0; padding: 96px 0 104px; }
.gr-rental-head { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 56px; align-items: end; margin-bottom: 40px; }
.gr-rental-head .gr-h2 { margin-bottom: 0; }
.gr-rental-head .gr-p { margin: 0; }
.gr-rental-gallery { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)) minmax(0,0.85fr); grid-template-rows: 340px 210px; gap: 12px; }
.gr-rental-shot { margin: 0; border-radius: 10px; overflow: hidden; background: #8E8C88; }
.gr-rental-shot-hero { grid-column: 1 / 4; }
.gr-rental-shot-hero .gr-photo { object-position: center 60%; }
.gr-rental-shot-tall { grid-column: 4; grid-row: 1 / 3; }
.gr-rental-shot-tall .gr-photo { object-position: 60% center; }
.gr-rental-main { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 56px; margin-top: 56px; align-items: start; }
.gr-rental-sub { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: 30px; color: #3E2038; margin: 0 0 18px; }
.gr-rental-sub + .gr-event-text { margin-top: -6px; }
.gr-rental-tags { list-style: none; margin: 0 0 44px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.gr-rental-tags li { border: 1px solid rgba(62,32,56,0.2); border-radius: 999px; padding: 9px 18px; font-size: 14px; color: #3E2038; background: #FBF7F1; }
.gr-rental-addons { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.gr-rental-addons li { padding: 16px 0; border-top: 1px solid rgba(62,32,56,0.14); }
.gr-rental-addon-name { display: block; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 23px; color: #3E2038; }
.gr-rental-addon-note { display: block; font-size: 14px; font-weight: 300; color: #5E4457; margin-top: 2px; }
.gr-rental-card { margin-top: 0; }
.gr-rental-price { display: flex; align-items: center; gap: 14px; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 980px) {
  .gr-sourcing-stats { grid-template-columns: 1fr 1fr !important; row-gap: 36px !important; }
}

@media (max-width: 900px) {
  .gr-nav-toggle { display: flex; }
  .gr-nav {
    display: none;
    flex-direction: column; align-items: flex-start; gap: 6px;
    width: 100%; order: 3; padding: 16px 0 20px;
    border-top: 1px solid rgba(62,32,56,0.10);
  }
  .gr-nav.gr-nav-open { display: flex; }
  .gr-nav a { display: block; width: 100%; padding: 9px 0; }
  .gr-social { width: 44px; height: 44px; }
  .gr-nav-toggle { order: 2; }
  .gr-header-actions { order: 1; }

  /* dome-shaped photo containers clip their caption at narrow widths — soften the curve */
  .gr-hero-image, .gr-farmstand-photo, .gr-visit-photo { border-radius: 16px !important; }

  /* header rows that pair a label with a note/status squeeze awkwardly on narrow screens — stack them */
  .gr-menu-group-head { flex-wrap: wrap; row-gap: 4px; }
  .gr-kicker-note { flex-basis: 100%; }
  .gr-board-head { flex-wrap: wrap; row-gap: 10px; }
  .gr-board-status { flex-basis: 100%; }

  .gr-hero-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .gr-hero-image { height: 420px !important; }
  .gr-hero { padding: 32px 24px 0 !important; }

  .gr-story { padding: 56px 24px !important; }
  .gr-story-grid { grid-template-columns: 1fr !important; gap: 36px !important; }

  .gr-sourcing { padding: 48px 0 0 !important; }
  .gr-sourcing-stats { padding: 40px 24px 48px !important; gap: 32px !important; }
  .gr-farm-arrow { width: 38px; height: 38px; font-size: 15px; }
  .gr-farm-prev { left: -8px; }
  .gr-farm-next { right: -8px; }

  .gr-section-pad { padding: 52px 24px !important; }
  .gr-wrap { padding-left: 24px; padding-right: 24px; }
  .gr-header-inner { padding: 0 20px; }

  .gr-menu-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .gr-menu-grid > div + div { margin-top: 40px; }
  .gr-weekday { margin-top: 52px !important; padding: 32px 24px !important; }
  .gr-weekday-grid { grid-template-columns: 1fr !important; gap: 0 !important; }

  .gr-bakery-split { grid-template-columns: 1fr !important; gap: 32px !important; }
  .gr-bakery-divider { flex-direction: row; padding-top: 0; gap: 14px; }
  .gr-bakery-divider-line { width: auto; height: 1px; }
  .gr-bakery-divider-line-top { background: linear-gradient(to right, rgba(62,32,56,0), rgba(62,32,56,0.16)); }
  .gr-bakery-divider-line-bottom { background: linear-gradient(to left, rgba(62,32,56,0), rgba(62,32,56,0.16)); }
  .gr-bakery-photo-split { height: 260px; }
  /* the desktop zoom crops the plate on narrow screens — show the whole plate instead */
  .gr-photo-cinnamon { transform: none; object-position: 8% 100%; }

  /* keep the desktop card proportions so farm photos are not cropped into a thin strip */
  .gr-farm-card { height: auto; aspect-ratio: 13 / 10; }
  .gr-grown-by-grid { grid-template-columns: 1fr !important; }

  .gr-coffee { padding: 52px 0 !important; }
  .gr-coffee-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .gr-coffee-grid > div + div { margin-top: 36px; }
  .gr-tea-grid { grid-template-columns: 1fr !important; gap: 28px !important; border-top: none; padding-top: 0; margin-top: 40px; }

  .gr-farmstand { padding: 52px 0 !important; }
  .gr-farmstand-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
  .gr-farmstand-photo { height: 360px !important; }

  .gr-cakes-wrap { padding: 52px 24px 0 !important; }
  .gr-events-intro { padding-top: 44px; }
  .gr-events-list { padding-top: 28px; padding-bottom: 60px; }
  .gr-event-banner { aspect-ratio: 16 / 9; }
  .gr-event-main { grid-template-columns: 1fr; gap: 32px; padding: 32px 24px 28px; }
  .gr-event-card { margin-top: 0; }
  .gr-rental { padding: 64px 0 72px; }
  .gr-rental-head { grid-template-columns: 1fr; gap: 0; margin-bottom: 28px; }
  .gr-rental-head .gr-h2 { margin-bottom: 18px; }
  .gr-rental-gallery { grid-template-columns: repeat(2, minmax(0,1fr)); grid-template-rows: auto; }
  .gr-rental-gallery .gr-rental-shot { aspect-ratio: 4 / 3; }
  .gr-rental-shot-hero { grid-column: 1 / -1; aspect-ratio: 16 / 9 !important; }
  .gr-rental-shot-tall { grid-column: auto; grid-row: span 2; aspect-ratio: auto !important; position: relative; }
  .gr-rental-shot-tall .gr-photo { position: absolute; inset: 0; }
  .gr-rental-shot:last-child { grid-column: 1 / -1; aspect-ratio: 16 / 9 !important; }
  .gr-rental-main { grid-template-columns: 1fr; gap: 36px; margin-top: 40px; }
  .gr-cake-grid { grid-template-columns: 1fr !important; }
  .gr-cake-copy { padding: 36px 28px !important; }
  .gr-cake-photo { min-height: 280px !important; }
  .gr-cake-builder { padding: 36px 28px !important; }
  .gr-cake-order-title { font-size: 23px !important; }
  .gr-cake-order-tel { font-size: 26px !important; }

  .gr-gallery-wrap { padding: 52px 24px 0 !important; }
  .gr-gallery-grid { grid-template-columns: 1fr 1fr !important; grid-auto-rows: 200px !important; }

  #visit.gr-wrap.gr-visit-grid { padding: 52px 24px !important; }
  .gr-visit-grid { grid-template-columns: 1fr !important; gap: 32px !important; }

  .gr-breakfast { padding: 52px 0 !important; }
  .gr-dish-strip { margin-top: 40px !important; gap: 12px; }
  .gr-dish-photo { height: 260px !important; }

  .gr-case-banner { margin-top: 52px !important; height: 320px !important; }
  .gr-case-banner { height: 360px !important; }
  .gr-case-overlay { inset: 0 !important; display: flex; flex-direction: column; justify-content: flex-end; padding: 40px 24px 28px !important; background: linear-gradient(to top, rgba(35,16,24,0.9) 0%, rgba(35,16,24,0.55) 60%, rgba(35,16,24,0.2) 100%) !important; }
  .gr-case-title { font-size: 28px !important; }
  .gr-br-desktop { display: none; }
  .gr-btn-call { flex-wrap: wrap; justify-content: center; text-align: center; column-gap: 6px; row-gap: 2px; letter-spacing: 0.14em; }
}

@media (max-width: 560px) {
  .gr-story-collage { grid-template-columns: 1fr 1fr !important; grid-template-rows: 150px 150px !important; }
  .gr-fact-grid { grid-template-columns: 1fr !important; }
  .gr-sourcing-stats { grid-template-columns: 1fr !important; }
  .gr-contact-grid { grid-template-columns: 1fr !important; }
  .gr-price-head, .gr-price-row { grid-template-columns: minmax(0,1fr) 50px 50px !important; gap: 10px !important; }
  .gr-footer-flex { align-items: flex-start !important; }
  .gr-gallery-grid { grid-auto-rows: 150px !important; gap: 10px !important; }

  .gr-h1 { font-size: clamp(46px, 12.5vw, 60px); line-height: 1; }
  .gr-hero .gr-cta-row { flex-direction: column; align-items: stretch; }
  .gr-hero .gr-btn-primary, .gr-hero .gr-btn-outline { justify-content: center; }
  .gr-event-banner { aspect-ratio: 3 / 2; }
  .gr-event-main { padding: 28px 20px 24px; }
  .gr-event-card { padding: 28px 22px 24px; }
  .gr-rental-gallery { gap: 8px; }
  .gr-rental-addons { grid-template-columns: 1fr; }

  .gr-hours-row { font-size: 15px; gap: 12px; }
  .gr-hours-row span:first-child { letter-spacing: 0.01em; }
  .gr-hours-row span:last-child { white-space: nowrap; }

  /* one photo per row, tall enough to show the whole plate */
  .gr-dish-strip { grid-template-columns: 1fr !important; gap: 16px; }
  .gr-dish-photo { height: auto !important; width: 100%; }
  .gr-dish-photo .gr-photo { width: 100%; height: auto; aspect-ratio: 5 / 4; }
  /* the plate sits left in this photo — zoom a touch from the left edge to center it */
  .gr-photo-omelette { transform: scale(1.08); transform-origin: 0 50%; }

  /* portrait photo — a taller frame keeps the baker and the cake in view */
  .gr-cake-photo { min-height: 0 !important; width: 100%; }
  .gr-cake-photo .gr-photo { position: static; width: 100%; height: auto; aspect-ratio: 4 / 5; }

  .gr-weekday { padding: 28px 20px !important; }
  .gr-weekday-eyebrow { font-size: 10px; letter-spacing: 0.16em; white-space: nowrap; }
}
