
:root{--blue:#2148A4;--ink:#090909;--paper:#fff;--soft:#f4f4f1;--line:#d7d7d2;--muted:#6f6f6a;--max:1600px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}
.announcement{height:28px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;letter-spacing:.15em}
.site-header{height:66px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:170px 1fr 170px;align-items:center;padding:0 24px;position:sticky;top:0;background:#fff;z-index:40}.brand img{width:94px;height:52px;object-fit:contain}.desktop-nav{display:flex;justify-content:center;gap:24px;font-size:10px;font-weight:800;letter-spacing:.07em}.desktop-nav a.active,.desktop-nav a:hover,.tools button:hover{color:var(--blue)}.tools{display:flex;justify-content:flex-end;gap:16px}.tools button,.menu-btn{border:0;background:none;font-size:9px;font-weight:800;letter-spacing:.06em}.menu-btn{display:none}
.page{max-width:var(--max);margin:auto}.hero-mini{display:grid;grid-template-columns:1.2fr .8fr;min-height:260px;background:var(--blue);color:#fff}.hero-mini .copy{padding:38px 34px;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:9px;font-weight:800;letter-spacing:.15em;margin-bottom:12px}.hero-mini h1{font-size:clamp(34px,5vw,72px);line-height:.86;letter-spacing:-.07em;margin:0}.hero-mini p{font-size:12px;line-height:1.45;max-width:410px;margin:18px 0 0}.hero-mini .mark{display:flex;align-items:center;justify-content:center;border-left:1px solid rgba(255,255,255,.25);position:relative;overflow:hidden}.hero-stamp{width:220px;height:220px;border:1px solid rgba(255,255,255,.42);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:rotate(-8deg);letter-spacing:.12em}.hero-stamp span{font-size:10px;font-weight:800}.hero-stamp strong{font-size:26px;line-height:.9;letter-spacing:-.04em;margin:8px 0}
.section{padding:48px 24px}.section-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:12px;margin-bottom:18px}.section-head h2{font-size:42px;line-height:.9;letter-spacing:-.06em;margin:0}.section-head a{font-size:9px;font-weight:800;letter-spacing:.08em}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 10px}.card{min-width:0}.visual{aspect-ratio:1/1.18;background:var(--soft);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.visual:before{content:"";position:absolute;width:44%;height:44%;border:1px solid rgba(33,72,164,.16);border-radius:50%}.visual img{width:30%;max-width:130px;position:relative;z-index:1}.visual .code{position:absolute;left:10px;bottom:9px;font-size:8px;font-weight:800;letter-spacing:.12em}.badge{position:absolute;left:9px;top:9px;background:#fff;padding:5px 6px;font-size:8px;font-weight:800;letter-spacing:.06em;z-index:2}.card-info{padding:9px 1px 0}.name{font-size:11px;font-weight:800;letter-spacing:.01em}.meta{font-size:9px;color:var(--muted);margin-top:4px}.price{font-size:10px;font-weight:800;margin-top:6px}.add{display:block;width:100%;height:38px;margin-top:9px;background:var(--ink);color:#fff;border:0;font-size:9px;font-weight:800;letter-spacing:.07em}.add:hover{background:var(--blue)}
.category-band{display:grid;grid-template-columns:100px 1fr 160px;gap:20px;align-items:center;background:var(--soft);padding:42px 24px;margin-top:16px}.category-band .num{font-size:11px;font-weight:800}.category-band h3{font-size:clamp(35px,5vw,64px);line-height:.88;letter-spacing:-.07em;margin:0}.category-band a{justify-self:end;border:1px solid var(--ink);padding:13px 16px;font-size:9px;font-weight:800;letter-spacing:.08em}.category-band a:hover{background:var(--ink);color:#fff}
.people{padding:46px 24px}.people-head{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:16px}.people h2{font-size:clamp(34px,4.2vw,58px);line-height:.9;letter-spacing:-.065em;margin:0}.people-head p{max-width:360px;font-size:12px;line-height:1.4;margin:0}.people-reels{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}.reel-frame{flex:0 0 clamp(138px,15vw,180px);aspect-ratio:9/16;background:var(--soft);scroll-snap-align:start;border:1px solid var(--line);overflow:hidden}.reel-placeholder{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.reel-placeholder img{width:34%;max-width:78px}.reel-placeholder span{position:absolute;left:10px;bottom:10px;font-size:8px;font-weight:800;letter-spacing:.1em}.people-link{margin:12px 0 0;font-size:9px;font-weight:800}.people-link a{border-bottom:1px solid var(--ink);padding-bottom:3px}
.brand-block{background:var(--ink);color:#fff;padding:44px 24px;display:grid;grid-template-columns:1fr 1fr;gap:30px}.brand-block h2{font-size:clamp(32px,4.4vw,56px);line-height:.9;letter-spacing:-.065em;margin:0;max-width:560px}.brand-block p{max-width:390px;font-size:12px;line-height:1.45;margin:0}.newsletter{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding:42px 24px;border-top:1px solid var(--line)}.newsletter h2{font-size:clamp(30px,4vw,50px);line-height:.9;letter-spacing:-.065em;margin:0}.newsletter-copy{font-size:11px;line-height:1.4;color:var(--muted);margin:10px 0 0}.newsletter form{display:flex;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:8px}.newsletter input{border:0;outline:0;width:100%;font-size:11px}.newsletter button{border:0;background:none;font-size:9px;font-weight:800;letter-spacing:.08em}
footer{background:var(--soft);padding:54px 24px 20px}.footer-grid{max-width:var(--max);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}.footer-brand img{width:100px;height:58px;object-fit:contain}.footer-brand p{font-size:10px;color:var(--muted)}.footer-col{display:flex;flex-direction:column;gap:10px;font-size:10px}.footer-col b{font-size:9px;letter-spacing:.1em;margin-bottom:4px}.footer-bottom{max-width:var(--max);margin:45px auto 0;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:8px;letter-spacing:.08em}
.drawer{position:fixed;right:0;top:0;height:100dvh;width:min(460px,92vw);background:#fff;z-index:100;transform:translateX(100%);transition:.25s ease;display:flex;flex-direction:column;padding:18px}.drawer.open{transform:none}.drawer-head{display:flex;justify-content:space-between;border-bottom:1px solid var(--ink);padding-bottom:14px;font-size:10px;font-weight:800}.drawer-head button{border:0;background:none;font-size:22px}.searchbox{margin:28px 0 14px;border:0;border-bottom:1px solid var(--ink);outline:0;padding:12px 0;font-size:16px;width:100%}.scrim{position:fixed;inset:0;background:rgba(0,0,0,.28);z-index:90}.bag-list{overflow:auto;flex:1}.bag-row{display:grid;grid-template-columns:82px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}.bag-img{background:var(--soft);aspect-ratio:1;display:flex;align-items:center;justify-content:center}.bag-img img{width:38%}.bag-row h4{font-size:10px;margin:0 0 7px}.bag-row p{font-size:9px;color:var(--muted);margin:4px 0}.remove{border:0;background:none;padding:0;font-size:8px;font-weight:800}.bag-footer{border-top:1px solid var(--ink);padding-top:14px}.bag-footer div{display:flex;justify-content:space-between;font-size:11px;font-weight:800}.checkout{height:48px;width:100%;background:var(--ink);color:#fff;border:0;margin-top:12px;font-size:10px;font-weight:800;letter-spacing:.08em}
.product-page{display:grid;grid-template-columns:1.15fr .85fr;min-height:calc(100dvh - 94px)}.product-image{background:var(--soft);display:flex;align-items:center;justify-content:center;min-height:620px;position:relative}.product-image:before{content:"";width:34%;height:34%;border:1px solid rgba(33,72,164,.16);border-radius:50%;position:absolute}.product-image img{width:22%;max-width:180px;position:relative}.product-info-page{padding:55px 5vw;display:flex;flex-direction:column;justify-content:center}.product-info-page h1{font-size:clamp(38px,5vw,70px);line-height:.87;letter-spacing:-.07em;margin:0}.product-info-page .pprice{font-size:13px;font-weight:800;margin:18px 0}.select-label{font-size:9px;font-weight:800;letter-spacing:.1em;margin:22px 0 8px}.sizes{display:flex;gap:7px;flex-wrap:wrap}.size{min-width:48px;height:42px;border:1px solid var(--line);background:#fff;font-size:9px;font-weight:800}.size.active,.size:hover{border-color:var(--ink);background:var(--ink);color:#fff}.buy{height:52px;background:var(--blue);color:#fff;border:0;font-size:10px;font-weight:800;letter-spacing:.1em;margin-top:18px}.details{margin-top:25px;border-top:1px solid var(--line)}.details div{padding:13px 0;border-bottom:1px solid var(--line);font-size:10px;display:flex;justify-content:space-between}.notice{font-size:9px;color:var(--muted);line-height:1.5;margin-top:14px}
.collection-hero{padding:48px 24px 34px;border-bottom:1px solid var(--ink)}.collection-hero h1{font-size:clamp(54px,9vw,130px);line-height:.78;letter-spacing:-.08em;margin:0}.collection-hero p{max-width:480px;font-size:12px;line-height:1.5;margin:22px 0 0}.collection-tools{display:flex;justify-content:space-between;align-items:center;padding:13px 24px;border-bottom:1px solid var(--line);font-size:9px;font-weight:800}.collection-tools select{border:0;background:none;font-size:9px;font-weight:800}
.standard{padding:70px 24px;max-width:900px;margin:auto}.standard h1{font-size:64px;line-height:.84;letter-spacing:-.07em;margin:0 0 35px}.standard h2{font-size:25px;letter-spacing:-.04em;margin:35px 0 10px}.standard p,.standard li{font-size:12px;line-height:1.7;color:#333}.standard ul{padding-left:20px}

/* LOCKED OHGAWD UI — Instagram Reels */
.instagram-reels{padding:46px 24px;border-top:1px solid var(--line)}
.instagram-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:12px;margin-bottom:14px}
.instagram-head h2{font-size:42px;line-height:.9;letter-spacing:-.06em;margin:0}
.instagram-head a{font-size:9px;font-weight:800;letter-spacing:.08em}
.reels-track{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;scrollbar-width:none}
.reels-track::-webkit-scrollbar{display:none}
.reel-card{flex:0 0 clamp(150px,15vw,190px);aspect-ratio:9/16;background:var(--soft);border:1px solid var(--line);position:relative;overflow:hidden;scroll-snap-align:start}
.reel-card img{width:100%;height:100%;object-fit:cover;display:block}
.reel-fallback{height:100%;display:flex;align-items:center;justify-content:center;position:relative}
.reel-fallback img{width:34%;height:auto;object-fit:contain}
.reel-fallback span{position:absolute;left:9px;bottom:9px;font-size:8px;font-weight:800;letter-spacing:.1em}
.reels-note{font-size:9px;font-weight:800;letter-spacing:.08em;margin-top:11px}
@media(max-width:900px){.instagram-reels{padding:40px 14px}.instagram-head h2{font-size:36px}}
@media(max-width:600px){.instagram-reels{padding:38px 12px}.instagram-head h2{font-size:32px}.reel-card{flex-basis:29vw;min-width:112px}}

@media(max-width:900px){.site-header{grid-template-columns:55px 1fr 110px}.menu-btn{display:block;text-align:left}.desktop-nav{display:none}.brand{justify-self:center}.tools{gap:8px}.hero-mini{grid-template-columns:1fr}.hero-mini .mark{display:none}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 8px}.people-head,.newsletter,.brand-block{grid-template-columns:1fr}.category-band{grid-template-columns:32px 1fr 75px;padding:34px 14px}.category-band a{padding:10px 8px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.product-page{grid-template-columns:1fr}.product-image{min-height:54vh}.product-info-page{padding:34px 18px 55px}.collection-hero{padding:38px 14px 28px}.collection-tools{padding:12px 14px}}
@media(max-width:600px){.announcement{font-size:8px}.site-header{height:60px;padding:0 13px}.brand img{width:78px;height:48px}.hero-mini{min-height:220px}.hero-mini .copy{padding:28px 16px}.hero-mini h1{font-size:45px}.hero-mini p{font-size:11px;max-width:290px}.section{padding:38px 12px}.section-head h2{font-size:36px}.grid{gap:22px 7px}.visual{aspect-ratio:1/1.12}.visual img{width:34%}.add{height:36px;font-size:8px}.category-band{margin-top:8px}.category-band h3{font-size:39px}.people{padding:38px 12px}.people-reels{gap:6px}.reel-frame{flex-basis:29vw;min-width:112px}.people-head{gap:12px}.people h2{font-size:32px}.people-head p{font-size:11px}.brand-block,.newsletter{padding:38px 16px}.brand-block h2{font-size:34px}.brand-block p{font-size:11px}.newsletter h2{font-size:34px}.newsletter-copy{font-size:11px}.newsletter form{margin-top:20px}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{font-size:7px}.standard{padding:50px 16px}.standard h1{font-size:52px}.product-image{min-height:58vh}.product-info-page h1{font-size:45px}.product-image img{width:28%}}

.category-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.category-tile{min-height:210px;background:var(--soft);border:1px solid var(--line);padding:14px;display:flex;flex-direction:column;justify-content:space-between;position:relative;transition:.2s ease}.category-tile:nth-child(even){background:#fff}.category-tile:hover{background:var(--blue);color:#fff;border-color:var(--blue)}.tile-index{font-size:9px;font-weight:800;letter-spacing:.12em}.tile-name{font-size:clamp(21px,2.25vw,34px);font-weight:900;line-height:.9;letter-spacing:-.065em;overflow-wrap:anywhere}.tile-arrow{font-size:16px;font-weight:800;align-self:flex-end}
@media(max-width:900px){.category-picker{grid-template-columns:1fr 1fr}.category-tile{min-height:155px;padding:12px}.tile-name{font-size:24px}}
@media(max-width:600px){.category-picker{gap:6px}.category-tile{min-height:132px}.tile-name{font-size:21px}.tile-arrow{font-size:12px}}

.mobile-nav{display:flex;flex-direction:column;margin-top:12px}.mobile-nav a{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);font-size:15px;font-weight:900;letter-spacing:-.02em}.mobile-nav span{font-size:16px}.menu-drawer{width:min(420px,92vw)}



/* V13 — consolidated typography + intentional content relationships */
:root{
  --font-ui:Arial,Helvetica,sans-serif;
  --content-gutter:clamp(16px,2.1vw,34px);
  --type-body:14px;
  --type-support:13px;
  --type-meta:10px;
  --type-label:9px;
}

html,body,button,input,select,textarea{font-family:var(--font-ui)}
body{font-size:var(--type-body);line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-weight:800}

.announcement{font-size:9px;line-height:1;letter-spacing:.14em;font-weight:700}
.announcement span{margin-left:18px;opacity:.62}
.site-header{padding-left:var(--content-gutter);padding-right:var(--content-gutter)}
.desktop-nav{font-size:10px;letter-spacing:.075em;font-weight:800}
.tools button,.menu-btn{font-size:9px;font-weight:800;letter-spacing:.075em}

.hero-mini .copy{padding-left:var(--content-gutter);padding-right:var(--content-gutter)}
.hero-mini p{font-size:var(--type-support);line-height:1.5;max-width:440px}
.section{padding-left:var(--content-gutter);padding-right:var(--content-gutter)}
.section-head{align-items:baseline}
.section-head h2{font-weight:800}
.eyebrow{font-size:var(--type-label);line-height:1;letter-spacing:.16em;font-weight:800}

/* PEOPLE — one reading block, then the reels */
.people{padding:50px var(--content-gutter) 44px}
.people-head{display:block;border-bottom:1px solid var(--ink);padding-bottom:18px}
.people-intro{max-width:760px}
.people h2{font-size:clamp(38px,4.5vw,58px);line-height:.88;letter-spacing:-.065em;margin:0}
.people-head p{max-width:560px;font-size:var(--type-support);line-height:1.5;letter-spacing:0;margin:12px 0 0;color:#2f2f2f}
.people-reels{margin-top:14px}
.people-link{margin-top:13px}

/* BRAND — statement and explanation share the same visual baseline */
.brand-block{padding:48px var(--content-gutter);align-items:start}
.brand-block h2{font-weight:800;max-width:620px}
.brand-block p{max-width:430px;font-size:var(--type-support);line-height:1.5;color:#f0f0f0;margin:2px 0 0}

/* COMMUNITY — copy is one unit; signup is a deliberate second step */
.newsletter{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;padding:46px var(--content-gutter) 48px;align-items:start}
.newsletter h2{font-weight:800;max-width:720px}
.newsletter-copy{max-width:560px;font-size:var(--type-support);line-height:1.5;letter-spacing:0;color:#4e4e4a;margin:11px 0 0}
.newsletter form{width:100%;min-height:48px;display:flex;align-items:center;border-bottom:1px solid var(--ink);padding-bottom:9px}
.newsletter input{font-size:13px;line-height:1.3}
.newsletter button{font-size:10px;font-weight:800;letter-spacing:.08em;white-space:nowrap}

.card .name{font-size:11px;font-weight:800}
.card .meta{font-size:10px;line-height:1.35}
.card .price{font-size:10px}
.add{font-size:9px;font-weight:800}
.footer-col{font-size:10px;line-height:1.2}
.footer-col b{font-size:9px}

@media(max-width:900px){
  .hero-mini .copy{padding-left:16px;padding-right:16px}
  .people{padding:42px 16px 38px}
  .people h2{font-size:36px}
  .people-head p{font-size:12px;max-width:500px;margin-top:11px}
  .brand-block{padding-left:16px;padding-right:16px;align-items:start}
  .brand-block p{font-size:12px;margin-top:14px}
  .newsletter{padding-left:16px;padding-right:16px;gap:22px}
  .newsletter-copy{font-size:12px}
}

@media(max-width:600px){
  body{font-size:13px}
  .announcement{font-size:8px;letter-spacing:.11em}
  .announcement span{margin-left:10px}
  .people{padding:38px 12px 34px}
  .people h2{font-size:34px;line-height:.9}
  .people-head{padding-bottom:15px}
  .people-head p{font-size:12px;line-height:1.5;max-width:330px;margin-top:9px}
  .people-reels{margin-top:12px}
  .brand-block{padding:38px 16px}
  .brand-block h2{font-size:34px;line-height:.9}
  .brand-block p{font-size:12px;line-height:1.5;margin-top:14px;max-width:330px}
  .newsletter{padding:38px 16px 40px;gap:20px}
  .newsletter h2{font-size:34px;line-height:.9}
  .newsletter-copy{font-size:12px;line-height:1.5;margin-top:10px;max-width:330px}
  .newsletter form{margin-top:0;min-height:46px}
  .newsletter input{font-size:12px}
}


/* FINAL — campaign-led hero, compact brand marquee, full people row, compact community */
.hero-mini{min-height:300px;grid-template-columns:1.08fr .92fr}
.hero-mini .copy{padding-top:30px;padding-bottom:30px}
.hero-mini h1{font-size:clamp(42px,4.45vw,66px);line-height:.88;letter-spacing:-.065em;max-width:760px}
.hero-mini .hero-line{font-size:12px;line-height:1;margin:18px 0 0;letter-spacing:.12em;font-weight:800}
.hero-cta{display:inline-flex;align-items:center;gap:12px;margin-top:22px;width:max-content;font-size:9px;font-weight:800;letter-spacing:.09em;border-bottom:1px solid rgba(255,255,255,.75);padding-bottom:6px}
.hero-cta span{font-size:13px;line-height:1}
.hero-mini .mark{border-left:0;padding:18px}
.hero-art{width:100%;height:100%;min-height:260px;background:rgba(0,0,0,.08);border:1px solid rgba(255,255,255,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero-art:before{content:"";position:absolute;width:68%;aspect-ratio:1;border:1px solid rgba(255,255,255,.24);border-radius:50%}
.hero-art img{width:min(190px,34%);height:auto;object-fit:contain;position:relative;z-index:1;filter:brightness(0) invert(1)}
.hero-art span{position:absolute;bottom:13px;left:14px;font-size:8px;letter-spacing:.14em;font-weight:800;opacity:.72}

.people{padding-top:46px;padding-bottom:38px}
.people-head{padding-bottom:15px}
.people h2{font-size:clamp(34px,4vw,52px);line-height:.88}
.people-head p{font-size:13px;line-height:1.4;margin-top:9px;max-width:560px}
.people-reels{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin-top:12px;overflow:visible}
.reel-frame{min-width:0;flex:initial}
.reel-placeholder{aspect-ratio:9/16}
.people-link{margin-top:11px}

.brand-marquee{height:58px;background:var(--ink);color:#fff;overflow:hidden;display:flex;align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.marquee-track{display:flex;align-items:center;gap:28px;white-space:nowrap;min-width:max-content;animation:ohgawdMarquee 28s linear infinite;text-transform:uppercase}
.marquee-track span{font-size:12px;font-weight:800;letter-spacing:.08em;line-height:1}
.marquee-track i{font-style:normal;font-size:12px;opacity:.55}
@keyframes ohgawdMarquee{from{transform:translateX(0)}to{transform:translateX(-33.333%)}}

.newsletter{grid-template-columns:minmax(0,1fr) minmax(360px,520px);gap:44px;align-items:end;padding-top:38px;padding-bottom:40px}
.newsletter-copy-wrap{min-width:0}
.newsletter h2{font-size:clamp(34px,4vw,52px);line-height:.88;letter-spacing:-.065em;margin:0}
.newsletter-copy{font-size:13px;line-height:1.45;margin-top:9px;max-width:520px}
.newsletter form{min-height:44px;padding-bottom:7px}
.newsletter input{font-size:11px}
.newsletter button{font-size:9px}

@media(max-width:900px){
  .hero-mini{min-height:270px;grid-template-columns:1fr .8fr}
  .hero-mini .copy{padding-left:16px;padding-right:10px}
  .hero-mini h1{font-size:clamp(36px,6vw,52px)}
  .hero-mini .hero-line{font-size:10px;line-height:1.2;margin-top:15px}
  .hero-art{min-height:230px}
  .hero-art img{width:38%}
  .people-reels{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
  .newsletter{grid-template-columns:1fr;gap:20px}
}
@media(max-width:600px){
  .hero-mini{min-height:300px;grid-template-columns:1fr}
  .hero-mini .copy{padding:26px 16px 20px}
  .hero-mini h1{font-size:39px;line-height:.9}
  .hero-mini .hero-line{font-size:9px;letter-spacing:.1em;margin-top:14px}
  .hero-cta{margin-top:17px}
  .hero-mini .mark{display:block;padding:0 12px 12px}
  .hero-art{min-height:108px;height:108px}
  .hero-art:before{width:45%}
  .hero-art img{width:105px}
  .hero-art span{font-size:7px;bottom:8px;left:9px}
  .people{padding:36px 12px 32px}
  .people h2{font-size:34px}
  .people-head p{font-size:12px;margin-top:8px}
  .people-reels{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;padding-bottom:3px;margin-right:-12px;padding-right:12px}
  .reel-frame{flex:0 0 31vw;min-width:112px;scroll-snap-align:start}
  .brand-marquee{height:50px}
  .marquee-track{gap:22px;animation-duration:24s}
  .marquee-track span{font-size:10px;letter-spacing:.07em}
  .newsletter{padding:34px 16px 36px;gap:18px}
  .newsletter h2{font-size:34px}
  .newsletter-copy{font-size:12px;margin-top:8px}
  .newsletter form{min-height:42px}
  .newsletter input{font-size:11px}
}

/* V14 — apparel-first ecommerce finish: product-led hierarchy, compact hero, no consultancy feel */
:root{
  --ecom-gutter:clamp(16px,2.2vw,34px);
  --headline-tight:-.055em;
}

body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#090909}
.announcement{height:30px;font-size:9px;letter-spacing:.13em}
.announcement span{margin-left:14px;opacity:.66}
.site-header{height:64px;padding-left:var(--ecom-gutter);padding-right:var(--ecom-gutter)}
.brand img{width:96px;height:50px}
.desktop-nav{gap:22px;font-size:10px}
.tools{gap:14px}

/* Hero: image-led apparel campaign, with a restrained two-line brand thought. */
.hero-mini{min-height:276px;grid-template-columns:1.02fr .98fr;background:var(--blue)}
.hero-mini .copy{padding:28px var(--ecom-gutter);justify-content:center}
.hero-mini h1{font-size:clamp(34px,3.65vw,50px);line-height:.9;letter-spacing:var(--headline-tight);max-width:540px}
.hero-mini .hero-line{font-size:10px;letter-spacing:.14em;line-height:1.1;margin:15px 0 0;font-weight:800}
.hero-cta{margin-top:17px;font-size:9px;padding-bottom:5px;gap:9px}
.hero-mini .mark{padding:12px 12px 12px 0}
.hero-art{min-height:252px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.28)}
.hero-art:before{width:66%;border-color:rgba(255,255,255,.18)}
.hero-art img{width:min(175px,34%)}
.hero-art-top,.hero-art-bottom{position:absolute;left:13px;font-size:8px;font-weight:800;letter-spacing:.14em;opacity:.72;z-index:2}
.hero-art-top{top:11px}.hero-art-bottom{bottom:11px}
.hero-art span:not(.hero-art-top):not(.hero-art-bottom){display:none}

/* Shopping sections stay visibly retail-led. */
.section{padding-top:42px;padding-bottom:42px}
.section-head{margin-bottom:16px;padding-bottom:10px}
.section-head h2{font-size:38px;line-height:.9;letter-spacing:-.055em}
.section-head a{font-size:9px}
.category-picker{gap:7px}
.category-tile{min-height:190px}
.tile-name{font-size:clamp(20px,2vw,30px)}
.grid{gap:22px 10px}
.card-info{padding-top:8px}
.card .name{font-size:11px}.card .meta{font-size:9px}.card .price{font-size:10px}
.add{font-size:9px}

/* People = social proof / real-life styling, not an editorial consulting block. */
.people{padding:42px var(--ecom-gutter) 36px}
.people-head{padding-bottom:13px}
.people h2{font-size:clamp(32px,3.5vw,46px);line-height:.9;letter-spacing:-.055em}
.people-head p{font-size:12px;line-height:1.4;margin-top:8px;max-width:520px}
.people-reels{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:11px}
.people-link{margin-top:10px;font-size:9px;font-weight:800;letter-spacing:.08em}

/* Short brand ticker: brand atmosphere, not a second hero. */
.brand-marquee{height:50px}
.marquee-track{gap:24px;animation:ohgawdMarqueeRight 30s linear infinite}
.marquee-track span{font-size:10px;letter-spacing:.1em}
.marquee-track i{font-size:12px}
@keyframes ohgawdMarqueeRight{from{transform:translateX(-33.333%) }to{transform:translateX(0)}}

/* Community: compact retail CRM invitation, not a giant marketing form. */
.newsletter{grid-template-columns:minmax(0,1fr) minmax(320px,440px);gap:30px;padding:34px var(--ecom-gutter) 36px;align-items:end}
.newsletter h2{font-size:clamp(30px,3.2vw,44px);line-height:.9;letter-spacing:-.055em}
.newsletter-copy{font-size:12px;line-height:1.4;margin-top:8px;max-width:500px}
.newsletter form{max-width:440px;min-height:42px;padding-bottom:6px;margin-left:auto}
.newsletter input{font-size:10px;letter-spacing:.06em}
.newsletter button{font-size:9px}

@media(max-width:900px){
  .hero-mini{min-height:260px;grid-template-columns:1fr .86fr}
  .hero-mini h1{font-size:clamp(32px,5.2vw,43px)}
  .hero-art{min-height:236px}
  .category-tile{min-height:150px}
  .people-reels{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
  .newsletter{grid-template-columns:1fr;gap:16px;align-items:start}
  .newsletter form{margin-left:0;max-width:460px}
}
@media(max-width:600px){
  .announcement{height:28px;font-size:7.5px;letter-spacing:.1em}
  .site-header{height:58px}
  .hero-mini{min-height:270px;grid-template-columns:1fr}
  .hero-mini .copy{padding:24px 16px 18px}
  .hero-mini h1{font-size:31px;line-height:.92;letter-spacing:-.045em;max-width:330px}
  .hero-mini .hero-line{font-size:8px;margin-top:12px;letter-spacing:.12em}
  .hero-cta{margin-top:14px;font-size:8px}
  .hero-mini .mark{padding:0 12px 12px}
  .hero-art{min-height:104px;height:104px}
  .hero-art img{width:95px}
  .hero-art-top,.hero-art-bottom{font-size:7px;left:9px}.hero-art-top{top:8px}.hero-art-bottom{bottom:8px}
  .section{padding-top:34px;padding-bottom:34px}
  .section-head h2{font-size:31px}
  .category-picker{gap:5px}
  .category-tile{min-height:128px;padding:10px}
  .tile-name{font-size:19px}
  .people{padding:34px 12px 30px}
  .people h2{font-size:32px}
  .people-head p{font-size:11px;margin-top:7px}
  .people-reels{display:flex;overflow-x:auto;gap:6px;padding-bottom:2px;margin-right:-12px;padding-right:12px}
  .reel-frame{flex:0 0 30vw;min-width:108px}
  .brand-marquee{height:46px}
  .marquee-track{gap:20px;animation-duration:25s}
  .marquee-track span{font-size:9px}
  .newsletter{padding:30px 16px 32px;gap:14px}
  .newsletter h2{font-size:31px}
  .newsletter-copy{font-size:11px;margin-top:7px}
  .newsletter form{min-height:40px}
  .newsletter input{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none;transform:none}}
.hero-photo-note{position:relative;z-index:2;text-align:center;font-size:10px;line-height:1.25;letter-spacing:.12em;font-weight:800;max-width:180px}

/* FINAL VISUAL PASS — campaign-led, tighter retail rhythm, less template-like */
:root{--blue:#2148A4;--ink:#090909;--paper:#fff;--soft:#f2f2ef;--line:#d8d8d2;--muted:#6b6b66;--max:1440px}
body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:var(--ink)}
.page{max-width:1440px}
.announcement{height:30px;font-size:8px;letter-spacing:.14em}
.site-header{height:68px;padding:0 24px;grid-template-columns:150px 1fr 150px}
.brand img{width:58px;height:50px}
.desktop-nav{gap:28px;font-size:11px;letter-spacing:.08em}
.tools button{font-size:8px}

.hero-campaign{position:relative;height:500px;overflow:hidden;background:#171717;color:#fff}
.hero-campaign-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.45) 35%,rgba(0,0,0,.05) 72%,rgba(0,0,0,.08) 100%)}
.hero-copy{position:absolute;left:0;top:0;bottom:0;width:min(58%,720px);padding:64px 48px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hero-copy .eyebrow{font-size:8px;letter-spacing:.18em;margin-bottom:16px}
.hero-copy h1{font-size:clamp(48px,6.3vw,88px);line-height:.84;letter-spacing:-.07em;margin:0;max-width:760px}
.hero-copy p{font-size:12px;line-height:1.3;margin:20px 0 0;letter-spacing:.08em;font-weight:700}
.hero-copy .hero-cta{color:#fff;border-color:rgba(255,255,255,.8);margin-top:20px;font-size:9px;letter-spacing:.1em}
.hero-note{position:absolute;right:18px;bottom:14px;font-size:7px;letter-spacing:.12em;font-weight:800;opacity:.72}

.section{padding:54px 24px}
.section-head{padding-bottom:12px;margin-bottom:14px}
.section-head h2{font-size:44px;letter-spacing:-.065em}
.section-head a{font-size:8px}
.grid{gap:18px 8px}
.visual{aspect-ratio:1/1.12;background:#f0f0ed}
.visual:before{display:none}
.visual img{width:92px;max-width:28%;opacity:.92}
.visual .code{font-size:7px;bottom:8px;left:9px}
.badge{font-size:7px;padding:4px 5px}
.card-info{padding-top:8px}
.name{font-size:10px}.meta{font-size:8px}.price{font-size:9px}
.add{margin-top:7px;height:30px;font-size:8px;letter-spacing:.08em}

.category-picker{gap:8px}
.category-tile{min-height:158px;padding:14px;background:#fff}
.category-tile:nth-child(3){background:var(--blue);color:#fff;border-color:var(--blue)}
.tile-index{font-size:7px}.tile-name{font-size:27px;letter-spacing:-.055em}.tile-arrow{font-size:12px}

.people{padding:54px 24px 46px}
.people h2{font-size:48px;letter-spacing:-.065em}
.people-head p{font-size:11px;margin-top:8px}
.people-reels{gap:8px;margin-top:15px}
.reel-placeholder{background:#ecece9;position:relative;overflow:hidden}
.reel-placeholder img{display:none}
.reel-placeholder:before{content:'OHGAWD / IRL';position:absolute;left:10px;top:12px;font-size:7px;font-weight:800;letter-spacing:.12em}
.reel-placeholder:after{content:none}
.people-link{font-size:8px;margin-top:12px}

.brand-marquee{height:46px}
.marquee-track span{font-size:9px;letter-spacing:.11em}

.newsletter{padding:42px 24px 44px;grid-template-columns:1fr 460px;gap:40px}
.newsletter h2{font-size:46px}.newsletter-copy{font-size:11px}.newsletter input{font-size:9px}.newsletter button{font-size:8px}
footer{padding:34px 24px 16px}.footer-grid{gap:30px}.footer-brand img{width:58px;height:48px}

@media(max-width:900px){
 .site-header{grid-template-columns:80px 1fr 100px;padding:0 16px}.desktop-nav{gap:14px;font-size:10px}.brand img{width:54px}
 .hero-campaign{height:430px}.hero-copy{width:70%;padding:44px 28px}.hero-copy h1{font-size:clamp(42px,7vw,64px)}
 .section{padding:44px 18px}.section-head h2{font-size:38px}.category-tile{min-height:135px}.tile-name{font-size:22px}
 .people{padding:46px 18px 38px}.people h2{font-size:40px}.people-reels{grid-template-columns:repeat(7,minmax(0,1fr))}
 .newsletter{grid-template-columns:1fr;gap:18px;padding:38px 18px}.newsletter form{margin-left:0;max-width:520px}
}
@media(max-width:600px){
 .announcement{height:28px;font-size:7px}.site-header{height:58px}.desktop-nav{display:none}.menu-btn{display:block;text-align:left}.tools{gap:10px}.tools button{font-size:8px}
 .brand{justify-self:center}.brand img{width:48px;height:46px}
 .hero-campaign{height:520px}.hero-campaign-image{object-position:58% center}.hero-overlay{background:linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.22) 32%,rgba(0,0,0,.82) 100%)}
 .hero-copy{width:100%;padding:24px 16px 34px;justify-content:flex-end}.hero-copy .eyebrow{margin-bottom:11px}.hero-copy h1{font-size:43px;line-height:.88;max-width:360px}.hero-copy p{font-size:9px;margin-top:13px}.hero-copy .hero-cta{margin-top:15px;font-size:8px}.hero-note{left:16px;right:auto;top:12px;bottom:auto;font-size:6.5px}
 .section{padding:34px 12px}.section-head{margin-bottom:12px}.section-head h2{font-size:32px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 6px}.visual{aspect-ratio:1/1.08}.visual img{width:70px;max-width:30%}.add{height:32px}
 .category-picker{grid-template-columns:1fr 1fr;gap:5px}.category-tile{min-height:118px;padding:10px}.tile-name{font-size:16px}.tile-arrow{font-size:10px}
 .people{padding:38px 12px 30px}.people h2{font-size:34px}.people-head p{font-size:10px}.people-reels{gap:6px}.reel-frame{flex:0 0 29vw;min-width:104px}.reel-placeholder:before{font-size:6px}.reel-placeholder:after{font-size:8px}
 .brand-marquee{height:42px}.marquee-track span{font-size:8px}
 .newsletter{padding:32px 16px 34px;gap:14px}.newsletter h2{font-size:34px}.newsletter-copy{font-size:10px}.newsletter form{min-height:40px}
 footer{padding:30px 16px 14px}.footer-grid{grid-template-columns:1.2fr 1fr 1fr;gap:18px}.footer-brand p{font-size:9px}
}

/* FINAL TYPOGRAPHY CONSISTENCY PASS — collection/product/info pages use the same hierarchy as the homepage */
.collection-hero h1{
  font-size:clamp(44px,5.2vw,68px);
  line-height:.88;
  letter-spacing:-.065em;
  max-width:900px;
}
.collection-hero p{
  font-size:12px;
  line-height:1.45;
  margin-top:16px;
}
.collection-hero{padding:42px 24px 30px}
.collection-tools{font-size:8px}
.collection-tools select{font-size:8px}
.product-info-page h1{
  font-size:clamp(38px,4.2vw,58px);
  line-height:.88;
  letter-spacing:-.065em;
}
.standard h1{
  font-size:clamp(42px,5vw,64px);
  line-height:.88;
  letter-spacing:-.065em;
}
.standard h2{font-size:24px}
@media(max-width:900px){
  .collection-hero{padding:36px 18px 26px}
  .collection-hero h1{font-size:clamp(42px,7vw,58px)}
  .product-info-page h1{font-size:clamp(36px,7vw,52px)}
}
@media(max-width:600px){
  .collection-hero{padding:30px 12px 22px}
  .collection-hero h1{font-size:40px;line-height:.9}
  .collection-hero p{font-size:11px;margin-top:12px}
  .collection-tools{padding:11px 12px;font-size:8px}
  .collection-tools select{font-size:8px}
  .standard{padding:42px 16px}
  .standard h1{font-size:42px;line-height:.9;margin-bottom:26px}
  .standard h2{font-size:22px}
  .product-info-page h1{font-size:42px}
}

/* Final hero CTA sizing — slightly larger, still restrained. */
.hero-copy .hero-cta,
.hero-cta{min-height:42px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:11px;font-size:10px;letter-spacing:.1em;font-weight:800;border:1px solid rgba(255,255,255,.85);border-bottom-color:rgba(255,255,255,.85);background:rgba(255,255,255,.06)}
.hero-copy .hero-cta span{font-size:15px;line-height:1}
@media(max-width:600px){.hero-copy .hero-cta,.hero-cta{min-height:40px;padding:0 14px;font-size:9px;gap:9px}.hero-copy .hero-cta span{font-size:12px}}

/* OHGAWD — FINAL SITE-WIDE TYPE LOCK
   One typography system across Home, Collections, Product, People and Info pages. */
:root{--type-display:clamp(42px,5.2vw,76px);--type-page:clamp(42px,5.2vw,76px);--type-section:clamp(32px,3.8vw,54px)}

/* Collection / category pages */
.collection-hero{padding:42px 24px 30px}
.collection-hero h1{font-size:var(--type-page)!important;line-height:.86!important;letter-spacing:-.065em!important;margin:0!important}
.collection-hero p{font-size:12px!important;line-height:1.5!important;max-width:480px;margin:16px 0 0!important}

/* Product pages */
.product-info-page h1{font-size:var(--type-page)!important;line-height:.88!important;letter-spacing:-.065em!important;margin:0!important}

/* People page */
.people h2{font-size:var(--type-section)!important;line-height:.9!important;letter-spacing:-.06em!important;margin:0!important}

/* About / Contact / Store information */
.standard{padding:58px 24px!important;max-width:900px;margin:auto}
.standard h1{font-size:var(--type-page)!important;line-height:.88!important;letter-spacing:-.065em!important;margin:0 0 28px!important}
.standard h2{font-size:24px!important;line-height:1!important;letter-spacing:-.04em!important;margin:34px 0 10px!important}
.standard p,.standard li{font-size:12px!important;line-height:1.65!important}

/* Navigation and utility text never inherit display sizing */
.desktop-nav,.desktop-nav a,.tools button,.menu-btn,.collection-tools,.collection-tools select,.eyebrow,.footer-col,.footer-bottom{font-size:9px!important}

/* Stable responsive scale — pages keep the same hierarchy when navigating */
@media(max-width:900px){
  .collection-hero{padding:36px 18px 26px!important}
  .collection-hero h1{font-size:clamp(40px,7vw,58px)!important}
  .product-info-page h1{font-size:clamp(40px,7vw,58px)!important}
  .standard{padding:48px 18px!important}
  .standard h1{font-size:clamp(40px,7vw,58px)!important}
  .people h2{font-size:clamp(34px,5vw,46px)!important}
}
@media(max-width:600px){
  .collection-hero{padding:30px 12px 22px!important}
  .collection-hero h1{font-size:40px!important;line-height:.9!important}
  .collection-hero p{font-size:11px!important;margin-top:12px!important}
  .product-info-page h1{font-size:42px!important}
  .standard{padding:42px 16px!important}
  .standard h1{font-size:42px!important;line-height:.9!important;margin-bottom:24px!important}
  .standard h2{font-size:22px!important}
  .people h2{font-size:34px!important}
}


/* =========================================================
   OHGAWD MASTER TYPOGRAPHY + RESPONSIVE FINAL PASS
   One consistent scale across every route.
   Mobile first, then desktop expansion.
   ========================================================= */
:root{
  --text-display:clamp(42px,5.2vw,76px);
  --text-page:clamp(34px,3.8vw,52px);
  --text-section:clamp(28px,3vw,44px);
  --text-subhead:18px;
  --text-body:13px;
  --text-small:10px;
  --text-micro:9px;
}

body{font-size:var(--text-body);line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

/* Header / utility scale */
.announcement{font-size:9px;line-height:1;letter-spacing:.12em}
.desktop-nav,.desktop-nav a,.tools button,.menu-btn{font-size:11px!important;line-height:1.1}
.eyebrow{font-size:9px!important;line-height:1.1;letter-spacing:.13em}

/* Homepage */
.hero-copy h1{font-size:var(--text-display)!important;line-height:.9!important;letter-spacing:-.065em!important}
.hero-copy p{font-size:13px!important;line-height:1.35!important}
.section-head h2{font-size:var(--text-section)!important;line-height:.92!important;letter-spacing:-.055em!important}
.section-head a,.people-link{font-size:9px!important}
.name{font-size:12px!important;line-height:1.25}
.meta{font-size:10px!important;line-height:1.3}
.price{font-size:11px!important}
.add{font-size:10px!important;height:40px}

/* Category / collection pages */
.collection-hero{padding:40px 24px 28px!important}
.collection-hero h1{font-size:var(--text-display)!important;line-height:.92!important;letter-spacing:-.055em!important;margin:0!important}
.collection-hero p{font-size:12px!important;line-height:1.5!important;margin:12px 0 0!important}
.collection-tools{font-size:9px!important}
.collection-tools select{font-size:9px!important}

/* Product */
.product-info-page h1{font-size:var(--text-display)!important;line-height:.92!important;letter-spacing:-.055em!important}
.product-info-page .pprice{font-size:12px!important}
.select-label{font-size:9px!important}
.size{font-size:10px!important}
.buy{font-size:10px!important}

/* People / brand / newsletter */
.people h2{font-size:var(--text-section)!important;line-height:.92!important;letter-spacing:-.055em!important}
.people-head p{font-size:12px!important}
.brand-block h2{font-size:var(--text-section)!important;line-height:.92!important;letter-spacing:-.055em!important}
.brand-block p{font-size:12px!important;line-height:1.5}
.newsletter h2{font-size:var(--text-section)!important;line-height:.92!important;letter-spacing:-.055em!important}
.newsletter-copy{font-size:12px!important}
.newsletter input{font-size:12px!important}
.newsletter button{font-size:10px!important}

/* Information pages */
.standard{max-width:860px!important;padding:58px 24px!important}
.standard h1{font-size:var(--text-display)!important;line-height:.92!important;letter-spacing:-.055em!important;margin:0 0 26px!important}
.standard h2{font-size:22px!important;line-height:1.05!important;letter-spacing:-.03em!important}
.standard p,.standard li{font-size:12px!important;line-height:1.65!important}

/* Footer */
.footer-col,.footer-brand p{font-size:10px!important}
.footer-col b{font-size:9px!important}
.footer-bottom{font-size:8px!important}

/* Mobile: tighter, calmer type; no oversized route-specific H1s */
@media(max-width:600px){
  .announcement{height:27px;font-size:8px;letter-spacing:.1em}
  .site-header{height:58px;padding:0 14px}
  .brand img{width:78px;height:46px}
  .desktop-nav{display:none}
  .tools{gap:12px}
  .tools button,.menu-btn{font-size:8px!important}

  .hero-copy{padding:24px 18px!important}
  .hero-copy h1{font-size:clamp(34px,11vw,48px)!important;line-height:.91!important}
  .hero-copy p{font-size:11px!important;margin-top:10px!important}
  .hero-copy .hero-cta{min-height:44px!important;padding:0 16px!important;font-size:10px!important}

  .section{padding:34px 14px!important}
  .section-head{padding-bottom:10px;margin-bottom:14px}
  .section-head h2{font-size:28px!important}
  .section-head a{font-size:8px!important}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 8px}
  .card-info{padding-top:8px}
  .name{font-size:11px!important}
  .meta{font-size:9px!important}
  .price{font-size:10px!important}
  .add{height:38px;font-size:9px!important;margin-top:8px}

  .category-picker-section{padding-top:8px!important}
  .category-tile .tile-name{font-size:20px!important}

  .people{padding:34px 14px!important}
  .people-head{display:block;padding-bottom:12px}
  .people h2{font-size:30px!important}
  .people-head p{font-size:11px!important;margin-top:9px}
  .reel-frame{flex-basis:132px}

  .brand-block{padding:34px 14px!important;grid-template-columns:1fr;gap:14px}
  .brand-block h2{font-size:30px!important}
  .brand-block p{font-size:11px!important}

  .newsletter{padding:34px 14px!important;grid-template-columns:1fr;gap:22px}
  .newsletter h2{font-size:30px!important}
  .newsletter-copy{font-size:11px!important}

  .collection-hero{padding:28px 14px 20px!important}
  .collection-hero h1{font-size:clamp(34px,11vw,48px)!important;line-height:.91!important}
  .collection-hero p{font-size:11px!important;margin-top:10px!important}
  .collection-tools{padding:11px 14px!important;font-size:8px!important}
  .collection-tools select{font-size:8px!important}

  .product-page{grid-template-columns:1fr;min-height:0}
  .product-image{min-height:58vh}
  .product-info-page{padding:28px 16px 38px!important}
  .product-info-page h1{font-size:clamp(34px,11vw,48px)!important}
  .product-info-page .pprice{font-size:13px!important;margin:12px 0}

  .standard{padding:34px 16px!important}
  .standard h1{font-size:clamp(34px,11vw,48px)!important;line-height:.91!important;margin-bottom:22px!important}
  .standard h2{font-size:20px!important;margin:28px 0 9px!important}
  .standard p,.standard li{font-size:11px!important;line-height:1.65!important}

  footer{padding:40px 14px 18px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px 18px}
  .footer-brand{grid-column:1/-1}
  .footer-bottom{margin-top:34px}
}

/* Desktop: preserve hierarchy rather than making inner pages gigantic */
@media(min-width:1200px){
  .section,.people{padding-left:32px;padding-right:32px}
  .collection-hero{padding-left:32px!important;padding-right:32px!important}
}

/* FINAL BRAND-TONE + MARQUEE PASS */
/* Brand blue is reserved for high-attention brand moments; black remains for core text/contrast. */
.announcement{background:var(--blue);color:#fff}
.brand-marquee{background:var(--blue);border-top-color:var(--blue);border-bottom-color:var(--blue);color:#fff}
.marquee-track{animation-duration:18s}
.hero-note{display:none}

@media(max-width:900px){
  .marquee-track{animation-duration:16s}
}
@media(max-width:600px){
  .announcement{background:var(--blue);color:#fff}
  .marquee-track{animation-duration:15s}
}

/* FINAL LOGO SCALE — clear on header, never oversized */
.site-header .brand img{width:78px!important;height:54px!important;object-fit:contain}
@media(max-width:900px){
  .site-header .brand img{width:72px!important;height:50px!important}
}
@media(max-width:600px){
  .site-header .brand img{width:66px!important;height:46px!important}
}

/* =========================================================
   OHGAWD FINAL AUDIT — SINGLE LAST-PASS OVERRIDES
   Keep the brand system consistent across every route.
   ========================================================= */
:root{
  --ohgawd-blue:#2148A4;
  --ohgawd-ink:#090909;
  --ohgawd-paper:#fff;
  --ohgawd-soft:#f4f4f1;
}

/* Brand tone */
.announcement{
  background:var(--ohgawd-blue)!important;
  color:#fff!important;
  height:30px!important;
}
.brand-marquee{
  background:var(--ohgawd-blue)!important;
  color:#fff!important;
  border-color:var(--ohgawd-blue)!important;
  height:48px!important;
}

/* Fast, readable ticker — deliberately quick, not a slow banner */
.marquee-track{
  width:max-content;
  min-width:max-content;
  flex-shrink:0;
  animation:ohgawdMarqueeFinal 7.5s linear infinite!important;
  will-change:transform;
}
.marquee-track span{font-size:10px!important;letter-spacing:.08em!important}
.marquee-track i{font-size:13px!important}
@keyframes ohgawdMarqueeFinal{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-33.333333%,0,0)}
}

/* Header logo: visible, clean, never oversized */
.site-header .brand img{width:78px!important;height:54px!important;object-fit:contain!important}

/* Hero: no development labels */
.hero-note{display:none!important}
.hero-campaign{min-height:500px}
.hero-copy h1{font-size:clamp(48px,5.6vw,82px)!important;line-height:.88!important}
.hero-copy p{font-size:13px!important;letter-spacing:.02em!important}
.hero-copy .hero-cta{min-height:44px!important;padding:0 17px!important;font-size:10px!important}

/* One consistent page hierarchy across all tabs */
.collection-hero h1{font-size:clamp(42px,4.2vw,58px)!important;line-height:.9!important;letter-spacing:-.055em!important}
.collection-hero p{font-size:12px!important}
.product-info-page h1{font-size:clamp(40px,4.2vw,58px)!important;line-height:.9!important;letter-spacing:-.055em!important}
.standard h1{font-size:clamp(42px,4.2vw,58px)!important;line-height:.9!important;letter-spacing:-.055em!important}
.standard h2{font-size:24px!important;line-height:1!important}

/* Keep lower-page headings strong but not oversized */
.section-head h2,.people h2,.brand-block h2,.newsletter h2{
  font-size:clamp(30px,3.1vw,46px)!important;
  line-height:.92!important;
  letter-spacing:-.055em!important;
}

/* Product-first retail rhythm */
.section{padding-top:46px!important;padding-bottom:46px!important}
.section-head{margin-bottom:16px!important}
.card .name{font-size:11px!important}
.card .meta{font-size:9px!important}
.card .price{font-size:10px!important}
.card .add{height:40px!important;font-size:9px!important}

/* People: content first, placeholders stay visually quiet */
.people{padding-top:46px!important;padding-bottom:42px!important}
.people-head p{font-size:12px!important}

/* Footer remains utility-led */
footer{padding-top:44px!important}

@media(max-width:900px){
  .announcement{height:29px!important;font-size:8px!important}
  .site-header .brand img{width:72px!important;height:50px!important}
  .brand-marquee{height:44px!important}
  .marquee-track{animation-duration:7s!important}
  .marquee-track span{font-size:9px!important}
  .hero-campaign{min-height:460px}
  .hero-copy h1{font-size:clamp(40px,8vw,62px)!important}
  .collection-hero h1,.product-info-page h1,.standard h1{font-size:clamp(38px,7vw,54px)!important}
}

@media(max-width:600px){
  .announcement{height:28px!important;font-size:7px!important;letter-spacing:.1em!important}
  .site-header{height:58px!important}
  .site-header .brand img{width:66px!important;height:46px!important}
  .hero-campaign{height:500px!important;min-height:500px!important}
  .hero-copy{padding:24px 16px 34px!important}
  .hero-copy h1{font-size:43px!important;line-height:.89!important;max-width:360px}
  .hero-copy p{font-size:11px!important;margin-top:11px!important}
  .hero-copy .hero-cta{min-height:44px!important;padding:0 16px!important;font-size:10px!important}
  .brand-marquee{height:42px!important}
  .marquee-track{animation-duration:6.5s!important}
  .marquee-track span{font-size:8px!important}
  .marquee-track i{font-size:11px!important}
  .section{padding:34px 12px!important}
  .section-head h2,.people h2,.brand-block h2,.newsletter h2{font-size:32px!important}
  .collection-hero{padding:30px 12px 22px!important}
  .collection-hero h1,.product-info-page h1,.standard h1{font-size:38px!important;line-height:.92!important}
  .standard{padding:42px 16px!important}
  .standard h2{font-size:22px!important}
  .card .add{height:36px!important}
}

@media(prefers-reduced-motion:reduce){
  .marquee-track{animation:none!important;transform:none!important}
}

/* FINAL MARQUEE CLEANUP — seamless, continuous, correctly placed */
.brand-marquee{
  height:48px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  position:relative!important;
  border:0!important;
}
.marquee-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:0!important;
  gap:0!important;
  white-space:nowrap!important;
  text-transform:uppercase!important;
  animation:ohgawdMarqueeSeamless 8s linear infinite!important;
  will-change:transform!important;
}
.marquee-group{
  display:flex!important;
  align-items:center!important;
  flex:none!important;
  gap:24px!important;
  padding-right:24px!important;
}
.marquee-track span{
  display:inline-block!important;
  flex:none!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
.marquee-track i{
  display:inline-block!important;
  flex:none!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1!important;
  opacity:.65!important;
}
@keyframes ohgawdMarqueeSeamless{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
@media (max-width:900px){
  .brand-marquee{height:45px!important}
  .marquee-track{animation-duration:7s!important}
  .marquee-group{gap:20px!important;padding-right:20px!important}
  .marquee-track span{font-size:9px!important;letter-spacing:.075em!important}
  .marquee-track i{font-size:11px!important}
}
@media (max-width:600px){
  .brand-marquee{height:42px!important}
  .marquee-track{animation-duration:6.5s!important}
  .marquee-group{gap:18px!important;padding-right:18px!important}
  .marquee-track span{font-size:8.5px!important;letter-spacing:.065em!important}
  .marquee-track i{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){
  .marquee-track{animation:none!important;transform:none!important}
}


/* FINAL ANNOUNCEMENT TICKER — same seamless motion as the brand marquee */
.announcement{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  padding:0!important;
  height:30px!important;
  background:var(--blue)!important;
  color:#fff!important;
}
.announcement-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:0!important;
  flex:none!important;
  white-space:nowrap!important;
  animation:ohgawdAnnouncementSeamless 8s linear infinite!important;
  will-change:transform!important;
}
.announcement-group{
  display:flex!important;
  align-items:center!important;
  flex:none!important;
  gap:18px!important;
  padding-right:18px!important;
}
.announcement-group span{
  display:inline-block!important;
  flex:none!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
}
.announcement-group i{
  display:inline-block!important;
  flex:none!important;
  font-style:normal!important;
  font-size:11px!important;
  line-height:1!important;
  opacity:.7!important;
}
@keyframes ohgawdAnnouncementSeamless{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
@media(max-width:900px){
  .announcement{height:29px!important}
  .announcement-track{animation-duration:7s!important}
  .announcement-group{gap:16px!important;padding-right:16px!important}
  .announcement-group span{font-size:8px!important;letter-spacing:.1em!important}
  .announcement-group i{font-size:10px!important}
}
@media(max-width:600px){
  .announcement{height:28px!important}
  .announcement-track{animation-duration:6.5s!important}
  .announcement-group{gap:14px!important;padding-right:14px!important}
  .announcement-group span{font-size:7.5px!important;letter-spacing:.08em!important}
  .announcement-group i{font-size:9px!important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track{animation:none!important;transform:none!important}
}


/* FINAL TOP ANNOUNCEMENT — match the brand marquee motion and clarity */
.announcement{
  height:48px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0!important;
  border:0!important;
  position:relative!important;
  white-space:nowrap!important;
}
.announcement-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:0!important;
  flex:none!important;
  gap:0!important;
  white-space:nowrap!important;
  text-transform:uppercase!important;
  animation:ohgawdAnnouncementFinal 8s linear infinite!important;
  will-change:transform!important;
}
.announcement-group{
  display:flex!important;
  align-items:center!important;
  flex:none!important;
  gap:24px!important;
  padding-right:24px!important;
}
.announcement-group span{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:1!important;
  color:#fff!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-shadow:none!important;
  -webkit-font-smoothing:antialiased!important;
  text-rendering:geometricPrecision!important;
}
.announcement-group i{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:.65!important;
  color:#fff!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1!important;
}
@keyframes ohgawdAnnouncementFinal{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
@media(max-width:900px){
  .announcement{height:45px!important}
  .announcement-track{animation-duration:7s!important}
  .announcement-group{gap:20px!important;padding-right:20px!important}
  .announcement-group span{font-size:9px!important;letter-spacing:.075em!important}
  .announcement-group i{font-size:11px!important}
}
@media(max-width:600px){
  .announcement{height:42px!important}
  .announcement-track{animation-duration:6.5s!important}
  .announcement-group{gap:18px!important;padding-right:18px!important}
  .announcement-group span{font-size:8.5px!important;letter-spacing:.065em!important}
  .announcement-group i{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track{animation:none!important;transform:none!important}
}


/* FINAL TOP ANNOUNCEMENT — single-message full-panel ticker */
.announcement{
  height:48px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  position:relative!important;
  white-space:nowrap!important;
}
.announcement-track{
  display:block!important;
  width:max-content!important;
  min-width:max-content!important;
  flex:none!important;
  white-space:nowrap!important;
  text-transform:uppercase!important;
  animation:ohgawdAnnouncementAcross 8s linear infinite!important;
  will-change:transform!important;
}
.announcement-group{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:none!important;
  width:max-content!important;
  gap:24px!important;
  padding:0!important;
  margin:0!important;
}
.announcement-group span{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:1!important;
  color:#fff!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-shadow:none!important;
  -webkit-font-smoothing:antialiased!important;
  text-rendering:geometricPrecision!important;
}
.announcement-group i{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:.7!important;
  color:#fff!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1!important;
}
@keyframes ohgawdAnnouncementAcross{
  from{transform:translate3d(100vw,0,0)}
  to{transform:translate3d(-100%,0,0)}
}
@media(max-width:900px){
  .announcement{height:45px!important}
  .announcement-track{animation-duration:7s!important}
  .announcement-group{gap:20px!important}
  .announcement-group span{font-size:9px!important;letter-spacing:.075em!important}
  .announcement-group i{font-size:11px!important}
}
@media(max-width:600px){
  .announcement{height:42px!important}
  .announcement-track{animation-duration:6.5s!important}
  .announcement-group{gap:18px!important}
  .announcement-group span{font-size:8.5px!important;letter-spacing:.065em!important}
  .announcement-group i{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track{animation:none!important;transform:none!important}
}


/* FINAL AUTHORITATIVE TOP ANNOUNCEMENT — one message, full-panel right-to-left pass */
.announcement{
  height:30px !important;
  background:var(--blue) !important;
  color:#fff !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  position:relative !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  white-space:nowrap !important;
}
.announcement-track{
  display:block !important;
  width:max-content !important;
  min-width:max-content !important;
  flex:none !important;
  position:relative !important;
  left:0 !important;
  margin:0 !important;
  padding:0 !important;
  animation:ohgawdAnnouncementSingle 8s linear infinite !important;
  will-change:transform !important;
}
.announcement-group{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:max-content !important;
  flex:none !important;
  gap:18px !important;
  padding:0 !important;
  margin:0 !important;
}
.announcement-group span{
  display:inline-block !important;
  flex:none !important;
  margin:0 !important;
  padding:0 !important;
  opacity:1 !important;
  color:#fff !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:.09em !important;
  text-shadow:none !important;
  -webkit-font-smoothing:antialiased !important;
  text-rendering:geometricPrecision !important;
}
.announcement-group i{
  display:inline-block !important;
  flex:none !important;
  margin:0 !important;
  padding:0 !important;
  opacity:.7 !important;
  color:#fff !important;
  font-style:normal !important;
  font-size:11px !important;
  line-height:1 !important;
}
@keyframes ohgawdAnnouncementSingle{
  0%{transform:translate3d(100vw,0,0)}
  100%{transform:translate3d(calc(-100% - 100vw),0,0)}
}
@media(max-width:900px){
  .announcement{height:29px !important}
  .announcement-track{animation-duration:7s !important}
  .announcement-group{gap:16px !important}
  .announcement-group span{font-size:8px !important;letter-spacing:.075em !important}
  .announcement-group i{font-size:10px !important}
}
@media(max-width:600px){
  .announcement{height:28px !important}
  .announcement-track{animation-duration:6.5s !important}
  .announcement-group{gap:14px !important}
  .announcement-group span{font-size:7.5px !important;letter-spacing:.065em !important}
  .announcement-group i{font-size:9px !important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track{animation:none !important;transform:translate3d(0,0,0) !important}
}

/* FINAL MOTION PASS — readable website-speed tickers */
/* Top notification: one message enters from the right, crosses the full panel, then repeats. */
.announcement-track{
  animation:ohgawdAnnouncementReadable 16s linear infinite !important;
}
@keyframes ohgawdAnnouncementReadable{
  from{transform:translate3d(100vw,0,0)}
  to{transform:translate3d(calc(-100% - 100vw),0,0)}
}

/* Brand marquee: seamless duplicate track, quick enough to feel alive but slow enough to read. */
.marquee-track{
  animation:ohgawdMarqueeReadable 12s linear infinite !important;
}
@keyframes ohgawdMarqueeReadable{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

@media (max-width:900px){
  .announcement-track{animation-duration:14s !important}
  .marquee-track{animation-duration:11s !important}
}
@media (max-width:600px){
  .announcement-track{animation-duration:12s !important}
  .marquee-track{animation-duration:10s !important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track,.marquee-track{animation:none !important;transform:none !important}
}

/* =========================================================
   MASTER FINAL PASS — TICKERS + TYPE CONSISTENCY
   Single visible message in the top ticker; no duplicated copy.
   ========================================================= */
.announcement{
  height:42px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  position:relative!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  white-space:nowrap!important;
}
.announcement-track{
  display:block!important;
  width:max-content!important;
  min-width:max-content!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
  animation:ohgawdTopSingle 16s linear infinite!important;
  will-change:transform!important;
}
.announcement-group{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:max-content!important;
  flex:0 0 auto!important;
  gap:18px!important;
  padding:0!important;
  margin:0!important;
}
.announcement-group span{
  display:inline-block!important;
  color:#fff!important;
  opacity:1!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.075em!important;
  text-shadow:none!important;
  -webkit-font-smoothing:antialiased!important;
  text-rendering:geometricPrecision!important;
}
.announcement-group i{
  display:inline-block!important;
  color:#fff!important;
  opacity:.72!important;
  font-size:11px!important;
  line-height:1!important;
  font-style:normal!important;
}
@keyframes ohgawdTopSingle{
  0%{transform:translate3d(100vw,0,0)}
  100%{transform:translate3d(calc(-100% - 100vw),0,0)}
}

/* Brand ticker: one clean sequence repeated only as a seamless visual loop. */
.brand-marquee{
  height:48px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  border:0!important;
}
.marquee-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:max-content!important;
  white-space:nowrap!important;
  gap:0!important;
  animation:ohgawdBrandFinal 14s linear infinite!important;
  will-change:transform!important;
}
.marquee-group{
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  gap:22px!important;
  padding-right:44px!important;
}
.marquee-track span{
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.075em!important;
  color:#fff!important;
  text-rendering:geometricPrecision!important;
  -webkit-font-smoothing:antialiased!important;
}
.marquee-track i{
  font-size:11px!important;
  color:#fff!important;
  opacity:.72!important;
  font-style:normal!important;
}
@keyframes ohgawdBrandFinal{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

/* Inner-page type: same OHGAWD hierarchy as the homepage. */
.collection-hero h1,.standard h1{font-size:clamp(42px,6.5vw,88px)!important;line-height:.9!important;letter-spacing:-.045em!important}
.section h2,.newsletter h2,.people h2{font-size:clamp(34px,4.5vw,64px)!important;line-height:.92!important;letter-spacing:-.035em!important}

@media(max-width:900px){
  .announcement{height:38px!important}
  .announcement-track{animation-duration:14s!important}
  .announcement-group{gap:16px!important}
  .announcement-group span{font-size:9px!important}
  .announcement-group i{font-size:10px!important}
  .brand-marquee{height:44px!important}
  .marquee-track{animation-duration:13s!important}
  .marquee-group{gap:18px!important;padding-right:36px!important}
  .marquee-track span{font-size:9px!important}
  .marquee-track i{font-size:10px!important}
  .collection-hero h1,.standard h1{font-size:clamp(40px,9vw,64px)!important}
  .section h2,.newsletter h2,.people h2{font-size:clamp(30px,7vw,48px)!important}
}
@media(max-width:600px){
  .announcement{height:36px!important}
  .announcement-track{animation-duration:12s!important}
  .announcement-group{gap:14px!important}
  .announcement-group span{font-size:8px!important;letter-spacing:.065em!important}
  .announcement-group i{font-size:9px!important}
  .brand-marquee{height:42px!important}
  .marquee-track{animation-duration:12s!important}
  .marquee-group{gap:16px!important;padding-right:32px!important}
  .marquee-track span{font-size:8.5px!important;letter-spacing:.06em!important}
  .marquee-track i{font-size:9px!important}
  .collection-hero h1,.standard h1{font-size:42px!important}
  .section h2,.newsletter h2,.people h2{font-size:32px!important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track,.marquee-track{animation:none!important;transform:none!important}
}


/* FINAL TICKER BALANCE — authoritative override */
.announcement{
  height:30px!important;
  background:var(--blue)!important;
  color:#fff!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  white-space:nowrap!important;
}
.announcement-track{
  display:block!important;
  width:max-content!important;
  min-width:max-content!important;
  flex:none!important;
  animation:ohgawdTopReadable 16s linear infinite!important;
  will-change:transform!important;
}
.announcement-group{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  flex:none!important;
  gap:18px!important;
  padding:0!important;
  margin:0!important;
}
.announcement-group span{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:1!important;
  color:#fff!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.10em!important;
  text-shadow:none!important;
  -webkit-font-smoothing:antialiased!important;
  text-rendering:geometricPrecision!important;
}
.announcement-group i{
  display:inline-block!important;
  flex:none!important;
  margin:0!important;
  opacity:.72!important;
  color:#fff!important;
  font-style:normal!important;
  font-size:11px!important;
  line-height:1!important;
}
/* One content group crosses the full panel from right to left. */
@keyframes ohgawdTopReadable{
  0%{transform:translate3d(100vw,0,0)}
  100%{transform:translate3d(-100%,0,0)}
}
/* Keep the lower brand marquee at the balanced, readable pace. */
.brand-marquee .marquee-track{
  animation-duration:12s!important;
  animation-timing-function:linear!important;
}
@media(max-width:900px){
  .announcement{height:29px!important}
  .announcement-track{animation-duration:15s!important}
  .announcement-group{gap:16px!important}
  .announcement-group span{font-size:8.5px!important;letter-spacing:.085em!important}
  .announcement-group i{font-size:10px!important}
  .brand-marquee .marquee-track{animation-duration:11s!important}
}
@media(max-width:600px){
  .announcement{height:28px!important}
  .announcement-track{animation-duration:14s!important}
  .announcement-group{gap:14px!important}
  .announcement-group span{font-size:8px!important;letter-spacing:.07em!important}
  .announcement-group i{font-size:9.5px!important}
  .brand-marquee .marquee-track{animation-duration:10s!important}
}
@media(prefers-reduced-motion:reduce){
  .announcement-track,.brand-marquee .marquee-track{animation:none!important;transform:none!important}
}

/* FINAL TICKER SYNC — lower brand marquee matches the locked top notification pace */
.brand-marquee .marquee-track{
  animation-duration:16s!important;
  animation-timing-function:linear!important;
}
@media(max-width:900px){
  .brand-marquee .marquee-track{animation-duration:15s!important}
}
@media(max-width:600px){
  .brand-marquee .marquee-track{animation-duration:14s!important}
}


/* =========================================================
   FINAL AUDIT PASS — HOMEPAGE SCALE + TRUE TICKER SPEED SYNC
   ========================================================= */

/* Keep the four homepage section titles compact and retail-led. */
.section-head h2,
.people h2,
.newsletter h2{
  font-size:clamp(30px,3.4vw,44px)!important;
  line-height:.94!important;
  letter-spacing:-.045em!important;
  font-weight:800!important;
}
.section-head h2{margin:0!important}
.people h2{margin:0!important}
.newsletter h2{margin:0!important}

/* Reduce the visual weight/air around the compact headings. */
.section{padding-top:36px!important;padding-bottom:36px!important}
.people{padding-top:38px!important;padding-bottom:34px!important}
.newsletter{padding-top:34px!important;padding-bottom:34px!important}
.section-head{margin-bottom:13px!important;padding-bottom:9px!important}
.people-head{padding-bottom:11px!important}

@media(max-width:900px){
  .section-head h2,
  .people h2,
  .newsletter h2{
    font-size:32px!important;
    line-height:.94!important;
  }
  .section{padding-top:32px!important;padding-bottom:32px!important}
  .people{padding-top:34px!important;padding-bottom:30px!important}
  .newsletter{padding-top:30px!important;padding-bottom:32px!important}
}
@media(max-width:600px){
  .section-head h2,
  .people h2,
  .newsletter h2{
    font-size:29px!important;
    line-height:.95!important;
    letter-spacing:-.04em!important;
  }
  .section{padding-top:28px!important;padding-bottom:30px!important}
  .people{padding-top:30px!important;padding-bottom:28px!important}
  .newsletter{padding-top:28px!important;padding-bottom:30px!important}
  .section-head{margin-bottom:11px!important;padding-bottom:8px!important}
}

/*
   The top ticker and lower OGs marquee cannot share a raw duration:
   their travel distances are different. A 16s lower loop therefore
   looks slower even though its CSS duration matches the top ticker.
   JS below calculates the lower duration from actual rendered widths so
   both move at the same pixel-per-second speed while the top stays locked
   at 16s / 15s / 14s.
*/
.brand-marquee .marquee-track{
  animation-duration:var(--ohgawd-brand-duration,7s)!important;
  animation-timing-function:linear!important;
}
@media(max-width:900px){
  .brand-marquee .marquee-track{animation-duration:var(--ohgawd-brand-duration,8s)!important}
}
@media(max-width:600px){
  .brand-marquee .marquee-track{animation-duration:var(--ohgawd-brand-duration,11s)!important}
}

/* FINAL CONTENT CLEANUP — people cards + newsletter */
.reel-placeholder:after{content:none!important;display:none!important}
.newsletter h2{font-size:clamp(34px,3.6vw,48px)!important;line-height:.92!important;letter-spacing:-.055em!important}
.newsletter-copy{font-size:12px!important;line-height:1.4!important}
@media(max-width:900px){.newsletter h2{font-size:34px!important}}
@media(max-width:600px){.newsletter h2{font-size:30px!important}.newsletter-copy{font-size:11px!important}}

/* FINAL BRAND RECALL — larger footer logo across the full packet */
.footer-brand img{
  width:150px!important;
  height:92px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.footer-brand p{margin-top:8px!important}
@media(max-width:900px){
  .footer-brand img{width:128px!important;height:78px!important}
}
@media(max-width:600px){
  .footer-brand img{width:112px!important;height:70px!important}
}

/* FINAL EMAIL COPY — approved OHGAWD signup block */
.newsletter h2{
  font-size:clamp(30px,3.2vw,44px)!important;
  line-height:.94!important;
  letter-spacing:-.045em!important;
}
.newsletter-copy{font-size:12px!important;line-height:1.4!important}
@media(max-width:600px){
  .newsletter h2{font-size:30px!important}
  .newsletter-copy{font-size:11px!important}
}

/* FINAL — no copy inside the seven Instagram/Reel placeholders */
.reel-placeholder:after{content:none!important;display:none!important}


/* =========================================================
   MASTER FINAL SYSTEM PASS — brand scale, collection type,
   shared mobile navigation, and final hierarchy
   ========================================================= */

/* Brand mark: the supplied OHGAWD logo is square, so width/height
   must both be increased to make the visible mark genuinely larger. */
.site-header{height:74px!important;grid-template-columns:170px 1fr 170px!important;padding-left:var(--ecom-gutter)!important;padding-right:var(--ecom-gutter)!important}
.site-header .brand img{width:66px!important;height:66px!important;object-fit:contain!important}
.desktop-nav{font-size:11.5px!important;letter-spacing:.075em!important;gap:24px!important}
.tools button{font-size:9px!important}

/* Collection titles use exactly the same scale family as homepage section titles. */
.collection-hero{padding:38px var(--ecom-gutter) 28px!important}
.collection-hero h1{font-size:clamp(29px,3.4vw,44px)!important;line-height:.94!important;letter-spacing:-.045em!important;font-weight:800!important;max-width:none!important}
.collection-hero p{font-size:12px!important;line-height:1.4!important;margin-top:12px!important}
.collection-tools{font-size:9px!important}
.collection-tools select{font-size:9px!important}

/* Footer recall: square source asset gets a square box so the full logo is
   actually rendered at the requested visual size. */
.footer-brand img{width:150px!important;height:150px!important;object-fit:contain!important;object-position:left center!important}

@media(max-width:900px){
  .site-header{height:68px!important;grid-template-columns:82px 1fr 110px!important}
  .site-header .brand img{width:60px!important;height:60px!important}
  .desktop-nav{font-size:11px!important;gap:18px!important}
  .collection-hero{padding:34px 18px 26px!important}
  .collection-hero h1{font-size:32px!important;line-height:.94!important}
  .footer-brand img{width:128px!important;height:128px!important}
}

@media(max-width:600px){
  .site-header{height:62px!important;padding-left:13px!important;padding-right:13px!important;grid-template-columns:74px 1fr 112px!important}
  .site-header .brand img{width:56px!important;height:56px!important}
  .desktop-nav{display:none!important}
  .collection-hero{padding:30px 12px 24px!important}
  .collection-hero h1{font-size:29px!important;line-height:.95!important;letter-spacing:-.04em!important}
  .collection-hero p{font-size:11px!important;margin-top:10px!important}
  .footer-brand img{width:112px!important;height:112px!important}
}

/* Shared mobile drawer: JS injects this on every inner page. */
.menu-drawer{width:min(420px,92vw)!important}


/* =========================================================
   FINAL LOCK — footer recall + newsletter hierarchy
   One shared template rule for the whole site.
   ========================================================= */
.newsletter h2{
  font-size:32px!important;
  line-height:.95!important;
  letter-spacing:-.04em!important;
  max-width:620px!important;
}
.newsletter-copy{
  font-size:11px!important;
  line-height:1.45!important;
  margin-top:8px!important;
}
.footer-brand{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
}
.footer-brand img{
  width:66px!important;
  height:66px!important;
  object-fit:contain!important;
  object-position:left top!important;
  display:block!important;
}
.footer-brand p{
  margin:10px 0 0!important;
  padding:0!important;
  font-size:10px!important;
  line-height:1.2!important;
  text-align:left!important;
}
@media(max-width:900px){
  .newsletter h2{font-size:31px!important}
  .newsletter-copy{font-size:11px!important}
  .footer-brand img{width:60px!important;height:60px!important}
}
@media(max-width:600px){
  .newsletter h2{font-size:29px!important;line-height:.96!important}
  .newsletter-copy{font-size:11px!important}
  .footer-brand img{width:56px!important;height:56px!important}
  .footer-brand p{font-size:10px!important;margin-top:8px!important}
}

/* MASTER FINAL — newsletter alignment + compact type + footer brand alignment */
.newsletter{
  grid-template-columns:1fr !important;
  gap:16px !important;
  align-items:start !important;
  padding:32px var(--ecom-gutter) 34px !important;
}
.newsletter-copy-wrap{min-width:0 !important;}
.newsletter h2{
  font-size:28px !important;
  line-height:.96 !important;
  letter-spacing:-.045em !important;
  max-width:520px !important;
  margin:0 !important;
}
.newsletter-copy{
  font-size:11px !important;
  line-height:1.4 !important;
  margin:7px 0 0 !important;
  max-width:420px !important;
}
.newsletter form{
  width:100% !important;
  max-width:520px !important;
  margin:0 !important;
  min-height:40px !important;
  padding-bottom:6px !important;
  justify-self:start !important;
}
.newsletter input{font-size:10px !important;}
.newsletter button{font-size:9px !important;}
.footer-brand{display:flex !important;flex-direction:column !important;align-items:flex-start !important;}
.footer-brand img{
  width:66px !important;
  height:66px !important;
  object-fit:contain !important;
  object-position:left center !important;
  display:block !important;
}
.footer-brand p{
  width:66px !important;
  margin:8px 0 0 !important;
  font-size:9px !important;
  line-height:1.2 !important;
  color:var(--muted) !important;
  text-align:left !important;
}
@media(max-width:900px){
  .newsletter{padding:30px 16px 32px !important;gap:15px !important;}
  .newsletter h2{font-size:26px !important;}
  .newsletter-copy{font-size:11px !important;}
  .newsletter form{max-width:500px !important;}
  .footer-brand img{width:60px !important;height:60px !important;}
  .footer-brand p{width:60px !important;font-size:9px !important;}
}
@media(max-width:600px){
  .newsletter{padding:28px 14px 30px !important;gap:14px !important;}
  .newsletter h2{font-size:24px !important;line-height:1 !important;}
  .newsletter-copy{font-size:10px !important;margin-top:6px !important;}
  .newsletter form{max-width:100% !important;min-height:40px !important;}
  .newsletter input{font-size:10px !important;}
  .newsletter button{font-size:8px !important;}
  .footer-brand img{width:56px !important;height:56px !important;}
  .footer-brand p{width:56px !important;font-size:8px !important;margin-top:7px !important;}
}

/* FINAL BRANDLINE LOCK — footer tagline stays one clean line under the logo on every template */
.footer-brand{
  width:max-content!important;
  min-width:0!important;
  align-items:flex-start!important;
}
.footer-brand p{
  width:auto!important;
  max-width:none!important;
  white-space:nowrap!important;
  display:block!important;
  margin:8px 0 0!important;
  padding:0!important;
  font-size:9px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-align:left!important;
}
@media(max-width:600px){
  .footer-brand p{
    font-size:8px!important;
    white-space:nowrap!important;
    margin-top:7px!important;
  }
}

/* MASTER FOOTER ALIGNMENT — logo and brandline share the exact same left/right edge */
.footer-brand{width:max-content!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;}
.footer-brand img{width:66px!important;height:66px!important;display:block!important;object-fit:contain!important;object-position:left top!important;flex:0 0 66px!important;}
.footer-brand p{width:66px!important;max-width:66px!important;min-width:66px!important;margin:8px 0 0!important;padding:0!important;display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;text-align:left!important;font-size:7px!important;line-height:1!important;letter-spacing:-.01em!important;color:var(--muted)!important;}
@media(max-width:900px){
  .footer-brand img{width:60px!important;height:60px!important;flex-basis:60px!important;}
  .footer-brand p{width:60px!important;max-width:60px!important;min-width:60px!important;font-size:6.4px!important;}
}
@media(max-width:600px){
  .footer-brand img{width:56px!important;height:56px!important;flex-basis:56px!important;}
  .footer-brand p{width:56px!important;max-width:56px!important;min-width:56px!important;font-size:6px!important;margin-top:7px!important;}
}

/* FINAL MASTER ALIGNMENT — navigation + brand system
   One shared UI scale across home and every inner template. */
.site-header .desktop-nav,
.site-header .tools button{
  font-family:var(--font-ui)!important;
  font-size:11.5px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.075em!important;
  text-transform:uppercase!important;
}
.site-header .tools{align-items:center!important;gap:24px!important;}
.site-header .tools button{padding:0!important;margin:0!important;white-space:nowrap!important;}
.site-header .tools b{font-size:inherit!important;font-weight:800!important;}

/* Header/footer logo scale is identical on every template. */
.site-header .brand img,
.footer-brand img{
  width:66px!important;
  height:66px!important;
  object-fit:contain!important;
  display:block!important;
}
.footer-brand{width:66px!important;min-width:66px!important;max-width:66px!important;}
.footer-brand p{
  width:66px!important;
  min-width:66px!important;
  max-width:66px!important;
  margin:8px 0 0!important;
  padding:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  font-family:var(--font-ui)!important;
  font-size:7px!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
  color:var(--muted)!important;
  text-align:left!important;
}
@media(max-width:900px){
  .site-header .desktop-nav{font-size:11px!important;}
  .site-header .tools button{font-size:11px!important;}
  .site-header .tools{gap:16px!important;}
  .site-header .brand img,
  .footer-brand img{width:60px!important;height:60px!important;}
  .footer-brand{width:60px!important;min-width:60px!important;max-width:60px!important;}
  .footer-brand p{width:60px!important;min-width:60px!important;max-width:60px!important;font-size:6.4px!important;}
}
@media(max-width:600px){
  .site-header .tools button{font-size:9px!important;}
  .site-header .tools{gap:10px!important;}
  .site-header .brand img,
  .footer-brand img{width:56px!important;height:56px!important;}
  .footer-brand{width:56px!important;min-width:56px!important;max-width:56px!important;}
  .footer-brand p{width:56px!important;min-width:56px!important;max-width:56px!important;font-size:6px!important;margin-top:7px!important;}
}

/* FINAL FOOTER LOGO LOCK — no tagline; larger, balanced brand mark */
.footer-brand{width:88px!important;min-width:88px!important;max-width:88px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;}
.footer-brand img{width:88px!important;height:88px!important;display:block!important;object-fit:contain!important;object-position:left top!important;flex:0 0 88px!important;}
.footer-brand p{display:none!important;}
@media(max-width:900px){
  .footer-brand{width:76px!important;min-width:76px!important;max-width:76px!important;}
  .footer-brand img{width:76px!important;height:76px!important;flex-basis:76px!important;}
}
@media(max-width:600px){
  .footer-brand{width:68px!important;min-width:68px!important;max-width:68px!important;}
  .footer-brand img{width:68px!important;height:68px!important;flex-basis:68px!important;}
}


/* FINAL FOOTER READABILITY — shared across every template */
.footer-col{
  font-size:12px!important;
  line-height:1.5!important;
  gap:8px!important;
}
.footer-col b{
  font-size:10px!important;
  line-height:1.2!important;
  letter-spacing:.10em!important;
  margin-bottom:5px!important;
}
.footer-col a{
  font-size:12px!important;
  line-height:1.5!important;
}
@media(max-width:900px){
  .footer-col{font-size:11px!important;line-height:1.45!important}
  .footer-col a{font-size:11px!important;line-height:1.45!important}
  .footer-col b{font-size:9px!important}
}
@media(max-width:600px){
  .footer-col{font-size:10px!important;line-height:1.5!important}
  .footer-col a{font-size:10px!important;line-height:1.5!important}
  .footer-col b{font-size:9px!important}
}

/* =========================================================
   OHGAWD FINAL MASTER — authoritative alignment layer
   ========================================================= */
:root{--ohgawd-nav-size:11px;--ohgawd-footer-link-size:12px;--ohgawd-footer-label-size:10px}
.site-header .desktop-nav,.site-header .desktop-nav a,.site-header .tools button{font-size:var(--ohgawd-nav-size)!important;line-height:1.1!important;letter-spacing:.075em!important;font-weight:800!important}
.site-header .brand img{width:66px!important;height:54px!important;object-fit:contain!important}
.newsletter{grid-template-columns:minmax(0,1fr)!important;gap:18px!important;align-items:start!important;padding-top:38px!important;padding-bottom:40px!important}
.newsletter h2{font-size:28px!important;line-height:1!important;letter-spacing:-.045em!important;margin:0!important;max-width:600px!important}
.newsletter-copy{font-size:12px!important;line-height:1.45!important;margin:8px 0 0!important;max-width:520px!important}
.newsletter form{width:100%!important;max-width:520px!important;margin:0!important;min-height:44px!important}
footer .footer-brand img{width:88px!important;height:88px!important;object-fit:contain!important}
footer .footer-brand p{display:none!important}
footer .footer-col{font-size:var(--ohgawd-footer-link-size)!important;line-height:1.35!important;gap:9px!important}
footer .footer-col b{font-size:var(--ohgawd-footer-label-size)!important;line-height:1.1!important;letter-spacing:.1em!important;margin-bottom:4px!important}
@media(max-width:900px){
  .site-header .brand img{width:60px!important;height:50px!important}
  .newsletter h2{font-size:26px!important}
  footer .footer-brand img{width:76px!important;height:76px!important}
  footer .footer-col{font-size:11px!important}
}
@media(max-width:600px){
  .site-header .brand img{width:56px!important;height:46px!important}
  .site-header .desktop-nav,.site-header .tools button{font-size:10px!important}
  .newsletter{padding:32px 16px 34px!important;gap:14px!important}
  .newsletter h2{font-size:24px!important}
  .newsletter-copy{font-size:11px!important}
  .newsletter form{max-width:100%!important}
  footer .footer-brand img{width:68px!important;height:68px!important}
  footer .footer-col{font-size:11px!important;line-height:1.3!important}
  footer .footer-col b{font-size:9px!important}
}

/* =========================================================
   OHGAWD FINAL TYPE SYNC — authoritative cross-page layer
   Same type family, weight, tracking and hierarchy as Home hero.
   ========================================================= */
:root{
  --ohgawd-display:clamp(42px,5.2vw,76px);
  --ohgawd-page:clamp(36px,3.8vw,52px);
  --ohgawd-section:clamp(30px,3vw,44px);
  --ohgawd-nav:11px;
}

/* Every primary heading uses the same display treatment as the hero. */
.hero-copy h1,
.collection-hero h1,
.product-info-page h1,
.standard h1,
.section-head h2,
.brand-block h2,
.newsletter h2{
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:800!important;
  letter-spacing:-.055em!important;
}
.hero-copy h1{font-size:var(--ohgawd-display)!important;line-height:.90!important}
.collection-hero h1,
.product-info-page h1,
.standard h1{font-size:var(--ohgawd-page)!important;line-height:.92!important}
.section-head h2,
.brand-block h2,
.newsletter h2{font-size:var(--ohgawd-section)!important;line-height:.92!important}

/* Header category navigation + Search + Cart are one typographic system. */
.site-header .desktop-nav,
.site-header .desktop-nav a,
.site-header .tools button,
.site-header .menu-btn{
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:var(--ohgawd-nav)!important;
  font-weight:800!important;
  line-height:1.1!important;
  letter-spacing:.075em!important;
}

/* Collection controls use the same small utility scale everywhere. */
.collection-tools,
.collection-tools select,
.section-head a,
.eyebrow,
.footer-col b{
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:800!important;
}

@media(max-width:900px){
  .collection-hero h1,
  .product-info-page h1,
  .standard h1{font-size:44px!important}
  .section-head h2,
  .brand-block h2,
  .newsletter h2{font-size:34px!important}
  .site-header .desktop-nav,.site-header .desktop-nav a,.site-header .tools button,.site-header .menu-btn{font-size:10px!important}
}
@media(max-width:600px){
  .hero-copy h1{font-size:43px!important}
  .collection-hero h1,
  .product-info-page h1,
  .standard h1{font-size:38px!important}
  .section-head h2,
  .brand-block h2,
  .newsletter h2{font-size:30px!important}
  .site-header .tools button,.site-header .menu-btn{font-size:10px!important}
}

/* Product media state: intentionally explicit until real OHGAWD product photography is supplied. */
.product-placeholder{position:relative;display:flex;align-items:center;justify-content:center;background:#efefec;overflow:hidden}
.product-image-label{font-size:9px;font-weight:800;letter-spacing:.12em;color:#111;border:1px solid #111;padding:8px 10px}
.product-placeholder .badge{position:absolute;left:10px;top:10px}
.product-placeholder .code{position:absolute;left:10px;bottom:10px;font-size:8px;font-weight:800;letter-spacing:.1em}
.product-image.product-placeholder{min-height:520px}
@media(max-width:900px){.product-image.product-placeholder{min-height:420px}}
@media(max-width:600px){.product-image.product-placeholder{min-height:360px}.product-image-label{font-size:8px;padding:7px 9px}}


/* FINAL — compact newsletter headline */
.newsletter h2{font-size:24px!important;line-height:1!important;letter-spacing:-.045em!important}
@media(max-width:900px){.newsletter h2{font-size:22px!important}}
@media(max-width:600px){.newsletter h2{font-size:20px!important}}


/* Newsletter heading size lock — keep approved wording, reduce visual scale */
.newsletter h2{font-size:22px!important;line-height:1!important;letter-spacing:-.035em!important}
@media(max-width:600px){.newsletter h2{font-size:16px!important;line-height:1!important}}

/* Final newsletter typography */
.newsletter h2{font-size:16px !important;line-height:1 !important;margin:0 !important}
@media(max-width:600px){.newsletter h2{font-size:12px !important}}

/* FINAL REQUEST — larger, readable OHGAWD header logo */
.site-header{height:84px!important;}
.site-header .brand img{width:76px!important;height:76px!important;object-fit:contain!important;display:block!important;}
@media(max-width:900px){
  .site-header{height:72px!important;}
  .site-header .brand img{width:68px!important;height:68px!important;}
}
@media(max-width:600px){
  .site-header{height:66px!important;padding-left:13px!important;padding-right:13px!important;}
  .site-header .brand img{width:62px!important;height:62px!important;}
}

/* FINAL LOCK — header/logo/newsletter UI */
.site-header .brand img{width:60px;height:60px;object-fit:contain}
.newsletter h2{font-size:16px}
@media(max-width:900px){.site-header .brand img{width:54px;height:54px}}
@media(max-width:600px){.site-header .brand img{width:50px;height:50px}.newsletter h2{font-size:12px}}

/* 2026 HOMEPAGE MASTER — editorial streetwear / ecommerce hierarchy */
:root{--font-ui:Arial,Helvetica,sans-serif;--font-display:Arial,Helvetica,sans-serif}
html,body,button,input,select,textarea{font-family:var(--font-ui)!important}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.section-head h2,.tile-name,.mode-card h3,.brand-story-copy h2,.instagram-head h2,.newsletter h2{font-family:var(--font-display)!important;font-weight:800!important}
.hero-copy h1{font-weight:800!important;letter-spacing:-.065em!important}
.section-head h2,.modes-head h2,.instagram-head h2{font-size:clamp(30px,3.2vw,44px)!important;line-height:.92!important;letter-spacing:-.055em!important}

/* Find Your Mode — four audience situations, not four demographic boxes */
.modes-section{padding:42px var(--content-gutter) 48px;background:#fff}
.modes-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:12px;margin-bottom:12px}
.modes-head h2{margin:0}
.modes-head p{margin:0;font-size:11px;color:#555;letter-spacing:.01em}
.modes-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.mode-card{position:relative;min-height:390px;overflow:hidden;color:#fff;background:var(--ink);isolation:isolate}
.mode-visual{position:absolute;inset:0;z-index:-3}
.mode-visual-image img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center);filter:saturate(.78) contrast(1.03)}
.mode-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 15%,rgba(0,0,0,.18) 42%,rgba(0,0,0,.82) 100%);z-index:-2}
.mode-card:nth-child(1) .mode-shade{background:linear-gradient(180deg,rgba(33,72,164,.22),rgba(33,72,164,.72))}
.mode-card:nth-child(3) .mode-shade{background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.76))}
.mode-card:nth-child(4) .mode-shade{background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.84))}
.mode-copy{height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:18px}
.mode-index{font-size:8px;font-weight:800;letter-spacing:.12em;margin-bottom:auto}
.mode-card h3{font-size:clamp(26px,2.5vw,39px);line-height:.9;letter-spacing:-.06em;margin:0 0 9px}
.mode-card p{font-size:10px;line-height:1.35;margin:0 0 16px;max-width:190px}
.mode-cta{font-size:8px;font-weight:800;letter-spacing:.09em;border:1px solid rgba(255,255,255,.7);padding:8px 10px;width:max-content}
.mode-card:hover .mode-visual-image img{transform:scale(1.025);transition:transform .35s ease}

/* Brand story — useful context without taking over the store */
.brand-story{display:grid;grid-template-columns:1.08fr .92fr;background:var(--soft)}
.brand-story-image{min-height:420px;overflow:hidden}
.brand-story-image img{width:100%;height:100%;object-fit:cover;object-position:center}
.brand-story-copy{padding:52px var(--content-gutter);display:flex;flex-direction:column;justify-content:center}
.brand-story-copy h2{font-size:clamp(38px,4.4vw,62px);line-height:.88;letter-spacing:-.065em;margin:0 0 18px}
.brand-story-copy p{font-size:12px;line-height:1.5;max-width:430px;margin:0 0 20px;color:#30302d}
.brand-story-copy a{font-size:9px;font-weight:800;letter-spacing:.08em;width:max-content;border-bottom:1px solid var(--ink);padding-bottom:4px}

/* IRL / UGC — compact, shoppable social proof */
.instagram-reels-compact{padding:38px var(--content-gutter) 42px!important}
.instagram-reels-compact .instagram-head{margin-bottom:8px!important}
.instagram-reels-compact .instagram-head h2{font-size:clamp(26px,3vw,40px)!important}
.instagram-sub{font-size:11px;line-height:1.4;margin:0 0 13px;color:#555}
.instagram-sub strong{color:var(--ink)}
.instagram-reels-compact .reels-track{gap:7px}
.instagram-reels-compact .reel-card{flex:1 1 0;min-width:0;max-width:none;aspect-ratio:9/13;background:var(--soft);border:1px solid var(--line)}
.instagram-reels-compact .reel-card.reel-cta-card{background:var(--blue);color:#fff;display:flex;align-items:flex-end;padding:14px}
.reel-cta-card>div{display:flex;flex-direction:column;gap:14px}
.cta-big{font-family:var(--font-display);font-size:clamp(22px,2.2vw,34px);font-weight:800;line-height:.9;letter-spacing:-.06em}
.instagram-reels-compact .reel-fallback img{width:28%}

/* Keep approved newsletter scale */
.newsletter h2{font-size:16px!important;line-height:1!important;letter-spacing:-.02em!important}
@media(max-width:900px){
 .modes-section{padding:38px 16px 42px}
 .modes-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mode-card{min-height:330px}
 .mode-card h3{font-size:31px}
 .brand-story{grid-template-columns:1fr}
 .brand-story-image{min-height:360px}
 .brand-story-copy{padding:38px 16px 42px}
 .instagram-reels-compact{padding-left:16px!important;padding-right:16px!important}
 .instagram-reels-compact .reel-card{flex:0 0 17vw;min-width:145px}
}
@media(max-width:600px){
 .modes-section{padding:34px 12px 36px}
 .modes-head{display:block}
 .modes-head p{margin-top:7px}
 .modes-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;margin-right:-12px;padding-right:12px;scrollbar-width:none}
 .modes-grid::-webkit-scrollbar{display:none}
 .mode-card{flex:0 0 78vw;min-height:360px;scroll-snap-align:start}
 .mode-card h3{font-size:34px}
 .mode-card p{font-size:10px}
 .brand-story-image{min-height:300px}
 .brand-story-copy{padding:32px 16px 36px}
 .brand-story-copy h2{font-size:38px}
 .instagram-reels-compact{padding:32px 12px 34px!important}
 .instagram-reels-compact .instagram-head h2{font-size:27px!important}
 .instagram-reels-compact .reel-card{flex:0 0 31vw;min-width:118px}
 .instagram-reels-compact .reel-cta-card{flex-basis:46vw;min-width:170px}
 .cta-big{font-size:28px}
 .newsletter h2{font-size:12px!important}
}

/* FINAL TYPOGRAPHY — Innovecouture-inspired fashion ecommerce hierarchy */
:root{
  --font-ui: Arial, Helvetica, sans-serif;
  --font-display: Arial, Helvetica, sans-serif;
}
html,body,button,input,select,textarea{font-family:Arial, Helvetica, sans-serif!important}
body{font-weight:400;letter-spacing:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.site-header .desktop-nav,.tools button,.menu-btn{font-size:10px!important;font-weight:700!important;letter-spacing:.075em!important;line-height:1.1}
.announcement{font-size:9px!important;font-weight:700!important;letter-spacing:.14em!important}
.hero-mini h1,.hero-copy h1{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.07em!important;line-height:.84!important}
.eyebrow{font-size:9px!important;font-weight:700!important;letter-spacing:.14em!important}
.section-head h2,.modes-head h2,.instagram-head h2{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.055em!important;line-height:.9!important}
.section-head h2{font-size:clamp(32px,3.2vw,44px)!important}
.modes-head h2{font-size:clamp(32px,3.2vw,44px)!important}
.mode-card h3{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.065em!important;line-height:.88!important}
.brand-story-copy h2{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.065em!important;line-height:.88!important}
.card .name{font-size:11px!important;font-weight:700!important;letter-spacing:.01em!important}
.card .meta{font-size:9px!important;font-weight:400!important;letter-spacing:.01em!important}
.card .price{font-size:10px!important;font-weight:700!important}
.add{font-size:9px!important;font-weight:700!important;letter-spacing:.075em!important}
.product-info-page h1{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.07em!important;line-height:.86!important}
.collection-hero h1{font-family:Arial, Helvetica, sans-serif!important;font-weight:800!important;letter-spacing:-.075em!important;line-height:.82!important}
.collection-tools,.collection-tools select{font-size:9px!important;font-weight:700!important;letter-spacing:.075em!important}
.footer-col{font-size:10px!important;font-weight:400!important;line-height:1.3!important}
.footer-col b{font-size:9px!important;font-weight:700!important;letter-spacing:.1em!important}
.newsletter h2{font-family:Arial, Helvetica, sans-serif!important;font-size:16px!important;font-weight:800!important;letter-spacing:-.025em!important;line-height:1!important}
@media(max-width:600px){
  .section-head h2,.modes-head h2{font-size:29px!important}
  .newsletter h2{font-size:12px!important}
}


/* USER FINAL HOMEPAGE CORRECTIONS — 2026-09-20 */
.announcement{font-weight:400!important;text-transform:none!important}
.announcement span{font-weight:400!important}
.category-picker-section .section-head .eyebrow{display:none!important}
.tile-index{display:none!important}
.modes-head{display:block!important;align-items:initial!important}
.modes-head>div{display:block!important}
.modes-head p{margin:7px 0 0!important;font-size:11px!important;color:#555!important;letter-spacing:.01em!important;text-align:left!important}
.instagram-reels-compact .reels-track{display:flex!important}
.instagram-reels-compact .reel-cta-card{order:-1!important}
.newsletter{padding:22px var(--content-gutter) 24px!important;grid-template-columns:minmax(0,1fr) minmax(280px,420px)!important;gap:24px!important;min-height:0!important}
.newsletter h2{font-size:16px!important;line-height:1!important}
.newsletter form{min-height:32px!important;padding-bottom:5px!important}
.newsletter input{font-size:10px!important}
.newsletter button{font-size:9px!important}
@media(max-width:900px){
 .newsletter{padding:20px 16px 22px!important;grid-template-columns:1fr!important;gap:12px!important}
 .newsletter form{min-height:32px!important;margin-top:0!important;max-width:460px!important}
}
@media(max-width:600px){
 .newsletter{padding:18px 12px 20px!important;gap:10px!important}
 .newsletter h2{font-size:12px!important}
 .newsletter form{min-height:30px!important}
}

/* Category picker: no category is selected by default; blue is hover-only. */
.category-picker .category-tile:nth-child(3){background:#fff;color:var(--ink);border-color:var(--line)}
.category-picker .category-tile:hover{background:var(--blue);color:#fff;border-color:var(--blue)}


/* FINAL REFINEMENT PASS — cleaner retail surfaces, stronger visual hierarchy */
.category-picker-section{padding-top:38px!important;padding-bottom:38px!important}
.category-picker-section .section-head{margin-bottom:12px!important;padding-bottom:9px!important}
.category-picker-section .section-head h2{letter-spacing:-.065em!important}
.category-picker{gap:6px!important}
.category-tile{position:relative!important;min-height:184px!important;padding:15px!important;overflow:hidden!important;background:#fff!important;color:var(--ink)!important;border:1px solid var(--line)!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;isolation:isolate!important;transition:background .25s ease,color .25s ease,border-color .25s ease!important}
.category-tile .tile-name{position:relative;z-index:3;font-size:clamp(21px,2vw,29px)!important;line-height:.92!important;letter-spacing:-.055em!important}
.category-tile .tile-arrow{position:relative;z-index:3;font-size:9px!important;font-weight:800!important;letter-spacing:.06em!important}
.category-tile .tile-visual{position:absolute;z-index:1;right:-7%;bottom:-19%;width:68%;height:78%;overflow:hidden;opacity:.12;transform:rotate(-2deg);transition:opacity .25s ease,transform .35s ease,filter .25s ease}
.category-tile .tile-visual img{width:180%;height:100%;object-fit:cover;object-position:center;filter:grayscale(1) contrast(1.05);display:block}
.category-tile:nth-child(1) .tile-visual img{object-position:22% center}
.category-tile:nth-child(2) .tile-visual img{object-position:46% center}
.category-tile:nth-child(3) .tile-visual img{object-position:70% center}
.category-tile:nth-child(4) .tile-visual img{object-position:92% center}
.category-tile:hover{background:var(--blue)!important;color:#fff!important;border-color:var(--blue)!important}
.category-tile:hover .tile-visual{opacity:.42;transform:rotate(0) scale(1.035)}
.category-tile:hover .tile-visual img{filter:grayscale(1) contrast(1.1) brightness(1.18)}

.section:not(.category-picker-section){padding-top:38px!important;padding-bottom:38px!important}
.section:not(.category-picker-section) .section-head{margin-bottom:13px!important}
.section-head h2{letter-spacing:-.065em!important}

.product-placeholder{background:#f0f0ed!important;border:1px solid #e1e1dc!important}
.product-placeholder:after{content:"";position:absolute;inset:12px;border:1px solid rgba(9,9,9,.06);pointer-events:none}
.placeholder-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;position:relative;z-index:2;opacity:.92}
.placeholder-brand img{width:62px;height:62px;object-fit:contain;display:block}
.placeholder-brand span{font-size:7px;font-weight:800;letter-spacing:.16em;border-top:1px solid rgba(9,9,9,.28);padding-top:8px}
.product-image-label{display:none!important}
.product-placeholder .code{font-size:7px!important;letter-spacing:.13em!important;color:#555!important}
.card:hover .placeholder-brand{transform:translateY(-3px);transition:transform .25s ease}
.card .visual{transition:background .25s ease}

.modes-section{padding-top:38px!important;padding-bottom:42px!important}
.modes-head{padding-bottom:10px!important;margin-bottom:10px!important}
.modes-head h2{letter-spacing:-.065em!important}
.mode-card{min-height:378px!important}
.mode-card h3{letter-spacing:-.07em!important}
.mode-card p{margin-bottom:13px!important;color:rgba(255,255,255,.86)!important}
.mode-card .mode-cta{font-size:8px!important;letter-spacing:.09em!important}

.instagram-reels-compact{padding-top:36px!important;padding-bottom:38px!important}
.instagram-reels-compact .instagram-head{padding-bottom:9px!important;border-bottom:1px solid var(--line)!important;margin-bottom:7px!important}
.instagram-reels-compact .instagram-head h2{letter-spacing:-.065em!important}
.instagram-sub{font-size:10px!important;color:#666!important;margin-bottom:11px!important}
.instagram-reels-compact .reels-track{gap:6px!important}
.instagram-reels-compact .reel-card{border-color:#dfdfda!important;background:#f3f3f0!important;transition:transform .25s ease,border-color .25s ease!important}
.instagram-reels-compact .reel-card:hover{transform:translateY(-3px);border-color:#bdbdb6!important}
.instagram-reels-compact .reel-cta-card{background:var(--blue)!important;border-color:var(--blue)!important}
.instagram-reels-compact .reel-fallback img{width:25%!important;opacity:.96}

.newsletter{border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}
.newsletter-copy-wrap .eyebrow{margin-bottom:5px!important}
.newsletter h2{letter-spacing:-.035em!important}

@media(max-width:900px){
 .category-tile{min-height:150px!important}
 .category-tile .tile-visual{width:72%;height:78%;right:-9%;bottom:-20%}
 .mode-card{min-height:350px!important}
}
@media(max-width:600px){
 .category-picker-section{padding-top:30px!important;padding-bottom:30px!important}
 .category-tile{min-height:124px!important;padding:11px!important}
 .category-tile .tile-name{font-size:18px!important}
 .category-tile .tile-arrow{font-size:8px!important}
 .category-tile .tile-visual{width:75%;height:75%;right:-12%;bottom:-20%;opacity:.1}
 .placeholder-brand img{width:50px;height:50px}
 .placeholder-brand{gap:9px}
 .placeholder-brand span{font-size:6px;padding-top:6px}
 .mode-card{min-height:350px!important}
}

/* NEWSLETTER CLEAN ALIGNMENT — keep copy + email as one centered composition */
.newsletter{
  grid-template-columns:minmax(0,1fr) minmax(320px,520px)!important;
  gap:56px!important;
  padding:28px max(24px, calc((100vw - 1040px)/2)) 30px!important;
  align-items:center!important;
}
.newsletter-copy-wrap{min-width:0!important}
.newsletter-copy-wrap .eyebrow{font-size:8px!important;letter-spacing:.14em!important;margin-bottom:6px!important}
.newsletter h2{font-size:16px!important;line-height:1!important;margin:0!important}
.newsletter form{
  width:100%!important;
  min-height:36px!important;
  margin:0!important;
  padding:0 0 6px!important;
  border-bottom:1px solid var(--ink)!important;
}
.newsletter input{font-size:10px!important}
.newsletter button{font-size:9px!important}
@media(max-width:900px){
  .newsletter{grid-template-columns:1fr!important;gap:12px!important;padding:24px 24px 26px!important}
  .newsletter form{max-width:none!important}
}
@media(max-width:600px){
  .newsletter{gap:10px!important;padding:20px 16px 22px!important}
  .newsletter h2{font-size:12px!important}
  .newsletter form{min-height:32px!important}
}

/* NEWSLETTER — stacked, left-corner aligned composition */
.newsletter{
  display:block!important;
  padding:28px var(--content-gutter) 32px!important;
  text-align:left!important;
}
.newsletter-copy-wrap{
  width:min(520px,100%)!important;
  margin:0!important;
}
.newsletter-copy-wrap .eyebrow{
  margin-bottom:6px!important;
}
.newsletter h2{
  margin:0!important;
  font-size:16px!important;
  line-height:1!important;
}
.newsletter form{
  width:min(520px,100%)!important;
  min-height:36px!important;
  margin:14px 0 0!important;
  padding:0 0 6px!important;
  border-bottom:1px solid var(--ink)!important;
}
.newsletter input{font-size:10px!important}
.newsletter button{font-size:9px!important}
@media(max-width:900px){
  .newsletter{padding:24px 16px 26px!important}
  .newsletter form{margin-top:12px!important}
}
@media(max-width:600px){
  .newsletter{padding:20px 16px 22px!important}
  .newsletter h2{font-size:12px!important}
  .newsletter form{min-height:32px!important}
}

/* NEWSLETTER — compact width matching the text block */
.newsletter form{
  width:170px!important;
  max-width:170px!important;
  min-height:32px!important;
  margin:12px 0 0!important;
  padding:0 0 5px!important;
}
.newsletter input{min-width:0!important;width:100%!important}
@media(max-width:600px){
  .newsletter form{width:150px!important;max-width:150px!important;min-height:30px!important;margin-top:10px!important}
}


/* FINAL NEWSLETTER + OFF-DUTY REFINEMENT */
.newsletter{grid-template-columns:minmax(0,1fr);gap:18px!important;align-items:start!important;}
.newsletter-copy-wrap{max-width:620px!important;}
.newsletter form{width:min(100%,520px)!important;max-width:520px!important;margin-left:0!important;min-height:48px!important;padding-bottom:8px!important;}
.newsletter input{font-size:12px!important;line-height:1.3!important;}
.newsletter button{font-size:10px!important;}
@media(max-width:600px){
  .newsletter{gap:16px!important;}
  .newsletter form{width:100%!important;max-width:100%!important;min-height:46px!important;}
  .newsletter input{font-size:11px!important;}
}
/* Campus mode subtext: keep the approved line on one line */
.mode-card.mode-campus p{max-width:none;white-space:nowrap}

/* FINAL NAV SPACING REFINEMENT — tighter, cleaner ecommerce rhythm */
.site-header .desktop-nav{gap:18px!important;}
@media(max-width:900px){
  .site-header .desktop-nav{gap:16px!important;}
}


/* FINAL AUDIT FIX — mode hierarchy + clean header navigation */
.mode-card h3{
  text-transform:uppercase!important;
}
.mode-card p{
  text-transform:uppercase!important;
  white-space:nowrap!important;
  max-width:none!important;
}
.site-header .desktop-nav{
  gap:16px!important;
  align-items:center!important;
}
.site-header .desktop-nav a{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:7px 1px!important;
  transition:color .2s ease!important;
}
.site-header .desktop-nav a::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:1px!important;
  height:1px!important;
  background:var(--blue)!important;
  transform:scaleX(0)!important;
  transform-origin:center!important;
  transition:transform .2s ease!important;
}
.site-header .desktop-nav a:hover::after,
.site-header .desktop-nav a:focus-visible::after{
  transform:scaleX(1)!important;
}
@media(max-width:900px){
  .site-header .desktop-nav{gap:14px!important;}
}

/* Real product photo support — added for product-manager.html uploads */
.visual.has-photo:before{display:none}
.visual .real-photo{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.visual.has-photo .badge{z-index:2}
.product-image .real-photo{width:100%;height:100%;object-fit:cover;position:relative}
.product-image:has(.real-photo):before{display:none}
.p-description{font-size:12px;line-height:1.6;color:var(--muted);margin-top:16px;max-width:440px}
.p-sku{font-size:9px;color:var(--muted);letter-spacing:.08em;margin-top:6px}

/* ===== Promo / GST / Size Guide — added for checkout flow ===== */
.gst-note{font-size:10px;color:var(--muted);margin:6px 0 0}
.promo-row{display:flex;gap:10px;margin:18px 0;flex-wrap:wrap}
.promo-chip{flex:1;min-width:200px;border:1px solid var(--line);background:var(--soft);padding:12px}
.promo-code{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:900;letter-spacing:.03em;background:#fff;border:1px dashed var(--blue);color:var(--blue);padding:6px 9px;display:inline-flex;margin-bottom:7px}
.promo-code .copy-btn{border:0;background:none;color:var(--blue);cursor:pointer;font-size:12px;padding:0;line-height:1}
.promo-desc{display:block;font-size:10px;color:var(--muted);line-height:1.4}
.select-label-row{display:flex;justify-content:space-between;align-items:center;margin:22px 0 8px}
.select-label-row .select-label{margin:0}
.size-guide-link{border:0;background:none;font-size:9px;font-weight:800;letter-spacing:.08em;text-decoration:underline;cursor:pointer;color:var(--ink)}
.size-guide-drawer{width:min(480px,92vw)}
.size-guide-body{padding-top:6px}
.sg-head-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.sg-title{font-size:15px;font-weight:900;letter-spacing:-.02em}
.unit-toggle{display:flex;border:1px solid var(--ink)}
.unit-btn{border:0;background:#fff;padding:6px 12px;font-size:9px;font-weight:800;letter-spacing:.06em;cursor:pointer}
.unit-btn.active{background:var(--ink);color:#fff}
.size-table{width:100%;border-collapse:collapse;margin-bottom:14px}
.size-table th,.size-table td{border:1px solid var(--line);padding:9px 6px;text-align:center;font-size:11px}
.size-table thead th{background:var(--soft);font-weight:800;font-size:9px;letter-spacing:.06em}
.size-table td:first-child,.size-table th:first-child{font-weight:800}
.sg-note{font-size:9px;color:var(--muted);margin:0 0 20px}
.how-to-measure{border-top:1px solid var(--line);padding-top:14px}
.how-to-measure b{font-size:10px;letter-spacing:.06em}
.how-to-measure p{font-size:11px;line-height:1.6;color:var(--muted);margin-top:8px}

/* ===== Checkout flow: bag page, login, address, payment ===== */
.checkout-header{height:66px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:16px}
.checkout-header img{width:80px;height:44px;object-fit:contain}

.bag-page{max-width:var(--max);margin:auto;padding:40px 24px;display:grid;grid-template-columns:1.6fr 1fr;gap:50px}
.bag-page h1{font-size:26px;letter-spacing:-.03em;margin:0 0 24px}
.bag-items{border-top:1px solid var(--line)}
.bag-item-row{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}
.bag-item-row .thumb{aspect-ratio:1;background:var(--soft);overflow:hidden}
.bag-item-row .thumb img{width:100%;height:100%;object-fit:cover}
.bag-item-row h4{font-size:14px;margin:0 0 6px}
.bag-item-row p{font-size:11px;color:var(--muted);margin:3px 0}
.bag-item-row .price{font-weight:800;color:var(--ink);font-size:12px}
.qty-control{display:inline-flex;align-items:center;gap:12px;margin-top:8px}
.qty-control button{width:26px;height:26px;border:1px solid var(--line);background:#fff;font-size:13px;cursor:pointer}
.item-links{display:flex;gap:16px;margin-top:10px}
.item-links a,.item-links button{font-size:10px;font-weight:800;letter-spacing:.05em;border:0;background:none;text-decoration:underline;cursor:pointer;padding:0;color:var(--ink)}
.summary-box{border:1px solid var(--line);padding:22px;align-self:start}
.summary-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.summary-row:last-of-type{border-bottom:0}
.coupon-applied{display:flex;justify-content:space-between;align-items:center;background:var(--soft);padding:12px;font-size:11px;margin-bottom:14px}
.coupon-applied b{color:var(--blue)}
.coupon-applied button{border:0;background:var(--ink);color:#fff;font-size:9px;font-weight:800;padding:8px 12px;cursor:pointer}
.order-total{display:flex;justify-content:space-between;font-size:15px;font-weight:900;padding-top:14px}
.summary-cta{width:100%;height:52px;background:var(--ink);color:#fff;border:0;font-size:11px;font-weight:800;letter-spacing:.08em;margin-top:18px;cursor:pointer}
.empty-bag{padding:80px 24px;text-align:center}
.empty-bag a{display:inline-block;margin-top:16px;background:var(--ink);color:#fff;padding:14px 22px;font-size:11px;font-weight:800;letter-spacing:.08em}

.auth-page{min-height:100dvh;background:var(--ink);display:grid;grid-template-columns:1.3fr 1fr}
.auth-visual{position:relative;overflow:hidden;background:var(--blue)}
.auth-visual img{width:100%;height:100%;object-fit:cover;opacity:.75;mix-blend-mode:luminosity}
.auth-back{position:absolute;top:24px;left:24px;color:#fff;font-size:22px;text-decoration:none;z-index:2}
.auth-panel{display:flex;align-items:center;justify-content:center;padding:30px}
.auth-card{width:100%;max-width:360px;background:#111;border:1px solid #232323;padding:36px 30px;color:#fff}
.auth-card .auth-logo{height:22px;margin-bottom:26px;filter:brightness(0) invert(1)}
.auth-card label{display:block;font-size:9px;font-weight:800;letter-spacing:.1em;color:#9a9a9a;margin-bottom:16px}
.auth-field{display:flex;align-items:center;gap:8px;border-bottom:1px solid #333;padding-bottom:10px;margin-bottom:6px}
.auth-field .cc{font-size:13px;color:#9a9a9a}
.auth-field input{background:none;border:0;color:#fff;font-size:14px;width:100%;outline:0}
.auth-field input::placeholder{color:#555}
.auth-btn{width:100%;height:50px;background:#fff;color:var(--ink);border:0;font-size:11px;font-weight:800;letter-spacing:.08em;margin-top:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.auth-btn:disabled{opacity:.4;cursor:not-allowed}
.auth-legal{font-size:9px;color:#777;text-align:center;margin-top:16px;line-height:1.6}
.auth-legal a{color:#ccc;text-decoration:underline}
.otp-row{display:flex;gap:10px;justify-content:center;margin:20px 0}
.otp-box{width:48px;height:56px;background:#0a0a0a;border:1px solid #333;color:#fff;text-align:center;font-size:20px;outline:0}
.otp-box:focus{border-color:var(--blue)}
.otp-sub{text-align:center;font-size:11px;color:#9a9a9a;margin-bottom:6px}
.otp-sub b{color:#fff}
.otp-meta{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#9a9a9a;margin-top:20px}
.otp-meta a{color:#fff;text-decoration:underline;cursor:pointer}
.otp-methods{display:flex;gap:10px;margin-top:14px}
.otp-methods button{flex:1;border:1px solid #333;background:none;color:#fff;font-size:10px;font-weight:800;letter-spacing:.05em;padding:11px 0;cursor:pointer}

.address-page{max-width:640px;margin:0 auto;padding:40px 24px}
.address-page h1{font-size:20px;letter-spacing:-.02em;display:flex;align-items:center;gap:10px;margin:0 0 26px}
.address-page a.back{font-size:20px}
.address-field{width:100%;border:1px solid var(--line);padding:13px;font-size:13px;margin-bottom:12px;font-family:inherit}
.address-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.address-row2 .address-field{margin-bottom:12px}
.address-check{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin:8px 0 24px}
.address-submit{width:100%;height:52px;background:var(--ink);color:#fff;border:0;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer}
.address-alt{text-align:center;font-size:10px;color:var(--muted);margin-top:16px}
.address-alt a{color:var(--blue);text-decoration:underline}

.payment-page{max-width:640px;margin:0 auto;padding:40px 24px}
.payment-page h1{font-size:20px;letter-spacing:-.02em;margin:0 0 20px}
.pay-summary{border:1px solid var(--line);padding:16px;margin-bottom:26px;display:flex;justify-content:space-between;font-size:13px;font-weight:800}
.pay-option{border:1px solid var(--line);padding:16px;display:flex;align-items:center;gap:12px;margin-bottom:10px;cursor:pointer}
.pay-option input{accent-color:var(--blue)}
.pay-option span{font-size:12px;font-weight:700}
.pay-cta{width:100%;height:52px;background:var(--blue);color:#fff;border:0;font-size:11px;font-weight:800;letter-spacing:.08em;margin-top:20px;cursor:pointer}
.pay-note{font-size:10px;color:var(--muted);line-height:1.6;margin-top:14px}

@media(max-width:900px){
  .bag-page{grid-template-columns:1fr;padding:26px 16px}
  .auth-page{grid-template-columns:1fr}
  .auth-visual{display:none}
  .promo-row{flex-direction:column}
}

/* ===== Bag page: click-to-apply coupon list (not auto-applied) ===== */
.coupon-section{margin-bottom:20px}
.coupon-heading{font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted);margin:0 0 10px}
.coupon-option{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px dashed var(--line);padding:10px;margin-bottom:8px}
.coupon-option .promo-code{font-size:11px;padding:4px 7px;margin-bottom:4px}
.coupon-desc{display:block;font-size:9px;color:var(--muted);line-height:1.4;max-width:180px}
.coupon-apply-btn{border:1px solid var(--ink);background:#fff;color:var(--ink);font-size:9px;font-weight:800;letter-spacing:.05em;padding:8px 12px;cursor:pointer;white-space:nowrap}
.coupon-option.applied{border:1px solid var(--blue);background:var(--soft)}
.coupon-option.applied .coupon-apply-btn{background:var(--blue);color:#fff;border-color:var(--blue)}
.coupon-option.ineligible{opacity:.45}
.coupon-apply-btn:disabled{cursor:not-allowed}

/* ===== Coupons: all shown together, one at a time ===== */
.coupon-hint{font-size:10px;color:var(--muted);margin:-4px 0 10px;line-height:1.4}
.coupon-message{font-size:10px;font-weight:700;color:#8a4b00;background:#fff4e5;border:1px solid #f0c987;padding:9px 10px;margin:0 0 10px;line-height:1.4}
.coupon-desc{max-width:none}
.coupon-reason{display:block;font-size:10px;font-weight:700;color:var(--ink);margin-top:5px;line-height:1.4}
.coupon-reason.ok{color:var(--blue)}
.coupon-option.unavailable .promo-code,.coupon-option.unavailable .coupon-desc{opacity:.5}
.coupon-option.unavailable .coupon-apply-btn{opacity:.4}
.coupon-option.applied .coupon-apply-btn{background:var(--ink);border-color:var(--ink);color:#fff;cursor:pointer}

.pay-coupons{margin-top:24px}

/* ===== Compact coupons (one line each) ===== */
.promo-row{flex-direction:column;gap:6px;margin:14px 0}
.promo-chip{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;min-width:0;flex:none;padding:7px 10px}
.promo-chip .promo-code{font-size:10.5px;padding:3px 7px;letter-spacing:.04em;gap:6px}
.promo-chip .promo-code .copy-btn{font-size:11px}
.promo-chip .promo-desc{font-size:10px;line-height:1.3;white-space:nowrap;color:var(--muted)}
.coupon-option{padding:9px 10px;margin-bottom:6px}
.coupon-option .promo-code{font-size:10.5px;padding:3px 7px;margin-bottom:3px}
.coupon-desc{font-size:10px;white-space:nowrap}
.coupon-reason{font-size:10px;white-space:normal}
.pay-saving{font-size:11px;font-weight:700;color:var(--blue);margin:-6px 0 14px}
.pay-saving:empty{display:none}
@media(max-width:380px){.coupon-desc,.promo-chip .promo-desc{font-size:9px}}
.promo-chip .promo-code{min-width:98px;justify-content:space-between}

/* =====================================================================
   SHOPPING EXPERIENCE POLISH
   ===================================================================== */
[hidden]{display:none!important}
html.drawer-open,html.drawer-open body{overflow:hidden}

/* keyboard focus you can actually see */
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.auth-page a:focus-visible,.auth-page button:focus-visible,.auth-page input:focus-visible{outline-color:#fff}

/* bigger tap areas without changing the look */
.site-header .tools button,.site-header .menu-btn,.promo-code .copy-btn,.size-guide-link{position:relative}
.site-header .tools button::after,.site-header .menu-btn::after{content:"";position:absolute;inset:-16px -8px}
.promo-code .copy-btn::after{content:"";position:absolute;inset:-10px -8px}
.size-guide-link{padding:12px 0!important}
.footer-col a{display:inline-block;padding:6px 0}
.drawer-head button{min-width:40px;min-height:40px}
.qty-control button{width:32px;height:32px}
.qty-control button:disabled{opacity:.35;cursor:not-allowed}
.remove{padding:10px 0!important;font-size:9px!important;text-decoration:underline;cursor:pointer}

/* product cards: choose a size right on the card */
.card-link{display:block;color:inherit}
.add:disabled{background:#cfcfca;color:#fff;cursor:not-allowed}
.quick-sizes{margin-top:7px;border:1px solid var(--line);padding:9px;background:#fff}
.quick-sizes>span{display:block;font-size:8px;font-weight:800;letter-spacing:.08em;color:var(--muted);margin-bottom:7px}
.quick-sizes div{display:flex;flex-wrap:wrap;gap:6px}
.quick-sizes button{min-width:38px;height:36px;padding:0 6px;border:1px solid var(--line);background:#fff;font-size:10px;font-weight:800;cursor:pointer}
.quick-sizes button:hover:not(:disabled){background:var(--ink);color:#fff;border-color:var(--ink)}
.quick-sizes button.off{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.grid-empty{grid-column:1/-1;padding:48px 0;text-align:center;font-size:11px;letter-spacing:.06em}

/* small message at the bottom of the screen */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:var(--ink);color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em;padding:13px 20px;z-index:300;opacity:0;pointer-events:none;transition:.25s;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* product page */
.size-msg{min-height:16px;margin:8px 0 0;font-size:10px;font-weight:800;letter-spacing:.06em;color:#b3261e}
.sizes.shake{animation:ohg-shake .35s}
@keyframes ohg-shake{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
.size.soldout{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.buy:disabled{background:#cfcfca;cursor:not-allowed}

/* bag drawer */
.bag-img{text-decoration:none}
.bag-row .bag-line-price{color:var(--ink);font-weight:800;font-size:11px}
.bag-row .bag-line-price span{font-weight:400;color:var(--muted);font-size:9px}
.bag-row .qty-control{margin:6px 0 2px}
.bag-empty{padding:56px 10px;text-align:center}
.bag-empty p{font-size:12px;font-weight:800;letter-spacing:.06em;margin:0 0 16px}
.bag-empty a{display:inline-block;background:var(--ink);color:#fff;padding:13px 20px;font-size:10px;font-weight:800;letter-spacing:.08em}

/* login */
.auth-card .auth-logo{height:44px;width:44px;object-fit:contain;filter:none;margin-bottom:26px;display:block}
.auth-error{min-height:14px;margin:8px 0 0;font-size:10px;color:#ff8a80;line-height:1.4}
.otp-meta a.disabled{color:#666;text-decoration:none;cursor:default}

/* address */
.address-hint{min-height:14px;margin:-2px 0 8px;font-size:10px;color:var(--muted)}
.address-error{min-height:16px;margin:0 0 12px;font-size:11px;font-weight:700;color:#b3261e}

/* bag + payment */
.bag-item-row a.thumb{display:block}
.bag-item-row h4 a{color:inherit;text-decoration:none}
.bag-item-row .each{font-weight:400;color:var(--muted)}
.continue-link{display:inline-block;margin-top:18px;font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--ink)}
.tax-note{margin:12px 0 0;font-size:10px;color:var(--muted);text-align:center;line-height:1.5}
.deliver-card{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;border:1px solid var(--line);padding:14px 16px;margin-bottom:18px}
.deliver-label{font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.deliver-name{font-size:12px;font-weight:800;margin:6px 0 2px}
.deliver-addr{font-size:11px;color:var(--muted);line-height:1.5;margin:0}
.deliver-card>a{font-size:10px;font-weight:800;letter-spacing:.06em;text-decoration:underline;color:var(--ink);padding:4px 0}
.pay-breakdown{border:1px solid var(--line);padding:4px 16px 12px;margin:0 0 4px}
.pay-breakdown .order-total{padding-top:14px}
.pay-breakdown .tax-note{text-align:left;margin-top:8px}

/* respect "reduce motion" */
@media (prefers-reduced-motion:reduce){
  .announcement-track,.marquee-track{animation:none!important}
  *{transition-duration:.001ms!important}
}

/* =====================================================================
   MOBILE HEADER: logo exactly in the centre; payment page wording/layout
   ===================================================================== */
@media(max-width:900px){
  .site-header{grid-template-columns:1fr auto 1fr!important}
  .site-header .menu-btn{justify-self:start}
  .site-header .brand{justify-self:center}
  .site-header .tools{justify-self:end}
  .checkout-header{justify-content:center}          /* bag / address / payment / login: logo centred too */
}
a.add{display:flex;align-items:center;justify-content:center;text-decoration:none}

.pay-heading{margin:0 0 10px;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.pay-option .pay-text{flex:1;min-width:0}
.pay-option .pay-text b{display:block;font-size:12px;font-weight:700}
.pay-option .pay-text small{display:block;margin-top:2px;font-size:10px;font-weight:400;color:var(--muted)}
.pay-option:has(input:checked){border-color:var(--ink)}
.pay-badge{flex:none;font-style:normal;font-size:8px;font-weight:800;letter-spacing:.06em;color:var(--blue);background:#eaf0fb;padding:4px 7px;white-space:nowrap}
.pay-reward{margin:8px 0 20px}
.summary-row small{display:block;margin-top:2px;font-size:9px;font-weight:700;letter-spacing:.06em;color:var(--muted)}
.pay-saved{margin:10px 0 0;font-size:11px;font-weight:800;color:var(--blue)}
.pay-note{margin:14px 0 0;font-size:11px;line-height:1.55;color:var(--muted)}
.pay-status{min-height:16px;margin:12px 0 0;font-size:11px;font-weight:700;color:#b3261e;text-align:center}

/* ===== ADD TO BAG side pop-up (size + size guide tabs) ===== */
.quick-drawer{padding-bottom:0}
.qd-product{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.qd-product img{width:60px;height:74px;object-fit:cover;background:var(--soft);flex:none}
.qd-product h4{margin:0 0 4px;font-size:12px;font-weight:900}
.qd-product p{margin:0;font-size:11px;color:var(--muted)}
.qd-tabs{display:flex;border-bottom:1px solid var(--line)}
.qd-tabs button{flex:1;padding:15px 0;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted);cursor:pointer}
.qd-tabs button.active{color:var(--ink);border-bottom-color:var(--ink)}
.qd-body{flex:1;overflow-y:auto;padding:20px 0}
.qd-measure{min-height:16px;margin:14px 0 0;font-size:11px;line-height:1.5;color:var(--ink)}
.qd-measure span{color:var(--muted)}
.qd-guide-link{margin-top:14px;padding:10px 0;border:0;background:none;font-size:10px;font-weight:800;letter-spacing:.06em;text-decoration:underline;cursor:pointer;color:var(--ink)}
.qd-foot{padding:14px 0 18px;border-top:1px solid var(--line)}
.qd-foot .qd-add{width:100%;margin:0}
.size-table tr.sel td{background:var(--soft);font-weight:900}

/* ===== Journey polish: Buy It Now, offers, suggestions, login pop-up ===== */
.buy-now{display:block;width:100%;height:52px;margin-top:10px;background:var(--ink)!important;color:#fff;border:0;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer}
.buy-now:hover{background:#222!important}
.qd-foot .buy-now{margin-top:10px}
.qd-offers{margin-top:16px}
.qd-offers>p{margin:0 0 8px;font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.qd-offer{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:10px;color:var(--muted)}
.qd-offer .promo-code{flex:none;font-size:10px;padding:3px 7px}

.bag-suggest{margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
.bag-suggest>p{margin:0 0 12px;font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.sugg-row{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px}
.sugg{flex:0 0 120px}
.sugg img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--soft)}
.sugg h5{margin:8px 0 2px;font-size:10px;font-weight:800;line-height:1.3}
.sugg p{margin:0 0 8px;font-size:10px;color:var(--muted)}
.sugg button{width:100%;height:32px;border:1px solid var(--ink);background:#fff;font-size:9px;font-weight:800;letter-spacing:.06em;cursor:pointer}
.sugg button:hover{background:var(--ink);color:#fff}

.am-backdrop{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.55)}
.am-card{position:relative;width:min(420px,100%);background:#fff;padding:30px 26px 24px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.am-close{position:absolute;top:8px;right:10px;width:40px;height:40px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer}
.am-title{margin:0 0 8px;font-size:16px;font-weight:900;letter-spacing:-.01em}
.am-sub{margin:0 0 22px;font-size:11px;line-height:1.55;color:var(--muted)}
.am-sub b{color:var(--ink)}
.am-phone{display:flex;align-items:center;gap:10px;padding:0 0 10px;border-bottom:1.5px solid var(--ink)}
.am-phone span{font-size:14px;font-weight:700;color:var(--muted)}
.am-phone input{flex:1;min-width:0;border:0;outline:0;font-size:16px;font-weight:700;letter-spacing:.04em;background:none}
.am-error{min-height:16px;margin:8px 0 12px;font-size:10px;font-weight:700;color:#b3261e}
.am-btn{width:100%;height:50px;border:0;background:var(--ink);color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer}
.am-btn:disabled{background:#cfcfca;cursor:not-allowed}
.am-legal{margin:16px 0 0;font-size:9px;line-height:1.5;color:var(--muted);text-align:center}
.am-legal a{color:var(--ink);text-decoration:underline}
.am-otp{display:flex;gap:10px;justify-content:center;margin:0 0 4px}
.am-otp input{width:54px;height:58px;border:1px solid var(--line);text-align:center;font-size:22px;font-weight:800;outline:0}
.am-otp input:focus{border-color:var(--ink)}
.am-links{display:flex;justify-content:space-between;margin-top:16px;font-size:10px}
.am-links a{color:var(--ink);text-decoration:underline;cursor:pointer}
.am-links a.disabled{color:var(--muted);text-decoration:none;cursor:default}

/* keep drawer content inside the drawer (the suggestions row scrolls sideways on its own) */
.drawer{overflow-x:hidden}
.drawer>*{min-width:0;max-width:100%}
.bag-list{min-width:0}
.bag-suggest{min-width:0;max-width:100%}
.sugg-row{max-width:100%;-webkit-overflow-scrolling:touch}
.sugg{flex:0 0 108px}

/* ===== Offers with APPLY buttons (product page + size pop-up) ===== */
.offers{margin:14px 0}
.offers-title{margin:0 0 8px;font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.offer-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;padding:9px 10px;margin-bottom:6px;background:var(--soft);border:1px solid var(--line)}
.offer-main{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;min-width:0}
.offer-main .promo-code{flex:none;font-size:10.5px;padding:3px 7px;letter-spacing:.04em}
.offer-desc{font-size:10px;color:var(--muted);white-space:nowrap}
.offer-note{grid-column:1/-1;font-size:10px;font-weight:700;line-height:1.4;color:var(--ink)}
.offer-row.applied{border-color:var(--blue);background:#fff}
.offer-row.applied .offer-note{color:var(--blue)}
.offer-row.applied .coupon-apply-btn{background:var(--ink);border-color:var(--ink);color:#fff}
.offer-row.unavailable .promo-code,.offer-row.unavailable .offer-desc{opacity:.55}
.offer-row .coupon-apply-btn{min-width:74px}
.qd-offers{margin-top:16px}
.qd-offers .offers-title{margin-top:0}
.qd-offers .offer-row{background:#fff}
.bag-coupon-line{color:var(--blue);font-weight:800;font-size:11px}
.news-msg{font-size:10px;font-weight:800;letter-spacing:.06em}
@media(max-width:380px){.offer-desc{font-size:9px}}
.address-hint.ok{color:#1e7a3c;font-weight:700}
.offer-row.unavailable .coupon-apply-btn{opacity:.4;cursor:not-allowed}

/* ===== Best-journey additions: wishlist, ratings, pincode, trust badges, WhatsApp, orders ===== */

/* Wishlist heart */
.wishlist-heart{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);font-size:17px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;color:var(--ink);transition:transform .15s ease}
.wishlist-heart:hover{transform:scale(1.08)}
.wishlist-heart.active{color:#e02020;border-color:#e02020}
.card{position:relative}
.card .wishlist-heart.card-heart{width:30px;height:30px;font-size:14px;top:8px;right:8px}
#p-image{position:relative}
.wishlist-nav{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--ink);text-decoration:none;margin:0 4px}
.wishlist-nav b{background:var(--ink);color:#fff;border-radius:50%;min-width:16px;height:16px;font-size:9px;display:inline-flex;align-items:center;justify-content:center;padding:0 3px}

/* Star ratings */
.rating-line{display:flex;align-items:center;gap:6px;margin:8px 0 4px;font-size:11px}
.stars{color:#e0a500;letter-spacing:1px;font-size:13px}
.rating-num{font-weight:800}
.rating-count{color:var(--muted)}
.card-info .rating-line{margin:4px 0}
.card-info .stars{font-size:11px}

/* Pincode delivery check */
.pincode-check{border:1px solid var(--line);padding:16px;margin:20px 0}
.pincode-check label{display:block;font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted);margin-bottom:10px}
.pincode-row{display:flex;gap:10px}
.pincode-row input{flex:1;border:1px solid var(--line);padding:11px;font-size:13px;font-family:inherit}
.pincode-row button{border:1px solid var(--ink);background:var(--ink);color:#fff;font-size:10px;font-weight:800;letter-spacing:.06em;padding:0 18px;cursor:pointer}
.pincode-msg{font-size:11px;margin:10px 0 0;line-height:1.6}
.pincode-msg.ok{color:#0a7a3d}
.pincode-msg.error{color:#c22}

/* Trust badges */
.trust-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0;text-align:center}
.trust-badge{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:9px;font-weight:700;letter-spacing:.03em;color:var(--muted);line-height:1.4}
.trust-badge .tb-icon{font-size:20px}

/* WhatsApp float button */

/* Order confirmation page */
.confirm-page{max-width:var(--max);margin:auto;padding:40px 24px}
.confirm-hero{text-align:center;padding:20px 0 40px}
.confirm-check{width:60px;height:60px;border-radius:50%;background:#0a7a3d;color:#fff;font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.confirm-hero h1{font-size:26px;letter-spacing:-.02em;margin:0 0 10px}
.confirm-hero p{font-size:13px;color:var(--muted)}
.confirm-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:50px}
.confirm-block{border-bottom:1px solid var(--line);padding:14px 0}
.confirm-label{font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted);margin:0 0 4px}
.confirm-value{font-size:14px;font-weight:800}
.status-pill{display:inline-block;background:var(--soft);border:1px solid var(--line);padding:5px 10px;font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--blue)}
.confirm-addr{font-size:12px;line-height:1.7;color:var(--muted);margin-bottom:16px}
.continue-link{font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--ink);text-decoration:underline}

/* My Orders page */
.orders-page{max-width:800px;margin:auto;padding:40px 24px}
.orders-page h1{font-size:24px;letter-spacing:-.02em;margin:0 0 26px}
.order-card{display:flex;align-items:center;gap:16px;border:1px solid var(--line);padding:16px;margin-bottom:12px;text-decoration:none;color:var(--ink)}
.order-thumbs{display:flex;flex-shrink:0}
.order-thumb{width:44px;height:44px;background:var(--soft);border:1px solid var(--line);margin-left:-10px;overflow:hidden}
.order-thumb:first-child{margin-left:0}
.order-thumb img{width:100%;height:100%;object-fit:cover}
.order-card-info{flex:1;min-width:0}
.order-card-id{font-size:12px;font-weight:800;margin:0 0 4px}
.order-card-meta{font-size:11px;color:var(--muted);margin:0 0 8px}
.order-card-total{font-size:14px;font-weight:800;white-space:nowrap}

@media(max-width:900px){
  .confirm-grid{grid-template-columns:1fr}
  .trust-badges{grid-template-columns:repeat(2,1fr)}
}

/* =====================================================================
   PRODUCTION UPDATE — header, icons, delivery, tracking, support widget
   ===================================================================== */

/* ---- header: text labels on desktop, line icons on mobile ---- */
.site-header .tools .tool-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:none;border:0;color:var(--ink);cursor:pointer;text-decoration:none}
.tool-btn .t-ico{display:none;width:22px;height:22px;flex:none}
.tool-btn b.zero{display:none}
.site-header .tools .wishlist-nav b{margin-left:0}

@media(max-width:900px){
  /* the logo is centred on the header itself, so nothing on either side can push it */
  .site-header{display:flex!important;justify-content:space-between;align-items:center;padding:0 10px!important;grid-template-columns:none!important}
  .site-header .menu-btn{display:block!important;flex:none;text-align:left;padding:14px 4px!important;margin:0!important;position:relative;z-index:2}
  .site-header .brand{position:absolute!important;left:50%;top:50%;transform:translate(-50%,-50%);margin:0!important;justify-self:auto!important;z-index:1;display:flex;align-items:center;justify-content:center}
  .site-header .tools{display:flex!important;flex:none;align-items:center;gap:0!important;position:relative;z-index:2}
  .site-header .tools .tool-btn{width:40px;height:44px}
  .tool-btn .t-text{display:none}
  .tool-btn .t-ico{display:block}
  .tool-btn b{position:absolute;top:6px;right:1px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;background:var(--ink);color:#fff;font-size:9px;font-weight:800;line-height:15px;letter-spacing:0;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
  .site-header .tools .wishlist-nav b{margin:0}
}
@media(max-width:360px){
  .site-header .tools .tool-btn{width:36px}
  .site-header .brand img{width:54px!important;height:42px!important}
  .site-header .menu-btn{font-size:8px!important}
}
.site-header .tools .tool-btn:focus-visible,.site-header .menu-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ---- wishlist heart (line icon; filled ink when saved) ---- */
.wishlist-heart svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;display:block}
.card .wishlist-heart.card-heart svg{width:16px;height:16px}
.wishlist-heart.active{color:var(--ink);border-color:var(--ink)}
.wishlist-heart.active svg{fill:currentColor}

/* ---- rating stars (SVG) ---- */
.stars{display:inline-flex;gap:2px;color:var(--ink);letter-spacing:0}
.star{position:relative;display:inline-block;width:13px;height:13px}
.star svg{width:13px;height:13px;display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}
.star-fill{position:absolute;left:0;top:0;height:100%;overflow:hidden}
.star-fill svg{fill:currentColor}
.card-info .star,.card-info .star svg{width:11px;height:11px}

/* ---- trust badges (line icons) ---- */
.trust-badge .tb-icon{display:flex;align-items:center;justify-content:center;width:26px;height:26px;font-size:0;color:var(--ink)}
.tb-svg{width:22px;height:22px;display:block}
.confirm-svg{width:30px;height:30px}

/* ---- delivery + COD check ---- */
.dl-card{margin-top:12px;padding:12px 14px;border:1px solid var(--line);background:#fff;font-size:12px;line-height:1.5}
.dl-row{display:flex;align-items:flex-start;gap:9px;margin:0 0 6px}
.dl-row:last-of-type{margin-bottom:0}
.dl-row b{font-weight:800}
.dl-ico{width:16px;height:16px;flex:none;margin-top:2px}
.dl-ok .dl-ico{color:var(--ink)}
.dl-muted{color:var(--muted)}
.dl-error{border-color:#d9b3b0}
.dl-error>.dl-row .dl-ico{color:#b3261e}
.dl-info{background:var(--soft)}
.dl-sub{margin:8px 0 0;font-size:11px;color:var(--muted);line-height:1.55}
.dl-sub a{color:var(--ink);text-decoration:underline;font-weight:700}
.dl-demo{margin:10px 0 0;font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px}
.dl-spin{width:14px;height:14px;flex:none;border:2px solid var(--line);border-top-color:var(--ink);border-radius:50%;display:inline-block;animation:dl-rot .8s linear infinite;margin-top:2px}
@keyframes dl-rot{to{transform:rotate(360deg)}}
.pincode-check label{color:var(--ink)}
.pincode-row input{min-width:0}

/* ---- shipment timeline ---- */
.track-block{margin:24px 0 0;border:1px solid var(--line);padding:18px}
.track-block h3{margin:0 0 14px;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.tl-status{margin:0 0 4px;font-size:16px;font-weight:900;letter-spacing:-.01em}
.tl-meta{margin:0 0 16px;font-size:11px;color:var(--muted);line-height:1.6}
.tl-meta b{color:var(--ink)}
.tl{list-style:none;margin:0;padding:0}
.tl-step{position:relative;display:flex;gap:14px;padding:0 0 18px;font-size:12px}
.tl-step:last-child{padding-bottom:0}
.tl-step::before{content:"";position:absolute;left:5px;top:14px;bottom:-2px;width:1px;background:var(--line)}
.tl-step:last-child::before{display:none}
.tl-dot{width:11px;height:11px;flex:none;border-radius:50%;border:1.5px solid var(--line);background:#fff;margin-top:2px;position:relative;z-index:1}
.tl-step b{display:block;font-weight:800;color:var(--muted)}
.tl-step small{display:block;margin-top:2px;font-size:10px;color:var(--muted)}
.tl-step.done .tl-dot{background:var(--ink);border-color:var(--ink)}
.tl-step.done b,.tl-step.current b{color:var(--ink)}
.tl-step.done::before{background:var(--ink)}
.tl-step.current .tl-dot{border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(33,72,164,.16)}
.tl-step.alert .tl-dot{background:#b3261e;border-color:#b3261e}
.tl-step.alert b{color:#b3261e}
.tl-msg{margin:14px 0 0;padding:11px 12px;background:var(--soft);font-size:11px;line-height:1.55;color:var(--ink);display:flex;gap:8px;align-items:flex-start}
.tl-warn{background:#fff4e5}
.tl-history{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.tl-history summary{cursor:pointer;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.tl-history ul{list-style:none;margin:12px 0 0;padding:0}
.tl-history li{padding:0 0 12px;font-size:11px}
.tl-history li b{display:block;font-weight:700}
.tl-history li small{display:block;color:var(--muted);margin-top:2px}
.tl-src{margin:14px 0 0;font-size:10px;color:var(--muted)}
.track-form{display:grid;gap:10px;margin:0 0 6px}
.track-form input{width:100%;box-sizing:border-box;border:1px solid var(--line);padding:13px;font-size:14px;font-family:inherit}
.track-form button{height:50px;border:0;background:var(--ink);color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer}
.track-page{max-width:560px;margin:0 auto;padding:36px 16px 80px}
.track-page h1{margin:0 0 6px;font-size:28px;letter-spacing:-.03em}
.track-page>p{margin:0 0 22px;font-size:12px;color:var(--muted);line-height:1.55}

/* ---- support widget: brand blue (not WhatsApp green), bottom-right, safe-area aware ---- */
.support-widget{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}
.support-widget>*{pointer-events:auto}
.support-fab{width:52px;height:52px;border-radius:50%;border:0;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px rgba(9,9,9,.22);transition:transform .2s ease,background .2s ease}
.support-fab svg{width:24px;height:24px;display:block}
.support-fab:hover{transform:translateY(-2px);background:#1b3d8c}
.support-fab:focus-visible,.support-cta:focus-visible,.support-close:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.support-panel{position:relative;width:min(300px,calc(100vw - 32px));box-sizing:border-box;background:#fff;border:1px solid var(--line);padding:20px 20px 18px;box-shadow:0 14px 40px rgba(9,9,9,.18);opacity:0;visibility:hidden;transform:translateY(10px) scale(.98);transform-origin:bottom right;transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}
.support-widget.open .support-panel{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .22s ease}
.support-eyebrow{margin:0 0 8px;font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--blue)}
.support-title{margin:0 0 6px;font-size:19px;font-weight:900;letter-spacing:-.02em;line-height:1.1;padding-right:26px}
.support-text{margin:0 0 16px;font-size:12px;line-height:1.55;color:var(--muted)}
.support-cta{display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:#fff;text-decoration:none;padding:14px 16px;font-size:10px;font-weight:800;letter-spacing:.08em}
.support-cta:hover{background:var(--blue)}
.support-close{position:absolute;top:8px;right:8px;width:34px;height:34px;border:0;background:none;color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.support-close svg{width:18px;height:18px}
html.drawer-open .support-widget{display:none}
body:has(.checkout-header) {padding-bottom:84px}
@media(prefers-reduced-motion:reduce){.support-panel,.support-fab{transition:none}.dl-spin{animation-duration:2s}}
@media(max-width:600px){.toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}

/* ---- very small phones (320px): product page must never scroll sideways ---- */
@media(max-width:900px){
  .product-page{grid-template-columns:minmax(0,1fr)!important}
  .product-page>*{min-width:0;max-width:100%}
  .product-info-page h1{overflow-wrap:anywhere}
  .sizes{flex-wrap:wrap}
  .pincode-row input{min-width:0}
}
