h1, h2, h3, .site-brand-title, .gold-shimmer-text {
      font-family: 'Cinzel', 'Game Of Squids', serif !important;
      letter-spacing: 0.08em;
    }
    body, p, span, button, a {
      font-family: 'Outfit', 'Inter', sans-serif;
    }
  

/* ---- next style block ---- */


    /* --- Ultra-Sharp Crisp Text Enforcement --- */
    p, h1, h2, h3, h4, h5, h6, span, div, a, button, label {
      -webkit-font-smoothing: antialiased !important;
      -moz-osx-font-smoothing: grayscale !important;
      text-rendering: optimizeLegibility !important;
      filter: none !important;
    }

    /* --- $500k Liquid Gold & Metallic Rose Shimmer --- */
    .gold-shimmer-text {
      background: linear-gradient(135deg, #ffffff 0%, #d9b98a 25%, #A8432E 50%, #e8cbb0 75%, #ffffff 100%);
      background-size: 200% auto;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      animation: goldShimmerSweep 5s linear infinite;
    }
    @keyframes goldShimmerSweep {
      0% { background-position: 0% center; }
      100% { background-position: 200% center; }
    }

    /* --- Holographic Scan Line Effect on Headers --- */
    .awwwards-header-scan {
      position: relative;
      overflow: hidden;
    }
    .awwwards-header-scan::after {
      content: "";
      position: absolute;
      top: 0; left: -100%; width: 60%; height: 100%;
      background: linear-gradient(90deg, transparent, rgba(168,67,46, 0.35), transparent);
      animation: awwwardsScanLine 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
      pointer-events: none;
    }
    @keyframes awwwardsScanLine {
      0% { left: -100%; }
      50%, 100% { left: 200%; }
    }

    /* --- Luxury Crystal Glass: frosted depth, rose-gold edge, soft top sheen --- */
    .pro-glass-card {
      position: relative;
      background:
        linear-gradient(160deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 35%),
        linear-gradient(180deg, rgba(20,7,12,0.86) 0%, rgba(8,3,6,0.92) 100%) !important;
      border: 1px solid rgba(192,138,82, 0.28) !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.06),
        inset 0 0 40px rgba(74,36,24, 0.12),
        0 25px 60px -15px rgba(0, 0, 0, 0.9),
        0 0 40px -8px rgba(74,36,24, 0.25) !important;
      transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease, border-color 0.5s ease !important;
    }
    .pro-glass-card::before {
      content: "";
      position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
      background: linear-gradient(115deg, rgba(255,255,255,0.10) 0%, transparent 22%);
      opacity: 0.9;
    }
    .pro-glass-card:hover {
      border-color: rgba(192,138,82, 0.65) !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.09),
        inset 0 0 50px rgba(168,67,46, 0.16),
        0 35px 90px -15px rgba(0, 0, 0, 0.95),
        0 0 55px rgba(168,67,46, 0.4),
        0 0 20px rgba(192,138,82, 0.25) !important;
    }

    /* --- Android GPU Hardware Acceleration Layer --- */
    body, html {
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-rendering: optimizeLegibility;
    }
    img, video, iframe, canvas {
      transform: translateZ(0);
      -webkit-transform: translateZ(0);
    }

    /* --- VIP Reserve Cart Drawer $500k Glass Upgrade --- */
    #cart-drawer {
      background: rgba(10, 3, 8, 0.96) !important;
      border-left: 1px solid rgba(168,67,46, 0.4) !important;
      box-shadow: -25px 0 90px rgba(0, 0, 0, 0.98), 0 0 70px rgba(168,67,46, 0.3) !important;
    }
    #cart-checkout-btn {
      background: linear-gradient(135deg, #4A2418, #A8432E, #C08A52) !important;
      box-shadow: 0 8px 32px rgba(74,36,24, 0.65), 0 1px 0 rgba(255,255,255,0.4) inset !important;
      font-family: 'Cinzel', serif !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s ease !important;
    }
    #cart-checkout-btn:hover {
      transform: scale(1.03) !important;
      box-shadow: 0 12px 45px rgba(168,67,46, 0.85) !important;
    }
    #cart-checkout-btn:active {
      transform: scale(0.97) !important;
    }
  

/* ---- next style block ---- */


*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.inset-x-0{left:0;right:0}.-bottom-2{bottom:-.5rem}.-bottom-20{bottom:-5rem}.-bottom-6{bottom:-1.5rem}.-bottom-7{bottom:-1.75rem}.-left-2{left:-.5rem}.-right-2{right:-.5rem}.-right-20{right:-5rem}.-right-3{right:-.75rem}.-top-2{top:-.5rem}.bottom-0{bottom:0}.bottom-10{bottom:2.5rem}.bottom-3{bottom:.75rem}.bottom-4{bottom:1rem}.left-0{left:0}.left-1\/2{left:50%}.left-1\/3{left:33.333333%}.left-1\/4{left:25%}.left-3{left:.75rem}.left-4{left:1rem}.right-0{right:0}.right-1\/3{right:33.333333%}.right-1\/4{right:25%}.right-3{right:.75rem}.right-4{right:1rem}.top-0{top:0}.top-1\/3{top:33.333333%}.top-20{top:5rem}.top-4{top:1rem}.isolate{isolation:isolate}.z-10{z-index:10}.z-20{z-index:20}.z-\[9999\]{z-index:9999}.order-1{order:1}.order-2{order:2}.mx-auto{margin-left:auto;margin-right:auto}.my-auto{margin-top:auto;margin-bottom:auto}.mb-1{margin-bottom:.25rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-7{margin-bottom:1.75rem}.mb-8{margin-bottom:2rem}.mb-9{margin-bottom:2.25rem}.mt-1{margin-top:.25rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.aspect-\[3\/4\]{aspect-ratio:3/4}.aspect-video{aspect-ratio:16/9}.h-1\/2{height:50%}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-80{height:20rem}.h-96{height:24rem}.h-\[220px\]{height:220px}.h-\[250px\]{height:250px}.h-\[300px\]{height:300px}.h-\[500px\]{height:500px}.h-full{height:100%}.h-px{height:1px}.w-1{width:.25rem}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-14{width:3.5rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-28{width:7rem}.w-3\/4{width:75%}.w-6{width:1.5rem}.w-72{width:18rem}.w-8{width:2rem}.w-96{width:24rem}.w-\[320px\]{width:320px}.w-\[350px\]{width:350px}.w-\[400px\]{width:400px}.w-\[500px\]{width:500px}.w-\[92\%\]{width:92%}.w-full{width:100%}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-\[380px\]{max-width:380px}.max-w-xl{max-width:36rem}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.cursor-pointer{cursor:pointer}.resize{resize:both}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-x-8{-moz-column-gap:2rem;column-gap:2rem}.gap-y-5{row-gap:1.25rem}.-space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(-.75rem*var(--tw-space-x-reverse));margin-left:calc(-.75rem*(1 - var(--tw-space-x-reverse)))}.overflow-hidden{overflow:hidden}.scroll-smooth{scroll-behavior:smooth}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-\[24px\]{border-radius:24px}.rounded-\[26px\]{border-radius:26px}.rounded-\[28px\]{border-radius:28px}.rounded-\[30px\]{border-radius:30px}.rounded-\[35px\]{border-radius:35px}.rounded-full{border-radius:9999px}.rounded-bl-md{border-bottom-left-radius:.375rem}.rounded-br-md{border-bottom-right-radius:.375rem}.rounded-tl-md{border-top-left-radius:.375rem}.rounded-tr-md{border-top-right-radius:.375rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-l-2{border-left-width:2px}.border-r-2{border-right-width:2px}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-\[\#14070c\]{--tw-border-opacity:1;border-color:rgb(13 2 9/var(--tw-border-opacity,1))}.border-pink-300\/80{border-color:rgba(191,130,86,.8)}.border-pink-400{--tw-border-opacity:1;border-color:rgb(168 67 46/var(--tw-border-opacity,1))}.border-pink-400\/50{border-color:rgba(168,67,46,.5)}.border-pink-500\/20{border-color:rgba(74,36,24,.2)}.border-pink-500\/30{border-color:rgba(74,36,24,.3)}.border-pink-500\/40{border-color:rgba(74,36,24,.4)}.border-pink-500\/50{border-color:rgba(74,36,24,.5)}.border-pink-500\/60{border-color:rgba(74,36,24,.6)}.border-pink-600\/20{border-color:rgba(53,24,15,.2)}.border-pink-600\/30{border-color:rgba(53,24,15,.3)}.border-pink-600\/50{border-color:rgba(53,24,15,.5)}.border-white\/15{border-color:hsla(0,0%,100%,.15)}.border-white\/30{border-color:hsla(0,0%,100%,.3)}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black\/55{background-color:rgba(0,0,0,.55)}.bg-black\/85{background-color:rgba(0,0,0,.85)}.bg-pink-500\/10{background-color:rgba(74,36,24,.1)}.bg-pink-500\/20{background-color:rgba(74,36,24,.2)}.bg-pink-500\/30{background-color:rgba(74,36,24,.3)}.bg-pink-500\/40{background-color:rgba(74,36,24,.4)}.bg-pink-600\/10{background-color:rgba(53,24,15,.1)}.bg-pink-950\/60{background-color:rgba(20,4,9,.6)}.bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}.from-\[\#14070c\]{--tw-gradient-from:#14070c var(--tw-gradient-from-position);--tw-gradient-to:rgba(13,2,9,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/60{--tw-gradient-from:rgba(0,0,0,.6) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/80{--tw-gradient-from:rgba(0,0,0,.8) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/85{--tw-gradient-from:rgba(0,0,0,.85) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-pink-500{--tw-gradient-from:#4A2418 var(--tw-gradient-from-position);--tw-gradient-to:rgba(74,36,24,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-pink-600{--tw-gradient-from:#35180F var(--tw-gradient-from-position);--tw-gradient-to:rgba(53,24,15,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-black\/20{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-pink-400{--tw-gradient-to:rgba(168,67,46,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#A8432E var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-pink-500{--tw-gradient-to:rgba(74,36,24,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#4A2418 var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}.to-pink-200{--tw-gradient-to:#D9BD98 var(--tw-gradient-to-position)}.to-pink-400{--tw-gradient-to:#A8432E var(--tw-gradient-to-position)}.to-pink-400\/70{--tw-gradient-to:rgba(168,67,46,.7) var(--tw-gradient-to-position)}.to-pink-600{--tw-gradient-to:#35180F var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.p-\[1\.5px\]{padding:1.5px}.p-\[2px\]{padding:2px}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-9{padding-left:2.25rem;padding-right:2.25rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-28{padding-top:7rem;padding-bottom:7rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-9{padding-bottom:2.25rem}.pl-2{padding-left:.5rem}.pr-5{padding-right:1.25rem}.pr-6{padding-right:1.5rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-black{font-weight:900}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-\[1\.05\]{line-height:1.05}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-\[0\.08em\]{letter-spacing:.08em}.tracking-\[0\.15em\]{letter-spacing:.15em}.tracking-\[0\.25em\]{letter-spacing:.25em}.tracking-\[0\.2em\]{letter-spacing:.2em}.tracking-\[0\.3em\]{letter-spacing:.3em}.tracking-\[0\.45em\]{letter-spacing:.45em}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-gray-200{--tw-text-opacity:1;color:rgb(229 231 235/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-300\/90{color:rgba(209,213,219,.9)}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-pink-100{--tw-text-opacity:1;color:rgb(240 228 210/var(--tw-text-opacity,1))}.text-pink-200{--tw-text-opacity:1;color:rgb(217 189 152/var(--tw-text-opacity,1))}.text-pink-200\/70{color:rgba(217,189,152,.7)}.text-pink-200\/90{color:rgba(217,189,152,.9)}.text-pink-300{--tw-text-opacity:1;color:rgb(191 130 86/var(--tw-text-opacity,1))}.text-pink-300\/80{color:rgba(191,130,86,.8)}.text-pink-400{--tw-text-opacity:1;color:rgb(168 67 46/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-\[0_0_20px_rgba\(179\2c 24\2c 79\2c 0\.3\)\]{--tw-shadow:0 0 20px rgba(74,36,24,.3);--tw-shadow-colored:0 0 20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_20px_rgba\(179\2c 24\2c 79\2c 0\.8\)\]{--tw-shadow:0 0 20px rgba(74,36,24,.8);--tw-shadow-colored:0 0 20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_30px_rgba\(179\2c 24\2c 79\2c 0\.7\)\]{--tw-shadow:0 0 30px rgba(74,36,24,.7);--tw-shadow-colored:0 0 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_50px_rgba\(179\2c 24\2c 79\2c 0\.4\)\]{--tw-shadow:0 0 50px rgba(74,36,24,.4);--tw-shadow-colored:0 0 50px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_50px_rgba\(179\2c 24\2c 79\2c 0\.5\)\]{--tw-shadow:0 0 50px rgba(74,36,24,.5);--tw-shadow-colored:0 0 50px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_60px_rgba\(179\2c 24\2c 79\2c 0\.35\)\]{--tw-shadow:0 0 60px rgba(74,36,24,.35);--tw-shadow-colored:0 0 60px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_10px_40px_rgba\(179\2c 24\2c 79\2c 0\.45\)\]{--tw-shadow:0 10px 40px rgba(74,36,24,.45);--tw-shadow-colored:0 10px 40px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_15px_40px_rgba\(0\2c 0\2c 0\2c 0\.6\)\]{--tw-shadow:0 15px 40px rgba(0,0,0,.6);--tw-shadow-colored:0 15px 40px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_40px_100px_-20px_rgba\(179\2c 24\2c 79\2c 0\.5\)\]{--tw-shadow:0 40px 100px -20px rgba(74,36,24,.5);--tw-shadow-colored:0 40px 100px -20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_40px_100px_-20px_rgba\(179\2c 24\2c 79\2c 0\.55\)\]{--tw-shadow:0 40px 100px -20px rgba(74,36,24,.55);--tw-shadow-colored:0 40px 100px -20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_8px_30px_rgba\(0\2c 0\2c 0\2c 0\.5\)\]{--tw-shadow:0 8px 30px rgba(0,0,0,.5);--tw-shadow-colored:0 8px 30px var(--tw-shadow-color)}.shadow-\[0_8px_30px_rgba\(0\2c 0\2c 0\2c 0\.5\)\],.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px)}.blur,.blur-2xl{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-2xl{--tw-blur:blur(40px)}.blur-\[120px\]{--tw-blur:blur(120px)}.blur-\[120px\],.blur-\[130px\]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-\[130px\]{--tw-blur:blur(130px)}.blur-\[140px\]{--tw-blur:blur(140px)}.blur-\[140px\],.blur-\[150px\]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-\[150px\]{--tw-blur:blur(150px)}.blur-\[160px\]{--tw-blur:blur(160px)}.blur-\[160px\],.blur-\[180px\]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-\[180px\]{--tw-blur:blur(180px)}.drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06))}.drop-shadow,.drop-shadow-\[0_0_40px_rgba\(179\2c 24\2c 79\2c 0\.7\)\]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-\[0_0_40px_rgba\(179\2c 24\2c 79\2c 0\.7\)\]{--tw-drop-shadow:drop-shadow(0 0 40px rgba(74,36,24,.7))}.grayscale{--tw-grayscale:grayscale(100%)}.filter,.grayscale{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-3xl{--tw-backdrop-blur:blur(64px)}.backdrop-blur-3xl,.backdrop-blur-md{-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-md{--tw-backdrop-blur:blur(12px)}.backdrop-blur-xl{--tw-backdrop-blur:blur(24px)}.backdrop-blur-xl,.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-700{transition-duration:.7s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.selection\:bg-pink-500 ::-moz-selection{--tw-bg-opacity:1;background-color:rgb(74 36 24/var(--tw-bg-opacity,1))}.selection\:bg-pink-500 ::selection{--tw-bg-opacity:1;background-color:rgb(74 36 24/var(--tw-bg-opacity,1))}.selection\:text-black ::-moz-selection{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.selection\:text-black ::selection{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.selection\:bg-pink-500::-moz-selection{--tw-bg-opacity:1;background-color:rgb(74 36 24/var(--tw-bg-opacity,1))}.selection\:bg-pink-500::selection{--tw-bg-opacity:1;background-color:rgb(74 36 24/var(--tw-bg-opacity,1))}.selection\:text-black::-moz-selection{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.selection\:text-black::selection{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.hover\:scale-105:hover{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:border-pink-300:hover{--tw-border-opacity:1;border-color:rgb(191 130 86/var(--tw-border-opacity,1))}.hover\:bg-pink-500\/20:hover{background-color:rgba(74,36,24,.2)}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.group[open] .group-open\:rotate-45{--tw-rotate:45deg}.group:hover .group-hover\:scale-105,.group[open] .group-open\:rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:scale-105{--tw-scale-x:1.05;--tw-scale-y:1.05}.group:hover .group-hover\:bg-pink-500\/20{background-color:rgba(74,36,24,.2)}@media (min-width:640px){.sm\:-right-6{right:-1.5rem}.sm\:flex{display:flex}.sm\:aspect-\[4\/5\]{aspect-ratio:4/5}.sm\:h-96{height:24rem}.sm\:w-16{width:4rem}.sm\:w-80{width:20rem}.sm\:w-\[360px\]{width:360px}.sm\:max-w-\[420px\]{max-width:420px}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-5xl{font-size:3rem;line-height:1}.sm\:text-6xl{font-size:3.75rem;line-height:1}.sm\:text-\[10px\]{font-size:10px}.sm\:text-\[9px\]{font-size:9px}.sm\:text-base{font-size:1rem;line-height:1.5rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}.sm\:text-xs{font-size:.75rem;line-height:1rem}}@media (min-width:768px){.md\:w-1\/2{width:50%}.md\:-translate-y-3{--tw-translate-y:-0.75rem}.md\:-translate-y-3,.md\:scale-110{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\:scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:p-10{padding:2.5rem}.md\:p-14{padding:3.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:1024px){.lg\:order-1{order:1}.lg\:order-2{order:2}.lg\:col-span-5{grid-column:span 5/span 5}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:mx-0{margin-left:0;margin-right:0}.lg\:mt-16{margin-top:4rem}.lg\:hidden{display:none}.lg\:aspect-\[3\/4\]{aspect-ratio:3/4}.lg\:max-w-none{max-width:none}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:items-stretch{align-items:stretch}.lg\:justify-start{justify-content:flex-start}.lg\:gap-14{gap:3.5rem}.lg\:text-left{text-align:left}.lg\:text-7xl{font-size:4.5rem;line-height:1}}

/* ---- next style block ---- */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(assets/fonts/font_1.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/font_2.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/font_3.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/font_4.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/font_5.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/font_6.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(assets/fonts/font_7.ttf) format('truetype');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/font_8.ttf) format('truetype');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/font_9.ttf) format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/font_10.ttf) format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/font_11.ttf) format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/font_12.ttf) format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(assets/fonts/font_13.ttf) format('truetype');
}


/* ---- next style block ---- */


    *, *::before, *::after {
      box-sizing: border-box;
    }
    /* True full-screen fit on every device: mobile browser address bars change
       100vh mid-scroll, causing content to jump / not fit. --vh is set by JS
       to the REAL visible pixel height, so `calc(var(--vh, 1vh) * 100)` always
       equals the actual usable screen — identical behaviour on phone & desktop. */
    :root{ --vh: 1vh; }
    html, body { height: 100%; }
    /* FIX: without this, scrolling up past the very top of the page on a
       phone (a normal touch overscroll/bounce) is read by the mobile
       browser as a "pull to refresh" gesture — it reloads the whole page,
       which replays the preloader from scratch. That's the "loading
       shows, site shows, then loading shows again" glitch. Containing
       the overscroll stops the browser from treating that bounce as a
       refresh request, without changing how normal scrolling feels. */
    html, body { overscroll-behavior: contain; overscroll-behavior-y: contain; }

    /* ─── Custom gold-accented scrollbar — a flat grey default scrollbar is
       the fastest way a "premium" site looks cheap. Webkit + Firefox.
       (NOTE: a full-page film-grain texture layer was tried here too, but
       it forced a full-screen repaint every scroll frame and was the main
       cause of the mobile lag — removed for that reason.) ─── */
    html { scrollbar-width: thin; scrollbar-color: #4A2418 #14070c; }
    ::-webkit-scrollbar { width: 9px; height: 9px; }
    ::-webkit-scrollbar-track { background: #14070c; }
    ::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, #A8432E, #4A2418);
      border-radius: 8px;
      border: 2px solid #14070c;
    }
    ::-webkit-scrollbar-thumb:hover { background: #BF8256; }
    body{
      background:#14070c;
      color:#ffffff;
      font-family:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      overflow-x:hidden;
      margin: 0;
      padding: 0;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    /* Premium editorial display typeface for headings — pairs a serif
       masthead feel with the clean Inter body copy underneath it. */
    h1, h2, h3 {
      font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    }

    /* Immersive Three.js background world (desktop/tablet) with a CSS
       gradient fallback on phones — see the JS init below for why phones
       get the lighter version instead of the full WebGL scene. */
    #canvas3d-container {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      height: calc(var(--vh, 1vh) * 100);
      z-index: -1;
      pointer-events: none;
      overflow: hidden;
      perspective: 1400px;
      background: #14070c;
      --scroll-tint: #35180F;
    }
    #lux-tree-canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      opacity: 0.55;
    }
    @media (prefers-reduced-motion: reduce) {
      #lux-tree-canvas { display: none; }
    }

    /* Depth layer — a handful of soft, blurred color orbs sitting at
       different simulated depths (translateZ) inside the already-fixed,

       perspective(1400px) container above. On their own they're static;
       the scroll JS nudges each one's translateY/rotate at a different
       speed per orb, which — combined with the perspective already set
       on the container — reads as genuine 3D parallax depth as you
       scroll, on phone and desktop alike. Transform-only, so it's cheap
       even on low-end phones. */
    #canvas3d-depth {
      position: absolute;
      inset: 0;
      transform-style: preserve-3d;
      will-change: transform;
    }
    .depth-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(60px);
      opacity: 0.4;
      will-change: transform;
      transition: transform 0.05s linear;
    }
    .depth-orb--1 {
      width: 55vw; height: 55vw; max-width: 340px; max-height: 340px;
      top: 6%; left: 8%;
      background: radial-gradient(circle, #A8432E, transparent 70%);
      transform: translateZ(-120px);
    }
    .depth-orb--2 {
      width: 65vw; height: 65vw; max-width: 400px; max-height: 400px;
      top: 48%; right: 4%;
      background: radial-gradient(circle, #4A2418, transparent 70%);
      transform: translateZ(-220px);
    }
    .depth-orb--3 {
      width: 45vw; height: 45vw; max-width: 280px; max-height: 280px;
      top: 82%; left: 26%;
      background: radial-gradient(circle, #D9BD98, transparent 70%);
      transform: translateZ(-70px);
    }
    @media (prefers-reduced-motion: reduce) {
      .depth-orb { display: none; }
    }

    /* Tint + darken layers sit on top of the container, so nothing else on
       the page needs to change. */
    #canvas3d-tint {
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 80% 60% at 50% 15%, color-mix(in srgb, var(--scroll-tint) 22%, transparent), transparent 70%);
      transition: background 0.5s ease-out;
      will-change: background;
    }
    #canvas3d-dark {
      position: absolute;
      inset: 0;
      background: rgba(13,2,9, 0.35);
    }

    /* Tailwind's backdrop-blur-3xl/xl default to 64px/24px of blur — gorgeous,
       but very expensive to recomposite every frame on a fixed navbar that's
       always on screen. Dialed back site-wide; still reads as premium glass,
       costs much less. (Mobile has its own, even lighter values below.) */
    .backdrop-blur-3xl { backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; }
    .backdrop-blur-xl { backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; }

    /* Custom Scrollbar for Ultra High-End Feel */
    ::-webkit-scrollbar { width: 6px; }
    ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #35180F, #4A2418); border-radius: 3px; }

    /* ═══════════════════════════════════════════════════════════════════
       PREMIUM SPOTLIGHT NAVBAR — replaces the old elite-nav-* glass pill.
       Dark glass bar, single moving spotlight cone + indicator bar that
       glides to the active/hovered link. All sizing uses clamp()/%, so
       every icon stays visible on phones — nothing scrolls sideways or
       hides behind a hamburger.
       ═══════════════════════════════════════════════════════════════════ */
    .trc-nav {
      position: fixed;
      top: calc(1.1rem + env(safe-area-inset-top));
      left: 50%;
      transform: translateX(-50%);
      z-index: 9999;
      width: min(880px, 94vw);
      transition: top 0.4s cubic-bezier(0.16,1,0.3,1);
    }
    .trc-nav-inner {
      position: relative;
      display: flex;
      align-items: center;
      gap: clamp(8px, 2vw, 20px);
      height: clamp(56px, 12vw, 68px);
      padding: 0 clamp(10px, 2.4vw, 20px);
      border-radius: 20px;
      background: linear-gradient(180deg, #131313 0%, #0c0c0c 100%);
      border: 1px solid rgba(255,255,255,0.08);
      box-shadow:
        0 18px 45px rgba(0,0,0,0.55),
        0 1px 0 rgba(255,255,255,0.04) inset,
        0 -1px 0 rgba(0,0,0,0.5) inset;
      box-sizing: border-box;
    }
    .trc-nav-logo {
      flex: 0 0 auto;
      color: #f2f2f2;
      font-family: 'Cinzel', serif;
      font-weight: 800;
      letter-spacing: 0.18em;
      font-size: clamp(10px, 2.4vw, 13px);
      text-transform: uppercase;
      text-decoration: none;
      white-space: nowrap;
    }
    .trc-logo-short { display: none; }

    .trc-install-btn {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      height: clamp(26px, 6.5vw, 30px);
      padding: 0 clamp(8px, 2vw, 12px);
      border-radius: 999px;
      border: 1px solid rgba(224, 30, 60, 0.45);
      background: linear-gradient(180deg, #241014 0%, #170a0c 100%);
      color: #ff5c73;
      font-family: 'Outfit', sans-serif;
      font-weight: 700;
      font-size: clamp(9px, 1.8vw, 11px);
      letter-spacing: 0.02em;
      cursor: pointer;
      white-space: nowrap;
      box-shadow: 0 4px 14px rgba(0,0,0,0.4);
      transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
    }
    .trc-install-btn:hover {
      background: linear-gradient(180deg, #2e1519 0%, #1c0c0e 100%);
      box-shadow: 0 0 14px rgba(224,30,60,0.4);
      transform: translateY(-1px);
    }
    .trc-install-btn:active { transform: scale(0.94); }
    .trc-install-icon {
      border-radius: 4px;
      display: block;
      flex-shrink: 0;
      width: clamp(13px, 3.4vw, 16px);
      height: clamp(13px, 3.4vw, 16px);
    }
    .trc-install-full { display: inline; }
    .trc-install-short { display: none; }

    @media (max-width: 640px) {
      .trc-install-btn {
        height: 26px;
        padding: 0 8px;
        gap: 4px;
      }
      .trc-install-full { display: none; }
      .trc-install-short { display: inline; }
    }
    @media (max-width: 380px) {
      .trc-install-btn .trc-install-short { display: none; }
      .trc-install-btn { padding: 0; width: 26px; }
    }

    .trc-ios-install-modal {
      position: fixed;
      inset: 0;
      z-index: 10001;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      background: rgba(0,0,0,0.6);
      backdrop-filter: blur(4px);
      padding: 0 12px calc(16px + env(safe-area-inset-bottom));
    }
    .trc-ios-install-card {
      width: 100%;
      max-width: 420px;
      background: linear-gradient(180deg, #171012 0%, #0e0a0b 100%);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 18px;
      padding: 20px;
      color: #f2ece9;
      font-family: 'Outfit', sans-serif;
      box-shadow: 0 20px 60px rgba(0,0,0,0.6);
    }
    .trc-ios-install-card h3 {
      font-family: 'Cinzel', serif;
      font-size: 15px;
      letter-spacing: 0.05em;
      margin: 0 0 10px;
      color: #ff5c73;
    }
    .trc-ios-install-card ol {
      margin: 0 0 14px;
      padding-left: 18px;
      font-size: 13.5px;
      line-height: 1.7;
      color: rgba(242,236,233,0.85);
    }
    .trc-ios-install-card button {
      width: 100%;
      padding: 10px;
      border-radius: 10px;
      border: 1px solid rgba(255,255,255,0.12);
      background: rgba(255,255,255,0.06);
      color: #f2ece9;
      font-weight: 600;
      cursor: pointer;
    }

    .trc-nav-links {
      position: relative;
      flex: 1 1 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      list-style: none;
      margin: 0;
      padding: 0;
      height: 100%;
      min-width: 0;
    }
    .trc-nav-link {
      position: relative;
      z-index: 2;
      flex: 1 1 0;
      width: 100%;
      height: 100%;
      min-width: 0;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      gap: 6px;
      text-decoration: none;
      color: #707070;
      transition: color 0.35s ease;
      outline: none;
    }
    .trc-nav-link:hover,
    .trc-nav-link[aria-current="page"] { color: #f2f2f2; }
    .trc-nav-link:focus-visible {
      color: #f2f2f2;
      box-shadow: 0 0 0 2px rgba(255,255,255,0.5);
      border-radius: 10px;
    }
    .trc-icon {
      width: clamp(16px, 4.6vw, 20px);
      height: clamp(16px, 4.6vw, 20px);
      flex-shrink: 0;
      transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1);
    }
    .trc-nav-link[aria-current="page"] .trc-icon { transform: translateY(-1px) scale(1.08); }
    .trc-label {
      font-size: clamp(9px, 1.6vw, 11px);
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    /* Single moving spotlight cone — clip-path trapezoid, narrow at the
       top, wide at the bottom, sitting behind the icons (z-index 1). */
    .trc-cone {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 46px;
      left: 0;
      background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.05) 45%, rgba(255,255,255,0.16) 100%);
      clip-path: polygon(42% 0%, 58% 0%, 92% 100%, 8% 100%);
      pointer-events: none;
      z-index: 1;
      opacity: 0;
      transition: opacity 0.3s ease;
      will-change: transform;
    }
    .trc-nav-links.trc-ready .trc-cone { opacity: 1; }

    /* Indicator bar at the very top of the pill */
    .trc-indicator {
      position: absolute;
      top: -1px;
      width: clamp(28px, 7vw, 40px);
      height: 3px;
      border-radius: 0 0 4px 4px;
      background: linear-gradient(180deg, #ffffff, rgba(255,255,255,0.55));
      box-shadow: 0 3px 10px rgba(255,255,255,0.35);
      pointer-events: none;
      z-index: 1;
      opacity: 0;
      transition: opacity 0.3s ease;
      will-change: transform;
    }
    .trc-nav-links.trc-ready .trc-indicator { opacity: 1; }

    .trc-cart-btn {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      gap: 5px;
      height: 34px;
      padding: 0 10px;
      border-radius: 999px;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      color: #f2f2f2;
      cursor: pointer;
      transition: background 0.25s ease, transform 0.15s ease;
    }
    .trc-cart-btn:hover { background: rgba(255,255,255,0.12); }
    .trc-cart-btn:active { transform: scale(0.94); }
    .trc-cart-btn:focus-visible { box-shadow: 0 0 0 2px rgba(255,255,255,0.5); }
    #cart-count-badge:not(:empty) {
      min-width: 15px;
      height: 15px;
      padding: 0 4px;
      border-radius: 999px;
      background: #f2f2f2;
      color: #101010;
      font-size: 10px;
      font-weight: 800;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    @media (max-width: 640px) {
      .trc-nav { top: calc(0.6rem + env(safe-area-inset-top)); width: 96vw; }
      .trc-nav-inner { gap: 4px; padding: 0 8px; border-radius: 16px; }
      .trc-logo-full { display: none; }
      .trc-logo-short { display: inline; }
      .trc-label { display: none; }
      .trc-nav-link { gap: 0; }
      .trc-cart-btn span:not(#cart-count-badge) { display: none; }
    }

    @media (prefers-reduced-motion: reduce) {
      .trc-cone, .trc-indicator { transition: none; }
    }

    /* Continuous ambient background drift — always subtly alive, even before
       any scroll happens, layered underneath the scroll-tint color shift. */
    @keyframes ambientDrift {
      0%   { background-position: 0% 0%, 100% 100%; }
      50%  { background-position: 100% 100%, 0% 0%; }
      100% { background-position: 0% 0%, 100% 100%; }
    }
    #canvas3d-tint::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 20% 30%, rgba(53,24,15,0.10), transparent 55%),
        radial-gradient(circle at 80% 70%, rgba(74,36,24,0.08), transparent 55%);
      background-size: 180% 180%, 180% 180%;
      animation: ambientDrift 22s ease-in-out infinite;
      will-change: background-position;
    }
    @media (max-width: 768px) {
      #canvas3d-tint::before { animation-duration: 30s; }
    }
    @media (prefers-reduced-motion: reduce) {
      #canvas3d-tint::before { animation: none; }
      #canvas3d-container { background: radial-gradient(ellipse 80% 60% at 50% 15%, #2E140C33, transparent 70%), #14070c; }
    }

    /* AI emblem: subtle continuous 3D breathing tilt (transform-only, so it
       stays smooth on phones) + a blinking "AI active" status dot. */
    @keyframes aiOrbBreathe {
      0%, 100% { transform: perspective(300px) scale(1) rotateY(0deg); }
      50% { transform: perspective(300px) scale(1.05) rotateY(10deg); }
    }
    @keyframes aiStatusBlink {
      0%, 100% { opacity: 0.55; transform: scale(0.85); }
      50% { opacity: 1; transform: scale(1.2); }
    }

    /* ─── CEO PHOTOCARD: futuristic diecut ID-card frame for founder photo ─── */
    .ceo-photocard {
      clip-path: polygon(26px 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%, 0 26px);
      border-radius: 18px;
      border: 2px solid rgba(74,36,24,0.65);
      box-shadow: 0 0 50px rgba(74,36,24,0.5), inset 0 0 30px rgba(168,67,46,0.12);
      background: linear-gradient(145deg, rgba(74,36,24,0.18), rgba(0,0,0,0.45));
    }
    .ceo-photocard-mark {
      position: absolute;
      top: 14px;
      right: 14px;
      width: 30px;
      height: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Game Of Squids', 'Playfair Display', serif;
      font-size: 15px;
      color: #fff;
      background: rgba(0,0,0,0.6);
      border: 1px solid rgba(168,67,46,0.75);
      border-radius: 7px;
      z-index: 5;
      text-shadow: 0 0 10px rgba(168,67,46,0.9);
    }
    .ceo-photocard-scan {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 0%, rgba(168,67,46,0.1) 50%, transparent 100%);
      background-size: 100% 220%;
      animation: ceoScanMove 4.5s linear infinite;
      pointer-events: none;
      z-index: 3;
    }
    @keyframes ceoScanMove {
      0% { background-position: 0 -120%; }
      100% { background-position: 0 220%; }
    }
    .ceo-photocard-plate {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 16px 18px 18px;
      background: linear-gradient(0deg, rgba(0,0,0,0.92) 35%, transparent 100%);
      text-align: center;
      z-index: 4;
    }
    .ceo-photocard-plate::before {
      content: '';
      position: absolute;
      top: 0; left: 12%; right: 12%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.32), transparent);
      pointer-events: none;
    }
    .ceo-photocard-label {
      display: block;
      font-family: 'JetBrains Mono', 'Courier New', monospace;
      font-size: 8px;
      letter-spacing: 0.35em;
      text-transform: uppercase;
      color: rgba(191,130,86,0.75);
      margin-bottom: 3px;
    }
    .ceo-photocard-name {
      display: block;
      font-family: 'Game Of Squids', 'Playfair Display', serif;
      font-size: 21px;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: #fff;
      text-shadow: 0 0 18px rgba(168,67,46,0.75);
    }
    .ceo-photocard-code {
      display: block;
      font-family: 'JetBrains Mono', 'Courier New', monospace;
      font-size: 8.5px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.55);
      margin-top: 5px;
    }
    #ceo .pro-glass-card,
    #ceo .ceo-photocard {
      transform-style: flat !important;
      transform: none !important;
    }

    .premium-frame { padding: 32px 12px; }
    .corner-bracket {
      position: absolute;
      width: 26px;
      height: 26px;
      pointer-events: none;
      animation: cornerBracketPulse 3.5s ease-in-out infinite;
    }
    .corner-tl { top: 0; left: 0; border-top: 2px solid rgba(168,67,46,0.65); border-left: 2px solid rgba(168,67,46,0.65); }
    .corner-tr { top: 0; right: 0; border-top: 2px solid rgba(168,67,46,0.65); border-right: 2px solid rgba(168,67,46,0.65); }
    .corner-bl { bottom: 0; left: 0; border-bottom: 2px solid rgba(168,67,46,0.65); border-left: 2px solid rgba(168,67,46,0.65); }
    .corner-br { bottom: 0; right: 0; border-bottom: 2px solid rgba(168,67,46,0.65); border-right: 2px solid rgba(168,67,46,0.65); }
    @keyframes cornerBracketPulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }

    .contact-card-pro { padding-top: 2.75rem !important; }
    .contact-card-index {
      position: absolute;
      top: 14px;
      left: 18px;
      font-family: 'Playfair Display', serif;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 0.15em;
      color: rgba(168,67,46, 0.45);
    }
    .contact-status-pill {
      position: absolute;
      top: 14px;
      right: 16px;
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 8.5px;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #6ee7b7;
    }
    .contact-status-dot {
      width: 6px;
      height: 6px;
      border-radius: 9999px;
      background: #34d399;
      box-shadow: 0 0 6px rgba(52,211,153,0.9);
      animation: aiStatusBlink 1.6s ease-in-out infinite;
    }

    /* Thin gradient rule that separates the icon/title block from the
       CTA pill inside each contact card — reads as a deliberate card
       layout instead of stacked elements with even gaps. */
    .contact-card-divider {
      width: 60%;
      height: 1px;
      margin: 2px 0 0;
      background: linear-gradient(90deg, transparent, rgba(191,130,86,0.5), transparent);
      position: relative;
      z-index: 1;
    }

    /* Slow-rotating conic gradient ring behind the featured (Email) card —
       gives it a subtle "chosen one" halo that idles even without hover,
       instead of relying on box-shadow alone for emphasis. */
    @keyframes contactRingSpin { to { transform: rotate(360deg); } }
    .contact-card-pro { isolation: isolate; }
    .contact-card-pro.pro-glass-card::after {
      content: '';
      position: absolute;
      inset: -1.5px;
      border-radius: inherit;
      padding: 1.5px;
      background: conic-gradient(from 0deg, transparent 0%, color-mix(in srgb, var(--a2, #4A2418) 75%, transparent) 12%, transparent 26%, transparent 100%);
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      animation: contactRingSpin 5s linear infinite;
      pointer-events: none;
      z-index: -1;
    }
    .contact-card-pro.contact-card-featured.pro-glass-card::after {
      background: conic-gradient(from 0deg, transparent 0%, rgba(192,138,82,0.9) 12%, transparent 26%, transparent 100%);
    }
    @media (prefers-reduced-motion: reduce) {
      .contact-card-pro.pro-glass-card::after { animation: none; }
    }

    /* Trust strip beneath the contact cards — small verified-business
       signals, the kind of understated proof-point row luxury sites use
       instead of a loud banner. */
    .contact-trust-strip {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 10px 0;
      margin-top: 2.75rem;
    }
    .contact-trust-item {
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 0 18px;
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(209,213,219,0.75);
      border-right: 1px solid rgba(191,130,86,0.22);
    }
    .contact-trust-item:last-child { border-right: none; }
    .contact-trust-item .cti-dot {
      width: 5px;
      height: 5px;
      border-radius: 9999px;
      background: #C08A52;
      box-shadow: 0 0 6px rgba(192,138,82,0.85);
      flex-shrink: 0;
    }
    @media (max-width: 640px) {
      .contact-trust-item { border-right: none; padding: 0 12px; }
    }

    /* Gold Shimmer Text */
    @keyframes goldShimmer {
      0% { background-position: -200% center; }
      100% { background-position: 200% center; }
    }
    .gold-shimmer-text {
      background: linear-gradient(90deg, #f3f7fb 0%, #35180F 25%, #A8432E 50%, #2A130B 75%, #f3f7fb 100%);
      background-size: 250% auto;
      color: transparent;
      -webkit-background-clip: text;
      background-clip: text;
      animation: goldShimmer 5s linear infinite;
    }

    /* Cinematic 3D Video Frame */
    @keyframes videoPerspective3D {
      0%, 100% { transform: perspective(1600px) rotateX(6deg) rotateY(-8deg) translateY(0px); }
      50% { transform: perspective(1600px) rotateX(6deg) rotateY(-8deg) translateY(-10px); }
    }
    .video-perspective-box { animation: videoPerspective3D 6s ease-in-out infinite; }

    /* Interactive tilt wrapper — sits INSIDE the auto-floating box, so mouse
       parallax (added via JS) and the ambient float animation never fight
       over the same transform. Desktop-only; untouched on mobile. */
    #hero-tilt-wrap {
      transition: transform 0.35s cubic-bezier(0.16,1,0.3,1);
      transform-style: preserve-3d;
    }

    /* Diagonal light sweep across the hero video frame — a slow, recurring
       glare pass that reads as a premium studio-lit product shot rather
       than a flat video. */
    @keyframes heroShineSweep {
      0%   { transform: translateX(-160%) translateY(-160%) rotate(25deg); opacity: 0; }
      8%   { opacity: 0.9; }
      35%  { opacity: 0; }
      100% { transform: translateX(160%) translateY(160%) rotate(25deg); opacity: 0; }
    }
    #hero-video-shine {
      position: absolute;
      inset: -50%;
      background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.45) 48%, rgba(191,130,86,0.65) 50%, rgba(255,255,255,0.45) 52%, transparent 60%);
      animation: heroShineSweep 5s ease-in-out infinite;
      animation-delay: 0.5s;
      pointer-events: none;
      mix-blend-mode: screen;
    }
    @media (prefers-reduced-motion: reduce) { #hero-video-shine { display: none; } }

    /* Premium CTA shine-sweep — a light glint travels across each button on
       hover instead of a flat scale/opacity change. */
    .hero-cta-btn { position: relative; overflow: hidden; }
    .hero-cta-btn::before {
      content: '';
      position: absolute;
      top: 0; left: -60%;
      width: 40%; height: 100%;
      background: linear-gradient(115deg, transparent, rgba(255,255,255,0.55), transparent);
      transform: skewX(-20deg);
      transition: left 0.65s cubic-bezier(0.16,1,0.3,1);
      pointer-events: none;
    }
    .hero-cta-btn:hover::before { left: 130%; }

    /* Scroll-to-explore cue at the base of the hero */
    #hero-scroll-cue {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      opacity: 0.75;
      animation: heroScrollCueFade 2.6s ease-in-out infinite;
    }
    #hero-scroll-cue .cue-mouse {
      width: 20px;
      height: 32px;
      border-radius: 12px;
      border: 1.5px solid rgba(191,130,86,0.7);
      position: relative;
    }
    #hero-scroll-cue .cue-mouse::before {
      content: '';
      position: absolute;
      top: 5px;
      left: 50%;
      width: 3px;
      height: 6px;
      border-radius: 2px;
      background: linear-gradient(180deg, #BF8256, #A8432E);
      transform: translateX(-50%);
      animation: heroScrollDot 1.8s ease-in-out infinite;
    }
    @keyframes heroScrollDot { 0% { top: 5px; opacity: 1; } 70% { top: 16px; opacity: 0; } 100% { top: 16px; opacity: 0; } }
    @keyframes heroScrollCueFade { 0%, 100% { opacity: 0.45; transform: translateY(0); } 50% { opacity: 0.9; transform: translateY(4px); } }
    @media (prefers-reduced-motion: reduce) { #hero-scroll-cue { animation: none; } #hero-scroll-cue .cue-mouse::before { animation: none; } }

    /* Pro Stat & Product Cards — true frosted glassmorphism */
    .pro-glass-card {
      background: linear-gradient(145deg, rgba(25,11,16,0.55) 0%, rgba(5,9,14,0.65) 100%);
      border: 1px solid rgba(74,36,24, 0.35); /* Premium Rose-Gold / Diamond Ruby Glow */
      /* Layered shadow: soft far ambient glow + tight contact shadow + a
         faint inner glow — the depth recipe behind most high-end product
         cards, instead of one flat drop-shadow. The last term is a
         per-card colored bleed (--a1) used by the aurora-blob cards;
         it falls back to the house pink when --a1 isn't set. */
      box-shadow:
        0 2px 4px rgba(0,0,0,0.4),
        0 25px 50px rgba(0,0,0,0.85),
        0 0 0 1px rgba(255,255,255,0.03) inset,
        inset 0 0 25px rgba(74,36,24, 0.08),
        0 55px 70px -35px color-mix(in srgb, var(--a1, #4A2418) 55%, transparent);
      transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.5s ease;
      position: relative;
      overflow: hidden;
      backdrop-filter: blur(14px) saturate(160%);
      -webkit-backdrop-filter: blur(14px) saturate(160%);
    }

    /* ── SITE-WIDE GLASS POLISH ──
       Extends the same frosted-glass language already used by
       .pro-glass-card to every other recurring surface on the site —
       section kicker badges, ghost buttons, nav pills, the fan-carousel
       caption panel, the CEO photocard plate, and the footer — so the
       whole page reads as one consistent premium material from the
       hero down to the footer instead of a few glass cards floating
       over otherwise flat panels. */
    .rounded-full.border.bg-pink-500\/10,
    .rounded-full.border.bg-pink-950\/60 {
      backdrop-filter: blur(16px) saturate(160%);
      -webkit-backdrop-filter: blur(16px) saturate(160%);
      background-color: rgba(20,4,9,0.45) !important;
    }
    .hs-btn-ghost {
      backdrop-filter: blur(14px) saturate(160%);
      -webkit-backdrop-filter: blur(14px) saturate(160%);
    }
    .fan-card .fan-panel {
      background: linear-gradient(180deg, rgba(20,4,9,0) 0%, rgba(15,3,7,0.18) 40%, rgba(10,2,5,0.3) 100%);
      backdrop-filter: blur(14px) saturate(170%);
      -webkit-backdrop-filter: blur(14px) saturate(170%);
      position: relative;
    }
    /* Thin light-catch line along the top edge of the panel — the same
       "physical glass" detail used on .pro-glass-card, extended here so
       every frosted surface on the site reads as one consistent material. */
    .fan-card .fan-panel::before {
      content: '';
      position: absolute;
      top: 0; left: 10%; right: 10%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
      pointer-events: none;
    }
    .ceo-photocard-plate {
      backdrop-filter: blur(10px) saturate(160%);
      -webkit-backdrop-filter: blur(10px) saturate(160%);
    }
    footer.scroll-section {
      background: rgba(10,3,6,0.55) !important;
      backdrop-filter: blur(20px) saturate(160%);
      -webkit-backdrop-filter: blur(20px) saturate(160%);
    }
    @media (max-width: 768px) {
      /* Backdrop-filter is one of the pricier paint ops on phones — keep
         it, but a touch lighter so it stays smooth while scrolling. */
      .rounded-full.border.bg-pink-500\/10,
      .rounded-full.border.bg-pink-950\/60 { backdrop-filter: blur(10px) saturate(140%); -webkit-backdrop-filter: blur(10px) saturate(140%); }
      footer.scroll-section { backdrop-filter: blur(12px) saturate(140%); -webkit-backdrop-filter: blur(12px) saturate(140%); }
    }
    /* ── PREMIUM FADE-UP BOX ENTRANCE — hidden/pre-animation state ──
       Toggled by JS via IntersectionObserver every time a box enters
       or leaves the viewport. Previously this used a 34° rotate3d
       "spiral" tilt — it read as a busy template effect rather than
       premium, so it's been replaced with a restrained rise + fade
       (no rotation, small scale) — the reveal style most luxury sites
       actually use. Still !important so it wins against the
       "transform:none !important" mobile overrides used elsewhere on
       product cards below — that's what makes this work on phones. */
    .pro-glass-card.spiral-hidden {
      opacity: 0 !important;
      transform: scale(0.65) !important;
      transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1) !important;
    }
    #products .product-card-pro.spiral-hidden,
    #products .product-card-pro.product-featured.spiral-hidden {
      transform: scale(0.65) !important;
    }
    @media (prefers-reduced-motion: reduce) {
      .pro-glass-card.spiral-hidden { opacity: 1 !important; transform: none !important; transition: none !important; }
    }

    /* Thin light catching the top edge of the glass — the detail that sells
       "physical material" instead of "flat panel with a border". */
    .pro-glass-card::after {
      content: '';
      position: absolute;
      top: 0; left: 8%; right: 8%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
      pointer-events: none;
    }
    .pro-glass-card::before {
      content: '';
      position: absolute;
      inset: -1px;
      border-radius: inherit;
      background: linear-gradient(135deg, rgba(191,130,86,0.6), transparent, rgba(74,36,24,0.6));
      z-index: -1;
      opacity: 0;
      transition: opacity 0.5s ease;
    }
    .pro-glass-card:hover {
      transform: translateY(-8px) scale(1.015);
      border-color: rgba(191,130,86, 0.9);
      box-shadow:
        0 2px 4px rgba(0,0,0,0.4),
        0 40px 80px rgba(0,0,0,0.9),
        0 0 60px rgba(74,36,24, 0.4),
        inset 0 0 35px rgba(191,130,86, 0.18),
        0 60px 80px -30px color-mix(in srgb, var(--a1, #4A2418) 70%, transparent);
    }
    .pro-glass-card:hover::before { opacity: 1; }

    /* ================= AURORA BLOB (bottom mesh-gradient glow) =================
       Recreates the "dark card, glowing color pooling at the base" look:
       a soft multi-color blurred blob sits inside the bottom of the card,
       masked to fade out before it reaches the heading/copy up top so text
       stays crisp, then screen-blended so it reads as light, not paint.
       Each card sets --a1/--a2/--a3 inline to give itself a unique hue. */
    /* ── Heritage credentials "dossier plate" — a certificate/seal
       treatment for the About section's trust facts (location, quality,
       registration), tying the visual language to the section's own
       "Heritage of Excellence" / trust theme instead of generic stat
       tiles. Mirrors the founder photocard's corner-bracket language for
       cross-section cohesion. ── */
    .heritage-seal {
      width: 46px; height: 46px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      border: 1px solid rgba(192,138,82,0.65);
      background: radial-gradient(circle at 30% 30%, rgba(74,36,24,0.4), rgba(0,0,0,0.65));
      color: #E8C9A0; font-size: 19px; font-family: 'Game Of Squids','Playfair Display',serif;
      box-shadow: 0 0 20px rgba(74,36,24,0.5), inset 0 0 10px rgba(255,255,255,0.1);
      flex-shrink: 0;
    }
    .heritage-row {
      display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
      padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,0.09);
    }
    .heritage-row:last-child { border-bottom: none; padding-bottom: 2px; }
    .heritage-row-label {
      font-family: 'JetBrains Mono','Courier New',monospace; font-size: 10px;
      letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.45);
      flex-shrink: 0;
    }
    .heritage-row-value { font-weight: 800; font-size: 14px; text-align: right; }
    @media (max-width: 480px) {
      .heritage-row-value { font-size: 12.5px; }
    }

    .aurora-blob {
      position: absolute;
      inset: -15% -20% -30% -20%;
      background:
        radial-gradient(ellipse 55% 45% at 28% 100%, var(--a1, #4A2418) 0%, transparent 60%),
        radial-gradient(ellipse 55% 42% at 76% 92%, var(--a2, #A8432E) 0%, transparent 58%),
        radial-gradient(ellipse 70% 50% at 50% 68%, var(--a3, #C08A52) 0%, transparent 65%);
      filter: blur(26px) saturate(170%);
      opacity: 0.45;
      mix-blend-mode: screen;
      -webkit-mask-image: linear-gradient(to bottom, transparent 0%, transparent 34%, black 62%, black 100%);
      mask-image: linear-gradient(to bottom, transparent 0%, transparent 34%, black 62%, black 100%);
      animation: auroraDrift 16s ease-in-out infinite;
      pointer-events: none;
      z-index: 0;
    }
    @keyframes auroraDrift {
      0%, 100% { transform: translateY(0) scale(1); }
      50% { transform: translateY(-5%) scale(1.07); }
    }
    @media (prefers-reduced-motion: reduce) {
      .aurora-blob { animation: none; }
    }


    /* ================= PRODUCT CARDS — PREMIUM UPGRADE =================
       Cursor-reactive tilt + spotlight sheen, a huge translucent rank
       numeral, a star row, a "reserved today" live pill, a quick-view
       overlay on the media frame, and a sliding arrow on the CTA. Scoped
       to #products so nothing else on the page is touched. */
    #products .product-card-pro {
      transform: perspective(1100px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg));
      will-change: transform;
    }
    #products .product-card-pro:hover {
      transform: perspective(1100px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg)) translateY(-8px) scale(1.015);
    }
    #products .product-card-pro.product-featured {
      transform: perspective(1100px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg)) translateY(-1rem) scale(1.04);
    }
    #products .product-card-pro.product-featured:hover {
      transform: perspective(1100px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg)) translateY(-1.65rem) scale(1.05);
    }
    @media (max-width: 768px) {
      #products .product-card-pro.product-featured { transform: none !important; }
    }
    #products .product-card-pro::before {
      /* replace the plain gradient ring with one that also carries a
         cursor-following spotlight, layered on top of the house ring */
      background:
        radial-gradient(320px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,0.55), transparent 45%),
        linear-gradient(135deg, rgba(191,130,86,0.6), transparent, rgba(74,36,24,0.6));
    }
    #products .product-rank {
      position: absolute;
      top: -0.35em;
      right: 0.35rem;
      font-size: 5rem;
      font-weight: 900;
      line-height: 1;
      background: linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.02));
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,0.12);
      pointer-events: none;
      z-index: 1;
      user-select: none;
    }
    #products .product-live-pill {
      position: absolute;
      bottom: 0.7rem;
      right: 0.7rem;
      display: flex;
      align-items: center;
      gap: 0.4rem;
      padding: 0.3rem 0.65rem;
      border-radius: 9999px;
      background: rgba(4,6,10,0.72);
      border: 1px solid rgba(255,255,255,0.18);
      backdrop-filter: blur(6px);
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #e5e7eb;
      z-index: 10;
    }
    #products .product-live-pill .dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: #4ade80;
      box-shadow: 0 0 8px 2px rgba(74,222,128,0.7);
      animation: liveDotPulse 1.8s ease-in-out infinite;
    }
    @keyframes liveDotPulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.75); } }
    #products .product-quickview {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0,0,0,0.35);
      opacity: 0;
      transform: translateY(6px);
      transition: opacity 0.35s ease, transform 0.35s ease;
      pointer-events: none;
      z-index: 5;
    }
    #products .group:hover .product-quickview {
      opacity: 1;
      transform: translateY(0);
    }
    #products .product-quickview span {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      padding: 0.55rem 1.1rem;
      border-radius: 9999px;
      background: rgba(255,255,255,0.92);
      color: #0b0b0d;
      font-size: 10px;
      font-weight: 900;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    }
    #products .reserve-btn { position: relative; overflow: hidden; }
    #products .reserve-btn .arrow { display: inline-block; transition: transform 0.35s cubic-bezier(0.16,1,0.3,1); }
    #products .reserve-btn:hover .arrow { transform: translateX(4px); }
    @media (max-width: 768px) {
      #products .product-rank { font-size: 3.5rem; }
      #products .product-card-pro { transform: none !important; }
    }
    @media (prefers-reduced-motion: reduce) {
      #products .product-live-pill .dot { animation: none; }
    }

    /* AWARD-LEVEL SCROLL REVEAL — cinematic but restrained.
       Sections enter with a tiny depth shift, scale settle and a soft
       focus transition. The old scale(.4) made the whole page feel like
       it was zooming from far away; this keeps the content grounded while
       still giving every section a premium reveal. Standalone transform
       properties avoid fighting with existing card transforms. */
    .scroll-section {
      opacity: 0;
      translate: 0 34px;
      scale: .985;
      filter: blur(5px);
      transition:
        opacity 900ms cubic-bezier(.16,1,.3,1),
        translate 1000ms cubic-bezier(.16,1,.3,1),
        scale 1000ms cubic-bezier(.16,1,.3,1),
        filter 900ms cubic-bezier(.16,1,.3,1);
      will-change: opacity, translate, scale, filter;
    }
    .scroll-section.active {
      opacity: 1;
      translate: 0 0;
      scale: 1;
      filter: blur(0);
    }
    @media (max-width: 768px) {
      .scroll-section {
        translate: 0 22px;
        scale: .992;
        filter: blur(3px);
        transition-duration: 760ms;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .scroll-section,
      .scroll-section.active {
        opacity: 1 !important;
        translate: 0 0 !important;
        scale: 1 !important;
        filter: none !important;
        transition: none !important;
      }
    }

    /* TIGHTER SECTION RHYTHM — the stock py-28 (7rem top+bottom = 224px
       total) plus mb-16 (4rem) under every section header stacked up into
       long stretches of near-empty scroll between sections, especially on
       phones where the content below often collapses into a single
       narrow column. Dialed back to something that still reads as
       spacious/premium but keeps content in view sooner. */
    /* SECTION SEAM GLOW — every section-to-section border was a flat,
       barely-visible 1px line sitting in an otherwise identical near-black
       background, so the gap between sections read as one long dead void
       instead of an intentional transition. A soft centered glow line adds
       a clear, premium "seam" at each boundary without changing layout. */
    section.border-t { position: relative; }
    section.border-t::before {
      content: "";
      position: absolute;
      top: -1px; left: 50%;
      width: min(560px, 70%);
      height: 1px;
      transform: translateX(-50%);
      background: linear-gradient(to right, transparent, rgba(74,36,24,0.65), rgba(192,138,82,0.55), rgba(74,36,24,0.65), transparent);
      box-shadow: 0 0 18px rgba(74,36,24,0.35);
      pointer-events: none;
      z-index: 1;
    }

    .py-28 { padding-top: 4rem; padding-bottom: 4rem; }
    .text-center.mb-16, .mb-16 { margin-bottom: 2.25rem; }
    @media (max-width: 768px) {
      .py-28 { padding-top: 2.75rem; padding-bottom: 2.75rem; }
      .text-center.mb-16, .mb-16 { margin-bottom: 1.75rem; }
    }
    /* PERFORMANCE: every decorative "always looping" animation on the page
       (flag glow, feature badges, ticker, particles...) is expensive to keep
       running when its section has scrolled off screen — that's the main
       cause of scroll jank on phones, since dozens of them were animating
       box-shadow/transform nonstop, all the time, everywhere on the page.
       Sections already toggle .active via IntersectionObserver as they enter
       /leave the viewport, so we reuse that exact signal to pause every
       looping animation inside a section the instant it's off screen, and
       resume it the instant it's back — free perf win, zero visual change. */
    .scroll-section:not(.active) *,
    .scroll-section:not(.active) *::before,
    .scroll-section:not(.active) *::after {
      animation-play-state: paused !important;
    }

    /* RIGHT TO LEFT INFINITE AUTO SCROLL TICKER & CENTER POP-UP ANIMATION */
    @keyframes tickerRightToLeft {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    @keyframes centerPopupPulse {
      0%, 100% {
        transform: scale(1) translateY(0);
        border-color: rgba(74,36,24, 0.6);
        box-shadow: 0 0 30px rgba(74,36,24, 0.3), inset 0 0 20px rgba(191,130,86, 0.1);
      }
      50% {
        transform: scale(1.06) translateY(-8px);
        border-color: rgba(191,130,86, 1);
        box-shadow: 0 0 50px rgba(191,130,86, 0.8), inset 0 0 30px rgba(74,36,24, 0.3);
      }
    }

    .ticker-track {
      display: flex;
      gap: 1.5rem;
      width: max-content;
      animation: tickerRightToLeft 45s linear infinite;
    }

    .ticker-track:hover {
      animation-play-state: paused;
    }

    .featured-pop-card {
      animation: centerPopupPulse 4s ease-in-out infinite;
      z-index: 20;
    }

    /* ============ FAN CAROUSEL — swipeable card slider with a pink
       "active" center card and grayscale side cards, used for the
       showcase-style sections below the hero. Mobile-first: snap
       scrolling gives a native, thumb-friendly swipe on phones. ============ */
    .fan-carousel { position: relative; padding: 8px 0 0; perspective: 1000px; overflow-x: hidden; }
    .fan-track {
      position: relative;
      width: 100%;
      transform-style: preserve-3d;
      cursor: grab;
      will-change: transform;
      touch-action: pan-y;
      user-select: none;
    }
    .fan-track.is-dragging { cursor: grabbing; }
    .fan-track.is-snapping { transition: transform .42s cubic-bezier(.22,1,.36,1); }
    /* While a finger/mouse is actively holding the drag, the active card
       flips (is-active toggles) every time the ring crosses a new card
       into "front" position. Left as-is, each flip still plays the full
       .5s scale/opacity/filter transition below, so a slow manual drag
       feels like it's fighting a queue of half-finished animations
       instead of tracking the hand 1:1. Arrow taps and post-release
       flicks only trigger ONE flip, so that .5s transition reads as an
       intentional snap there — it's only the continuous mid-drag case
       that needed instant (no-transition) card updates. */
    .fan-carousel .fan-track.is-dragging .fan-card {
      transition: none !important;
    }
    .fan-card {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 52vw;
      max-width: 210px;
      border-radius: 22px;
      overflow: hidden;
      cursor: pointer;
      background: #0a0306;
      border: 1px solid rgba(255,255,255,0.08);
      filter: grayscale(1) brightness(.5);
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) scale(.86);
      opacity: .55;
      backface-visibility: hidden;
      transition: filter .5s ease, opacity .5s ease, border-color .5s ease, box-shadow .5s ease, transform .5s cubic-bezier(.22,1,.36,1);
      will-change: transform, filter;
    }
    @media (min-width: 640px) { .fan-card { width: 240px; } }
    /* The site-wide scroll-reveal system (.modern-card-reveal /
       .modern-reveal-in, see styles.css "Modern scroll reveal") also
       targets .fan-card and sets transform/opacity with !important,
       which would otherwise wipe out the rotateY/translateZ placement
       below once a card scrolls into view. This higher-specificity
       !important rule keeps the 3D orbit position in control while
       still letting that system fade the carousel in on scroll. */
    .fan-carousel .fan-track .fan-card {
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) scale(.86) !important;
      opacity: .55 !important;
      transition: filter .5s ease, opacity .5s ease, border-color .5s ease, box-shadow .5s ease, transform .5s cubic-bezier(.22,1,.36,1) !important;
    }
    .fan-carousel .fan-track .fan-card.is-active {
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) scale(1) !important;
      opacity: 1 !important;
    }
    .fan-card .fan-media {
      position: relative;
      width: 100%;
      aspect-ratio: 3 / 4;
      overflow: hidden;
      background: #000;
    }
    .fan-card .fan-media img,
    .fan-card .fan-media video,
    .fan-card .fan-media iframe {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      border: 0;
      pointer-events: none;
    }
    .fan-card .fan-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.15) 45%, transparent 70%);
      pointer-events: none;
    }
    .fan-card .fan-panel {
      position: absolute; left: 0; right: 0; bottom: 0;
      padding: 16px 16px 18px;
      opacity: 0;
      transform: translateY(10px);
      transition: opacity .4s ease .05s, transform .4s ease .05s;
    }
    .fan-card .fan-tag {
      display: inline-block;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: .15em;
      text-transform: uppercase;
      color: #fff;
      background: rgba(255,255,255,0.14);
      border: 1px solid rgba(255,255,255,0.22);
      backdrop-filter: blur(12px) saturate(170%);
      -webkit-backdrop-filter: blur(12px) saturate(170%);
      padding: 4px 9px;
      border-radius: 999px;
      position: absolute;
      top: 12px;
      left: 12px;
    }
    .fan-card .fan-title {
      font-family: 'Game Of Squids', 'Playfair Display', serif;
      color: #fff;
      font-weight: 800;
      font-size: 15px;
      line-height: 1.25;
      margin-bottom: 4px;
    }
    .fan-card .fan-sub {
      color: rgba(255,255,255,.85);
      font-size: 11px;
      line-height: 1.4;
      margin-bottom: 10px;
    }
    .fan-card .fan-go {
      width: 34px; height: 34px;
      border-radius: 999px;
      background: #fff;
      color: #0a0306;
      display: flex; align-items: center; justify-content: center;
      font-weight: 900;
      font-size: 15px;
      box-shadow: 0 6px 18px rgba(0,0,0,.35);
    }
    .fan-card .fan-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-top: 2px;
    }
    .fan-card .fan-price {
      color: #D9BD98;
      font-weight: 900;
      font-size: 14px;
      letter-spacing: .01em;
      font-family: 'Game Of Squids', 'Playfair Display', serif;
    }
    .fan-card .reserve-btn.cart-add-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border: none;
      background: #fff;
      color: #0a0306;
      font-weight: 900;
      font-size: 11px;
      letter-spacing: .06em;
      text-transform: uppercase;
      padding: 8px 14px;
      border-radius: 999px;
      box-shadow: 0 6px 18px rgba(0,0,0,.35);
      min-height: 34px;
    }
    .fan-card .cart-add-btn .arrow { display: inline-block; transition: transform .35s cubic-bezier(.16,1,.3,1); }
    .fan-card .cart-add-btn:hover .arrow { transform: translateX(4px); }
    .fan-card .cart-add-btn.is-added { background: #4A2418; color: #fff; }
    @media (max-width: 480px) {
      .fan-card .fan-price { font-size: 13px; }
      .fan-card .reserve-btn.cart-add-btn { padding: 7px 12px; font-size: 10px; }
    }
    /* Active (centered) card: full color, pink glow, content revealed */
    .fan-card.is-active {
      filter: none;
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) scale(1);
      opacity: 1;
      border-color: rgba(74,36,24,.7);
      box-shadow: 0 25px 60px -10px rgba(74,36,24,.55), 0 0 0 1px rgba(74,36,24,.3) inset;
      z-index: 5;
    }
    .fan-card.is-active .fan-overlay {
      background: linear-gradient(to top, rgba(53,24,15,.92) 0%, rgba(74,36,24,.35) 45%, rgba(74,36,24,.08) 75%);
    }
    .fan-card.is-active .fan-panel {
      opacity: 1;
      transform: translateY(0);
    }
    /* Selected card: subtle lift + premium glow. Only the centered card gets this. */
    .fan-carousel .fan-track .fan-card.is-active {
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) translateY(-8px) scale(1.035) !important;
      border-color: rgba(191,130,86,.82);
      box-shadow:
        0 22px 55px -14px rgba(74,36,24,.72),
        0 0 24px rgba(191,130,86,.24),
        0 0 0 1px rgba(191,130,86,.22) inset,
        0 0 42px rgba(74,36,24,.18);
    }
    .fan-carousel .fan-track.is-dragging .fan-card.is-active {
      transform: translate(-50%, -50%) rotateY(var(--fan-angle, 0deg)) translateZ(var(--fan-radius, 260px)) translateY(-5px) scale(1.02) !important;
      box-shadow:
        0 18px 42px -14px rgba(74,36,24,.58),
        0 0 18px rgba(191,130,86,.18);
    }
    @media (prefers-reduced-motion: reduce) {
      .fan-carousel .fan-track .fan-card { transition-duration: .01ms !important; }
    }
    .fan-nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 22px;
      margin-top: 6px;
    }
    .fan-arrow {
      width: 42px; height: 42px;
      border-radius: 999px;
      display: flex; align-items: center; justify-content: center;
      font-size: 16px;
      font-weight: 900;
      cursor: pointer;
      border: 1px solid rgba(255,255,255,.25);
      background: rgba(255,255,255,.08);
      color: #fff;
      transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
      -webkit-tap-highlight-color: transparent;
      user-select: none;
    }
    .fan-arrow.fan-next {
      background: linear-gradient(135deg, #4A2418, #A8432E);
      border-color: transparent;
      box-shadow: 0 8px 22px rgba(74,36,24,.5);
    }
    .fan-arrow:active { transform: scale(.92); }
    .fan-dots {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 7px;
    }
    .fan-dot {
      width: 6px; height: 6px;
      border-radius: 999px;
      background: rgba(255,255,255,.25);
      transition: all .3s ease;
      cursor: pointer;
    }
    .fan-dot.is-active {
      width: 20px;
      background: linear-gradient(90deg, #4A2418, #A8432E);
    }

    /* ============ FAN-ART — premium illustrated poster used inside a
       fan-card in place of video: dark plate + drifting aurora glow +
       a floating glow-medallion icon + fine texture + a diagonal sheen
       sweep, all pure CSS so every card gets a unique, on-brand "photo"
       without loading any external image. ============ */
    .fan-card .fan-art {
      position: absolute; inset: 0;
      background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,0.05), transparent 55%),
        radial-gradient(ellipse at 50% 25%, #1c0c14 0%, #0a0306 72%);
      overflow: hidden;
    }
    .fan-card .fan-art-texture {
      position: absolute; inset: 0;
      background-image: radial-gradient(rgba(255,255,255,0.07) 1px, transparent 1px);
      background-size: 14px 14px;
      opacity: 0.35;
      mix-blend-mode: overlay;
    }
    .fan-card .fan-art-glow {
      position: absolute; inset: -20%;
      background:
        radial-gradient(ellipse 55% 45% at 28% 100%, var(--a1, #4A2418) 0%, transparent 60%),
        radial-gradient(ellipse 55% 42% at 76% 92%, var(--a2, #A8432E) 0%, transparent 58%),
        radial-gradient(ellipse 70% 50% at 50% 68%, var(--a3, #C08A52) 0%, transparent 65%);
      filter: blur(30px) saturate(170%);
      opacity: 0.55;
      mix-blend-mode: screen;
      animation: auroraDrift 16s ease-in-out infinite;
    }
    .fan-card .fan-art-ring {
      position: absolute; top: 42%; left: 50%;
      width: 118px; height: 118px;
      margin: -59px 0 0 -59px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,0.14);
    }
    .fan-card .fan-art-badge {
      --glow: #4A2418;
      position: absolute; top: 42%; left: 50%;
      width: 92px; height: 92px;
      margin: -46px 0 0 -46px;
      border-radius: 999px;
      display: flex; align-items: center; justify-content: center;
      font-size: 42px;
      background: radial-gradient(circle at 35% 30%, rgba(255,255,255,0.14), rgba(0,0,0,0.45) 72%);
      border: 1px solid rgba(255,255,255,0.18);
      box-shadow: 0 0 40px color-mix(in srgb, var(--glow) 55%, transparent), inset 0 1px 0 rgba(255,255,255,0.2);
      animation: glowBadgeFloat 5s ease-in-out infinite;
    }
    .fan-card .fan-art-badge::before {
      content: "";
      position: absolute; inset: -45%;
      background: radial-gradient(circle, color-mix(in srgb, var(--glow) 60%, transparent) 0%, transparent 70%);
      filter: blur(16px);
      z-index: -1;
      animation: glowBadgePulse 4.5s ease-in-out infinite;
    }
    .fan-card .fan-art-badge span {
      filter: drop-shadow(0 0 10px color-mix(in srgb, var(--glow) 80%, transparent)) drop-shadow(0 0 22px color-mix(in srgb, var(--glow) 45%, transparent));
    }
    .fan-card .fan-art-badge .fan-icon {
      display: flex; align-items: center; justify-content: center;
      width: 40px; height: 40px;
      color: #fdf6ec;
    }
    .fan-card .fan-art-badge .fan-icon svg {
      width: 100%; height: 100%;
    }
    .fan-card .fan-art-sheen {
      position: absolute; top: 0; left: 0;
      width: 30%; height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.14), transparent);
      animation: badgeSheen 6s ease-in-out infinite;
      pointer-events: none;
    }
    @media (prefers-reduced-motion: reduce) {
      .fan-card .fan-art-glow, .fan-card .fan-art-badge, .fan-card .fan-art-badge::before, .fan-card .fan-art-sheen { animation: none; }
    }

    /* CONTACT — INSTAGRAM PULSE ICON */
    @keyframes igPulseGlow {
      0%, 100% { box-shadow: 0 0 20px rgba(74,36,24, 0.35), 0 0 20px rgba(74,36,24, 0.25); }
      50% { box-shadow: 0 0 40px rgba(74,36,24, 0.7), 0 0 35px rgba(74,36,24, 0.5); }
    }
    .ig-glow-icon {
      animation: igPulseGlow 3s ease-in-out infinite;
    }

    /* ─── PREMIUM POLISH LAYER ───────────────────────────────
       Additive refinements only — nothing above is touched.
       Goal: subtler grain/depth, calmer glows, crisper hovers,
       so the whole site reads as a high-end, expensive build. */

    /* Subtle film-grain texture — adds tactile depth instead of flat black */
    #grain-overlay {
      position: fixed;
      inset: 0;
      z-index: 40;
      pointer-events: none;
      opacity: 0.035;
      mix-blend-mode: overlay;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    }
    @media (max-width: 768px) { #grain-overlay { display: none; } }

    /* Cinematic vignette at the screen edges */
    #vignette-overlay {
      position: fixed;
      inset: 0;
      z-index: 39;
      pointer-events: none;
      background: radial-gradient(ellipse at center, transparent 55%, rgba(0,0,0,0.55) 100%);
    }

    /* Thin gold scroll-progress line — a small, quiet luxury-site signature */
    #scroll-progress {
      position: fixed;
      top: 0; left: 0;
      height: 2px;
      width: 0%;
      z-index: 10000;
      background: linear-gradient(90deg, #35180F, #A8432E, #35180F);
      box-shadow: 0 0 12px rgba(168,67,46,0.7);
      transition: width 0.1s linear;
    }

    /* Crisper, more restrained card hover — less garish, more "expensive" */
    .pro-glass-card {
      transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1),
                  border-color 0.6s cubic-bezier(0.19, 1, 0.22, 1),
                  box-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    }

    /* Buttons: subtle lift + brighten instead of a hard scale-pop */
    .video-perspective-box video,
    button {
      transition: transform 0.35s cubic-bezier(0.19, 1, 0.22, 1),
                  box-shadow 0.35s cubic-bezier(0.19, 1, 0.22, 1),
                  filter 0.35s ease;
    }
    button:hover {
      filter: brightness(1.08);
    }
    /* Premium glow for gradient CTA buttons — matches the site's pink
       palette, adds the soft "backlit" glow real high-end product sites use
       on primary actions. Targets any button using the gradient utility
       classes, so it reaches every CTA across every section automatically. */
    button[class*="bg-gradient-to-r"]:hover,
    button[class*="bg-gradient-to-tr"]:hover {
      box-shadow: 0 8px 30px rgba(74,36,24, 0.55), 0 2px 10px rgba(168,67,46, 0.35);
    }

    /* Slightly calmer, more premium glow intensity across the gaudiest shadows */
    .gold-shimmer-text { animation-duration: 7s; }

    /* Refined section seams — a soft gradient hairline instead of a flat border */
    section.border-t { position: relative; border-top-color: transparent !important; }
    section.border-t::before {
      content: '';
      position: absolute;
      top: 0; left: 10%; right: 10%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(53,24,15,0.5), rgba(168,67,46,0.5), rgba(53,24,15,0.5), transparent);
    }

    /* Selection color feels more intentional than the browser default */
    ::selection { background: rgba(168,67,46,0.35); color: #fff; }

    /* FAQ accordion: hide native <summary> marker triangles cross-browser */
    #faq summary::-webkit-details-marker { display: none; }
    #faq summary { list-style: none; }
    #faq details[open] summary { margin-bottom: 4px; }
  

/* ---- next style block ---- */


    /* ─── Base resets ─── */
    *, *::before, *::after { box-sizing: border-box; }
    html, body { max-width: 100vw; overflow-x: hidden; }
    img, video, canvas { max-width: 100%; height: auto; }

    /* ─── Sections ─── */
    section { width: 100%; padding-left: 1rem; padding-right: 1rem; }

    /* ─── Flag ticker responsive ─── */
    @media (max-width: 480px) {
      .flag-3d-card { width: 90px !important; height: 108px !important; border-radius: 14px !important; }
      .flag-img-wrap { width: 62px !important; height: 42px !important; }
      .flag-label    { font-size: 7.5px !important; }
    }

    /* ─── Ticker overflow safety ─── */
    .flag-ticker-track { overflow: visible; }
    .relative.w-full.overflow-hidden { overflow: hidden !important; }

    /* ─── Videos: always fill their container ─── */
    video { display: block; width: 100%; height: auto; object-fit: cover; }

    /* Old horizontal-scroll / hamburger nav rules removed — the new
       .trc-nav sizes itself with clamp()/vw so every icon fits and stays
       visible on phones (see the .trc-nav block above). */

    /* ─── Hero section ─── */
    @media (max-width: 640px) {
      #home { padding-top: 100px !important; }
    }

    /* ─── Product cards grid ─── */
    @media (max-width: 640px) {
      .grid.grid-cols-1.md\:grid-cols-3 > div,
      .grid.grid-cols-1.md\:grid-cols-3 { gap: 1rem !important; }
    }

    /* ─── CEO section photo ─── */
    @media (max-width: 768px) {
      .w-72 { width: 100% !important; max-width: 260px !important; }
      .h-80, .sm\:h-96 { height: 300px !important; }
    }

    /* ─── Reviews ticker cards ─── */
    @media (max-width: 480px) {
      .ticker-track > div { width: 260px !important; }
    }

    /* ─── Global export video container ─── */
    #global-export .max-w-5xl video {
      width: 100% !important;
      height: auto !important;
      max-height: 60vw;
      object-fit: contain !important;
    }

    /* ─── Text scale ─── */
    @media (max-width: 480px) {
      .text-3xl  { font-size: 1.5rem !important; }
      .text-4xl  { font-size: 1.8rem !important; }
      .text-5xl  { font-size: 2rem   !important; }
    }

    /* ─── Stat cards ─── */
    @media (max-width: 480px) {
      .pro-glass-card .text-3xl,
      .pro-glass-card .text-4xl { font-size: 1.5rem !important; }
    }

    /* ─── Baby chick widget: smaller + lifted higher on mobile ─── */
    @media (max-width: 640px) {
      #chick-widget { bottom: 90px !important; }
      #chick-bubble { padding: 4px 7px !important; }
      #chick-bubble div:first-child { font-size: 6.5px !important; }
      #chick-bubble #chick-text    { font-size: 9px   !important; }
      #chick-canvas { width: 75px  !important; height: 75px !important; }
    }

    /* ─── Heritage (about) flex column on mobile ─── */
    @media (max-width: 768px) {
      .flex.flex-col.md\:flex-row { flex-direction: column !important; }
      .w-full.md\:w-1\/2 { width: 100% !important; }
    }

    /* ─── Contact cards ─── */
    @media (max-width: 480px) {
      .grid.grid-cols-1.sm\:grid-cols-3 { grid-template-columns: 1fr !important; gap: 1rem !important; }
    }

    /* ─── Lightweight tinted background layer stays behind content ─── */
    #canvas3d-container { z-index: -1 !important; }

    /* ─── Prevent horizontal scroll globally ─── */
    .scroll-section { max-width: 100vw; overflow-x: hidden; }

    /* ─── MOBILE PERFORMANCE TUNING ───
       The old WebGL particle background was the real cause of scroll jank on
       phones. It's gone now, so the 3D perspective scroll-reveal can run on
       mobile too — just with a shorter throw and smaller angle than desktop,
       which keeps it feeling like real 3D while staying cheap for phone GPUs. */
    @media (max-width: 768px) {
      .scroll-section {
        transform: scale(0.3) !important;
        transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
                    transform 0.85s cubic-bezier(0.16, 1, 0.3, 1) !important;
      }
      .scroll-section.active {
        transform: scale(1) !important;
      }
      /* This is a repeatable transform+opacity toggle (not a continuous
         loop like the flagged box-shadow/background-position animations
         elsewhere) — cheap to keep replaying every pass even on budget
         phone GPUs since only compositor-friendly properties are used. */
      @media (prefers-reduced-motion: reduce) {
        .scroll-section {
          transform: none !important;
          transition: opacity 0.4s ease !important;
        }
      }
      /* Big ambient glow blurs are very GPU-heavy on mobile - drop them almost entirely */
      .blur-\[150px\] { filter: blur(40px) !important; }
      .blur-\[180px\] { filter: blur(40px) !important; }
      .backdrop-blur-3xl { backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; }
      .backdrop-blur-xl { backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; }

      /* NOTE: content-visibility:auto + a fixed contain-intrinsic-size was
         removed here — it forced every section (hero, products, about, CEO,
         reviews, etc.) to reserve a flat 800px placeholder height while
         off-screen. Real sections are taller or shorter than 800px, so this
         created large blank gaps between sections on phones. Removing it
         fixes the gap; the "paint only near viewport" perf trick wasn't
         worth the layout bug. */

      /* Animating box-shadow / border-color forces a full repaint every
         frame — transform, opacity and filter don't, because the GPU can
         composite those without asking the CPU to redraw anything. With
         ~30 flag cards + a handful of feature badges all pulsing box-shadow
         at once, that repaint cost (not the pretty motion itself) was the
         actual source of scroll lag on phones. So on mobile only: keep every
         float / rotate / sheen / opacity animation exactly as designed
         (all cheap, all GPU-composited) and drop just the box-shadow pulses.
         Desktop keeps the full effect since phone-grade GPUs aren't the
         constraint there. .elite-nav-box is intentionally left alone even
         here — it's a single element, negligible cost either way. */
      .flag-3d-card { animation: flagFloat 3s ease-in-out infinite !important; }

      /* ─── MOBILE SMOOTHNESS FIX (keeps the original look) ───
         66 .aurora-blob elements + 33 .gold-shimmer-text elements were each
         individually animating (blurred, screen-blended, continuously
         repainting) at the same time — even the ones scrolled way off
         screen. That's ~99 layers of simultaneous GPU work, which is what
         caused the stutter on phones. Instead of turning the effect off,
         it's paused by default and only resumes for the handful currently
         in or near the viewport (via IntersectionObserver below) — so it
         looks and moves exactly like the original, just never more than a
         few are animating at once instead of all 99. */
      .aurora-blob, .gold-shimmer-text {
        animation-play-state: paused;
      }
      .aurora-blob.anim-active, .gold-shimmer-text.anim-active {
        animation-play-state: running;
      }
    }
  

/* ---- next style block ---- */


    /* ─── Extra professional / smooth-mobile polish ───
       Purely additive refinements — nothing above is removed. */
    @media (max-width: 480px) {
      /* Tighter, calmer letter-spacing reads cleaner on small screens */
      .tracking-\[0\.15em\]  { letter-spacing: 0.06em !important; }
      .tracking-\[0\.2em\]   { letter-spacing: 0.08em !important; }
      .tracking-\[0\.25em\]  { letter-spacing: 0.1em  !important; }
      .tracking-\[0\.3em\]   { letter-spacing: 0.12em !important; }
      .tracking-\[0\.4em\]   { letter-spacing: 0.15em !important; }
      /* Section padding feels tighter/cleaner on phones */
      section.py-28 { padding-top: 2.25rem !important; padding-bottom: 2.25rem !important; }
    }

    /* Comfortable, reliably-tappable buttons/links on touch devices */
    @media (max-width: 768px) {
      button, a.trc-nav-link { min-height: 40px; }
      section#products button, section#products a { min-height: 44px; }
    }

    /* Avoid the grey tap-flash + accidental text selection on buttons (feels more native/app-like) */
    button, a { -webkit-tap-highlight-color: transparent; }

    /* Smoother native scrolling on iOS Safari */
    html, body { -webkit-overflow-scrolling: touch; }

  

/* ---- next style block ---- */


    /* Old hamburger + dropdown glass panel removed — every icon in the new
       .trc-nav is visible at once on mobile, so no hidden menu is needed. */
  

/* ---- next style block ---- */


    /* ═══ CART SYSTEM: toggle badge, overlay, and slide-in drawer ═══
       Desktop: fixed panel sliding in from the right.
       Mobile (<=768px): bottom sheet sliding up, capped at 85vh so it
       never fights with the safe-area / address-bar chrome. */
    #cart-overlay {
      position: fixed; inset: 0; z-index: 10000;
      background: rgba(0,0,0,0.6);
      opacity: 0; pointer-events: none;
      transition: opacity 0.3s ease;
    }
    #cart-overlay.visible { opacity: 1; pointer-events: auto; }

    #cart-drawer {
      position: fixed;
      top: 0; right: 0; bottom: 0;
      width: min(400px, 92vw);
      z-index: 10001;
      background: rgba(9,3,6,0.97);
      backdrop-filter: blur(28px) saturate(190%);
      -webkit-backdrop-filter: blur(28px) saturate(190%);
      border-left: 1.5px solid rgba(74,36,24,0.5);
      box-shadow: -25px 0 70px rgba(0,0,0,0.6);
      display: flex;
      flex-direction: column;
      transform: translateX(100%);
      transition: transform 0.4s cubic-bezier(0.16,1,0.3,1);
      padding-top: env(safe-area-inset-top);
      padding-bottom: env(safe-area-inset-bottom);
    }
    #cart-drawer.open { transform: translateX(0); }

    .cart-drawer-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 22px 20px 16px;
      border-bottom: 1px solid rgba(74,36,24,0.25);
      flex-shrink: 0;
    }
    .cart-drawer-title {
      font-family: 'Game Of Squids', 'Playfair Display', serif;
      color: #D9BD98;
      font-weight: 900;
      font-size: 15px;
      letter-spacing: .04em;
      text-transform: uppercase;
    }
    #cart-close-btn {
      width: 34px; height: 34px; min-height: 0;
      border-radius: 999px;
      border: 1px solid rgba(168,67,46,0.4);
      background: rgba(74,36,24,0.12);
      color: #D9BD98;
      font-size: 14px;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
    }

    #cart-items-list {
      flex: 1 1 auto;
      overflow-y: auto;
      padding: 8px 20px;
      -webkit-overflow-scrolling: touch;
    }
    .cart-item-row {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 0;
      border-bottom: 1px solid rgba(255,255,255,0.08);
    }
    .cart-row-enter {
      opacity: 0;
      transform: translateX(18px);
      transition: opacity 0.45s cubic-bezier(0.16,1,0.3,1), transform 0.45s cubic-bezier(0.16,1,0.3,1);
      transition-delay: calc(var(--i, 0) * 0.06s);
    }
    .cart-row-enter.cart-row-in { opacity: 1; transform: translateX(0); }
    #cart-empty-state {
      animation: cartEmptyIn 0.5s cubic-bezier(0.16,1,0.3,1) both;
    }
    @keyframes cartEmptyIn {
      from { opacity: 0; transform: translateY(10px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .cart-item-info { flex: 1 1 auto; min-width: 0; }
    .cart-item-name {
      color: #fff; font-weight: 800; font-size: 13px;
      line-height: 1.3; margin-bottom: 2px;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .cart-item-tag { color: rgba(255,255,255,.5); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
    .cart-item-price { color: #D9BD98; font-weight: 900; font-size: 12.5px; margin-top: 4px; }
    .cart-item-qty {
      display: flex; align-items: center; gap: 8px; flex-shrink: 0;
    }
    .cart-qty-btn {
      width: 26px; height: 26px; min-height: 0;
      border-radius: 999px;
      border: 1px solid rgba(168,67,46,0.4);
      background: rgba(74,36,24,0.12);
      color: #D9BD98;
      font-weight: 900; font-size: 14px;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
    }
    .cart-qty-num { color: #fff; font-weight: 800; font-size: 13px; min-width: 16px; text-align: center; }
    .cart-remove-btn {
      flex-shrink: 0;
      color: rgba(255,255,255,.45);
      font-size: 11px;
      text-decoration: underline;
      text-underline-offset: 2px;
      cursor: pointer;
      background: none; border: none; min-height: 0; padding: 4px;
    }
    .cart-remove-btn:hover { color: #A8432E; }

    #cart-empty-state { display: none; flex: 1 1 auto; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 40px 20px; text-align: center; }
    #cart-empty-state p { color: rgba(255,255,255,.5); font-size: 13px; }
    #cart-empty-cta {
      display: inline-block;
      padding: 10px 22px;
      border-radius: 999px;
      background: rgba(74,36,24,0.15);
      border: 1px solid rgba(74,36,24,0.4);
      color: #D9BD98;
      font-weight: 800; font-size: 11px;
      text-transform: uppercase; letter-spacing: .08em;
    }
    #cart-drawer.is-empty #cart-items-list { display: none; }
    #cart-drawer.is-empty #cart-empty-state { display: flex; }
    #cart-drawer.is-empty .cart-drawer-footer { display: none; }

    .cart-drawer-footer {
      flex-shrink: 0;
      padding: 18px 20px calc(20px + env(safe-area-inset-bottom));
      border-top: 1px solid rgba(74,36,24,0.25);
      background: rgba(0,0,0,0.2);
    }
    .cart-subtotal-row {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 14px;
      color: #fff; font-weight: 800; font-size: 14px;
      text-transform: uppercase; letter-spacing: .04em;
    }
    #cart-subtotal-amount { color: #D9BD98; font-family: 'Game Of Squids', 'Playfair Display', serif; font-size: 17px; }
    #cart-checkout-btn {
      width: 100%;
      padding: 14px;
      border: none;
      border-radius: 999px;
      background: linear-gradient(90deg, #4A2418, #A8432E);
      color: #fff;
      font-weight: 900; font-size: 12.5px;
      text-transform: uppercase; letter-spacing: .08em;
      box-shadow: 0 10px 30px rgba(74,36,24,0.45);
      cursor: pointer;
      min-height: 48px;
    }
    .cart-footnote { margin-top: 10px; color: rgba(255,255,255,.4); font-size: 10.5px; text-align: center; line-height: 1.4; }

    #cart-toast {
      position: fixed;
      left: 50%;
      bottom: calc(28px + env(safe-area-inset-bottom));
      transform: translateX(-50%) translateY(20px);
      z-index: 10002;
      background: rgba(9,3,6,0.95);
      border: 1px solid rgba(74,36,24,0.5);
      color: #D9BD98;
      font-weight: 800; font-size: 12px;
      padding: 12px 22px;
      border-radius: 999px;
      box-shadow: 0 15px 40px rgba(0,0,0,0.5);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.3s ease, transform 0.3s ease;
      white-space: nowrap;
    }
    #cart-toast.visible { opacity: 1; transform: translateX(-50%) translateY(0); }

    /* Mobile: full-width bottom sheet instead of a side panel */
    @media (max-width: 768px) {
      #cart-drawer {
        top: auto; left: 0; right: 0; bottom: 0;
        width: 100%;
        max-height: 65vh;
        border-left: none;
        border-top: 1.5px solid rgba(74,36,24,0.5);
        border-radius: 22px 22px 0 0;
        transform: translateY(100%);
        box-shadow: 0 -20px 60px rgba(0,0,0,0.6);
      }
      #cart-drawer.open { transform: translateY(0); }
      #cart-toast { width: 90%; max-width: 340px; white-space: normal; text-align: center; }
    }

    @media (prefers-reduced-motion: reduce) {
      #cart-drawer, #cart-overlay, #cart-toast { transition: none; }
      .cart-row-enter { opacity: 1; transform: none; transition: none; }
      #cart-empty-state { animation: none; }
    }
  

/* ---- next style block ---- */


    /* ── Preloader ── */
    #site-preloader {
      position: fixed; inset: 0; z-index: 100000;
      background: radial-gradient(ellipse 80% 60% at 50% 50%, #140308 0%, #0a0306 70%);
      display: flex; align-items: center; justify-content: center;
      flex-direction: column; gap: 28px;
      /* Cinematic "iris" exit: the whole overlay shrinks away to a point
         instead of a flat fade — the kind of exit micro-detail luxury sites
         use instead of the default browser-loader feel. */
      clip-path: circle(150% at 50% 50%);
      transition: clip-path 1.1s cubic-bezier(0.76, 0, 0.24, 1);
    }
    #site-preloader.pre-hidden {
      clip-path: circle(0% at 50% 50%);
      pointer-events: none;
    }
    /* Faint breathing glow behind everything, so the loader doesn't feel
       like a flat black modal */
    #site-preloader::before {
      content: '';
      position: absolute; inset: 0;
      background: radial-gradient(circle 380px at 50% 50%, rgba(53,24,15,0.16), transparent 70%);
      animation: preloaderGlowBreathe 3.2s ease-in-out infinite;
    }
    @keyframes preloaderGlowBreathe {
      0%, 100% { opacity: 0.6; transform: scale(1); }
      50% { opacity: 1; transform: scale(1.08); }
    }
    /* Faint drifting circuit/grid — reads as "system booting", almost
       subliminal, never competes with the content in front of it */
    #site-preloader::after {
      content: '';
      position: absolute; inset: 0;
      background-image:
        linear-gradient(rgba(74,36,24,0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(74,36,24,0.06) 1px, transparent 1px);
      background-size: 42px 42px;
      mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 20%, transparent 75%);
      -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 20%, transparent 75%);
      animation: preloaderGridDrift 18s linear infinite;
    }
    @keyframes preloaderGridDrift { to { background-position: 42px 42px, 42px 42px; } }
    /* HUD corner brackets framing the whole loader — the "targeting frame"
       detail from sci-fi interfaces, reused here as a premium-tech motif */
    #preloader-frame { position: relative; display: flex; flex-direction: column; align-items: center; gap: 28px; padding: 56px 64px; max-height: 92vh; max-height: calc(var(--vh, 1vh) * 92); }
    @media (max-width: 480px), (max-height: 700px) {
      #preloader-frame { padding: 20px 20px; gap: 16px; }
    }
    .hud-corner {
      position: absolute; width: 22px; height: 22px;
      border-color: rgba(74,36,24,0.55);
      animation: hudCornerPulse 2.6s ease-in-out infinite;
    }
    .hud-corner.tl { top: 0; left: 0; border-top: 1.5px solid; border-left: 1.5px solid; }
    .hud-corner.tr { top: 0; right: 0; border-top: 1.5px solid; border-right: 1.5px solid; }
    .hud-corner.bl { bottom: 0; left: 0; border-bottom: 1.5px solid; border-left: 1.5px solid; }
    .hud-corner.br { bottom: 0; right: 0; border-bottom: 1.5px solid; border-right: 1.5px solid; }
    @keyframes hudCornerPulse {
      0%, 100% { opacity: 0.45; }
      50% { opacity: 1; box-shadow: 0 0 10px rgba(74,36,24,0.6); }
    }
    /* MOBILE PERF: animating background-position (grid drift) and
       box-shadow (hud-corner pulse) both force a full repaint every frame
       — unlike transform/opacity, which the GPU composites for free.
       These ran continuously for the whole preloader duration and were a
       real source of the reported lag/jank on phones. Both are purely
       decorative, so they're frozen/simplified on mobile instead of
       removed — same look, none of the repaint cost. Placed after the
       base rules above so it actually wins (same selector specificity —
       source order decides). */
    @media (max-width: 768px) {
      #site-preloader::after { animation: none; }
      .hud-corner { animation: hudCornerPulseMobile 2.6s ease-in-out infinite; }
    }
    @keyframes hudCornerPulseMobile {
      0%, 100% { opacity: 0.45; }
      50% { opacity: 1; }
    }

    /* ── PREMIUM POLISH PASS ──────────────────────────────────────────
       1) Buttons/links get touch-action:manipulation (kills the ~300ms
          tap delay some mobile browsers still add) + a quick press-scale
          on :active, since hover states don't exist on touch — this is
          what makes taps feel instant/tactile instead of laggy.
       2) The biggest decorative blurs (120–180px) are genuinely expensive
          to paint on mid/low-end phone GPUs and are a real source of
          scroll jank on longer pages. Capped lower on mobile only — same
          soft-glow look, far cheaper to render, so scrolling stays smooth.
       3) The horizontal nav-links strip gets proper momentum scrolling. */
    button, a, .cursor-pointer { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
    button:active, .hero-cta-btn:active, a.trc-nav-link:active {
      transform: scale(0.96);
      transition: transform 0.12s ease-out;
    }
    @media (max-width: 768px) {
      .blur-\[120px\], .blur-\[130px\], .blur-\[140px\] { --tw-blur: blur(55px); }
      .blur-\[150px\], .blur-\[160px\], .blur-\[180px\] { --tw-blur: blur(65px); }
    }
    @media (prefers-reduced-motion: reduce) {
      button:active, .hero-cta-btn:active, a.trc-nav-link:active { transform: none; transition: none; }
    }
    #preloader-pct-center {
      font-family: 'JetBrains Mono', 'Courier New', ui-monospace, monospace;
      font-weight: 600;
      font-size: 1rem;
      color: #fff;
      letter-spacing: 0.02em;
      text-shadow: 0 0 12px rgba(74,36,24,0.5);
    }
    #preloader-pct-center.tick { animation: preloaderDigitTick 0.15s ease-out; }
    @keyframes preloaderDigitTick {
      0% { opacity: 0.4; transform: translateY(-2px); text-shadow: 0 0 18px rgba(168,67,46,0.9); }
      100% { opacity: 1; transform: translateY(0); }
    }
    #preloader-pct-center::after {
      content: '%';
      font-size: 0.65rem;
      margin-left: 1px;
      color: rgba(255,255,255,0.5);
    }
    #preloader-word {
      font-family: 'Playfair Display', serif;
      font-weight: 900;
      letter-spacing: 0.35em;
      font-size: clamp(1.4rem, 6vw, 2.6rem);
      color: #fff;
      text-transform: uppercase;
      display: flex;
      position: relative;
    }
    #preloader-word.gold-shimmer-text span { color: transparent; }
    #preloader-word span {
      display: inline-block;
      opacity: 0;
      transform: translateY(28px) rotateX(-60deg);
      animation: preloaderLetterIn 0.7s cubic-bezier(0.16,1,0.3,1) forwards;
    }
    @keyframes preloaderLetterIn { to { opacity: 1; transform: translateY(0) rotateX(0deg); } }
    /* One-time RGB-split "glitch" flourish the instant the full wordmark
       lands and goes shimmer — a quick high-tech flicker, not a loop */
    #preloader-word.glitch-once { animation: preloaderGlitch 0.4s steps(2, end) 1; }
    @keyframes preloaderGlitch {
      0% { text-shadow: 0 0 0 transparent; transform: translateX(0); }
      20% { text-shadow: -2px 0 #A8432E, 2px 0 #A8432E; transform: translateX(-1px); }
      40% { text-shadow: 2px 0 #A8432E, -2px 0 #A8432E; transform: translateX(1px); }
      60% { text-shadow: -1px 0 #A8432E, 1px 0 #A8432E; transform: translateX(-1px); }
      100% { text-shadow: 0 0 0 transparent; transform: translateX(0); }
    }
    /* Cycling status line — the "Verifying… / Curating… / Finalizing…"
       micro-copy that exclusive/invite-only brands use instead of a bare
       percentage, so the wait itself reads as part of the premium ritual. */
    #preloader-status {
      font-family: 'JetBrains Mono', 'Courier New', ui-monospace, monospace;
      font-size: 10px; letter-spacing: 0.25em; color: rgba(139,213,202,0.7);
      font-weight: 600; text-transform: uppercase;
      height: 14px;
      position: relative;
      width: 280px;
      text-align: center;
    }
    #preloader-status span {
      position: absolute; left: 0; right: 0;
      opacity: 0;
      transform: translateY(6px);
      transition: opacity 0.5s ease, transform 0.5s ease;
    }
    #preloader-status span.active { opacity: 1; transform: translateY(0); }
    #preloader-status span.active::after {
      content: '_';
      animation: preloaderCursorBlink 1s step-end infinite;
    }
    @keyframes preloaderCursorBlink { 50% { opacity: 0; } }
    #preloader-bar-track {
      width: 200px; height: 1.5px; border-radius: 2px;
      background: rgba(255,255,255,0.1); overflow: hidden;
    }
    #preloader-bar-fill {
      height: 100%; width: 0%;
      background: linear-gradient(90deg, #35180F, #A8432E, #C08A52);
      background-size: 250% auto;
      box-shadow: 0 0 12px rgba(168,67,46,0.8);
      transition: width 0.3s ease-out;
    }

    /* ── Custom cursor (desktop, fine pointer only — enabled via JS by adding
         .has-custom-cursor to <html>) ── */
    html.has-custom-cursor, html.has-custom-cursor * { cursor: none !important; }
    #cursor-dot, #cursor-ring {
      position: fixed; top: 0; left: 0; z-index: 99998;
      pointer-events: none; border-radius: 50%;
      transform: translate(-50%, -50%);
      will-change: transform;
    }
    #cursor-dot {
      width: 6px; height: 6px; background: #fff;
      box-shadow: 0 0 8px rgba(255,255,255,0.9);
    }
    #cursor-ring {
      width: 34px; height: 34px;
      border: 1.5px solid rgba(74,36,24,0.75);
      box-shadow: 0 0 18px rgba(74,36,24,0.35);
      transition: width 0.28s cubic-bezier(0.16,1,0.3,1), height 0.28s cubic-bezier(0.16,1,0.3,1),
                  border-color 0.28s ease, background 0.28s ease;
    }
    #cursor-ring.cursor-hover {
      width: 58px; height: 58px;
      background: rgba(74,36,24,0.12);
      border-color: rgba(168,67,46,0.9);
    }
    @media (hover: none), (pointer: coarse) {
      #cursor-dot, #cursor-ring { display: none !important; }
    }

    /* ── Ambient cursor glow — a soft light that drifts toward the pointer,
         sits just above the video background for extra depth ── */
    #cursor-glow {
      position: fixed; top: 0; left: 0; z-index: 0;
      width: 480px; height: 480px; margin: -240px 0 0 -240px;
      border-radius: 50%; pointer-events: none;
      background: radial-gradient(circle, rgba(74,36,24,0.16), transparent 70%);
      filter: blur(10px);
      will-change: transform;
    }
    @media (hover: none), (pointer: coarse) { #cursor-glow { display: none !important; } }

    /* ── Magnetic buttons ── */
    .magnetic { will-change: transform; transition: transform 0.25s cubic-bezier(0.16,1,0.3,1); }

    /* ── 3D tilt on premium cards ── */
    .pro-glass-card { transform-style: preserve-3d; }

    /* ── Hero letter reveal ── */
    .hero-letters { display: inline-block; }
    .hero-letters span {
      display: inline-block;
      opacity: 0;
      transform: translateY(40px) rotateX(-70deg);
      animation: heroLetterIn 0.85s cubic-bezier(0.16,1,0.3,1) forwards;
    }
    @keyframes heroLetterIn { to { opacity: 1; transform: translateY(0) rotateX(0deg); } }

    /* ── Premium word reveal for section headings ── */
    .reveal-words span {
      display: inline-block;
      opacity: 0;
      translate: 0 .55em;
      scale: .985;
      filter: blur(5px);
      transition:
        opacity 700ms cubic-bezier(.16,1,.3,1),
        translate 800ms cubic-bezier(.16,1,.3,1),
        scale 800ms cubic-bezier(.16,1,.3,1),
        filter 700ms cubic-bezier(.16,1,.3,1);
    }
    .reveal-words.in-view span {
      opacity: 1;
      translate: 0 0;
      scale: 1;
      filter: blur(0);
    }

    /* ── Premium staggered reveal for cards, badges, grids and FAQ rows.
         Uses compositor-friendly individual transform properties so an
         existing card transform is not overwritten. ── */
    .reveal-up {
      opacity: 0;
      translate: 0 30px;
      scale: .975;
      filter: blur(4px);
      transition:
        opacity 720ms cubic-bezier(.16,1,.3,1),
        translate 820ms cubic-bezier(.16,1,.3,1),
        scale 820ms cubic-bezier(.16,1,.3,1),
        filter 720ms cubic-bezier(.16,1,.3,1);
      transition-delay: calc(var(--d, 0) * 75ms);
      will-change: opacity, translate, scale, filter;
    }
    .reveal-up.in-view {
      opacity: 1;
      translate: 0 0;
      scale: 1;
      filter: blur(0);
    }

    /* ── "POP UP" ON SCROLL for every video / cover / description / info
         card (product cards, the about/CEO video frames, testimonial &
         contact cards, etc). Lightly lifts up as it enters the screen and
         settles back to its resting position the instant it leaves —
         repeats every single time, both directions, forever (not a
         one-time reveal like .reveal-up above).
         Uses the standalone CSS `translate` property (not `transform`) on
         purpose: several cards already carry Tailwind transform utilities
         of their own (e.g. the featured contact card's md:scale-110
         md:-translate-y-3). `translate` composes independently alongside
         `transform` in every modern browser, so this never fights with or
         overwrites those. ── */
    .pop-lift {
      translate: 0 0;
      transition: translate 0.55s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .pop-lift.lifted { translate: 0 -10px; }
    @media (prefers-reduced-motion: reduce) {
      .pop-lift { transition: none !important; translate: 0 0 !important; }
    }

    @media (prefers-reduced-motion: reduce) {
      #site-preloader { display: none !important; }
      #cursor-dot, #cursor-ring, #cursor-glow { display: none !important; }
      html.has-custom-cursor, html.has-custom-cursor * { cursor: auto !important; }
      .hero-letters span, #preloader-word span { opacity: 1 !important; transform: none !important; animation: none !important; }
      .reveal-words span { opacity: 1 !important; translate: 0 0 !important; scale: 1 !important; filter: none !important; transition: none !important; }
      .reveal-up { opacity: 1 !important; translate: 0 0 !important; scale: 1 !important; filter: none !important; transition: none !important; }
    }

    /* ================= GLOW ICON BADGE (universal) =================
       Reusable "floating neon icon" treatment used for every emoji/logo
       glyph across the site: a soft colored light bleeding out behind
       the glyph, a dark rounded plate underneath, gentle float + pulse.
       Set --glow to any accent color per instance. */
    .glow-icon-badge {
      --glow: #4A2418;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      isolation: isolate;
      animation: glowBadgeFloat 5s ease-in-out infinite;
    }
    .glow-icon-badge::before {
      content: "";
      position: absolute;
      inset: -35%;
      background: radial-gradient(circle, color-mix(in srgb, var(--glow) 65%, transparent) 0%, color-mix(in srgb, var(--glow) 25%, transparent) 45%, transparent 72%);
      filter: blur(14px);
      z-index: -1;
      animation: glowBadgePulse 4.5s ease-in-out infinite;
    }
    .glow-icon-badge .glow-icon-glyph {
      position: relative;
      filter: drop-shadow(0 0 10px color-mix(in srgb, var(--glow) 80%, transparent)) drop-shadow(0 0 22px color-mix(in srgb, var(--glow) 45%, transparent));
    }
    @keyframes glowBadgeFloat {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-5px); }
    }
    @keyframes glowBadgePulse {
      0%, 100% { opacity: 0.75; transform: scale(1); }
      50% { opacity: 1; transform: scale(1.08); }
    }
    /* Featured / center variant — larger glow, used for the emphasized
       card in a row (mirrors a "hero" item among peers). */
    .glow-icon-badge.glow-icon-featured::before { inset: -55%; filter: blur(22px); }
    .glow-icon-badge.glow-icon-featured .glow-icon-glyph {
      filter: drop-shadow(0 0 16px color-mix(in srgb, var(--glow) 85%, transparent)) drop-shadow(0 0 34px color-mix(in srgb, var(--glow) 55%, transparent));
    }
    @media (prefers-reduced-motion: reduce) {
      .glow-icon-badge, .glow-icon-badge::before { animation: none !important; }
    }
  

/* ---- next style block ---- */


    .hero-seq {
      position: relative;
      height: 100vh;
      height: 100svh;
      background: #000;
      overflow: visible;
    }
    .hero-sticky {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      height: 100vh;
      height: 100svh;
      width: 100%;
      overflow: hidden;
      background: #000;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 2;
    }
    .hero-video-container {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #000;
      z-index: 1;
      overflow: hidden;
    }
    .hero-video-wrapper-916 {
      position: relative;
      width: 100%;
      height: 100%;
      max-height: 100vh;
      max-width: calc(100vh * 9 / 16);
      aspect-ratio: 9 / 16;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      box-shadow: 0 0 60px rgba(74,36,24, 0.35);
      border: 1px solid rgba(74,36,24, 0.25);
      border-radius: 16px;
    }
    .hero-video-media,
    .hero-video-iframe {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: translate(-50%, -50%);
      border: none;
      display: block;
      z-index: 2;
    }
    /* The hero video is now a Cloudinary player iframe. pointer-events:none
       is the key fix for "touch = video stutters/pauses": every tap, swipe
       or scroll on the hero now passes straight through to the page (which
       owns the scroll-lock), instead of being intercepted by the embedded
       player itself. */
    .hero-video-iframe {
      pointer-events: none;
      background: #000;
      opacity: 0;
      transition: opacity 0.6s ease;
    }
    .hero-video-iframe.is-loaded {
      opacity: 1;
    }
    @media (max-width: 768px) {
      .hero-video-wrapper-916 {
        width: 100vw;
        height: 100vh;
        max-width: 100vw;
        max-height: 100vh;
        border-radius: 0;
        border: none;
        box-shadow: none;
      }
    }
    .hero-seq-veil {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(120% 80% at 50% 0%, rgba(0,0,0,0.72), rgba(0,0,0,0) 55%),
        linear-gradient(to top, rgba(0,0,0,0.94) 0%, rgba(0,0,0,0.58) 30%, rgba(0,0,0,0.1) 58%, rgba(0,0,0,0.46) 100%),
        radial-gradient(90% 70% at 50% 105%, rgba(74,36,24,0.32), rgba(0,0,0,0) 60%),
        radial-gradient(140% 100% at 50% 50%, rgba(0,0,0,0) 45%, rgba(0,0,0,0.4) 100%);
    }

    .hero-seq-content {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      padding: 0 1.25rem calc(4.5rem + env(safe-area-inset-bottom)) 1.25rem;
      text-align: center;
      z-index: 3;
      will-change: transform, opacity;
      pointer-events: none;
    }
    .hero-seq-content > * { pointer-events: auto; }

    .hero-kicker { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 14px; }
    .hero-kicker .hk-line { height: 1px; width: 34px; background: linear-gradient(to right, transparent, rgba(191,130,86,0.8)); }
    .hero-kicker .hk-line:last-child { background: linear-gradient(to left, transparent, rgba(191,130,86,0.8)); }
    .hero-kicker .hk-text {
      font-family: 'JetBrains Mono','Courier New',monospace;
      font-size: 9px; letter-spacing: 0.42em; text-transform: uppercase;
      color: rgba(224,196,168,0.92);
    }
    .hero-title-glow {
      position: absolute;
      left: 50%; top: 50%;
      width: min(520px, 90vw);
      height: min(520px, 90vw);
      transform: translate(-50%, -58%);
      background: radial-gradient(circle, rgba(192,138,82,0.32) 0%, rgba(168,67,46,0.16) 38%, rgba(0,0,0,0) 70%);
      filter: blur(6px);
      pointer-events: none;
      z-index: -1;
      animation: heroGlowPulse 5s ease-in-out infinite;
    }
    @keyframes heroGlowPulse {
      0%, 100% { opacity: 0.7; transform: translate(-50%, -58%) scale(0.96); }
      50% { opacity: 1; transform: translate(-50%, -58%) scale(1.06); }
    }
    @media (prefers-reduced-motion: reduce) { .hero-title-glow { animation: none; } }

    .hero-seq-title {
      position: relative;
      font-size: clamp(2.1rem, 8.5vw, 6rem);
      font-weight: 900;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      line-height: 1.02;
      margin: 0 0 0.55rem;
      text-shadow: 0 0 55px rgba(168,67,46,0.75), 0 0 100px rgba(74,36,24,0.4);
    }
    .hero-title-rule {
      display: flex;
      justify-content: center;
      margin: 0 0 1rem;
    }
    .hero-title-rule span {
      width: 92px;
      height: 2px;
      border-radius: 2px;
      background: linear-gradient(to right, transparent, #C08A52 25%, #F0C896 50%, #C08A52 75%, transparent);
      background-size: 220% 100%;
      animation: heroRuleShimmer 3.4s ease-in-out infinite;
    }
    @keyframes heroRuleShimmer {
      0% { background-position: 0% 0; }
      100% { background-position: 220% 0; }
    }
    @media (prefers-reduced-motion: reduce) { .hero-title-rule span { animation: none; } }
    .hero-seq-sub {
      font-family: 'Playfair Display', Georgia, serif;
      font-style: italic;
      color: rgba(226,226,226,0.9);
      font-size: clamp(0.82rem, 2.4vw, 1.05rem);
      max-width: 640px;
      margin: 0 auto 1.4rem;
    }
    .hero-seq-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: 1.5rem; }
    .hs-btn {
      display: inline-flex; align-items: center; justify-content: center;
      padding: 0.85rem 1.9rem; border-radius: 999px;
      font-size: 10px; font-weight: 900; letter-spacing: 0.24em; text-transform: uppercase;
      cursor: pointer; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease, color .3s ease;
      text-decoration: none;
    }
    .hs-btn-primary {
      background: linear-gradient(115deg, #35180F 0%, #A8432E 45%, #C08A52 100%);
      color: #fff; border: 0;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.35), 0 12px 40px rgba(74,36,24,0.55), 0 0 34px rgba(192,138,82,0.28);
      text-shadow: 0 1px 2px rgba(0,0,0,0.35);
    }
    .hs-btn-ghost {
      border: 1px solid rgba(192,138,82,0.45); color: #F0E4D2;
      background: linear-gradient(160deg, rgba(255,255,255,0.06), rgba(0,0,0,0.3));
      backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    }
    .hs-btn-ghost:hover { border-color: rgba(192,138,82,0.85); color: #fff; }
    .hs-btn:hover { transform: translateY(-2px) scale(1.03); }
    .hs-btn:active { transform: translateY(0) scale(0.97); transition-duration: .1s; }
    #products .reserve-btn:active { transform: scale(0.96); }

    .hero-seq-stats {
      display: flex; flex-wrap: wrap; justify-content: center;
      gap: 10px 32px;
      padding-top: 1.1rem;
      border-top: 1px solid rgba(191,130,86,0.18);
      max-width: 780px; margin: 0 auto;
    }
    .hero-seq-stats > div { text-align: center; }
    .hero-seq-stats span { display: block; font-size: clamp(1.15rem, 3.6vw, 1.9rem); font-weight: 900; line-height: 1; }
    .hero-seq-stats em {
      display: block; margin-top: 5px; font-style: normal;
      font-size: 8px; font-weight: 800; letter-spacing: 0.16em;
      text-transform: uppercase; color: rgba(170,170,175,0.95);
    }

    #hero-seq-cue {
      position: absolute; left: 50%; transform: translateX(-50%);
      bottom: calc(1.1rem + env(safe-area-inset-bottom));
      z-index: 4; display: flex; align-items: center; gap: 10px;
      pointer-events: none;
    }
    #hero-seq-cue span {
      font-family: 'JetBrains Mono','Courier New',monospace;
      font-size: 8px; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(224,196,168,0.7);
    }
    #hero-seq-cue .cue-mouse {
      position: relative; width: 17px; height: 27px; border-radius: 9px;
      border: 1px solid rgba(191,130,86,0.65);
    }
    #hero-seq-cue .cue-mouse::before {
      content: ''; position: absolute; left: 50%; margin-left: -1.5px; top: 5px;
      width: 3px; height: 6px; border-radius: 2px; background: rgba(224,196,168,0.9);
      animation: heroSeqDot 1.8s ease-in-out infinite;
    }
    @keyframes heroSeqDot { 0% { top: 5px; opacity: 1; } 70% { top: 16px; opacity: 0; } 100% { top: 16px; opacity: 0; } }

    #hero-seq-progress {
      position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
      background: rgba(255,255,255,0.08); z-index: 5;
    }
    #hero-seq-progress i {
      display: block; height: 100%; width: 0%;
      background: linear-gradient(to right, #4A2418, #C08A52);
      transform-origin: left center;
      transition: width 0.12s linear;
    }

    /* Small glowing sound toggle over the hero video — the ONLY way
       audio turns on. Nothing else (scroll/touch/swipe) touches mute
       state, so a plain scroll gesture can never interrupt playback. */
    .hero-sound-btn {
      position: absolute;
      top: calc(1rem + env(safe-area-inset-top));
      right: calc(1rem + env(safe-area-inset-right));
      z-index: 6;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      border: 1px solid rgba(191,130,86,0.55);
      background: rgba(10,3,7,0.55);
      -webkit-backdrop-filter: blur(6px);
      backdrop-filter: blur(6px);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #EDDCC2;
      cursor: pointer;
      pointer-events: auto;
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
      animation: heroSoundPulse 2.2s ease-in-out infinite;
      transition: transform 0.15s ease, border-color 0.2s ease, background 0.2s ease;
    }
    .hero-sound-btn:active { transform: scale(0.9); }
    .hero-sound-btn.is-on {
      border-color: rgba(168,67,46,0.9);
      background: rgba(74,36,24,0.28);
    }
    .hero-sound-btn svg { width: 18px; height: 18px; display: block; }
    @keyframes heroSoundPulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(74,36,24,0.55); }
      50% { box-shadow: 0 0 0 9px rgba(74,36,24,0); }
    }
    @media (prefers-reduced-motion: reduce) { .hero-sound-btn { animation: none; } }

    @media (max-width: 768px) {
      .hero-seq { height: 100vh; height: 100svh; }
      .hero-seq-content {
        padding: 0 1rem calc(2.2rem + env(safe-area-inset-bottom)) 1rem;
        max-width: 96vw;
        margin: 0 auto;
      }
      .hero-seq-title {
        font-size: clamp(1.75rem, 8vw, 2.5rem);
        margin-bottom: 0.4rem;
        text-shadow: 0 4px 24px rgba(0,0,0,0.95), 0 0 30px rgba(74,36,24,0.85);
      }
      .hero-seq-sub {
        font-size: 0.8rem;
        line-height: 1.35;
        margin: 0 auto 0.9rem;
        text-shadow: 0 2px 10px rgba(0,0,0,0.95);
        background: rgba(13, 2, 9, 0.65);
        backdrop-filter: blur(8px);
        border: 1px solid rgba(191,130,86, 0.25);
        padding: 6px 14px;
        border-radius: 20px;
        display: inline-block;
        max-width: 90%;
      }
      .hero-seq-cta {
        gap: 8px;
        flex-direction: row;
        justify-content: center;
        margin-bottom: 0.8rem;
      }
      .hs-btn {
        padding: 0.65rem 1.25rem;
        font-size: 9px;
        letter-spacing: 0.18em;
      }
      .hero-seq-stats { gap: 8px 20px; }
      .hero-seq-stats > div:nth-child(n+5) { display: none; }
    }
    @media (max-height: 620px) {
      .hero-seq-stats, .hero-seq-sub { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .hero-seq { height: 100vh; }
      #hero-seq-cue .cue-mouse::before { animation: none; }
    }

    /* ─── Chef Video Frame & Scroll Animation ─── */
    .chef-video-card-wrapper {
      width: 100%;
      max-width: 1100px;
      margin-left: auto;
      margin-right: auto;
      perspective: 1000px;
    }
    .chef-video-glow-backdrop {
      position: absolute;
      inset: -20px;
      background: radial-gradient(circle at 50% 50%, rgba(74,36,24, 0.35), transparent 70%);
      filter: blur(40px);
      z-index: 0;
      pointer-events: none;
    }
    .chef-video-frame-container {
      position: relative;
      width: 100%;
      aspect-ratio: 9 / 16;
      max-height: 80vh;
      max-width: calc(80vh * 9 / 16);
      margin: 0 auto;
      border-radius: 24px;
      overflow: hidden;
      border: 1px solid rgba(191,130,86, 0.35);
      box-shadow: 0 25px 60px rgba(0, 0, 0, 0.8), 0 0 50px rgba(74,36,24, 0.35);
      z-index: 1;
      transform: scale(0.96);
      transition: transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.3s ease;
      will-change: transform;
      background: #000;
    }
    .chef-video-media {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .chef-video-overlay-gradient {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(to top, rgba(13, 2, 9, 0.85) 0%, rgba(0, 0, 0, 0) 50%),
                  radial-gradient(ellipse at 50% 0%, rgba(0, 0, 0, 0.4), transparent 70%);
    }
    .chef-video-badge {
      position: absolute;
      top: 20px;
      left: 20px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 8px 16px;
      border-radius: 999px;
      background: rgba(13, 2, 9, 0.75);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(191,130,86, 0.35);
      color: #F0E4D2;
      font-size: 10px;
      font-weight: 900;
      letter-spacing: 0.2em;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    }
    .cvb-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #4A2418;
      box-shadow: 0 0 10px #4A2418;
      animation: aiStatusBlink 1.5s ease-in-out infinite;
    }
    @media (max-width: 768px) {
      .chef-video-frame-container {
        aspect-ratio: 4 / 5;
        border-radius: 16px;
      }
      .chef-video-badge {
        font-size: 8px;
        padding: 6px 12px;
      }
    }

    /* ─── Signature reveal (frame sequence above Contact) ───
       100-frame portrait (9:16) sequence — scroll length tuned to the
       frame count (was 500vh for the old 208-frame set; ~2.5vh per
       frame keeps the same scrub feel with half the frames instead of
       dragging the same 500vh across fewer stills). */
    .cta-seq {
      position: relative;
      height: 360vh;
      background: #000;
      overflow: visible;
      contain: layout style;
    }
    .cta-sticky {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      height: 100vh;
      height: 100svh;
      width: 100%;
      overflow: hidden;
      background: #000;
      display: block;
      z-index: 2;
    }
    #cta-frame-canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      background: #000;
      transform: translateZ(0);
    }
    .cta-seq-veil {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(120% 80% at 50% 0%, rgba(0,0,0,0.72), rgba(0,0,0,0) 55%),
        linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.55) 30%, rgba(0,0,0,0.12) 60%, rgba(0,0,0,0.5) 100%),
        radial-gradient(90% 70% at 50% 105%, rgba(74,36,24,0.28), rgba(0,0,0,0) 60%);
    }
    .cta-seq-content {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      padding: 0 1.25rem calc(4.5rem + env(safe-area-inset-bottom)) 1.25rem;
      text-align: center;
      z-index: 3;
      will-change: transform, opacity;
      pointer-events: none;
    }
    .cta-seq-content > * { pointer-events: auto; }
    .cta-seq-title {
      font-size: clamp(2rem, 7vw, 4.6rem);
      font-weight: 900;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      line-height: 1.05;
      margin: 0 0 0.7rem;
      text-shadow: 0 0 55px rgba(168,67,46,0.75), 0 0 100px rgba(74,36,24,0.4);
    }
    .cta-seq-sub {
      font-family: 'Playfair Display', Georgia, serif;
      font-style: italic;
      color: rgba(226,226,226,0.9);
      font-size: clamp(0.82rem, 2.4vw, 1.05rem);
      max-width: 560px;
      margin: 0 auto 1.4rem;
    }
    #cta-seq-cue {
      position: absolute; left: 50%; transform: translateX(-50%);
      bottom: calc(1.1rem + env(safe-area-inset-bottom));
      z-index: 4; display: flex; align-items: center; gap: 10px;
      pointer-events: none;
    }
    #cta-seq-cue span {
      font-family: 'JetBrains Mono','Courier New',monospace;
      font-size: 8px; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(224,196,168,0.7);
    }
    #cta-seq-cue .cue-mouse {
      position: relative; width: 17px; height: 27px; border-radius: 9px;
      border: 1px solid rgba(191,130,86,0.65);
    }
    #cta-seq-cue .cue-mouse::before {
      content: ''; position: absolute; left: 50%; margin-left: -1.5px; top: 5px;
      width: 3px; height: 6px; border-radius: 2px; background: rgba(224,196,168,0.9);
      animation: heroSeqDot 1.8s ease-in-out infinite;
    }
    #cta-seq-progress {
      position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
      background: rgba(255,255,255,0.08); z-index: 5;
    }
    #cta-seq-progress i {
      display: block; height: 100%; width: 0%;
      background: linear-gradient(to right, #4A2418, #C08A52);
      transform-origin: left center;
    }
    @media (max-width: 768px) {
      .cta-seq { height: 320vh; }
      .cta-seq-content { padding-bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
    }
    @media (max-height: 620px) {
      .cta-seq-sub { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .cta-seq { height: 100vh; }
      #cta-seq-cue .cue-mouse::before { animation: none; }
    }

    /* ─── Mid-page showcase (3rd frame sequence, sits between the empire
       stats and the reviews wall) — same sticky-canvas engine as the hero
       and signature-reveal sections above, tuned for a left-weighted
       composition (subject sits left of frame, so the cover-fit crop is
       biased toward the left edge instead of centered). ─── */
    .mid-seq {
      position: relative;
      height: 620vh;
      background: #000;
      overflow: visible;
      contain: layout style;
    }
    .mid-sticky {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      height: 100vh;
      height: 100svh;
      width: 100%;
      overflow: hidden;
      background: #000;
      display: block;
      z-index: 2;
    }
    #mid-frame-canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      background: #000;
      transform: translateZ(0);
    }
    .mid-seq-veil {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(120% 80% at 30% 0%, rgba(0,0,0,0.72), rgba(0,0,0,0) 55%),
        linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.55) 30%, rgba(0,0,0,0.12) 60%, rgba(0,0,0,0.5) 100%),
        linear-gradient(to right, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 45%),
        radial-gradient(90% 70% at 50% 105%, rgba(74,36,24,0.28), rgba(0,0,0,0) 60%);
    }
    .mid-seq-content {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      padding: 0 1.25rem calc(4.5rem + env(safe-area-inset-bottom)) 1.25rem;
      text-align: center;
      z-index: 3;
      will-change: transform, opacity;
      pointer-events: none;
    }
    .mid-seq-content > * { pointer-events: auto; }
    .mid-seq-title {
      font-size: clamp(2rem, 7vw, 4.6rem);
      font-weight: 900;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      line-height: 1.05;
      margin: 0 0 0.7rem;
      text-shadow: 0 0 55px rgba(168,67,46,0.75), 0 0 100px rgba(74,36,24,0.4);
    }
    .mid-seq-sub {
      font-family: 'Playfair Display', Georgia, serif;
      font-style: italic;
      color: rgba(226,226,226,0.9);
      font-size: clamp(0.82rem, 2.4vw, 1.05rem);
      max-width: 560px;
      margin: 0 auto 1.4rem;
    }
    #mid-seq-cue {
      position: absolute; left: 50%; transform: translateX(-50%);
      bottom: calc(1.1rem + env(safe-area-inset-bottom));
      z-index: 4; display: flex; align-items: center; gap: 10px;
      pointer-events: none;
    }
    #mid-seq-cue span {
      font-family: 'JetBrains Mono','Courier New',monospace;
      font-size: 8px; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(224,196,168,0.7);
    }
    #mid-seq-cue .cue-mouse {
      position: relative; width: 17px; height: 27px; border-radius: 9px;
      border: 1px solid rgba(191,130,86,0.65);
    }
    #mid-seq-cue .cue-mouse::before {
      content: ''; position: absolute; left: 50%; margin-left: -1.5px; top: 5px;
      width: 3px; height: 6px; border-radius: 2px; background: rgba(224,196,168,0.9);
      animation: heroSeqDot 1.8s ease-in-out infinite;
    }
    #mid-seq-progress {
      position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
      background: rgba(255,255,255,0.08); z-index: 5;
    }
    #mid-seq-progress i {
      display: block; height: 100%; width: 0%;
      background: linear-gradient(to right, #4A2418, #C08A52);
      transform-origin: left center;
    }
    /* HD/high-clarity polish pass — mirrors the hero canvas treatment so
       the upscaled+sharpened frame sequence reads crisp on retina/4K
       screens as well as phones. */
    #mid-frame-canvas {
      image-rendering: -webkit-optimize-contrast;
      image-rendering: crisp-edges;
      filter: saturate(1.08) contrast(1.06) brightness(1.02);
      -webkit-filter: saturate(1.08) contrast(1.06) brightness(1.02);
      backface-visibility: hidden;
      will-change: transform;
    }
    @media (max-width: 768px) {
      .mid-seq { height: 420vh; }
      .mid-seq-content { padding-bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
    }
    @media (max-height: 620px) {
      .mid-seq-sub { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .mid-seq { height: 100vh; }
      #mid-seq-cue .cue-mouse::before { animation: none; }
    }

    /* ─── Heritage / unboxing frame sequence — sits right above the
       "Provenance Perfected" section. Same sticky-canvas engine, tuned
       centered (product/box stays centered in every frame). ─── */
    .heritage-seq {
      position: relative;
      height: 560vh;
      background: #000;
      overflow: visible;
      contain: layout style;
    }
    .heritage-sticky {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      height: 100vh;
      height: 100svh;
      width: 100%;
      overflow: hidden;
      background: #000;
      display: block;
      z-index: 2;
    }
    #heritage-frame-canvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      background: #000;
      transform: translateZ(0);
    }
    .heritage-seq-veil {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(120% 80% at 50% 0%, rgba(0,0,0,0.65), rgba(0,0,0,0) 55%),
        linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.1) 60%, rgba(0,0,0,0.45) 100%),
        radial-gradient(90% 70% at 50% 105%, rgba(74,36,24,0.28), rgba(0,0,0,0) 60%);
    }
    .heritage-seq-content {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      padding: 0 1.25rem calc(4.5rem + env(safe-area-inset-bottom)) 1.25rem;
      text-align: center;
      z-index: 3;
      will-change: transform, opacity;
      pointer-events: none;
    }
    .heritage-seq-content > * { pointer-events: auto; }
    .heritage-seq-title {
      font-size: clamp(2rem, 7vw, 4.6rem);
      font-weight: 900;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      line-height: 1.05;
      margin: 0 0 0.7rem;
      text-shadow: 0 0 55px rgba(168,67,46,0.75), 0 0 100px rgba(74,36,24,0.4);
    }
    .heritage-seq-sub {
      font-family: 'Playfair Display', Georgia, serif;
      font-style: italic;
      color: rgba(226,226,226,0.9);
      font-size: clamp(0.82rem, 2.4vw, 1.05rem);
      max-width: 560px;
      margin: 0 auto 1.4rem;
    }
    #heritage-seq-cue {
      position: absolute; left: 50%; transform: translateX(-50%);
      bottom: calc(1.1rem + env(safe-area-inset-bottom));
      z-index: 4; display: flex; align-items: center; gap: 10px;
      pointer-events: none;
    }
    #heritage-seq-cue span {
      font-family: 'JetBrains Mono','Courier New',monospace;
      font-size: 8px; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(224,196,168,0.7);
    }
    #heritage-seq-cue .cue-mouse {
      position: relative; width: 17px; height: 27px; border-radius: 9px;
      border: 1px solid rgba(191,130,86,0.65);
    }
    #heritage-seq-cue .cue-mouse::before {
      content: ''; position: absolute; left: 50%; margin-left: -1.5px; top: 5px;
      width: 3px; height: 6px; border-radius: 2px; background: rgba(224,196,168,0.9);
      animation: heroSeqDot 1.8s ease-in-out infinite;
    }
    #heritage-seq-progress {
      position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
      background: rgba(255,255,255,0.08); z-index: 5;
    }
    #heritage-seq-progress i {
      display: block; height: 100%; width: 0%;
      background: linear-gradient(to right, #4A2418, #C08A52);
      transform-origin: left center;
    }
    #heritage-frame-canvas {
      image-rendering: -webkit-optimize-contrast;
      image-rendering: crisp-edges;
      filter: saturate(1.08) contrast(1.06) brightness(1.02);
      -webkit-filter: saturate(1.08) contrast(1.06) brightness(1.02);
      backface-visibility: hidden;
      will-change: transform;
    }
    @media (max-width: 768px) {
      .heritage-seq { height: 380vh; }
      .heritage-seq-content { padding-bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
    }
    @media (max-height: 620px) {
      .heritage-seq-sub { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .heritage-seq { height: 100vh; }
      #heritage-seq-cue .cue-mouse::before { animation: none; }
    }
  

/* ---- next style block ---- */


  /* ── Zero-jank scroll on all phones ── */
  html {
    overscroll-behavior: none;
    -webkit-overflow-scrolling: touch;
  }
  body {
    overscroll-behavior-y: none;
    -webkit-tap-highlight-color: transparent;
  }
  /* Stop iOS bounce pull-to-refresh fighting the scroll-scrub */
  body { overflow-x: hidden; }

  /* Pause ALL CSS animations on off-screen sections (already done via JS
     .active toggle — this is an extra CSS backstop for any section that
     misses the JS pulse) */
  .scroll-section:not(.active) * {
    animation-play-state: paused !important;
  }

  /* Prevent layout reflow thrash from infinite keyframe animations while
     the hero sticky canvas is painting — these were the main jank source */
  .hero-sticky > canvas { contain: strict; }
  .hero-sticky canvas, .cta-sticky canvas, .mid-sticky canvas, .heritage-sticky canvas {
    contain: strict;
    isolation: isolate;
  }

  /* On mobile: reduce backdrop-filter cost on non-hero glass cards */
  @media (max-width: 768px) {
    .pro-glass-card { backdrop-filter: blur(8px) saturate(140%); -webkit-backdrop-filter: blur(8px) saturate(140%); }
    .fan-card .fan-panel { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
    /* Reduce depth orb blur on mobile (huge GPU cost) */
    .depth-orb { filter: blur(60px) !important; }
  }

  /* Remove flash when fan card video starts */
  .fan-card .fan-media video { opacity: 0; transition: opacity .5s ease; }
  .fan-card.is-active .fan-media video { opacity: 1; }


/* ---- next style block ---- */


    @keyframes flagTickerRTL {
      0%   { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    @keyframes flagFloat {
      0%, 100% { transform: translateY(0px); }
      50%       { transform: translateY(-8px); }
    }
    @keyframes flagGlow {
      0%, 100% { border-color: rgba(74,36,24,0.35); box-shadow: 0 4px 20px rgba(74,36,24,0.15); }
      50%       { border-color: rgba(168,67,46,0.85); box-shadow: 0 8px 35px rgba(168,67,46,0.45); }
    }
    .flag-ticker-track {
      display: flex;
      gap: 1.2rem;
      width: max-content;
      animation: flagTickerRTL 40s linear infinite;
      will-change: transform;
    }
    .flag-ticker-track:hover { animation-play-state: paused; }
    .flag-3d-card {
      width: 130px;
      height: 150px;
      border-radius: 22px;
      background: linear-gradient(135deg, rgba(13,2,9,0.98) 0%, rgba(42,19,11,0.95) 100%);
      border: 1px solid rgba(74,36,24,0.35);
      display: flex;
      align-items: center;
      justify-content: center;
      animation: flagFloat 3s ease-in-out infinite, flagGlow 3s ease-in-out infinite;
      cursor: pointer;
      will-change: transform;
      transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }
    .flag-3d-card:nth-child(2n)  { animation-delay: -0.6s; }
    .flag-3d-card:nth-child(3n)  { animation-delay: -1.2s; }
    .flag-3d-card:nth-child(4n)  { animation-delay: -1.8s; }
    .flag-3d-card:nth-child(5n)  { animation-delay: -2.4s; }
    .flag-3d-card:hover {
      animation-play-state: paused;
      transform: translateY(-14px) scale(1.1) !important;
      border-color: rgba(168,67,46,1) !important;
      box-shadow: 0 0 50px rgba(168,67,46,0.7), 0 20px 40px rgba(74,36,24,0.3) !important;
    }
    .flag-inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }
    .flag-img-wrap {
      width: 84px;
      height: 56px;
      border-radius: 8px;
      overflow: hidden;
      border: 2px solid rgba(74,36,24,0.5);
      box-shadow: 0 0 10px rgba(74,36,24,0.2);
    }
    .flag-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .flag-label {
      font-size: 9px;
      font-weight: 900;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: #4A2418;
      text-align: center;
      padding: 0 4px;
    }
  

/* ---- next style block ---- */


    @keyframes badgeSheen { 0% { transform: translateX(-140%) skewX(-18deg); } 60%, 100% { transform: translateX(240%) skewX(-18deg); } }
  

/* ---- next style block ---- */


  /* ---- 1. Kill the heavy stuff --------------------------------- */
  /* Neutralise Tailwind decorative infinite loops that cause paint
     churn on low-end phones. */
  .animate-pulse,
  .animate-bounce,
  .animate-ping,
  .animate-spin {
    animation: none !important;
  }
  /* Any element the original CSS marked as infinite is muted.
     (Uses attribute matching; safe fallback — doesn't break UI.) */
  [style*="animation"][style*="infinite"] { animation: none !important; }

  /* Kill expensive filters during scroll — replaced by simple ones */
  html.is-scrolling * {
    animation-play-state: paused !important;
  }

  /* ---- 2. Smoother base --------------------------------------- */
  html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  html, body { overscroll-behavior-y: none; }
  body { overflow-x: hidden; }

  /* Momentum-friendly, avoids layout thrash. */
  img, video, svg { will-change: auto; }

  /* ---- 3. Premium reveal system ------------------------------- */
  /* Elements auto-tagged by the JS below get .pp-reveal.
     Butter-smooth: transform+opacity only (compositor-only).      */
  .pp-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0) scale(.985);
    transition:
      opacity   .9s cubic-bezier(.22,.61,.36,1),
      transform 1.05s cubic-bezier(.22,.61,.36,1);
    will-change: opacity, transform;
    backface-visibility: hidden;
  }
  .pp-reveal.pp-in {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  /* Variants for a bit of variety per section */
  .pp-reveal.pp-left  { transform: translate3d(-36px, 0, 0); }
  .pp-reveal.pp-right { transform: translate3d( 36px, 0, 0); }
  .pp-reveal.pp-zoom  { transform: scale(.94); }
  .pp-reveal.pp-left.pp-in,
  .pp-reveal.pp-right.pp-in,
  .pp-reveal.pp-zoom.pp-in { transform: translate3d(0,0,0) scale(1); }

  /* Staggered children */
  .pp-stagger > * {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
      opacity   .7s cubic-bezier(.22,.61,.36,1),
      transform .9s cubic-bezier(.22,.61,.36,1);
    will-change: opacity, transform;
  }
  .pp-stagger.pp-in > * {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
  .pp-stagger.pp-in > *:nth-child(1) { transition-delay: .02s; }
  .pp-stagger.pp-in > *:nth-child(2) { transition-delay: .09s; }
  .pp-stagger.pp-in > *:nth-child(3) { transition-delay: .16s; }
  .pp-stagger.pp-in > *:nth-child(4) { transition-delay: .23s; }
  .pp-stagger.pp-in > *:nth-child(5) { transition-delay: .30s; }
  .pp-stagger.pp-in > *:nth-child(6) { transition-delay: .37s; }
  .pp-stagger.pp-in > *:nth-child(7) { transition-delay: .44s; }
  .pp-stagger.pp-in > *:nth-child(8) { transition-delay: .51s; }

  /* Subtle hover lift on cards — GPU only */
  [class*="rounded-"][class*="shadow"]:not(button):not(a) {
    transition: transform .5s cubic-bezier(.22,.61,.36,1),
                box-shadow .5s cubic-bezier(.22,.61,.36,1);
  }
  @media (hover:hover) and (pointer:fine) {
    [class*="rounded-"][class*="shadow"]:not(button):not(a):hover {
      transform: translate3d(0,-4px,0);
    }
  }

  /* Reduced motion — respect user preference */
  @media (prefers-reduced-motion: reduce) {
    .pp-reveal, .pp-stagger > * {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }
    html { scroll-behavior: auto; }
  }


/* ---- next style block ---- */


  #cinematic-grain-overlay{
    position: fixed; inset: 0; z-index: 60; pointer-events: none;
    opacity: .035; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
    background-size: 180px 180px;
  }
  @media (prefers-reduced-motion: reduce){ #cinematic-grain-overlay{ opacity: .02; } }

  .hero-cta-btn, .reserve-btn{
    transition: transform .15s cubic-bezier(.4,0,.2,1), box-shadow .25s ease, filter .25s ease;
    box-shadow: 0 1px 0 rgba(255,255,255,.22) inset, 0 10px 24px -8px rgba(0,0,0,.55);
  }
  .hero-cta-btn:hover, .reserve-btn:hover{ filter: brightness(1.06) saturate(1.08); }
  .hero-cta-btn:active, .reserve-btn:active{
    transform: scale(.96);
    box-shadow: 0 1px 0 rgba(255,255,255,.15) inset, 0 4px 10px -4px rgba(0,0,0,.5);
  }

  #sfx-toggle{
    position: fixed; left: 16px; bottom: 16px; z-index: 9998;
    width: 38px; height: 38px; border-radius: 50%;
    background: rgba(0,0,0,.55); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border: 1px solid rgba(168,67,46,.35); color: #F0E4D2; font-size: 15px;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    transition: transform .2s ease, border-color .2s ease;
  }
  #sfx-toggle:hover{ transform: scale(1.08); border-color: rgba(168,67,46,.6); }
  @media (max-width: 640px){ #sfx-toggle{ left: 12px; bottom: 12px; width: 34px; height: 34px; font-size: 13px; } }

  /* ─── Top scroll-progress bar ───
     A thin glowing line at the very top of the viewport that fills as the
     visitor scrolls through the whole page — visible on every scroll,
     phone or desktop, and one of the cheapest ways to add a premium,
     "this site is polished" feel since it's just a single width update
     per animation frame. */
  #scroll-progress-bar {
    position: fixed; top: 0; left: 0; right: 0; height: 3px;
    z-index: 10000; background: rgba(255,255,255,0.06);
    pointer-events: none;
  }
  #scroll-progress-bar i {
    display: block; height: 100%; width: 0%;
    background: linear-gradient(to right, #4A2418, #A8432E, #C08A52);
    box-shadow: 0 0 12px rgba(74,36,24,0.85), 0 0 24px rgba(74,36,24,0.4);
    transform-origin: left center;
    transition: width 0.08s linear;
  }
  @media (prefers-reduced-motion: reduce) {
    #scroll-progress-bar i { transition: none; }
  }


/* ---- next style block ---- */


  .hero-cta-btn, .reserve-btn{ position: relative; z-index: 0; }
  .hero-cta-btn::before, .reserve-btn::before{
    content:""; position:absolute; inset:-4px; border-radius:inherit; z-index:-1;
    background: conic-gradient(from 0deg, #A8432E, #C08A52, #4A2418, #A8432E);
    filter: blur(7px); opacity: .7;
    animation: neonOrbit 4.5s linear infinite;
  }
  @keyframes neonOrbit{ to{ transform: rotate(360deg); } }
  @media (prefers-reduced-motion: reduce){ .hero-cta-btn::before, .reserve-btn::before{ animation: none; } }

  .fx-ripple{
    position: fixed; z-index: 9997; pointer-events: none; border-radius: 50%;
    border: 1.5px solid rgba(168,67,46,.85);
    box-shadow: 0 0 14px 2px rgba(168,67,46,.5);
    transform: translate(-50%,-50%) scale(0);
    animation: fxRippleOut .6s cubic-bezier(.16,1,.3,1) forwards;
  }
  @keyframes fxRippleOut{
    0%{ width:8px; height:8px; opacity:.9; transform: translate(-50%,-50%) scale(0); }
    100%{ width:70px; height:70px; opacity:0; transform: translate(-50%,-50%) scale(1); }
  }


/* ==========================================================================
   FINAL LUXURY FORCE-OVERRIDE
   Highest priority pass — guarantees the crimson / dark-burgundy / rose-gold-
   champagne system wins everywhere, no matter what earlier rules do.
   ========================================================================== */

  body, html {
    background-color: #050505 !important;
  }
  body {
    background-image:
      radial-gradient(ellipse 900px 600px at 50% -10%, rgba(74,36,24,0.35), transparent 60%),
      radial-gradient(ellipse 700px 500px at 100% 100%, rgba(53,24,15,0.25), transparent 60%),
      linear-gradient(180deg, #050505 0%, #0c0408 100%) !important;
    background-attachment: fixed !important;
  }

  /* Any remaining "pink-ish" Tailwind utility text/bg/border classes —
     force them into the luxury palette regardless of the exact shade. */
  [class*="pink-3"], [class*="pink-4"] { color: #BF8256 !important; }
  [class*="pink-5"], [class*="pink-6"] { color: #A8432E !important; }
  a[class*="text-pink"], span[class*="text-pink"] { color: #C08A52 !important; }
  [class*="bg-pink-4"], [class*="bg-pink-5"] { background-color: #4A2418 !important; }
  [class*="border-pink-4"], [class*="border-pink-5"] { border-color: #A8432E !important; }

  /* Hero title — force the exact champagne / crimson sweep from the preview */
  .gold-shimmer-text, .hero-seq-title {
    background: linear-gradient(135deg, #ffffff 0%, #d9b98a 22%, #A8432E 50%, #e8cbb0 78%, #ffffff 100%) !important;
    background-size: 200% auto !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
  }

  /* Primary buttons — glossy crimson-to-champagne gradient, matching the preview card CTA */
  .hero-cta-btn, .hs-btn-primary, #cart-checkout-btn, .reserve-btn {
    background: linear-gradient(115deg, #35180F 0%, #A8432E 45%, #C08A52 100%) !important;
    border: none !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.35),
      0 12px 40px rgba(74,36,24,0.55),
      0 0 34px rgba(192,138,82,0.28) !important;
  }

  /* Glass cards everywhere — force the crystal-glass + rose-gold edge look */
  .pro-glass-card, .fan-art, [class*="rounded-3xl"][class*="border"],
  [class*="rounded-2xl"][class*="border"] {
    background:
      linear-gradient(160deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 35%),
      linear-gradient(180deg, rgba(20,7,12,0.88) 0%, rgba(8,3,6,0.94) 100%) !important;
    border-color: rgba(192,138,82, 0.3) !important;
  }

  /* Circular nav/carousel arrows + any small accent badges */
  .fan-arrow.fan-next, .fan-arrow:hover {
    background: linear-gradient(135deg, #4A2418, #A8432E) !important;
  }

  /* Scroll progress bar + selection color, for full consistency */
  #scroll-progress-bar i {
    background: linear-gradient(to right, #35180F, #A8432E, #C08A52) !important;
  }
  ::selection { background-color: #A8432E !important; color: #fff !important; }

/* ============================================================
   REDBOT — self-contained FAQ chat widget (no external API).
   ============================================================ */
#redbot-launcher{
  position: fixed; right: 16px; bottom: 16px; z-index: 9999;
  width: 56px; height: 56px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #C08A52, #4A2418 70%);
  border: 1px solid rgba(191,130,86,.6);
  box-shadow: 0 8px 30px rgba(0,0,0,.5), 0 0 0 0 rgba(191,130,86,.5);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; -webkit-user-select: none; user-select: none;
  transition: transform .25s cubic-bezier(0.16,1,0.3,1), box-shadow .3s ease;
  animation: redbotFloat 3.2s ease-in-out infinite;
}
#redbot-launcher:hover{ transform: scale(1.08); }
#redbot-launcher:active{ transform: scale(.94); }
@keyframes redbotFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
#redbot-launcher:hover { animation-play-state: paused; }
#redbot-launcher-icon, #redbot-launcher-close{
  font-size: 22px; line-height: 1; color: #FBEFDD;
  position: absolute; transition: opacity .25s ease, transform .3s cubic-bezier(0.16,1,0.3,1);
}
#redbot-launcher-close{ opacity: 0; transform: rotate(-90deg) scale(.6); font-size: 18px; }
#redbot-launcher.open #redbot-launcher-icon{ opacity: 0; transform: rotate(90deg) scale(.6); }
#redbot-launcher.open #redbot-launcher-close{ opacity: 1; transform: rotate(0deg) scale(1); }
#redbot-launcher-ping{
  position: absolute; inset: -1px; border-radius: 50%;
  border: 2px solid rgba(191,130,86,.55);
  animation: redbotPing 2.4s cubic-bezier(0.16,1,0.3,1) infinite;
}
@keyframes redbotPing {
  0% { transform: scale(1); opacity: .8; }
  100% { transform: scale(1.55); opacity: 0; }
}
#redbot-launcher.open #redbot-launcher-ping{ display: none; }

#redbot-panel{
  position: fixed; right: 16px; bottom: 84px; z-index: 9999;
  width: min(360px, calc(100vw - 32px));
  height: min(520px, calc(100vh - 140px));
  background: linear-gradient(180deg, rgba(10,4,7,.97), rgba(4,1,2,.99));
  border: 1px solid rgba(191,130,86,.3);
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(0,0,0,.4);
  display: flex; flex-direction: column; overflow: hidden;
  opacity: 0; pointer-events: none;
  transform: translateY(24px) scale(.94);
  transform-origin: bottom right;
  transition: opacity .35s cubic-bezier(0.16,1,0.3,1), transform .4s cubic-bezier(0.16,1,0.3,1);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
#redbot-panel.open{
  opacity: 1; pointer-events: auto; transform: translateY(0) scale(1);
}
#redbot-header{
  display: flex; align-items: center; gap: 10px;
  padding: 14px 14px; border-bottom: 1px solid rgba(191,130,86,.18);
  background: linear-gradient(135deg, rgba(74,36,24,.35), rgba(0,0,0,0));
}
#redbot-header-avatar{
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  background: rgba(191,130,86,.15); border: 1px solid rgba(191,130,86,.4);
}
#redbot-header-text{ display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
#redbot-header-title{ color: #FBEFDD; font-weight: 800; font-size: 13px; letter-spacing: .02em; }
#redbot-header-sub{ color: rgba(217,189,152,.65); font-size: 10.5px; display: flex; align-items: center; gap: 5px; margin-top: 2px; }
#redbot-status-dot{
  width: 6px; height: 6px; border-radius: 50%; background: #7CD98A; display: inline-block;
  animation: redbotDotPulse 1.8s ease-in-out infinite;
  box-shadow: 0 0 6px rgba(124,217,138,.8);
}
@keyframes redbotDotPulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
#redbot-close-btn{
  background: none; border: none; color: rgba(217,189,152,.6); font-size: 13px;
  cursor: pointer; padding: 6px; min-height: 0; transition: color .2s ease, transform .2s ease;
}
#redbot-close-btn:hover{ color: #FBEFDD; transform: rotate(90deg); }

#redbot-messages{
  flex: 1 1 auto; overflow-y: auto; padding: 16px 14px;
  display: flex; flex-direction: column; gap: 10px;
  scroll-behavior: smooth;
}
#redbot-messages::-webkit-scrollbar{ width: 5px; }
#redbot-messages::-webkit-scrollbar-thumb{ background: rgba(191,130,86,.3); border-radius: 10px; }

.redbot-msg{
  max-width: 82%;
  padding: 10px 13px;
  border-radius: 16px;
  font-size: 12.5px;
  line-height: 1.55;
  opacity: 0;
  transform: translateY(10px) scale(.97);
  animation: redbotMsgIn .4s cubic-bezier(0.16,1,0.3,1) forwards;
}
@keyframes redbotMsgIn { to { opacity: 1; transform: translateY(0) scale(1); } }
.redbot-msg.bot{
  align-self: flex-start;
  background: rgba(191,130,86,.1);
  border: 1px solid rgba(191,130,86,.25);
  color: #F0E4D2;
  border-bottom-left-radius: 4px;
}
.redbot-msg.user{
  align-self: flex-end;
  background: linear-gradient(135deg, #A8432E, #4A2418);
  color: #FBEFDD;
  font-weight: 600;
  border-bottom-right-radius: 4px;
}
.redbot-msg a{ color: #D9BD98; text-decoration: underline; }

.redbot-typing{
  align-self: flex-start;
  display: flex; align-items: center; gap: 4px;
  padding: 11px 14px;
  background: rgba(191,130,86,.1);
  border: 1px solid rgba(191,130,86,.25);
  border-radius: 16px; border-bottom-left-radius: 4px;
  opacity: 0; transform: translateY(10px);
  animation: redbotMsgIn .3s cubic-bezier(0.16,1,0.3,1) forwards;
}
.redbot-typing span{
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(217,189,152,.8);
  animation: redbotTypingDot 1.1s ease-in-out infinite;
}
.redbot-typing span:nth-child(2){ animation-delay: .15s; }
.redbot-typing span:nth-child(3){ animation-delay: .3s; }
@keyframes redbotTypingDot {
  0%, 60%, 100% { transform: translateY(0); opacity: .5; }
  30% { transform: translateY(-4px); opacity: 1; }
}

#redbot-quickchips{
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 0 14px 10px;
}
.redbot-chip{
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(191,130,86,.08);
  border: 1px solid rgba(191,130,86,.3);
  color: #D9BD98;
  font-size: 10.5px; font-weight: 700; letter-spacing: .02em;
  cursor: pointer; white-space: nowrap;
  transition: transform .2s cubic-bezier(0.16,1,0.3,1), background .2s ease, border-color .2s ease;
  opacity: 0; transform: translateY(8px);
  animation: redbotMsgIn .35s cubic-bezier(0.16,1,0.3,1) forwards;
}
.redbot-chip:hover{ background: rgba(191,130,86,.2); border-color: rgba(191,130,86,.55); transform: translateY(-2px); }
.redbot-chip:active{ transform: translateY(0) scale(.96); }

#redbot-form{
  display: flex; align-items: center; gap: 8px;
  padding: 12px 12px; border-top: 1px solid rgba(191,130,86,.18);
  background: rgba(0,0,0,.25);
}
#redbot-input{
  flex: 1 1 auto; min-width: 0;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(191,130,86,.25);
  border-radius: 999px;
  padding: 10px 14px;
  color: #F0E4D2; font-size: 12.5px;
  transition: border-color .25s ease, box-shadow .25s ease;
}
#redbot-input::placeholder{ color: rgba(217,189,152,.4); }
#redbot-input:focus{ outline: none; border-color: rgba(191,130,86,.7); box-shadow: 0 0 0 3px rgba(191,130,86,.15); }
#redbot-send-btn{
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, #C08A52, #A8432E);
  border: none; color: #1a0a06; font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; min-height: 0; padding: 0;
  transition: transform .2s cubic-bezier(0.16,1,0.3,1), filter .2s ease;
}
#redbot-send-btn:hover{ transform: scale(1.08) rotate(8deg); filter: brightness(1.1); }
#redbot-send-btn:active{ transform: scale(.9); }

@media (max-width: 480px){
  #redbot-panel{ right: 10px; bottom: 78px; width: calc(100vw - 20px); }
  #redbot-launcher{ right: 12px; bottom: 12px; }
}

@media (prefers-reduced-motion: reduce){
  #redbot-launcher{ animation: none; }
  #redbot-launcher-ping{ display: none; }
  #redbot-status-dot{ animation: none; }
  .redbot-msg, .redbot-typing, .redbot-chip{ animation: none; opacity: 1; transform: none; }
  #redbot-panel{ transition: opacity .15s ease; transform: none; }
}

/* Functional cart control in the navigation. */
.cart-toggle-btn {
  position: relative;
  min-height: 38px;
  padding: 0 11px;
  border: 1px solid rgba(191,130,86,.55);
  border-radius: 999px;
  background: rgba(20,7,12,.92);
  color: #F0E4D2;
  font: 800 10px/1 Inter, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
#cart-count-badge {
  display: none;
  position: absolute;
  top: -7px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #A8432E;
  color: #fff;
  font-size: 10px;
  letter-spacing: 0;
}

/* Plain, readable policy page linked from the footer. */
.policy-page {
  min-height: 100vh;
  margin: 0;
  background: #14070c;
  color: #F0E4D2;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.policy-content {
  width: min(760px, calc(100% - 40px));
  margin: 0 auto;
  padding: 56px 0 72px;
}
.policy-back { color: #D9BD98; font-size: 14px; text-decoration: none; }
.policy-back:hover, .policy-content a:hover { color: #fff; }
.policy-content h1 { margin: 24px 0 12px; font-size: clamp(30px, 6vw, 46px); letter-spacing: .04em; }
.policy-intro { color: rgba(240,228,210,.75); line-height: 1.7; }
.policy-content section { margin-top: 22px; padding: 22px; border: 1px solid rgba(191,130,86,.28); border-radius: 16px; background: rgba(0,0,0,.2); }
.policy-content h2 { margin: 0 0 10px; font-size: 19px; color: #D9BD98; }
.policy-content p { margin: 0 0 10px; color: rgba(240,228,210,.82); line-height: 1.7; }
.policy-content p:last-child { margin-bottom: 0; }
.policy-content a { color: #D9BD98; }
.footer-payment-note { display: block; margin-top: 16px; padding: 10px 11px; border-left: 2px solid rgba(217,189,152,.75); border-radius: 2px 8px 8px 2px; background: rgba(217,189,152,.07); color: rgba(240,228,210,.7); font-size: 10px; line-height: 1.55; transition: background .2s ease, color .2s ease; }.footer-payment-note:hover { color: #fff0d8; background: rgba(217,189,152,.13); }

/* Guided custom-order assistant */
.custom-order-launch { margin-top: 24px; display: inline-flex; align-items: center; gap: 13px; padding: 13px 20px; border: 1px solid rgba(217,189,152,.62); border-radius: 999px; background: linear-gradient(135deg, rgba(217,189,152,.16), rgba(168,67,46,.22)); color: #fff3df; font-size: 11px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.custom-order-launch span { font-size: 18px; line-height: 0; transition: transform .25s ease; }
.custom-order-launch:hover { transform: translateY(-2px); box-shadow: 0 13px 34px rgba(168,67,46,.25); background: linear-gradient(135deg, rgba(217,189,152,.25), rgba(168,67,46,.34)); }
.custom-order-launch:hover span { transform: translateX(4px); }
.custom-order-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s ease, visibility .25s ease; }
.custom-order-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.custom-order-backdrop { position: absolute; inset: 0; background: rgba(8,5,4,.78); backdrop-filter: blur(9px); }
.custom-order-panel { position: relative; isolation: isolate; z-index: 1; width: min(100%, 650px); max-height: min(780px, calc(100vh - 40px)); overflow: auto; padding: 31px; border: 1px solid rgba(227,197,143,.38); border-radius: 25px; background: radial-gradient(circle at 90% 0, rgba(168,67,46,.33), transparent 38%), linear-gradient(150deg, #25130f, #100908 70%); box-shadow: 0 28px 90px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08); transform: translateY(12px) scale(.98); transition: transform .3s cubic-bezier(.16,1,.3,1); }
.custom-order-panel > :not(.custom-order-glow) { position: relative; z-index: 1; }.custom-order-glow { position: absolute; z-index: -1; width: 210px; height: 210px; border-radius: 50%; filter: blur(55px); opacity: .22; pointer-events: none; }.custom-order-glow-one { top: -110px; right: -75px; background: #d9694c; }.custom-order-glow-two { bottom: -150px; left: -95px; background: #d8ad70; }
.is-open .custom-order-panel { transform: translateY(0) scale(1); }
.custom-order-close { position: absolute; top: 17px; right: 17px; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; color: #fff; font-size: 22px; line-height: 1; }
.custom-order-head { padding-right: 42px; }.custom-order-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; color: #fff5e4; font-size: 10px; letter-spacing: .12em; }.custom-order-brand b { display: block; font-size: 10px; }.custom-order-brand small { display: block; margin-top: 4px; color: rgba(255,244,227,.58); font-size: 9px; letter-spacing: .06em; }.custom-order-brand small i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background:#64d18a; box-shadow: 0 0 8px #64d18a; }.custom-order-avatar,.custom-order-mini-avatar { display: grid; place-items: center; border: 1px solid rgba(245,211,154,.64); border-radius: 50%; background: linear-gradient(135deg,#7b271d,#d8ad70); color: #fff9ef; font-family:'Game Of Squids','Playfair Display',serif; font-weight: 900; box-shadow: 0 7px 18px rgba(0,0,0,.3); }.custom-order-avatar { width: 35px; height: 35px; font-size: 11px; }.custom-order-eyebrow { color: #d9bd98; font-size: 10px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; }
.custom-order-head h2 { margin: 9px 0 7px; color: #fff4e3; font-family: 'Game Of Squids','Playfair Display',serif; font-size: clamp(26px,5vw,38px); letter-spacing: .03em; }.custom-order-head p { margin: 0; color: rgba(255,244,227,.62); font-size: 13px; line-height: 1.6; }
.custom-order-progress { display: flex; gap: 6px; margin: 24px 0 18px; }.custom-order-progress span { height: 3px; flex: 1; border-radius: 8px; background: rgba(255,255,255,.11); }.custom-order-progress span.is-active { background: linear-gradient(90deg,#b55842,#e2c08d); }
.custom-order-chat-wrap { display:flex; align-items:flex-end; gap:9px; }.custom-order-mini-avatar { flex: 0 0 auto; width: 26px; height: 26px; margin-bottom: 1px; font-size: 8px; }.custom-order-chat { flex:1; min-height: 82px; padding: 17px; border: 1px solid rgba(255,255,255,.11); border-radius: 16px 16px 16px 4px; background: linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.035)); color: #f9eee1; font-size: 14px; line-height: 1.6; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }.custom-order-chat strong { color: #e7c795; }.custom-order-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 15px; }
.custom-weight-control { width: 100%; padding: 16px; border: 1px solid rgba(217,189,152,.22); border-radius: 13px; background: rgba(255,255,255,.035); }.custom-weight-control input { width: 100%; accent-color: #cb8f5d; cursor: grab; }.custom-weight-control div { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; }.custom-weight-control b { color: #f5d59e; font-size: 16px; }.custom-weight-control span { color: rgba(255,255,255,.48); font-size: 10px; }
.custom-choice { min-height: 42px; padding: 10px 14px; border: 1px solid rgba(217,189,152,.25); border-radius: 11px; background: rgba(255,255,255,.035); color: #fff2df; font-size: 12px; font-weight: 800; transition: background .2s ease, transform .2s ease, border-color .2s ease; }.custom-choice:hover { transform: translateY(-1px); border-color: rgba(217,189,152,.75); background: rgba(217,189,152,.14); }.custom-choice.is-primary { width: 100%; border: 0; background: linear-gradient(120deg,#9d3d2c,#d0a76d); color: white; letter-spacing: .08em; text-transform: uppercase; }
.custom-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.custom-product-choice { min-height:105px; padding:15px; text-align:left; background: linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025)); }.custom-product-choice:hover { background: linear-gradient(145deg,rgba(217,189,152,.22),rgba(168,67,46,.14)); box-shadow:0 10px 25px rgba(0,0,0,.18); }.custom-product-choice > span:nth-child(2) { display:block; margin-top:10px; font-size:13px; }.custom-product-choice small { display:block; margin-top:4px; color:rgba(255,244,227,.5); font-size:9px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }.custom-choice-icon { display:grid; place-items:center; width:28px; height:28px; border:1px solid rgba(227,197,143,.4); border-radius:8px; color:#f2ca8d; font-size:15px; }
.custom-order-summary { margin-top: 17px; padding: 15px; border-left: 3px solid #d6ae77; border-radius: 3px 12px 12px 3px; background: rgba(217,189,152,.09); color: #f4e4ce; font-size: 12px; line-height: 1.7; }.custom-order-summary b { color: #fff; }
@media (max-width: 600px) { .custom-order-modal { padding: 10px; align-items: end; }.custom-order-panel { max-height: calc(100vh - 20px); padding: 25px 19px 21px; border-radius: 22px 22px 14px 14px; }.custom-order-actions { gap: 7px; }.custom-choice { flex: 1 1 calc(50% - 7px); }.custom-choice.is-primary { flex-basis: 100%; }.custom-order-head h2 { font-size: 29px; } }

/* Inline, mobile-first order studio: it expands in the product section instead of opening a side popup. */
.custom-order-modal.custom-order-inline { position: relative; inset: auto; display: none; width: 100%; max-width: 650px; margin: 30px auto 0; padding: 0; opacity: 1; visibility: visible; pointer-events: auto; }.custom-order-modal.custom-order-inline.is-open { display: block; animation: customOrderReveal .42s cubic-bezier(.16,1,.3,1) both; }.custom-order-inline .custom-order-backdrop { display: none; }.custom-order-inline .custom-order-panel { max-height: none; overflow: visible; }.custom-order-inline .custom-order-close { display: grid; place-items: center; }.custom-order-inline .custom-choice { min-height: 48px; }.custom-order-inline .custom-order-actions > .custom-choice:not(.is-primary):last-child { color: rgba(255,244,227,.68); }.custom-order-inline .custom-order-actions > .custom-choice:not(.is-primary):last-child:hover { color: #fff; }
@keyframes customOrderReveal { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@media (max-width: 600px) { .custom-order-modal.custom-order-inline { margin-top: 22px; }.custom-order-inline .custom-order-panel { width: 100%; padding: 24px 17px 20px; border-radius: 20px; }.custom-order-inline .custom-order-actions { gap: 8px; }.custom-order-inline .custom-product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.custom-order-inline .custom-product-choice { min-height: 96px; padding: 13px; }.custom-order-inline .custom-choice { font-size: 12px; padding: 11px 10px; }.custom-order-inline .custom-choice.is-primary { width: 100%; }.custom-order-inline .custom-weight-control { padding: 14px; }.custom-order-inline .custom-order-head p { font-size: 12px; }.custom-order-inline .custom-order-chat { font-size: 13px; padding: 14px; } }

/* Modern scroll reveal: short, smooth and based only on opacity/transform. */
.modern-section-reveal,
.modern-card-reveal {
  opacity: 0 !important;
  transform: translate3d(0, 38px, 0) scale(.985) !important;
  transition:
    opacity .72s cubic-bezier(.16, 1, .3, 1),
    transform .82s cubic-bezier(.16, 1, .3, 1) !important;
  transition-delay: calc(var(--reveal-order, 0) * 75ms) !important;
  will-change: opacity, transform, filter;
}
.modern-section-reveal.modern-reveal-in,
.modern-card-reveal.modern-reveal-in {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}
@media (max-width: 768px) {
  .modern-section-reveal,
  .modern-card-reveal {
    transform: translate3d(0, 24px, 0) scale(.99) !important;
    transition-duration: .55s, .62s !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .modern-section-reveal,
  .modern-card-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ==================== PRELOADER: SLIDE TO ENTER ==================== */
#trc-preloader{
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(55% 55% at 14% 12%, rgba(124,58,237,0.22) 0%, rgba(124,58,237,0) 60%),
    radial-gradient(55% 55% at 88% 90%, rgba(34,211,238,0.16) 0%, rgba(34,211,238,0) 60%),
    #060608;
  z-index:99999;
  overflow:hidden;
  padding:20px;
}
#trc-preloader .trc-grid-bg{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image: radial-gradient(85% 85% at 50% 45%, #000 40%, transparent 100%);
  mask-image: radial-gradient(85% 85% at 50% 45%, #000 40%, transparent 100%);
}
#trc-preloader .trc-glow{
  position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none;
  animation: trc-glowBreathe 6s ease-in-out infinite;
}
#trc-preloader .trc-glow-a{
  width:46vw; height:46vw; max-width:520px; max-height:520px;
  top:-10%; left:-10%;
  background:radial-gradient(circle, rgba(147,51,234,0.45) 0%, rgba(147,51,234,0) 70%);
}
#trc-preloader .trc-glow-b{
  width:42vw; height:42vw; max-width:480px; max-height:480px;
  bottom:-12%; right:-10%;
  background:radial-gradient(circle, rgba(34,211,238,0.35) 0%, rgba(34,211,238,0) 70%);
  animation-delay:1.5s;
}
@keyframes trc-glowBreathe{
  0%,100%{ opacity:.75; transform:scale(1); }
  50%{ opacity:1; transform:scale(1.12); }
}

#trc-preloader .trc-particles{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
#trc-preloader .trc-particles span{
  position:absolute; border-radius:50%; opacity:0;
  animation: trc-particleDrift 8s ease-in infinite;
}
@keyframes trc-particleDrift{
  0%{ transform:translateY(0) translateX(0) scale(0.6); opacity:0; }
  12%{ opacity:.85; }
  55%{ opacity:.9; }
  85%{ opacity:.3; }
  100%{ transform:translateY(-115vh) translateX(var(--dx,20px)) scale(1.1); opacity:0; }
}

#trc-preloader .trc-glass-card{
  position:relative; z-index:2;
  width:min(420px, 100%);
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:16px;
  padding:clamp(28px, 6vw, 44px) clamp(22px, 5vw, 36px);
  border-radius:28px;
  background:rgba(255,255,255,0.045);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 30px 80px rgba(0,0,0,0.55),
    0 1px 0 rgba(255,255,255,0.06) inset;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  opacity:0; transform: translateY(14px) scale(0.98);
  animation: trc-cardIn .8s cubic-bezier(.16,1,.3,1) .15s forwards;
}
@keyframes trc-cardIn{ to{ opacity:1; transform:translateY(0) scale(1); } }

#trc-preloader .trc-mark{
  position:relative; width:56px; height:56px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:2px;
}
#trc-preloader .trc-mark svg{
  width:44px; height:44px; position:relative; z-index:1;
  filter: drop-shadow(0 0 14px rgba(192,132,252,0.5));
  animation: trc-markIn 1s cubic-bezier(.16,1,.3,1) .35s both;
}
@keyframes trc-markIn{
  0%{ opacity:0; transform:scale(0.6) rotate(-8deg); }
  100%{ opacity:1; transform:scale(1) rotate(0deg); }
}
#trc-preloader .trc-mark-glow{
  position:absolute; inset:-14px; border-radius:50%;
  background:radial-gradient(circle, rgba(192,132,252,0.45) 0%, rgba(192,132,252,0) 70%);
  filter:blur(10px);
  animation: trc-markGlow 2.4s ease-in-out infinite;
}
@keyframes trc-markGlow{
  0%,100%{ opacity:.5; transform:scale(0.92); }
  50%{ opacity:1; transform:scale(1.1); }
}

#trc-preloader .trc-cat-label{
  font-family:'Outfit', sans-serif; font-weight:600; font-size:11px;
  letter-spacing:0.32em; text-transform:uppercase;
  color:rgba(216,180,254,0.75);
  margin:0;
}
#trc-preloader .trc-heading{
  font-family:'Outfit', sans-serif; font-weight:800;
  font-size:clamp(24px, 5.2vw, 32px); line-height:1.15;
  color:#f5f5f7; margin:0;
}
#trc-preloader .trc-heading span{
  background: linear-gradient(90deg, #c084fc, #67e8f9, #c084fc);
  background-size:220% auto;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation: trc-textSweep 4.5s linear infinite;
}
#trc-preloader .trc-sub-desc{
  font-family:'Outfit', sans-serif; font-weight:400; font-size:13.5px; line-height:1.55;
  color:rgba(228,228,231,0.62);
  max-width:320px; margin:0 0 4px;
}

#trc-preloader .trc-enter-wrap{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:12px;
  width:100%; margin-top:6px;
}
#trc-preloader .trc-slide-track{
  position:relative;
  width:100%; max-width:300px;
  height:64px;
  border-radius:999px;
  background: rgba(255,255,255,0.045);
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:
    0 18px 40px rgba(0,0,0,0.5),
    0 1px 0 rgba(255,255,255,0.08) inset,
    0 -1px 0 rgba(0,0,0,0.4) inset;
  display:flex; align-items:center;
  overflow:hidden;
  touch-action:none;
}
#trc-preloader .trc-slide-fill{
  position:absolute; top:0; left:0; height:100%; width:58px;
  background: linear-gradient(90deg, rgba(147,51,234,0.45), rgba(96,165,250,0.4), rgba(34,211,238,0.4));
  box-shadow: 0 0 24px rgba(103,232,249,0.35);
  pointer-events:none;
}
#trc-preloader .trc-slide-text{
  position:relative; z-index:1;
  width:100%; text-align:center;
  font-family:'Outfit', sans-serif; font-weight:600; font-size:12.5px;
  letter-spacing:0.2em; text-transform:uppercase;
  color:rgba(237,233,254,0.8);
  pointer-events:none;
  user-select:none;
}
#trc-preloader .trc-slide-handle{
  position:absolute; top:5px; left:5px;
  width:54px; height:54px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(circle at 32% 28%, #c4b5fd 0%, #9333ea 55%, #7e22ce 100%);
  box-shadow:
    0 8px 22px rgba(147,51,234,0.55),
    0 0 0 1px rgba(255,255,255,0.12) inset,
    0 2px 4px rgba(255,255,255,0.45) inset;
  cursor:grab;
  z-index:2;
  touch-action:none;
  transition: transform .12s ease;
  outline:none;
}
#trc-preloader .trc-slide-handle svg{ width:22px; height:22px; position:relative; z-index:2; }
#trc-preloader .trc-handle-pulse{
  position:absolute; inset:-8px; border-radius:50%;
  border:2px solid rgba(192,132,252,0.55);
  animation: trc-handlePulse 1.8s ease-out infinite;
  pointer-events:none;
}
#trc-preloader .trc-handle-pulse.is-stopped{ animation:none; opacity:0; }
@keyframes trc-handlePulse{
  0%{ transform:scale(0.85); opacity:.9; }
  100%{ transform:scale(1.55); opacity:0; }
}
#trc-preloader .trc-slide-handle.is-dragging{ cursor:grabbing; }
#trc-preloader .trc-slide-handle:focus-visible{
  box-shadow:
    0 8px 22px rgba(147,51,234,0.55),
    0 0 0 3px rgba(255,255,255,0.55);
}
#trc-preloader .trc-enter-hint{
  font-family:'Outfit', sans-serif; font-size:10.5px; letter-spacing:0.24em; text-transform:uppercase;
  color:rgba(228,228,231,0.4);
  opacity:0; transition: opacity .6s ease;
}
#trc-preloader .trc-enter-hint.is-shown{ opacity:1; }

#trc-preloader .trc-glass-card.trc-card-done{
  animation: trc-cardOut .5s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes trc-cardOut{ to{ opacity:0; transform: translateY(-10px) scale(0.97); } }

#trc-preloader .trc-burst{
  position:absolute; left:50%; top:50%; z-index:2;
  width:10px; height:10px; border-radius:50%;
  transform:translate(-50%,-50%) scale(0);
  background:radial-gradient(circle, rgba(232,213,255,0.9) 0%, rgba(192,132,252,0.55) 35%, rgba(103,232,249,0) 70%);
  pointer-events:none; opacity:0;
}
#trc-preloader .trc-burst.is-firing{
  animation: trc-burstPop .8s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes trc-burstPop{
  0%{ transform:translate(-50%,-50%) scale(0); opacity:.9; }
  60%{ opacity:.6; }
  100%{ transform:translate(-50%,-50%) scale(38); opacity:0; }
}

#trc-preloader .trc-welcome-text{
  position:absolute; left:0; right:0; z-index:3; text-align:center;
  font-family:'Outfit', sans-serif; font-weight:700;
  font-size:clamp(20px, 4.6vw, 28px); line-height:1.3;
  color:#f5f5f7;
  opacity:0; transform: scale(0.94);
  transition: opacity .6s ease, transform .6s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
#trc-preloader .trc-welcome-text span{
  display:block; margin-top:6px;
  font-weight:800;
  font-size:clamp(26px, 6vw, 38px);
  background: linear-gradient(90deg, #c084fc, #67e8f9, #c084fc);
  background-size:220% auto;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation: trc-textSweep 4.5s linear infinite;
}
@keyframes trc-textSweep{ 0%{background-position:0% center;} 100%{background-position:220% center;} }
#trc-preloader .trc-welcome-text.is-shown{ opacity:1; transform: scale(1); }

#trc-preloader.trc-leaving{ animation: trc-fadeOutShell .8s ease forwards; }
@keyframes trc-fadeOutShell{ to{ opacity:0; visibility:hidden; } }
body.trc-loading{ overflow:hidden; }

@media (max-width:480px){
  #trc-preloader .trc-glass-card{ gap:14px; }
}

@media (prefers-reduced-motion: reduce) {
  #trc-preloader .trc-glass-card,
  #trc-preloader .trc-slide-handle,
  #trc-preloader .trc-slide-fill,
  #trc-preloader .trc-slide-text,
  #trc-preloader .trc-welcome-text,
  #trc-preloader .trc-heading span,
  #trc-preloader .trc-welcome-text span,
  #trc-preloader .trc-glow,
  #trc-preloader .trc-particles span,
  #trc-preloader .trc-mark svg,
  #trc-preloader .trc-mark-glow,
  #trc-preloader .trc-handle-pulse,
  #trc-preloader .trc-burst{ transition:none; animation:none; }
  #trc-preloader .trc-glass-card{ opacity:1; transform:none; }
  #trc-preloader .trc-particles{ display:none; }
}

/* ---------- Mobile fix: keep the 3D coverflow rotation, but the active
   (front) card was being over-magnified by the perspective/translateZ
   projection on narrow screens, pushing its text past the viewport
   edges. We widen the base card to ~88vw (so it reads as the "perfect
   size" ~90% width card at rest) and script.js now uses a much larger
   perspective distance on mobile so that projection magnification stays
   subtle instead of blowing the card up 2-3x. */
@media (max-width: 640px) {
  .fan-card {
    width: 56vw;
    max-width: 208px;
    border-radius: 18px;
  }
  .fan-card .fan-media { aspect-ratio: 3 / 4; }
  .fan-card .fan-panel { padding: 12px 14px 16px; }
  .fan-card .fan-title { font-size: 14px; }
  .fan-card .fan-sub { font-size: 10.5px; }
}


/* ============================================================
   APPOINTMENT BOOKING
   ============================================================ */
.trc-appointment-link {
  appearance: none;
  border: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  background: transparent;
  padding: 0;
}

.trc-appointment-link:hover,
.trc-appointment-link:focus-visible {
  color: #f2f2f2;
}

.trc-appointment-link:focus-visible {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.5);
  border-radius: 10px;
}

.appointment-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .28s ease, visibility .28s ease;
}

.appointment-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.appointment-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.appointment-card {
  position: relative;
  z-index: 1;
  width: min(100%, 520px);
  max-height: min(90vh, 720px);
  overflow: auto;
  padding: 34px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(168,67,46,.18), transparent 35%),
    linear-gradient(160deg, rgba(30,10,16,.96), rgba(8,3,6,.98));
  border: 1px solid rgba(192,138,82,.42);
  box-shadow:
    0 35px 100px rgba(0,0,0,.8),
    0 0 60px rgba(168,67,46,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
  transform: translateY(18px) scale(.98);
  transition: transform .32s cubic-bezier(.16,1,.3,1);
}

.appointment-modal.is-open .appointment-card {
  transform: translateY(0) scale(1);
}

.appointment-close {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: #fff;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}

.appointment-close:hover {
  background: rgba(255,255,255,.12);
  transform: rotate(90deg);
}

.appointment-kicker {
  color: #d9b98a;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.appointment-title {
  margin: 0;
  color: #fff;
  font-family: 'Cinzel', 'Game Of Squids', serif !important;
  font-size: clamp(25px, 6vw, 36px);
  line-height: 1.15;
  letter-spacing: .06em;
}

.appointment-subtitle {
  margin: 12px 0 24px;
  color: rgba(255,255,255,.68);
  font-size: 13px;
  line-height: 1.7;
}

.appointment-form {
  display: grid;
  gap: 16px;
}

.appointment-field {
  display: grid;
  gap: 8px;
}

.appointment-field > span {
  color: rgba(255,255,255,.78);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.appointment-field input {
  width: 100%;
  min-height: 50px;
  padding: 0 14px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.055);
  color: #fff;
  outline: none;
  color-scheme: dark;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.appointment-field input:focus {
  border-color: rgba(192,138,82,.7);
  background: rgba(255,255,255,.075);
  box-shadow: 0 0 0 3px rgba(168,67,46,.13);
}

.appointment-summary {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 13px;
  background: rgba(168,67,46,.08);
  border: 1px solid rgba(168,67,46,.2);
}

.appointment-summary span {
  color: rgba(255,255,255,.48);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.appointment-summary strong {
  color: #f5dfbd;
  font-size: 14px;
  font-weight: 700;
}

.appointment-confirm-btn {
  min-height: 52px;
  border: 0;
  border-radius: 14px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: linear-gradient(135deg, #4A2418, #A8432E 55%, #C08A52);
  color: #fff;
  font-family: 'Cinzel', serif !important;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 10px 35px rgba(168,67,46,.28), inset 0 1px 0 rgba(255,255,255,.25);
  transition: transform .2s ease, box-shadow .2s ease;
}

.appointment-confirm-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 42px rgba(168,67,46,.42), inset 0 1px 0 rgba(255,255,255,.3);
}

.appointment-confirm-btn:active {
  transform: scale(.98);
}

.appointment-note {
  margin: 0;
  text-align: center;
  color: rgba(255,255,255,.42);
  font-size: 10px;
  line-height: 1.5;
}

.appointment-note strong {
  color: rgba(255,255,255,.7);
}

body.appointment-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .appointment-modal {
    align-items: flex-end;
    padding: 10px;
  }

  .appointment-card {
    width: 100%;
    max-height: 92vh;
    padding: 28px 20px 22px;
    border-radius: 22px;
  }

  .appointment-title {
    padding-right: 36px;
  }

  .trc-appointment-link .trc-icon {
    width: clamp(18px, 5vw, 20px);
    height: clamp(18px, 5vw, 20px);
  }
}


/* Compact glowing appointment icon */
.trc-appointment-link {
  position: relative;
  width: 44px;
  min-width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
}
.trc-appointment-link .appointment-glow-icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #f2a65a;
  background: rgba(242, 166, 90, .08);
  border: 1px solid rgba(242, 166, 90, .45);
  box-shadow: 0 0 8px rgba(242,166,90,.35), 0 0 18px rgba(242,166,90,.15);
  animation: appointmentIconGlow 2s ease-in-out infinite;
  transition: transform .25s ease, box-shadow .25s ease;
}
.trc-appointment-link .appointment-glow-icon svg { width: 17px; height: 17px; }
.trc-appointment-link:hover .appointment-glow-icon,
.trc-appointment-link:focus-visible .appointment-glow-icon {
  transform: scale(1.1);
  box-shadow: 0 0 12px rgba(242,166,90,.7), 0 0 26px rgba(242,166,90,.3);
}
@keyframes appointmentIconGlow {
  0%, 100% { box-shadow: 0 0 7px rgba(242,166,90,.28), 0 0 16px rgba(242,166,90,.12); }
  50% { box-shadow: 0 0 12px rgba(242,166,90,.65), 0 0 26px rgba(242,166,90,.28); }
}
@media (max-width: 700px) {
  .trc-appointment-link { width: 40px; min-width: 40px; height: 40px; }
  .trc-appointment-link .appointment-glow-icon { width: 28px; height: 28px; }
}



/* ============================================================
   PROVENANCE — EDITORIAL / NEWSPAPER V2
   Visual-only treatment. Existing text, colors and video remain.
   ============================================================ */
.provenance-newspaper{
  --news-rule: rgba(218,190,151,.28);
  --news-rule-soft: rgba(255,255,255,.10);
  --news-paper: rgba(28,18,15,.32);
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  background:
    radial-gradient(circle at 12% 18%, rgba(192,138,82,.075), transparent 28%),
    radial-gradient(circle at 88% 72%, rgba(168,67,46,.055), transparent 30%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 5px);
}

/* A restrained newspaper frame around the entire spread. */
.provenance-newspaper::before{
  content:"";
  position:absolute;
  inset:24px;
  border-top:1px solid var(--news-rule);
  border-bottom:1px solid var(--news-rule);
  pointer-events:none;
  z-index:0;
}

.provenance-newspaper::after{
  content:"THE RED COCKS  •  PROVENANCE EDITION  •  VERIFIED ARCHIVE";
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  padding:0 16px;
  font:600 8px/1.4 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(218,190,151,.62);
  background:#070506;
  z-index:2;
}

/* Editorial rules across the content area. */
.provenance-newspaper > .max-w-6xl{
  position:relative;
  padding-top:34px;
  padding-bottom:34px;
}

.provenance-newspaper > .max-w-6xl::before,
.provenance-newspaper > .max-w-6xl::after{
  content:"";
  display:block;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--news-rule), transparent);
}

.provenance-newspaper > .max-w-6xl::before{
  margin-bottom:34px;
}

.provenance-newspaper > .max-w-6xl::after{
  margin-top:34px;
}

/* Turn the main row into an editorial spread. */
.provenance-newspaper > .max-w-6xl > .flex{
  display:grid !important;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr) !important;
  align-items:start !important;
  gap:clamp(28px,5vw,72px) !important;
  margin-bottom:0 !important;
}

/* Left article column. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child{
  position:relative;
  padding-right:clamp(18px,3vw,44px);
  border-right:1px solid var(--news-rule);
}

.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child::before{
  content:"01  /  PROVENANCE";
  display:block;
  margin-bottom:16px;
  padding-bottom:10px;
  border-bottom:1px solid var(--news-rule-soft);
  font:700 9px/1 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.24em;
  color:rgba(218,190,151,.58);
}

/* Make the badge read like an editorial kicker instead of a pill. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child > div:first-child{
  display:inline-block;
  border-radius:0 !important;
  background:transparent !important;
  border-left:0 !important;
  border-right:0 !important;
  border-top:1px solid rgba(192,138,82,.55) !important;
  border-bottom:1px solid rgba(192,138,82,.55) !important;
  box-shadow:none !important;
  padding:8px 0 !important;
  margin-bottom:18px !important;
}

/* Editorial headline treatment without changing its existing color. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child h2{
  font-family:"Playfair Display",Georgia,serif !important;
  font-weight:800 !important;
  letter-spacing:.035em !important;
  line-height:.98 !important;
  margin-bottom:24px !important;
  max-width:11ch;
}

/* Article copy gets a newspaper-like measure. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child > .flex.gap-4{
  max-width:62ch;
  padding-top:16px;
  border-top:1px solid var(--news-rule-soft);
  position:relative;
}

.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child > .flex.gap-4::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-14px;
  border-bottom:1px solid var(--news-rule-soft);
}

/* Dossier becomes a framed newspaper information box. */
.provenance-newspaper .heritage-plate{
  border-radius:2px !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 18%, transparent 82%, rgba(255,255,255,.018)),
    rgba(17,10,10,.72) !important;
  border:1px solid var(--news-rule) !important;
  box-shadow:inset 0 0 0 5px rgba(255,255,255,.012), 0 18px 50px rgba(0,0,0,.20) !important;
  margin-top:30px;
}

.provenance-newspaper .heritage-row{
  border-radius:0 !important;
}

/* Video becomes the right-hand newspaper photo plate. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:last-child{
  position:relative;
  padding-top:34px;
}

.provenance-newspaper > .max-w-6xl > .flex > .w-full:last-child::before{
  content:"02  /  VISUAL RECORD";
  position:absolute;
  top:0;
  left:0;
  right:0;
  padding-bottom:10px;
  border-bottom:1px solid var(--news-rule);
  font:700 9px/1 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.24em;
  color:rgba(218,190,151,.58);
}

.provenance-newspaper .ceo-photocard{
  border:1px solid var(--news-rule);
  padding:10px;
  background:rgba(12,8,8,.72);
  box-shadow:0 24px 60px rgba(0,0,0,.30);
}

.provenance-newspaper .ceo-photocard::after{
  content:"THE RED COCKS  •  CERTIFIED STANDARD";
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(4,3,3,.78);
  border-top:1px solid rgba(218,190,151,.28);
  font:600 8px/1 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.18em;
  color:rgba(255,255,255,.72);
  pointer-events:none;
}

/* Keep the existing video fully visible; only frame it. */
.provenance-newspaper .ceo-photocard video{
  filter:saturate(.96) contrast(1.02);
}

/* Editorial drop-cap-like emphasis, while preserving the paragraph color. */
.provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child > .flex.gap-4 p{
  text-align:left;
  text-wrap:pretty;
}

/* Mobile: turn the spread into a single clean newspaper column. */
@media (max-width:900px){
  .provenance-newspaper::before{inset:14px;}
  .provenance-newspaper::after{
    font-size:7px;
    letter-spacing:.16em;
    max-width:90vw;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .provenance-newspaper > .max-w-6xl > .flex{
    grid-template-columns:1fr !important;
    gap:38px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child{
    padding-right:0;
    border-right:0;
    border-bottom:1px solid var(--news-rule);
    padding-bottom:34px;
  }

  .provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child h2{
    max-width:none;
  }

  .provenance-newspaper > .max-w-6xl > .flex > .w-full:last-child{
    padding-top:34px;
  }
}

@media (max-width:560px){
  .provenance-newspaper::before{inset:10px;}
  .provenance-newspaper > .max-w-6xl{
    padding-top:28px;
    padding-bottom:28px;
  }
  .provenance-newspaper > .max-w-6xl > .flex > .w-full:first-child h2{
    font-size:clamp(2rem,11vw,3rem) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .provenance-newspaper *,
  .provenance-newspaper *::before,
  .provenance-newspaper *::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}



/* ============================================================
   PROVENANCE — ACTUAL NEWSPAPER PAGE / EDITORIAL SPREAD
   ============================================================ */

.provenance-newspaper{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  padding:clamp(22px,4vw,54px) 0 !important;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,220,170,.055), transparent 30%),
    radial-gradient(circle at 85% 90%, rgba(122,62,34,.08), transparent 35%),
    linear-gradient(180deg, rgba(30,23,21,.96), rgba(13,10,10,.98)) !important;
}

/* The page of paper: visible edges, rules and print-like grain. */
.provenance-newspaper > .max-w-6xl{
  position:relative !important;
  max-width:min(1180px, calc(100% - 32px)) !important;
  padding:clamp(22px,3.5vw,48px) clamp(20px,4vw,58px) !important;
  border:1px solid rgba(218,190,151,.38);
  background:
    linear-gradient(rgba(255,255,255,.018) 50%, transparent 50%) 0 0/100% 4px,
    radial-gradient(rgba(255,255,255,.025) .6px, transparent .7px) 0 0/5px 5px,
    rgba(19,14,13,.94);
  box-shadow:
    0 24px 70px rgba(0,0,0,.36),
    inset 0 0 0 1px rgba(255,255,255,.025);
}

/* Double newspaper border. */
.provenance-newspaper > .max-w-6xl::before{
  content:"";
  position:absolute;
  inset:9px;
  border:1px solid rgba(218,190,151,.18);
  pointer-events:none;
}

.provenance-newspaper > .max-w-6xl::after{
  content:"";
  position:absolute;
  left:clamp(20px,4vw,58px);
  right:clamp(20px,4vw,58px);
  top:clamp(82px,8vw,112px);
  height:1px;
  background:rgba(218,190,151,.28);
  pointer-events:none;
}

/* Newspaper masthead. */
.provenance-newspaper > .max-w-6xl > .flex:first-child{
  display:block !important;
  text-align:center;
  padding-bottom:clamp(28px,4vw,42px);
  margin-bottom:clamp(26px,4vw,42px) !important;
  border-top:3px double rgba(218,190,151,.5);
  border-bottom:3px double rgba(218,190,151,.5);
}

.provenance-newspaper > .max-w-6xl > .flex:first-child::before{
  content:"THE RED COCKS";
  display:block;
  margin:9px 0 4px;
  font:700 clamp(24px,4vw,46px)/.9 Georgia,"Times New Roman",serif;
  letter-spacing:.13em;
  color:inherit;
}

.provenance-newspaper > .max-w-6xl > .flex:first-child::after{
  content:"EST. 2026  •  PROVENANCE & CRAFT  •  SPECIAL EDITION";
  display:block;
  margin-top:9px;
  font:700 8px/1.3 "Courier New",monospace;
  letter-spacing:.28em;
  opacity:.62;
}

/* The actual content becomes newspaper columns. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
  display:grid !important;
  grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr) !important;
  gap:0 !important;
  align-items:start !important;
}

/* Left article page. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child{
  padding:0 clamp(18px,3vw,42px) 0 0 !important;
  border-right:1px solid rgba(218,190,151,.28);
}

/* Small newspaper section label. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child::before{
  content:"PROVENANCE  /  01";
  display:block;
  width:max-content;
  padding:5px 9px;
  margin-bottom:13px;
  border-top:1px solid currentColor;
  border-bottom:1px solid currentColor;
  font:700 8px/1 "Courier New",monospace;
  letter-spacing:.2em;
  opacity:.7;
}

/* Heading becomes a real newspaper headline. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:900 !important;
  font-size:clamp(42px,6.2vw,78px) !important;
  line-height:.88 !important;
  letter-spacing:-.045em !important;
  text-transform:uppercase;
  margin:0 0 22px !important;
  text-align:left !important;
}

/* Thin headline sub-rule. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2::after{
  content:"";
  display:block;
  width:100%;
  margin-top:18px;
  border-bottom:1px solid rgba(218,190,151,.3);
}

/* Body becomes editorial text with a narrow measure. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4{
  max-width:70ch;
  display:block !important;
  padding:0 !important;
  margin:0 !important;
  columns:2 210px;
  column-gap:28px;
  column-rule:1px solid rgba(218,190,151,.18);
}

.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4 p{
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(14px,1.15vw,17px) !important;
  line-height:1.7 !important;
  text-align:justify;
}

/* Preserve the existing colors while making the dossier a newspaper fact box. */
.provenance-newspaper .heritage-plate{
  margin-top:28px !important;
  border-radius:0 !important;
  border:1px solid rgba(218,190,151,.38) !important;
  border-top:4px double rgba(218,190,151,.42) !important;
  background:rgba(10,8,8,.48) !important;
  box-shadow:none !important;
}

.provenance-newspaper .heritage-plate::before{
  content:"VERIFIED CREDENTIALS";
  display:block;
  padding:0 0 10px;
  margin-bottom:3px;
  border-bottom:1px solid rgba(218,190,151,.2);
  font:700 8px/1 "Courier New",monospace;
  letter-spacing:.22em;
  opacity:.7;
}

/* Right side = newspaper photograph / visual evidence. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child{
  padding:0 0 0 clamp(18px,3vw,42px) !important;
  position:relative;
}

.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::before{
  content:"VISUAL RECORD  /  02";
  display:block;
  padding-bottom:10px;
  margin-bottom:14px;
  border-bottom:1px solid rgba(218,190,151,.25);
  font:700 8px/1 "Courier New",monospace;
  letter-spacing:.2em;
  opacity:.7;
}

.provenance-newspaper .ceo-photocard{
  border-radius:0 !important;
  border:1px solid rgba(218,190,151,.42) !important;
  padding:9px !important;
  background:rgba(8,7,7,.72) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.32) !important;
}

.provenance-newspaper .ceo-photocard::after{
  content:"CERTIFIED STANDARD  •  THE RED COCKS";
  position:absolute;
  left:9px;
  right:9px;
  bottom:9px;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  background:rgba(5,4,4,.86);
  border-top:1px solid rgba(218,190,151,.3);
  font:700 8px/1.2 "Courier New",monospace;
  letter-spacing:.18em;
  color:inherit;
  pointer-events:none;
}

.provenance-newspaper .ceo-photocard video{
  display:block;
  width:100%;
}

/* A small caption line below the photo. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::after{
  content:"ARCHIVAL VISUAL • PROCESSING • VERIFIED";
  display:block;
  padding-top:9px;
  font:700 7px/1.3 "Courier New",monospace;
  letter-spacing:.18em;
  text-align:right;
  opacity:.5;
}

/* Mobile newspaper becomes a single-page editorial. */
@media (max-width:900px){
  .provenance-newspaper > .max-w-6xl{
    max-width:calc(100% - 20px) !important;
    padding:22px 18px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
    grid-template-columns:1fr !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child{
    padding:0 0 28px !important;
    border-right:0;
    border-bottom:1px solid rgba(218,190,151,.28);
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child{
    padding:28px 0 0 !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4{
    columns:1;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
    font-size:clamp(38px,12vw,60px) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .provenance-newspaper *{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}



/* ============================================================
   PROVENANCE — BALANCED EDITORIAL NEWSPAPER
   Final visual correction: compact masthead, balanced columns,
   no oversized empty area.
   ============================================================ */
.provenance-newspaper{
  padding:clamp(42px,6vw,78px) 0 !important;
}

.provenance-newspaper > .max-w-6xl{
  max-width:1180px !important;
  padding:clamp(26px,3vw,42px) clamp(22px,3.5vw,50px) !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(192,138,82,.045), transparent 28%),
    linear-gradient(135deg,rgba(30,20,18,.96),rgba(12,9,10,.98)) !important;
  border:1px solid rgba(192,138,82,.30);
  box-shadow:0 22px 70px rgba(0,0,0,.30);
}

/* Compact editorial header — no giant newspaper masthead. */
.provenance-newspaper > .max-w-6xl > .flex:first-child{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:20px !important;
  text-align:left !important;
  padding:0 0 16px !important;
  margin:0 0 28px !important;
  border-top:0 !important;
  border-bottom:1px solid rgba(192,138,82,.35) !important;
}

.provenance-newspaper > .max-w-6xl > .flex:first-child::before{
  content:"THE RED COCKS  /  EDITORIAL ARCHIVE" !important;
  display:block !important;
  margin:0 !important;
  font:700 10px/1 "JetBrains Mono","Courier New",monospace !important;
  letter-spacing:.22em !important;
  color:rgba(218,190,151,.62) !important;
}

.provenance-newspaper > .max-w-6xl > .flex:first-child::after{
  content:"PROVENANCE  •  2026 EDITION" !important;
  display:block !important;
  margin:0 !important;
  font:700 8px/1 "JetBrains Mono","Courier New",monospace !important;
  letter-spacing:.18em !important;
  opacity:.55;
}

/* Real content spread: left 55%, right 45%, aligned at top. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
  display:grid !important;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr) !important;
  gap:clamp(26px,4vw,52px) !important;
  align-items:start !important;
  margin:0 !important;
}

/* Left editorial article. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child{
  padding:0 clamp(20px,3vw,42px) 0 0 !important;
  border-right:1px solid rgba(192,138,82,.25) !important;
}

/* Small kicker stays compact. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child::before{
  content:"01  /  PROVENANCE" !important;
  display:inline-block;
  padding:6px 9px;
  margin:0 0 14px;
  border-top:1px solid rgba(192,138,82,.42);
  border-bottom:1px solid rgba(192,138,82,.42);
  font:700 8px/1 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.20em;
  opacity:.65;
}

/* IMPORTANT: restore the actual existing title size/position. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
  max-width:none !important;
  font-size:clamp(34px,4.2vw,58px) !important;
  line-height:.98 !important;
  margin:0 0 18px !important;
  text-align:left !important;
  letter-spacing:-.025em !important;
}

.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2::after{
  content:"";
  display:block;
  width:72px;
  margin-top:14px;
  border-bottom:2px solid rgba(192,138,82,.45);
}

/* Body is one readable editorial column, not a huge blank two-column void. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4{
  display:flex !important;
  columns:auto !important;
  max-width:62ch;
  padding:0 !important;
  margin:0 0 22px !important;
  border:0 !important;
}

.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4 p{
  text-align:left !important;
  font-family:inherit !important;
  font-size:clamp(14px,1.1vw,16px) !important;
  line-height:1.7 !important;
}

/* Dossier sits naturally below the article. */
.provenance-newspaper .heritage-plate{
  margin-top:20px !important;
  border-radius:14px !important;
  border:1px solid rgba(192,138,82,.30) !important;
  border-top:1px solid rgba(192,138,82,.42) !important;
  background:linear-gradient(135deg,rgba(45,27,22,.55),rgba(12,9,10,.72)) !important;
  box-shadow:0 12px 34px rgba(0,0,0,.18) !important;
}

/* Video is a proper editorial visual, vertically aligned with title. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child{
  padding:0 !important;
  padding-top:0 !important;
}

.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::before{
  content:"02  /  VISUAL RECORD" !important;
  display:block;
  padding:6px 0 10px;
  margin:0 0 12px;
  border-bottom:1px solid rgba(192,138,82,.25);
  font:700 8px/1 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.20em;
  opacity:.65;
}

.provenance-newspaper .ceo-photocard{
  width:100%;
  border-radius:10px !important;
  padding:8px !important;
  border:1px solid rgba(192,138,82,.35) !important;
  background:rgba(7,5,6,.80) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.30) !important;
}

.provenance-newspaper .ceo-photocard video{
  border-radius:5px;
}

/* Small caption gives the right side editorial character. */
.provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::after{
  content:"CERTIFIED STANDARD  /  HYGIENIC PROCESSING" !important;
  display:block;
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid rgba(192,138,82,.20);
  font:700 8px/1.3 "JetBrains Mono","Courier New",monospace;
  letter-spacing:.16em;
  text-align:right;
  opacity:.55;
}

/* Mobile stays compact and balanced. */
@media (max-width:900px){
  .provenance-newspaper > .max-w-6xl > .flex:first-child{
    align-items:flex-start !important;
    flex-direction:column !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
    grid-template-columns:1fr !important;
    gap:30px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child{
    padding:0 0 28px !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(192,138,82,.25) !important;
  }
}

@media (max-width:560px){
  .provenance-newspaper{
    padding:28px 0 !important;
  }
  .provenance-newspaper > .max-w-6xl{
    max-width:calc(100% - 16px) !important;
    padding:22px 16px !important;
  }
  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
    font-size:clamp(30px,10vw,44px) !important;
  }
}



/* ============================================================
   PROVENANCE — MOBILE-FIRST POLISH
   No blank canvas, compact spacing, content-first composition.
   ============================================================ */
@media (max-width:900px){
  .provenance-newspaper{
    padding:18px 0 26px !important;
    margin:0 !important;
  }

  .provenance-newspaper > .max-w-6xl{
    width:calc(100% - 20px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:20px 16px 22px !important;
    border-radius:14px !important;
    background:
      linear-gradient(135deg,rgba(30,20,18,.98),rgba(10,8,9,.99)) !important;
    box-shadow:0 12px 32px rgba(0,0,0,.25) !important;
  }

  /* Remove desktop newspaper ornaments that create empty-looking space. */
  .provenance-newspaper > .max-w-6xl::before{
    inset:7px !important;
  }
  .provenance-newspaper > .max-w-6xl::after{
    display:none !important;
  }

  /* Compact header. */
  .provenance-newspaper > .max-w-6xl > .flex:first-child{
    display:block !important;
    padding:0 0 13px !important;
    margin:0 0 18px !important;
    border-bottom:1px solid rgba(192,138,82,.30) !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:first-child::before{
    font-size:8px !important;
    letter-spacing:.16em !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:first-child::after{
    margin-top:6px !important;
    font-size:7px !important;
    letter-spacing:.12em !important;
  }

  /* One compact content column. */
  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
    display:flex !important;
    flex-direction:column !important;
    gap:22px !important;
    margin:0 !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child{
    width:100% !important;
    padding:0 0 20px !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(192,138,82,.24) !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child::before{
    margin-bottom:10px !important;
    font-size:7px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
    font-size:clamp(27px,8.5vw,40px) !important;
    line-height:1 !important;
    letter-spacing:-.02em !important;
    margin:0 0 13px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2::after{
    margin-top:10px !important;
    width:52px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4{
    display:block !important;
    max-width:none !important;
    margin:0 0 14px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:first-child > .flex.gap-4 p{
    font-size:14px !important;
    line-height:1.55 !important;
    text-align:left !important;
    margin:0 !important;
  }

  .provenance-newspaper .heritage-plate{
    margin-top:14px !important;
    padding:15px !important;
    border-radius:10px !important;
  }

  /* Video immediately follows the text; no vertical dead space. */
  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child{
    width:100% !important;
    padding:0 !important;
    margin:0 !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::before{
    margin:0 0 9px !important;
    padding-bottom:8px !important;
    font-size:7px !important;
  }

  .provenance-newspaper .ceo-photocard{
    width:100% !important;
    padding:6px !important;
    border-radius:9px !important;
  }

  .provenance-newspaper .ceo-photocard video{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    object-fit:cover !important;
    border-radius:5px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) > .w-full:last-child::after{
    margin-top:7px !important;
    padding-top:7px !important;
    font-size:6.5px !important;
    letter-spacing:.12em !important;
  }
}

@media (max-width:480px){
  .provenance-newspaper > .max-w-6xl{
    width:calc(100% - 12px) !important;
    padding:17px 13px 18px !important;
    border-radius:11px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:first-child{
    margin-bottom:15px !important;
    padding-bottom:10px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child){
    gap:17px !important;
  }

  .provenance-newspaper > .max-w-6xl > .flex:not(:first-child) h2{
    font-size:clamp(25px,8.8vw,34px) !important;
  }

  .provenance-newspaper .heritage-plate{
    padding:12px !important;
    margin-top:11px !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .provenance-newspaper *{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}