/* ==========================================================================
   Tribal Bio: navy (#021331, from the mark) on white, one blue accent.
   ========================================================================== */

:root{
  --navy:#021331;
  --navy-2:#0A2050;
  --navy-3:#16255180;
  --blue:#2A45C4;
  --blue-dk:#22399F;
  --blue-tint:#EAEDFB;
  --white:#FFFFFF;
  --paper:#F5F6F9;
  --tint:#EAEDF3;
  --tint-2:#F1F3F8;
  --line:#E3E6ED;
  --line-dk:#1B3061;
  --muted:#4E5B75;
  --muted-light:#A9B6CE;

  --ff-d:"Source Serif 4","Iowan Old Style",Georgia,serif;
  --ff-b:"Figtree",-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;

  --wrap:1200px;
  --gut:clamp(1.25rem,5vw,4rem);
  --bandy:clamp(4.5rem,9vw,7.5rem);
  --r:16px;
  --r-sm:8px;
  --head-h:74px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px;}
body{
  margin:0;background:var(--tint);color:var(--navy);
  font-family:var(--ff-b);font-size:1.0625rem;font-weight:400;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
h1,h2,h3,p,ul,ol,figure,table{margin:0;padding:0;}
ul{list-style:none;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
:where(a,button,[tabindex]):focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px;}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);color:#fff;padding:.75rem 1.25rem;text-decoration:none;}
.skip:focus{left:.75rem;top:.75rem;}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);}

/* ── type ───────────────────────────────────────────────────────────────── */
h1,.h2,.h3{font-family:var(--ff-d);font-weight:400;letter-spacing:-.012em;line-height:1.08;}
h1{font-size:clamp(2.6rem,6vw,4.75rem);}
.h2{font-size:clamp(2rem,3.6vw,3.1rem);}
.h3{font-size:clamp(1.4rem,2.2vw,1.85rem);}

.lede{font-size:clamp(1.05rem,1.2vw,1.2rem);line-height:1.6;color:var(--muted);max-width:44ch;}

.eyebrow{
  font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue);margin-bottom:1.25rem;
}
.eyebrow--light{color:#93A6E8;}

/* ── buttons ────────────────────────────────────────────────────────────── */
button.btn{font-family:inherit;border:1px solid transparent;cursor:pointer;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:.75rem 1.6rem;border-radius:var(--r-sm);
  font-size:.95rem;font-weight:600;text-decoration:none;
  border:1px solid transparent;white-space:nowrap;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.btn--solid{background:var(--navy);color:#fff;}
.btn--solid:hover{background:var(--blue);}
.btn--ghost{border-color:var(--line);color:var(--navy);background:var(--white);}
.btn--ghost:hover{border-color:var(--navy);}
.btn--line{border-color:var(--line);color:var(--navy);min-height:44px;padding:.6rem 1.15rem;font-size:.9rem;}
.btn--line:hover{border-color:var(--navy);}
.btn--on-navy.btn--line{border-color:#3C5488;color:#fff;}
.btn--on-navy.btn--line:hover{border-color:#fff;}
.btn--on-navy.btn--solid{background:#fff;color:var(--navy);}
.btn--light{background:#fff;color:var(--navy);min-height:48px;padding:.8rem 1.5rem;font-weight:600;}
.btn--light:hover{background:var(--blue-tint);}
.btn--light:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.btn--on-navy.btn--line{min-height:48px;padding:.8rem 1.5rem;font-weight:600;}
.btn--on-navy.btn--solid:hover{background:var(--blue-tint);}

.row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.25rem;}
@media (max-width:479px){
  .row{display:grid;grid-template-columns:1fr;}
  .row .btn{width:100%;}
}

/* ── header ─────────────────────────────────────────────────────────────── */
.head{
  position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);
  backdrop-filter:saturate(150%) blur(10px);
  border-bottom:1px solid transparent;transition:border-color .25s ease;
}
.head.is-stuck{border-bottom-color:var(--line);}
.head--navy{
  background:transparent;backdrop-filter:none;border-bottom:0;
}
.head--navy .brand span,
.head--navy .head__nav a,
.head--navy .head__contact{color:#fff;}
.head--navy .head__nav a:hover,
.head--navy .head__contact:hover{color:var(--blue-tint);}
.head--navy .head__nav a.is-here{color:#9FB4F5;}
.head--navy .burger span{background:#fff;}
.head--navy.is-stuck{
  background:rgba(5,15,43,.88);backdrop-filter:saturate(150%) blur(10px);
  border-bottom-color:#1B3061;
}
.head--navy .brand img{filter:none;}
.head__in{
  max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);
  height:var(--head-h);display:flex;align-items:center;gap:1rem;
}
.brand{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;flex:none;min-height:44px;}
.brand img{width:24px;}
.brand span{font-size:.86rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;}
.brand--light span{color:#fff;}

.head__nav{display:none;gap:1.75rem;flex:1;}
.head__nav a{display:inline-flex;align-items:center;min-height:44px;font-size:.94rem;font-weight:500;text-decoration:none;color:var(--navy);}
.head__nav a:hover{color:var(--blue);}
.head__nav a.is-here{color:var(--blue);}
.head__act{display:none;gap:1.25rem;align-items:center;flex:1;justify-content:flex-end;}
.head__contact{display:inline-flex;align-items:center;min-height:44px;font-size:.94rem;font-weight:500;text-decoration:none;}
.head__contact:hover{color:var(--blue);}


.burger{margin-inline-start:auto;width:44px;height:44px;display:grid;place-content:center;gap:6px;}
.burger span{display:block;width:22px;height:1.6px;background:var(--navy);transition:transform .25s ease;}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.8px) rotate(45deg);}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.8px) rotate(-45deg);}

.menu{position:sticky;top:var(--head-h);z-index:99;background:var(--white);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;padding:.25rem var(--gut) 1.5rem;}
.menu[hidden]{display:none;}
.menu a{padding:.9rem 0;text-decoration:none;border-bottom:1px solid var(--line);font-weight:500;}
.menu__cta{margin-top:1.25rem;border-bottom:0 !important;background:var(--navy);color:#fff;
  text-align:center;border-radius:var(--r-sm);padding:.95rem 1rem !important;
  font:inherit;font-weight:500;border:0;width:100%;cursor:pointer;min-height:48px;}

@media (min-width:1000px){
  .head__nav,.head__act{display:flex;}
  .head .brand{margin-inline:auto;}
  .burger{display:none;}
  .menu{display:none !important;}
}

/* ── bands ──────────────────────────────────────────────────────────────── */
.band{padding-block:var(--bandy);}
.band--navy{background:var(--navy);color:#fff;}
.band--navy .h2,.h2--light{color:#fff;}

/* dot field, fading out */
.dots{position:relative;background:var(--white);}
.dots::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(var(--line) 1.2px,transparent 1.2px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(115% 85% at 50% 0%,#000 12%,transparent 72%);
  mask-image:radial-gradient(115% 85% at 50% 0%,#000 12%,transparent 72%);
}
.dots > *{position:relative;}

/* ── hero: a single navy band, copy then the product deck ─────────────── */
.hero{
  position:relative;overflow:hidden;margin-top:calc(var(--head-h) * -1);
  padding-top:calc(var(--head-h) + clamp(3rem,7vw,5rem));
  background:
    radial-gradient(90% 70% at 50% -8%, rgba(74,106,214,.40), transparent 60%),
    linear-gradient(172deg,#132557 0%,#0A1940 48%,#050F2B 100%);
  padding-bottom:clamp(2rem,4vw,3rem);
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:radial-gradient(rgba(255,255,255,.06) .8px,transparent .8px);
  background-size:5px 5px;
}
.hero__copy{
  position:relative;z-index:2;
  max-width:min(52rem,calc(100% - var(--gut)*2));
  margin-inline:auto;text-align:center;
}
.hero h1{
  color:var(--white);margin-bottom:1.35rem;
  font-size:clamp(2.6rem,6.4vw,4.6rem);line-height:1.02;letter-spacing:-.022em;
}
.hero__lede{
  color:#C6D2EC;font-size:clamp(1.02rem,1.7vw,1.24rem);line-height:1.6;
  max-width:38rem;margin-inline:auto;
}
.hero__btns{
  display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;
  margin-top:clamp(1.75rem,3.5vw,2.5rem);
}

/* the deck of app windows */
.hero__stage{position:relative;z-index:1;margin-top:clamp(2.5rem,5vw,4rem);}
.deck{
  display:grid;                      /* all three share one cell, so the
                                        deck is always as tall as the tallest */
  width:min(100% - var(--gut)*2, 67rem);
  margin-inline:auto;
  padding-bottom:84px;               /* room for the card at the back */
}
.mac{
  background:var(--white);
  color:var(--navy);          /* never inherit a dark band's white text */
  border-radius:14px;
  box-shadow:0 40px 80px -34px rgba(2,10,32,.78),0 3px 12px -4px rgba(2,10,32,.45);
  overflow:hidden;
}
.mac__bar{
  display:flex;align-items:center;gap:.85rem;
  padding:.65rem 1rem;background:#F2F3F6;border-bottom:1px solid #E2E5EC;
}
.mac__lights{display:inline-flex;gap:.38rem;flex:none;}
.mac__lights i{width:10px;height:10px;border-radius:50%;background:#D7DAE2;}
.mac__lights i:first-child{background:#E6A9A1;}
.mac__lights i:nth-child(2){background:#E7CEA0;}
.mac__lights i:last-child{background:#A9CDAE;}
.mac__url{
  flex:1;text-align:center;font-size:.76rem;color:#6C7A93;
  background:var(--white);border-radius:6px;padding:.26rem .7rem;
  max-width:16rem;margin-inline:auto;
}

.slide{grid-area:1/1;align-self:start;transform-origin:50% 0;}

.mini__head{
  display:flex;align-items:center;gap:.75rem;
  padding:.95rem 1.25rem;border-bottom:1px solid var(--line);font-size:.9rem;
}
.mini__pill{
  margin-inline-start:auto;font-size:.74rem;font-weight:600;
  background:var(--blue-tint);color:var(--blue-dk);border-radius:999px;padding:.24rem .7rem;
}
.mini{width:100%;border-collapse:collapse;font-size:.86rem;}
.mini th,.mini td{padding:.78rem 1.25rem;text-align:left;border-bottom:1px solid var(--line);}
.mini th{font-size:.66rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);}
.mini td{color:var(--muted);}
.mini td:first-child{color:var(--navy);font-weight:500;}
.mini tr:last-child td{border-bottom:0;}
.mini .r{text-align:right;}
.mini b{color:var(--blue-dk);}

.mini__doc{padding:1.35rem 1.25rem;}
.mini__doc p{font-size:.88rem;line-height:1.62;color:var(--muted);margin-bottom:.8rem;}
.mini__doc p:last-child{margin-bottom:0;}
.cited{
  color:var(--navy) !important;background:var(--blue-tint);
  border-radius:7px;padding:.62rem .8rem;
}
.srcpill{
  display:inline-block;margin-left:.5rem;vertical-align:middle;
  font-size:.66rem;font-weight:600;color:var(--blue-dk);
  border:1px solid #C6D0F4;border-radius:999px;padding:.1rem .5rem;
}
.flagline{
  font-size:.82rem !important;font-weight:500;color:#8A4B00 !important;
  background:#FFF4E3;border-radius:7px;padding:.55rem .8rem;
}
.mini__tree li{
  display:flex;align-items:center;gap:.7rem;
  padding:.72rem 1.25rem;font-size:.86rem;color:var(--muted);
  border-bottom:1px solid var(--line);
}
.mini__tree li:last-child{border-bottom:0;}
.mini__tree li.on{background:var(--blue-tint);color:var(--navy);}
.mini__tree .n{font-variant-numeric:tabular-nums;font-weight:600;color:var(--navy);min-width:2.7rem;}
.mini__tree em{margin-inline-start:auto;font-style:normal;font-size:.74rem;font-weight:600;color:#3F8A63;}
.mini__tree em.w{color:var(--blue-dk);}
.mini__tree em.q{color:var(--muted);}

/* one caption at a time, in step with the deck */
.marks{
  position:relative;z-index:2;
  height:2.75rem;margin-top:clamp(1.75rem,3.5vw,2.5rem);
}
.marks__i{
  position:absolute;inset-inline:0;top:0;
  display:block;text-align:center;
  font-family:var(--ff-d);font-size:clamp(1.3rem,2.6vw,1.9rem);
  font-weight:400;letter-spacing:-.01em;color:var(--white);
  opacity:0;
}

@keyframes deckcycle{
  0%     {transform:translateY(0)    scale(1);   opacity:1;}
  26%    {transform:translateY(0)    scale(1);   opacity:1;}
  33%    {transform:translateY(-58%) scale(1.01);opacity:0;}
  33.6%  {transform:translateY(76px) scale(.915);opacity:0;}
  41%    {transform:translateY(76px) scale(.915);opacity:1;}
  59%    {transform:translateY(76px) scale(.915);opacity:1;}
  67%    {transform:translateY(38px) scale(.957);opacity:1;}
  92%    {transform:translateY(38px) scale(.957);opacity:1;}
  100%   {transform:translateY(0)    scale(1);   opacity:1;}
}
@keyframes decklayer{
  0%,32.9%   {z-index:3;}
  33%,59%    {z-index:1;}
  59.1%,100% {z-index:2;}
}
@keyframes markfade{
  0%     {opacity:0;transform:translateY(9px);}
  5%     {opacity:1;transform:translateY(0);}
  27%    {opacity:1;transform:translateY(0);}
  33%    {opacity:0;transform:translateY(-9px);}
  100%   {opacity:0;transform:translateY(9px);}
}

.slide{
  animation:deckcycle 13.5s cubic-bezier(.55,.05,.25,1) infinite,
            decklayer 13.5s step-end infinite;
}
.slide--1{animation-delay:0s,0s;}
.slide--2{animation-delay:-4.5s,-4.5s;}
.slide--3{animation-delay:-9s,-9s;}

.marks__i{animation:markfade 13.5s ease infinite;}
.marks--1{animation-delay:0s;}
.marks--2{animation-delay:-4.5s;}
.marks--3{animation-delay:-9s;}

@media (max-width:640px){
  .deck{padding-bottom:70px;}
  .mini th,.mini td{padding:.6rem .85rem;font-size:.74rem;}
  .mini th{font-size:.6rem;}
  .mini__tree li{padding:.58rem .85rem;font-size:.76rem;}
  .mini__head{padding:.72rem .85rem;font-size:.78rem;}
  .mini__doc{padding:.95rem .85rem;}
  .mini__doc p{font-size:.78rem;margin-bottom:.6rem;}
  .mini th:nth-child(4),.mini td:nth-child(4){display:none;}
}
@media (max-width:420px){
  .deck{padding-bottom:64px;}
  .mini th:nth-child(3),.mini td:nth-child(3){display:none;}
}

/* ── ribbon band: the image beat between hero and features ────────────── */
.ribbon{background:var(--tint);padding:0;}
.ribbon__frame{
  width:min(100% - var(--gut)*2, var(--wrap));
  margin:clamp(2.75rem,5vw,4.25rem) auto clamp(1rem,2vw,1.75rem);
  height:clamp(10rem,21vw,17rem);
  border-radius:var(--r);overflow:hidden;
  background:
    radial-gradient(120% 130% at 22% 20%, rgba(255,255,255,.85), transparent 62%),
    linear-gradient(122deg,#E6EAF7 0%,#D8DFF3 52%,#E9ECF7 100%);
}
.ribbon__run{
  display:flex;width:200%;height:100%;
  animation:ribbondrift 34s linear infinite;
}
.ribbon__run img{width:50%;height:100%;object-fit:cover;flex:none;}
@keyframes ribbondrift{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ── tabs / key features ────────────────────────────────────────────────── */
.tabs{display:flex;flex-wrap:wrap;gap:.6rem;margin:2rem 0 2.25rem;}
.tab{
  border:1px solid var(--line);border-radius:999px;background:var(--white);
  padding:.7rem 1.4rem;font-size:.92rem;font-weight:500;min-height:44px;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}
.tab:hover{border-color:var(--navy);}
.tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff;}
.panel__t{color:var(--muted);max-width:62ch;margin-bottom:2rem;}

/* ── product UI mockups ─────────────────────────────────────────────────── */
.shot{border-radius:var(--r);overflow:hidden;}
.ui{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:0 18px 40px -28px rgba(2,19,49,.35);overflow:hidden;
}
.ui__bar{
  display:flex;align-items:center;gap:.7rem;
  padding:.8rem 1.1rem;border-bottom:1px solid var(--line);background:var(--paper);
  font-size:.82rem;
}
.ui__dot{width:8px;height:8px;border-radius:50%;background:var(--blue);flex:none;}
.ui__crumb{font-weight:500;}
.ui__pill{
  margin-inline-start:auto;font-size:.72rem;font-weight:600;letter-spacing:.02em;
  background:var(--blue-tint);color:var(--blue-dk);border-radius:999px;padding:.25rem .7rem;
}
.ui__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.ui__table{width:100%;min-width:400px;border-collapse:collapse;font-size:.9rem;}
.ui__table th,.ui__table td{padding:.75rem 1.1rem;text-align:left;border-bottom:1px solid var(--line);}
.ui__table th{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.ui__table tr:last-child td{border-bottom:0;}
.ui__table td{color:var(--muted);}
.ui__table td:first-child{color:var(--navy);font-weight:500;}
.ta-r{text-align:right !important;}
@media (max-width:520px){
  .ui__table{min-width:0;}
  .ui__table th:nth-child(3),.ui__table td:nth-child(3){display:none;}
  .ui__table th,.ui__table td{padding-inline:.9rem;}
}
.ui__table b{color:var(--blue-dk);}

.ui__split{display:grid;grid-template-columns:1fr;}
@media (min-width:760px){.ui__split{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);}}
.tree{border-bottom:1px solid var(--line);}
@media (min-width:760px){.tree{border-bottom:0;border-right:1px solid var(--line);}}
.tree li{display:flex;align-items:center;gap:.65rem;padding:.7rem 1.1rem;font-size:.88rem;color:var(--muted);}
.tree li.is-on{background:var(--blue-tint);color:var(--navy);}
.tree__n{font-variant-numeric:tabular-nums;font-weight:600;color:var(--navy);min-width:2.6rem;}
.tree em{margin-inline-start:auto;font-style:normal;font-size:.72rem;font-weight:600;color:#3F8A63;}
.tree em.w{color:var(--blue-dk);}
.tree em.q{color:var(--muted);}

.doc{padding:1.1rem 1.3rem;}
.doc--pad{padding:1.4rem;}
.doc__h{font-weight:600;font-size:.92rem;margin-bottom:.9rem;}
.doc__p{font-size:.86rem;line-height:1.55;color:var(--muted);margin-bottom:.7rem;}
.doc__p:last-of-type{margin-bottom:0;}
.doc__p--src{
  color:var(--navy);background:var(--blue-tint);border-radius:6px;
  padding:.6rem .75rem;position:relative;
}
.doc__p .src{
  display:inline-block;margin-left:.5rem;vertical-align:middle;
  font-size:.66rem;font-weight:600;letter-spacing:.02em;
  color:var(--blue-dk);border:1px solid #C6D0F4;border-radius:999px;padding:.1rem .5rem;
}
.doc__flag{
  margin-top:1rem;font-size:.8rem;font-weight:500;color:#8A4B00;
  background:#FFF4E3;border-radius:6px;padding:.55rem .8rem;
}
.verify{border-top:1px solid var(--line);padding:.8rem 1.4rem;font-size:.82rem;color:var(--muted);}

.plan__row{display:grid;gap:.15rem;padding:.85rem 1.2rem;border-bottom:1px solid var(--line);font-size:.9rem;}
.plan__row:last-child{border-bottom:0;}
@media (min-width:620px){.plan__row{grid-template-columns:minmax(0,12rem) 1fr;gap:1rem;align-items:baseline;}}
.plan__row b{font-weight:600;}
.plan__row span{color:var(--muted);}
.plan--dark .plan__row{border-bottom-color:var(--line-dk);}
.plan--dark .plan__row b{color:#fff;}
.plan--dark .plan__row span{color:var(--muted-light);}

/* ── split sections ─────────────────────────────────────────────────────── */
.split{display:grid;grid-template-columns:1fr;}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;}}
.split__copy{background:var(--paper);display:flex;align-items:center;padding:clamp(3rem,6vw,5.5rem) var(--gut);}
.split__in{width:100%;max-width:520px;margin-inline:auto;}
.split__in .h2{margin-bottom:1.1rem;}
.split__in > p{color:var(--muted);margin-bottom:1.75rem;}
.split__art{display:flex;align-items:center;padding:clamp(2.5rem,5vw,4.5rem) var(--gut);}
.split__art--navy{background:var(--navy);}
.split__art--soft{background:var(--blue-tint);}
.split__art .ui{width:100%;max-width:520px;margin-inline:auto;}
@media (min-width:900px){
  .split--flip .split__copy{order:2;}
  .split--flip .split__art{order:1;}
}

.list{margin-bottom:2rem;border-top:1px solid var(--line);}
.list li{padding:.85rem 0;border-bottom:1px solid var(--line);font-size:.96rem;font-weight:500;}
.split__art--navy .list{border-color:var(--line-dk);}

.ui--dark{background:var(--navy-2);border-color:var(--line-dk);box-shadow:none;color:#fff;}
.ui--dark .ui__bar{background:#0E2757;border-bottom-color:var(--line-dk);}
.query{
  font-family:var(--ff-d);font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.35;
  padding:1.4rem;color:#fff;
}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;padding:0 1.4rem 1.4rem;}
.chips span{font-size:.78rem;border:1px solid var(--line-dk);color:#C2CFEA;border-radius:999px;padding:.3rem .75rem;}
.result{
  display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;
  border-top:1px solid var(--line-dk);padding:1rem 1.4rem;
}
.result b{font-size:1.1rem;color:#fff;}
.result span{font-size:.88rem;color:var(--muted-light);}

/* ── cards ──────────────────────────────────────────────────────────────── */
.cards{display:grid;gap:1rem;grid-template-columns:1fr;margin-top:2.75rem;}
@media (min-width:800px){.cards{grid-template-columns:repeat(3,1fr);}}
.cards li{border:1px solid var(--line-dk);border-radius:var(--r);padding:1.75rem;background:var(--navy-2);}
.cards h3{font-family:var(--ff-d);font-size:1.45rem;font-weight:400;margin-bottom:.6rem;}
.cards p{font-size:.95rem;color:var(--muted-light);line-height:1.55;}

/* ── cta banner ─────────────────────────────────────────────────────────── */
.cta{padding-block:var(--bandy);background:var(--white);}
.cta__card{
  display:grid;grid-template-columns:1fr;border-radius:20px;overflow:hidden;
  background:var(--blue-tint);
}
@media (min-width:820px){.cta__card{grid-template-columns:1fr 1fr;}}
.cta__art{position:relative;overflow:hidden;min-height:clamp(17rem,32vw,24rem);}
.cta__panel{background:var(--navy);color:#fff;padding:clamp(2.25rem,4vw,3.5rem);display:flex;flex-direction:column;justify-content:center;}
.cta__panel h2{font-family:var(--ff-d);font-size:clamp(1.9rem,3.2vw,2.7rem);font-weight:400;line-height:1.1;letter-spacing:-.012em;}
.cta__panel p{margin:1rem 0 2rem;color:var(--muted-light);max-width:34ch;}
.cta__panel .btn{align-self:flex-start;}

/* ── footer ─────────────────────────────────────────────────────────────── */
.foot{background:var(--navy);color:#fff;padding-block:clamp(3rem,5vw,4.5rem) 2rem;}
.foot__top{display:grid;gap:2.5rem;grid-template-columns:1fr;margin-bottom:3.5rem;}
@media (min-width:760px){.foot__top{grid-template-columns:1fr 1fr;align-items:start;}}
.foot__sign p{font-size:1.15rem;font-weight:600;margin-bottom:1.1rem;}
.foot__cols{display:grid;gap:1.5rem 3rem;grid-template-columns:repeat(auto-fit,minmax(140px,auto));justify-content:start;}
.foot__cols li{margin-bottom:.15rem;}
.foot__cols a{
  display:inline-flex;align-items:center;min-height:44px;
  font-size:.95rem;text-decoration:none;color:#C2CFEA;
}
.foot__cols a:hover{color:#fff;}
.foot__base{border-top:1px solid var(--line-dk);margin-top:3rem;padding-top:1.5rem;}
.foot__base p{font-size:.85rem;color:var(--muted-light);}

/* ── inner pages ────────────────────────────────────────────────────────── */
.phero{background:var(--navy);color:#fff;padding-block:clamp(3.5rem,7vw,6rem);text-align:center;}
.phero h1{margin-bottom:1.5rem;}
.phero p{color:var(--muted-light);max-width:62ch;margin-inline:auto;font-size:1.08rem;}

.prose{display:grid;gap:2rem;grid-template-columns:1fr;}
@media (min-width:860px){.prose{grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,4.5rem);}}
.prose__lead{font-family:var(--ff-d);font-size:clamp(1.35rem,2.2vw,1.85rem);line-height:1.28;letter-spacing:-.01em;}
.prose__body p{color:var(--muted);margin-bottom:1.25rem;}
.prose__body p:last-child{margin-bottom:0;}

.people{display:grid;gap:1.5rem;grid-template-columns:1fr;margin-top:1rem;}
@media (min-width:620px){.people{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1000px){.people{grid-template-columns:repeat(4,1fr);}}
.people li{display:grid;gap:.9rem;}
.ph{
  aspect-ratio:4/5;border-radius:var(--r);background:var(--paper);
  border:1px solid var(--line);
}
.ph__cap{height:10px;width:52%;border-radius:5px;background:var(--line);}

/* ── motion ─────────────────────────────────────────────────────────────── */
/* contact: booking block sits where the form used to */
.contact__book > p{color:var(--muted);margin:.9rem 0 1.5rem;max-width:34rem;}
.contact__book .btn{margin-bottom:.9rem;}
.contact__note{font-size:.88rem;color:var(--muted);}

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

/* ── contact ────────────────────────────────────────────────────────────── */
.contact{display:grid;gap:clamp(2.5rem,5vw,4rem);grid-template-columns:1fr;align-items:start;}
@media (min-width:860px){.contact{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);}}
.field{display:grid;gap:.4rem;margin-bottom:1.25rem;}
.field label{font-size:.88rem;font-weight:600;}
.field input,.field textarea{
  font:inherit;font-size:.98rem;color:var(--navy);
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:.75rem .9rem;width:100%;min-height:48px;
  transition:border-color .2s ease;
}
.field textarea{min-height:120px;resize:vertical;}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(42,69,196,.14);}
.field input:user-invalid,.field textarea:user-invalid{border-color:#B4341F;}
.field__note{font-size:.82rem;color:var(--muted);margin-top:.9rem;}
.contact__side{border-top:2px solid var(--navy);padding-top:1.5rem;}
.contact__side .h3{margin-bottom:.75rem;}
.mail{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--blue-dk);text-decoration:none;border-bottom:1px solid #C6D0F4;}
.mail:hover{border-bottom-color:var(--blue-dk);}
.contact__note{margin-top:1rem;font-size:.92rem;color:var(--muted);}

/* ── tinted grounds, no bare white anywhere ─────────────────────────────── */
.band--tint{background:var(--tint);}
.band--tint .ui,.band--tint .panel__t{background:transparent;}
.dots{background:var(--tint);}
.split__copy{background:var(--tint-2);}
.split__art--soft{background:var(--blue-tint);}
.cta{background:var(--tint);}

.eyebrow{
  font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);margin-bottom:1rem;
}
.eyebrow--light{color:#93A6CC;}

/* ── workspace, running a live review ─────────────────────────────────── */
.workspace{padding-bottom:clamp(2.5rem,5vw,4rem);}
.workspace .mac,.teams .mac{
  box-shadow:0 44px 84px -42px rgba(0,0,0,.7);
  border:1px solid #22345F;
}
.mac--wide{width:100%;}
.work{display:grid;grid-template-columns:1fr;background:var(--white);}
@media (min-width:860px){
  .work{grid-template-columns:minmax(0,.88fr) minmax(0,2.1fr) minmax(0,1fr);}
}
.work__side,.work__right{padding:1.15rem 1.25rem;background:var(--paper);}
.work__side{border-bottom:1px solid var(--line);}
.work__right{border-top:1px solid var(--line);}
@media (min-width:860px){
  .work__side{border-bottom:0;border-right:1px solid var(--line);}
  .work__right{border-top:0;border-left:1px solid var(--line);}
}
.work__proj{font-size:.88rem;font-weight:600;margin-bottom:.9rem;}
.work__k{
  font-size:.63rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin:1.3rem 0 .6rem;
}
.work__nav li,.work__files li{
  font-size:.8rem;color:var(--muted);padding:.36rem .55rem;border-radius:6px;
}
.work__nav li.on{background:var(--blue-tint);color:var(--navy);font-weight:500;}
.work__files li{display:flex;align-items:center;gap:.5rem;}
.work__main{padding:1.35rem 1.5rem;min-height:15rem;}
.work__h{font-size:.95rem;font-weight:600;margin-bottom:.95rem;}
.work__p{font-size:.83rem;line-height:1.62;color:var(--muted);margin-bottom:.7rem;}
.work__log li{display:grid;gap:.12rem;padding:.55rem 0;border-bottom:1px solid var(--line);}
.work__log li:last-child{border-bottom:0;}
.work__log b{font-size:.78rem;font-weight:600;color:var(--navy);}
.work__log span{font-size:.69rem;color:var(--muted);}

/* the review animation: read a file, cite it, find the gap, log it */
@keyframes wfin{
  0%,4%   {opacity:0;transform:translateY(7px);}
  9%,90%  {opacity:1;transform:none;}
  97%,100%{opacity:0;transform:translateY(7px);}
}
@keyframes wflit{
  0%,4%   {background:transparent;box-shadow:none;}
  9%,90%  {background:var(--blue-tint);box-shadow:inset 2px 0 0 var(--blue);}
  97%,100%{background:transparent;box-shadow:none;}
}
@keyframes wfscan{
  0%,3%   {background:transparent;color:var(--muted);}
  8%,30%  {background:var(--blue-tint);color:var(--navy);}
  40%,100%{background:transparent;color:var(--muted);}
}
.wf1,.wf2,.wf3,.wf4{animation:wfin 11s ease-in-out infinite;}
.wf1{animation-delay:0s;}
.wf2{animation-delay:.9s;}
.wf3{animation-delay:2.4s;}
.wf4{animation-delay:3.6s;}
.wf-scan{animation:wfscan 11s ease-in-out infinite;}
.work__p--lit{
  border-radius:7px;padding:.55rem .7rem;margin-inline:-.7rem;
  color:var(--navy);animation:wflit 11s ease-in-out infinite .9s,wfin 11s ease-in-out infinite .9s;
}
.wf-chip{
  margin-inline-start:auto;flex:none;
  font-size:.6rem;font-weight:600;letter-spacing:.04em;
  color:var(--blue-dk);background:var(--white);
  border:1px solid #C6D0F4;border-radius:999px;padding:.08rem .45rem;
}
.wf-flag{
  margin-top:1.1rem;padding:.85rem .95rem;
  background:#FFF6E8;border:1px solid #F2DDB8;border-left:3px solid #D9922B;
  border-radius:8px;
}
.wf-flag__k{
  display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:#8A4B00;margin-bottom:.4rem;
}
.wf-flag p{font-size:.8rem;line-height:1.55;color:#6B4310;margin-bottom:.5rem;}
.wf-flag__fix{
  display:inline-block;font-size:.72rem;font-weight:500;color:var(--blue-dk);
  background:var(--white);border:1px solid #D9E0F7;border-radius:6px;padding:.28rem .55rem;
}

/* ── built for your team, Weave-style cards ───────────────────────────── */
.teams{padding-top:clamp(2.5rem,5vw,4rem);}
.tcards{
  display:grid;gap:1.25rem;margin-top:clamp(2.25rem,4.5vw,3.25rem);
  grid-template-columns:1fr;
}
@media (min-width:760px){ .tcards{grid-template-columns:repeat(3,1fr);} }
.tcard{
  display:flex;flex-direction:column;
  padding:clamp(1.5rem,2.6vw,2rem);
  background:rgba(255,255,255,.045);
  border:1px solid var(--line-dk);border-radius:var(--r);
}
.tcard__ico{
  display:grid;place-items:center;width:2.75rem;height:2.75rem;
  border-radius:10px;background:var(--blue);color:var(--white);
  margin-bottom:1.4rem;
}
.tcard__ico svg{width:1.4rem;height:1.4rem;}
.tcard h3{
  font-family:var(--ff-d);font-size:1.5rem;font-weight:400;letter-spacing:-.012em;
  color:var(--white);margin-bottom:.7rem;
}
.tcard > p{font-size:.95rem;line-height:1.6;color:#B9C6E0;margin-bottom:1.5rem;}
.tpills{display:flex;flex-direction:column;gap:.55rem;margin-top:auto;align-items:flex-start;}
.tpills li{
  display:flex;align-items:center;gap:.55rem;
  font-size:.85rem;color:#D5DEEF;
  background:rgba(255,255,255,.06);border-radius:999px;padding:.42rem .95rem;
}
.tpills li::before{
  content:"";width:5px;height:5px;border-radius:50%;background:var(--blue-tint);flex:none;
}

/* ── the helix, thicker and running upward ────────────────────────────── */
.cta__art{position:relative;overflow:hidden;min-height:clamp(19rem,36vw,26rem);
  background:linear-gradient(150deg,#EEF0F9 0%,#E3E8F6 100%);}
.helix{position:absolute;inset:0;overflow:hidden;display:grid;place-items:center;}
.helix__run{
  width:min(96%,392px);
  animation:helixup 26s linear infinite;
  will-change:transform;
}
.helix__run img{width:100%;height:auto;display:block;}
@keyframes helixup{from{transform:translateY(0);}to{transform:translateY(-50%);}}

@media (prefers-reduced-motion:reduce){
  .slide,.marks__i,.helix__run,.ribbon__run,
  .wf1,.wf2,.wf3,.wf4,.wf-scan,.work__p--lit{animation:none !important;}
  .slide--1{transform:translateY(0) scale(1);z-index:3;opacity:1;}
  .slide--2{transform:translateY(38px) scale(.957);z-index:2;opacity:1;}
  .slide--3{transform:translateY(76px) scale(.915);z-index:1;opacity:1;}
  .marks__i{position:static;display:inline-block;opacity:1;margin:0 .9rem;font-size:1.05rem;}
  .marks{height:auto;text-align:center;}
  .work__p--lit{background:var(--blue-tint);box-shadow:inset 2px 0 0 var(--blue);}
  .wf1,.wf2,.wf3,.wf4{opacity:1;}
}

/* ══ product page ═══════════════════════════════════════════════════════ */

/* the opening statement, on a deep textured ground */
.stmt{
  position:relative;overflow:hidden;
  margin-top:calc(var(--head-h) * -1);
  padding:calc(var(--head-h) + clamp(6rem,14vw,11rem)) var(--gut) clamp(6rem,14vw,11rem);
  display:grid;place-items:center;
  background:
    radial-gradient(64% 78% at 14% 10%, rgba(90,124,236,.55), transparent 62%),
    radial-gradient(58% 70% at 88% 84%, rgba(38,63,170,.60), transparent 60%),
    linear-gradient(150deg,#12245A 0%,#0A1940 52%,#07132F 100%);
}
.stmt::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.07) .9px,transparent .9px);
  background-size:6px 6px;
}
.stmt__card{
  position:relative;z-index:1;
  width:min(100%,54rem);
  padding:clamp(2.5rem,6vw,4.5rem) clamp(1.75rem,5vw,4rem);
  background:rgba(4,13,36,.62);
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--r);
  backdrop-filter:blur(2px);
}
.stmt__card p{
  font-family:var(--ff-d);font-weight:400;font-style:normal;
  font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.14;letter-spacing:-.018em;
  color:var(--white);text-align:center;
}
.stmt__card span{color:#9FB4F5;}

/* that's why we built it */
.why{background:var(--tint);padding-top:clamp(3.5rem,8vw,6rem);}
.why__lead{
  font-family:var(--ff-d);font-weight:400;
  font-size:clamp(1.5rem,3.3vw,2.5rem);line-height:1.24;letter-spacing:-.014em;
  color:var(--navy);max-width:44rem;
}
.why__shot{
  width:min(100% - var(--gut)*2, var(--wrap));
  margin:clamp(2.5rem,5vw,4rem) auto 0;
  border-radius:var(--r);overflow:hidden;
  transform:translateY(clamp(2rem,5vw,4rem));
}
.why__shot img{width:100%;height:auto;display:block;}

/* the platform: copy left, accordion right */
.plat{
  background:var(--white);
  padding:calc(clamp(2rem,5vw,4rem) + clamp(4.5rem,9vw,7.5rem)) 0 var(--bandy);
}
.plat__grid{display:grid;gap:clamp(2.5rem,5vw,4rem);grid-template-columns:1fr;align-items:start;}
@media (min-width:940px){ .plat__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:clamp(3rem,6vw,5.5rem);} }
.plat__sub{
  font-family:var(--ff-d);font-size:clamp(1.15rem,2.1vw,1.5rem);
  color:var(--navy);margin:1.1rem 0 1.25rem;
}
.plat__body{color:var(--muted);margin-bottom:1.75rem;}
.plat__list li{
  font-weight:600;font-size:.98rem;padding:.85rem 0;border-bottom:1px solid var(--line);
}
.plat__list li:first-child{border-top:1px solid var(--line);}

.acc{display:grid;gap:.75rem;}
.acc__item{
  border:1px solid var(--line);border-radius:var(--r);background:var(--white);
  overflow:hidden;transition:background-color .25s ease,border-color .25s ease;
}
.acc__item.is-open{background:var(--tint-2);border-color:#CFD6E6;}
.acc__btn{
  display:flex;align-items:center;gap:.85rem;width:100%;
  padding:1.15rem 1.35rem;min-height:56px;
  font-family:var(--ff-b);font-size:1.05rem;font-weight:500;color:var(--navy);
  background:none;border:0;cursor:pointer;text-align:left;
}
.acc__dot{width:8px;height:8px;border-radius:50%;background:var(--blue);flex:none;}
.acc__sign{position:relative;margin-inline-start:auto;width:16px;height:16px;flex:none;}
.acc__sign::before,.acc__sign::after{
  content:"";position:absolute;inset-inline:0;top:50%;height:1.6px;background:var(--navy);
  transform:translateY(-50%);transition:transform .25s ease,opacity .25s ease;
}
.acc__sign::after{transform:translateY(-50%) rotate(90deg);}
.acc__item.is-open .acc__sign::after{transform:translateY(-50%) rotate(0);opacity:0;}
.acc__in{padding:0 1.35rem 1.35rem;}
.acc__in > p{color:var(--muted);font-size:.98rem;margin-bottom:1.25rem;}
.shot{
  background:#C9CDBE;border-radius:12px;padding:clamp(.75rem,2vw,1.35rem);
}
.shot .ui{margin:0;}
.qbar{
  display:flex;gap:.7rem;align-items:flex-start;
  padding:.8rem 1rem;border-bottom:1px solid var(--line);background:var(--blue-tint);
}
.qbar__k{
  flex:none;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--blue-dk);padding-top:.18rem;
}
.qbar p{font-size:.82rem;line-height:1.45;color:var(--navy);}
.tree--flat{border:0;}

/* document editor */
.editor{display:grid;grid-template-columns:1fr;}
@media (min-width:940px){ .editor{grid-template-columns:1fr 1fr;} }
.editor__copy{
  background:var(--tint-2);display:flex;align-items:center;
  padding:clamp(3rem,7vw,6rem) var(--gut);
}
.editor__in{width:100%;max-width:34rem;margin-inline-start:auto;}
@media (max-width:939px){ .editor__in{margin-inline:0;} }
.editor__sub{
  font-family:var(--ff-d);font-size:clamp(1.1rem,2vw,1.4rem);
  color:var(--navy);margin:1rem 0 1.1rem;
}
.editor__in > p{color:var(--muted);margin-bottom:1.5rem;}
.editor__art{
  background:linear-gradient(158deg,#12245A 0%,#0A1940 55%,#07132F 100%);
  display:grid;place-items:center;padding:clamp(2rem,5vw,4rem) var(--gut);
}

.ed{
  width:100%;max-width:32rem;background:var(--white);color:var(--navy);
  border-radius:14px;overflow:hidden;box-shadow:0 40px 70px -34px rgba(0,0,0,.6);
}
.ed__prompt{display:flex;gap:.75rem;padding:1rem 1.15rem;background:var(--blue-tint);}
.ed__k{
  flex:none;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--blue-dk);padding-top:.2rem;
}
.ed__prompt p{font-size:.88rem;line-height:1.5;color:var(--navy);}
.ed__doc{padding:1.15rem;}
.ed__h{font-size:.86rem;font-weight:600;margin-bottom:.85rem;}
.ed__p{font-size:.83rem;line-height:1.68;color:var(--muted);margin-bottom:.8rem;}
.ed__p ins{
  text-decoration:none;color:#1D6B45;background:#E4F5EB;
  border-bottom:1.5px solid #1D6B45;border-radius:2px;padding:.05rem .12rem;
}
.ed__p del{color:#A32C2C;background:#FBE9E9;text-decoration:line-through;
  border-radius:2px;padding:.05rem .12rem;}
.ed__cite{font-size:.7rem;color:var(--muted);}
.ed__cite span{
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue-dk);margin-inline-end:.4rem;
}
.ed__act{
  display:flex;align-items:center;gap:.6rem;
  padding:.85rem 1.15rem;border-top:1px solid var(--line);background:var(--paper);
}
.ed__count{font-size:.72rem;font-weight:600;color:var(--muted);margin-inline-end:auto;}
.ed__btn{
  font-size:.76rem;font-weight:600;border-radius:6px;padding:.42rem .85rem;
  background:var(--navy);color:var(--white);
}
.ed__btn--ghost{background:transparent;color:var(--muted);border:1px solid var(--line);}

/* a larger mark in the footer */
.brand--lg img{width:38px;}
.brand--lg span{font-size:1.02rem;letter-spacing:.15em;}

@media (prefers-reduced-motion:reduce){
  .dlg{animation:none;}
  .why__shot{transform:none;}
}