/* FM-171 fonts (self-hosted, SIL OFL 1.1, see fonts/OFL-*.txt): Orbitron for headings, Audiowide for everything else. */
@font-face{font-family:"Orbitron";font-style:normal;font-weight:400 900;font-display:swap;src:url("fonts/orbitron-var.woff2") format("woff2")}
@font-face{font-family:"Audiowide";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/audiowide.woff2") format("woff2")}
:root{--font-body:"Audiowide",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-head:"Orbitron","Audiowide",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--paper:#FBF6EC;--sand:#F3E8D4;--sand2:#EFE3CE;--terra:#B5532F;--terra-d:#8E3F22;--olive:#5E6C30;--blue:#1D55B8;--blue-d:#17418F;--purple:#2b2096;--bg:var(--paper);--panel:#FFFDF8;--text:#3B2A20;--muted:#5E4A3C;--accent:#2b2096;--accent2:#5E6C30;--line:rgba(110,80,50,.22);--glass:#FFFDF8;--r:26px;--grad:linear-gradient(90deg,#B5532F,#9E4527)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--bg)}
body{font-family:var(--font-body);font-synthesis:none;color:var(--text);line-height:1.65;font-size:18px;position:relative;overflow-x:hidden}
body::before{display:none}
h1,h2,h3,h4,h5,h6,.brand{font-family:var(--font-head)}
input,textarea,select,button{font-family:inherit}
a[href^="mailto:"]{overflow-wrap:anywhere}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
.wrap.narrow{max-width:860px}
code{background:#EFE3CE;padding:1px 6px;border-radius:6px;font-size:.9em}

/* header */
header.site{position:sticky;top:0;z-index:30;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
header.site.scrolled{background:rgba(251,246,236,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-top:16px;padding-bottom:16px}
.brand{display:block;color:var(--text)}
.brand:hover{text-decoration:none}
.brand img{display:block;height:44px;width:auto}
nav{display:flex;align-items:center;flex-wrap:wrap;gap:6px 6px}
nav a{color:#4A372B;font-weight:600;font-size:.88rem;letter-spacing:.08em;text-transform:uppercase;padding:9px 16px;border-radius:999px;transition:background .2s,color .2s}
nav a:hover{color:var(--text);background:rgba(91,63,208,.1);text-decoration:none}
nav a.active{color:#2b2096;background:rgba(91,63,208,.14)}
/* FM-177 model thumbnails (models.html): fixed 4:3 box so the layout never jumps; whole image shown on a soft background */
.card .mthumb{display:block;background:#F3E8D4;overflow:hidden;border-radius:inherit;border-bottom-left-radius:0;border-bottom-right-radius:0}
.card .mthumb img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
/* FM-178 "Sign in" is a plain nav link (FM-185: the cart button now lives in the logo row, not in the nav) */
nav a.signin-link{order:2}
/* FM-181: the header Sign in link looks the same on every page as it does on account.html (where account.css `.acct a` makes it dark purple + underlined; hover goes back to the normal nav-link hover) */
nav a.signin-link{color:#2b2096;text-decoration:underline;line-height:1.55}
nav a.signin-link:hover{color:var(--text);text-decoration:none}
/* FM-181 one-line links: wrap whole links, never words; the Sign in link may shrink and ellipsize (see .who) instead of wrapping */
nav a,.cart-btn{white-space:nowrap}
nav a.signin-link{flex:0 1 auto;min-width:0;max-width:100%}
nav a.signin-link .who{display:block;max-width:16em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* buttons */
.btn{display:inline-block;padding:15px 34px;border-radius:999px;font-weight:700;font-size:.92rem;letter-spacing:.07em;text-transform:uppercase;background:var(--grad);color:#fff;border:1px solid transparent;transition:transform .2s,box-shadow .2s,filter .2s}
.btn:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 12px 30px rgba(142,63,34,.35);background:#9A4224;filter:none}
.btn.ghost{background:rgba(255,255,255,.7);color:#2b2096;border-color:#5b3fd0;margin-left:0}
.btn.ghost:hover{background:#fff;box-shadow:none;filter:none}
.btn.small{padding:10px 20px;font-size:.78rem;cursor:pointer;font-family:inherit;border:0}
.btn.small.done{background:#2b2096}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}

/* hero with soft animated fade */
.hero,.page-title{position:relative;overflow:hidden;text-align:center;margin-top:-77px;isolation:isolate}
.hero::before,.page-title::before{content:"";position:absolute;inset:-10%;z-index:-2;background:
radial-gradient(45% 50% at 16% 20%,rgba(125,170,255,.6),transparent 70%),
radial-gradient(48% 55% at 84% 16%,rgba(232,155,115,.65),transparent 70%),
radial-gradient(55% 50% at 52% 80%,rgba(168,180,100,.5),transparent 70%),
linear-gradient(180deg,#F1DFC4 0%,#F7ECDA 60%,#FBF6EC 100%);
background-size:140% 140%;animation:drift 22s ease-in-out infinite alternate}
.hero::after,.page-title::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;z-index:-1;background:linear-gradient(180deg,rgba(251,246,236,0),#FBF6EC 94%)}
@keyframes drift{0%{background-position:0% 0%}100%{background-position:100% 100%}}
.hero{min-height:min(100vh,860px);display:grid;place-items:center;padding:150px 0 170px}
.eyebrow{font-size:.85rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent2);margin-bottom:14px}
.hero .eyebrow{color:#17418F}
.hero h1{font-size:clamp(2.8rem,9vw,6.6rem);line-height:1.02;font-weight:800;letter-spacing:-.02em}
.hero h1 span{background:linear-gradient(90deg,#1D55B8,#2b2096);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.tag{font-size:clamp(1.15rem,2.6vw,1.6rem);color:#4A372B;margin:22px auto 40px;max-width:680px;font-weight:400}
.page-title{padding:150px 0 90px}
.page-title h1{font-size:clamp(2.2rem,6vw,3.8rem);font-weight:800;letter-spacing:-.01em;line-height:1.1}
.page-title .lead{margin:14px auto 0;color:#4A372B}

/* sections */
section{padding:100px 0}
section.soft{background:linear-gradient(180deg,#FBF6EC,#F3E8D4 30%,#ECEFD8 70%,#FBF6EC)}
section.intro{padding:40px 0 20px}
h2{font-size:clamp(1.8rem,4.2vw,2.8rem);line-height:1.15;font-weight:800;letter-spacing:-.01em;margin-bottom:34px}
h3{font-weight:700}
.big{font-size:clamp(1.4rem,3.4vw,2.1rem);line-height:1.4;text-align:center;font-weight:500;color:#4A372B}
.lead{color:var(--muted);max-width:720px;margin-bottom:34px}
.fine{color:var(--muted);font-size:.9rem;margin-top:22px}
.row-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:34px}
.row-head h2{margin-bottom:0}
.more{font-weight:700;font-size:.95rem}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.grid.g3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.g4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:#FFFDF8;border:1px solid var(--line);border-radius:var(--r);padding:32px;box-shadow:0 6px 24px rgba(90,60,30,.07);transition:transform .3s,border-color .3s,background .3s,box-shadow .3s}
.card:hover{transform:translateY(-5px);border-color:rgba(181,83,47,.55);box-shadow:0 18px 44px rgba(90,60,30,.16)}
.card h3{margin-bottom:8px;font-size:1.3rem}
.card p{color:var(--muted)}
.icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:1.6rem;margin-bottom:18px;background:linear-gradient(135deg,#dbe8ff,#e6dcff);border:1px solid var(--line)}
.steps{counter-reset:s}
.steps .card{position:relative;padding-top:78px}
.steps .card::before{counter-increment:s;content:counter(s);position:absolute;top:26px;left:32px;width:36px;height:36px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;text-align:center;line-height:36px}
.cta-panel{position:relative;overflow:hidden;isolation:isolate;text-align:center;border-radius:40px;padding:90px 28px;border:1px solid var(--line)}
.cta-panel::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 90% at 15% 10%,rgba(110,168,255,.55),transparent 70%),radial-gradient(60% 90% at 90% 90%,rgba(181,83,47,.6),transparent 70%),linear-gradient(135deg,#2b2096,#3b2aa8 55%,#241a80)}
.cta-panel h2{margin-bottom:12px}
.cta-panel,.cta-panel h2{color:#fff}.cta-panel .btn{background:#fff;color:#2b2096}.cta-panel .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}.cta-panel .btn.ghost:hover{background:rgba(255,255,255,.16)}
.cta-panel p{color:#FBF6EC;margin-bottom:30px;font-size:1.15rem}
.note{background:#F3E8D4;border:1px solid var(--line);border-radius:var(--r);padding:28px 32px;max-width:640px}

/* shop */
.product{padding:12px;display:flex;flex-direction:column;overflow:hidden}
.product:hover{transform:translateY(-5px)}
a.linkcard{color:var(--text)}
a.linkcard:hover{text-decoration:none}
.pimg{position:relative;background:#14104a;border-radius:18px;overflow:hidden}
.pimg img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .5s}
.product:hover .pimg img{transform:scale(1.04)}
.badge{position:absolute;top:12px;left:12px;background:#E6EBCB;color:#46531F;font-weight:800;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:4px 11px;border-radius:999px;z-index:1}
.product .cat{padding:16px 14px 0;color:var(--accent2);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.product h3,.product p,.product .prow{padding-left:14px;padding-right:14px}
.product h3{margin:4px 0 6px;font-size:1.15rem}
.product p{font-size:.95rem}
.prow{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:16px;padding-bottom:12px;gap:10px}
.colors{font-size:1rem;color:var(--text)}
.price{font-weight:800;font-size:1.1rem}
.warn{background:#F3E8D4;border:1px solid #C9A27E;color:#3B2A20;border-radius:18px;padding:16px 22px;margin-bottom:34px;font-size:.95rem}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.chip{background:#fff;border:1px solid var(--line);color:var(--text);font:inherit;font-weight:600;font-size:.92rem;padding:9px 18px;border-radius:999px;cursor:pointer;transition:background .2s,border-color .2s}
.chip span{color:var(--muted);margin-left:4px;font-weight:400}
.chip:hover{border-color:var(--accent);background:#F3E8D4}
.chip.active{background:var(--grad);border-color:transparent;color:#fff}
.chip.active span{color:#fff}
.shop-status{color:var(--muted);font-size:.9rem;margin-bottom:26px}
form.order{max-width:640px;display:grid;gap:14px}
form.order label{display:grid;gap:6px;font-weight:600;font-size:.95rem}
form.order input,form.order select,form.order textarea{background:#fff;border:1px solid var(--line);color:var(--text);border-radius:14px;padding:13px 14px;font:inherit}
form.order input:focus,form.order select:focus,form.order textarea:focus{outline:2px solid var(--accent);border-color:transparent}

/* cart */
.cart-btn{background:rgba(255,255,255,.75);border:1px solid var(--line);color:var(--text);font:inherit;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;padding:8px 16px;border-radius:999px;cursor:pointer;margin-left:10px;transition:background .2s}
.cart-btn:hover{background:#fff;border-color:var(--accent)}
.cart-count{display:inline-block;min-width:22px;padding:0 6px;margin-left:6px;border-radius:999px;background:#EFE3CE;color:#2b2096;text-align:center;font-size:.8rem}
.cart-btn.has-items .cart-count{background:#B5532F;color:#fff;font-weight:800}
body.noscroll{overflow:hidden}
.cart-overlay{position:fixed;inset:0;background:rgba(59,42,32,.5);backdrop-filter:blur(3px);z-index:40}
.cart-drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);background:linear-gradient(180deg,#F3E8D4,#FFFDF8 40%);border-left:1px solid var(--line);z-index:50;display:flex;flex-direction:column;box-shadow:-12px 0 50px rgba(59,42,32,.3);border-radius:28px 0 0 28px}
.cart-drawer[hidden],.cart-overlay[hidden]{display:none}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:22px 26px;border-bottom:1px solid var(--line)}
.cart-head h2{margin:0;font-size:1.4rem}
.cart-close{background:#EFE3CE;border:0;color:var(--text);font-size:1.6rem;line-height:1;cursor:pointer;width:38px;height:38px;border-radius:50%}
.cart-body{padding:20px 26px 28px;overflow-y:auto;flex:1}
.cart-empty{color:var(--muted);margin-bottom:18px}
.cart-list{list-style:none;display:grid;gap:16px}
.cart-item{display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:start;padding-bottom:16px;border-bottom:1px solid var(--line)}
.cart-item img{width:72px;height:54px;object-fit:cover;border-radius:12px;background:#14104a}
.ci-info{display:grid;gap:4px;font-size:.95rem}
.ci-price{color:var(--muted);font-size:.85rem}
.ci-total{font-weight:800}
.qty{display:flex;align-items:center;gap:8px;margin-top:4px}
.qty button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:#F3E8D4;color:var(--text);font:inherit;font-size:1.1rem;cursor:pointer}
.qty button:hover{border-color:var(--accent)}
.qty .rm{width:auto;padding:0 12px;border-radius:999px;font-size:.8rem;margin-left:6px;color:var(--muted)}
.cart-foot{margin-top:22px}
.subtotal{display:flex;justify-content:space-between;font-size:1.2rem;margin-bottom:8px}
.cart-note{color:var(--muted);font-size:.9rem;margin:8px 0 14px}
.linklike{background:none;border:0;color:var(--accent);font:inherit;cursor:pointer;padding:6px 8px;text-decoration:underline}
.cart-drawer .btn{border:0;cursor:pointer;font-family:inherit}
.cart-drawer form.order{margin-top:10px}
.cart-drawer textarea.summary{width:100%;background:#F3E8D4;color:var(--text);border:1px solid var(--line);border-radius:14px;padding:12px;font-family:ui-monospace,Consolas,monospace;font-size:.8rem}

/* footer */
.site-footer{margin-top:60px;background:linear-gradient(180deg,#4A3326,#2E1F17 70%,#1F1510);color:#F6EEDF;padding:80px 0 30px;border-radius:40px 40px 0 0}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1fr;gap:40px}
.foot-grid h4{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:#EDB391;margin-bottom:14px}
.foot-grid a:not(.brand){display:block;color:#EADFCB;padding:3px 0;font-size:.97rem}
.foot-grid a:not(.brand):hover{color:#fff}
.foot-grid p{color:#EADFCB;font-size:.97rem}
.foot-blurb{margin-top:14px;max-width:300px}
.foot-base{margin-top:50px;padding-top:22px;border-top:1px solid rgba(255,255,255,.2);color:#DCCDB3;font-size:.9rem}

/* scroll reveal (only when JS has tagged the element) */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
.card.reveal.in:hover{transform:translateY(-5px)}
@media(prefers-reduced-motion:reduce){.hero::before,.page-title::before{animation:none}.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

@media(max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}section{padding:72px 0}}
@media(max-width:600px){
 body{font-size:17px}
 .wrap{padding:0 20px}
 header.site .wrap{padding-top:12px;padding-bottom:12px}
 .brand img{height:34px}
 nav a{padding:7px 11px;font-size:.78rem}
 .cart-btn{margin-left:0;padding:7px 12px;font-size:.78rem}
 .hero{padding:120px 0 120px;min-height:0}
 .page-title{padding:120px 0 70px}
 .foot-grid{grid-template-columns:1fr}
 .card{padding:24px}
 .cta-panel{padding:60px 20px;border-radius:28px}
 .cart-drawer{border-radius:0}
 .hero,.page-title{margin-top:-96px}
}
.opts{padding:6px 14px 0;display:grid;gap:6px}
.opts label{font-weight:700;font-size:1rem}

.buymsg{padding:0 14px 12px;font-size:1.05rem;min-height:1.4em;color:#2b2096;font-weight:600}
.buymsg.err{color:#b3261e}
.btn.small:disabled{opacity:.6;cursor:wait}
/* cart: large, easy-to-read type and big buttons */
.cart-btn{font-size:1.05rem;padding:12px 22px;border:2px solid #5b3fd0}
.cart-count{font-size:1.05rem;min-width:28px}
.cart-drawer{width:min(540px,100%)}
.cart-head h2{font-size:1.9rem}
.cart-close{width:48px;height:48px;font-size:2rem}
.cart-item{grid-template-columns:84px 1fr auto}
.cart-item img{width:84px;height:63px}
.ci-info{font-size:1.2rem}
.ci-colors{font-size:1.1rem;font-weight:600;color:var(--text)}
.ci-price{font-size:1.05rem}
.ci-total{font-size:1.3rem}
.qty{gap:12px;flex-wrap:wrap}
.qty button{width:48px;height:48px;font-size:1.6rem}
.qty .qn{font-size:1.5rem;font-weight:800;min-width:2ch;text-align:center}
.qty .rm{width:auto;height:48px;padding:0 18px;font-size:1.05rem;font-weight:700;color:#b3261e;border-color:#b3261e}
.subtotal{font-size:1.7rem}
.cart-note{font-size:1.05rem}
.btn.lg{font-size:1.2rem;padding:18px 40px}
.cart-drawer .linklike{font-size:1.1rem;margin-left:12px}
.cart-msg{font-size:1.15rem;font-weight:600;color:#2b2096;margin-top:14px;min-height:1.4em}
.cart-msg.err{color:#b3261e}
.btn.small.buy{font-size:1.05rem;padding:14px 26px}
/* color swatch dropdown */
.sw{display:inline-block;width:26px;height:26px;border-radius:50%;border:3px solid #3B2A20;box-shadow:0 0 0 2px #fff;flex:none;vertical-align:middle;margin-right:12px}
.sw.empty{background:#fff;border-style:dashed}
.cdd{position:relative;margin-bottom:12px}
.cdd-native{display:none}
.cdd-btn{width:100%;display:flex;align-items:center;justify-content:space-between;font:inherit;font-size:1.2rem;font-weight:600;padding:12px 14px;min-height:56px;background:#fff;color:var(--text);border:3px solid #5b3fd0;border-radius:14px;cursor:pointer;text-align:left}
.cdd-btn:focus-visible,.cdd-list li:focus-visible{outline:4px solid #ffb300;outline-offset:2px}
.cdd-val{display:flex;align-items:center}
.cdd-arrow{font-size:1.4rem;margin-left:10px}
.cdd-list{list-style:none;margin:8px 0 0;padding:6px;background:#fff;border:3px solid #5b3fd0;border-radius:14px}
.cdd-list[hidden]{display:none}
.cdd-list li{display:flex;align-items:center;font-size:1.25rem;font-weight:600;padding:10px 12px;min-height:52px;border-radius:10px;cursor:pointer;color:var(--text)}
.cdd-list li:hover,.cdd-list li:focus{background:#F3E8D4}
.cdd-list li[aria-selected="true"]{background:#EBD9BE;box-shadow:inset 0 0 0 2px #5b3fd0}
.optlabel{display:block;font-weight:700;font-size:1.1rem;margin-bottom:6px}
.ci-col{display:flex;align-items:center}
.ci-col .sw{margin:0 8px 0 4px;width:22px;height:22px}
/* full-page cart + thanks */
.cart-viewfull{margin-top:14px;font-size:1.15rem;font-weight:700}
.cart-viewfull a{text-decoration:underline}
.cp-list{list-style:none;display:grid;gap:22px;margin-bottom:28px}
.cp-item{display:grid;grid-template-columns:150px 1fr auto;gap:22px;align-items:start;background:#fff;border:2px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:0 6px 24px rgba(90,60,30,.07)}
.cp-item img{width:150px;height:112px;object-fit:cover;border-radius:14px;background:#14104a}
.cp-main h2{font-size:1.4rem;font-weight:600;letter-spacing:0;margin:0 0 8px}
.cp-colors{display:grid;gap:6px;font-size:1.25rem;margin-bottom:8px}
.cp-colors .ci-col{font-size:1.25rem}
.cp-colors .sw{width:28px;height:28px}
.cp-each{font-size:1.2rem;color:var(--muted);margin-bottom:10px}
.cp-qty{align-items:center}
.cp-qty label{font-size:1.2rem;font-weight:700;margin-right:6px}
.cp-qty .qin{width:5.5ch;height:52px;font:inherit;font-size:1.5rem;font-weight:800;text-align:center;border:3px solid #5b3fd0;border-radius:12px;background:#fff;color:var(--text)}
.cp-qty button{width:52px;height:52px}
.cp-qty .rm{width:auto;height:52px;font-size:1.15rem}
.cp-total{text-align:right;font-size:1.2rem}
.cp-total strong{display:block;font-size:1.9rem}
.cp-summary{background:#F3E8D4;border:2px solid #B9805F;border-radius:var(--r);padding:24px}
.cp-summary .subtotal{font-size:2rem}
.cp-summary .cart-note{font-size:1.2rem;color:var(--text)}
.cp-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:8px}
.cp-actions .btn{border:0;cursor:pointer;font-family:inherit}
.cp-actions .btn.ghost{border:2px solid #5b3fd0;background:#fff;color:#2b2096}
.cp-actions .linklike{font-size:1.2rem}
.cp-empty{background:#fff;border:2px solid var(--line);border-radius:var(--r);padding:40px 28px;text-align:center}
.cp-empty h2{font-size:1.6rem;font-weight:600;letter-spacing:0;margin-bottom:10px}
.cp-empty p{font-size:1.3rem;margin-bottom:24px;color:var(--text)}
.thanks h2{font-size:2rem;margin-bottom:12px}
.thanks p{font-size:1.3rem;margin-bottom:18px;color:var(--text)}
@media (max-width:720px){.cp-item{grid-template-columns:1fr}.cp-item img{width:100%;height:auto;aspect-ratio:4/3}.cp-total{text-align:left}}
/* cart page headings: modestly smaller and lighter */
.cartpage .page-title h1{font-size:clamp(1.8rem,4.8vw,3rem);font-weight:600}
.cp-summary h2{font-size:1.4rem;font-weight:600;letter-spacing:0;margin:0 0 12px}
/* thanks page + footer contact */
.thanks-ref{background:#F3E8D4;border:2px solid #B9805F;border-radius:var(--r);padding:18px 22px}
.thanks-ref strong{font-size:2rem;letter-spacing:.12em}
.thanks-ref span{font-size:1.1rem}
.thanks-keep{font-size:1.2rem}
.thanks-keep .linklike{font-size:1.2rem}
.thanks a:not(.btn){text-decoration:underline}
.foot-grid p a{display:inline;color:#fff;text-decoration:underline;padding:0}
/* thanks page: centered block and text (scoped to this page) */
.thankspage .page-title .wrap{text-align:center}
.thankspage .page-title .lead{margin-left:auto;margin-right:auto}
.thanks{max-width:760px;margin-left:auto;margin-right:auto;text-align:center}
.thanks-ref{margin-left:auto;margin-right:auto}
.thanks .btn{margin-left:auto;margin-right:auto}
@media (max-width:600px){.thanks{padding:24px 18px}.thanks h2{font-size:1.6rem}.thanks p{font-size:1.15rem}.thanks-ref strong{font-size:1.6rem;letter-spacing:.08em}}
.subtotal.ship{font-size:1.1rem;font-weight:600}
.subtotal.grand{font-size:1.4rem;border-top:2px solid var(--line);padding-top:8px}
.cp-summary .subtotal.ship{font-size:1.25rem}
.cp-summary .subtotal.grand{font-size:2rem}

/* FM-174 phone polish (<=600px only; desktop unchanged). Goal: every tap target about 48x48px or bigger, easy cart on a phone. */
@media (max-width:600px){
 header.site .wrap{gap:4px 8px}
 .brand{display:flex;align-items:center;min-height:48px}
 nav{gap:8px}
 nav a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 16px;font-size:.9rem}
 .cart-btn{min-height:48px;padding:0 22px;font-size:1.05rem}
 .btn,.btn.small{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:48px}
 .btn.small{padding:12px 22px}
 .chip{display:inline-flex;align-items:center;min-height:48px;padding:0 18px}
 .filters{gap:12px}
 .linklike,.cart-drawer .linklike,.cp-actions .linklike{display:inline-flex;align-items:center;min-height:48px;padding:0 14px}
 a.more,.card h3 a{display:inline-flex;align-items:center;min-height:48px}
 .foot-grid a:not(.brand),.foot-grid p a{display:flex;align-items:center;min-height:48px;padding:0;overflow-wrap:anywhere}
 .foot-grid .brand{min-height:48px}
 .foot-base a{display:inline-flex;align-items:center;min-height:48px;padding:0 8px}
 /* cart: compact item rows, big controls, readable totals */
 .cart-body{padding:16px 16px 0}
 .cart-head{padding:14px 16px}
 .cart-item{grid-template-columns:72px minmax(0,1fr);gap:10px}
 .cart-item img{width:72px;height:54px}
 .ci-total{grid-column:1/-1;text-align:right}
 .cp-item{grid-template-columns:80px minmax(0,1fr);gap:12px;padding:14px}
 .cp-item img{width:80px;height:60px;aspect-ratio:auto}
 .ci-col{flex-wrap:wrap}
 .cp-colors,.cp-colors .ci-col{font-size:1.05rem}
 .cp-each{font-size:1.05rem}
 .cp-main h2{font-size:1.2rem}
 .cp-qty label{flex:1 1 100%;font-size:1.05rem;margin:0}
 .cp-total{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;text-align:left;font-size:1.1rem}
 .cp-total strong{display:inline;font-size:1.5rem}
 .cp-summary{padding:16px}
 .subtotal,.cp-summary .subtotal{font-size:1.2rem;gap:12px;align-items:baseline}
 .subtotal strong{white-space:nowrap}
 .subtotal.grand,.cp-summary .subtotal.grand{font-size:1.6rem}
 .cp-summary .cart-note,.cart-note{font-size:1.05rem}
 .btn.lg{font-size:1.15rem;padding:14px 24px}
 .cp-actions .btn,.cart-foot .btn.lg{width:100%}
 .cart-viewfull a{display:inline-flex;align-items:center;min-height:48px}
 nav a.signin-link{order:11}
 nav a.signin-link .who{max-width:max(5em,min(14em,calc(100vw - 110px)))}
}
@media (max-width:360px){
 header.site .cart-btn{padding:0 12px;letter-spacing:.02em;font-size:.92rem}
}

/* FM-179 font-polish: plain system font on the account screens (sign-in, signed-in dashboard/order history), the cart page
   (items, coupon, pickup ZIP, totals, checkout), the slide-out cart drawer and thanks.html. Header, nav, footer and every other page keep Orbitron/Audiowide. */
:root{--font-sys:"Segoe UI",Verdana,Arial,Helvetica,sans-serif}
:is(body.acct:not(.privacy) main,body.cartpage .page-title,body.cartpage section,body.thankspage .page-title,body.thankspage section,.cart-drawer),
:is(body.acct:not(.privacy) main,body.cartpage .page-title,body.cartpage section,body.thankspage .page-title,body.thankspage section,.cart-drawer) *{font-family:var(--font-sys);font-synthesis:weight style;font-variant-numeric:tabular-nums}
:is(body.acct:not(.privacy) main,body.cartpage .page-title,body.cartpage section,body.thankspage .page-title,body.thankspage section,.cart-drawer) :is(h1,h2,h3,h4,h5,h6){font-weight:700}

/* FM-185 the Cart button sits in the logo row, far right (cart.js moves it out of the nav and adds .has-cart to the header).
   Row 1 = logo (left) + Cart (right); row 2 = the nav links (as before the nav already sat on its own row under the logo). Cart stays >=48px tall. */
header.site .cart-btn{min-height:48px;margin-left:0;flex:0 0 auto}
header.site.has-cart .wrap>.brand{order:1;flex:1 1 0;min-width:0}
header.site.has-cart .wrap>.brand img{max-width:100%;object-fit:contain;object-position:left center}
header.site.has-cart .wrap>.cart-btn{order:2}
header.site.has-cart .wrap>nav{order:3;flex:1 0 100%}
@media(max-width:600px){
 header.site .cart-btn{padding:0 11px;font-size:.95rem;letter-spacing:.02em}
 header.site .cart-count{font-size:.95rem;min-width:24px;margin-left:5px}
}

/* FM-186 title -> first content: about half the old space on every page that has a .page-title band (all pages except home, which has a hero;
   models.html has its own inline values, identical to the "with lead" ones). account / account-sample / privacy have no title band (their h1 sits
   inside the panel, already only ~18px above its text) so nothing changes there. :has() is only used to tell titles with a lead line from titles without. */
.page-title{padding-bottom:40px}
.page-title:has(.lead){padding-bottom:20px}
.page-title + section,.page-title + main{padding-top:55px}
.page-title:has(.lead) + section{padding-top:36px}
.page-title:has(.lead) + main{padding-top:20px}
@media(max-width:600px){
 .page-title{padding-bottom:30px}
 .page-title:has(.lead){padding-bottom:10px}
 .page-title + section,.page-title + main{padding-top:40px}
 .page-title:has(.lead) + section{padding-top:26px}
 .page-title:has(.lead) + main{padding-top:14px}
}

/* FM-187 the logo + Cart row sits fully on white: the sticky header gets a white zone (logo row height + a little room), then fades out, so the blue
   hero / page-title fade (which starts under the header) can no longer show behind the logo or Cart. Pages without a blue fade are white anyway.
   The scrolled header keeps its own translucent white (header.site.scrolled is more specific). */
/* FM-197 / FM-HF1 header fade: the solid cream zone ends in the small gap right under the logo + Cart row and the fade starts there, so the first row of nav links sits ON the fade
   (chosen by Scott: "version A"; the alternate version B and its switch were removed in fm198). Cream is #FBF6EC. The .scrolled header (own translucent cream + border) is unchanged.
   --hfade-a-solid = where the solid zone ends, --hfade-a-len = length of the fade (the hero pull-up rule at the end of this file also uses --hfade-a-solid). */
:root{--hfade-a-solid:88px;--hfade-a-len:36px}
header.site{background:linear-gradient(180deg,#FBF6EC 0,#FBF6EC var(--hfade-a-solid),rgba(251,246,236,0) calc(var(--hfade-a-solid) + var(--hfade-a-len)))}
@media(max-width:600px){:root{--hfade-a-solid:71px;--hfade-a-len:30px}}

/* FM-188 move the top row (logo + Cart) down a little from the page's top edge: +12px of header top padding on desktop (16 -> 28), +9px on phones (12 -> 21).
   The FM-187 white zone above was grown by the same amount (84 -> 96, 70 -> 79) so logo + Cart still end on white. */
header.site .wrap{padding-top:28px}
@media(max-width:600px){header.site .wrap{padding-top:21px}}

/* FM-189 signed-in header link = account menu (signin.js builds it: link + .acct-pop with "My account" / "Sign out"). Signed out: nothing here applies. */
nav .acct-wrap{order:2;position:relative;display:flex;flex:0 1 auto;min-width:0;max-width:100%}
nav a.signin-link.signed-in{display:inline-flex;align-items:center;gap:7px;text-decoration:underline;cursor:pointer}
nav a.signin-link.signed-in[aria-expanded="true"]{background:rgba(91,63,208,.14);color:var(--text);text-decoration:none}
nav a.signin-link .caret{flex:0 0 auto;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid currentColor;transition:transform .15s}
nav a.signin-link[aria-expanded="true"] .caret{transform:rotate(180deg)}
.acct-pop{position:absolute;top:100%;left:0;z-index:60;min-width:200px;max-width:calc(100vw - 16px);padding-top:8px}   /* the padding is the hover bridge: the pointer never leaves the menu on its way down */
.acct-pop[hidden]{display:none}
.acct-box{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 30px rgba(40,25,120,.2);padding:6px}
nav .acct-pop .acct-item{display:flex;align-items:center;justify-content:flex-start;width:100%;min-height:48px;margin:0;padding:0 16px;border:0;border-radius:10px;background:transparent;
  font:600 1.125rem/1.3 var(--font-sys);letter-spacing:0;text-transform:none;text-decoration:none;text-align:left;color:var(--text);white-space:nowrap;cursor:pointer;box-sizing:border-box}
nav .acct-pop .acct-item:hover,nav .acct-pop .acct-item:focus-visible{background:rgba(91,63,208,.12);color:#2b2096;text-decoration:none}
nav .acct-pop .acct-item:focus-visible{outline:2px solid #5b3fd0;outline-offset:-2px}
@media (max-width:600px){nav .acct-wrap{order:11;flex:1 1 5.5rem}}   /* small basis: the pill takes whatever room is left on the last row (name ellipsizes) instead of forcing an extra row */


/* FM-191 palette: cream #FBF6EC / sand #F3E8D4 backgrounds; terracotta #B5532F (primary buttons, step numbers, cart badge, active chip); olive #5E6C30 (eyebrows, category labels, badges);
   blue #1D55B8 / #17418F (hero accent word, hero eyebrow, fade tint); purple #2b2096 / #5b3fd0 (links, Sign in, ghost buttons, cart outline, dropdown highlight); text #3B2A20, muted #5E4A3C.
   Footer text on pages whose main text rule (account.css .acct p) would otherwise paint dark text on the dark footer: */
.site-footer .foot-grid p,.acct .site-footer .foot-grid p{color:#EADFCB}
.acct .site-footer .foot-grid p a{color:#fff}

/* FM-192 sign-in pop-up (signin.js builds it). Same email-link form as account.html. System font stack, >=18px, controls >=48px, fits 320px. */
.si-overlay{position:fixed;inset:0;z-index:200;background:rgba(59,42,32,.55);display:flex;align-items:center;justify-content:center;padding:12px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.si-overlay[hidden]{display:none}
.si-dialog{position:relative;box-sizing:border-box;width:min(480px,100%);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;margin:auto;background:#fff;color:var(--text);border:3px solid #5b3fd0;border-radius:22px;padding:28px 24px 24px;box-shadow:0 20px 60px rgba(40,25,20,.45);font-family:var(--font-sys);font-size:18px;line-height:1.5;text-align:left}
.si-dialog,.si-dialog *{font-family:var(--font-sys);font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0}
.si-dialog:focus{outline:none}
.si-close{position:absolute;top:8px;right:8px;width:48px;height:48px;border:0;border-radius:50%;background:transparent;color:var(--text);font-size:2rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.si-close:hover{background:rgba(91,63,208,.12)}
.si-title{font-size:1.6rem;line-height:1.2;font-weight:700;margin:0 48px 12px 0;color:var(--text)}
.si-lead{font-size:1.125rem;margin:0 0 14px;color:var(--text)}
.si-err{background:#fff0f0;border:3px solid #b00020;border-radius:14px;padding:12px 16px;color:#600010;font-weight:700;font-size:1.125rem;margin:0 0 16px}
.si-err[hidden]{display:none}
.si-form{margin:0}
.si-label{display:block;font-size:1.125rem;font-weight:700;margin:0 0 6px}
.si-input{display:block;width:100%;box-sizing:border-box;min-height:56px;font-size:1.125rem;padding:12px 14px;border:3px solid var(--text);border-radius:14px;background:#fff;color:#000;margin:0 0 16px}
.si-input:focus,.si-go:focus-visible,.si-alt:focus-visible,.si-close:focus-visible,.si-note a:focus-visible{outline:4px solid #ffbf00;outline-offset:2px}
.si-go,.si-alt{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;box-sizing:border-box;font-size:1.125rem;font-weight:800;border-radius:999px;cursor:pointer;padding:12px 18px;text-align:center;margin:0}
.si-go{background:var(--grad);color:#fff;border:3px solid transparent}
.si-go:hover:not(:disabled){background:#8E3F22}
.si-go:disabled{opacity:.7;cursor:wait}
.si-alt{background:#fff;color:#2b2096;border:3px solid #2b2096;margin-top:12px}
.si-alt:hover{background:#F3E8D4}
.si-note{font-size:1.125rem;color:var(--muted);margin:16px 0 0}
.si-note a{color:#2b2096;text-decoration:underline;display:inline-flex;align-items:center;min-height:48px}
.si-mail{font-size:3rem;line-height:1;margin:4px 0 8px}
@media (max-width:360px){.si-dialog{padding:24px 16px 18px;border-radius:18px}.si-title{font-size:1.4rem}}

/* FM-193 more blue + purple on top of the fm191 cream/terracotta/olive palette (rollback copy of the fm191 look: /workspace/gen/fm191-site).
   Roles: cream #FBF6EC page ground; terracotta #B5532F primary buy buttons / badge; olive #5E6C30 product category + badges;
   purple #2b2096 / #5b3fd0 nav links, active states, eyebrows, card borders + hover, ghost buttons, cart outline, step numbers, footer;
   blue #1D55B8 / #17418F hero accent word, step numbers, soft sections, fade; deep indigo #2a2155 headings; #34296A hero/lead text. */
:root{--line:rgba(80,60,170,.22);--head:#2a2155}
h1,h2{color:var(--head)}
nav a{color:#2b2096}
nav a:hover{color:#1d1470;background:rgba(43,32,150,.1)}
nav a.active{color:#1d1470;background:rgba(43,32,150,.14)}
.eyebrow{color:#5b3fd0}
.hero p.tag,.page-title .lead,.big{color:#34296A}
.hero::before,.page-title::before{background:
radial-gradient(52% 58% at 14% 18%,rgba(110,160,255,.8),transparent 72%),
radial-gradient(46% 52% at 50% 6%,rgba(160,135,250,.5),transparent 70%),
radial-gradient(44% 50% at 88% 16%,rgba(232,155,115,.5),transparent 70%),
radial-gradient(55% 50% at 60% 82%,rgba(120,150,235,.4),transparent 70%),
linear-gradient(180deg,#DCE3F7 0%,#EFE9E6 58%,#FBF6EC 100%);background-size:140% 140%}
section.soft{background:linear-gradient(180deg,#FBF6EC,#EDEAF9 30%,#E6EEF8 70%,#FBF6EC)}
.card{border-color:rgba(91,63,208,.26)}
.card:hover{border-color:rgba(91,63,208,.7);box-shadow:0 18px 44px rgba(43,32,150,.18)}
.icon{border-color:rgba(91,63,208,.35)}
.steps .card::before{background:linear-gradient(135deg,#2b2096,#1D55B8)}
.btn.ghost{background:#E8EEFB;color:#2b2096;border-color:#2b2096}
.btn.ghost:hover{background:#2b2096;color:#fff;box-shadow:none;filter:none}
.cart-btn{background:#E8EEFB;color:#2b2096;border-color:#5b3fd0}
.cart-btn:hover{background:#fff}
.cart-count{background:#D8DFF6;color:#2b2096}
.cart-btn.has-items .cart-count{background:#B5532F;color:#fff}
.chip{border-color:rgba(91,63,208,.35)}
.chip:hover{background:#ECEBFA}
.chip.active{border-color:transparent}
.warn{background:#ECEBFA;border:1px solid #9a8cf5;color:#2b2096}
.note{background:#EDEBFA;border-color:rgba(91,63,208,.3)}
.cart-drawer{background:linear-gradient(180deg,#ECEBFA,#FFFDF8 40%)}
.cart-close,.qty button{background:#E6E3F7}
.cp-summary,.thanks-ref{background:#EDEBFA;border-color:#9a8cf5}
.cdd-list li:hover,.cdd-list li:focus{background:#ECEBFA}
.cdd-list li[aria-selected="true"]{background:#DDD6FF}
.card .mthumb{background:#EFEDFA}
code{background:#E6E3F7}
.site-footer{background:linear-gradient(180deg,#34267F,#1C1458 65%,#120D33);color:#F1EDFA}
.foot-grid a:not(.brand),.foot-grid p,.site-footer .foot-grid p,.acct .site-footer .foot-grid p{color:#E4E0F6}
.foot-base{color:#D3CDEE;border-top-color:rgba(255,255,255,.22)}
.si-alt:hover{background:#ECEBFA}

/* FM-197 pull the hero / page-title colour up so it starts at the fade (variant A) however many rows the nav links wrap to.
   Old rule: the hero overlaps the header by a fixed 77px (96px on phones). When the header is taller than that (wrapped links), the blue began part-way down the link rows
   with a hard edge. Now the overlap grows to (header height - fade start) when needed, and the hero's top padding grows by the same amount, so the hero text does not move.
   --hdr-h is set by site.js; without it everything is as before. */
:root{--hero-pull:77px}
@media(max-width:600px){:root{--hero-pull:96px}}
.hero,.page-title{--hero-extra:max(0px,calc(var(--hdr-h,0px) - var(--hfade-a-solid) - var(--hero-pull)));margin-top:calc(-1*var(--hero-pull) - var(--hero-extra))}
.hero{padding-top:calc(150px + var(--hero-extra));min-height:calc(min(100vh,860px) + var(--hero-extra))}
.page-title{padding-top:calc(150px + var(--hero-extra))}
@media(max-width:600px){.hero{padding-top:calc(120px + var(--hero-extra));min-height:0}.page-title{padding-top:calc(120px + var(--hero-extra))}}

/* products tool: sold-out items (data/catalog.js sets soldOut when PRODUCTS_SOLDOUT_MODE=flag) */
.product.soldout .pimg img{opacity:.5}
.badge.sold{background:#8b0000;color:#fff}
.btn[disabled]{opacity:.6;cursor:not-allowed}

/* FM-PT1 (products v2): sold-out items are SHOWN with a large badge + icon; Buy is disabled and says "Sold out" */
.badge.sold{display:inline-flex;align-items:center;gap:8px;top:10px;left:10px;padding:8px 16px;font-size:1.1rem;letter-spacing:.06em;background:#7a0000;color:#fff;border:3px solid #fff;box-shadow:0 0 0 3px #7a0000,0 3px 10px rgba(0,0,0,.35)}
.badge.sold .soldx{font-size:1.2rem;line-height:1}
.product.soldout .pimg img{opacity:.55;filter:grayscale(.6)}
.product.soldout h3{color:#444}
.btn.soldbtn,.btn.soldbtn[disabled]{background:#3a3a3a;color:#fff;border-color:#3a3a3a;opacity:1;cursor:not-allowed;text-decoration:none;box-shadow:none;transform:none}
.soldnote{margin:8px 0 0;font-weight:800;font-size:1rem;color:#7a0000}
.sold-flag{display:block;margin:6px 0;padding:6px 12px;border:3px solid #7a0000;border-radius:10px;background:#fff0f0;color:#7a0000;font-weight:800;font-size:1rem}
.cart-item.is-sold,.cp-item.is-sold{border:3px solid #7a0000;border-radius:12px;background:#fff8f8}
.cart-item.is-sold img,.cp-item.is-sold img{opacity:.55;filter:grayscale(.6)}
.cart-drawer .btn[disabled],.cp-actions .btn[disabled],.cs-bar .btn[disabled]{opacity:1;background:#3a3a3a;color:#fff;cursor:not-allowed}

/* ====================================================================================================================
   FM-200 web-rec-1 + mobile-nav-1 (staging). One block, appended last. Remove this block (and the matching ?v=fm200 tags) to roll the visual changes back.
   ==================================================================================================================== */

/* (1) Skip link: hidden until it gets keyboard focus. <main id="main" tabindex="-1"> is its target on every page. */
.skip-link{position:absolute;left:12px;top:-120px;z-index:1000;display:inline-flex;align-items:center;min-height:48px;padding:10px 20px;background:#fff;color:#2b2096;border:3px solid #2b2096;border-radius:12px;
  font:700 1.125rem/1.2 var(--font-sys);letter-spacing:0;text-transform:none;text-decoration:underline}
.skip-link:focus,.skip-link:focus-visible{top:12px}
main:focus{outline:none}

/* (2) One global, high-visibility focus ring (the amber 4px outline already used on the colour dropdown and the sign-in dialog) for every link, button, field and chip.
   The thin dark ring inside the amber one keeps it visible on the cream pages as well as on the dark footer. More specific focus rules elsewhere (account / custom print / dialogs) still win. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:not([tabindex="-1"]):focus-visible,
.btn:focus-visible,.chip:focus-visible,.cart-btn:focus-visible,nav a:focus-visible,.site-footer a:focus-visible{outline:4px solid #ffb300;outline-offset:2px;box-shadow:0 0 0 2px #3B2A20}

/* (3) Readable body copy: the system font stack already used on the cart / account / thanks pages, for paragraphs, lists, notes and form fields.
   Orbitron stays on headings and the logo; the display font (Audiowide) stays on short labels only (menu, buttons, filters, eyebrows, prices, category tags). Privacy keeps its own look. */
body:not(.privacy) :is(main p:not(.eyebrow),main li,main dd,main td,main th,main label,main input,main select,main textarea,.lead,.big,.fine,.note,.warn,.card p,.foot-blurb,.foot-grid p,.foot-base,.shop-status,.buymsg,.pickup-note){font-family:var(--font-sys)}

/* (5/6) Free-pickup line under the home hero buttons */
.pickup-note{margin-top:24px;font-size:1.15rem;color:#4A372B;text-align:center}
.pickup-note a{font-weight:700;text-decoration:underline}

/* (10) Smallest text raised to at least 1rem (16px). Same selectors as the originals so layout rules around them are untouched. */
nav a{font-size:1rem}
.product .cat{font-size:1rem}
.badge{font-size:1rem}
.fine{font-size:1rem}
.eyebrow{font-size:1rem}
.btn{font-size:1rem}
.btn.small{font-size:1rem}
.chip{font-size:1rem}
.more{font-size:1rem}
.product p{font-size:1rem}
.warn{font-size:1rem}
.shop-status{font-size:1rem}
.cart-note{font-size:1rem}
.foot-base{font-size:1rem}
.foot-grid h4{font-size:1rem}
.cart-btn{font-size:1rem}
@media (max-width:600px){
 nav a{font-size:1rem}
 header.site .cart-btn{font-size:1rem}
 header.site .cart-count{font-size:1rem}
}
@media (max-width:360px){header.site .cart-btn{font-size:1rem}}

/* (10) Text size toggle (signin.js adds the button to the footer and sets html.gt-large; remembered in localStorage) */
html.gt-large{font-size:20px}
html.gt-large body{font-size:22px}
.ts-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin:0 0 0 6px;padding:0 20px;border:2px solid #fff;border-radius:999px;background:transparent;color:#fff;
  font:700 1rem/1.2 var(--font-sys);letter-spacing:0;text-transform:none;cursor:pointer}
.ts-btn:hover{background:rgba(255,255,255,.18)}

/* (mobile-nav-1) Phone menu. signin.js builds the "Menu" button and the #site-menu panel under 700px; without JavaScript none of this exists and the links stay in the header. */
.menu-btn,.mnav-panel{display:none}
@media (max-width:699px){
 header.site.has-menu .menu-btn{order:1;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;min-width:52px;padding:0 22px;border:3px solid #5b3fd0;border-radius:999px;
   background:#fff;color:#2b2096;font:inherit;font-size:1.15rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
 header.site.has-menu .menu-btn[aria-expanded="true"]{background:#2b2096;color:#fff}
 .menu-bars,.menu-bars::before,.menu-bars::after{display:block;width:22px;height:3px;border-radius:2px;background:currentColor;content:""}
 .menu-bars{position:relative}
 .menu-bars::before{position:absolute;left:0;top:-7px}
 .menu-bars::after{position:absolute;left:0;top:7px}
 header.site.has-menu .mnav-panel{display:block;position:absolute;left:0;right:0;top:100%;z-index:40;box-sizing:border-box;padding:10px 16px 14px;background:#FBF6EC;border-top:1px solid var(--line);border-bottom:4px solid #5b3fd0;
   box-shadow:0 14px 30px rgba(40,25,120,.25);max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px);overflow-y:auto}
 header.site.has-menu .mnav-panel[hidden]{display:none}
 header.site.has-menu .mnav-panel a{display:flex;align-items:center;justify-content:flex-start;min-height:56px;margin:2px 0;padding:0 20px;font-size:1.15rem;white-space:nowrap}
 header.site.has-menu.menu-open{background:#FBF6EC}
}
.foot-grid a:not(.brand),.foot-grid p{font-size:1rem}