/*
Theme Name: Build the Bottle
Theme URI: https://buildthebottle.com/
Description: A warm, distillery-inspired recipe & craft-beverage theme for Build the Bottle. Bottle-green and whiskey-amber palette, "bottle-label" spec stamps, built-in search, SEO meta + JSON-LD schema, tags, and family-of-brands ad banners on every page and post. Built from scratch — no page builder required.
Author: Build the Bottle
Author URI: https://buildthebottle.com/
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: buildthebottle
Tags: blog, recipe, food-and-drink, custom-menu, featured-images, threaded-comments, translation-ready, two-columns, right-sidebar
*/

/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */
:root{
  /* Core palette — bottle glass + whiskey */
  --bottle:      #15271C;   /* deep bottle green, the "ink" */
  --bottle-2:    #1E3527;   /* raised green panel */
  --bottle-3:    #284635;   /* hover green */
  --amber:       #C77A1E;   /* whiskey amber — accent, buttons, large text */
  --amber-deep:  #9C5510;   /* contrast-safe amber for body links on light */
  --brass:       #C9A24A;   /* fine lines + eyebrows on dark */
  --clay:        #9B4A2C;   /* secondary accent (tags) */
  --paper:       #F4EEE2;   /* oat paper background */
  --paper-2:     #ECE3D2;   /* deeper oat, alt sections */
  --cream:       #FCF8F1;   /* card surface */
  --ink-soft:    #5E5648;   /* muted text on light */
  --line:        rgba(21,39,28,.14);
  --line-strong: rgba(21,39,28,.26);
  --cream-dim:   rgba(244,238,226,.74);  /* muted text on dark */
  --brass-line:  rgba(201,162,74,.40);

  /* Type */
  --f-display: "Fraunces", Georgia, "Times New Roman", serif;
  --f-label:   "Oswald", "Arial Narrow", Arial, sans-serif;
  --f-body:    "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  /* Rhythm */
  --wrap: 1180px;
  --wrap-narrow: 760px;
  --gutter: clamp(18px, 4vw, 40px);
  --radius: 14px;
  --radius-sm: 8px;
  --shadow: 0 1px 2px rgba(21,39,28,.06), 0 18px 40px -24px rgba(21,39,28,.45);
  --shadow-lift: 0 1px 2px rgba(21,39,28,.06), 0 30px 60px -28px rgba(21,39,28,.55);
}

/* ============================================================
   2. RESET / BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  background:var(--paper);
  color:var(--bottle);
  font-family:var(--f-body);
  font-size:18px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--amber-deep);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--brass)}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;line-height:1.1;color:var(--bottle);margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,5vw,3.4rem)}
h2{font-size:clamp(1.6rem,3.4vw,2.3rem)}
h3{font-size:clamp(1.25rem,2.3vw,1.6rem)}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.1em;padding-left:1.3em}
hr{border:0;border-top:1px solid var(--line);margin:2.4rem 0}
::selection{background:var(--amber);color:#fff}

/* Accessibility */
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:3px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--bottle);color:var(--paper);
  padding:.7em 1.2em;font-family:var(--f-label);letter-spacing:.12em;text-transform:uppercase;font-size:.8rem}
.skip-link:focus{left:8px;top:8px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}

/* Layout helpers */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(48px,7vw,90px)}
.section--alt{background:var(--paper-2)}

/* Eyebrow / label voice — the "stamped on the bottle" device */
.eyebrow{
  font-family:var(--f-label);font-weight:500;text-transform:uppercase;
  letter-spacing:.22em;font-size:.74rem;color:var(--amber-deep);
  display:inline-flex;align-items:center;gap:.6em;margin:0 0 1rem;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--brass);display:inline-block}
.eyebrow--center{justify-content:center}
.eyebrow--center::after{content:"";width:26px;height:1px;background:var(--brass);display:inline-block}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.55em;cursor:pointer;
  font-family:var(--f-label);font-weight:500;text-transform:uppercase;letter-spacing:.13em;
  font-size:.82rem;line-height:1;padding:.95em 1.6em;border-radius:999px;border:1.5px solid transparent;
  transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
  text-decoration:none;
}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn--amber{background:var(--amber);color:#fff;box-shadow:0 10px 24px -12px rgba(199,122,30,.9)}
.btn--amber:hover{background:#b56a14;color:#fff}
.btn--ghost{background:transparent;color:var(--bottle);border-color:var(--line-strong)}
.btn--ghost:hover{border-color:var(--bottle);color:var(--bottle)}
.btn--on-dark{background:transparent;color:var(--paper);border-color:var(--brass-line)}
.btn--on-dark:hover{background:var(--amber);border-color:var(--amber);color:#fff}

/* ============================================================
   3. SITE HEADER + NAV
   ============================================================ */
.site-header{position:sticky;top:0;z-index:60;background:var(--bottle);
  border-bottom:1px solid rgba(201,162,74,.22)}
.header-bar{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  min-height:70px;padding-block:.6rem}
.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--paper)}
.brand:hover{text-decoration:none}
.brand .cap{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--amber), #8a4f10);color:#fff;
  font-family:var(--f-display);font-weight:600;font-size:.95rem;box-shadow:inset 0 0 0 2px rgba(255,255,255,.18)}
.brand .wordmark{font-family:var(--f-display);font-weight:600;font-size:1.32rem;line-height:1;color:var(--paper);letter-spacing:-.01em}
.brand .wordmark b{color:var(--brass);font-weight:600}
.brand img{max-height:40px;width:auto}

.primary-nav{display:flex;align-items:center;gap:1.5rem}
.primary-nav ul{display:flex;align-items:center;gap:1.4rem;list-style:none;margin:0;padding:0}
.primary-nav a{font-family:var(--f-label);font-weight:400;text-transform:uppercase;letter-spacing:.13em;
  font-size:.82rem;color:var(--cream-dim);padding-block:.4rem;position:relative}
.primary-nav a:hover{color:var(--paper);text-decoration:none}
.primary-nav .current-menu-item>a,.primary-nav .current_page_item>a{color:var(--brass)}
.primary-nav li{position:relative}
.primary-nav .sub-menu{position:absolute;top:100%;left:-1rem;min-width:200px;background:var(--bottle-2);
  border:1px solid rgba(201,162,74,.22);border-radius:var(--radius-sm);padding:.5rem;display:none;
  flex-direction:column;gap:.1rem;box-shadow:var(--shadow);z-index:70}
.primary-nav li:hover>.sub-menu,.primary-nav li:focus-within>.sub-menu{display:flex}
.primary-nav .sub-menu a{padding:.5rem .8rem;border-radius:6px;font-size:.78rem}
.primary-nav .sub-menu a:hover{background:var(--bottle-3);color:var(--paper)}

.header-tools{display:flex;align-items:center;gap:.8rem}
.icon-btn{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:transparent;
  border:1px solid rgba(201,162,74,.28);color:var(--paper);cursor:pointer;transition:background .18s,border-color .18s}
.icon-btn:hover{background:var(--bottle-2);border-color:var(--brass)}
.icon-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.nav-toggle{display:none}

/* Search drawer */
.search-drawer{background:var(--bottle-2);border-bottom:1px solid rgba(201,162,74,.22);
  max-height:0;overflow:hidden;transition:max-height .32s ease}
.search-drawer.open{max-height:140px}
.search-drawer .wrap{padding-block:1.1rem}
.search-form{display:flex;gap:.6rem;align-items:stretch}
.search-form label{flex:1}
.search-form .search-field{width:100%;background:var(--bottle);color:var(--paper);border:1px solid rgba(201,162,74,.3);
  border-radius:999px;padding:.85em 1.3em;font-family:var(--f-body);font-size:1rem}
.search-form .search-field::placeholder{color:rgba(244,238,226,.5)}
.search-form .search-field:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(199,122,30,.25)}
.search-form .search-submit{flex:none;background:var(--amber);color:#fff;border:0;border-radius:999px;
  padding:.85em 1.6em;font-family:var(--f-label);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;cursor:pointer}
.search-form .search-submit:hover{background:#b56a14}

/* ============================================================
   4. SPEC STAMP (signature element)  CATEGORY · DATE · READ
   ============================================================ */
.spec{font-family:var(--f-label);font-weight:400;text-transform:uppercase;letter-spacing:.16em;
  font-size:.72rem;color:var(--ink-soft);display:inline-flex;flex-wrap:wrap;align-items:center;gap:.7em}
.spec .dot{width:4px;height:4px;border-radius:50%;background:var(--brass);display:inline-block}
.spec .cat{color:var(--amber-deep)}
.spec--on-dark{color:var(--cream-dim)}
.spec--on-dark .cat{color:var(--brass)}

/* ============================================================
   5. HERO (front page)
   ============================================================ */
.hero{position:relative;background:var(--bottle);color:var(--paper);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 90% at 85% 15%, rgba(199,122,30,.28), transparent 55%),
             radial-gradient(80% 70% at 10% 90%, rgba(40,70,53,.7), transparent 60%);
  pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;opacity:.05;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);
  align-items:center;padding-block:clamp(56px,8vw,104px)}
.hero-copy{max-width:560px}
.hero-copy .eyebrow{color:var(--brass)}
.hero-copy .eyebrow::before{background:var(--brass)}
.hero h1{color:var(--paper);font-size:clamp(2.6rem,6vw,4.4rem);line-height:1.02;margin-bottom:.4em}
.hero h1 em{font-style:italic;color:var(--amber)}
.hero-lead{font-size:1.15rem;color:var(--cream-dim);max-width:46ch;margin-bottom:1.8rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}

.hero-media{position:relative}
.hero-media .frame{position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid rgba(201,162,74,.3);box-shadow:var(--shadow-lift);aspect-ratio:4/5;background:var(--bottle-2)}
.hero-media .frame img{width:100%;height:100%;object-fit:cover}
.hero-media .label-strip{position:absolute;left:0;right:0;bottom:0;padding:1.1rem 1.2rem;
  background:linear-gradient(to top, rgba(21,39,28,.92), rgba(21,39,28,.3) 70%, transparent);
  color:var(--paper)}
.hero-media .label-strip h3{color:var(--paper);font-size:1.3rem;margin:.25rem 0 0}
.hero-media .label-strip a{color:var(--paper)}
.hero-media .label-strip a:hover{color:var(--amber);text-decoration:none}

/* Wax-seal badge */
.seal{position:absolute;top:-16px;right:-16px;width:84px;height:84px;border-radius:50%;z-index:2;
  background:radial-gradient(circle at 35% 30%, #b56a14, #7d4a0f);color:var(--paper);
  display:grid;place-items:center;text-align:center;transform:rotate(-8deg);
  box-shadow:0 12px 26px -10px rgba(21,39,28,.7), inset 0 0 0 2px rgba(255,255,255,.16)}
.seal span{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.6rem;line-height:1.15}
.seal b{display:block;font-family:var(--f-display);font-size:1.15rem;letter-spacing:0}

/* ============================================================
   6. SECTION HEADINGS
   ============================================================ */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:2.2rem}
.section-head .titles{max-width:46ch}
.section-head h2{margin:0}
.section-head p{margin:.5rem 0 0;color:var(--ink-soft);font-size:1.02rem}
.section-head .more-link{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.13em;
  font-size:.78rem;color:var(--amber-deep);white-space:nowrap;flex:none}
.section-head .more-link:hover{color:var(--bottle);text-decoration:none}

/* ============================================================
   7. RECIPE CARDS / GRID
   ============================================================ */
.recipe-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,34px)}
.recipe-grid.cols-2{grid-template-columns:repeat(2,1fr)}

.card{position:relative;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);border-color:var(--brass-line)}
.card-media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--paper-2)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .card-media img{transform:scale(1.05)}
.card-media .ph{position:absolute;inset:0;display:grid;place-items:center;
  background:repeating-linear-gradient(135deg,var(--paper-2),var(--paper-2) 12px,#e4dac6 12px,#e4dac6 24px)}
.card-media .ph svg{width:46px;height:46px;opacity:.5}
.card-tag{position:absolute;top:12px;left:12px;background:rgba(21,39,28,.86);color:var(--paper);
  font-family:var(--f-label);text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;
  padding:.4em .8em;border-radius:999px;backdrop-filter:blur(2px)}
.card-body{padding:1.2rem 1.25rem 1.4rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.card-body .spec{font-size:.68rem}
.card h3{margin:0;font-size:1.32rem;line-height:1.18}
.card h3 a{color:var(--bottle)}
.card h3 a:hover{color:var(--amber-deep);text-decoration:none}
.card .dek{color:var(--ink-soft);font-size:.96rem;margin:0;flex:1}
.card .read-more{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.13em;font-size:.74rem;
  color:var(--amber-deep);display:inline-flex;align-items:center;gap:.4em;margin-top:.3rem}
.card .read-more:hover{color:var(--bottle);text-decoration:none;gap:.7em}

/* Feature card (first item, wider) */
.recipe-grid .card--feature{grid-column:span 3;display:grid;grid-template-columns:1.1fr 1fr;align-items:stretch}
.recipe-grid .card--feature .card-media{aspect-ratio:auto;min-height:320px}
.recipe-grid .card--feature .card-body{justify-content:center;padding:clamp(1.4rem,3vw,2.6rem)}
.recipe-grid .card--feature h3{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.recipe-grid .card--feature .dek{font-size:1.05rem;flex:none}

/* ============================================================
   8. CATEGORY / TAG STRIP
   ============================================================ */
.taxo-strip{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.chip{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;
  padding:.55em 1.1em;border-radius:999px;border:1.5px solid var(--line-strong);color:var(--bottle);
  background:var(--cream);transition:background .16s,color .16s,border-color .16s}
.chip:hover{background:var(--bottle);color:var(--paper);border-color:var(--bottle);text-decoration:none}
.chip .count{opacity:.6;margin-left:.4em}

/* ============================================================
   9. SINGLE POST / PAGE
   ============================================================ */
.entry-header{padding-top:clamp(36px,5vw,64px);text-align:center}
.entry-header .spec{justify-content:center;margin-bottom:1rem}
.entry-header h1{max-width:18ch;margin-inline:auto;margin-bottom:.6rem}
.entry-header .lede{font-size:1.18rem;color:var(--ink-soft);max-width:62ch;margin:0 auto}
.entry-hero{margin:clamp(28px,4vw,48px) 0 0}
.entry-hero img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);aspect-ratio:16/9;object-fit:cover}
.entry-hero figcaption{font-size:.85rem;color:var(--ink-soft);text-align:center;margin-top:.7rem;font-style:italic}

.entry-content{margin-top:clamp(28px,4vw,44px);font-size:1.075rem}
.entry-content > *{max-width:var(--wrap-narrow);margin-inline:auto}
.entry-content h2{margin-top:2.2em}
.entry-content h3{margin-top:1.6em}
.entry-content p{margin-bottom:1.3em}
.entry-content a{color:var(--amber-deep);text-decoration:underline;text-decoration-color:var(--brass-line);text-underline-offset:3px}
.entry-content a:hover{text-decoration-color:var(--amber)}
.entry-content ul,.entry-content ol{margin-bottom:1.3em}
.entry-content li{margin-bottom:.45em}
.entry-content ul li::marker{color:var(--amber)}
.entry-content blockquote{margin:1.8em auto;padding:1.2em 1.6em;border-left:3px solid var(--amber);
  background:var(--cream);border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-family:var(--f-display);font-size:1.25rem;font-style:italic;color:var(--bottle)}
.entry-content blockquote p:last-child{margin-bottom:0}
.entry-content img{border-radius:var(--radius-sm);box-shadow:var(--shadow)}
.entry-content figure{margin:1.8em auto}
.entry-content figcaption{font-size:.85rem;color:var(--ink-soft);text-align:center;margin-top:.6rem}
.entry-content code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;
  background:var(--paper-2);padding:.15em .45em;border-radius:5px}
.entry-content pre{max-width:var(--wrap-narrow);margin:1.6em auto;background:var(--bottle);color:var(--paper);
  padding:1.2em 1.4em;border-radius:var(--radius-sm);overflow:auto}
.entry-content pre code{background:none;padding:0;color:inherit}
.entry-content table{width:100%;border-collapse:collapse;margin:1.6em auto;font-size:.96rem}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:.7em .9em;text-align:left}
.entry-content th{background:var(--paper-2);font-family:var(--f-label);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem}

/* WordPress core alignment + caption */
.alignleft{float:left;margin:.4em 1.6em 1em 0}
.alignright{float:right;margin:.4em 0 1em 1.6em}
.aligncenter{margin-left:auto;margin-right:auto;display:block}
.alignwide{max-width:min(1080px,92vw)!important}
.alignfull{max-width:100vw!important;width:100vw;margin-left:calc(50% - 50vw)}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:.85rem;color:var(--ink-soft);text-align:center;margin-top:.5rem;font-style:italic}
.sticky{}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.page-links{max-width:var(--wrap-narrow);margin:2rem auto;font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}

/* Tags + meta footer of post */
.entry-footer{max-width:var(--wrap-narrow);margin:clamp(36px,5vw,56px) auto 0;padding-top:1.8rem;border-top:1px solid var(--line)}
.tag-list{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem}
.tag-list .label{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;color:var(--ink-soft);margin-right:.3rem}
.tag-link{display:inline-block;font-family:var(--f-label);text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;
  padding:.4em .85em;border-radius:999px;background:var(--paper-2);color:var(--bottle);border:1px solid var(--line)}
.tag-link:hover{background:var(--clay);color:#fff;border-color:var(--clay);text-decoration:none}

.author-card{max-width:var(--wrap-narrow);margin:2.2rem auto 0;display:flex;gap:1.1rem;align-items:center;
  background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem 1.4rem}
.author-card .avatar{width:64px;height:64px;border-radius:50%;flex:none;overflow:hidden;background:var(--paper-2)}
.author-card .meta .name{font-family:var(--f-display);font-size:1.2rem;color:var(--bottle);margin:0}
.author-card .meta .bio{font-size:.95rem;color:var(--ink-soft);margin:.2rem 0 0}

/* Post navigation */
.post-nav{max-width:var(--wrap-narrow);margin:2.4rem auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.post-nav a{display:block;padding:1.1rem 1.3rem;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);transition:border-color .18s}
.post-nav a:hover{border-color:var(--brass);text-decoration:none}
.post-nav .dir{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.13em;font-size:.7rem;color:var(--amber-deep)}
.post-nav .ttl{font-family:var(--f-display);color:var(--bottle);font-size:1.08rem;margin-top:.3rem;display:block;line-height:1.25}
.post-nav .next{text-align:right}

/* ============================================================
   10. FAMILY-OF-BRANDS BANNERS (on every page & post)
   ============================================================ */
.brand-band{background:var(--bottle);color:var(--paper);position:relative;overflow:hidden}
.brand-band::before{content:"";position:absolute;inset:0;
  background:radial-gradient(90% 120% at 100% 0%, rgba(199,122,30,.18), transparent 60%);pointer-events:none}
.brand-band-inner{position:relative;padding-block:clamp(40px,6vw,68px)}
.brand-band .eyebrow{color:var(--brass);justify-content:center}
.brand-band .eyebrow::before,.brand-band .eyebrow--center::after{background:var(--brass)}
.brand-band > .wrap > .heading{text-align:center;margin-bottom:2rem}
.brand-band h2{color:var(--paper);margin:0}
.brand-cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,28px)}
.brand-card{display:flex;flex-direction:column;gap:.7rem;background:var(--bottle-2);
  border:1px solid rgba(201,162,74,.26);border-radius:var(--radius);padding:clamp(1.4rem,3vw,2rem);
  transition:transform .2s ease, border-color .2s ease, background .2s ease}
.brand-card:hover{transform:translateY(-3px);border-color:var(--brass)}
.brand-card .kicker{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;color:var(--brass)}
.brand-card .name{font-family:var(--f-display);font-size:clamp(1.5rem,2.6vw,1.95rem);color:var(--paper);margin:0;line-height:1.1}
.brand-card .name .dot{color:var(--amber)}
.brand-card .desc{color:var(--cream-dim);font-size:1rem;margin:0;flex:1}
.brand-card .tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.2rem}
.brand-card .tags span{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;
  color:var(--cream-dim);border:1px solid rgba(201,162,74,.3);border-radius:999px;padding:.32em .7em}
.brand-card .btn{align-self:flex-start;margin-top:.6rem}
.brand-card--spirit{background:linear-gradient(160deg, #20382a, #1a2f22)}
.brand-card--software{background:linear-gradient(160deg, #233a2c, #182b20)}

/* Industry platform arms (compact row) */
.brand-sub{margin-top:clamp(22px,3.5vw,34px)}
.brand-sub-label{display:block;text-align:center;font-family:var(--f-label);text-transform:uppercase;
  letter-spacing:.18em;font-size:.68rem;color:var(--brass);margin-bottom:1rem}
.brand-mini-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,18px)}
.brand-mini{display:flex;align-items:center;gap:.85rem;background:rgba(255,255,255,.025);
  border:1px solid rgba(201,162,74,.2);border-radius:14px;padding:.95rem 1.05rem;
  transition:transform .2s ease, border-color .2s ease, background .2s ease}
.brand-mini:hover{transform:translateY(-2px);border-color:var(--brass);background:rgba(255,255,255,.05);text-decoration:none}
.brand-mini .mini-icon{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;
  border-radius:10px;background:rgba(201,162,74,.12);color:var(--amber)}
.brand-mini .mini-icon svg{width:21px;height:21px}
.brand-mini .mini-text{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.brand-mini .mini-name{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.07em;
  font-size:.86rem;font-weight:500;color:var(--paper)}
.brand-mini .mini-desc{font-size:.8rem;line-height:1.35;color:var(--cream-dim)}
.brand-mini .mini-arrow{margin-left:auto;color:var(--brass);font-size:1.05rem;flex:0 0 auto;
  transition:transform .2s ease}
.brand-mini:hover .mini-arrow{transform:translateX(3px)}

/* Podcast strip */
.brand-podcast{display:flex;align-items:center;gap:1.1rem;margin-top:clamp(14px,2.2vw,20px);
  background:linear-gradient(120deg, rgba(199,122,30,.16), rgba(201,162,74,.06));
  border:1px solid rgba(201,162,74,.32);border-radius:16px;padding:1.05rem 1.3rem;
  transition:border-color .2s ease, background .2s ease}
.brand-podcast:hover{border-color:var(--amber);text-decoration:none;background:linear-gradient(120deg, rgba(199,122,30,.24), rgba(201,162,74,.1))}
.brand-podcast .pod-icon{flex:0 0 auto;width:50px;height:50px;display:grid;place-items:center;
  border-radius:12px;background:var(--amber);color:var(--bottle)}
.brand-podcast .pod-icon svg{width:26px;height:26px}
.brand-podcast .pod-text{display:flex;flex-direction:column;gap:.12rem;min-width:0;flex:1}
.brand-podcast .pod-kicker{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.18em;
  font-size:.62rem;color:var(--brass)}
.brand-podcast .pod-name{font-family:var(--f-display);font-size:1.2rem;color:var(--paper);line-height:1.15}
.brand-podcast .pod-desc{font-size:.85rem;line-height:1.4;color:var(--cream-dim)}
.brand-podcast .pod-cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;
  color:var(--bottle);background:var(--amber);padding:.6em 1.1em;border-radius:999px;transition:background .2s ease}
.brand-podcast:hover .pod-cta{background:#fff}

/* ============================================================
   11. ARCHIVE / SEARCH HEADERS + PAGINATION + 404
   ============================================================ */
.page-hero{background:var(--bottle);color:var(--paper);padding-block:clamp(44px,6vw,76px);text-align:center;position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 100% at 80% 10%,rgba(199,122,30,.2),transparent 55%)}
.page-hero .eyebrow{color:var(--brass);justify-content:center}
.page-hero .eyebrow::before,.page-hero .eyebrow--center::after{background:var(--brass)}
.page-hero h1{color:var(--paper);margin:0}
.page-hero p{color:var(--cream-dim);margin:.7rem auto 0;max-width:60ch}
.page-hero .archive-search{max-width:520px;margin:1.6rem auto 0}
.page-hero .search-form .search-field{background:rgba(255,255,255,.06)}

.pagination{display:flex;justify-content:center;gap:.5rem;margin-top:clamp(40px,5vw,60px);flex-wrap:wrap}
.pagination .page-numbers{display:grid;place-items:center;min-width:46px;height:46px;padding:0 .8rem;
  border-radius:999px;border:1px solid var(--line-strong);background:var(--cream);color:var(--bottle);
  font-family:var(--f-label);letter-spacing:.06em;font-size:.9rem}
.pagination .page-numbers:hover{background:var(--bottle);color:var(--paper);border-color:var(--bottle);text-decoration:none}
.pagination .page-numbers.current{background:var(--amber);color:#fff;border-color:var(--amber)}

.notice{max-width:var(--wrap-narrow);margin-inline:auto;text-align:center;background:var(--cream);
  border:1px solid var(--line);border-radius:var(--radius);padding:clamp(2rem,5vw,3.4rem)}
.notice h2{margin-top:0}

/* ============================================================
   12. SIDEBAR / WIDGETS
   ============================================================ */
.layout{display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,56px)}
.layout.has-sidebar{grid-template-columns:minmax(0,1fr) 320px}
.sidebar .widget{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.4rem;margin-bottom:1.4rem}
.sidebar .widget-title{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.16em;font-size:.82rem;
  color:var(--amber-deep);margin:0 0 1rem;padding-bottom:.7rem;border-bottom:1px solid var(--line)}
.sidebar ul{list-style:none;margin:0;padding:0}
.sidebar li{padding:.5rem 0;border-bottom:1px dotted var(--line);font-size:.96rem}
.sidebar li:last-child{border-bottom:0}
.sidebar a{color:var(--bottle)}
.sidebar a:hover{color:var(--amber-deep)}
.tagcloud{display:flex;flex-wrap:wrap;gap:.5rem}
.tagcloud a{font-family:var(--f-label)!important;text-transform:uppercase;letter-spacing:.08em;font-size:.74rem!important;
  padding:.4em .85em;border-radius:999px;background:var(--paper-2);border:1px solid var(--line)}
.tagcloud a:hover{background:var(--clay);color:#fff;text-decoration:none}

/* ============================================================
   13. NEWSLETTER STRIP
   ============================================================ */
.newsletter{background:var(--paper-2)}
.newsletter-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,48px);align-items:center;
  background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.8rem,4vw,3rem)}
.newsletter h2{margin:0 0 .4rem}
.newsletter p{color:var(--ink-soft);margin:0}
.newsletter form{display:flex;gap:.6rem;flex-wrap:wrap}
.newsletter input[type=email]{flex:1;min-width:200px;border:1.5px solid var(--line-strong);border-radius:999px;
  padding:.85em 1.3em;font-family:var(--f-body);font-size:1rem;background:var(--paper);color:var(--bottle)}
.newsletter input[type=email]:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(199,122,30,.2)}

/* ============================================================
   14. SITE FOOTER
   ============================================================ */
.site-footer{background:var(--bottle);color:var(--cream-dim)}
.footer-top{padding-block:clamp(44px,6vw,72px);display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(28px,4vw,48px)}
.footer-brand .brand{margin-bottom:1rem}
.footer-brand p{color:var(--cream-dim);max-width:38ch;font-size:.98rem}
.footer-col h4{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.16em;font-size:.8rem;color:var(--brass);margin:0 0 1rem}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col li{padding:.35rem 0}
.footer-col a{color:var(--cream-dim);font-size:.96rem}
.footer-col a:hover{color:var(--paper)}
.social{display:flex;gap:.6rem;margin-top:1rem}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(201,162,74,.3);display:grid;place-items:center;color:var(--paper)}
.social a:hover{background:var(--amber);border-color:var(--amber);text-decoration:none}
.social svg{width:18px;height:18px;fill:currentColor}
.footer-bottom{border-top:1px solid rgba(201,162,74,.2);padding-block:1.4rem;display:flex;
  justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;font-size:.84rem}
.footer-bottom .legal{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em}

/* ============================================================
   15. RESPONSIVE
   ============================================================ */
@media (max-width:1000px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .hero-media{max-width:460px;margin-inline:auto;order:-1}
  .layout.has-sidebar{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr}
  .recipe-grid .card--feature{grid-column:span 3;grid-template-columns:1fr}
}
@media (max-width:820px){
  body{font-size:17px}
  .recipe-grid,.recipe-grid.cols-2{grid-template-columns:1fr 1fr}
  .brand-cards{grid-template-columns:1fr}
  .brand-mini-row{grid-template-columns:1fr}
  .newsletter-inner{grid-template-columns:1fr}
  .post-nav{grid-template-columns:1fr}
  .nav-toggle{display:grid}
  .primary-nav{position:fixed;inset:0 0 0 auto;width:min(82vw,340px);background:var(--bottle-2);
    flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:5rem 1.5rem 2rem;
    transform:translateX(105%);transition:transform .3s ease;z-index:80;box-shadow:-20px 0 60px -20px rgba(0,0,0,.6);overflow-y:auto}
  .primary-nav.open{transform:translateX(0)}
  .primary-nav ul{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .primary-nav li{border-bottom:1px solid rgba(201,162,74,.16)}
  .primary-nav a{display:block;padding:.95rem .2rem;font-size:1rem}
  .primary-nav .sub-menu{position:static;display:flex;background:transparent;border:0;box-shadow:none;padding:0 0 .5rem 1rem}
  .nav-backdrop{position:fixed;inset:0;background:rgba(10,18,13,.55);opacity:0;visibility:hidden;transition:opacity .3s;z-index:75}
  .nav-backdrop.open{opacity:1;visibility:visible}
  .footer-bottom{justify-content:center;text-align:center}
}
@media (max-width:520px){
  .recipe-grid,.recipe-grid.cols-2{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr}
  .section-head{flex-direction:column;align-items:flex-start}
  .seal{width:68px;height:68px;top:-12px;right:-8px}
  .brand-podcast{flex-wrap:wrap}
  .brand-podcast .pod-cta{margin-left:calc(50px + 1.1rem)}
}

/* ============================================================
   16. MOTION (respectful)
   ============================================================ */
.reveal{opacity:0;transform:translateY(18px)}
.reveal.in{opacity:1;transform:none;transition:opacity .6s ease, transform .6s ease}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
  .card:hover,.btn:hover,.brand-card:hover{transform:none}
}

/* ============================================================
   17. SIDEBAR COLUMN, COMMENTS & NAV LOCK (added)
   ============================================================ */
/* Let the content column and its inner grid shrink properly inside .layout */
.content-area{min-width:0}

/* Prevent body scroll while the mobile nav drawer is open */
body.nav-open{overflow:hidden}

/* Comments */
.comments-area{max-width:var(--wrap-narrow);margin:3rem auto 0;padding-top:2rem;border-top:1px solid var(--line)}
.comments-title,.comment-reply-title{font-family:var(--f-display);font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 1.4rem}
.comment-list{list-style:none;margin:0 0 2rem;padding:0}
.comment-list ol.children{list-style:none;margin:1.2rem 0 0 1.4rem;padding-left:1.2rem;border-left:2px solid var(--line)}
.comment-body{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.3rem;margin-bottom:1.2rem}
.comment-author{display:flex;align-items:center;gap:.7rem;margin-bottom:.5rem}
.comment-author .avatar{border-radius:50%}
.comment-author .fn{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.08em;font-size:.9rem;font-style:normal;color:var(--bottle)}
.comment-meta{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;color:var(--ink-soft);margin-bottom:.5rem}
.comment-meta a{color:var(--ink-soft)}
.comment-content{font-size:.98rem}
.comment-content p{margin:0 0 .7rem}
.reply{margin-top:.3rem}
.comment-reply-link{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:var(--amber-deep)}
.comment-respond{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem 1.5rem;margin-top:1.5rem}
.comment-form-comment textarea,.comment-form-author input,.comment-form-email input,.comment-form-url input{
  width:100%;font:inherit;padding:.7rem .8rem;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--bottle);margin-top:.3rem}
.comment-form label{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.09em;font-size:.74rem;color:var(--bottle)}
.comment-form p{margin:0 0 1rem}
.comment-notes,.logged-in-as{font-size:.85rem;color:var(--ink-soft);text-transform:none;letter-spacing:0}
.comment-navigation{display:flex;justify-content:space-between;gap:1rem;margin:1.5rem 0;font-family:var(--f-label);text-transform:uppercase;letter-spacing:.08em;font-size:.76rem}
.no-comments{color:var(--ink-soft);font-style:italic}