/* Shared styles for the KIXA homepages: brand tokens, smooth scroll, header, menu,
   cursor, reveals, rolling counters, FAQ and footer. Pages add their own scenes. */
:root{
  --navy:#002455;--navy2:#0E3570;--navy3:#0A2C62;--orange:#F39200;--orange-dark:#D97F00;
  --card:#EEF1F6;--muted:#C7CEDA;--grey:#9DA3BC;--paper:#FFFFFF;
  --ink:var(--navy);--ink-soft:#4A5878;--line:#DDE2EC;
  --ease:cubic-bezier(.19,1,.22,1);--ease-io:cubic-bezier(.76,0,.24,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Montserrat,'Helvetica Neue',Arial,sans-serif;color:var(--ink);background:var(--paper);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1440px;margin:0 auto;padding-left:clamp(20px,3.4vw,56px);padding-right:clamp(20px,3.4vw,56px)}
.kicker{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.btn{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:600;font-size:16px;padding:17px 28px;border-radius:999px;background:var(--orange);color:var(--navy);transition:background .3s,color .3s}
.btn:hover{background:#fff}
.btn.ghost{background:transparent;color:inherit;border:1.5px solid currentColor}
.btn.ghost:hover{background:var(--orange);border-color:var(--orange);color:var(--navy)}
.btn .arr{transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(5px)}
.tag-new{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--orange);color:var(--navy);padding:4px 9px;border-radius:999px;vertical-align:middle}

html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Word and letter reveals */
.js [data-split] .w,.js [data-chars] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.js [data-split] .w>span,.js [data-chars] .w>span{display:inline-block;transform:translateY(112%);transition:transform 1.15s var(--ease)}
.js [data-split].in .w>span,.js [data-chars].in .w>span{transform:none}
.js [data-reveal]{opacity:0;transform:translateY(42px);transition:opacity 1s ease,transform 1.2s var(--ease)}
.js [data-reveal].in{opacity:1;transform:none}
/* The clip goes on the children so the observed element itself stays visible */
.js [data-clip]>*{clip-path:inset(100% 0 0 0);transition:clip-path 1.4s var(--ease-io)}
.js [data-clip] img{transform:scale(1.3);transition:clip-path 1.4s var(--ease-io),transform 2s var(--ease)}
.js [data-clip].in>*{clip-path:inset(0)}
.js [data-clip].in img{transform:none}
[data-ink] .wi{display:inline}

/* Rolling counters */
.odo{display:inline-flex;align-items:flex-start;line-height:1}
.odo-col{display:inline-block;height:1em;overflow:hidden}
.odo-strip{display:flex;flex-direction:column;transition:transform 2.4s cubic-bezier(.16,1,.3,1)}
.odo-strip>span{display:block;height:1em}
.odo.in .odo-strip{transform:translateY(calc(var(--k) * -1em))}

[data-magnetic]{transition:transform .6s var(--ease)}

/* Header: transparent at the top, solid once scrolled, hidden while scrolling down */
.hdr{position:fixed;top:0;left:0;right:0;z-index:95;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px clamp(20px,3vw,44px);color:var(--hdr-ink,var(--navy));transition:transform .7s var(--ease),background .4s,color .4s}
.hdr.scrolled{background:var(--hdr-bg,rgba(255,255,255,.86));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.hdr.away{transform:translateY(-110%)}
.hdr .brand{display:block;line-height:0}
.hdr .brand img{height:42px;width:auto}
.hdr .brand .on-dark{display:none}
.hdr-dark .hdr .brand .on-dark,.menu-open .hdr .brand .on-dark{display:block}
.hdr-dark .hdr .brand .on-light,.menu-open .hdr .brand .on-light{display:none}
.hdr-right{display:flex;align-items:center;gap:10px}
.hdr-links{display:flex;gap:26px;margin-right:14px;font-size:15px;font-weight:500}
.hdr-links a{text-decoration:none;position:relative}
.hdr-links a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.hdr-links a:hover::after{transform:scaleX(1);transform-origin:left}
.hdr-cta{text-decoration:none;font-size:15px;font-weight:600;padding:12px 20px;border-radius:999px;background:var(--orange);color:var(--navy);transition:background .3s}
.hdr-cta:hover{background:#fff}
.menu-btn{display:flex;align-items:center;gap:12px;font:inherit;font-size:15px;font-weight:600;color:inherit;background:none;border:1.5px solid currentColor;border-radius:999px;padding:10px 18px;cursor:pointer}
.menu-btn .bars{position:relative;width:18px;height:8px}
.menu-btn .bars i{position:absolute;left:0;width:100%;height:2px;background:currentColor;transition:transform .6s var(--ease),top .6s var(--ease)}
.menu-btn .bars i:first-child{top:0}
.menu-btn .bars i:last-child{top:6px}
.menu-open .hdr{color:#fff;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transform:none}
.menu-open .hdr-links{visibility:hidden}
.menu-open .menu-btn .bars i:first-child{top:3px;transform:rotate(45deg)}
.menu-open .menu-btn .bars i:last-child{top:3px;transform:rotate(-45deg)}

/* Full-screen menu */
.menu{position:fixed;inset:0;z-index:90;background:var(--navy);color:#fff;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding:120px clamp(20px,3vw,44px) 36px;clip-path:inset(0 0 100% 0);transition:clip-path 1s var(--ease-io);visibility:hidden}
.menu-open .menu{clip-path:inset(0);visibility:visible}
.menu-links{display:flex;flex-direction:column;justify-content:center}
.menu-links a{display:flex;align-items:baseline;gap:18px;text-decoration:none;font-size:clamp(36px,5vw,80px);font-weight:600;line-height:1.1;letter-spacing:-.03em;overflow:hidden}
.menu-links a span{display:inline-block;transform:translateY(110%);transition:transform 1s var(--ease),color .3s}
.menu-links a small{font-size:14px;letter-spacing:0;font-weight:500;color:var(--orange);transform:translateY(110%);transition:transform 1s var(--ease)}
.menu-open .menu-links a span,.menu-open .menu-links a small{transform:none}
.menu-links a:nth-child(2){--d:.05s}.menu-links a:nth-child(3){--d:.1s}.menu-links a:nth-child(4){--d:.15s}
.menu-links a:nth-child(5){--d:.2s}.menu-links a:nth-child(6){--d:.25s}.menu-links a:nth-child(7){--d:.3s}
.menu-open .menu-links a span,.menu-open .menu-links a small{transition-delay:calc(.3s + var(--d,0s))}
.menu-links a:hover span{color:var(--orange)}
.menu-pic{position:relative;align-self:center;height:min(56vh,560px);overflow:hidden;border-radius:24px;clip-path:inset(0 0 100% 0 round 24px);transition:clip-path 1.2s var(--ease-io) .2s}
.menu-open .menu-pic{clip-path:inset(0 round 24px)}
.menu-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12);transition:opacity .6s,transform 1.4s var(--ease)}
.menu-pic img.on{opacity:1;transform:none}
.menu-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);font-size:15px;color:var(--muted)}

/* Cursor */
.has-cursor,.has-cursor *{cursor:none!important}
.cursor{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;opacity:0;transition:opacity .3s}
.cursor.on{opacity:1}
.cursor .ring{position:absolute;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--orange);display:grid;place-items:center;transition:width .45s var(--ease),height .45s var(--ease),margin .45s var(--ease),background .3s,border-color .3s;border:1.5px solid transparent}
.cursor.link .ring{width:52px;height:52px;margin:-26px 0 0 -26px;background:transparent;border-color:var(--orange)}
.cursor.label .ring{width:108px;height:108px;margin:-54px 0 0 -54px;background:var(--orange)}
.cursor .txt{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--navy);opacity:0;transition:opacity .25s;white-space:nowrap}
.cursor.label .txt{opacity:1}
.cursor.down .ring{transform:scale(.8)}

/* FAQ accordion */
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;background:none;border:0;font:inherit;font-weight:600;font-size:clamp(19px,1.7vw,24px);color:inherit;text-align:left;cursor:pointer}
.faq-q i{position:relative;flex:none;width:18px;height:18px}
.faq-q i::before,.faq-q i::after{content:"";position:absolute;left:0;top:8px;width:18px;height:2px;background:var(--orange);transition:transform .5s var(--ease)}
.faq-q i::after{transform:rotate(90deg)}
.faq-item.open .faq-q i::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease)}
.faq-a>div{overflow:hidden}
.faq-a p{margin:0 0 28px;max-width:780px;color:var(--ink-soft);font-size:17px}
.faq-item.open .faq-a{grid-template-rows:1fr}

/* Marquee call to action */
.band{display:block;background:var(--orange);color:var(--navy);overflow:hidden;padding:46px 0;text-decoration:none}
.band .track{display:flex;width:max-content;animation:kx-mq 28s linear infinite;font-weight:800;font-size:clamp(48px,7.4vw,120px);line-height:1;letter-spacing:-.035em}
.band .track span{padding:0 .35em;white-space:nowrap}
.band .track svg{width:.62em;height:.62em;align-self:center;flex:none}
.band:hover .track{animation-duration:12s}
@keyframes kx-mq{to{transform:translateX(-50%)}}

/* Footer */
.foot{background:var(--navy);color:var(--muted);font-size:15px}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;padding-top:80px;padding-bottom:48px}
.foot img.logo{height:46px;width:auto;margin-bottom:22px}
.foot b{display:block;color:#fff;font-weight:600;margin-bottom:10px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--orange)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:24px;padding-bottom:32px;border-top:1px solid rgba(255,255,255,.14);font-size:13px;color:var(--grey)}
.foot-legal img{height:52px;width:auto}

/* Marks every page as a design concept, not the live site */
.concept-tag{position:fixed;left:calc(14px + env(safe-area-inset-left, 0px));bottom:calc(14px + env(safe-area-inset-bottom, 0px));z-index:96;pointer-events:none;font-size:12px;font-weight:600;letter-spacing:.04em;color:#fff;background:rgba(0,36,85,.9);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:7px 12px}

@media (max-width:1100px){.hdr-links{display:none}}
@media (max-width:860px){
  .hdr .brand img{height:34px}
  .hdr-cta{display:none}
  .menu{grid-template-columns:1fr;padding-top:110px}
  .menu-pic{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid>div:first-child{grid-column:1/-1}
}
@media (prefers-reduced-motion: reduce){
  .js [data-split] .w>span,.js [data-chars] .w>span,.js [data-reveal],.js [data-clip]>*,.js [data-clip] img{transform:none!important;opacity:1!important;clip-path:none!important;transition:none!important}
  .odo-strip{transition:none}
  *{animation:none!important}
}