/* ═══════════════════════════════════════════════════════════════════
   Inkgility Public Site — shared styles for the public marketing
   pages (layouts.app). Covers: CSS vars + dark theme, base typography,
   nav + mega menu + search overlay + quote/intake modals + theme
   toggle, prefooter band, footer grid, back-to-top, mobile sticky CTA.
   Source of truth: assembled from the canonical patterns used by
   public/about.html and resources/views/home.blade.php.
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Base + nav + mega menu + search overlay ─── */

:root{
  --dark:#F8F5EE;--dark2:#EDE8DC;--cream:#1A1625;
  --purple:#8E21CA;--blue:#254AAD;--gold:#B8941E;
  --muted:rgba(32,26,20,0.62);--dim:rgba(32,26,20,0.08);--border:rgba(32,26,20,0.10);
  --tc:32,26,20;--oc:248,245,238;
  --selection-bg:rgba(142,33,202,0.20);
  --btn-gradient:linear-gradient(129deg,#9B3FD4,#3A5BC7);
  --logo-filter:brightness(0.15);--noise-opacity:0.012;
  --section-alt:#F0ECDF;--text-heading:#1A1218;--text-body:#2E2636;--text-caption:#5C5068;
  --nav-scrolled-bg:var(--dark);
  --hero-orb-purple:rgba(142,33,202,0.04);--hero-orb-gold:rgba(184,148,30,0.03);
}
[data-theme="dark"]{--dark:#0A0810;--dark2:#100D18;--cream:#FFFDF9;--gold:#D4AF37;--muted:rgba(var(--tc),0.62);--dim:rgba(var(--tc),0.08);--border:rgba(var(--tc),0.04);--tc:255,253,249;--oc:10,8,16;--logo-filter:none;--noise-opacity:0.028;--section-alt:#0D0A14;--text-heading:#FFFDF9;--text-body:rgba(255,253,249,0.75);--text-caption:rgba(255,253,249,0.55);--btn-gradient:linear-gradient(129deg,#8E21CA,#254AAD);--nav-scrolled-bg:var(--dark);
  --purple:#8E21CA;
  --blue:#254AAD;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
/* html-level too: iOS Safari ignores body-only overflow-x, letting pages with
   bleeding decorative glows (hero-ink/orb, foot-glow) pan sideways under the
   viewport-fixed header */
html{overflow-x:hidden}
body{background:var(--dark);color:var(--text-body);font-family:'DM Sans',sans-serif;overflow-x:hidden}
body::after{content:'';position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:var(--noise-opacity);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px}

/* Nav CSS from shared extract */
[data-theme="dark"]{--dark:#0A0810;--dark2:#100D18;--cream:#FFFDF9;--gold:#D4AF37;--green:#2ECC71;--red:#E74C3C;--muted:rgba(var(--tc),0.62);--dim:rgba(var(--tc),0.08);--border:rgba(var(--tc),0.04);--tc:255,253,249;--oc:10,8,16;--selection-bg:rgba(142,33,202,0.25);--cta-start:#16102A;--gold-btn-text:#0A0810;--gold-dark:#C9A020;--logo-filter:none;--noise-opacity:0.028;--hero-grid-opacity:0.15;--shadow-card:none;--shadow-nav:none;--shadow-hover:none;--section-alt:#0D0A14;--text-heading:#FFFDF9;--text-body:rgba(255,253,249,0.75);--text-caption:rgba(255,253,249,0.55);--review-quote-opacity:0.12;--hero-glow-mult:1;--cta-glow-bg:radial-gradient(ellipse at center,#16102A 0%,#0A0810 70%);--btn-gradient:linear-gradient(129deg,#8E21CA,#254AAD);--line-purple:rgba(142,33,202,0.35);--line-gold:rgba(212,175,55,0.25);--line-blue:rgba(37,74,173,0.3);--line-weight:2px;--dot-size:6px;--dot-blur:1px;--dot-glow-purple:0 0 20px rgba(142,33,202,0.6),0 0 40px rgba(142,33,202,0.3);--dot-glow-gold:0 0 20px rgba(212,175,55,0.5),0 0 40px rgba(212,175,55,0.2);--nav-scrolled-bg:var(--dark)}
::selection{background:var(--selection-bg);color:var(--cream)}
.eyebrow{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:6px;text-transform:uppercase;color:var(--purple)}
@keyframes gD{0%{transform:translate(0,0) scale(1)}50%{transform:translate(20px,-15px) scale(1.04)}100%{transform:translate(-15px,10px) scale(0.97)}}
@keyframes cG{0%,100%{box-shadow:0 0 16px rgba(184,148,30,0);border-color:rgba(var(--tc),0.2)}50%{box-shadow:0 0 28px rgba(184,148,30,0.15);border-color:rgba(184,148,30,0.4)}}
@keyframes sB{0%,100%{transform:translateY(0);opacity:1}50%{transform:translateY(10px);opacity:0.2}}
@keyframes navFadeIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@keyframes navShimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.site-nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:18px 32px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:transparent;backdrop-filter:none;border-bottom:1px solid transparent;box-shadow:none;overflow:visible;transition:background 0.5s cubic-bezier(0.16,1,0.3,1),box-shadow 0.5s,border-color 0.5s,backdrop-filter 0.5s}
.site-nav.scrolled{background:var(--nav-scrolled-bg);border-bottom-color:var(--border);box-shadow:0 2px 32px rgba(0,0,0,0.10),0 1px 4px rgba(0,0,0,0.05)}
.site-nav::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(142,33,202,0.3),rgba(184,148,30,0.2),rgba(37,74,173,0.3),transparent);background-size:200% 100%;animation:navShimmer 6s linear infinite;opacity:0;transition:opacity 0.4s}
.site-nav.scrolled::after{opacity:1}
.nav-left{display:flex;align-items:center;gap:16px;animation:navFadeIn 0.6s ease 0.2s both}.nav-logo{display:flex;justify-content:center;animation:navFadeIn 0.6s ease 0.1s both}.nav-logo img{width:460px;max-width:40vw;height:auto;display:block;filter:var(--logo-filter);transition:filter 0.3s}.nav-right{display:flex;align-items:center;gap:24px;justify-content:flex-end;animation:navFadeIn 0.6s ease 0.3s both}
.menu-btn,.search-btn{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:4px;text-transform:uppercase;background:none;border:none;color:var(--muted);cursor:pointer;padding:8px 0;transition:color 0.3s}.menu-btn:hover,.search-btn:hover{color:var(--cream)}
.search-btn{display:flex;align-items:center;gap:8px}.search-btn svg{width:14px;height:14px}
.cart-btn{position:relative;display:flex;align-items:center;color:var(--muted);padding:8px 4px;transition:color .3s;text-decoration:none}
.cart-btn:hover{color:var(--cream)}
.cart-btn svg{width:19px;height:19px}
.cart-badge{position:absolute;top:0;right:-7px;min-width:16px;height:16px;padding:0 4px;border-radius:30px;background:var(--purple);color:#fff;font-family:'Space Mono',monospace;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.start-btn{font-family:'Instrument Serif',serif;font-size:14px;font-style:italic;font-weight:400;padding:9px 20px;border-radius:60px;cursor:pointer;background:var(--btn-gradient);border:none;color:white;transition:box-shadow 0.3s,transform 0.3s;animation:startBtnPulse 3s ease-in-out infinite;white-space:nowrap;line-height:1}.start-btn:hover{box-shadow:0 0 32px rgba(142,33,202,0.25);transform:scale(1.03);animation:none}
.account-btn{font-family:'Instrument Serif',serif;font-size:14px;font-style:italic;font-weight:400;padding:9px 18px;border-radius:60px;cursor:pointer;background:transparent;border:1px solid rgba(var(--tc,255 253 249),0.18);color:var(--cream);text-decoration:none;transition:border-color 0.2s,background 0.2s,color 0.2s;display:inline-flex;align-items:center;white-space:nowrap;line-height:1}.account-btn:hover{border-color:var(--purple);background:rgba(142,33,202,0.08);color:var(--cream)}
.account-btn .account-icon{display:none;width:18px;height:18px}
@keyframes startBtnPulse{0%,100%{box-shadow:0 0 0 0 rgba(142,33,202,0)}50%{box-shadow:0 0 20px 4px rgba(142,33,202,0.15)}}
.mega-menu{position:fixed;inset:0;z-index:190;background:rgba(var(--oc),0.96);backdrop-filter:blur(40px);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:110px 24px 24px;overflow:hidden;opacity:0;visibility:hidden;transition:opacity 0.4s cubic-bezier(0.16,1,0.3,1),visibility 0.4s cubic-bezier(0.16,1,0.3,1)}.mega-menu.open{opacity:1;visibility:visible}
.mega-menu::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23n)' opacity='0.015'/%3E%3C/svg%3E");background-size:128px 128px;pointer-events:none;z-index:0}
.menu-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(80px);z-index:0}
.menu-orb-1{width:400px;height:400px;background:radial-gradient(circle,rgba(142,33,202,0.08),transparent 70%);top:-5%;left:10%;animation:menuOrbFloat1 12s ease-in-out infinite}
.menu-orb-2{width:350px;height:350px;background:radial-gradient(circle,rgba(184,148,30,0.06),transparent 70%);bottom:-5%;right:10%;animation:menuOrbFloat2 15s ease-in-out infinite}
.menu-orb-3{width:280px;height:280px;background:radial-gradient(circle,rgba(37,74,173,0.05),transparent 70%);top:40%;left:50%;transform:translateX(-50%);animation:menuOrbFloat3 10s ease-in-out infinite}
[data-theme="dark"] .menu-orb-1{background:radial-gradient(circle,rgba(142,33,202,0.15),transparent 70%)}
[data-theme="dark"] .menu-orb-2{background:radial-gradient(circle,rgba(212,175,55,0.10),transparent 70%)}
[data-theme="dark"] .menu-orb-3{background:radial-gradient(circle,rgba(37,74,173,0.08),transparent 70%)}
@keyframes menuOrbFloat1{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,20px)}}
@keyframes menuOrbFloat2{0%,100%{transform:translate(0,0)}50%{transform:translate(-25px,-15px)}}
@keyframes menuOrbFloat3{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,25px)}}
.menu-inner{max-width:1100px;width:100%;position:relative;z-index:1;opacity:0;transform:translateY(12px) scale(0.985);transition:opacity 0.45s cubic-bezier(0.16,1,0.3,1) 0.08s,transform 0.45s cubic-bezier(0.16,1,0.3,1) 0.08s}
.mega-menu.open .menu-inner{opacity:1;transform:translateY(0) scale(1)}
.menu-cats{display:grid;grid-template-columns:repeat(6,1fr);gap:0;border-bottom:1px solid var(--border);margin-bottom:32px;position:relative}
.menu-cats-underline{position:absolute;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--gold),rgba(184,148,30,0.6));border-radius:2px;transition:left 0.35s cubic-bezier(0.16,1,0.3,1),width 0.35s cubic-bezier(0.16,1,0.3,1)}
.menu-cat{padding:16px 0;text-align:center;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:4px;text-transform:uppercase;color:rgba(var(--tc),0.55);cursor:pointer;border-bottom:2px solid transparent;transition:color 0.3s}.menu-cat:hover{color:var(--cream)}.menu-cat.active{color:var(--gold);border-bottom-color:transparent}
.menu-items{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-height:calc(100vh - 370px);overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:rgba(var(--tc),0.12) transparent}.menu-items::-webkit-scrollbar{width:4px}.menu-items::-webkit-scrollbar-track{background:transparent}.menu-items::-webkit-scrollbar-thumb{background:rgba(var(--tc),0.12);border-radius:4px}.menu-items::-webkit-scrollbar-thumb:hover{background:rgba(var(--tc),0.25)}
.menu-item{padding:0;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:0;transition:all 0.25s cubic-bezier(0.16,1,0.3,1);position:relative;border:1px solid transparent;opacity:0;transform:translateY(8px);overflow:hidden;text-decoration:none}.mega-menu.open .menu-item{opacity:1;transform:translateY(0)}
.menu-item:hover{border-color:rgba(142,33,202,0.15);box-shadow:0 0 20px rgba(142,33,202,0.06),inset 0 0 20px rgba(142,33,202,0.02)}
[data-theme="dark"] .menu-item:hover{border-color:rgba(142,33,202,0.25);box-shadow:0 0 24px rgba(142,33,202,0.12),inset 0 0 24px rgba(142,33,202,0.04)}
.menu-item-thumb{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94)}.menu-item:hover .menu-item-thumb{transform:scale(1.06)}
.menu-item-thumb-placeholder{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--dim);transition:background 0.25s}.menu-item:hover .menu-item-thumb-placeholder{background:rgba(142,33,202,0.07)}
.menu-item-thumb-placeholder svg{width:26px;height:26px;flex-shrink:0;stroke:rgba(var(--tc),0.20);fill:none;stroke-width:1.4;transition:stroke 0.25s,filter 0.25s}.menu-item:hover .menu-item-thumb-placeholder svg{stroke:var(--gold);filter:drop-shadow(0 0 6px rgba(184,148,30,0.3))}
[data-theme="dark"] .menu-item:hover .menu-item-thumb-placeholder svg{filter:drop-shadow(0 0 8px rgba(212,175,55,0.4))}
.menu-item-content{padding:10px 12px}
.menu-item-name{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:rgba(var(--tc),0.70);transition:color 0.25s}.menu-item:hover .menu-item-name{color:var(--cream)}
.menu-item-text{display:flex;flex-direction:column;gap:2px}
.menu-item-desc{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:0.5px;color:rgba(var(--tc),0.45);transition:color 0.25s;margin-top:2px}.menu-item:hover .menu-item-desc{color:rgba(var(--tc),0.35)}
.menu-item-price{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.5px;color:var(--gold);margin-top:5px;display:inline-block}
.menu-bottom{margin-top:40px;text-align:center;padding-top:24px;border-top:1px solid rgba(var(--tc),0.04);opacity:0;transform:translateY(6px);transition:opacity 0.4s 0.25s,transform 0.4s 0.25s}
.mega-menu.open .menu-bottom{opacity:1;transform:translateY(0)}
.menu-bottom-link{font-family:'Instrument Serif',serif;font-size:15px;font-style:italic;color:var(--gold);cursor:pointer;background:none;border:none;transition:opacity 0.2s,letter-spacing 0.3s}.menu-bottom-link:hover{opacity:0.7;letter-spacing:1px}
.search-overlay{position:fixed;inset:0;z-index:300;background:rgba(var(--oc),0.92);backdrop-filter:blur(0px);display:flex;align-items:flex-start;justify-content:center;padding-top:18vh;opacity:0;visibility:hidden;transition:opacity 0.35s cubic-bezier(0.16,1,0.3,1),backdrop-filter 0.5s cubic-bezier(0.16,1,0.3,1),visibility 0.35s}
.search-overlay.open{opacity:1;visibility:visible;backdrop-filter:blur(30px)}
.search-overlay::before{content:'';position:absolute;top:12%;left:50%;transform:translateX(-50%);width:600px;height:300px;background:radial-gradient(ellipse,rgba(142,33,202,0.06) 0%,transparent 70%);pointer-events:none;filter:blur(40px);opacity:0;transition:opacity 0.5s 0.15s}
.search-overlay.open::before{opacity:1}
[data-theme="dark"] .search-overlay::before{background:radial-gradient(ellipse,rgba(142,33,202,0.12) 0%,transparent 70%)}
.search-box{width:90%;max-width:600px;position:relative;opacity:0;transform:translateY(-20px) scale(0.97);transition:opacity 0.4s cubic-bezier(0.34,1.56,0.64,1) 0.08s,transform 0.4s cubic-bezier(0.34,1.56,0.64,1) 0.08s}
.search-overlay.open .search-box{opacity:1;transform:translateY(0) scale(1)}
.search-input-wrap{position:relative}
.search-input-glow{position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:0;height:2px;background:linear-gradient(90deg,transparent,var(--purple),var(--gold),var(--purple),transparent);border-radius:2px;transition:width 0.5s cubic-bezier(0.16,1,0.3,1);filter:blur(0.5px)}
.search-input:focus ~ .search-input-glow{width:100%}
.search-input{width:100%;font-family:'Instrument Serif',serif;font-size:clamp(24px,4vw,40px);background:none;border:none;border-bottom:1.5px solid rgba(var(--tc),0.06);color:var(--cream);padding:12px 0;outline:none;transition:border-color 0.3s}
.search-input:focus{border-bottom-color:rgba(var(--tc),0.12)}
.search-input::placeholder{color:rgba(var(--tc),0.40);transition:color 0.3s}
.search-input:focus::placeholder{color:rgba(var(--tc),0.25)}
.search-close{position:absolute;top:-48px;right:0;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:4px;text-transform:uppercase;background:none;border:none;color:var(--muted);cursor:pointer;transition:color 0.2s}
.search-close:hover{color:var(--cream)}
.search-hint{position:absolute;top:-48px;left:0;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:2px;color:rgba(var(--tc),0.50);padding:4px 10px;border:1px solid rgba(var(--tc),0.08);border-radius:6px;transition:border-color 0.3s,box-shadow 0.3s}
.search-ai-badge{position:absolute;top:-48px;left:50%;transform:translateX(-50%);font-family:'Space Mono',monospace;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--purple);background:rgba(142,33,202,0.06);border:1px solid rgba(142,33,202,0.18);border-radius:20px;padding:4px 12px;white-space:nowrap;pointer-events:none}
[data-theme="dark"] .search-ai-badge{background:rgba(142,33,202,0.12);border-color:rgba(142,33,202,0.30)}
.search-beta-badge{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);background:rgba(184,148,30,0.10);border:1px solid rgba(184,148,30,0.25);border-radius:10px;padding:1px 6px;margin-left:6px;vertical-align:middle}
[data-theme="dark"] .search-beta-badge{background:rgba(212,175,55,0.10);border-color:rgba(212,175,55,0.28)}
.search-hint-flash{animation:hintFlash 0.6s ease}
@keyframes hintFlash{0%{border-color:var(--purple);box-shadow:0 0 12px rgba(142,33,202,0.2)}100%{border-color:rgba(var(--tc),0.08);box-shadow:none}}
.search-results{margin-top:24px;max-height:55vh;overflow-y:auto;padding-bottom:4px}
.sr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.search-result{padding:0;margin:0;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:0;transition:all 0.25s cubic-bezier(0.16,1,0.3,1);border:1px solid transparent;opacity:0;transform:translateY(8px);animation:searchResultIn 0.3s cubic-bezier(0.16,1,0.3,1) forwards;overflow:hidden}
.search-result:hover{border-color:rgba(142,33,202,0.15);box-shadow:0 0 20px rgba(142,33,202,0.06),inset 0 0 20px rgba(142,33,202,0.02)}
[data-theme="dark"] .search-result:hover{border-color:rgba(142,33,202,0.25);box-shadow:0 0 24px rgba(142,33,202,0.12),inset 0 0 24px rgba(142,33,202,0.04)}
@keyframes searchResultIn{to{opacity:1;transform:translateY(0)}}
@keyframes shimmerSlide{0%{background-position:200% 0}100%{background-position:-200% 0}}
.prod-thumb-placeholder,.menu-item-thumb-placeholder,.sr-thumb-placeholder{background:linear-gradient(90deg,var(--dim) 25%,rgba(var(--tc),0.10) 50%,var(--dim) 75%);background-size:300% 100%;animation:shimmerSlide 2s ease-in-out infinite}
.sr-thumb{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94)}
.search-result:hover .sr-thumb{transform:scale(1.06)}
.sr-thumb-placeholder{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--dim);transition:background 0.25s}
.search-result:hover .sr-thumb-placeholder{background:rgba(142,33,202,0.07)}
.sr-thumb-placeholder svg{width:26px;height:26px;flex-shrink:0;stroke:rgba(var(--tc),0.20);fill:none;stroke-width:1.4;transition:stroke 0.25s,filter 0.25s}
.search-result:hover .sr-thumb-placeholder svg{stroke:var(--gold);filter:drop-shadow(0 0 6px rgba(184,148,30,0.3))}
[data-theme="dark"] .search-result:hover .sr-thumb-placeholder svg{filter:drop-shadow(0 0 8px rgba(212,175,55,0.4))}
.sr-body{padding:10px 12px}
.sr-name{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:rgba(var(--tc),0.70);transition:color 0.25s}
.search-result:hover .sr-name{color:var(--cream)}
.sr-name mark{background:none;color:var(--gold)}
.sr-desc{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:0.5px;color:rgba(var(--tc),0.45);transition:color 0.25s;margin-top:2px}
.sr-tag{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:2px;color:var(--purple);text-transform:uppercase;margin-top:4px;display:block}
.search-popular-label{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:4px;text-transform:uppercase;color:rgba(var(--tc),0.70);margin-bottom:16px}
.search-popular-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.search-pill{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;padding:8px 16px;border-radius:60px;background:rgba(var(--tc),0.04);border:1px solid rgba(var(--tc),0.06);color:rgba(var(--tc),0.60);cursor:pointer;transition:all 0.25s cubic-bezier(0.16,1,0.3,1);opacity:0;transform:translateY(4px);animation:pillFloat 0.4s cubic-bezier(0.16,1,0.3,1) forwards}
.search-pill:hover{background:rgba(142,33,202,0.06);border-color:rgba(142,33,202,0.12);color:var(--cream);box-shadow:0 0 12px rgba(142,33,202,0.06)}
[data-theme="dark"] .search-pill{background:rgba(var(--tc),0.03);border-color:rgba(var(--tc),0.06)}
[data-theme="dark"] .search-pill:hover{background:rgba(142,33,202,0.10);border-color:rgba(142,33,202,0.20);box-shadow:0 0 16px rgba(142,33,202,0.08)}


/* ─── Modal + quote form + theme toggle ─── */
.modal-overlay{position:fixed;inset:0;z-index:400;background:rgba(var(--oc),0.94);backdrop-filter:blur(24px);display:none;align-items:center;justify-content:center;padding:24px}.modal-overlay.open{display:flex}
.modal-box{width:100%;max-width:480px;border:1px solid var(--border);border-radius:20px;padding:48px 40px;background:var(--dark2);position:relative;box-shadow:0 20px 60px rgba(0,0,0,0.3)}
.modal-context{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:4px;text-transform:uppercase;color:var(--purple);margin-bottom:20px}
.modal-title{font-family:'Instrument Serif',serif;font-size:28px;color:var(--text-heading);margin-bottom:8px}
.modal-sub{font-size:15px;color:var(--muted);line-height:1.6;margin-bottom:32px}
.modal-label{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:rgba(var(--tc),0.55);margin-bottom:8px;display:block}
.modal-input{width:100%;font-family:'DM Sans',sans-serif;font-size:15px;background:rgba(var(--tc),0.04);border:1px solid rgba(var(--tc),0.06);border-radius:12px;padding:14px 16px;color:var(--cream);outline:none;margin-bottom:20px;transition:border-color 0.2s}.modal-input:focus{border-color:var(--purple)}.modal-input::placeholder{color:rgba(var(--tc),0.55)}
textarea.modal-input{resize:vertical;min-height:80px}
.modal-submit{width:100%;font-family:'Instrument Serif',serif;font-size:17px;font-style:italic;padding:16px;border-radius:60px;cursor:pointer;background:linear-gradient(129deg,var(--purple),var(--blue));border:none;color:white;margin-top:8px;transition:all 0.3s}.modal-submit:hover{box-shadow:0 0 40px rgba(142,33,202,0.2);transform:translateY(-1px)}
.modal-close{position:absolute;top:20px;right:24px;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:3px;background:none;border:none;color:var(--muted);cursor:pointer;text-transform:uppercase}.modal-close:hover{color:var(--cream)}
.modal-success{text-align:center;display:none}.modal-success.show{display:block}
.modal-success-check{width:56px;height:56px;margin:0 auto 20px;border-radius:50%;border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:24px}
.modal-success-title{font-family:'Instrument Serif',serif;font-size:24px;color:var(--text-heading);margin-bottom:12px}
.modal-success-sub{font-size:14px;color:var(--muted);line-height:1.6}
.q-overlay{position:fixed;inset:0;z-index:500;background:rgba(var(--oc),0.92);backdrop-filter:blur(24px);display:none;align-items:center;justify-content:center;padding:24px}.q-overlay.open{display:flex}
.q-panel{width:100%;max-width:480px;border:1px solid var(--border);border-radius:20px;padding:40px 36px;background:var(--dark2);position:relative;box-shadow:0 20px 60px rgba(0,0,0,0.3);max-height:90vh;overflow-y:auto}
.q-close{position:absolute;top:16px;right:20px;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:3px;background:none;border:none;color:var(--muted);cursor:pointer;text-transform:uppercase;transition:color 0.2s}.q-close:hover{color:var(--cream)}
.q-label{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:rgba(var(--tc),0.55);margin-bottom:8px;display:block;margin-top:16px}
.q-input{width:100%;font-family:'DM Sans',sans-serif;font-size:15px;background:rgba(var(--tc),0.04);border:1px solid rgba(var(--tc),0.06);border-radius:12px;padding:14px 16px;color:var(--cream);outline:none;transition:border-color 0.2s}.q-input:focus{border-color:var(--purple)}.q-input::placeholder{color:rgba(var(--tc),0.55)}
textarea.q-input{resize:vertical;min-height:80px}
.q-submit{width:100%;font-family:'Instrument Serif',serif;font-size:17px;font-style:italic;padding:16px;border-radius:60px;cursor:pointer;background:var(--btn-gradient);border:none;color:white;margin-top:20px;transition:all 0.3s}.q-submit:hover{box-shadow:0 0 40px rgba(142,33,202,0.2);transform:translateY(-1px)}.q-submit:disabled{opacity:0.6;cursor:default;transform:none}
.q-form-error{font-family:'DM Sans',sans-serif;font-size:13px;color:#e74c3c;background:rgba(231,76,60,0.08);border:1px solid rgba(231,76,60,0.2);border-radius:8px;padding:10px 14px;margin-bottom:12px;display:none}.q-form-error.visible{display:block}
.q-field-error{font-family:'DM Sans',sans-serif;font-size:12px;color:#e74c3c;margin-top:-10px;margin-bottom:8px;display:none}.q-field-error.visible{display:block}
.q-input.error{border-color:#e74c3c}
.theme-toggle{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--muted);cursor:pointer;padding:8px;border-radius:8px;transition:color 0.3s,background 0.3s}.theme-toggle:hover{color:var(--cream);background:rgba(var(--tc),0.04)}
.theme-icon-sun,.theme-icon-moon{width:18px;height:18px;flex-shrink:0;transition:opacity 0.3s,transform 0.3s}
[data-theme="dark"] .theme-icon-sun{opacity:0;transform:scale(0.7);display:none}
[data-theme="dark"] .theme-icon-moon{opacity:1;transform:scale(1);display:block}
.theme-icon-sun{opacity:1;transform:scale(1);display:block}
.theme-icon-moon{opacity:0;transform:scale(0.7);display:none}

/* ─── Prefooter trust signal ─── */
    .prefooter-trust-signal {
      font-family: 'Space Mono', monospace;
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(var(--tc), 0.35);
      margin-top: 16px
    }

/* ─── Prefooter band + rich footer (grid/brand/columns/bottom) ─── */
    /* ═══ FOOTER — FULL IMMERSIVE ═══ */
    /* ═══ PRE-FOOTER CTA BAND ═══ */
    .prefooter {
      position: relative;
      overflow: hidden;
      background: var(--section-alt);
      padding: 140px 32px;
      min-height: 70vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      border-top: 1px solid var(--border)
    }

    [data-theme="dark"] .prefooter {
      background: linear-gradient(180deg, var(--dark), var(--dark), var(--dark))
    }

    .prefooter-inner {
      max-width: 700px;
      margin: 0 auto;
      position: relative;
      z-index: 2
    }

    .prefooter-eyebrow {
      font-family: 'Space Mono', monospace;
      font-size: 11px;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: rgba(var(--tc), 0.40);
      margin-bottom: 24px
    }

    .prefooter-headline {
      font-family: 'Instrument Serif', serif;
      font-weight: 400;
      font-size: clamp(36px, 5.5vw, 72px);
      color: var(--text-heading);
      line-height: 1.12;
      margin-bottom: 20px
    }

    .prefooter-sub {
      font-family: 'DM Sans', sans-serif;
      font-size: 16px;
      color: rgba(var(--tc), 0.55);
      line-height: 1.6;
      margin-bottom: 40px;
      max-width: 480px;
      margin-left: auto;
      margin-right: auto
    }

    .prefooter-cta {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-family: 'Instrument Serif', serif;
      font-size: 18px;
      font-style: italic;
      padding: 22px 60px;
      border-radius: 60px;
      border: 1.5px solid rgba(142, 33, 202, 0.3);
      background: transparent;
      color: var(--cream) !important;
      cursor: pointer;
      transition: border-color 0.3s, background 0.3s, transform 0.3s, box-shadow 0.3s;
      text-decoration: none
    }

    .prefooter-cta:hover {
      border-color: var(--gold);
      background: var(--gold);
      transform: translateY(-2px);
      box-shadow: 0 12px 40px rgba(212, 175, 55, 0.2)
    }

    @media(max-width:640px) {
      .prefooter {
        padding: 80px 24px;
        min-height: auto
      }

      .prefooter-headline {
        font-size: clamp(28px, 8vw, 42px)
      }
    }

    /* ═══ FOOTER ═══ */
    .foot-section {
      position: relative;
      overflow: hidden;
      background: var(--dark);
      padding: 72px 32px 36px
    }

    [data-theme="dark"] .foot-section {
      background: var(--dark)
    }

    /* Canvas */
    .foot-canvas {
      position: absolute;
      inset: 0;
      pointer-events: none;
      overflow: hidden
    }

    .foot-bg-grid {
      position: absolute;
      inset: 0;
      opacity: 0.04;
      background-image: linear-gradient(rgba(var(--tc), 0.25) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--tc), 0.25) 1px, transparent 1px);
      background-size: 60px 60px;
      mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, transparent 70%);
      -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, transparent 70%)
    }

    .foot-glow {
      position: absolute;
      border-radius: 50%;
      filter: blur(120px)
    }

    .foot-glow.fg1 {
      width: 600px;
      height: 500px;
      background: radial-gradient(circle, rgba(142, 33, 202, 0.14), transparent 70%);
      top: -80px;
      left: 5%;
      animation: footGlow1 18s ease-in-out infinite alternate
    }

    .foot-glow.fg2 {
      width: 500px;
      height: 400px;
      background: radial-gradient(circle, rgba(184, 148, 30, 0.09), transparent 70%);
      top: 20%;
      right: 5%;
      animation: footGlow2 22s ease-in-out infinite alternate
    }

    .foot-glow.fg3 {
      width: 400px;
      height: 300px;
      background: radial-gradient(circle, rgba(37, 74, 173, 0.08), transparent 70%);
      bottom: 0;
      left: 40%;
      animation: footGlow1 26s ease-in-out infinite alternate-reverse
    }

    @keyframes footGlow1 {
      0% {
        transform: translate(0, 0)
      }

      100% {
        transform: translate(40px, -30px)
      }
    }

    @keyframes footGlow2 {
      0% {
        transform: translate(0, 0)
      }

      100% {
        transform: translate(-50px, 20px)
      }
    }

    /* Top divider */
    .foot-divider {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: linear-gradient(90deg, transparent 5%, rgba(142, 33, 202, 0.30) 25%, rgba(212, 175, 55, 0.20) 50%, rgba(37, 74, 173, 0.30) 75%, transparent 95%)
    }

    /* Flowing diagonal lines */
    .foot-flow {
      position: absolute;
      inset: 0;
      pointer-events: none;
      overflow: hidden
    }

    .foot-flow::before {
      content: '';
      position: absolute;
      inset: -100%;
      background-image: repeating-linear-gradient(-45deg, transparent, transparent 56px, rgba(var(--tc), 0.018) 56px, rgba(var(--tc), 0.018) 57px);
      animation: footFlowDrift 50s linear infinite
    }

    @keyframes footFlowDrift {
      from {
        transform: translate(0, 0)
      }

      to {
        transform: translate(114px, 114px)
      }
    }

    /* Footer inner */
    .foot-inner {
      max-width: 1100px;
      margin: 0 auto;
      position: relative;
      z-index: 2
    }

    .foot-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 40px;
      margin-bottom: 60px
    }

    .foot-brand {
      display: flex;
      flex-direction: column;
      gap: 12px
    }

    .foot-logo {
      display: block;
      margin-bottom: 4px
    }

    .foot-logo img {
      height: 52px;
      width: auto;
      display: block
    }

    .foot-tagline {
      font-family: 'Instrument Serif', serif;
      font-size: 15px;
      font-style: italic;
      color: rgba(var(--tc), 0.55)
    }

    .foot-contact {
      font-family: 'Space Mono', monospace;
      font-size: 11px;
      letter-spacing: 2px;
      color: rgba(var(--tc), 0.40);
      margin-top: 8px;
      line-height: 1.8
    }

    .foot-socials {
      display: flex;
      gap: 10px;
      margin-top: 18px;
      flex-wrap: wrap
    }

    .foot-social {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.3s;
      color: rgba(var(--tc), 0.50);
      font-size: 11px;
      text-decoration: none;
      font-family: 'Space Mono', monospace
    }

    .foot-social:hover {
      border-color: rgba(142, 33, 202, 0.5);
      color: var(--purple);
      box-shadow: 0 0 16px rgba(142, 33, 202, 0.12)
    }

    .foot-col-title {
      font-family: 'Space Mono', monospace;
      font-size: 10px;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: rgba(var(--tc), 0.50);
      margin-bottom: 18px
    }

    .foot-link {
      display: block;
      font-family: 'DM Sans', sans-serif;
      font-size: 14px;
      color: rgba(var(--tc), 0.55);
      padding: 4px 0;
      cursor: pointer;
      transition: color 0.2s;
      text-decoration: none
    }

    .foot-link:hover {
      color: rgba(var(--tc), 0.90)
    }

    .foot-bottom {
      padding-top: 24px;
      border-top: 1px solid var(--border);
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px
    }

    .foot-copy {
      font-family: 'Space Mono', monospace;
      font-size: 11px;
      letter-spacing: 3px;
      color: rgba(var(--tc), 0.38)
    }

    .foot-legal {
      display: flex;
      gap: 24px
    }

    .foot-help {
      font-family: 'Space Mono', monospace;
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(var(--tc), 0.38);
      text-decoration: none;
      cursor: pointer;
      transition: color 0.3s
    }

    .foot-help:hover {
      color: var(--gold)
    }

    /* Responsive */
    @media(max-width:900px) {
      .foot-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 24px;
        text-align: center;
      }
    }

    @media(max-width:640px) {
      .foot-section {
        padding: 48px 20px 28px
      }

      .foot-grid {
        grid-template-columns: 1fr;
        gap: 28px;
        text-align: center;
      }

      .foot-brand {
        align-items: center;
      }

      .foot-bottom {
        flex-direction: column;
        text-align: center;
        gap: 8px
      }

      .foot-legal {
        justify-content: center
      }
    }

/* ─── Back-to-top button + mobile sticky CTA ─── */
    .back-top {
      position: fixed;
      bottom: calc(32px + env(safe-area-inset-bottom, 0px));
      right: 28px;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(var(--oc), 0.92);
      backdrop-filter: blur(14px);
      border: 1px solid var(--border);
      color: var(--cream);
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
      z-index: 150;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transform: translateY(14px);
      transition: opacity 0.35s, transform 0.35s, background 0.3s, box-shadow 0.3s;
      pointer-events: none;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12)
    }

    .back-top.visible {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto
    }

    .back-top:hover {
      background: var(--purple);
      border-color: var(--purple);
      box-shadow: 0 4px 24px rgba(142, 33, 202, 0.35)
    }

    /* ── MOBILE STICKY CTA ── */
    .mobile-cta-bar {
      display: none
    }

    @media(max-width:640px) {
      .mobile-cta-bar {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 170;
        background: rgba(var(--oc), 0.97);
        backdrop-filter: blur(20px);
        border-top: 1px solid var(--border);
        padding: 12px 20px calc(16px + env(safe-area-inset-bottom, 0px));
        transform: translateY(100%);
        transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
        pointer-events: none
      }

      .mobile-cta-bar.visible {
        transform: translateY(0);
        pointer-events: auto
      }

      .mobile-cta-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px
      }

      .mobile-cta-sub {
        font-family: 'Space Mono', monospace;
        font-size: 10px;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: rgba(var(--tc), 0.45);
        line-height: 1.4
      }

      .mobile-cta-btn {
        font-family: 'Instrument Serif', serif;
        font-size: 15px;
        font-style: italic;
        padding: 11px 26px;
        border-radius: 60px;
        background: var(--btn-gradient);
        border: none;
        color: #fff;
        cursor: pointer;
        white-space: nowrap;
        flex-shrink: 0;
        box-shadow: 0 4px 20px rgba(142, 33, 202, 0.25)
      }

      .back-top {
        bottom: calc(80px + env(safe-area-inset-bottom, 0px))
      }
    }

/* ─── Responsive site-nav + header tweaks ─── */
/* Tablets + phones: "My Account" collapses to a circular user-icon button */
@media(max-width:1024px){
  .nav-right{gap:16px}
  .account-btn{padding:8px;border-radius:50%}
  .account-btn .account-label{display:none}
  .account-btn .account-icon{display:block}
}
@media(max-width:768px){
  .site-nav{padding:16px 20px}
}
/* Phones: prototype-parity — compact logo, tight gaps, icon-only search.
   The Get Started pill hides here: logo + all five nav controls physically
   overflow this band (the hero CTA / mega menu / sticky mobile CTA keep
   that path reachable) */
@media(max-width:640px){
  .site-nav{padding:14px 16px}
  .nav-logo img{width:min(240px,48vw);max-width:none}
  .nav-left{gap:12px}
  .nav-right{gap:12px}
  .theme-toggle{padding:4px}
  .search-btn span{display:none}
  .start-btn{display:none}
}
/* Small phones: symmetric fr tracks so the logo truly centers. Theme
   toggle sits left beside a slimmed Menu, so the 45vw logo fits on all
   phones; calc() is the safety net for sub-350px screens */
@media(max-width:430px){
  .site-nav{padding:12px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .nav-logo img{width:min(240px,48vw,calc(100vw - 190px));max-width:none}
  .nav-left{gap:6px}
  .nav-right{gap:6px}
  .menu-btn{font-size:12px;letter-spacing:2px}
  .cart-btn{padding:8px 0}
  .account-btn{padding:6px}
}

/* ── Page atmosphere (shared, static variant) — markup = <x-page-atmosphere />.
   Scoped to .pa-static so it never collides with the pdp.js-injected
   atmosphere on category/PDP pages. Same palette as home/pdp; the grid
   animates transform on ::before (compositor-only), orbs go static <=760px. ── */
#page-atmosphere.pa-static{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:210;mix-blend-mode:normal;contain:layout style}
.pa-static > *{position:absolute;pointer-events:none}
.pa-static .pa-orb{border-radius:50%;filter:blur(130px);will-change:transform,opacity;mix-blend-mode:multiply}
[data-theme="dark"] .pa-static .pa-orb{mix-blend-mode:screen}
.pa-static .pa-orb-1{width:600px;height:600px;background:rgba(142,33,202,.14);top:-12%;left:-8%;animation:psPaOrb1 24s ease-in-out infinite}
.pa-static .pa-orb-2{width:520px;height:520px;background:rgba(142,33,202,.10);bottom:-10%;right:-8%;animation:psPaOrb2 28s ease-in-out infinite}
.pa-static .pa-orb-3{width:460px;height:460px;background:rgba(212,73,170,.10);top:38%;right:6%;animation:psPaOrb3 22s ease-in-out infinite}
.pa-static .pa-orb-4{width:480px;height:480px;background:rgba(37,74,173,.10);bottom:20%;left:14%;animation:psPaOrb4 26s ease-in-out infinite}
[data-theme="dark"] .pa-static .pa-orb-1{background:rgba(142,33,202,.22)}
[data-theme="dark"] .pa-static .pa-orb-2{background:rgba(142,33,202,.18)}
[data-theme="dark"] .pa-static .pa-orb-3{background:rgba(212,73,170,.16)}
[data-theme="dark"] .pa-static .pa-orb-4{background:rgba(37,74,173,.14)}
@keyframes psPaOrb1{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(50px,-30px,0)}}
@keyframes psPaOrb2{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-40px,25px,0)}}
@keyframes psPaOrb3{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-35px,40px,0)}}
@keyframes psPaOrb4{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(45px,-20px,0)}}
.pa-static .pa-ink{border-radius:50%;filter:blur(70px);mix-blend-mode:multiply;opacity:0;animation:psPaInk 22s ease-in-out infinite}
[data-theme="dark"] .pa-static .pa-ink{mix-blend-mode:screen}
.pa-static .pa-ink-1{width:520px;height:520px;background:radial-gradient(circle,rgba(142,33,202,.32),transparent 70%);top:18%;left:22%;animation-delay:0s}
.pa-static .pa-ink-2{width:460px;height:460px;background:radial-gradient(circle,rgba(212,73,170,.28),transparent 70%);bottom:14%;right:18%;animation-delay:11s}
@keyframes psPaInk{0%,100%{opacity:0;transform:scale(.85)}40%{opacity:.45;transform:scale(1.08)}70%{opacity:.25;transform:scale(1)}}
.pa-static .pa-grid{inset:0;opacity:.05;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 90% 75% at 50% 50%,#000,transparent 92%);overflow:hidden}
[data-theme="dark"] .pa-static .pa-grid{opacity:.12;mix-blend-mode:screen}
.pa-static .pa-grid::before{content:'';position:absolute;inset:-80px;background-image:linear-gradient(rgba(142,33,202,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(142,33,202,.16) 1px,transparent 1px);background-size:80px 80px;animation:psPaGrid 18s linear infinite}
@keyframes psPaGrid{from{transform:translate3d(0,0,0)}to{transform:translate3d(80px,80px,0)}}
@media(max-width:760px){
  .pa-static .pa-orb-3,.pa-static .pa-orb-4,.pa-static .pa-ink-1,.pa-static .pa-ink-2{display:none}
  .pa-static .pa-grid{opacity:.025}
  .pa-static .pa-orb,.pa-static .pa-ink{animation:none}
}
@media (prefers-reduced-motion: reduce){
  .pa-static .pa-orb,.pa-static .pa-ink,.pa-static .pa-grid::before{animation:none!important}
}