/* ===========================================================================
   LinkFleet V1 — Retool-inspired design system (no build step, /public)
   Language: near-black ink, bone foreground, light-weight oversized display
   type, two-tone headlines, hairline grid cells, pill buttons, light product
   panel floating on dark. Restrained color — status tints live inside the
   product panel only; one iridescent glow in the hero.
   =========================================================================== */

:root{
    /* surfaces */
    --ink:       #151515;
    --ink-2:     #1a1a1a;
    --ink-3:     #202020;

    /* foreground */
    --bone:      #E9EBDF;
    --bone-70:   rgba(233,235,223,.70);
    --bone-55:   rgba(233,235,223,.55);
    --bone-40:   rgba(233,235,223,.40);
    --bone-25:   rgba(233,235,223,.25);

    /* accent (iridescent, ties to hero glow) */
    --accent:    #a78bfa;
    --accent-2:  #7dd3fc;

    /* hairlines */
    --line:      rgba(233,235,223,.12);
    --line-2:    rgba(233,235,223,.22);

    /* light product panel */
    --panel:     #FBFBF8;
    --panel-2:   #F2F2EC;
    --panel-ink: #1d1f1c;
    --panel-dim: #6d7268;
    --panel-line:#E3E4DB;

    /* status tints (panel only) */
    --ok-bg:   #E1F4E4; --ok-fg:   #1D7A35;
    --warm-bg: #FCF0DA; --warm-fg: #9A6A0B;
    --repl-bg: #E3EDFB; --repl-fg: #2563C4;

    /* type */
    --sans: 'Switzer', ui-sans-serif, system-ui, -apple-system, sans-serif;
    --mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

    --maxw: 1240px;
    --pad: clamp(20px, 4.5vw, 44px);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
    background:var(--ink);
    color:var(--bone);
    font-family:var(--sans);
    font-size:16px;
    font-weight:400;
    line-height:1.55;
    letter-spacing:.005em;
    overflow-x:hidden;
}

::selection{ background:var(--bone); color:var(--ink); }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); }
.wrap.narrow{ max-width:880px; }
.mono{ font-family:var(--mono); font-feature-settings:"liga" 0; }

a{ color:inherit; text-decoration:none; }

/* ---------- type scale ---------- */
.display{
    font-weight:300;
    letter-spacing:-0.022em;
    line-height:1.05;
    text-wrap:balance;
}
h1.display{ font-size:clamp(2.7rem, 5.8vw, 4.6rem); }
h2.display{ font-size:clamp(2.1rem, 4.4vw, 3.4rem); }
.dim{ color:var(--bone-40); }
.hl{
    background:linear-gradient(105deg, var(--accent), var(--accent-2));
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:var(--accent);
}

.label{
    display:block;
    font-size:.74rem;
    font-weight:500;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--bone-55);
}

.lede{
    color:var(--bone-55);
    font-weight:300;
    font-size:clamp(1.02rem, 1.4vw, 1.2rem);
    line-height:1.6;
}

/* underlined arrow link */
.arrow-link{
    display:inline-block;
    color:var(--bone);
    font-size:.95rem;
    padding-bottom:2px;
    border-bottom:1px solid var(--line-2);
    transition:border-color .2s ease, color .2s ease;
}
.arrow-link::after{ content:" \2192"; }
.arrow-link:hover{ border-bottom-color:var(--bone); }

/* ---------- pill buttons ---------- */
.btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.5em;
    background:var(--bone); color:var(--ink);
    font-family:var(--sans); font-weight:500; font-size:.95rem;
    padding:.72em 1.5em; border-radius:999px; border:1px solid var(--bone);
    transition:background .2s ease, transform .18s ease;
    white-space:nowrap; cursor:pointer;
}
.btn:hover{ background:#ffffff; border-color:#ffffff; transform:translateY(-1px); }
.btn-line{
    background:transparent; color:var(--bone);
    border:1px solid var(--line-2);
}
.btn-line:hover{ background:rgba(233,235,223,.06); border-color:var(--bone-55); transform:translateY(-1px); }
.btn-sm{ padding:.55em 1.15em; font-size:.88rem; }
.btn-lg{ padding:.9em 2em; font-size:1.05rem; }
.btn-block{ display:flex; width:100%; }

/* ---------- topbar ---------- */
.topbar{
    position:relative;
    display:flex; align-items:center; justify-content:center; gap:.7rem; flex-wrap:nowrap;
    padding:.55rem var(--pad);
    text-align:center;
    font-size:.82rem; color:var(--bone-70);
    background:
        linear-gradient(90deg, rgba(167,139,250,.16), rgba(125,211,252,.10) 38%, rgba(244,164,222,.14) 72%, rgba(167,139,250,.12)),
        var(--ink-2);
    border-bottom:1px solid var(--line);
}
.topbar .pill{
    font-size:.72rem; font-weight:500; letter-spacing:.04em;
    padding:.2em .85em; border-radius:999px;
    background:var(--bone); color:var(--ink);
}
.topbar a{ color:var(--bone); border-bottom:1px solid var(--line-2); }
.topbar a:hover{ border-bottom-color:var(--bone); }
.topbar-full, .topbar-cta{ white-space:nowrap; }
.topbar-short{ display:none; white-space:nowrap; border-bottom:none; font-weight:500; }

/* ---------- nav ---------- */
.nav{
    position:sticky; top:0; z-index:50;
    background:rgba(21,21,21,.86);
    backdrop-filter:blur(12px);
    border-bottom:1px solid transparent;
    transition:border-color .3s ease;
}
.nav.scrolled{ border-bottom-color:var(--line); }
.nav-inner{ display:flex; align-items:center; gap:2.4rem; height:72px; }
.brand{ display:inline-flex; align-items:center; gap:.55em; font-weight:500; font-size:1.12rem; letter-spacing:-0.01em; }
.brand-mark{
    width:20px; height:20px; border-radius:6px; position:relative; flex:none;
    background:var(--bone);
}
.brand-mark::after{
    content:""; position:absolute; left:4px; top:4px; right:9px; bottom:9px;
    background:var(--ink); border-radius:2px;
}
.brand-mark::before{
    content:""; position:absolute; left:9px; top:9px; right:4px; bottom:4px;
    background:var(--ink); border-radius:2px;
}
.nav-links{ display:flex; gap:1.8rem; font-size:.92rem; color:var(--bone-70); }
.nav-links a{ transition:color .2s ease; }
.nav-links a:hover{ color:var(--bone); }
.nav-cta{ margin-left:auto; display:flex; align-items:center; gap:.7rem; }
.nav-contact{ font-size:.92rem; color:var(--bone-70); margin-right:.4rem; }
.nav-contact:hover{ color:var(--bone); }

/* ---------- hero ---------- */
.hero{
    position:relative;
    padding:clamp(72px, 9vw, 128px) 0 0;
    text-align:center;
    overflow:hidden;
}
/* single restrained iridescent glow, retool-style chroma */
.hero::before{
    content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
    background:
        radial-gradient(720px 420px at 28% -12%, rgba(167,139,250,.17), transparent 62%),
        radial-gradient(820px 460px at 72% -16%, rgba(125,211,252,.13), transparent 60%),
        radial-gradient(560px 380px at 55% 4%, rgba(244,164,222,.10), transparent 58%);
}
.hero-head{ max-width:880px; margin:0 auto; }
.hero .lede{ max-width:720px; margin:1.6rem auto 2.2rem; }
.hero-cta{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; }

/* ---------- product panel (light on dark) ---------- */
.panel-stage{
    position:relative;
    margin-top:clamp(48px, 6vw, 84px);
    padding-bottom:clamp(56px, 7vw, 96px);
}
.panel-stage::before{
    content:""; position:absolute; left:50%; top:8%; transform:translateX(-50%);
    width:min(900px, 92%); height:70%;
    background:
        radial-gradient(closest-side, rgba(167,139,250,.20), transparent 70%),
        radial-gradient(closest-side at 70% 60%, rgba(125,211,252,.14), transparent 70%);
    filter:blur(28px);
    z-index:0; pointer-events:none;
}
.panel{
    position:relative; z-index:1;
    max-width:980px; margin:0 auto;
    background:linear-gradient(180deg, var(--ink-3), var(--ink-2));
    color:var(--bone);
    border:1px solid var(--line-2);
    border-radius:16px;
    box-shadow:
        0 0 0 1px rgba(167,139,250,.07),
        0 60px 120px -50px rgba(0,0,0,.9);
    overflow:hidden;
    text-align:left;
    font-size:.86rem;
}
.panel-head{
    display:flex; align-items:center; gap:1rem;
    padding:.95rem 1.3rem;
    border-bottom:1px solid var(--line);
    background:rgba(255,255,255,.015);
}
.panel-title{ font-weight:500; font-size:.95rem; color:var(--bone); }
.panel-sub{ color:var(--bone-40); font-size:.8rem; }
.panel-filter{
    margin-left:auto;
    font-size:.74rem; color:var(--bone-55);
    border:1px solid var(--line-2); border-radius:999px;
    padding:.28em .9em;
    background:rgba(255,255,255,.03);
}
.panel-live{
    display:inline-flex; align-items:center; gap:.45em;
    font-size:.72rem; font-weight:600; letter-spacing:.06em; color:#5fe39a;
}
.panel-live .pulse{
    width:7px; height:7px; border-radius:50%; background:#5fe39a;
    box-shadow:0 0 0 0 rgba(95,227,154,.5); animation:pulse 2.2s infinite;
}
@keyframes pulse{
    0%{ box-shadow:0 0 0 0 rgba(95,227,154,.5); }
    70%{ box-shadow:0 0 0 7px rgba(95,227,154,0); }
    100%{ box-shadow:0 0 0 0 rgba(95,227,154,0); }
}

.fleet-table{ width:100%; border-collapse:collapse; }
.fleet-table th{
    text-align:left;
    font-size:.66rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
    color:var(--bone-40);
    padding:.7rem 1.3rem;
    border-bottom:1px solid var(--line);
    background:rgba(255,255,255,.015);
}
.fleet-table td{
    padding:.8rem 1.3rem;
    border-bottom:1px solid var(--line);
    vertical-align:middle;
    white-space:nowrap;
    color:var(--bone-70);
}
.fleet-table tr:last-child td{ border-bottom:none; }
.fleet-table tbody tr{ transition:background .2s ease; }
.fleet-table tbody tr:hover{ background:rgba(255,255,255,.022); }
.fleet-table .acc{ font-family:var(--mono); font-size:.8rem; color:var(--bone); }
.fleet-table .dim-td{ color:var(--bone-40); }
.st{
    display:inline-block;
    font-size:.7rem; font-weight:500;
    padding:.2em .8em; border-radius:999px;
    border:1px solid transparent;
}
.st-ok{   background:rgba(95,227,154,.12);  color:#5fe39a; border-color:rgba(95,227,154,.26); }
.st-warm{ background:rgba(251,191,36,.12);  color:#fbbf24; border-color:rgba(251,191,36,.26); }
.st-repl{ background:rgba(125,211,252,.14); color:#7dd3fc; border-color:rgba(125,211,252,.30); }
.panel-foot{
    display:flex; gap:1.8rem;
    padding:.8rem 1.3rem;
    color:var(--bone-40); font-size:.76rem;
    border-top:1px solid var(--line);
    background:rgba(255,255,255,.015);
}

/* ---------- hairline stat strip ---------- */
.stats{
    display:grid; grid-template-columns:repeat(4, 1fr);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}
.stats > div{
    padding:1.9rem 1.6rem;
    border-left:1px solid var(--line);
}
.stats > div:first-child{ border-left:none; }
.stat-num{
    display:block;
    font-weight:300; font-size:clamp(1.7rem, 2.6vw, 2.3rem);
    letter-spacing:-0.02em; line-height:1.1;
    margin-bottom:.3rem;
}
.stat-lab{ color:var(--bone-55); font-size:.86rem; }

/* ---------- sections ---------- */
.band{ padding:clamp(80px, 9vw, 150px) 0; }
.sec-head{ max-width:780px; margin-bottom:clamp(40px, 5vw, 72px); }
.sec-head .label{ margin-bottom:1.2rem; }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-sub{ color:var(--bone-55); font-weight:300; margin-top:1.2rem; font-size:1.08rem; max-width:54ch; }
.sec-head.center .sec-sub{ margin-inline:auto; }

/* hero tagline */
.hero-tag{ margin-bottom:1.6rem; color:var(--bone-55); }

/* before / after */
.ba{
    display:grid; grid-template-columns:1fr 1fr; gap:1px;
    border:1px solid var(--line); background:var(--line);
    border-radius:14px; overflow:hidden;
}
.ba-col{ background:var(--ink); padding:clamp(1.7rem,2.6vw,2.4rem) clamp(1.5rem,2.2vw,2.1rem); }
.ba-col.good{ background:var(--ink-2); }
.ba-col > .label{ margin-bottom:1.6rem; }
.ba-col.good > .label{ color:var(--bone-70); }
.ba-list{ list-style:none; display:grid; gap:1.05rem; }
.ba-list li{
    position:relative; padding-left:1.9rem;
    font-weight:300; font-size:.98rem; line-height:1.5;
    color:var(--bone-55);
}
.ba-col.good .ba-list li{ color:var(--bone); }
.ba-list li::before{ position:absolute; left:0; top:-.04em; font-size:1.05rem; line-height:1.5; }
.ba-list.bad li::before{ content:"\00d7"; color:var(--bone-40); }
.ba-list.good li::before{ content:"\2713"; color:var(--bone); }
@media (max-width:720px){ .ba{ grid-template-columns:1fr; } }

/* three-up editorial cards (personas) */
.trio{ display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(2rem, 4vw, 4rem); }
.trio article{ padding-top:1.6rem; border-top:1px solid var(--line-2); }
.trio .label{ margin-bottom:1.1rem; color:var(--bone-40); }
.trio h3{
    font-weight:300; font-size:clamp(1.35rem, 1.9vw, 1.7rem);
    letter-spacing:-0.015em; line-height:1.2;
    margin-bottom:.8rem;
}
.trio p{ color:var(--bone-55); font-weight:300; font-size:.97rem; }

/* hairline feature grid */
.grid-cells{
    display:grid; grid-template-columns:repeat(4, 1fr);
    border:1px solid var(--line);
}
.cell{
    padding:2rem 1.6rem 2.2rem;
    border-left:1px solid var(--line);
    border-top:1px solid var(--line);
    transition:background .25s ease;
}
.cell:hover{ background:var(--ink-2); }
.grid-cells .cell:nth-child(-n+4){ border-top:none; }
.grid-cells .cell:nth-child(4n+1){ border-left:none; }
.cell .label{ margin-bottom:1.4rem; color:var(--bone-25); }
.cell h3{ font-weight:400; font-size:1.02rem; letter-spacing:-0.005em; margin-bottom:.55rem; }
.cell p{ color:var(--bone-55); font-weight:300; font-size:.9rem; line-height:1.55; }

/* steps */
.steps{
    list-style:none;
    display:grid; grid-template-columns:repeat(2, 1fr);
    border:1px solid var(--line);
}
.step{
    display:flex; gap:1.5rem;
    padding:2.1rem 2rem;
    border-left:1px solid var(--line);
    border-top:1px solid var(--line);
    transition:background .25s ease;
}
.step:hover{ background:var(--ink-2); }
.steps .step:nth-child(-n+2){ border-top:none; }
.steps .step:nth-child(2n+1){ border-left:none; }
.step-no{
    font-weight:300; font-size:1.9rem; letter-spacing:-0.02em;
    color:var(--bone-25); line-height:1; padding-top:.15rem;
    min-width:2.4ch;
}
.step h3{ font-weight:400; font-size:1.08rem; margin-bottom:.45rem; }
.step p{ color:var(--bone-55); font-weight:300; font-size:.94rem; }

/* comparison table */
.cmp-wrap{ border:1px solid var(--line); overflow-x:auto; }
.cmp{ width:100%; border-collapse:collapse; font-size:.95rem; }
.cmp th, .cmp td{
    text-align:left; padding:1.15rem 1.6rem;
    border-bottom:1px solid var(--line);
    vertical-align:top;
}
.cmp thead th{
    font-size:.7rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
    color:var(--bone-40);
}
.cmp tbody td:first-child{ color:var(--bone); white-space:nowrap; }
.cmp tbody td:nth-child(2){ color:var(--bone-55); white-space:nowrap; font-family:var(--mono); font-size:.82rem; }
.cmp tbody td:last-child{ color:var(--bone-55); font-weight:300; }
.cmp tr:last-child td{ border-bottom:none; }
.cmp-us td{ background:var(--ink-2); }
.cmp-us td:first-child{ font-weight:500; }
.cmp-us td:last-child{ color:var(--bone-70); }

/* pricing tiers */
.tiers{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1.2rem; align-items:stretch; }
.tier{
    display:flex; flex-direction:column;
    background:var(--ink-2); border:1px solid var(--line-2); border-radius:18px;
    padding:2rem 1.7rem;
}
.tier-pop{
    border-color:var(--accent);
    box-shadow:0 0 0 1px var(--accent), 0 50px 90px -55px rgba(167,139,250,.55);
    position:relative;
}
.tier-tag{
    position:absolute; top:-.7rem; left:1.7rem;
    font-size:.68rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
    padding:.32em .85em; border-radius:999px;
    background:var(--accent); color:#0c0a1a;
}
.tier-name{ font-weight:500; font-size:1.06rem; letter-spacing:.01em; margin-bottom:1.1rem; }
.tier-price{ display:flex; align-items:baseline; gap:.4rem; }
.tier-price .price-num{ font-weight:300; font-size:clamp(2.2rem,3.6vw,2.9rem); letter-spacing:-0.03em; line-height:1; }
.tier-price .price-per{ color:var(--bone-55); font-size:.95rem; }
.tier-cap{ color:var(--bone-70); font-size:.9rem; margin:.7rem 0 1.6rem; }
.tier-feats{ list-style:none; display:grid; gap:.65rem; margin-bottom:1.9rem; }
.tier-feats li{ position:relative; padding-left:1.6rem; color:var(--bone-70); font-weight:300; font-size:.92rem; line-height:1.45; }
.tier-feats li::before{ content:"\2713"; position:absolute; left:0; top:.02em; color:var(--accent); font-size:.85rem; }
.tier .btn{ margin-top:auto; }

/* wide enterprise band */
.ent{
    display:flex; align-items:center; justify-content:space-between; gap:2.4rem;
    margin-top:1.2rem;
    background:var(--ink-2); border:1px solid var(--line-2); border-radius:18px;
    padding:2rem 2.3rem;
}
.ent-copy{ max-width:62ch; }
.ent-copy .label{ margin-bottom:.9rem; }
.ent-copy h3{ font-weight:400; font-size:clamp(1.2rem,2vw,1.45rem); letter-spacing:-0.01em; margin-bottom:.55rem; }
.ent-copy p{ color:var(--bone-55); font-weight:300; font-size:.98rem; }
.ent .btn{ flex:none; }
@media (max-width:720px){ .ent{ flex-direction:column; align-items:flex-start; gap:1.4rem; } }

/* single price card (claim recap reuse) */
.price-wrap{ display:flex; justify-content:center; }
.price-card{
    width:100%; max-width:520px;
    border:1px solid var(--line-2);
    border-radius:18px;
    padding:2.6rem 2.4rem 2.4rem;
    background:var(--ink-2);
}
.price-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:2rem; }
.plan-name{ font-size:.78rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }
.plan-tag{ font-size:.78rem; color:var(--bone-40); }
.price-amount{ display:flex; align-items:baseline; gap:.6rem; }
.price-num{
    font-weight:300; font-size:clamp(3.2rem, 6vw, 4.4rem);
    letter-spacing:-0.03em; line-height:1;
}
.price-per{ color:var(--bone-55); font-size:1rem; }
.price-line{ color:var(--bone-40); font-size:.85rem; margin:.8rem 0 1.9rem; }
.price-feats{ list-style:none; display:grid; gap:0; margin-bottom:2rem; }
.price-feats li{
    padding:.72rem 0;
    border-top:1px solid var(--line);
    color:var(--bone-70); font-weight:300; font-size:.95rem;
    display:flex; justify-content:space-between; gap:1rem;
}
.price-feats li:last-child{ border-bottom:1px solid var(--line); }
.price-feats li::after{ content:"\2713"; color:var(--bone-40); font-size:.85rem; }
.price-foot{ text-align:center; color:var(--bone-40); font-size:.85rem; margin-top:1.3rem; }
.price-foot a{ color:var(--bone); border-bottom:1px solid var(--line-2); }
.price-foot a:hover{ border-bottom-color:var(--bone); }

/* faq */
.faq details{ border-top:1px solid var(--line); }
.faq details:last-child{ border-bottom:1px solid var(--line); }
.faq summary{
    cursor:pointer; list-style:none;
    display:flex; justify-content:space-between; align-items:center; gap:1.5rem;
    padding:1.4rem 0;
    font-weight:400; font-size:1.05rem;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
    content:"+";
    font-weight:300; font-size:1.5rem; color:var(--bone-40);
    transition:transform .2s ease;
    flex:none;
}
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq p{ color:var(--bone-55); font-weight:300; padding:0 0 1.5rem; font-size:.97rem; }

/* final cta */
.cta-band{ padding:clamp(56px, 7vw, 110px) 0; border-top:1px solid var(--line); }
.cta-card{
    position:relative; overflow:hidden;
    max-width:960px; margin:0 auto;
    border:1px solid var(--line-2); border-radius:24px;
    background:linear-gradient(180deg, var(--ink-3), var(--ink-2));
    padding:clamp(3rem, 6vw, 5.5rem) clamp(1.6rem, 4vw, 3rem);
    text-align:center;
}
.cta-card::before{
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:
        radial-gradient(640px 320px at 28% -10%, rgba(167,139,250,.18), transparent 60%),
        radial-gradient(640px 320px at 74% 115%, rgba(125,211,252,.14), transparent 60%);
}
.cta-card > *{ position:relative; z-index:1; }
.cta-card h2{ font-size:clamp(2.1rem, 4.4vw, 3.3rem); }
.cta-card p{
    color:var(--bone-55); font-weight:300; font-size:1.1rem;
    margin:1.3rem auto 2.2rem; max-width:48ch;
}

/* ---------- legal pages ---------- */
.legal{ padding:clamp(48px,7vw,90px) 0 clamp(64px,8vw,110px); }
.legal-wrap{ max-width:780px; margin:0 auto; }
.legal h1{ font-weight:300; font-size:clamp(2rem,4vw,3rem); letter-spacing:-0.02em; line-height:1.1; }
.legal-meta{ color:var(--bone-40); font-size:.85rem; margin:.7rem 0 2.6rem; }
.legal .lead{ color:var(--bone-70); font-weight:300; font-size:1.08rem; line-height:1.7; margin-bottom:1rem; }
.legal h2{ font-weight:500; font-size:1.12rem; color:var(--bone); margin:2.4rem 0 .8rem; }
.legal p{ color:var(--bone-55); font-weight:300; font-size:1rem; line-height:1.7; margin-bottom:1rem; }
.legal ul{ list-style:none; margin:0 0 1rem; display:grid; gap:.55rem; }
.legal li{ position:relative; padding-left:1.4rem; color:var(--bone-55); font-weight:300; font-size:1rem; line-height:1.6; }
.legal li::before{ content:""; position:absolute; left:.2rem; top:.6em; width:5px; height:5px; border-radius:50%; background:var(--bone-40); }
.legal strong{ color:var(--bone-85, var(--bone-70)); font-weight:500; }
.legal a{ color:var(--bone); border-bottom:1px solid var(--line-2); }
.legal a:hover{ border-bottom-color:var(--bone); }
.foot-fine a{ color:var(--bone-55); border-bottom:1px solid var(--line-2); }
.foot-fine a:hover{ color:var(--bone); }
.form-fine a{ color:var(--bone-55); border-bottom:1px solid var(--line-2); }
.form-fine a:hover{ color:var(--bone); }

/* ---------- footer ---------- */
.foot{ border-top:1px solid var(--line); padding-top:clamp(56px, 6vw, 88px); }
.foot-grid{
    display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr;
    gap:2.5rem;
    padding-bottom:clamp(48px, 6vw, 80px);
}
.foot-col .label{ margin-bottom:1.2rem; color:var(--bone-40); }
.foot-col ul{ list-style:none; display:grid; gap:.55rem; }
.foot-col a{ color:var(--bone-70); font-weight:300; font-size:.95rem; transition:color .2s ease; }
.foot-col a:hover{ color:var(--bone); }
.foot-blurb{ color:var(--bone-40); font-weight:300; font-size:.9rem; max-width:30ch; margin-top:1rem; }
.foot-mark{
    overflow:hidden;
    border-top:1px solid var(--line);
    padding:clamp(8px,1vw,16px) 0 0;
}
.foot-word{
    display:block;
    font-weight:300;
    font-size:clamp(4rem, 14.5vw, 13.5rem);
    letter-spacing:-0.04em;
    line-height:.95;
    color:var(--bone);
    white-space:nowrap;
    transform:translateY(.12em);
}
.foot-fine{
    display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
    padding:1.4rem 0 1.6rem;
    border-top:1px solid var(--line);
    color:var(--bone-40); font-size:.78rem;
}

/* ---------- reveal ---------- */
.js .reveal{ opacity:0; transform:translateY(16px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.js .reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
    .js .reveal{ opacity:1; transform:none; transition:none; }
    .panel-live .pulse{ animation:none; }
    html{ scroll-behavior:auto; }
}

/* ---------- responsive ---------- */
@media (max-width:1080px){
    .grid-cells{ grid-template-columns:repeat(2, 1fr); }
    .grid-cells .cell:nth-child(-n+4){ border-top:1px solid var(--line); }
    .grid-cells .cell:nth-child(-n+2){ border-top:none; }
    .grid-cells .cell:nth-child(4n+1){ border-left:1px solid var(--line); }
    .grid-cells .cell:nth-child(2n+1){ border-left:none; }
}
@media (max-width:920px){
    .nav-links{ display:none; }
    .trio{ grid-template-columns:1fr; gap:2.2rem; }
    .stats{ grid-template-columns:repeat(2, 1fr); }
    .stats > div{ border-top:1px solid var(--line); }
    .stats > div:nth-child(-n+2){ border-top:none; }
    .stats > div:nth-child(2n+1){ border-left:none; }
    .stats > div:nth-child(2n){ border-left:1px solid var(--line); }
    .steps{ grid-template-columns:1fr; }
    .steps .step{ border-left:none; }
    .steps .step:nth-child(-n+2){ border-top:1px solid var(--line); }
    .steps .step:first-child{ border-top:none; }
    .foot-grid{ grid-template-columns:1fr 1fr; }
    .tiers{ grid-template-columns:1fr; max-width:420px; margin-inline:auto; }
    .tier-pop{ order:-1; }
}
@media (max-width:600px){
    h1.display{ font-size:2.15rem; line-height:1.1; }
    h2.display{ font-size:1.7rem; }
    .hero-br{ display:none; }
    /* topbar: collapse to one tight line */
    .topbar{ font-size:.74rem; }
    .topbar-full, .topbar-cta{ display:none; }
    .topbar-short{ display:inline; }
    .topbar .pill{ font-size:.66rem; padding:.2em .7em; }
    .grid-cells{ grid-template-columns:1fr; }
    .grid-cells .cell{ border-left:none !important; border-top:1px solid var(--line) !important; }
    .grid-cells .cell:first-child{ border-top:none !important; }
    /* nav: keep only the primary CTA, drop the ghost + contact */
    .nav-contact{ display:none; }
    .nav-cta .btn-line{ display:none; }
    .nav-inner{ height:62px; gap:1rem; }
    /* fleet panel: trim to Account / Region / Status so it fits a phone */
    .panel{ font-size:.8rem; }
    .panel-filter{ display:none; }
    .fleet-table th:nth-child(3), .fleet-table td:nth-child(3),
    .fleet-table th:nth-child(4), .fleet-table td:nth-child(4),
    .fleet-table th:nth-child(5), .fleet-table td:nth-child(5){ display:none; }
    .fleet-table th, .fleet-table td{ padding-inline:1rem; }
    .panel-foot{ gap:1rem; flex-wrap:wrap; }
    /* comparison: stack each approach into a block instead of scrolling */
    .cmp-wrap{ border:none; }
    .cmp thead{ display:none; }
    .cmp, .cmp tbody, .cmp tr, .cmp td{ display:block; width:100%; }
    .cmp tr{ border:1px solid var(--line); border-radius:12px; padding:1rem 0; margin-bottom:.7rem; }
    .cmp td{ border:none; padding:.3rem 1.1rem; white-space:normal; }
    .cmp tbody td:first-child{ color:var(--bone); font-weight:500; font-size:1.02rem; padding-bottom:.2rem; }
    .cmp tbody td:nth-child(2){ color:var(--bone-40); font-family:var(--mono); font-size:.82rem; }
    .cmp tbody td:last-child{ color:var(--bone-55); }
    .cmp-us{ background:var(--ink-2); border-color:var(--line-2) !important; }
    .cmp-us td{ background:transparent; }
    .foot-grid{ grid-template-columns:1fr; gap:2rem; }
}

/* ===========================================================================
   CLAIM / INTAKE PAGE
   =========================================================================== */
.claim{ padding:clamp(40px,6vw,80px) 0 clamp(64px,8vw,110px); position:relative; overflow:hidden; }
.claim::before{
    content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
    background:
        radial-gradient(720px 420px at 22% -10%, rgba(167,139,250,.14), transparent 60%),
        radial-gradient(720px 420px at 80% -14%, rgba(125,211,252,.10), transparent 60%);
}
.claim-grid{
    display:grid; grid-template-columns:0.95fr 1.05fr;
    gap:clamp(2.5rem, 5vw, 5rem); align-items:start;
}

/* recap */
.claim-recap{ padding-top:.5rem; }
.claim-recap .label{ margin-bottom:1.4rem; }
.claim-recap h1.display{ font-size:clamp(2.2rem,4vw,3.2rem); }
.claim-lede{ color:var(--bone-55); font-weight:300; font-size:1.05rem; margin:1.4rem 0 2.2rem; max-width:42ch; }
.recap-plan{ display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; margin-bottom:.8rem; }
.recap-tier{ font-weight:500; font-size:1.05rem; }
.recap-disc{
    font-size:.7rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
    padding:.32em .85em; border-radius:999px;
    background:var(--accent); color:#0c0a1a;
}
.recap-price{ display:flex; align-items:baseline; gap:.5rem; }
.recap-price .recap-was{ color:var(--bone-40); font-size:1.3rem; text-decoration:line-through; }
.recap-price .price-num{ font-size:clamp(2.6rem,5vw,3.4rem); font-weight:300; letter-spacing:-0.03em; line-height:1; }
.recap-price .price-per{ color:var(--bone-55); font-size:1rem; }
.recap-line{ color:var(--bone-40); font-size:.85rem; margin:.7rem 0 1.8rem; }
.recap-feats{ list-style:none; display:grid; gap:0; }
.recap-feats li{
    padding:.7rem 0; border-top:1px solid var(--line);
    color:var(--bone-70); font-weight:300; font-size:.95rem;
    display:flex; gap:.7rem; align-items:flex-start;
}
.recap-feats li:last-child{ border-bottom:1px solid var(--line); }
.recap-feats li::before{ content:"\2713"; color:var(--accent); font-size:.9rem; line-height:1.5; }

/* form card */
.claim-card{
    background:var(--ink-2);
    border:1px solid var(--line-2);
    border-radius:18px;
    padding:clamp(1.8rem,3vw,2.6rem);
}
.form-title{ font-weight:400; font-size:1.4rem; letter-spacing:-0.01em; }
.form-sub{ color:var(--bone-55); font-weight:300; font-size:.95rem; margin:.4rem 0 1.8rem; }
.form-errors{
    background:rgba(255,120,120,.08); border:1px solid rgba(255,120,120,.3);
    color:#ffb4b4; font-size:.9rem; padding:.8rem 1rem; border-radius:10px; margin-bottom:1.4rem;
}

.field{ margin-bottom:1.1rem; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field-row .field-sm{ max-width:140px; }
.field label{
    display:block; font-size:.82rem; font-weight:500; color:var(--bone-70);
    margin-bottom:.5rem; letter-spacing:.01em;
}
.field label .opt{ color:var(--bone-40); font-weight:300; text-transform:lowercase; margin-left:.3em; }
.field input, .field textarea{
    width:100%; font-family:var(--sans); font-size:1rem; color:var(--bone);
    background:var(--ink); border:1px solid var(--line-2); border-radius:10px;
    padding:.78em .9em; transition:border-color .18s ease, background .18s ease;
}
.field input::placeholder, .field textarea::placeholder{ color:var(--bone-25); }
.field input:focus, .field textarea:focus{
    outline:none; border-color:var(--accent); background:#121212;
}
.field input.has-error, .field textarea.has-error, .field select.has-error{ border-color:rgba(255,120,120,.55); }
.field textarea{ resize:vertical; min-height:88px; }
.claim-card .btn-block{ margin-top:.6rem; }
.form-fine{ color:var(--bone-40); font-size:.8rem; text-align:center; margin-top:1rem; }

/* select — match the text inputs, custom chevron */
.field select{
    width:100%; font-family:var(--sans); font-size:1rem; color:var(--bone);
    background-color:var(--ink); border:1px solid var(--line-2); border-radius:10px;
    padding:.78em 2.2em .78em .9em; cursor:pointer;
    appearance:none; -webkit-appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%238a8f86' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right .9em center;
    transition:border-color .18s ease, background-color .18s ease;
}
.field select:focus{ outline:none; border-color:var(--accent); background-color:#121212; }
.field select option{ color:var(--bone); background:var(--ink-2); }

/* wizard step indicator */
.wiz-steps{ list-style:none; display:flex; gap:.5rem; margin:0 0 1.9rem; padding:0; counter-reset:wz; }
.wiz-seg{
    flex:1; font-size:.72rem; font-weight:500; letter-spacing:.01em;
    color:var(--bone-40); padding-top:.7rem; border-top:2px solid var(--line-2);
    display:flex; align-items:center; gap:.45em; counter-increment:wz;
}
.wiz-seg::before{
    content:counter(wz); display:inline-flex; align-items:center; justify-content:center;
    width:18px; height:18px; border-radius:50%; font-size:.66rem; flex:none;
    background:var(--ink-3); color:var(--bone-55); border:1px solid var(--line-2);
}
.wiz-seg.active{ color:var(--bone); border-top-color:var(--accent); }
.wiz-seg.active::before{ background:var(--accent); color:#0c0a1a; border-color:var(--accent); }
.wiz-seg.done{ color:var(--bone-55); border-top-color:var(--accent); }
.wiz-seg.done::before{ content:"\2713"; background:transparent; color:var(--accent); border-color:var(--accent); }

/* wizard steps (fieldsets) */
.wiz-step{ border:0; margin:0; padding:0; min-width:0; }
.js .wiz-step.is-hidden{ display:none; }
html:not(.js) [data-next]{ display:none; }      /* no-JS: show all fields, single submit */
.wiz-actions{ display:flex; gap:.7rem; margin-top:.4rem; }
.wiz-actions .btn:last-child{ flex:1; justify-content:center; }

/* success extras */
.success-ask{ color:var(--bone-40); font-size:.92rem; }
.success-cta{ display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; margin-top:.4rem; }

/* honeypot */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* success */
.claim-success{
    background:var(--ink-2); border:1px solid var(--line-2); border-radius:18px;
    padding:clamp(2.2rem,4vw,3.2rem); text-align:center;
}
.success-mark{
    display:inline-flex; align-items:center; justify-content:center;
    width:52px; height:52px; border-radius:50%;
    background:var(--ok-bg); color:var(--ok-fg); font-size:1.6rem;
    margin-bottom:1.4rem;
}
.claim-success h2.display{ font-size:clamp(1.7rem,3vw,2.3rem); }
.claim-success p{ color:var(--bone-55); font-weight:300; margin:1.1rem auto 1.8rem; max-width:44ch; }

@media (max-width:860px){
    .claim-grid{ grid-template-columns:1fr; gap:2.6rem; }
    .claim-recap{ order:2; }
}
@media (max-width:520px){
    .field-row{ grid-template-columns:1fr; }
    .field-row .field-sm{ max-width:none; }
}
