.elementor-4137 .elementor-element.elementor-element-3181870{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:-80px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-4137 .elementor-element.elementor-element-960f72a{--display:flex;}.elementor-4137 .elementor-element.elementor-element-15a78b8{--display:flex;}.elementor-4137 .elementor-element.elementor-element-f8571e2{--display:flex;}.elementor-4137 .elementor-element.elementor-element-4c62bd4{--display:flex;}.elementor-4137 .elementor-element.elementor-element-7c9932f{--display:flex;}.elementor-4137 .elementor-element.elementor-element-fbe03e5{--display:flex;}.elementor-4137 .elementor-element.elementor-element-fd4a42e{--display:flex;}.elementor-4137 .elementor-element.elementor-element-d31668c{--display:flex;}.elementor-4137 .elementor-element.elementor-element-cf08023{--display:flex;}.elementor-4137 .elementor-element.elementor-element-3485586{--display:flex;}.elementor-4137 .elementor-element.elementor-element-27ab006{--display:flex;}:root{--page-title-display:none;}body.elementor-page-4137{margin:0px 0px 0px 0px;}/* Start custom CSS for container, class: .elementor-element-3181870 *//* ============================================================  
   KRATOS LANDING PAGE — STYLES  
   Paste into: Elementor > the parent container >  
               Advanced > Custom CSS  
   Then give that same container the CSS class:  k1  
   Every rule below is scoped under .k1, so nothing here can  
   reach the Tier 1 theme header, footer, or any other page.  
   ============================================================ */  
.k1, .k1 *, .k1 *::before, .k1 *::after{margin:0;padding:0;box-sizing:border-box}  
  
.k1{  
    --ink:#131211;  
    --gunmetal:#1E1C1A;  
    --panel:#262320;  
    --bone:#EBE7DF;  
    --bone-dim:#B5B0A6;  
    --fde:#8C7A5B;  
    --fde-bright:#A8946F;  
    --crimson:#B3282D;  
    --green:#3E7A4E;  
    --amber:#C08A2D;  
    --red:#B3282D;  
    --hairline:rgba(235,231,223,.14);  
    --maxw:1120px;  
    /* Site heading face, registered as an Elementor custom font. Archivo Black  
     stays as fallback in case the kit is not loaded on a given template. */  
    --font-display: "Thunder Squad", "Archivo Black", sans-serif;  
  }  
@media (prefers-reduced-motion: reduce){  
.k1 *::before, .k1 *::after{animation:none!important;transition:none!important}}  
.k1{  
    background:var(--ink);  
    color:var(--bone);  
    font-family:'Archivo',system-ui,sans-serif;  
    font-size:16px;  
    line-height:1.6;  
    -webkit-font-smoothing:antialiased;  
  }  
.k1 .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}  
.k1 h1, .k1 h2, .k1 h3{font-family:var(--font-display);font-weight:400;line-height:1.1;letter-spacing:-.017em;text-transform:uppercase}  
.k1 .mono{font-family:'IBM Plex Mono',monospace}  
.k1 a{color:inherit}  
  
  /* ---------- top bar ---------- */  
  /* ---------- site header (PREVIEW ONLY — see note in the markup) ---------- */  
.k1 .topbar{  
    position:sticky;top:0;z-index:50;  
    background:rgba(8,8,9,.94);backdrop-filter:blur(10px);  
    border-bottom:1px solid var(--hairline);  
  }  
.k1 .topbar .wrap{  
    display:flex;align-items:center;gap:28px;height:76px;  
    max-width:1560px;  
  }  
  
  /* logo */  
.k1 .brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:0 0 auto}  
.k1 .brand-mark{width:34px;height:34px;flex:0 0 auto;color:var(--bone)}  
.k1 .brand-type{display:flex;flex-direction:column;line-height:1}  
.k1 .brand-type b{font-family:var(--font-display);font-size:23px;letter-spacing:.02em;  
                text-transform:uppercase;color:var(--bone)}  
.k1 .brand-type i{font-style:italic;font-weight:600;font-size:11px;letter-spacing:.34em;  
                text-transform:uppercase;color:var(--bone);align-self:flex-end;margin-top:2px}  
  
  /* primary nav */  
.k1 .site-nav{display:flex;align-items:center;gap:26px;margin-right:auto}  
.k1 .site-nav a{  
    font-size:15px;font-weight:500;color:var(--bone);text-decoration:none;  
    display:inline-flex;align-items:center;gap:5px;padding:6px 0;  
    border-bottom:2px solid transparent;transition:color .18s ease,border-color .18s ease;  
  }  
.k1 .site-nav a:hover{color:var(--fde-bright);border-bottom-color:var(--fde-bright)}  
.k1 .site-nav .caret{width:9px;height:9px;opacity:.75}  
  
  /* utilities */  
.k1 .topbar-cta{display:flex;align-items:center;gap:14px;flex:0 0 auto}  
.k1 .icon-btn{  
    display:inline-flex;align-items:center;justify-content:center;position:relative;  
    width:34px;height:34px;color:var(--bone);text-decoration:none;  
    transition:color .18s ease;  
  }  
.k1 .icon-btn:hover{color:var(--fde-bright)}  
.k1 .icon-btn svg{width:21px;height:21px}  
.k1 .cart-count{  
    position:absolute;top:-3px;right:-5px;min-width:19px;height:19px;padding:0 5px;  
    display:flex;align-items:center;justify-content:center;  
    background:var(--crimson);color:#fff;border-radius:999px;  
    font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;line-height:1;  
  }  
.k1 .topbar .btn{white-space:nowrap}  
  
  /* condensed nav before the burger takes over */  
@media (max-width:1400px){  
.k1 .topbar .wrap{gap:18px}  
.k1 .site-nav{gap:18px}  
.k1 .site-nav a{font-size:14px}}  
@media (max-width:1180px){  
.k1 .site-nav, .k1 .topbar .btn-ghost{display:none}  
.k1 .nav-toggle{display:inline-flex}}  
.k1 .nav-toggle{display:none}  
  
  /* ---------- the rifle (full profile cutout) ---------- */  
.k1 .rifle{  
    padding:88px 0 64px;position:relative;overflow:hidden;  
    /* Vertical lift: lighter behind the upper receiver and rail where any  
       residual light edge pixels sit, settling back to page ink by the base.  
       Replaces the radial pool, which read as a visible oval. */  
    background:linear-gradient(180deg,  
      #24211D 0%, #201E1B 34%, #1A1917 62%, var(--ink) 100%);  
  }  
.k1 .rifle-figure{  
    margin:44px 0 8px;position:relative;  
    /* faint grounding shadow only, no halo */  
    background:radial-gradient(ellipse 58% 22% at 50% 88%,  
               rgba(0,0,0,.55) 0%, transparent 70%);  
  }  
.k1 .rifle-img{  
    width:100%;height:auto;display:block;  
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.55));  
  }  
.k1 .callouts{  
    list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;  
    margin-top:40px;padding-top:32px;border-top:1px solid var(--hairline);  
  }  
.k1 .callouts li{display:grid;gap:7px;align-content:start}  
.k1 .co-n{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;color:var(--fde-bright)}  
.k1 .co-t{font-weight:700;font-size:15px;line-height:1.25}  
.k1 .co-d{font-size:14px;color:var(--bone-dim);line-height:1.5;max-width:34ch}  
@media (max-width:900px){  
.k1 .rifle{padding:64px 0 48px}  
.k1 .callouts{grid-template-columns:repeat(2,1fr);gap:22px}}  
@media (max-width:560px){  
.k1 .callouts{grid-template-columns:1fr}}  
  
  /* Omnisend injects its own markup with its own margins. Scoping the seam  
     here keeps the gap matching the rest of the page. */  
.k1 .omnisend-embed{margin:28px 0 0;max-width:560px}  
.k1 .omnisend-embed > div{margin:0!important}  
.k1 .omnisend-embed form{margin:0!important}  
  
  /* ---------- buttons ---------- */  
.k1 .btn{  
    display:inline-block;text-decoration:none;text-transform:uppercase;  
    font-family:'Archivo',sans-serif;font-weight:600;letter-spacing:.06em;  
    font-size:13px;padding:14px 26px;border:1px solid transparent;  
    transition:background .15s,color .15s,border-color .15s;  
    cursor:pointer;text-align:center;  
  }  
.k1 .btn-primary{background:var(--crimson);color:#fff}  
.k1 .btn-primary:hover{background:#911F24}  
.k1 .btn-ghost{border-color:var(--bone);color:var(--bone);background:transparent}  
.k1 .btn-ghost:hover{background:var(--bone);color:var(--ink)}  
.k1 .btn-fde{background:var(--fde);color:var(--ink)}  
.k1 .btn-fde:hover{background:var(--fde-bright)}  
.k1 .btn-sm{padding:9px 16px;font-size:12px}  
.k1 .btn:focus-visible{outline:2px solid var(--fde-bright);outline-offset:3px}  
  
  /* ---------- hero ---------- */  
  /* ---------- hero (video background) ---------- */  
.k1 .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--hairline);  
        margin-top:-80px;  
        min-height:calc(min(88vh,760px) + 80px);  
        display:flex;align-items:center;  
        padding:176px 0 80px;isolation:isolate}  
  /* width:100% matters — .hero is a flex container, so without it the wrap  
     shrink-wraps to its content and margin:0 auto centers it, knocking the  
     hero off the left gutter every other section aligns to. */  
.k1 .hero .wrap{position:relative;z-index:2;width:100%}  
.k1 .hero-copy{max-width:46ch}  
  /* Hero: copy left, product right. The cutout is bled slightly wider than  
     its column so the barrel reaches toward the edge and the rifle reads as  
     an object in the frame rather than a thumbnail in a box. */  
  .k1 .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}  
  .k1 .hero-rifle{position:relative}  
  .k1 .hero-rifle img{  
    display:block;width:122%;max-width:none;height:auto;  
    filter:drop-shadow(0 22px 34px rgba(0,0,0,.75));  
  }  
  
  /* ---------- hero stacks on tablet and below ----------  
     display:contents on .hero-copy promotes its children to grid items, so  
     the rifle can be re-ordered *between* them without touching the markup.  
     Sequence: eyebrow, headline, rifle, sub, price, buttons. */  
  @media (max-width:1024px){  
    .k1 .hero{padding:132px 0 72px}  
    .k1 .hero-grid{grid-template-columns:1fr;gap:0}  
    .k1 .hero-copy{display:contents}  
  
    .k1 .hero .eyebrow    {order:1}  
    .k1 .hero h1          {order:2}  
    .k1 .hero-rifle       {order:3;margin:10px 0 30px}  
    .k1 .hero .sub        {order:4;max-width:none}  
    .k1 .hero .price-line {order:5}  
    .k1 .hero-ctas        {order:6;flex-direction:column;align-items:stretch;gap:12px}  
    .k1 .hero-ctas .btn   {width:100%;padding:16px 20px;font-size:14px}  
    .k1 .hero-rifle img   {width:106%;margin-left:-3%}  
  }  
  
.k1 .hero-media{position:absolute;inset:0;z-index:0;  
    /* Layered gradient, no video. Warm FDE key light off to the right where  
       the rifle sits, a cool bone rim top-left, over a diagonal ink base.  
       Nothing here is a stock "dark mesh" — the light has a direction. */  
    background:  
      radial-gradient(1100px 640px at 74% 44%, rgba(168,148,111,.22) 0%,  
                                               rgba(168,148,111,.07) 44%, transparent 72%),  
      radial-gradient(760px 520px at 8% 6%,   rgba(235,231,223,.07) 0%, transparent 62%),  
      radial-gradient(900px 700px at 50% 118%, rgba(179,40,45,.10) 0%, transparent 66%),  
      linear-gradient(158deg, #26221E 0%, #1B1917 34%, #131211 64%, #0B0A09 100%);  
  }  
  
  /* Vignette plus fine grain. The grain matters: broad dark gradients band  
     badly on 8-bit displays, and a little noise breaks the steps up. */  
  .k1 .hero-scrim{position:absolute;inset:0;  
    background:  
      radial-gradient(120% 100% at 50% 50%, transparent 42%, rgba(8,8,9,.55) 100%),  
      linear-gradient(90deg, rgba(11,10,9,.72) 0%, rgba(11,10,9,.34) 46%, transparent 78%),  
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");  
    background-blend-mode:normal, normal, overlay;  
  }  
.k1 .eyebrow{  
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.22em;  
    text-transform:uppercase;color:var(--fde-bright);margin-bottom:18px;display:block;  
  }  
.k1 .hero h1{font-size:clamp(40px,5.6vw,68px);margin-bottom:20px}  
.k1 .hero h1 em{font-style:normal;color:var(--fde-bright)}  
.k1 .hero .sub{font-size:18px;color:var(--bone-dim);max-width:44ch;margin-bottom:32px}  
.k1 .price-line{display:flex;align-items:baseline;gap:14px;margin-bottom:28px}  
.k1 .price{font-family:'IBM Plex Mono',monospace;font-size:30px;color:var(--bone)}  
.k1 .price-note{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--bone-dim)}  
.k1 .hero-ctas{display:flex;gap:14px;flex-wrap:wrap}  
.k1 .img-slot{  
    background:var(--panel);  
    border:1px dashed rgba(235,231,223,.25);  
    display:flex;align-items:center;justify-content:center;  
    color:var(--bone-dim);  
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;  
    text-transform:uppercase;text-align:center;padding:16px;  
  }  
.k1 .img-slot.filled{display:block;padding:0;border:1px solid var(--hairline);overflow:hidden;position:relative}  
.k1 .img-slot.filled img{width:100%;height:100%;object-fit:cover;display:block}  
.k1 .teaser-tag{  
    position:absolute;left:0;right:0;bottom:0;  
    background:linear-gradient(transparent, rgba(16,16,16,.92));  
    padding:34px 18px 14px;  
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;  
    text-transform:uppercase;color:var(--bone);  
  }  
.k1 .teaser-tag span{color:var(--fde-bright)}  
  
  /* ---------- build slot gauge (signature element) ---------- */  
.k1 .slot-section{border-bottom:1px solid var(--hairline);background:var(--gunmetal)}  
.k1 .slot-inner{  
    display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;  
    padding:26px 0;  
  }  
.k1 .slot-lamp{  
    width:16px;height:16px;border-radius:50%;  
    box-shadow:0 0 14px 2px currentColor;  
  }  
.k1 .slot-copy{display:flex;flex-direction:column;gap:6px}  
.k1 .slot-headline{font-family:'IBM Plex Mono',monospace;font-size:14px;letter-spacing:.06em;text-transform:uppercase}  
.k1 .slot-meta{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--bone-dim)}  
.k1 .slot-track{  
    grid-column:1 / -1;height:6px;background:rgba(235,231,223,.1);  
    position:relative;overflow:hidden;  
  }  
.k1 .slot-fill{position:absolute;inset:0 auto 0 0;background:currentColor}  
.k1 .state-green{color:var(--green)}  
.k1 .state-amber{color:var(--amber)}  
.k1 .state-red{color:var(--red)}  
.k1 .slot-fill-el{height:100%;background:currentColor}  
  
  /* ---------- sections ---------- */  
.k1 section{padding:72px 0}  
.k1 .section-label{  
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.22em;  
    text-transform:uppercase;color:var(--fde-bright);display:block;margin-bottom:14px;  
  }  
.k1 h2{font-size:clamp(26px,3.4vw,40px);margin-bottom:18px}  
.k1 .lede{color:var(--bone-dim);font-size:17px;max-width:62ch}  
  
  /* proof / video */  
.k1 .proof{border-bottom:1px solid var(--hairline)}  
.k1 .proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:36px}  
.k1 .video-slot{aspect-ratio:16/9}  
.k1 .proof-stat{display:flex;flex-direction:column;gap:4px;padding:18px 0;border-top:1px solid var(--hairline)}  
.k1 .proof-stat:last-child{border-bottom:1px solid var(--hairline)}  
.k1 .proof-num{font-family:'IBM Plex Mono',monospace;font-size:26px;color:var(--fde-bright)}  
.k1 .proof-cap{font-size:14px;color:var(--bone-dim)}  
  
  /* hand fitted trio */  
.k1 .fitted{border-bottom:1px solid var(--hairline)}  
.k1 .trio{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:40px}  
.k1 .trio h3{font-size:17px;margin-bottom:10px;letter-spacing:.03em}  
.k1 .trio p{color:var(--bone-dim);font-size:15px}  
.k1 .trio .img-slot{aspect-ratio:3/2;margin-bottom:18px}  
  
  /* spec plate */  
.k1 .specs{border-bottom:1px solid var(--hairline);background:var(--gunmetal)}  
.k1 .spec-plate{  
    margin-top:36px;border:1px solid var(--hairline);  
    background:var(--panel);  
  }  
.k1 .spec-head{  
    display:flex;justify-content:space-between;align-items:center;  
    padding:16px 22px;border-bottom:1px solid var(--hairline);  
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;  
    text-transform:uppercase;color:var(--bone-dim);  
  }  
.k1 .spec-head .sku{color:var(--fde-bright)}  
.k1 .spec-grid{display:grid;grid-template-columns:1fr 1fr}  
.k1 .spec-grid .spec-row{  
    display:grid;grid-template-columns:170px 1fr;gap:16px;  
    padding:13px 22px;border-bottom:1px solid var(--hairline);  
    font-size:14px;  
  }  
.k1 .spec-grid .col:first-child .spec-row{border-right:1px solid var(--hairline)}  
.k1 .spec-key{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--bone-dim);padding-top:2px}  
.k1 .spec-val{color:var(--bone)}  
.k1 .spec-val small{display:block;color:var(--bone-dim);font-size:13px}  
  
  /* buying steps */  
.k1 .nfa{border-bottom:1px solid var(--hairline)}  
.k1 .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:40px;background:var(--hairline)}  
.k1 .step{background:var(--ink);padding:26px 22px}  
.k1 .step-num{font-family:'IBM Plex Mono',monospace;color:var(--fde-bright);font-size:13px;margin-bottom:12px;display:block}  
.k1 .step h3{font-size:15px;margin-bottom:10px;letter-spacing:.03em}  
.k1 .step p{font-size:14px;color:var(--bone-dim)}  
.k1 .nfa-note{  
    margin-top:28px;padding:18px 22px;border-left:3px solid var(--fde);  
    background:var(--gunmetal);color:var(--bone-dim);font-size:14px;max-width:72ch;  
  }  
  
  /* FAQ */  
.k1 .faq{border-bottom:1px solid var(--hairline);background:var(--gunmetal)}  
.k1 .faq-list{margin-top:32px;border-top:1px solid var(--hairline)}  
.k1 .faq-item{border-bottom:1px solid var(--hairline)}  
  /* Native <details>/<summary>: no JavaScript, so it still works if a page  
     builder or security plugin strips the inline script. */  
.k1 .faq-q{  
    display:block;width:100%;color:var(--bone);  
    font-family:'Archivo',sans-serif;font-weight:600;font-size:16px;  
    text-align:left;padding:20px 44px 20px 0;cursor:pointer;position:relative;  
    list-style:none;                 /* Firefox */  
    -webkit-tap-highlight-color:transparent;  
  }  
.k1 .faq-q::-webkit-details-marker{display:none}   /* Safari default triangle */  
.k1 .faq-q::marker{content:""}  
.k1 .faq-q::after{  
    content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);  
    font-family:'IBM Plex Mono',monospace;font-size:20px;color:var(--fde-bright);  
    pointer-events:none;  
  }  
.k1 .faq-item[open] .faq-q::after{content:"\2013"}  
.k1 .faq-a{padding:0 0 22px;color:var(--bone-dim);font-size:15px;max-width:70ch}  
.k1 .faq-q:focus-visible{outline:2px solid var(--fde-bright);outline-offset:2px}  
  
  /* capture */  
.k1 .capture{border-bottom:1px solid var(--hairline)}  
.k1 .capture-box{  
    margin-top:8px;display:grid;grid-template-columns:1fr auto;gap:14px;max-width:560px;  
  }  
.k1 .capture input[type=email]{  
    background:var(--panel);border:1px solid var(--hairline);color:var(--bone);  
    padding:14px 16px;font-family:'IBM Plex Mono',monospace;font-size:14px;width:100%;  
  }  
.k1 .capture input[type=email]:focus-visible{outline:2px solid var(--fde-bright);outline-offset:2px}  
.k1 .fine{font-size:12px;color:var(--bone-dim);margin-top:12px;font-family:'IBM Plex Mono',monospace}  
  
  /* final CTA */  
.k1 .final{text-align:center;padding:88px 0}  
.k1 .final h2{font-size:clamp(30px,4vw,52px)}  
.k1 .final .lede{margin:0 auto 34px}  
.k1 .final .hero-ctas{justify-content:center}  
.k1 footer{  
    border-top:1px solid var(--hairline);padding:26px 0;  
    font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--bone-dim);  
  }  
.k1 footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}  
  
  /* ---------- responsive ---------- */  
@media(max-width:900px){  
.k1 .hero{margin-top:-64px;min-height:auto;padding:128px 0 72px}  
  
  /* MOBILE HERO ART  
     Phones do not load the video. Instead of a flat poster, the cutout  
     rifle sits across the bottom on the dark gradient — copy on top,  
     product underneath. Set as a background so no markup changes are  
     needed in the section widget. The 200px bottom padding above is  
     the clearance it sits in. */  
  /* No rifle art behind the mobile hero: the rifle section now sits directly  
     below, and showing it twice in one screen reads as a mistake. */  
  .k1 .hero-media{  
    background:  
      radial-gradient(700px 420px at 62% 30%, rgba(168,148,111,.20) 0%, transparent 68%),  
      linear-gradient(170deg, #23201C 0%, #161413 46%, #0D0C0B 100%);  
  }  
  .k1 .hero-scrim{background:  
      linear-gradient(180deg, rgba(11,10,9,.55) 0%, rgba(11,10,9,.22) 55%, transparent 88%)}  
  
  /* Stack the CTAs full width on phones. Side by side they crowd each other  
     and sit right on top of the rifle art. */  
        /* Rifle drops below the copy on phones. */  
.k1 .proof-grid{grid-template-columns:1fr;gap:32px}  
.k1 .trio{grid-template-columns:1fr;gap:28px}  
.k1 .spec-grid{grid-template-columns:1fr}  
.k1 .spec-grid .col:first-child .spec-row{border-right:none}  
.k1 .steps{grid-template-columns:1fr 1fr}}  
@media(max-width:560px){  
.k1 section{padding:52px 0}  
.k1 .steps{grid-template-columns:1fr}  
.k1 .capture-box{grid-template-columns:1fr}  
.k1 .slot-inner{grid-template-columns:auto 1fr;row-gap:14px}  
.k1 .topbar .wrap{height:64px}  
.k1 .brand-type b{font-size:19px}  
.k1 .brand-type i{font-size:9px;letter-spacing:.28em}}  
  
/* ============================================================  
   MOTION LAYER  
   CSS only. No JavaScript, no markup changes.  
  
   SAFETY: every rule that hides an element (opacity:0) lives  
   inside BOTH @supports (animation-timeline: view()) AND  
   @media (prefers-reduced-motion: no-preference). If either is  
   unsupported or switched off, nothing is ever hidden — the page  
   renders exactly as it does today. Firefox and reduced-motion  
   users see a static page, not a blank one.  
   ============================================================ */  
  
/* ---------- hover / focus (universally supported) ---------- */  
  
.k1 .trio-card figure{overflow:hidden}  
.k1 .trio-card img{transition:transform .6s cubic-bezier(.2,.7,.3,1)}  
.k1 .trio-card:hover img{transform:scale(1.04)}  
  
.k1 .btn{transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease}  
.k1 .btn:hover{transform:translateY(-1px)}  
.k1 .btn:active{transform:translateY(0)}  
  
.k1 .faq-item{transition:background .2s ease}  
.k1 .faq-item:hover{background:rgba(235,231,223,.03)}  
.k1 .faq-q::after{transition:transform .25s ease,color .2s ease}  
.k1 .faq-item[open] .faq-q::after{transform:translateY(-50%) rotate(180deg)}  
  
.k1 .callouts li{transition:transform .25s ease}  
.k1 .callouts li:hover{transform:translateY(-2px)}  
  
/* ---------- build slot bar fills on load ---------- */  
/* scaleX rather than width, so the inline width from ACF is preserved */  
  
@media (prefers-reduced-motion: no-preference){  
  .k1 .slot-fill-el{transform-origin:left center;animation:k1-fill 1.1s cubic-bezier(.2,.7,.3,1) .25s both}  
  @keyframes k1-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}  
  
  /* status lamp breathes. Slow enough to read as "live", not as a warning. */  
  .k1 .slot-lamp{animation:k1-pulse 3.4s ease-in-out infinite}  
  @keyframes k1-pulse{0%,100%{opacity:1}50%{opacity:.62}}  
}  
  
/* ---------- hero settles on load ---------- */  
  
@media (prefers-reduced-motion: no-preference){  
  .k1 .hero .eyebrow,  
  .k1 .hero h1,  
  .k1 .hero .sub,  
  .k1 .hero .price-line,  
  .k1 .hero .hero-ctas{animation:k1-rise .8s cubic-bezier(.2,.7,.3,1) both}  
  .k1 .hero h1{animation-delay:.08s}  
  .k1 .hero .sub{animation-delay:.16s}  
  .k1 .hero .price-line{animation-delay:.24s}  
  .k1 .hero .hero-ctas{animation-delay:.32s}  
  @keyframes k1-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}  
}  
  
/* ---------- scroll reveal ---------- */  
/* Double-guarded. The hidden initial state cannot exist without a  
   working scroll timeline to undo it. */  
  
@supports (animation-timeline: view()){  
  @media (prefers-reduced-motion: no-preference){  
  
    .k1 .proof .section-label,   .k1 .proof h2,   .k1 .proof .lede,  
    .k1 .fitted .section-label,  .k1 .fitted h2,  .k1 .fitted .lede,  
    .k1 .rifle .section-label,   .k1 .rifle h2,  
    .k1 .specs .section-label,   .k1 .specs h2,   .k1 .specs .lede,  
    .k1 .nfa .section-label,     .k1 .nfa h2,     .k1 .nfa .lede,  
    .k1 .faq .section-label,     .k1 .faq h2,  
    .k1 .capture .section-label, .k1 .capture h2, .k1 .capture .lede,  
    .k1 .final h2,               .k1 .final .lede,  
    .k1 .rifle-figure,  
    .k1 .trio-card,  
    .k1 .callouts li,  
    .k1 .step{  
      opacity:0;  
      animation:k1-reveal linear both;  
      animation-timeline:view();  
      animation-range:entry 8% cover 26%;  
    }  
  
    /* stagger by shifting the range rather than using a delay —  
       scroll timelines ignore animation-delay */  
    .k1 .trio-card:nth-child(2),  
    .k1 .callouts li:nth-child(2),  
    .k1 .step:nth-child(2){animation-range:entry 8% cover 32%}  
    .k1 .trio-card:nth-child(3),  
    .k1 .callouts li:nth-child(3),  
    .k1 .step:nth-child(3){animation-range:entry 8% cover 38%}  
    .k1 .callouts li:nth-child(4),  
    .k1 .step:nth-child(4){animation-range:entry 8% cover 44%}  
  
    @keyframes k1-reveal{  
      from{opacity:0;transform:translateY(18px)}  
      to{opacity:1;transform:none}  
    }  
  }  
}  
  
/* ==================== kratos related carousel ==================== */  
.k1 .krel{padding:72px 0}  
.k1 .krel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}  
.k1 .krel-nav{display:flex;gap:8px;flex:0 0 auto}  
.k1 .krel-btn{  
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;  
  background:none;border:1px solid var(--hairline);color:var(--bone);  
  font-size:17px;cursor:pointer;border-radius:0;  
  transition:border-color .18s ease,color .18s ease;  
}  
.k1 .krel-btn:hover{border-color:var(--fde-bright);color:var(--fde-bright)}  
.k1 .krel-btn:focus-visible{outline:2px solid var(--fde-bright);outline-offset:2px}  
  
.k1 .krel-track{  
  list-style:none;margin:0;padding:4px 0 18px;  
  display:flex;gap:14px;overflow-x:auto;  
  scroll-snap-type:x mandatory;  
  scrollbar-width:thin;scrollbar-color:var(--fde) transparent;  
  -webkit-overflow-scrolling:touch;  
}  
.k1 .krel-track::-webkit-scrollbar{height:4px}  
.k1 .krel-track::-webkit-scrollbar-thumb{background:var(--fde)}  
  
.k1 .krel-card{  
  /* 4-up on desktop: card width derives from the track, so four fill the row  
     and the fifth peeks, cueing the scroll. */  
  flex:0 0 calc((100% - 3 * 14px) / 4);  
  min-width:250px;  
  scroll-snap-align:start;  
  background:var(--gunmetal);border:1px solid var(--hairline);  
  transition:border-color .18s ease,transform .25s ease;  
}  
.k1 .krel-card:hover{border-color:var(--fde-bright);transform:translateY(-3px)}  
.k1 .krel-card a{display:block;text-decoration:none;padding:14px}  
/* White plate: photography is on white, frame matches it exactly. */  
.k1 .krel-media{margin:0 0 12px;background:#fff;padding:14px}  
.k1 .krel-media img{display:block;width:100%;height:150px;object-fit:contain;filter:none}  
.k1 .krel-name{  
  font-family:"Archivo",sans-serif;font-weight:600;font-size:13.5px;line-height:1.35;  
  letter-spacing:.01em;text-transform:none;color:var(--bone);margin:0 0 8px;  
}  
.k1 .krel-price,.k1 .krel-price .woocommerce-Price-amount{  
  font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--fde-bright);  
}  
.k1 .krel-price del{opacity:.5;margin-right:8px}  
.k1 .krel-price ins{text-decoration:none}  
  
@media (max-width:1100px){  
  .k1 .krel-card{flex:0 0 calc((100% - 2 * 14px) / 3);min-width:230px}  
}  
@media (max-width:760px){  
  .k1 .krel-card{flex:0 0 calc((100% - 14px) / 2);min-width:210px}  
}  
@media (max-width:480px){  
  .k1 .krel{padding:52px 0}  
  .k1 .krel-card{flex:0 0 82%;min-width:0}  
}/* End custom CSS */