.strike-hero{
        --cream: #FBDBAF;
        --muted: rgba(251, 219, 175, 0.72);
        --label: rgba(251, 219, 175, 0.48);
        --orange: #E07020;
        --card: rgba(10, 8, 7, 0.58);
      }
.strike-hero *, .strike-hero *::before, .strike-hero *::after{
        box-sizing: border-box;
      }
.strike-hero{
        margin: 0;
        padding: 0;
        background: #C45A18;
        color: var(--cream);
        overflow-x: hidden;
        font-family: 'Inter', 'Barlow', system-ui, -apple-system, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
.strike-hero h1, .strike-hero h2, .strike-hero h3, .strike-hero .heading-font{
        font-family: 'Orbitron', 'Barlow Condensed', 'Arial Narrow', sans-serif;
        font-weight: 400;
        letter-spacing: 0.02em;
      }
.strike-hero{
        position: relative;
        width: 100%;
        height: 100vh;
        height: 100dvh;
        overflow: hidden;
        background: #C45A18;
        perspective: 1200px;
        perspective-origin: 50% 50%;
      }
.strike-hero .hero-base-img{
        position: absolute;
        inset: 0;
        z-index: 1;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
      }
.strike-hero .hero-reveal-img{
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        -webkit-mask-image: radial-gradient(circle 0px at -999px -999px, #fff, transparent);
        mask-image: radial-gradient(circle 0px at -999px -999px, #fff, transparent);
      }
.strike-hero .hero-ui{
        position: absolute;
        inset: 0;
        z-index: 8;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto 1fr auto;
        padding: 36px 44px 40px;
        pointer-events: none;
        transform-style: preserve-3d;
        will-change: transform;
      }
.strike-hero .hero-left{
        grid-column: 1;
        grid-row: 1 / -1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 28px;
        min-width: 0;
      }
.strike-hero .hero-copy{
        max-width: 520px;
        padding-right: 56px;
        pointer-events: auto;
        transform: translateZ(16px);
        transform-style: preserve-3d;
      }
.strike-hero h1.words-pull-up{
        font-size: clamp(1.55rem, 3.6vw, 3.15rem);
        line-height: 1.05;
        text-transform: uppercase;
        color: var(--cream);
        text-shadow: 0 2px 28px rgba(0, 0, 0, 0.22);
        margin: 0;
      }
.strike-hero .pull-line{
        display: block;
      }
.strike-hero .hero-copy p{
        margin-top: 18px;
        margin-bottom: 0;
        max-width: 340px;
        font-size: 13.5px;
        font-weight: 400;
        line-height: 1.55;
        color: var(--muted);
      }
.strike-hero .icon-row{
        display: flex;
        gap: 10px;
        margin-top: 22px;
      }
.strike-hero .icon-btn{
        width: 38px;
        height: 38px;
        border-radius: 50%;
        border: 1px solid rgba(251, 219, 175, 0.55);
        background: transparent;
        color: var(--cream);
        display: grid;
        place-items: center;
        cursor: pointer;
        padding: 0;
        transition: background 0.25s ease, border-color 0.25s ease;
      }
.strike-hero .icon-btn:hover{
        background: rgba(251, 219, 175, 0.1);
        border-color: var(--cream);
      }
.strike-hero .product-card{
        pointer-events: auto;
        width: min(320px, 100%);
        display: grid;
        grid-template-columns: 86px 1fr;
        grid-template-rows: auto auto;
        gap: 10px 14px;
        padding: 12px;
        border-radius: 18px;
        background: var(--card);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        border: 1px solid rgba(251, 219, 175, 0.08);
        box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
        transform: translateZ(28px);
        transform-style: preserve-3d;
      }
.strike-hero .product-thumb{
        grid-column: 1;
        grid-row: 1 / -1;
        width: 86px;
        min-height: 86px;
        border-radius: 12px;
        overflow: hidden;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
      }
.strike-hero .product-body{
        grid-column: 2;
        grid-row: 1;
      }
.strike-hero .product-body h2{
        font-size: 11px;
        line-height: 1.25;
        text-transform: uppercase;
        color: var(--cream);
        margin: 0;
      }
.strike-hero .product-body p{
        margin-top: 6px;
        margin-bottom: 0;
        font-size: 11.5px;
        line-height: 1.45;
        color: var(--muted);
      }
.strike-hero .cart-btn{
        grid-column: 2;
        grid-row: 2;
        justify-self: start;
        align-self: end;
        border: 1px solid var(--cream);
        border-radius: 999px;
        padding: 7px 16px;
        font-size: 12px;
        font-weight: 500;
        color: var(--cream);
        background: transparent;
        cursor: pointer;
        font-family: inherit;
        transition: border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
      }
.strike-hero .cart-btn:hover{
        transform: translateY(-1px);
      }
.strike-hero .audio-toggle-btn{
        position: absolute;
        top: 36px;
        right: 44px;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 5px 12px;
        background: rgba(10, 8, 7, 0.6);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        border: 1px solid rgba(251, 219, 175, 0.28);
        border-radius: 999px;
        color: var(--cream);
        font-size: 10px;
        font-family: 'Orbitron', 'Barlow Condensed', 'Arial Narrow', sans-serif;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        cursor: pointer;
        pointer-events: auto;
        transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
        z-index: 12;
      }
.strike-hero .audio-toggle-btn:hover{
        border-color: var(--cream);
        background: rgba(251, 219, 175, 0.12);
        transform: translateY(-1px);
      }
.strike-hero .audio-pulse-dot{
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: rgba(251, 219, 175, 0.35);
        transition: background 0.3s ease, box-shadow 0.3s ease;
      }
.strike-hero .audio-toggle-btn.is-active .audio-pulse-dot{
        background: #F28C38;
        box-shadow: 0 0 8px #F28C38;
        animation: pulseHum 2s ease-in-out infinite alternate;
      }
@keyframes pulseHum{
        from {
          opacity: 0.55;
          transform: scale(0.9);
        }
        to {
          opacity: 1;
          transform: scale(1.25);
        }
      }
.strike-hero .specs{
        grid-column: 2;
        grid-row: 3;
        justify-self: end;
        pointer-events: auto;
        width: min(340px, 100%);
        transform: translateZ(20px);
        transform-style: preserve-3d;
      }
.strike-hero .specs h3{
        font-size: 11px;
        text-transform: uppercase;
        margin-top: 0;
        margin-bottom: 14px;
        letter-spacing: 0.12em;
        color: var(--cream);
      }
.strike-hero .spec-row{
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 16px;
        padding: 7px 0;
      }
.strike-hero .spec-row + .spec-row{
        border-top: 1px solid rgba(251, 219, 175, 0.12);
      }
.strike-hero .spec-label{
        font-size: 11px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--label);
      }
.strike-hero .spec-value{
        font-size: 12.5px;
        color: var(--cream);
        text-align: right;
        white-space: nowrap;
      }
@keyframes heroImageIn{
        from {
          opacity: 0;
          transform: scale(1.18);
        }
        to {
          opacity: 1;
          transform: scale(1);
        }
      }
.strike-hero .hero-image-animate{
        opacity: 0;
        animation: heroImageIn 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
        animation-delay: 0.15s;
      }
@keyframes wordPullUp{
        from {
          opacity: 0;
          transform: translateY(20px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
.strike-hero .pull-word{
        display: inline-block;
        opacity: 0;
        transform: translateY(20px);
      }
.strike-hero .pull-word:not(:last-child){
        margin-right: 0.3em;
      }
.strike-hero .words-visible .pull-word{
        animation: wordPullUp 0.55s ease forwards;
      }
@keyframes fadeUp{
        from {
          opacity: 0;
          transform: translateY(14px);
          filter: blur(8px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
          filter: blur(0);
        }
      }
.strike-hero .fade-up-reveal{
        opacity: 0;
        transform: translateY(14px);
        filter: blur(8px);
      }
.strike-hero .fade-up-reveal.is-visible{
        animation: fadeUp 0.7s ease forwards;
      }
.strike-hero .noise-overlay{
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        z-index: 10;
        pointer-events: none;
        opacity: 0.045;
        background-repeat: repeat;
        background-size: 160px 160px;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
        animation: noiseJitter 0.25s steps(4) infinite;
        will-change: transform;
      }
@keyframes noiseJitter{
        0% { transform: translate3d(0, 0, 0); }
        25% { transform: translate3d(-2%, -3%, 0); }
        50% { transform: translate3d(3%, 1%, 0); }
        75% { transform: translate3d(-1%, 2%, 0); }
        100% { transform: translate3d(2%, -2%, 0); }
      }
.strike-hero .neon-canvas{
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 9;
      }
@media (prefers-reduced-motion: reduce){.strike-hero .hero-image-animate, .strike-hero .pull-word, .strike-hero .words-visible .pull-word, .strike-hero .fade-up-reveal, .strike-hero .fade-up-reveal.is-visible, .strike-hero .noise-overlay, .strike-hero .hero-ui, .strike-hero .neon-canvas{
          animation: none !important;
          opacity: 1 !important;
          transform: none !important;
          filter: none !important;
        }
.strike-hero .neon-canvas{
          display: none !important;
        }
.strike-hero .noise-overlay{
          opacity: 0.04 !important;
        }

      }
@media (max-width: 1024px){.strike-hero .hero-ui{
          padding: 32px 28px 36px;
        }
.strike-hero .audio-toggle-btn{
          top: 32px;
          right: 28px;
        }
.strike-hero .specs{
          width: min(300px, 100%);
        }

      }
@media (max-width: 900px){.strike-hero .hero-ui{
          padding: 28px 22px 28px;
        }
.strike-hero .audio-toggle-btn{
          top: 28px;
          right: 22px;
        }
.strike-hero h1.words-pull-up{
          font-size: clamp(1.35rem, 7.2vw, 2.4rem);
        }
.strike-hero .hero-base-img, .strike-hero .hero-reveal-img{
          background-position: 40% center;
        }
.strike-hero .specs{
          width: min(280px, 100%);
        }

      }
@media (max-width: 768px){.strike-hero .hero-ui{
          grid-template-columns: 1fr;
          grid-template-rows: auto 1fr auto;
          padding: max(24px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
        }
.strike-hero .hero-left{
          grid-column: 1;
          grid-row: 1 / 3;
          gap: 24px;
        }
.strike-hero .audio-toggle-btn{
          top: max(24px, env(safe-area-inset-top));
          right: max(20px, env(safe-area-inset-right));
        }
.strike-hero .specs{
          grid-column: 1;
          grid-row: 3;
          justify-self: stretch;
          width: 100%;
          margin-top: 8px;
        }
.strike-hero .hero-base-img, .strike-hero .hero-reveal-img{
          background-position: 40% center;
        }

      }
@media (max-width: 720px){.strike-hero{
          height: auto;
          min-height: 100vh;
          min-height: 100dvh;
        }
.strike-hero .hero-ui{
          position: relative;
          display: flex;
          flex-direction: column;
          min-height: 100vh;
          min-height: 100dvh;
          justify-content: flex-start;
          gap: 28px;
          padding: max(22px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
        }
.strike-hero .hero-left{
          grid-column: auto;
          grid-row: auto;
          width: 100%;
          justify-content: flex-start;
        }
.strike-hero .hero-copy{
          max-width: 100%;
          padding-right: 48px;
        }
.strike-hero .hero-copy p{
          font-size: 12.5px;
          max-width: 100%;
          width: 100%;
        }
.strike-hero .product-card{
          width: 100%;
          max-width: 100%;
        }
.strike-hero .specs{
          width: 100%;
          max-width: 100%;
          margin-top: auto;
          padding-top: 4px;
          justify-self: auto;
        }
.strike-hero .spec-value{
          white-space: normal;
        }
.strike-hero .hero-base-img, .strike-hero .hero-reveal-img{
          position: absolute;
          background-position: 40% center;
        }

      }
@media (max-width: 480px){.strike-hero .hero-ui{
          gap: 22px;
          padding: max(18px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
        }
.strike-hero .audio-toggle-btn{
          top: max(18px, env(safe-area-inset-top));
          right: max(16px, env(safe-area-inset-right));
          padding: 4px 8px;
          font-size: 8.5px;
          gap: 5px;
        }
.strike-hero .audio-status-text{
          max-width: 60px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }
.strike-hero h1.words-pull-up{
          font-size: clamp(1.1rem, 8.5vw, 1.65rem);
        }
.strike-hero .hero-copy p{
          font-size: 12px;
          margin-top: 14px;
        }
.strike-hero .icon-row{
          margin-top: 16px;
          gap: 8px;
        }
.strike-hero .icon-btn{
          width: 34px;
          height: 34px;
        }
.strike-hero .hero-left{
          gap: 22px;
        }
.strike-hero .product-card{
          grid-template-columns: 72px 1fr;
          gap: 8px 12px;
          padding: 10px;
          border-radius: 14px;
        }
.strike-hero .product-thumb{
          width: 72px;
          min-height: 72px;
          border-radius: 10px;
        }
.strike-hero .product-body h2{
          font-size: 10px;
        }
.strike-hero .product-body p{
          font-size: 11px;
        }
.strike-hero .cart-btn{
          padding: 6px 14px;
          font-size: 11px;
        }
.strike-hero .specs h3{
          font-size: 10px;
          margin-bottom: 10px;
        }
.strike-hero .spec-row{
          padding: 6px 0;
          gap: 10px;
        }
.strike-hero .spec-label, .strike-hero .spec-value{
          font-size: 11px;
        }

      }
@media (max-width: 360px){.strike-hero h1.words-pull-up{
          font-size: 1rem;
        }
.strike-hero .product-card{
          grid-template-columns: 64px 1fr;
        }
.strike-hero .product-thumb{
          width: 64px;
          min-height: 64px;
        }

      }

    
/* Integration: keep the landing artwork and make every entry point navigable. */
.strike-hero{height:calc(100svh - 72px);min-height:620px;font-size:16px;isolation:isolate;scroll-margin-top:72px}
.strike-hero .hero-ui{padding-bottom:54px}
.strike-hero .noise-overlay{z-index:3}
.strike-hero .hero-base-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,13,4,.16),transparent 65%)}
.strike-hero a{text-decoration:none}
.strike-hero .icon-btn:focus-visible,.strike-hero .cart-btn:focus-visible,.strike-hero .spec-row:focus-visible,.strike-hero .explore-link:focus-visible{outline-color:var(--cream)}
.strike-hero .spec-label{color:rgba(251,219,175,.82)}
.strike-hero a.spec-row{transition:background .2s,padding .2s}
.strike-hero a.spec-row:hover{background:rgba(0,0,0,.24);padding-left:8px;padding-right:8px}
.strike-hero .explore-link{position:absolute;left:50%;bottom:17px;transform:translateX(-50%);z-index:12;color:var(--cream);font-size:11px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;pointer-events:auto}
.strike-hero .product-body p{line-height:1.45}
.strike-hero .words-pull-up{font-weight:400}
.introduction h2{font-size:clamp(54px,7.6vw,118px)}
.form .direct-email-note{font-size:14px;color:var(--paper)}
@media(max-width:720px){
 .strike-hero{height:auto;min-height:calc(100svh - 72px)}
 .strike-hero .hero-ui{min-height:max(700px,calc(100svh - 72px));padding-bottom:56px}
 .strike-hero .product-card{margin-top:auto;max-width:340px}
 .strike-hero .hero-left{flex:1;gap:180px}
 .strike-hero .specs{margin-top:0;padding:14px 16px;border-radius:14px;background:rgba(10,8,7,.7);backdrop-filter:blur(12px)}
 .strike-hero .hero-base-img,.strike-hero .hero-reveal-img{background-position:56% center}
 .strike-hero .hero-copy{padding-right:90px}
 .strike-hero h1.words-pull-up{font-size:clamp(1rem,5.7vw,1.65rem)}
 .strike-hero .hero-copy p{max-width:210px}
 .strike-hero .hero-base-img::after{background:linear-gradient(180deg,rgba(28,13,4,.32),transparent 55%)}
}
@media(max-width:360px){.strike-hero .hero-copy{padding-right:80px}.strike-hero .hero-copy p{max-width:170px}.strike-hero .audio-toggle-btn{font-size:8px;padding:4px 6px}}
