/* ---- sundowner (Sundowner — Bar supplies 64) --------------------------------
   THE STRUCTURAL MOVE: after the photograph, nothing breaks its container
   again. .sc-show-grid ships full-bleed with a checkerboard of tinted panels;
   here it is caged to the same 1080px measure as every other block and the
   tint is stripped back to a single hairline, so the showcase becomes one more
   rectangle in a stack of identical rectangles held on one centre axis. The
   two catalogue runs then SPLIT the range rather than repeating it — the
   showcase takes the first four, the buy grid the last four — which is what
   keeps the ledger honest at 6 / 4 / 4 with no tile appearing twice.
   Ground is bone white top to bottom; all the darkness lives in the pictures.
   One brass ink, kept for the hero outline, the category labels, the price
   tick and the rule above the form. The bar is static and centred: wordmark in
   the middle with the links split either side of it.
   (Chrome selectors are .sf-header / .sf-footer — .sf-head / .sf-foot match
   nothing in the storefront markup.) */

/* DAY */
body.t-sundowner {
  --sf-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  background: #f6f3ee;
  color: #4a443c;
  --radius: 0;
  --bg-flat: #f6f3ee;
  --header-bg: #f6f3ee;
  --surface: #fdfbf7;
  --surface-2: #ede8e0;
  --line: #e2dcd2;
  --line-strong: #cec6b8;
  --heading: #141210;
  --text: #4a443c;
  --muted: #8a8175;
}
/* a hairline on the same ground as the page — no glass, no shrink, no sticking */
body.t-sundowner .sf-header, body.t-sundowner .sf-footer { position: static; background: #f6f3ee; border-color: var(--line); backdrop-filter: none; -webkit-backdrop-filter: none; }
/* wordmark dead centre, links split evenly left and right of it */
body.t-sundowner .sf-header .container { gap: clamp(12px, 2.4vw, 28px); }
body.t-sundowner .sf-name { font-family: var(--sf-serif); font-weight: 400; font-size: 23px; letter-spacing: 0.01em; }
/* nothing is sticky any more, so the anchor offset would only open a gap */
body.t-sundowner .sc-hero, body.t-sundowner .sc-richtext, body.t-sundowner .sc-strip,
body.t-sundowner .sc-showcase, body.t-sundowner .sc-buygrid, body.t-sundowner .sc-contact { scroll-margin-top: 0; }

/* the one moment that touches the edges */
body.t-sundowner .sc-hero { min-height: 100vh; padding: 0 20px; }
body.t-sundowner .sc-hero h1 { font-family: var(--sf-serif); font-weight: 400; font-size: clamp(54px, 11vw, 136px); line-height: 0.94; letter-spacing: -0.03em; margin: 0 0 20px; }
body.t-sundowner .sc-hero p { text-transform: uppercase; letter-spacing: 0.24em; font-size: 11px; font-weight: 600; line-height: 2; max-width: 40ch; margin: 0 auto 36px; }
body.t-sundowner .sc-hero .btn.brand.sc-hero-ghost { border-width: 1px; border-color: rgba(168, 120, 60, 0.95); padding: 15px 34px; }

/* every label on the page is small letter-spaced caps; every statement is serif */
body.t-sundowner .sf-navlink, body.t-sundowner .sc-strip-label,
body.t-sundowner .sc-show-cat, body.t-sundowner .sc-buy-cat { text-transform: uppercase; letter-spacing: 0.22em; font-size: 10.5px; font-weight: 600; }
body.t-sundowner .sc-h2 { text-transform: uppercase; letter-spacing: 0.26em; font-size: 11px; font-weight: 600; color: var(--muted); margin: 0 0 40px; }
/* equal, generous padding between every block, so they read as one stack */
body.t-sundowner .sc-strip, body.t-sundowner .sc-buygrid, body.t-sundowner .sc-showcase > .container { padding: 96px 20px 0; }

/* the two lone centred paragraphs — the page's whole idea of punctuation */
body.t-sundowner .sc-richtext { max-width: 560px; padding: 104px 20px 96px; }
body.t-sundowner .sc-richtext h2, body.t-sundowner .sc-contact h2 { font-family: var(--sf-serif); font-weight: 400; text-transform: none; letter-spacing: -0.01em; font-size: clamp(25px, 3.2vw, 35px); line-height: 1.24; color: var(--heading); margin: 0 0 18px; }

/* THE MOVE — the showcase gives up its full bleed and its checkerboard */
body.t-sundowner .sc-show-grid { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
body.t-sundowner .sc-show-grid .sc-show-item { background: transparent; border-top: 1px solid var(--line); }
body.t-sundowner .sc-show-t, body.t-sundowner .sc-show-price { font-family: var(--sf-serif); font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--heading); }
body.t-sundowner .sc-show-rule { background: #a8783c; opacity: 1; width: 24px; height: 1px; }
/* the two runs split the range: first four in the glass, last four around it */
body.t-sundowner .sc-show-grid .sc-show-item:nth-child(n + 5),
body.t-sundowner .sc-buy-grid .sc-buy-card:nth-child(-n + 4) { display: none; }
body.t-sundowner .sc-buy-grid { grid-template-columns: repeat(4, 1fr); gap: 44px 26px; }

body.t-sundowner .btn.brand { background: var(--heading); border-color: var(--heading); color: #f6f3ee; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: 0.18em; font-size: 10.5px; font-weight: 600; padding: 14px 28px; }
body.t-sundowner .btn.brand:hover { background: #a8783c; border-color: #a8783c; color: #f6f3ee; }
/* the page ends on the axis it has held the whole way down */
body.t-sundowner .sc-contact { max-width: 560px; margin-top: 100px; border-top: 1px solid #d9c2a0; padding: 76px 20px 120px; }
body.t-sundowner .sc-contact-form .btn { align-self: center; }
@media (max-width: 900px) { body.t-sundowner .sc-buy-grid { grid-template-columns: repeat(2, 1fr); } }

/* NIGHT — the bone ground goes to unlit bar timber and the brass lifts a
   stop so the hairline above the form and the button fill both survive it */
html[data-theme="dark"] body.t-sundowner {
  background: #121110;
  color: #c4bdb2;
  --bg-flat: #121110;
  --header-bg: #121110;
  --surface: #1a1816;
  --surface-2: #201d1a;
  --line: #2a2724;
  --line-strong: #3a3632;
  --heading: #f2eee7;
  --text: #c4bdb2;
  --muted: #8a8278;
}
html[data-theme="dark"] body.t-sundowner .sf-header, html[data-theme="dark"] body.t-sundowner .sf-footer { background: #121110; border-color: #2a2724; }
html[data-theme="dark"] body.t-sundowner .sc-contact { border-top-color: #6b4d27; }
html[data-theme="dark"] body.t-sundowner .btn.brand { background: #e6dfd4; border-color: #e6dfd4; color: #121110; }
html[data-theme="dark"] body.t-sundowner .btn.brand:hover { background: #c99a58; border-color: #c99a58; color: #121110; }
html[data-theme="dark"] body.t-sundowner .sc-field input, html[data-theme="dark"] body.t-sundowner .sc-field textarea { background: #1a1816; border-color: #2a2724; color: #f2eee7; }
