/* ==========================================================================
   Adelo Consulting — design system
   Built on the getadelo.com token set so both properties read as one studio.
   Source of truth: adelo-unified/app/app/(marketing)/marketing.css
   ========================================================================== */

:root{
  /* navy family */
  --navy:#0B132B; --navy-2:#0F1F3A; --navy-3:#12233f;
  --ink-well:#05091A; --navy-deep:#070C1C; --navy-glass:rgba(148,178,242,.10);

  /* brand blue — official, AA on white */
  --brand:#2563EB; --brand-2:#1D4ED8; --blue:#2563EB;
  --teal:#0DB8A9; --teal-alt:#14B8A6; --teal-soft:#EEF2FB;
  --adelo-gradient:linear-gradient(135deg,#14B8A6 0%,#0DB8A9 50%,#2563EB 100%);
  --aurora:linear-gradient(135deg,#2DD4BF 0%,#14B8A6 34%,#2563EB 100%);

  /* premium tier — champagne gold on jewel navy */
  --gold:#E7C873; --gold-2:#C9A227; --gold-3:#8C6E1E;
  --gold-soft:#FBF6E6; --gold-line:#EAD9A0;
  --gold-grad:linear-gradient(135deg,#F6E8BC 0%,#E7C873 46%,#C9A227 100%);

  /* glass */
  --glass:rgba(255,255,255,.06); --glass-line:rgba(255,255,255,.12);

  /* surfaces */
  --bg:#F6F8FC; --bg-2:#FFFFFF; --white:#FFFFFF; --panel:#F7F9FD;
  --line:#E5EAF3; --line-2:#EEF2F8; --hair:#F1F5FB;

  /* ink */
  --slate:#5A6785; --ink:#0B132B; --ink-2:#3A4658; --ink-3:#94A3B8;
  --success:#16A34A; --warning:#D97706; --danger:#DC2626;

  /* geometry */
  --r-card:22px; --r-btn:13px; --r-pill:999px; --r-lg:18px; --maxw:1200px;

  /* elevation */
  --shadow-1:0 1px 2px rgba(15,23,42,.04);
  --shadow-2:0 20px 50px -18px rgba(11,19,43,.22);
  --shadow-soft:0 8px 30px -12px rgba(11,19,43,.12);
  --shadow-float:0 40px 80px -30px rgba(11,19,43,.38);
  --shadow-lux:0 50px 110px -40px rgba(6,10,28,.62),0 20px 44px -26px rgba(6,10,28,.44);

  /* motion */
  --motion-fast:160ms; --motion-standard:240ms;
  --motion-section:650ms; --motion-hero:1100ms;
  --motion-ease:cubic-bezier(.22,1,.36,1);

  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;font-variant-numeric:tabular-nums;
}
img,svg{max-width:100%}
a{text-decoration:none}
a:not([class*="btn"]){color:inherit}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4,h5{margin:0;line-height:1.08;letter-spacing:-.022em;color:var(--ink);font-weight:700}
h3,h4,h5{font-weight:750}
p{margin:0}
p+p{margin-top:16px}
ul,ol{margin:0;padding:0}
::selection{background:var(--brand);color:#fff}

/* ---------- layout ---------- */
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.container--mid{max-width:1020px}
.container--narrow{max-width:820px}
.section{padding:84px 0}
.section--tight{padding:64px 0}
.section--sm{padding:52px 0}
@media(max-width:900px){.section{padding:76px 0}}
@media(max-width:560px){.container{padding:0 20px}.section{padding:62px 0}}

.section--dark{background:
  radial-gradient(1200px 620px at 72% -12%,rgba(37,99,235,.20),transparent 58%),
  radial-gradient(900px 500px at 8% 8%,rgba(13,148,136,.10),transparent 60%),
  linear-gradient(180deg,var(--navy) 0%,#080d1f 100%);
  color:#fff;position:relative;overflow:hidden}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:#fff}
.section--dark p{color:#aebbcf}
.section--tint{background:var(--panel);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.section--line{border-top:1px solid var(--hair)}

/* ---------- type ---------- */
.display{font-size:clamp(42px,6.2vw,74px);letter-spacing:-.035em;line-height:1.0;font-weight:700}
h1.display{font-size:clamp(38px,5.2vw,62px);letter-spacing:-.035em;line-height:1.02}
h2.display,.h2{font-size:clamp(29px,3.8vw,46px);letter-spacing:-.028em;line-height:1.06}
.h1{font-size:clamp(36px,5vw,58px);letter-spacing:-.03em;line-height:1.04}
.h3{font-size:21px;letter-spacing:-.015em;line-height:1.25}
.h4{font-size:17.5px;letter-spacing:-.015em;font-weight:750}
.lede{font-size:20px;color:var(--ink-2);line-height:1.6;font-weight:420;letter-spacing:-.005em}
.lede--light{color:#c7d0e0}
.small{font-size:15px}
.tiny{font-size:13px;line-height:1.6;color:var(--ink-3)}
.muted{color:var(--slate)}
.center{text-align:center}
.balance{text-wrap:balance}
.mb0{margin-bottom:0}
.mx-auto{margin-left:auto;margin-right:auto}
@media(max-width:560px){body{font-size:16px}.lede{font-size:18px}}

.eyebrow{
  display:inline-block;font-size:12px;font-weight:750;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brand)
}
.eyebrow--light,.navy .eyebrow{color:#8FB0F2}
.eyebrow--gold{font-size:12.5px;font-weight:700;letter-spacing:.16em;color:var(--gold-2)}
.navy .eyebrow--gold{color:var(--gold)}

/* gradient ink — last few words of a headline only */
.grad-ink{background:var(--aurora);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gold-ink{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* section head rhythm: eyebrow → 8 → h2 → 14 → lede → 40 */
.section__head{max-width:780px;margin-bottom:40px}
.section__head--center{margin-left:auto;margin-right:auto;text-align:center}
.section__head h2{margin-top:8px}
.section__head .lede{margin-top:14px}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;
  font-weight:650;font-size:15.5px;letter-spacing:-.01em;border-radius:var(--r-btn);
  padding:13px 22px;border:1.5px solid transparent;min-height:48px;white-space:nowrap;
  text-align:center;position:relative;overflow:hidden;isolation:isolate;
  transition:transform .16s cubic-bezier(.2,.7,.3,1),background .2s ease,
             box-shadow .25s ease,border-color .2s ease
}
.btn>*{position:relative;z-index:2}
.btn svg{width:16px;height:16px;flex:none}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--lg{padding:15px 28px;font-size:16px;min-height:54px}
.btn--sm{padding:10px 18px;min-height:42px;font-size:14.5px;border-radius:12px}

.btn--primary::after,.btn--gold::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent 22%,rgba(255,255,255,.28) 46%,transparent 62%);
  transform:translateX(-130%);transition:transform .7s var(--motion-ease)
}
.btn--primary:hover::after,.btn--gold:hover::after{transform:translateX(130%)}

.btn--primary{
  background:linear-gradient(135deg,#3B82F6 0%,#2563EB 48%,#1D4ED8 100%);
  color:#fff;font-weight:700;letter-spacing:-.012em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),
             0 10px 26px -10px rgba(37,99,235,.72),
             0 2px 6px -1px rgba(30,64,175,.4)
}
.btn--primary:hover{
  background:linear-gradient(135deg,#4C8DFF 0%,#2f6bff 48%,#2148d6 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34),
             0 18px 40px -12px rgba(37,99,235,.85),
             0 4px 12px -2px rgba(30,64,175,.5);
  transform:translateY(-2px)
}
.btn--primary:active{transform:translateY(0);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 6px 16px -8px rgba(37,99,235,.7)}

/* primary on navy — white with a teal glow ring */
.navy .btn--primary{
  background:#fff;color:#0B132B;font-weight:750;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),
             0 10px 30px -12px rgba(3,10,30,.55),
             0 0 0 1px rgba(13,184,169,.55),
             0 0 22px -2px rgba(13,184,169,.45)
}
.navy .btn--primary svg{color:var(--brand)}
.navy .btn--primary:hover{
  background:#fff;color:#0B132B;transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1),
             0 18px 44px -14px rgba(3,10,30,.6),
             0 0 0 1px rgba(13,184,169,.8),
             0 0 30px 0 rgba(13,184,169,.6)
}
.navy .btn--primary::after{background:linear-gradient(100deg,transparent 22%,rgba(37,99,235,.14) 46%,transparent 62%)}

.btn--secondary{background:#fff;color:var(--ink);border-color:var(--line);font-weight:650;
  box-shadow:0 1px 2px rgba(15,23,42,.05)}
.btn--secondary:hover{border-color:#b9c6dc;color:var(--brand-2);
  box-shadow:0 8px 22px -12px rgba(11,19,43,.22);transform:translateY(-2px)}

.btn--on-navy{background:rgba(255,255,255,.09);color:#fff;border-color:rgba(255,255,255,.20);
  backdrop-filter:blur(4px)}
.btn--on-navy:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.34);transform:translateY(-2px)}

.btn--gold{background:linear-gradient(135deg,#F7EBC4 0%,#E7C873 44%,#CFA62E 100%);
  color:#3a2c06;font-weight:750;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),
             0 12px 30px -12px rgba(201,162,39,.85),
             0 2px 6px -1px rgba(140,110,30,.35)}
.btn--gold:hover{background:linear-gradient(135deg,#FBF0CE 0%,#EFCE77 44%,#D8AF34 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),
             0 20px 44px -12px rgba(201,162,39,.95),
             0 4px 10px -2px rgba(140,110,30,.4);transform:translateY(-2px)}

.btn-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn-row--center{justify-content:center}
@media(max-width:560px){
  .btn{width:100%}
  .nav .btn,.nav__cta .btn{width:auto}
}

.link-arrow{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:650;
  color:var(--brand);transition:gap .2s var(--motion-ease)}
.link-arrow svg{width:14px;height:14px}
.link-arrow:hover{gap:9px}
.navy .link-arrow{color:#8FB0F2}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid rgba(231,235,240,.9);
  transition:background .3s ease,box-shadow .3s ease,border-color .3s ease}
.nav.is-stuck{background:rgba(255,255,255,.85);
  box-shadow:0 8px 30px -18px rgba(11,19,43,.26);border-bottom-color:rgba(231,235,240,.6)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:68px;gap:12px}

.brand{display:inline-flex;align-items:center;gap:10px}
.brand__wm{height:21px;width:auto;display:block}
.brand__lockup{height:30px;width:auto;display:block}
.brand__rule{width:1px;height:19px;background:var(--line);flex:none;margin:0 1px}
.brand__sub{font-size:11px;font-weight:750;letter-spacing:.17em;text-transform:uppercase;
  color:var(--slate);white-space:nowrap;padding-top:1px}
.brand--footer .brand__rule{height:22px;background:rgba(255,255,255,.22)}
.brand--footer .brand__sub{color:#8ea0bd}

.nav__links{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav__link{padding:9px 14px;border-radius:10px;font-size:14.5px;font-weight:500;color:var(--ink-2);
  transition:color .15s,background .15s;position:relative}
.nav__link:hover{background:var(--line-2);color:var(--ink)}
.nav__link.is-active{color:var(--brand);font-weight:600}
.nav__link::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:2px;
  background:var(--brand);transform:scaleX(0);transform-origin:left;
  transition:transform .25s var(--motion-ease);opacity:.85}
.nav__link:hover::after,.nav__link.is-active::after{transform:scaleX(1)}

.nav__cta{display:flex;align-items:center;gap:6px;margin-left:8px}
.nav .btn--primary{padding:10px 20px;min-height:44px;font-size:14.5px;border-radius:12px}
.nav.is-stuck .btn--primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 22px -10px rgba(37,99,235,.7)}

.burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;
  background:#fff;align-items:center;justify-content:center;color:var(--ink);flex:none}
.burger span{display:block;width:17px;height:1.7px;background:currentColor;position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:17px;height:1.7px;
  background:currentColor;transition:.2s var(--motion-ease)}
.burger span::before{top:-5.5px}.burger span::after{top:5.5px}
.nav.is-open .burger span{background:transparent}
.nav.is-open .burger span::before{top:0;transform:rotate(45deg)}
.nav.is-open .burger span::after{top:0;transform:rotate(-45deg)}

@media(max-width:980px){
  .nav__links{display:none}
  .burger{display:inline-flex}
  .nav__cta{margin-left:auto;margin-right:10px}
}
@media(max-width:560px){
  .nav .btn--primary{padding:9px 16px;min-height:40px;font-size:14px}
  .brand__sub{display:none}
}
@media(max-width:400px){.nav__cta{display:none}}

.mobile{display:none;border-top:1px solid var(--line);background:#fff;padding:14px 0 26px}
.nav.is-open .mobile{display:block}
.mobile a:not(.btn){display:block;padding:13px 12px;font-size:16px;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--line-2)}
.mobile a:not(.btn):hover{background:var(--line-2)}
.mobile .btn{width:100%;margin-top:16px;padding:14px 20px;min-height:50px;font-size:15.5px;
  font-weight:700;border-radius:14px}

/* ---------- signal motif ---------- */
.sigmotif{position:absolute;pointer-events:none;z-index:0;left:0;right:0;bottom:0;width:100%}
.hero-sig{height:160px;opacity:.6}
.page-head-sig{height:200px;bottom:-1px;opacity:.85}
.cta-sig{height:190px;opacity:.9}
@media(max-width:900px){.hero-sig{height:120px;opacity:.42}.page-head-sig{height:150px;opacity:.6}}
.sig-line{stroke-dasharray:1;stroke-dashoffset:0}
.sig-dot{offset-distance:0%;opacity:0}
@media(prefers-reduced-motion:no-preference){
  .sig-line{stroke-dashoffset:1;animation:sigDraw 2.9s cubic-bezier(.42,.04,.32,1) .35s both}
  .sig-area{opacity:0;animation:sigFill 1.4s var(--motion-ease) 2.2s both}
  .sig-dot{animation:sigRide 2.9s cubic-bezier(.42,.04,.32,1) .35s both,
                     sigDotFade 2.9s linear .35s both}
}
@keyframes sigDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes sigRide{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes sigFill{from{opacity:0}to{opacity:1}}
@keyframes sigDotFade{0%{opacity:0}6%{opacity:.95}80%{opacity:.9}100%{opacity:0}}
@supports not (offset-path: path("M0 0 L1 1")){.sig-dot{display:none}}

/* ---------- dark surfaces ---------- */
.navy{background:
  radial-gradient(1200px 620px at 72% -12%,rgba(37,99,235,.20),transparent 58%),
  radial-gradient(900px 500px at 8% 8%,rgba(13,148,136,.10),transparent 60%),
  linear-gradient(180deg,var(--navy) 0%,#080d1f 100%);
  color:#fff;position:relative;overflow:hidden}
.navy h1,.navy h2,.navy h3,.navy h4{color:#fff}
.navy p{color:#aebbcf}
.navy .lede{color:#c7d0e0}
.navy-lux{background:
  radial-gradient(1200px 640px at 74% -14%,rgba(37,99,235,.26),transparent 56%),
  radial-gradient(1000px 560px at 6% 6%,rgba(20,184,166,.14),transparent 60%),
  radial-gradient(900px 900px at 50% 130%,rgba(94,234,212,.08),transparent 60%),
  linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%)}
.navy>.container{position:relative;z-index:1}

/* ---------- hero ---------- */
.hero{padding:112px 0 152px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(58% 55% at 20% 26%,rgba(13,184,169,.16),transparent 60%),
  radial-gradient(52% 58% at 84% 16%,rgba(37,99,235,.20),transparent 62%),
  radial-gradient(90% 80% at 50% 128%,rgba(20,184,166,.10),transparent 60%)}

/* Gold-lit hero. Same construction as .premium on getadelo: gold from the
   upper right, blue from the upper left, the two systems meeting on one
   surface. Used where the section's accent is gold, so the motif, the badge
   and the headline all read as one statement. */
.hero--gold{background:
  radial-gradient(1100px 560px at 82% -10%,rgba(201,162,39,.20),transparent 56%),
  radial-gradient(900px 520px at 4% 8%,rgba(37,99,235,.20),transparent 60%),
  linear-gradient(180deg,#0C1428 0%,#080D1D 100%)}
.hero--gold::before{background:
  radial-gradient(56% 54% at 78% 18%,rgba(231,200,115,.13),transparent 62%),
  radial-gradient(52% 58% at 12% 24%,rgba(37,99,235,.16),transparent 62%),
  radial-gradient(90% 80% at 50% 128%,rgba(201,162,39,.08),transparent 60%)}
.hero--gold .hpanel__grid a::before{background:var(--gold-grad)}
.hero>.container{position:relative;z-index:1}
.hero h1{color:#fff;max-width:14ch;font-size:clamp(38px,5.2vw,62px);letter-spacing:-.035em;line-height:1.02}
.hero .lede{color:#c3cee2;font-size:20px;max-width:560px;margin-top:18px}
.hero .btn-row{margin-top:30px}
.hero__note{margin-top:26px;font-size:13.5px;color:#8ea0bd;max-width:52ch}
.hero__grid{display:grid;grid-template-columns:1.04fr .96fr;gap:56px;align-items:center;position:relative}
.hero__grid>*{min-width:0}
@media(max-width:1000px){.hero__grid{grid-template-columns:1fr;gap:44px}.hero .lede{max-width:600px}}
@media(max-width:560px){.hero{padding:80px 0 96px}}

.hero-badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;
  color:#cdd9f5;background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.28);
  padding:7px 14px;border-radius:var(--r-pill)}
.hero-badge.gold{color:var(--gold);background:rgba(231,200,115,.12);border-color:rgba(231,200,115,.30)}
.hero-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-grad);flex:none}

.page-head{position:relative;overflow:hidden;padding:88px 0 72px}
.page-head::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(52% 62% at 14% 6%,rgba(13,184,169,.15),transparent 60%),
             radial-gradient(52% 74% at 93% -6%,rgba(37,99,235,.19),transparent 62%)}
.page-head>.container{position:relative;z-index:1}
.page-head .h1{margin-top:16px;max-width:20ch;color:#fff}
.page-head .lede{color:#c7d0e0;margin-top:16px;max-width:680px}
.page-head .btn-row{margin-top:28px}

.crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:#8ea0bd;margin-bottom:14px}
.crumb a:hover{color:#fff}
.crumb span{opacity:.55}

/* ---------- glass panel (hero right) ---------- */
.hpanel{
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.02));
  border:1px solid var(--glass-line);border-radius:26px;padding:26px;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:var(--shadow-lux);
  position:relative}
.hpanel::before{content:"";position:absolute;inset:0;border-radius:26px;pointer-events:none;
  background:linear-gradient(135deg,rgba(231,200,115,.35),transparent 40%);
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude;padding:1px;opacity:.7}
.hpanel__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid rgba(255,255,255,.12)}
.hpanel__title{font-size:12px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.hpanel__count{font-size:13px;color:#9fb0cc;font-weight:600}
.hpanel__grid{display:grid;grid-template-columns:1fr 1fr;gap:1px 20px}
.hpanel__grid a{display:flex;align-items:flex-start;gap:9px;padding:7px 0;font-size:14px;
  color:#c3cee2;line-height:1.4;transition:color .18s}
.hpanel__grid a::before{content:"";width:5px;height:5px;border-radius:50%;
  background:var(--adelo-gradient);flex:none;margin-top:8px;opacity:.85;transition:opacity .18s}
.hpanel__grid a:hover{color:#fff}
.hpanel__grid a:hover::before{opacity:1}
.hpanel__foot{margin-top:17px;padding-top:15px;border-top:1px solid rgba(255,255,255,.12);
  font-size:13.5px;color:#9fb0cc;line-height:1.55}
@media(max-width:520px){.hpanel__grid{grid-template-columns:1fr}.hpanel{padding:20px}}

/* ---------- cards ---------- */
.grid{display:grid;gap:20px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

.split{display:grid;grid-template-columns:1fr 1.08fr;gap:56px;align-items:center}
.split--top{align-items:start}
.split--40{grid-template-columns:.86fr 1.14fr}
@media(max-width:1000px){.split,.split--40{grid-template-columns:1fr;gap:32px}}

.card{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-card);padding:26px;
  box-shadow:var(--shadow-1);display:flex;flex-direction:column;
  transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .25s ease,border-color .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#dbe3ec}
.card--flat:hover{transform:none;box-shadow:var(--shadow-1);border-color:var(--line-2)}
.card h3{font-size:17.5px;margin-bottom:7px;letter-spacing:-.015em}
.card p{font-size:15px;color:var(--slate);line-height:1.6}
.card p+p{margin-top:12px}
.card .link-arrow{margin-top:auto;padding-top:16px}
.card:hover .link-arrow{gap:9px}
.navy .card{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.10)}
.navy .card:hover{border-color:rgba(255,255,255,.24);box-shadow:none}
.navy .card p{color:#aebbcf}

.ico{width:42px;height:42px;border-radius:12px;display:inline-flex;align-items:center;
  justify-content:center;background:var(--teal-soft);color:var(--brand);margin-bottom:16px;flex:none}
.ico svg{width:20px;height:20px}
.ico.gold{background:rgba(201,162,39,.10);color:var(--gold-3)}
.navy .ico{background:rgba(255,255,255,.08);color:#93B4F0}
.navy .ico.gold{background:rgba(231,200,115,.12);border:1px solid rgba(231,200,115,.30);color:var(--gold)}

.card__num{display:block;font-size:15px;font-weight:800;color:var(--brand);
  width:32px;height:32px;border-radius:10px;background:var(--teal-soft);
  display:grid;place-items:center;margin-bottom:13px}
.navy .card__num{background:rgba(231,200,115,.12);border:1px solid rgba(231,200,115,.3);color:var(--gold)}

.svc-card__label{font-size:11.5px;font-weight:750;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:11px;display:block}
.svc-card ul{list-style:none;margin:14px 0 0}
.svc-card li{font-size:13.5px;color:var(--slate);padding-left:15px;position:relative;margin-bottom:5px}
.svc-card li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;
  border-radius:50%;background:var(--adelo-gradient);opacity:.8}

/* ---------- feature list ---------- */
.flist{display:grid;gap:22px}
.flist--two{grid-template-columns:repeat(2,1fr);gap:26px 56px}
@media(max-width:900px){.flist--two{grid-template-columns:1fr}}
.flist__item{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.flist__dot{width:28px;height:28px;border-radius:9px;background:var(--teal-soft);color:var(--brand);
  display:grid;place-items:center;flex:none;margin-top:1px}
.flist__dot svg{width:14px;height:14px}
.flist h4{font-size:15.5px;font-weight:700;letter-spacing:-.01em;margin-bottom:3px}
.flist p{font-size:14.5px;color:var(--slate);line-height:1.55}
.navy .flist__dot{background:rgba(231,200,115,.12);border:1px solid rgba(231,200,115,.28);color:var(--gold)}
.navy .flist p{color:#a9b6cf}

/* ---------- checks ---------- */
.checks{list-style:none;display:grid;gap:11px}
.checks li{position:relative;padding-left:30px;font-size:15.5px;color:var(--ink-2);line-height:1.55}
.checks li::before{content:"";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:6px;
  background:var(--teal-soft)}
.checks li::after{content:"";position:absolute;left:6px;top:7px;width:7px;height:3.5px;
  border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
.navy .checks li{color:#dbe4f5}
.navy .checks li::before{background:rgba(231,200,115,.12)}
.navy .checks li::after{border-color:var(--gold)}

/* ---------- compare band ---------- */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:900px){.compare{grid-template-columns:1fr}}
.compare__col{border-radius:var(--r-card);padding:28px}
.compare__col--a{background:#fff;border:1px solid var(--line-2);box-shadow:var(--shadow-1)}
.compare__col--b{position:relative;overflow:hidden;color:#fff;border:1px solid rgba(255,255,255,.10);
  background:radial-gradient(700px 380px at 84% -20%,rgba(37,99,235,.24),transparent 58%),
             linear-gradient(180deg,#0C1428 0%,#080D1D 100%);
  box-shadow:var(--shadow-2)}
.compare__col--b::after{content:"";position:absolute;inset:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(94,234,212,.6),rgba(94,234,212,0) 46%)}
.compare__col--b h4{color:#fff}
.compare__tag{font-size:11.5px;font-weight:750;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:12px;display:block}
.compare__col--b .compare__tag{color:#5EEAD4}
.compare h4{font-size:19px;letter-spacing:-.018em;margin-bottom:16px}
.compare ul{list-style:none}
.compare li{font-size:15px;padding-left:17px;position:relative;margin-bottom:9px;color:var(--slate);line-height:1.55}
.compare__col--b li{color:#aebbcf}
.compare li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:1.5px;
  background:currentColor;opacity:.5}
.compare li:last-child{margin-bottom:0}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.stats{grid-template-columns:1fr}}
.stat{padding:24px;border-radius:var(--r-card);background:var(--glass);
  border:1px solid var(--glass-line);backdrop-filter:blur(6px);display:flex;flex-direction:column}
.stat__tag{font-size:10.5px;font-weight:750;letter-spacing:.13em;text-transform:uppercase;
  color:#8FB0F2;margin-bottom:14px;display:block}
.stat__n{font-size:clamp(30px,3.4vw,42px);font-weight:800;letter-spacing:-.03em;line-height:1;
  background:var(--adelo-gradient);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.stat__l{margin-top:10px;font-size:13.5px;color:#a9b6cc;line-height:1.5}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.steps{grid-template-columns:1fr}}
.step{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-lg);padding:24px;
  box-shadow:var(--shadow-1)}
.step .sn{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;
  font-weight:800;font-size:15px;color:var(--brand);background:var(--teal-soft);margin-bottom:13px}
.step h4{font-size:16.5px;letter-spacing:-.012em;margin-bottom:5px}
.step .dur{font-size:13px;font-weight:650;color:var(--ink-3);margin-left:7px}
.step p{font-size:14.5px;color:var(--slate);line-height:1.55}
.navy .step{background:var(--glass);border-color:var(--glass-line)}
.navy .step .sn{color:var(--gold);background:rgba(231,200,115,.12);border:1px solid rgba(231,200,115,.3)}
.navy .step p{color:#a9b6cf}

/* ---------- quote ---------- */
.quote{max-width:820px}
.quote blockquote{margin:0 0 22px;font-size:clamp(22px,2.7vw,31px);line-height:1.34;
  letter-spacing:-.02em;font-weight:600;color:#fff}
.quote__by{display:flex;align-items:center;gap:14px}
.quote__avatar{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  font-weight:800;font-size:15px;color:#0e1220;background:var(--gold-grad);flex:none;
  box-shadow:0 12px 30px -14px rgba(201,162,39,.7)}
.quote__name{font-weight:700;color:#fff;font-size:15.5px;line-height:1.3}
.quote__role{font-size:14px;color:#9fb0cc;line-height:1.35;margin-top:2px}
.quote__creds{font-weight:600;color:#9fb0cc;font-size:13.5px;letter-spacing:.01em;white-space:nowrap}
.quote__avatar--card{width:42px;height:42px;border-radius:12px;font-size:13px;margin-bottom:16px}
.creds{font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--slate);
  margin-top:5px;text-transform:none}
@media(max-width:480px){.quote__creds{white-space:normal;display:block;margin-top:2px}}

/* ---------- accordion ---------- */
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{width:100%;background:none;border:0;text-align:left;padding:20px 44px 20px 0;
  font-size:17px;font-weight:700;color:var(--ink);position:relative;letter-spacing:-.015em;line-height:1.4}
.acc__btn::after{content:"";position:absolute;right:8px;top:50%;width:9px;height:9px;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:translateY(-70%) rotate(45deg);transition:transform .25s var(--motion-ease),border-color .2s}
.acc__item.is-open .acc__btn::after{transform:translateY(-25%) rotate(-135deg);border-color:var(--brand)}
.acc__panel{display:none;padding:0 44px 22px 0}
.acc__item.is-open .acc__panel{display:block;animation:expFade .38s var(--motion-ease) both}
.acc__panel p{color:var(--slate);font-size:15.5px;line-height:1.65}
@keyframes expFade{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}

/* ---------- pills ---------- */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{padding:7px 14px;border-radius:var(--r-pill);border:1px solid var(--line);
  font-size:13.5px;font-weight:600;color:var(--ink-2);background:#fff;transition:.18s}
a.pill:hover{border-color:#b9c6dc;color:var(--brand-2);transform:translateY(-1px)}
.pill--accent{background:var(--teal-soft);border-color:transparent;color:var(--brand-2)}
.pill--gold{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-3)}

/* ---------- posts ---------- */
.post{display:grid;grid-template-columns:170px 1fr;gap:32px;padding:26px 0;
  border-bottom:1px solid var(--line-2);align-items:start;transition:.2s}
.post__meta{font-size:13px;color:var(--ink-3);line-height:1.5;padding-top:3px}
.post__meta b{display:block;font-size:11.5px;font-weight:750;letter-spacing:.11em;
  text-transform:uppercase;color:var(--brand);margin-bottom:5px}
.post h3{font-size:20px;letter-spacing:-.02em;margin-bottom:7px;line-height:1.25}
.post p{font-size:15.5px;color:var(--slate);line-height:1.6;margin-bottom:11px}
.post:hover h3{color:var(--brand)}
.post:hover .link-arrow{gap:9px}
@media(max-width:760px){.post{grid-template-columns:1fr;gap:10px}}

/* ---------- article ---------- */
.prose{max-width:720px}
.prose p{font-size:17.5px;line-height:1.72;color:var(--ink-2);margin-bottom:20px}
.prose p+p{margin-top:0}
.prose>p:first-child{font-size:20px;line-height:1.6;color:var(--ink);font-weight:420}
.prose h2{font-size:26px;letter-spacing:-.024em;line-height:1.2;margin:44px 0 14px}
.artmeta{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;font-size:13.5px;
  color:#8ea0bd;margin-top:26px}
.pullq{margin:40px 0;padding:30px 32px;border-radius:var(--r-card);color:#fff;position:relative;
  overflow:hidden;font-size:clamp(20px,2.4vw,27px);line-height:1.34;letter-spacing:-.02em;font-weight:600;
  background:radial-gradient(700px 400px at 82% -20%,rgba(37,99,235,.26),transparent 58%),
             linear-gradient(180deg,#0C1428 0%,#080D1D 100%);
  box-shadow:var(--shadow-2)}
.pullq::after{content:"";position:absolute;inset:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(231,200,115,.5),rgba(231,200,115,0) 42%)}
.takeaways{margin-top:44px;padding:28px;background:var(--panel);border:1px solid var(--line-2);
  border-radius:var(--r-card)}
.takeaways h3{font-size:12px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand);margin-bottom:16px}
.artnav{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.artnav{grid-template-columns:1fr}}

/* ---------- industry figure ---------- */
.figure{margin-top:28px;padding:24px;border-radius:var(--r-card);background:#fff;
  border:1px solid var(--line-2);box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.figure::after{content:"";position:absolute;inset:0;top:0;height:2px;pointer-events:none;
  background:linear-gradient(90deg,#14B8A6,#2563EB 46%,transparent 92%)}
.figure__n{font-size:clamp(32px,3.6vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1;
  background:var(--adelo-gradient);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.figure__l{margin-top:11px;font-size:15px;color:var(--ink-2);line-height:1.55}
.figure__src{margin-top:14px;padding-top:12px;border-top:1px solid var(--line-2);
  font-size:11.5px;color:var(--ink-3);line-height:1.5}

/* ---------- note ---------- */
.note{border-left:2px solid var(--brand);padding:2px 0 2px 16px;font-size:14px;
  color:var(--slate);line-height:1.6;margin-top:24px}
.navy .note,.note--light{border-color:var(--gold);color:#9fb0cc}

/* ---------- CTA band ---------- */
.cta{position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(1100px 560px at 82% -10%,rgba(201,162,39,.20),transparent 56%),
    radial-gradient(900px 520px at 4% 8%,rgba(37,99,235,.20),transparent 60%),
    linear-gradient(180deg,#0C1428 0%,#080D1D 100%)}
.cta::after{content:"";position:absolute;inset:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(231,200,115,.5),rgba(231,200,115,0) 42%)}
.cta>.container{position:relative;z-index:1}
.cta__inner{padding:84px 0;display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:center}
.cta h2{color:#fff;max-width:20ch}
.cta p{color:#c9d2e6;margin-top:14px;max-width:52ch}
.cta__actions{display:flex;flex-direction:column;gap:12px}
.cta__actions .btn{width:100%}
@media(max-width:900px){
  .cta__inner{grid-template-columns:1fr;gap:32px;padding:66px 0}
  .cta__actions{flex-direction:row;flex-wrap:wrap}
  .cta__actions .btn{width:auto;flex:1 1 210px}
}

/* ---------- forms ---------- */
.form{display:grid;gap:18px}
.field{display:grid;gap:6px}
.field label{font-size:14px;font-weight:650;color:var(--ink)}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:var(--r-btn);
  font:inherit;font-size:15.5px;color:var(--ink);background:#fff;transition:.18s;-webkit-appearance:none}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.14)}
.field textarea{min-height:140px;resize:vertical}
.field .hint{font-size:12.5px;color:var(--slate);margin-top:5px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:560px){.form__row{grid-template-columns:1fr}}
.formmsg{padding:13px 16px;border-radius:var(--r-btn);font-size:14.5px;line-height:1.55}
.formmsg--ok{background:#ECFDF5;color:#0F766E;border:1px solid #A7F3D0}
.formmsg--err{background:#FEF2F2;color:#9B2226;border:1px solid #FECACA}

/* ---------- footer ---------- */
.footer{background:linear-gradient(180deg,#0B132B 0%,#070C1C 100%);color:#8ea0bd;
  padding:72px 0 30px;font-size:14.5px;position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(900px 420px at 88% -20%,rgba(37,99,235,.14),transparent 60%)}
.footer>.container{position:relative;z-index:1}
.footer__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px}
@media(max-width:1024px){.footer__top{grid-template-columns:1fr 1fr 1fr;gap:32px}.footer__brand{grid-column:1/-1}}
@media(max-width:560px){.footer__top{grid-template-columns:1fr 1fr}}
.footer__brand .brand__name{color:#fff}
.footer__brand .brand__sub{color:#6F7F9B}
.footer__blurb{margin-top:18px;font-size:14px;color:#8ea0bd;max-width:30ch;line-height:1.6}
.footer h5{color:#fff;font-size:11.5px;font-weight:750;letter-spacing:.13em;text-transform:uppercase;
  margin-bottom:16px}
.footer ul{list-style:none}
.footer li{margin-bottom:10px}
.footer a{color:#c3cddd;transition:color .15s}
.footer a:hover{color:#fff}
.footer__disc{margin-top:26px;font-size:12.5px;color:#6F7F9B;line-height:1.65;max-width:76ch}
.footer__bottom{border-top:1px solid rgba(255,255,255,.10);padding-top:24px;margin-top:26px;
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;font-size:13px}
.footer__legal{display:flex;gap:22px;flex-wrap:wrap}

/* ---------- sibling property ---------- */
.sibling{
  display:block;margin-top:24px;padding:16px 18px;border-radius:var(--r-lg);
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.10);
  max-width:29ch;transition:background .25s var(--motion-ease),border-color .25s var(--motion-ease),
  transform .25s var(--motion-ease)}
.sibling:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.24);transform:translateY(-2px)}
.sibling__eyebrow{display:block;font-size:10px;font-weight:750;letter-spacing:.15em;
  text-transform:uppercase;color:#7E8EA9;margin-bottom:9px}
.sibling__name{display:flex;align-items:center;gap:7px;font-size:16px;font-weight:700;
  letter-spacing:-.03em;color:#fff}
.sibling__name b{font-weight:700;background:var(--adelo-gradient);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sibling__name svg{width:14px;height:14px;color:#7E8EA9;transition:transform .25s var(--motion-ease)}
.sibling:hover .sibling__name svg{transform:translateX(3px);color:#fff}
.sibling__desc{display:block;margin-top:6px;font-size:13px;color:#8ea0bd;line-height:1.5}

/* ---------- motion ---------- */
.reveal{opacity:1}
@media(prefers-reduced-motion:no-preference){
  .reveal{animation:riseIn .5s cubic-bezier(.2,.7,.3,1) both}
}
@keyframes riseIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.reveal-on .reveal{opacity:0;transform:translateY(22px);animation:none}
@media(prefers-reduced-motion:no-preference){
  .reveal-on .reveal{transition:opacity .7s var(--motion-ease),transform .7s var(--motion-ease)}
}
.reveal-on .reveal.in{opacity:1;transform:none}

.hero-anim{opacity:1}
@media(prefers-reduced-motion:no-preference){
  .hero-anim{opacity:0}
  .hero-anim.a1{animation:heroUp var(--motion-section) var(--motion-ease) .10s both}
  .hero-anim.a2{animation:heroUp var(--motion-section) var(--motion-ease) .22s both}
  .hero-anim.a3{animation:heroUp var(--motion-section) var(--motion-ease) .36s both}
  .hero-anim.a4{animation:heroUp var(--motion-section) var(--motion-ease) .50s both}
  .hero-anim.a5{animation:heroUp var(--motion-section) var(--motion-ease) .62s both}
  .hero__grid .hpanel{animation:heroRise var(--motion-hero) var(--motion-ease) .38s both}
}
@keyframes heroUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes heroRise{from{opacity:0;transform:translateY(20px) scale(.985);filter:blur(8px)}
                    60%{opacity:1}
                    to{opacity:1;transform:none;filter:blur(0)}}

@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .reveal,.reveal-on .reveal,.hero-anim{opacity:1!important;transform:none!important;
    transition:none!important;animation:none!important}
  .btn,.card{transition:none}
  .btn:hover,.card:hover{transform:none}
  .btn--primary::after,.btn--gold::after{display:none}
  .sig-line,.sig-area,.sig-dot{animation:none}
  .sig-dot{opacity:0}
}

/* ---------- a11y ---------- */
.skip{position:absolute;left:-9999px;top:0;background:#fff;padding:13px 20px;z-index:200;
  border-radius:var(--r-btn);font-weight:650}
.skip:focus{left:12px;top:12px;box-shadow:var(--shadow-2)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}

@media print{.nav,.footer,.cta,.mobile,.sigmotif{display:none}body{font-size:12px;color:#000;background:#fff}}

/* ── THE DESCRIPTOR CARRIES THE PRODUCT'S COLOUR ─────────────────────────
   Matched to getadelo.com, adelodocs.com and adelotechnologies.com.

   Two values, because the nav bar and the footer are different grounds. This
   site's bar composites to #FCFDFE (white 72% over --bg #F6F8FC, and this
   stylesheet has ZERO prefers-color-scheme rules so that never changes), while
   the footer is navy. #5EEAD4 on the bar would be 1.4:1 — invisible, not
   quiet. So the hue carries and the value follows the ground.

       on the white bar   #0F766E   5.37:1
       on the navy footer #5EEAD4  12.43:1

   The descriptor was #6F7F9B, a grey, measuring 3.98:1 on its own bar — under
   the 4.5:1 floor for 11px text. So this is a legibility fix as much as a
   brand one. Consulting's own --teal is #0DB8A9; #0F766E is that hue at a
   value the bar can carry, and matches what Workforce and CRM use.
   ──────────────────────────────────────────────────────────────────────── */
.nav .brand__sub{color:#0F766E}
.brand--footer .brand__sub{color:#5EEAD4}

/* ── THE FAMILY ROW, NOT A FAMILY COLUMN ─────────────────────────────────
   The three sibling cards were stacked inside .footer__brand, the first cell
   of the .footer__top grid, which made the footer twice as tall as it needed
   to be and read as three unrelated asides. They now sit in their own
   full-width row under the grid. The eyebrow that lived inside the first card
   is the row's heading, which is what it always was. Same change as
   getadelo.com's SiteFooter. */
.siblingband{padding:4px 0 36px}
.siblingband h2{display:block;font-size:10px;font-weight:750;letter-spacing:.15em;
  text-transform:uppercase;color:#7E8EA9;margin:0 0 14px}
.siblingband__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.siblingband .sibling{margin-top:0;max-width:none;height:100%}
/* Below this the three would be under 200px each, where the descriptions wrap
   to four lines and the row is taller than the stack it replaced. */
@media(max-width:860px){.siblingband__grid{grid-template-columns:1fr}}