/* adptng.ai landing. Light ground, navy type, electric blue for the letters that move and for action. */
@font-face{font-family:"Montserrat";src:url("/fonts/montserrat.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/inter.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{
  --bg:#f5f8fc; --navy:#0b1f35; --blue:#1560e8; --sky:#4a7fba; --steel:#6b7280;
  --ink-2:#44536a; --rule:rgba(11,31,53,.18); --on-navy:#b8c6d9; --sky-on-navy:#7fb0ff;
  --display:"Montserrat","Avenir Next","Segoe UI",sans-serif;
  --body:"Inter","Segoe UI",system-ui,sans-serif;
  --gutter:clamp(20px,4.2vw,64px);
  --ease:cubic-bezier(.65,0,.25,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--navy);font:400 1.0625rem/1.6 var(--body);-webkit-font-smoothing:antialiased}
h1,h2,p,ul{margin:0}
ul{padding:0;list-style:none}
a{color:inherit}
.defs{position:absolute}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}

/* icon symbol colours */
.i-ring{fill:none;stroke:var(--navy);stroke-width:4.5}
.i-dots{stroke:var(--bg);stroke-width:3}
.i-a{fill:var(--navy)} .i-b{fill:var(--sky)} .i-c{fill:var(--steel)} .i-d{fill:var(--blue)}

.brand{display:inline-flex;align-items:center;gap:.45em;font:700 1.5rem var(--display);letter-spacing:-.02em;text-decoration:none}
.brand svg{width:1.75em;height:1.75em}
.btn{display:inline-block;font:600 1rem var(--body);text-decoration:none;white-space:nowrap;cursor:pointer;
  background:var(--blue);color:#fff;border:0;border-radius:.4em;padding:.85em 1.5em;transition:background .2s,transform .2s}
.btn:hover{background:#0f4fc7;transform:translateY(-1px)}
.eyebrow{font:600 .8125rem var(--body);letter-spacing:.14em;text-transform:uppercase}
.lead{font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.45}

/* ---------- hero ---------- */
.hero{position:relative;display:flex;flex-direction:column;min-height:max(100svh,560px);container-type:inline-size;overflow:hidden}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bar{position:relative;padding-block:clamp(18px,2.6vw,32px)}
.hero-body{position:relative;margin-top:auto;display:flex;flex-direction:column;gap:clamp(14px,2vw,28px);padding-bottom:clamp(24px,3.4vw,48px)}
.word{position:relative;font:800 min(15.6cqw,15rem)/.9 var(--display);letter-spacing:-.045em;white-space:nowrap}
.slot,.tail,.src{display:inline-block;vertical-align:bottom}
.slot{overflow:hidden;max-width:0;color:var(--blue);transition:max-width 2.6s var(--ease)}
.word.full .slot{max-width:.8em}
.tail{overflow:hidden;max-width:2em;color:var(--blue);transition:max-width 2.6s var(--ease),opacity 1s}
.word.full .tail{max-width:0;opacity:0}
.word.snap,.word.snap *{transition:none!important}
.word.fly .slot,.word.fly .src{color:transparent}
.clone{position:absolute;color:var(--blue);pointer-events:none}
.hero-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 48px;flex-wrap:wrap;border-top:2px solid var(--rule);padding-top:clamp(16px,2vw,26px)}
.hero-foot p{font-size:clamp(1.05rem,1.55vw,1.4rem);font-weight:500;line-height:1.4;max-width:34em;flex:1 1 18em}

/* ---------- statement ---------- */
.statement{background:var(--navy);color:#fff;padding-block:clamp(72px,11vw,168px)}
.statement .eyebrow{color:var(--sky-on-navy);margin-bottom:1.6em}
.statement h2{font:700 clamp(2.3rem,6.6vw,6.25rem)/1.02 var(--display);letter-spacing:-.035em;text-wrap:balance;max-width:14em}
.statement em{font-style:normal;color:var(--sky-on-navy)}
.statement .lead{color:var(--on-navy);max-width:38em;margin-top:clamp(24px,3vw,44px)}

/* ---------- pillars ---------- */
.pillar{padding-block:clamp(64px,9vw,136px)}
.pillar + .pillar{padding-top:0}
.pillar + .pillar .pillar-grid{border-top:2px solid var(--rule);padding-top:clamp(64px,9vw,136px)}
.pillar-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:32px clamp(32px,6vw,96px);align-items:start}
.pillar .eyebrow{color:var(--blue);margin-bottom:.9em}
.pillar h2{font:800 clamp(3.4rem,11vw,10rem)/.9 var(--display);letter-spacing:-.045em}
.pillar-copy{display:flex;flex-direction:column;gap:1.2em;max-width:36em;padding-top:clamp(0px,2.4vw,40px)}
.pillar-copy .lead{font-weight:600}
.pillar-copy > p:not(.lead){color:var(--ink-2)}
.pillar-copy ul{display:flex;flex-direction:column;border-top:1px solid var(--rule);margin-top:.4em}
.pillar-copy li{padding:.85em 0 .85em 1.6em;border-bottom:1px solid var(--rule);position:relative;font-weight:500}
.pillar-copy li::before{content:"";position:absolute;left:.15em;top:1.45em;width:.6em;height:.6em;border-radius:50%;background:var(--blue)}

/* ---------- contact ---------- */
.contact{background:var(--blue);color:#fff;padding-block:clamp(72px,10vw,152px)}
.contact h2{font:800 clamp(3.2rem,10vw,9rem)/.92 var(--display);letter-spacing:-.045em}
.contact .lead{margin-top:.9em;color:#fff}
.contact form{display:flex;gap:12px;flex-wrap:wrap;margin-top:clamp(24px,3vw,40px);max-width:40rem}
.contact input[type=email]{flex:1 1 16em;min-width:0;font:500 1.0625rem var(--body);color:var(--navy);background:#fff;border:2px solid #fff;border-radius:.4em;padding:.85em 1em}
.contact input[type=email]::placeholder{color:#5f6b7d}
.contact input[type=email]:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.contact input[aria-invalid=true]{border-color:#ffd166}
.contact .btn{background:var(--navy);font-size:1.0625rem}
.contact .btn:hover{background:#06121f}
.contact .btn:focus-visible{outline-color:#fff}
.contact .btn[disabled]{opacity:.65;cursor:progress;transform:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{min-height:1.6em;margin-top:14px;font-weight:600}
.form-status.err{color:#fff3d1}
.fine{font-size:.875rem;color:#fff;margin-top:6px}

/* ---------- footer ---------- */
.foot{padding-block:clamp(28px,4vw,48px);color:var(--ink-2);font-size:.9375rem}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:14px 32px;flex-wrap:wrap}
.foot .brand{color:var(--navy);font-size:1.25rem}

/* ---------- scroll reveal (only when JS is running) ---------- */
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}

@media (max-width:760px){
  .pillar-grid{grid-template-columns:1fr}
  .hero-foot{align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
  .btn{transition:none}
}