/* ===================================================================
   Madame Ginger 5 — design system
   Loaded on every page AND in the block editor canvas.
   Tokens, layout, typography helpers, buttons, header, mobile menu,
   search panel, footer, shared cards (.prod, .recipe-feature),
   WordPress core classes, prose.
   Page CSS lives in assets/css/<page>.css, block CSS in blocks/<name>/style.css.
   =================================================================== */

:root{
  --lavender:#C8AAFE;
  --lavender-deep:#7A54D8;
  --lavender-strong:#A87CF5;
  --lavender-soft:#EFE6FE;
  --orange:#F04E23;
  --orange-soft:#FCE1D8;
  --peach-strong:#FF9E6D;
  --gold:#ECB800;
  --gold-deep:#8A6D00;
  --gold-soft:#FBEDC4;
  --mgshop:#3FB89E;
  --green:#3E8446;
  --green-deep:#2F6636;
  --green-soft:#E1EFDF;
  --cream:#FBF3E7;
  --paper:#FFFFFF;
  --ink:#1B1712;
  --line:rgba(27,23,18,.2);
  --line-soft:rgba(27,23,18,.12);
  --font:'Commissioner', Arial, sans-serif;
  --font-display:'IBM Plex Sans', Arial, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, monospace;

  --gutter:44px;
  --content:1232px;
  --header-offset:0px;
}
@media (max-width:1080px){ :root{ --gutter:20px; } }
@media (max-width:640px){ :root{ --gutter:16px; } }

/* the design is square everywhere */
body *{border-radius:0;}

body{font-family:var(--font); color:var(--ink); background:transparent;}
::selection{background:var(--gold); color:var(--ink);}
:focus-visible{outline:2px solid var(--lavender-deep); outline-offset:2px;}

/* ---- layout: parent theme content-grid, tuned to the design width ---- */
.content-grid{
  --padding-inline:var(--gutter);
  --content-max-width:var(--content);
  --breakout-max-width:1320px;
}
/* grid items default to min-width:auto — long words would widen the column and the page */
.content-grid > *{min-width:0;}
.wrap{max-width:calc(var(--content) + var(--gutter) * 2); margin:0 auto; padding:0 var(--gutter);}
.page{padding:48px 0 90px; position:relative; z-index:1;}

/* ---- ambient page background (Options → Theme → background) ---- */
.ambient{position:fixed; inset:0; z-index:-2; overflow:hidden; background:var(--paper); pointer-events:none;}
.ambient svg{position:absolute; filter:blur(80px);}
.ambient .blob-1{width:900px; height:600px; top:-180px; left:-240px; opacity:.32;}
.ambient .blob-2{width:820px; height:560px; bottom:-220px; right:-200px; opacity:.30;}
.ambient .blob-3{width:600px; height:420px; top:38%; left:38%; opacity:.10;}
.bg-grey-grid .ambient{
  background-color:#F8F8F6;
  background-image:linear-gradient(rgba(27,23,18,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(27,23,18,.035) 1px, transparent 1px);
  background-size:56px 56px;
}
.bg-peach-lines .ambient{
  background-color:#FEF9F5;
  background-image:repeating-linear-gradient(135deg, rgba(27,23,18,.025) 0px, rgba(27,23,18,.025) 1px, transparent 1px, transparent 18px);
}
.bg-white-solid .ambient{background:#FFFFFF;}

/* ---- motion ---- */
.photo{transition:transform .35s ease;}
a:hover .photo{transform:scale(1.03);}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important;}
}

/* ---- type helpers ---- */
.eyebrow{font-family:var(--font-mono); font-weight:600; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase;}
.eyebrow.c-green{color:var(--green);} .eyebrow.c-orange{color:var(--orange);} .eyebrow.c-lav,.eyebrow.c-lavender{color:var(--lavender-deep);} .eyebrow.c-gold{color:var(--gold-deep);} .eyebrow.c-mgshop{color:var(--mgshop);}
.price{font-family:var(--font-mono); font-weight:600; font-size:16px; white-space:nowrap;}
.price-old,.price del{text-decoration:line-through; opacity:.45; font-weight:500; font-size:13px; margin-right:6px;}
.price ins{text-decoration:none;}
.pct-off{color:var(--orange); font-family:var(--font-mono); font-size:10.5px; font-weight:700; margin-left:6px;}
.kicker{display:inline-block; font-family:var(--font-mono); font-weight:700; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;}

/* ---- buttons: outline with offset colour shadow ---- */
.btn,
.wp-element-button,
.wp-block-button__link{
  --btn-shadow:var(--mgshop);
  display:inline-flex; align-self:flex-start; align-items:center; justify-content:center; gap:8px;
  background:var(--paper); border:1.5px solid var(--ink); color:var(--ink);
  font-family:var(--font-mono); font-weight:600; font-size:13px; line-height:1.2; text-transform:uppercase; letter-spacing:.04em;
  padding:13px 24px; border-radius:10px !important; box-shadow:4px 4px 0 var(--btn-shadow);
  transition:transform .15s ease, box-shadow .15s ease; cursor:pointer; text-decoration:none;
}
.btn:hover,.wp-element-button:hover,.wp-block-button__link:hover{transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--btn-shadow);}
.btn:active,.wp-element-button:active{transform:translate(0,0); box-shadow:2px 2px 0 var(--btn-shadow);}
.btn-full{width:100%;}
.btn-dark{background:var(--ink); color:var(--paper);}
.btn.c-orange{--btn-shadow:var(--orange);} .btn.c-gold{--btn-shadow:var(--gold);} .btn.c-lavender{--btn-shadow:var(--lavender-deep);} .btn.c-green{--btn-shadow:var(--green);}
.btn[disabled],.btn.is-disabled{opacity:.4; cursor:not-allowed; box-shadow:4px 4px 0 var(--line); pointer-events:none;}

.add-link{flex:0 0 auto; font-family:var(--font-mono); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.03em; color:var(--mgshop); white-space:nowrap; border-bottom:1px solid transparent; transition:border-color .15s ease;}
.add-link:hover{border-bottom-color:var(--mgshop);}

/* ---- announce bar ---- */
.announce{background:var(--mgshop); color:#fff; text-align:center; padding:9px 10px; font-family:var(--font-mono); font-weight:600; font-size:11px; letter-spacing:.06em; text-transform:uppercase; max-height:38px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:max-height .35s ease, padding .35s ease, opacity .25s ease;}
.announce.is-collapsed{max-height:0; padding-top:0; padding-bottom:0; opacity:0;}

/* ---- utility bar: search entry point + social links, above the announce bar.
   Never collapses: pinned at the very top while you scroll, the header sticks right under it. ---- */
.utility-bar{position:sticky; top:0; z-index:85; background:var(--ink); color:var(--cream);}
.admin-bar .utility-bar{top:32px;}
@media (max-width:782px){ .admin-bar .utility-bar{top:46px;} }
@media (max-width:600px){ .admin-bar .utility-bar{top:0;} }
.utility-bar-inner{max-width:calc(var(--content) + var(--gutter) * 2); margin:0 auto; padding:0 var(--gutter); height:36px; display:flex; align-items:center; justify-content:space-between;}
.utility-search-btn{display:flex; align-items:center; gap:8px; background:none; border:none; color:var(--cream); font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; cursor:pointer; padding:0;}
.utility-search-btn svg{width:13px; height:13px; flex-shrink:0; color:var(--gold);}
.utility-social{display:flex; align-items:center; gap:16px;}
.utility-social a{display:flex; color:var(--cream); opacity:.8; transition:opacity .15s ease, color .15s ease;}
.utility-social a:hover{opacity:1; color:var(--gold);}
.utility-social svg{width:15px; height:15px;}

/* ================= HEADER ================= */
.site-header{position:sticky; top:0; z-index:80; background:var(--paper); border-bottom:2px solid var(--gold); width:100%; transition:box-shadow .3s ease;}
.admin-bar .site-header{top:32px;}
@media (max-width:782px){ .admin-bar .site-header{top:46px;} }
@media (max-width:600px){ .admin-bar .site-header{top:0;} }
/* pages with the utility bar: the sticky header sits right beneath it */
.utility-bar ~ .site-header{top:36px;}
.admin-bar .utility-bar ~ .site-header{top:68px;}
@media (max-width:782px){ .admin-bar .utility-bar ~ .site-header{top:82px;} }
@media (max-width:600px){ .admin-bar .utility-bar ~ .site-header{top:36px;} }
.site-header.is-scrolled{box-shadow:0 6px 18px rgba(27,23,18,.08);}
.header-bar{display:flex; align-items:center; justify-content:space-between; padding:20px var(--gutter); gap:32px; max-width:calc(var(--content) + var(--gutter) * 2); margin:0 auto; transition:padding .3s ease;}
.site-header.is-scrolled .header-bar{padding-top:12px; padding-bottom:12px;}
.nav-left{display:flex; align-items:center; gap:30px; flex:1 1 0; min-width:0;}
.dd{position:relative;}
.dd-btn{display:flex; align-items:center; gap:6px; color:var(--ink); font-family:var(--font-mono); font-weight:600; font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; padding:10px 0; white-space:nowrap; transition:padding .3s ease;}
.site-header.is-scrolled .dd-btn{padding:6px 0;}
.dd-btn .caret{color:var(--orange); font-size:9px;}
.dd-btn[aria-current]{text-decoration:underline; text-decoration-color:var(--gold); text-decoration-thickness:2px; text-underline-offset:5px;}
.dd-menu{position:absolute; top:100%; left:0; background:var(--paper); border:1.5px solid var(--ink); min-width:220px; padding:0; display:none; z-index:60;}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:block;}
.dd-menu a{display:block; padding:11px 16px; font-size:12px; font-weight:600; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.03em; color:var(--ink); border-top:1px solid var(--line-soft);}
.dd-menu a:first-child{border-top:none;}
.dd-menu a:hover,.dd-menu a:focus-visible{background:var(--ink); color:var(--cream);}
.logo-main{flex-shrink:0;}
.logo-main img{height:55px; width:auto; transition:height .3s ease;}
.site-header.is-scrolled .logo-main img{height:38px;}
.nav-right{display:flex; align-items:center; justify-content:flex-end; gap:22px; flex:1 1 0; min-width:0;}
.nav-right .sublogo{flex-shrink:0;}
.nav-right .sublogo img{height:22px; width:auto; transition:height .3s ease;}
.site-header.is-scrolled .nav-right .sublogo img{height:16px;}
.nav-right .divider{width:1px; height:20px; background:var(--ink); opacity:.2; transition:height .3s ease;}
.site-header.is-scrolled .nav-right .divider{height:14px;}
.icon-btn{display:flex; align-items:center; gap:6px; color:var(--ink); font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; flex-shrink:0; position:relative; white-space:nowrap;}
.icon-btn svg{width:18px; height:18px; transition:width .3s ease, height .3s ease;}
.site-header.is-scrolled .icon-btn svg{width:15px; height:15px;}
.icon-btn.is-cart{color:var(--orange);}
.icon-btn.is-cart.is-bumped{animation:mg-bump .45s ease;}
@keyframes mg-bump{30%{transform:scale(1.18);}60%{transform:scale(.94);}}

/* ---- mobile burger menu ---- */
.burger-btn{display:none; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:32px; height:32px; flex-shrink:0;}
.burger-btn span{display:block; width:22px; height:1.5px; background:var(--ink);}
.mobile-menu-backdrop{position:fixed; inset:0; background:rgba(27,23,18,.5); opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:90;}
.mobile-menu-backdrop.open{opacity:1; pointer-events:auto;}
.mobile-menu{position:fixed; top:0; right:0; bottom:0; width:84%; max-width:340px; background:var(--paper); z-index:95; transform:translateX(100%); visibility:hidden; transition:transform .3s ease, visibility 0s linear .3s; display:flex; flex-direction:column; box-shadow:-10px 0 30px rgba(0,0,0,.18); overflow:hidden;}
.mobile-menu.open{transform:translateX(0); visibility:visible; transition:transform .3s ease;}
.mobile-menu-head{display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:2px solid var(--gold); flex-shrink:0;}
.mobile-menu-label{font-family:var(--font-mono); font-weight:700; font-size:11.5px; text-transform:uppercase; letter-spacing:.06em;}
.mobile-menu-close{width:34px; height:34px; display:flex; align-items:center; justify-content:center; color:var(--ink);}
.mobile-menu-close svg{width:18px; height:18px;}
.mobile-menu-nav{padding:22px 20px; overflow-y:auto; flex:1; min-height:0;}
.mobile-menu-group{margin-bottom:26px;}
.mobile-menu-group:last-child{margin-bottom:0;}
.mobile-menu-group a.mobile-menu-title,.mobile-menu-title{display:block; font-family:var(--font-mono); font-weight:700; font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--gold-deep); margin-bottom:8px; padding:0; border:none;}
.mobile-menu-group a{display:block; padding:10px 0; font-size:14px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line-soft);}
.mobile-menu-brands{display:flex; align-items:center; gap:22px; padding:20px; border-bottom:2px solid var(--gold); flex-shrink:0;}
.mobile-menu-brands img{height:22px; width:auto;}
.mobile-menu-shop a{font-family:var(--font-mono); font-size:12px; text-transform:uppercase; letter-spacing:.04em;}

/* ---- search panel ---- */
/* slides down from the top and live-filters recipes / articles / products as you type */
.search-backdrop{position:fixed; inset:0; background:rgba(27,23,18,.4); z-index:110; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .25s ease, visibility 0s .25s;}
.search-backdrop.open{opacity:1; visibility:visible; pointer-events:auto; transition:opacity .25s ease;}
.search-panel{position:fixed; top:0; left:0; right:0; background:var(--paper); border-bottom:2px solid var(--gold); z-index:120; transform:translateY(-100%); opacity:0; visibility:hidden; pointer-events:none; transition:transform .3s ease, opacity .3s ease, visibility 0s .3s; box-shadow:0 12px 30px rgba(27,23,18,.14);}
.admin-bar .search-panel{top:32px;}
@media (max-width:782px){ .admin-bar .search-panel{top:46px;} }
.search-panel.open{transform:translateY(0); opacity:1; visibility:visible; pointer-events:auto; transition:transform .3s ease, opacity .3s ease;}
.search-panel-inner{max-width:900px; margin:0 auto; padding:30px var(--gutter) 0; display:flex; align-items:center; gap:16px;}
.search-panel-inner .search-form{flex:1; min-width:0;}
.search-form{display:flex; gap:14px; align-items:stretch;}
.search-field{flex:1; min-width:0; border:none; border-bottom:2px solid var(--ink); background:transparent; padding:8px 0; font-family:var(--font-display); font-size:24px; font-weight:700; color:var(--ink);}
.search-field::placeholder{color:var(--ink); opacity:.35;}
.search-field:focus{outline:none; border-bottom-color:var(--orange);}
.search-submit{align-self:center;}
.search-panel-close{width:36px; height:36px; border:1.5px solid var(--ink); background:var(--paper); border-radius:50% !important; display:flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; transition:background .15s ease, color .15s ease;}
.search-panel-close:hover{background:var(--ink); color:var(--cream);}
.search-panel-close svg{width:16px; height:16px;}
.search-results{max-width:900px; margin:0 auto; padding:20px var(--gutter) 36px; max-height:60vh; overflow-y:auto;}
.search-hint,.search-empty{font-family:var(--font-mono); font-size:11.5px; letter-spacing:.03em; opacity:.45;}
.search-empty{text-align:center; padding:30px 20px; font-size:14px;}
.search-group{margin-bottom:22px;}
.search-group:last-child{margin-bottom:0;}
.search-group-label{font-family:var(--font-mono); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--green); margin-bottom:8px; display:block;}
.search-result-item{display:flex; align-items:center; gap:14px; padding:10px 4px; border-bottom:1px solid var(--line-soft); color:var(--ink);}
.search-result-item:hover{background:var(--cream);}
.search-result-item .thumb{width:44px; height:44px; border:1.5px solid var(--ink); overflow:hidden; flex:0 0 auto; background:var(--cream);}
.search-result-item .thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.search-result-item h4{font-family:var(--font-display); font-size:14.5px; font-weight:700; line-height:1.3;}
.search-all{display:inline-block; margin-top:16px; font-family:var(--font-mono); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; border-bottom:1.5px solid var(--ink);}

/* ---- shared page shell ---- */
.crumb{display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; opacity:.55; margin-bottom:20px;}
.crumb a{opacity:.85;}
.crumb a:hover{opacity:1; text-decoration:underline;}
.crumb .sep{opacity:.4;}
.crumb .current{opacity:1;}
.page-head{margin-bottom:36px;}
.page-head h1{font-family:var(--font-display); font-size:38px; font-weight:700; line-height:1.15; text-transform:uppercase; letter-spacing:.03em;}
.page-head .lede{font-size:17px; line-height:1.6; opacity:.65; max-width:60ch; margin-top:12px;}

/* ---- section head ---- */
.sec{border-top:2px solid var(--gold); padding-top:26px; margin-top:52px;}
.page > .sec:first-child,.sec.is-first{border-top:none; margin-top:0;}
.sec.div-gold{border-top-color:var(--gold);}
.sec.div-mgshop{border-top-color:var(--mgshop);}
.sec.div-orange{border-top-color:var(--orange);}
.sec.div-green{border-top-color:var(--green);}
.sec.div-lavender{border-top-color:var(--lavender-deep);}
.sec-head{display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; margin-bottom:30px;}
.sub-head{display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; margin:48px 0 26px;}
.sec-badge{display:inline-flex; align-items:center; font-family:var(--font-display); font-size:26px; font-weight:200; text-transform:uppercase; letter-spacing:.07em; line-height:1.3; margin:0;}
.sec-badge.c-orange{color:var(--orange);}
.sec-badge.c-green{color:var(--green);}
.sec-badge.c-lavender{color:var(--lavender-deep);}
.sec-badge.c-gold{color:var(--gold-deep);}
.sec-badge.c-mgshop{color:var(--mgshop);}
.shop-mark{height:16px; width:auto; margin-right:8px;}
.see-all{margin-left:auto; font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:2px; flex:0 0 auto;}

/* ---- product card (.prod) — homepage blocks, shop loop, related ---- */
.prod{--accent:var(--mgshop); position:relative; display:flex; flex-direction:column; height:100%; border:1.5px solid var(--ink); padding:16px; background:var(--paper); box-shadow:6px 6px 0 var(--accent); transition:transform .15s ease, box-shadow .15s ease;}
.prod:hover{transform:translate(-3px,-3px); box-shadow:9px 9px 0 var(--accent);}
.prod .img-wrap{aspect-ratio:3/4; background:var(--paper); margin-bottom:14px; position:relative; overflow:hidden; display:block;}
.prod .img-wrap img{width:100%; height:100%; object-fit:cover;}
.prod .sale-tag{position:absolute; top:8px; left:8px; font-family:var(--font-mono); font-size:9.5px; font-weight:700; color:#fff; background:var(--orange); padding:4px 7px; z-index:2;}
.prod .stock-tag{position:absolute; top:8px; right:8px; font-family:var(--font-mono); font-size:9.5px; font-weight:700; color:var(--ink); background:var(--cream); padding:4px 7px; z-index:2; border:1px solid var(--ink);}
.prod .badge{position:absolute; top:8px; left:8px; font-family:var(--font-mono); font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; padding:4px 7px; z-index:2; color:#fff;}
.prod .badge-new{background:var(--mgshop);}
.prod .badge-offer{background:var(--lavender-deep);}
.prod .badge-sale{background:var(--orange);}
.prod h3,.prod h5{font-family:var(--font); font-size:15px; font-weight:700; line-height:1.32; margin-bottom:6px;}
.prod .desc{font-size:13px; line-height:1.5; opacity:.55; margin-bottom:12px;}
.prod-row{display:flex; align-items:center; gap:8px; margin-top:auto; padding-top:10px;}
.prod-row .leader{flex:1; border-bottom:1px dotted var(--line); transform:translateY(-3px); min-width:6px;}
.prod .stretched{position:absolute; inset:0; z-index:1;}
.prod .add-link{position:relative; z-index:3;}
.prod .add-link.loading{opacity:.5;}
.prod .add-link.added::after{content:" ✓";}
.prod .added_to_cart{display:none;}
.accent-cycle-5 > :nth-child(5n+2) .prod,.accent-cycle-5 > .prod:nth-child(5n+2){--accent:var(--orange);}
.accent-cycle-5 > :nth-child(5n+3) .prod,.accent-cycle-5 > .prod:nth-child(5n+3){--accent:var(--gold-deep);}
.accent-cycle-5 > :nth-child(5n+4) .prod,.accent-cycle-5 > .prod:nth-child(5n+4){--accent:var(--lavender-deep);}
.accent-cycle-5 > :nth-child(5n+5) .prod,.accent-cycle-5 > .prod:nth-child(5n+5){--accent:var(--green);}

/* ---- featured card over photo (.recipe-feature / .article-feature) ---- */
.recipe-feature,.article-feature{position:relative; margin-bottom:90px;}
.feature-photo{display:block; position:relative; aspect-ratio:21/9; overflow:hidden; border:1.5px solid var(--ink);}
.feature-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.feature-tag{position:absolute; top:20px; left:20px; background:var(--gold); color:var(--ink); font-family:var(--font-mono); font-weight:700; font-size:11px; text-transform:uppercase; letter-spacing:.05em; padding:8px 14px; z-index:2;}
.feature-card{--accent:var(--gold); position:absolute; left:48px; bottom:-56px; width:min(46%,480px); background:var(--paper); border:1.5px dashed var(--ink); box-shadow:8px 8px 0 var(--accent); padding:28px 30px; transform:rotate(-1.4deg); z-index:3; display:block; transition:transform .15s ease, box-shadow .15s ease;}
.feature-card:hover{transform:rotate(-1.4deg) translate(-3px,-3px); box-shadow:11px 11px 0 var(--accent);}
.feature-pin{position:absolute; top:-11px; left:34px; width:22px; height:22px; background:var(--ink); border-radius:50% !important; box-shadow:0 2px 4px rgba(27,23,18,.35);}
.feature-num{display:block; font-family:var(--font-mono); font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--green); margin-bottom:8px;}
.feature-card h2,.feature-card h3{font-family:var(--font-display); font-size:24px; font-weight:700; line-height:1.22; margin-bottom:10px;}
.feature-card p{font-size:14px; line-height:1.55; opacity:.65; margin-bottom:16px;}
.feature-meta{display:flex; flex-wrap:wrap; gap:8px 16px; font-family:var(--font-mono); font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; opacity:.55; margin-bottom:18px;}
/* mirrored lavender sibling on the articles page */
.article-feature .feature-tag{left:auto; right:20px; background:var(--lavender);}
.article-feature .feature-card{--accent:var(--lavender-deep); left:auto; right:48px; transform:rotate(1.4deg);}
.article-feature .feature-card:hover{transform:rotate(1.4deg) translate(-3px,-3px);}
.article-feature .feature-pin{left:auto; right:34px;}
.article-feature .feature-num{color:var(--lavender-deep);}

/* ---- load more / empty state ---- */
.load-more{display:flex; justify-content:center; margin-top:40px;}
[data-mg-infinite].is-loading .load-more .btn{opacity:.6; pointer-events:none;}
.empty-state{border:1.5px dashed var(--line); padding:40px; text-align:center; font-family:var(--font-mono); font-size:12px; text-transform:uppercase; letter-spacing:.05em; opacity:.7;}

/* ---- forms (base; shop forms refine in woocommerce.css) ---- */
.mg-input,
.entry-content input[type=text],.entry-content input[type=email],.entry-content input[type=tel],.entry-content input[type=url],.entry-content input[type=number],.entry-content input[type=password],.entry-content textarea,.entry-content select,
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{
  width:100%; background:var(--paper); border:1.5px solid var(--ink); padding:12px 14px; font-family:var(--font); font-size:15px; color:var(--ink);
}
.mg-input:focus,.entry-content input:focus,.entry-content textarea:focus,.comment-form input:focus,.comment-form textarea:focus{outline:none; box-shadow:4px 4px 0 var(--gold);}

/* ================= FOOTER ================= */
.site-footer{position:relative; z-index:1; background:var(--gold); color:var(--ink); padding:0;}
/* torn-ticket edge along the top (same pinned-card / postmark language as the feature banners) */
.footer-perf{height:16px; width:100%; background:radial-gradient(circle at center, var(--paper) 0 4.5px, transparent 5px) 0 -1px/28px 16px repeat-x;}
.footer-top{display:flex; align-items:center; flex-wrap:wrap; gap:28px; padding:40px 0 28px; border-bottom:1px solid rgba(27,23,18,.2);}
.footer-top .logo-main{flex:0 0 auto; display:block;}
.footer-top .logo-main img{height:26px; width:auto;}
.footer-sublogos{display:flex; align-items:center; gap:14px;}
.footer-sublogos img{height:15px; width:auto; opacity:.8;}
.footer-social{display:flex; gap:10px; margin-left:auto;}
.footer-social a{width:32px; height:32px; border:1px solid rgba(27,23,18,.35); display:flex; align-items:center; justify-content:center; color:var(--ink); transition:background .15s ease, color .15s ease, border-color .15s ease;}
.footer-social a:hover{background:var(--ink); color:var(--gold); border-color:var(--ink);}
.footer-social svg{width:14px; height:14px;}
.footer-menu{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; padding:24px 0; border-bottom:1px solid rgba(27,23,18,.2);}
.footer-menu-links{display:flex; flex-wrap:wrap; gap:10px 28px;}
.footer-menu-links a{font-size:13.5px; font-weight:600; opacity:.8;}
.footer-menu-links a:hover{opacity:1; text-decoration:underline;}
.footer-cards{height:52px; width:auto;}
.footer-bottom{display:flex; align-items:center; justify-content:space-between; padding:18px 0; font-size:13px; opacity:.8; flex-wrap:wrap; gap:14px;}
.footer-bottom a{text-decoration:underline;}

/* ================= WORDPRESS CORE ================= */
.screen-reader-text{border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute !important; width:1px; word-wrap:normal !important;}
.screen-reader-text:focus,.skip-link:focus{background:var(--ink); color:var(--paper); clip:auto !important; clip-path:none; display:block; font-size:14px; height:auto; left:8px; top:8px; padding:12px 18px; width:auto; z-index:100000;}
.alignleft{float:left; margin:0 24px 16px 0;}
.alignright{float:right; margin:0 0 16px 24px;}
.aligncenter{margin-left:auto; margin-right:auto;}
.wp-caption-text,.wp-element-caption,figcaption{font-family:var(--font-mono); font-size:11px; letter-spacing:.03em; opacity:.6; margin-top:8px;}
.video-container,.videoWidgetContainer{position:relative; padding-bottom:56.25%; height:0; overflow:hidden;}
.video-container iframe,.videoWidgetContainer iframe{position:absolute; inset:0; width:100%; height:100%;}
.sticky,.bypostauthor,.gallery-caption{}

/* ---- prose (post / page content) ----
   Every rule skips elements inside theme blocks (:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *))) —
   blocks carry their own typography and must not inherit article styles. */
.entry-content{font-size:17px; line-height:1.7;}
.entry-content > * + *{margin-top:1.1em;}
.entry-content h2:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){font-family:var(--font-display); font-size:28px; font-weight:700; line-height:1.2; margin-top:1.8em;}
.entry-content h3:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){font-family:var(--font-display); font-size:22px; font-weight:700; line-height:1.25; margin-top:1.6em;}
.entry-content h4:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){font-family:var(--font-mono); font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-top:1.6em;}
.entry-content a:not(.btn):not(.wp-block-button__link):where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){text-decoration:underline; text-decoration-color:var(--gold); text-decoration-thickness:2px; text-underline-offset:3px;}
.entry-content a:not(.btn):not(.wp-block-button__link):where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)):hover{text-decoration-color:var(--orange);}
.entry-content :is(ul,ol):where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *, .products *, #shipping_method *)){padding-left:1.3em;}
.entry-content ul:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *, .products *, #shipping_method *)){list-style:none;}
.entry-content ul:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *, .products *, #shipping_method *)) > li{position:relative;}
.entry-content ul:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *, .products *, #shipping_method *)) > li::before{content:""; position:absolute; left:-1.1em; top:.72em; width:7px; height:7px; background:var(--gold);}
.entry-content ol:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){list-style:decimal;}
.entry-content ol:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)) > li::marker{font-family:var(--font-mono); font-weight:700; color:var(--orange);}
.entry-content li:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)) + li{margin-top:.35em;}
.entry-content blockquote:where(:not(.tiktok-embed, .instagram-media, .twitter-tweet, .mg-block *, [class*="wc-block"] *)),.mg-quote{border-left:3px solid var(--orange); padding:4px 0 4px 22px; font-family:var(--font-display); font-size:21px; font-weight:600; line-height:1.45;}
.entry-content img{height:auto;}
.entry-content hr:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){border:none; border-top:2px solid var(--gold); margin:2.2em 0;}
.entry-content table:where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){width:100%; border-collapse:collapse; font-size:15px;}
.entry-content :is(th,td):where(:not(.mg-block *, [class*="wc-block"] *, .tiktok-embed *, .instagram-media *)){border-bottom:1px solid var(--line); padding:10px 8px; text-align:left;}
.entry-content .wp-block-embed iframe{max-width:100%;}

/* ---- tips from old shortcodes (blocks restyle in their own css) ---- */
.mg-tip{--accent:var(--gold); border:1.5px solid var(--ink); box-shadow:6px 6px 0 var(--accent); background:var(--paper); padding:22px 24px; margin:2em 0;}
.mg-tip--orange{--accent:var(--orange);} .mg-tip--lavender{--accent:var(--lavender-deep);} .mg-tip--green{--accent:var(--green);}
.mg-tip__label{display:inline-block; background:var(--accent); color:var(--ink); font-family:var(--font-mono); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:5px 10px; margin-bottom:12px;}
.mg-tip__body > * + *{margin-top:.8em;}

/* ---- block editor placeholder ---- */
.mg-block-placeholder{display:flex; flex-direction:column; gap:6px; border:1.5px dashed var(--ink); background:var(--cream); padding:26px; font-family:var(--font-mono); font-size:12px;}
.mg-block-placeholder strong{font-size:13px; text-transform:uppercase; letter-spacing:.05em;}

/* ================= RESPONSIVE (shared parts only) ================= */
@media (max-width:1080px){
  .nav-left{gap:20px;}
  .nav-right{gap:16px;}
  .recipe-feature,.article-feature{margin-bottom:44px;}
  .feature-photo{aspect-ratio:16/9;}
  .feature-card,.article-feature .feature-card{position:static; width:88%; max-width:460px; margin:-46px auto 0; transform:none;}
  .feature-card:hover,.article-feature .feature-card:hover{transform:none;}
}
@media (max-width:900px){
  .nav-left{display:none;}
  .burger-btn{display:flex;}
  .header-bar{gap:16px;}
  .nav-right{flex:0 0 auto;}
  .logo-main{flex:1; display:flex; justify-content:center;}
}
@media (max-width:640px){
  .header-bar{flex-wrap:nowrap; padding:14px var(--gutter);}
  .logo-main img{height:45px;}
  .nav-right{gap:14px;}
  .nav-right .sublogo,.nav-right .divider,.icon-account{display:none;}
  .icon-btn .mg-cart-label{position:absolute; top:-8px; right:-10px; font-size:0;}
  .icon-btn .mg-cart-label .mg-cart-count{font-size:9.5px; background:var(--orange); color:#fff; min-width:16px; height:16px; padding:0 4px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px !important;}
  .icon-btn svg{width:20px; height:20px;}
  .page{padding:26px 0 60px;}
  .page-head h1{font-size:27px;}
  .sec-badge{font-size:21px;}
  .footer-top{justify-content:center; text-align:center;}
  .footer-social{margin-left:0;}
  .footer-bottom{justify-content:center; text-align:center;}
  .utility-search-btn span{display:none;}
  .utility-social{gap:12px;}
  .feature-card,.article-feature .feature-card{width:100%; padding:24px 22px;}
  .feature-pin{display:none;}
  .search-field{font-size:19px;}
  .search-submit{display:none;}
  .alignleft,.alignright{float:none; margin:0 0 16px;}
}