/* ADRIVON case study pages — shared styles. Same token system as the home page. */
:root{
  --ink:#0B1A2E;--ink-2:#16294A;--ink-line:rgba(235,209,160,.14);
  --paper:#F5F7FA;--white:#FFFFFF;--text:#0C1826;--muted:#56667C;--line:#DDE3EB;
  --accent:#8A6A3C;--cyan:#EBD1A0;--grad:linear-gradient(90deg,#EBD1A0 0%,#C9A46A 45%,#9A7443 100%);--accent-soft:#E8EFFF;--accent-on-dark:#EBD1A0;--signal:#F0A436;--ok:#1E9A6A;
  --display:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --body:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1600px;--gutter:clamp(16px,4vw,48px);--ease:cubic-bezier(.2,.7,.1,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;letter-spacing:-.02em}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:15px;padding:16px 30px;border-radius:999px;border:1px solid transparent;transition:background .2s,border-color .2s}
.btn svg{transition:transform .2s}.btn:hover svg{transform:translateX(3px)}
.btn-primary{background:linear-gradient(90deg,#C9A46A,#9A7443);color:var(--white);box-shadow:0 10px 30px -10px rgba(46,134,191,.7)}.btn-primary:hover{box-shadow:0 14px 36px -8px rgba(94,226,240,.55)}
.btn-ghost-dark{border-color:rgba(255,255,255,.28);color:var(--white)}.btn-ghost-dark:hover{border-color:var(--white)}
.btn-white{background:var(--white);color:var(--accent)}
.btn .rip{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:currentColor;opacity:.25;pointer-events:none;animation:ripple .6s ease-out forwards}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(10,11,53,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--ink-line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:100px;gap:24px}
.logo{display:flex;align-items:center;gap:14px;color:var(--white);font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:.14em;line-height:1}
.logo svg{width:48px;height:42px}
.logo .lt{display:flex;flex-direction:column;gap:7px}
.logo small{font-family:var(--body);font-weight:500;font-size:10.5px;letter-spacing:.42em;color:rgba(255,255,255,.75)}
.nav-links{display:flex;gap:44px;font-size:17px;color:rgba(255,255,255,.78)}
.nav-links a:hover,.nav-links a.cur{color:var(--white)}
.nav .btn{padding:14px 30px;font-size:16px;background:transparent;border-color:rgba(255,255,255,.35);box-shadow:none}.nav .btn:hover{border-color:#fff}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--accent);transform-origin:0 50%;transform:scaleX(0)}

/* hero */
.hero{background:radial-gradient(60% 60% at 0% 30%,rgba(201,164,106,.38),transparent 70%),radial-gradient(55% 60% at 100% 80%,rgba(154,116,67,.38),transparent 70%),var(--ink);color:var(--white);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(235,209,160,.06) 1px,transparent 1px),linear-gradient(0deg,rgba(235,209,160,.06) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:linear-gradient(90deg,transparent 20%,#000 90%);mask-image:linear-gradient(90deg,transparent 20%,#000 90%);animation:drift 30s linear infinite}
.hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:48px 96px;align-items:end;padding-block:96px 112px}
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);display:flex;gap:10px;flex-wrap:wrap}
.crumb a:hover{color:var(--white)}
.hero .eyebrow{color:var(--cyan);margin-top:40px;display:inline-flex;align-items:center;border:1px solid rgba(235,209,160,.35);border-radius:999px;padding:10px 22px;font-family:var(--display);font-weight:600;letter-spacing:.22em;background:rgba(255,255,255,.03)}

.hero h1{font-size:clamp(40px,6vw,84px);line-height:1;font-weight:700;margin-top:24px;letter-spacing:-.035em}
.hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.hero h1 .w > span{display:inline-block;animation:rise 1s both var(--ease);animation-delay:calc(.25s + var(--i) * .07s)}
.hero-sub{margin-top:24px;font-size:clamp(17px,1.4vw,19px);color:rgba(255,255,255,.74);max-width:600px;animation:up .9s .7s both var(--ease)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:20px;margin-top:48px;animation:up .9s .85s both var(--ease)}
.keyres{border-top:1px solid var(--accent-on-dark);animation:fade 1s .9s both}
.keyres div{padding:18px 0;border-bottom:1px solid var(--ink-line);animation:up .8s both var(--ease)}
.keyres div:nth-child(1){animation-delay:1s}.keyres div:nth-child(2){animation-delay:1.1s}.keyres div:nth-child(3){animation-delay:1.2s}
.keyres b{display:block;font-family:var(--display);font-size:clamp(28px,3vw,40px);font-weight:600;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
.keyres div > span{display:block;margin-top:6px;font-size:14px;color:rgba(255,255,255,.6)}

/* fact strip */
.facts{background:var(--ink-2);color:var(--white);border-top:1px solid var(--ink-line)}
.facts dl{margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.facts dl > div{padding:24px 20px 26px 0;min-width:0}
.facts dl > div + div{padding-left:20px;border-left:1px solid var(--ink-line)}
.facts dt{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.facts dd{margin:8px 0 0;font-size:15px;line-height:1.45}

/* chapters */
section.chapter{padding-block:clamp(72px,9vw,128px)}
section.white{background:var(--white)}
section.dark{background:var(--ink);color:var(--white)}
section.dark .eyebrow{color:var(--accent-on-dark)}
section.dark .lede{color:rgba(255,255,255,.66)}
.head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:32px 64px;align-items:end;margin-bottom:56px}
.head h2{font-size:clamp(32px,4vw,54px);line-height:1.05;font-weight:700;margin-top:16px}
.lede{font-size:18px;color:var(--muted);max-width:56ch}

/* challenge */
.challenge{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:48px 80px;align-items:start}
.challenge .body{display:grid;gap:20px;font-size:18px;line-height:1.65}
.bigstat{border-left:2px solid var(--signal);padding-left:28px}
.bigstat b{display:block;font-family:var(--display);font-size:clamp(48px,5.5vw,80px);font-weight:700;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.bigstat > span{display:block;margin-top:14px;color:var(--muted);font-size:16px;max-width:32ch}
.pains{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border-top:1px solid var(--line)}
.pains li{padding:16px 0 16px 28px;border-bottom:1px solid var(--line);position:relative;font-size:15px}
.pains li::before{content:"";position:absolute;left:0;top:24px;width:12px;height:1px;background:var(--signal)}

/* components */
.comps{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:24px}
.comp{background:var(--white);border:1px solid var(--line);padding:32px;display:flex;flex-direction:column;gap:14px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .25s,opacity .9s var(--ease)}
.comp:hover{transform:translateY(-6px);box-shadow:0 18px 40px -22px rgba(12,24,38,.35);border-color:var(--accent)}
.comp .tag{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.comp h3{font-size:22px;font-weight:600;line-height:1.2}
.comp p{color:var(--muted);font-size:15px}
.comp svg{color:var(--accent)}
.comp svg *{stroke-dasharray:160;stroke-dashoffset:160;transition:stroke-dashoffset 1.6s var(--ease);transition-delay:calc(var(--d,0s) + .3s)}
.comp.in svg *{stroke-dashoffset:0}

/* flow (sequential steps) */
.flow{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));position:relative}
.flow::before{content:"";position:absolute;left:0;right:0;top:9px;height:1px;background:var(--ink-line);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.8s var(--ease)}
.flow.lined::before{transform:scaleX(1)}
.flow .st{padding-right:24px;min-width:0}
.flow .st::before{content:"";display:block;width:19px;height:19px;border-radius:50%;border:1px solid var(--accent-on-dark);background:var(--ink);box-shadow:inset 0 0 0 5px var(--ink),inset 0 0 0 10px var(--accent-on-dark);transform:scale(0);transition:transform .5s var(--ease);transition-delay:calc(var(--d,0s) + .4s)}
.flow .st.in::before{transform:scale(1)}
.flow .n{display:block;margin-top:24px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:rgba(255,255,255,.45)}
.flow h3{font-size:20px;font-weight:600;margin-top:8px}
.flow p{margin-top:10px;color:rgba(255,255,255,.66);font-size:15px}
section:not(.dark) .flow::before{background:var(--line)}
section:not(.dark) .flow .st::before{border-color:var(--accent);background:var(--paper);box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 10px var(--accent)}
section:not(.dark) .flow .n{color:var(--muted)}
section:not(.dark) .flow p{color:var(--muted)}

/* capability list */
.caps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;border-top:1px solid var(--text)}
.caps li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:20px 0;border-bottom:1px solid var(--line);font-size:16px}
.caps li svg{color:var(--accent);margin-top:3px}

/* outcome bars (before/after) */
.compare{display:grid;gap:28px}
.cmp{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:24px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--line)}
.cmp h3{font-size:18px;font-weight:600}
.cmp .bars{display:grid;gap:10px}
.cmp .row{display:grid;grid-template-columns:110px minmax(0,1fr) 90px;gap:14px;align-items:center;font-size:14px}
.cmp .row .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cmp .row .bar{height:18px;background:var(--paper);position:relative}
.cmp .row .bar i{position:absolute;inset:0 auto 0 0;background:#B9C5D6;transform-origin:0 50%;transform:scaleX(0);transition:transform 1.4s var(--ease);transition-delay:var(--bd,0s)}
.cmp .row.after .bar i{background:var(--accent)}
.cmp.in .row .bar i{transform:scaleX(1)}
.cmp .row .val{font-family:var(--display);font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.cmp .row.after .val{color:var(--accent)}

/* big outcome numbers */
.outs{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));border-top:1px solid var(--text)}
.outs > div{padding:28px 24px 32px 0;min-width:0}
.outs > div + div{padding-left:24px;border-left:1px solid var(--line)}
.outs b{display:block;font-family:var(--display);font-size:clamp(36px,4vw,56px);font-weight:700;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;color:var(--accent)}
.outs > div > span{display:block;margin-top:14px;color:var(--muted);font-size:15px}
.outs em{display:block;margin-top:8px;font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.note{margin-top:24px;color:var(--muted);font-size:15px;max-width:70ch}

/* timeline (gantt) */
.gantt{display:grid;gap:12px}
.gantt .scale{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
.gantt .scale .ticks{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.gantt .g{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:center;font-size:15px}
.gantt .track{height:30px;background:var(--paper);position:relative;border-left:1px solid var(--line)}
.gantt .track i{position:absolute;top:0;bottom:0;left:var(--s);width:var(--w);background:var(--accent);transform-origin:0 50%;transform:scaleX(0);transition:transform 1s var(--ease);transition-delay:var(--bd,0s);display:flex;align-items:center;padding-left:10px;font-style:normal;font-family:var(--mono);font-size:11px;color:var(--white);white-space:nowrap;overflow:hidden}
.gantt.in .track i{transform:scaleX(1)}
.gantt .track i.alt{background:var(--signal);color:var(--ink)}

/* phases */
.phases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.phase{border-top:2px solid var(--accent);padding-top:24px;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.phase .eyebrow{color:var(--accent)}
.phase h3{font-size:24px;font-weight:600;margin-top:10px}
.phase ul{margin:16px 0 0;padding:0;list-style:none;display:grid;gap:10px;color:var(--muted);font-size:15px}
.phase li{padding-left:18px;position:relative}
.phase li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:1px;background:var(--accent)}
section.dark .phase ul{color:rgba(255,255,255,.66)}
section.dark .phase{border-color:var(--accent-on-dark)}
section.dark .phase .eyebrow{color:var(--accent-on-dark)}

/* stack diagram (layers) */
.stack{display:grid;gap:14px}
.layer{display:grid;grid-template-columns:72px minmax(0,1fr) minmax(0,1.3fr);gap:24px;align-items:center;padding:24px 28px;background:var(--ink-2);border:1px solid var(--ink-line);transition:opacity .9s var(--ease),transform .9s var(--ease),border-color .3s}
.layer:hover{border-color:var(--accent-on-dark)}
.layer .lv{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--accent-on-dark)}
.layer h3{font-size:22px;font-weight:600}
.layer p{color:rgba(255,255,255,.66);font-size:15px}

/* architecture columns */
.arch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;position:relative}
.arch .col{border:1px solid var(--ink-line);background:var(--ink-2);padding:22px;position:relative;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.arch .col + .col::before{content:"";position:absolute;left:-21px;top:50%;width:20px;height:1px;background:var(--accent-on-dark)}
.arch h3{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-on-dark);font-weight:500}
.arch ul{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.arch li{padding:10px 12px;background:rgba(255,255,255,.04);border:1px solid var(--ink-line);font-size:14px;position:relative;overflow:hidden}
.arch li::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(235,209,160,.18),transparent);transform:translateX(-100%);animation:sweep 3.2s infinite;animation-delay:var(--sd,0s)}

/* data table */
.tbl{overflow-x:auto}
.tbl table{width:100%;border-collapse:collapse;font-size:15px;min-width:520px}
.tbl th{text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500;padding:12px 16px 12px 0;border-bottom:1px solid var(--text)}
.tbl td{padding:16px 16px 16px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tbl td:first-child{font-family:var(--display);font-weight:600}
section.dark .tbl th{color:rgba(255,255,255,.5);border-color:rgba(255,255,255,.6)}
section.dark .tbl td{border-color:var(--ink-line)}

/* waterfall */
.wf{position:relative}
.wf svg{width:100%;height:auto;display:block}
.wf .bar{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform 1.1s var(--ease);transition-delay:var(--bd,0s)}
.wf.in .bar{transform:scaleY(1)}
.wf text{font-family:var(--body);font-size:13px;fill:var(--muted)}
.wf text.v{font-family:var(--display);font-weight:600;font-size:15px;fill:var(--text)}

/* closing */
.cta{background:linear-gradient(110deg,#9A7443 0%,#8A6A3C 45%,#0B1A2E 100%);color:var(--white);padding-block:clamp(64px,8vw,112px);position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(0deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:60px 60px;animation:drift 18s linear infinite;-webkit-mask-image:linear-gradient(90deg,transparent,#000 60%);mask-image:linear-gradient(90deg,transparent,#000 60%)}
.cta-inner{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:40px;align-items:end}
.cta h2{font-size:clamp(32px,4.4vw,60px);line-height:1.04;font-weight:700}
.cta p{font-size:18px;color:rgba(255,255,255,.82);margin-bottom:28px}
.cta .btn-white{animation:ring 2.4s 1s infinite}
.related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.rel{background:var(--white);border:1px solid var(--line);padding:28px;display:flex;flex-direction:column;gap:10px;min-height:220px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .25s,opacity .9s var(--ease)}
.rel:hover{transform:translateY(-6px);box-shadow:0 18px 40px -22px rgba(12,24,38,.35);border-color:var(--accent)}
.rel .eyebrow{color:var(--accent)}
.rel h3{font-size:24px;font-weight:600}
.rel p{color:var(--muted);font-size:15px}
.rel .go{margin-top:auto;font-family:var(--display);font-weight:600;color:var(--accent);display:flex;align-items:center;gap:8px}
.rel:hover .go svg{transform:translateX(4px)}
.rel .go svg{transition:transform .2s}

/* footer */
footer{background:var(--ink);color:rgba(255,255,255,.55);padding-block:48px 40px;font-size:14px}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:center}
.foot nav{display:flex;flex-wrap:wrap;gap:24px}
.foot nav a:hover{color:var(--white)}

/* reveal */
.rv{opacity:0;transform:translateY(32px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.drawn{position:relative}
.caps.drawn,.outs.drawn{border-top-color:transparent}
.caps.drawn::before,.outs.drawn::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--text);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.4s var(--ease)}
.caps.drawn.lined::before,.outs.drawn.lined::before{transform:scaleX(1)}


/* ===== Light theme (Gnani-inspired) overrides ===== */
:root{--paper:#F7F5F0;--text:#0B1A2E;--muted:#5A6170;--line:#E8E1D4;--grad:linear-gradient(90deg,#B08A52 0%,#C9A46A 50%,#9A7443 100%);--grad-soft:linear-gradient(135deg,#F6EEDF 0%,#EFE6D6 100%);--wrap:1440px;--gutter:clamp(16px,4vw,56px)}
.btn-primary{background:var(--grad);box-shadow:0 12px 30px -12px rgba(201,164,106,.7)}
.btn-ghost-dark{background:#fff;border-color:var(--line);color:var(--text)}.btn-ghost-dark:hover{border-color:var(--text)}
.btn-white{color:var(--text)}
.nav{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-inner{height:88px}
.logo{color:var(--text);font-size:28px}
.logo small{color:var(--muted)}
.nav-links{color:var(--text);font-size:16px;gap:36px}
.nav-links a:hover,.nav-links a.cur{color:var(--accent)}
.nav .btn{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 12px 30px -12px rgba(201,164,106,.7)}
.progress{background:var(--grad)}
.hero{background:radial-gradient(45% 70% at 0% 0%,#F0E2C6,transparent 70%),radial-gradient(45% 70% at 100% 20%,#EADFCB,transparent 70%),radial-gradient(40% 50% at 50% 110%,#F6ECDC,transparent 70%),var(--paper);color:var(--text)}
.hero::before{background-image:linear-gradient(rgba(10,11,53,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(10,11,53,.05) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 60% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 60% 30%,#000 30%,transparent 75%);animation:none}
.crumb{color:var(--muted)}.crumb a:hover{color:var(--accent)}
.hero .eyebrow{color:var(--accent);background:#fff;border-color:var(--line);box-shadow:0 6px 20px -12px rgba(10,11,53,.25)}
.hero h1 .w > span{color:var(--text)}
.hero-sub{color:var(--muted)}
.keyres{border-top:0;background:rgba(255,255,255,.75);border:1px solid #fff;border-radius:24px;padding:8px 28px;box-shadow:0 30px 70px -40px rgba(11,26,46,.45);backdrop-filter:blur(8px)}
.keyres div{border-bottom:1px solid var(--line)}
.keyres div:last-child{border-bottom:0}
.keyres b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}
.keyres div > span{color:var(--muted)}
.facts{background:transparent;color:var(--text);border-top:0;margin-top:-40px;position:relative;z-index:2}
.facts dl{background:#fff;border:1px solid var(--line);border-radius:24px;padding:4px 24px;box-shadow:0 20px 50px -36px rgba(11,26,46,.4)}
.facts dl > div + div{border-left-color:var(--line)}
.facts dt{color:var(--muted)}
section.white{background:transparent}
.comp,.rel,.layer{border-radius:20px}
.comp{border-color:var(--line)}
.bigstat{border-left-color:transparent;border-image:var(--grad) 1}
.cmp .row.after .bar i,.gantt .track i{background:var(--grad)}
.cmp .row .bar,.gantt .track{border-radius:999px;overflow:hidden}
section.dark{background:radial-gradient(50% 70% at 0% 0%,rgba(201,164,106,.45),transparent 70%),radial-gradient(50% 70% at 100% 100%,rgba(154,116,67,.45),transparent 70%),var(--ink);border-radius:36px;margin-inline:clamp(8px,1.5vw,24px)}
.layer{background:rgba(255,255,255,.05)}
.arch .col{border-radius:18px}
.phase{border-top-color:transparent;border-image:var(--grad) 1;border-top-width:3px}
.cta{background:var(--grad);border-radius:36px;margin-inline:clamp(8px,1.5vw,24px)}
.rel .eyebrow,.comp .tag{color:var(--accent)}
footer{background:var(--ink);margin-top:clamp(48px,6vw,96px)}
footer .logo{color:#fff}footer .logo small{color:rgba(240,232,215,.6)}

@keyframes up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes rise{from{transform:translateY(105%)}to{transform:none}}
@keyframes drift{to{background-position:240px 0,0 240px}}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}80%,100%{box-shadow:0 0 0 12px rgba(255,255,255,0)}}
@keyframes ripple{from{transform:scale(0);opacity:.4}to{transform:scale(4);opacity:0}}
@keyframes sweep{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}

@media (max-width:1080px){
  .nav-links{display:none}
  .facts dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts dl > div + div{border-left:0;padding-left:0}
  .facts dl > div:nth-child(even){padding-left:20px;border-left:1px solid var(--ink-line)}
  .facts dl > div{border-bottom:1px solid var(--ink-line)}
  .comps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .arch{grid-template-columns:repeat(2,minmax(0,1fr))}
  .arch .col:nth-child(3)::before{display:none}
  .outs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .outs > div:nth-child(3){padding-left:0;border-left:0}
  .outs > div:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:820px){
  .hero-inner,.head,.challenge,.cta-inner,.cmp{grid-template-columns:minmax(0,1fr)}
  .flow{grid-template-columns:minmax(0,1fr);gap:28px}
  .flow::before{display:none}
  .caps,.pains,.phases,.related{grid-template-columns:minmax(0,1fr)}
  .layer{grid-template-columns:minmax(0,1fr);gap:8px}
  .gantt .scale,.gantt .g{grid-template-columns:minmax(0,1fr);gap:6px}
  .gantt .scale > span:first-child{display:none}
}
@media (max-width:560px){
  .facts{margin-top:-24px}
  .logo{font-size:22px;gap:10px}.logo svg{width:36px;height:31px}.logo small{font-size:8.5px;letter-spacing:.32em}
  .nav-inner{height:80px}
  .nav .btn{display:none}
  .comps,.arch,.outs,.facts dl{grid-template-columns:minmax(0,1fr)}
  .arch .col + .col::before{display:none}
  .outs > div,.outs > div + div{padding:24px 0;border-left:0;border-top:1px solid var(--line)}
  .facts dl > div,.facts dl > div:nth-child(even){padding-left:0;border-left:0}
  .cmp .row{grid-template-columns:80px minmax(0,1fr) 70px}
  .comp{padding:24px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .comp svg *{stroke-dashoffset:0}
  .flow::before,.flow .st::before,.cmp .row .bar i,.gantt .track i,.wf .bar,.caps.drawn::before,.outs.drawn::before{transform:none!important}
}

/* ADRIVON brand */
.logo-img{display:block;height:100px;width:auto;margin:-22px 0 -22px -26px}
footer .logo-img{height:96px;margin:-20px 0 -20px -24px}
.btn-primary,.nav .btn{background:linear-gradient(135deg,#EBD1A0 0%,#C9A46A 50%,#9A7443 100%)!important;color:#0B1A2E!important}
.cta{background:radial-gradient(50% 80% at 100% 0%,rgba(201,164,106,.35),transparent 70%),var(--ink)!important}
.cta .btn-white{background:linear-gradient(135deg,#EBD1A0,#C9A46A 55%,#9A7443);color:#0B1A2E}
@media (max-width:560px){.logo-img{height:76px;margin:-16px 0 -16px -20px}}