/* ================================================================
   WORTIC — home-splite.css
   Editorial dark (Apple-style) · No Tailwind · Pure CSS
   ================================================================ */

:root{
    --bg:#000;
    --surface:#0a0a0a;
    --surface-2:#111;
    --border:#1d1d1f;
    --border-strong:#2a2a2d;
    --fg:#f5f5f7;
    --fg-muted:#a1a1a6;
    --fg-faded:#6e6e73;
    --fg-dim:#424245;

    --serif:'Instrument Serif','Times New Roman',serif;
    --sans:'Geist','SF Pro Display','-apple-system',system-ui,sans-serif;

    --radius:14px;
    --radius-lg:22px;
    --radius-pill:999px;

    --container:min(1200px,92vw);
    --container-narrow:min(960px,92vw);
    --header-h:64px;

    --ease:cubic-bezier(.22,1,.36,1);
    --ease-out:cubic-bezier(.16,1,.3,1);
    --dur:.5s;
    --dur-long:.8s;
}

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

/* --- BASE ------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.5;letter-spacing:-0.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden}
::selection{background:var(--fg);color:var(--bg)}
img,picture,svg,video{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none;transition:color .3s var(--ease)}
a:hover{color:var(--fg-muted)}
input,textarea{font:inherit;color:inherit}

/* --- TYPOGRAPHY ------------------------------------------- */
h1,h2,h3,h4{margin:0;font-weight:400;letter-spacing:-0.03em;line-height:1.05;text-wrap:balance}
.serif{font-family:var(--serif);font-style:normal}
.serif-italic{font-family:var(--serif);font-style:italic}

.eyebrow{
    font-family:var(--sans);
    font-size:.75rem;
    font-weight:500;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--fg-muted);
}

.display-1{
    font-family:var(--serif);
    font-size:clamp(1.75rem,3vw,2.5rem);
    line-height:1.04;
    letter-spacing:-0.035em;
}
.display-2{
    font-family:var(--serif);
    font-size:clamp(1.375rem,2.2vw,1.875rem);
    line-height:1.08;
    letter-spacing:-0.03em;
}
.display-3{
    font-family:var(--serif);
    font-size:clamp(1.125rem,1.8vw,1.5rem);
    line-height:1.12;
}

.lede{
    color:var(--fg-muted);
    font-size:clamp(1.0625rem,1.4vw,1.25rem);
    line-height:1.55;
    max-width:60ch;
    text-wrap:pretty;
}

.muted{color:var(--fg-muted)}
.faded{color:var(--fg-faded)}

/* --- LAYOUT ----------------------------------------------- */
.container{width:var(--container);margin-inline:auto}
.container--narrow{width:var(--container-narrow);margin-inline:auto}
.section{padding-block:clamp(5rem,10vw,9rem)}
.section--tight{padding-block:clamp(3rem,6vw,5rem)}
.divider{border:0;height:1px;background:var(--border);margin:0}

/* --- HEADER ----------------------------------------------- */
.site-header{
    position:fixed;inset:0 0 auto 0;z-index:50;
    height:var(--header-h);
    display:flex;align-items:center;
    background:rgba(0,0,0,.55);
    backdrop-filter:saturate(180%) blur(20px);
    -webkit-backdrop-filter:saturate(180%) blur(20px);
    border-bottom:1px solid transparent;
    transition:border-color .3s var(--ease),background .3s var(--ease);
}
.site-header.is-scrolled{border-bottom-color:var(--border);background:rgba(0,0,0,.72)}
.site-header__inner{width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.site-header__logo{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--sans);font-weight:600;font-size:1.0625rem;letter-spacing:-0.02em;color:var(--fg)}
.site-header__logo img{height:30px;width:auto}
.site-header__nav{display:flex;align-items:center;gap:1.35rem}
.site-header__nav > a:not(.btn){font-size:.9375rem;font-weight:400;color:var(--fg-muted);transition:color .2s var(--ease)}
.site-header__nav > a:not(.btn):hover,.site-header__nav > a:not(.btn):focus-visible{color:var(--fg)}
.site-header__cta{margin-left:.5rem}
.site-header__hamburger{display:none;width:36px;height:36px;align-items:center;justify-content:center;border-radius:999px;border:1px solid var(--border)}
.site-header__hamburger span{display:block;width:16px;height:1.5px;background:var(--fg);position:relative}
.site-header__hamburger span::before,.site-header__hamburger span::after{content:'';position:absolute;left:0;width:16px;height:1.5px;background:var(--fg)}
.site-header__hamburger span::before{top:-5px}
.site-header__hamburger span::after{top:5px}

/* Mobile menu fullscreen */
.mobile-menu{
    position:fixed;inset:0;z-index:60;
    background:rgba(0,0,0,.96);
    backdrop-filter:blur(20px);
    display:none;flex-direction:column;align-items:center;justify-content:center;gap:2rem;
    font-family:var(--serif);font-size:clamp(1.75rem,5vw,2.5rem);
    opacity:0;transition:opacity .3s var(--ease);
}
.mobile-menu.is-open{display:flex;opacity:1}
.mobile-menu__close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;border-radius:999px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center}
.mobile-menu a{color:var(--fg);letter-spacing:-0.02em}

/* --- BUTTONS ---------------------------------------------- */
.btn{
    display:inline-flex;align-items:center;gap:.6rem;
    font-family:var(--sans);font-weight:500;font-size:.9375rem;letter-spacing:-0.01em;
    padding:.75rem 1.4rem;
    border-radius:var(--radius-pill);
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
    white-space:nowrap;
    will-change:transform;
}
.btn svg{width:14px;height:14px;transition:transform .2s var(--ease)}
.btn:hover svg{transform:translateX(2px)}
.btn--solid{background:var(--fg);color:var(--bg)}
.btn--solid:hover{background:#fff;transform:translateY(-1px);color:var(--bg)}
.btn:focus-visible{outline:2px solid rgba(245,245,247,.72);outline-offset:3px}
.site-header__cta.btn--solid,.site-header__cta.btn--solid:hover,.site-header__cta.btn--solid:focus-visible{color:var(--bg);border-color:#fff}
.btn--ghost{background:transparent;color:var(--fg);border-color:var(--border-strong)}
.btn--ghost:hover{background:var(--surface);border-color:var(--fg-faded)}
.btn--link{padding:0;background:none;border:0;color:var(--fg-muted);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--fg-dim)}
.btn--link:hover{color:var(--fg);text-decoration-color:var(--fg-muted)}
.btn--lg{padding:1rem 1.8rem;font-size:1rem}

/* --- HERO ------------------------------------------------- */
.hero{
    position:relative;
    min-height:100vh;
    padding-top:calc(var(--header-h) + 2rem);
    padding-bottom:3rem;
    display:flex;align-items:center;
    isolation:isolate;
    overflow:hidden;
}
.hero__grid{
    width:var(--container);margin-inline:auto;
    display:grid;gap:3rem;
    grid-template-columns:1fr;
    align-items:center;
}
@media (min-width:960px){
    .hero__grid{grid-template-columns:1.05fr 1fr;gap:2rem}
}
.hero__copy{position:relative;z-index:2}
.hero__eyebrow{margin-bottom:1.2rem;display:inline-flex;align-items:center;gap:.6rem}
.hero__eyebrow .pulse{width:6px;height:6px;border-radius:999px;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:pulse 2s var(--ease) infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 10px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.hero__title{max-width:16ch}
.hero__title em{font-style:italic;color:var(--fg-muted);font-weight:400}
.hero__lede{margin-top:1.6rem;max-width:44ch}
.hero__ctas{margin-top:2.4rem;display:flex;flex-wrap:wrap;align-items:center;gap:.8rem}
.hero__micro{margin-top:1.4rem;font-size:.8125rem;color:var(--fg-faded);display:flex;align-items:center;gap:.5rem}
.hero__micro svg{width:14px;height:14px;color:var(--fg-muted)}

/* Spline stage + spotlight */
.hero__stage{
    position:relative;
    aspect-ratio:1/1;
    width:100%;max-width:560px;
    margin-inline:auto;
    border-radius:var(--radius-lg);
    background:radial-gradient(120% 120% at 100% 0%,rgba(255,255,255,.04),transparent 60%);
    overflow:hidden;
}
.hero__stage-fallback{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    color:var(--fg-faded);
    font-size:.8125rem;
    letter-spacing:.08em;text-transform:uppercase;
    opacity:.6;
    transition:opacity .6s var(--ease);
}
.hero__stage-fallback::before{
    content:"";
    width:120px;height:120px;border-radius:50%;
    background:radial-gradient(closest-side,rgba(245,245,247,.18),rgba(245,245,247,0));
    filter:blur(8px);
}
.hero__stage.is-loaded .hero__stage-fallback{opacity:0;pointer-events:none}
spline-viewer{
    position:absolute;inset:0;width:100%;height:100%;
    opacity:0;transition:opacity 1s var(--ease);
}
.hero__stage.is-loaded spline-viewer{opacity:1}

/* Spotlight (mouse-tracking) */
.spotlight{
    position:absolute;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(245,245,247,.09),transparent 45%);
    opacity:0;transition:opacity .6s var(--ease);
}
.hero:hover .spotlight,.hero.is-active .spotlight{opacity:1}

/* Subtle background grid + glow */
.hero__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.hero__bg::before{
    content:"";position:absolute;inset:-1px;
    background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);
    background-size:80px 80px;
    mask-image:radial-gradient(ellipse 60% 60% at 50% 40%,#000,transparent 80%);
    -webkit-mask-image:radial-gradient(ellipse 60% 60% at 50% 40%,#000,transparent 80%);
    opacity:.35;
}
.hero__bg::after{
    content:"";position:absolute;left:50%;top:20%;transform:translate(-50%,0);
    width:700px;height:700px;border-radius:50%;
    background:radial-gradient(closest-side,rgba(245,245,247,.06),transparent);
    filter:blur(60px);
}

/* --- INTEGRATIONS STRIP ---------------------------------- */
.integrations{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:1.8rem 0}
.integrations__inner{width:var(--container);margin-inline:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}
.integrations__label{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-faded);flex-basis:100%}
@media (min-width:900px){.integrations__label{flex-basis:auto}}
.integrations__logos{display:flex;flex-wrap:wrap;align-items:center;gap:2rem;color:var(--fg-muted)}
.integrations__logos svg{width:22px;height:22px;transition:color .2s var(--ease),transform .2s var(--ease);opacity:.7}
.integrations__logos svg:hover{opacity:1;transform:translateY(-1px)}

/* --- SECTION: METRICS ------------------------------------ */
.metrics{padding-block:clamp(3.5rem,6vw,5.5rem)}
.metrics__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;width:var(--container);margin-inline:auto}
@media (min-width:760px){.metrics__grid{grid-template-columns:repeat(4,1fr)}}
.metric{border-left:1px solid var(--border);padding-left:1.25rem}
.metric__n{font-family:var(--serif);font-size:clamp(2.5rem,5vw,3.75rem);line-height:1;letter-spacing:-0.03em}
.metric__label{margin-top:.4rem;color:var(--fg-muted);font-size:.875rem}

/* --- SECTION: INTRO / PROBLEM ---------------------------- */
.section-intro{display:grid;gap:2rem;grid-template-columns:1fr}
@media (min-width:900px){.section-intro{grid-template-columns:1fr 1.4fr;gap:4rem}}
.section-intro__title{max-width:18ch}
.section-intro__lede{color:var(--fg-muted);font-size:clamp(1rem,1.3vw,1.1875rem);line-height:1.6;max-width:56ch}

.pains{margin-top:4rem;display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width:760px){.pains{grid-template-columns:1fr 1fr}}
.pain{padding:1.8rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);transition:border-color .3s var(--ease),transform .3s var(--ease)}
.pain:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.pain__num{font-family:var(--serif);font-size:1.75rem;color:var(--fg-faded);letter-spacing:-0.02em;margin-bottom:1rem}
.pain__title{font-family:var(--serif);font-size:1.5rem;line-height:1.1;margin-bottom:.6rem;letter-spacing:-0.02em}
.pain__desc{color:var(--fg-muted);font-size:.9375rem;line-height:1.55}

/* --- SECTION: SOLUTION (PILLARS) ------------------------- */
.pillars{margin-top:4rem;display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width:900px){.pillars{grid-template-columns:repeat(3,1fr)}}
.pillar{
    position:relative;
    padding:2rem;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:linear-gradient(180deg,var(--surface),#050505);
    transition:border-color .3s var(--ease),transform .3s var(--ease);
    min-height:340px;
    display:flex;flex-direction:column;
}
.pillar:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.pillar__kicker{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-faded);margin-bottom:auto}
.pillar__title{font-family:var(--serif);font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.05;margin:2rem 0 .8rem;letter-spacing:-0.025em}
.pillar__desc{color:var(--fg-muted);font-size:.9375rem;line-height:1.55;margin-bottom:1.4rem}
.pillar__list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.pillar__list li{display:flex;gap:.6rem;font-size:.875rem;color:var(--fg);align-items:flex-start}
.pillar__list li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--fg-muted);margin-top:.55rem;flex-shrink:0}

.pillars--editorial{
    gap:1.25rem;
    align-items:stretch;
}
.pillars--editorial .pillar{
    min-height:unset;
    display:grid;
    grid-template-rows:auto auto 1fr auto;
    gap:0;
    padding:clamp(1.75rem,2.4vw,2.5rem);
    background:
        linear-gradient(180deg, rgba(245,245,247,.03), transparent 18%),
        linear-gradient(180deg, #0a0a0a 0%, #040404 100%);
    overflow:hidden;
}
.pillars--editorial .pillar::before{
    content:"";
    position:absolute;
    inset:0 0 auto 0;
    height:1px;
    background:linear-gradient(90deg, rgba(245,245,247,.12), rgba(245,245,247,0));
    pointer-events:none;
}
.pillars--editorial .pillar__kicker{
    margin:0 0 2.25rem;
}
.pillars--editorial .pillar__title{
    margin:0 0 1rem;
    max-width:11ch;
    text-wrap:balance;
}
.pillars--editorial .pillar__desc{
    margin:0 0 1.5rem;
    max-width:31ch;
    font-size:clamp(1rem,1.1vw,1.08rem);
}
.pillars--editorial .pillar__list{
    margin-top:auto;
    padding-top:1.25rem;
    gap:.75rem;
    border-top:1px solid rgba(245,245,247,.08);
}
.pillars--editorial .pillar__list li{
    font-size:clamp(.94rem,.98vw,1rem);
    line-height:1.45;
}
@media (min-width:900px){
    .pillars--editorial .pillar__title{min-block-size:4.45em}
    .pillars--editorial .pillar__desc{min-block-size:6.2em}
}
@media (max-width:899px){
    .pillars--editorial .pillar__title,
    .pillars--editorial .pillar__desc{min-block-size:0}
}

/* --- SECTION: WATP / A2A --------------------------------- */
.section--watp{position:relative}
.watp-intro{align-items:end}
.watp-intro .section-intro__title{max-width:22ch}
.watp-intro__body{display:grid;gap:1rem}
.watp-intro__support{
    margin:0;
    max-width:58ch;
    color:var(--fg-faded);
    font-size:1rem;
    line-height:1.6;
}

.watp-bento{
    margin-top:3.5rem;
    display:grid;
    gap:1rem;
    grid-template-columns:1fr;
}
.watp-card{
    position:relative;
    overflow:hidden;
    padding:clamp(1.5rem,2vw,2rem);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    background:linear-gradient(180deg, #0b0b0b 0%, #040404 100%);
}
.watp-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(120% 100% at 100% 0%, rgba(245,245,247,.08), transparent 58%);
    pointer-events:none;
}
.watp-card > *{position:relative;z-index:1}
.watp-card--network::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(245,245,247,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245,245,247,.04) 1px, transparent 1px);
    background-size:30px 30px;
    opacity:.22;
    -webkit-mask-image:radial-gradient(circle at 50% 48%, #000 34%, transparent 82%);
    mask-image:radial-gradient(circle at 50% 48%, #000 34%, transparent 82%);
    pointer-events:none;
}
.watp-card__eyebrow,
.watp-agent__eyebrow,
.watp-core__eyebrow,
.watp-step__kicker{
    margin:0;
    font-size:.75rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--fg-faded);
}
.watp-card__title,
.watp-step__title{
    margin:0;
    font-family:var(--serif);
    line-height:1.05;
    letter-spacing:-0.03em;
    text-wrap:balance;
}
.watp-card__title{font-size:clamp(1.5rem,2.4vw,2.2rem);max-width:14ch}
.watp-card__desc,
.watp-step__desc{
    margin:0;
    color:var(--fg-muted);
    font-size:1rem;
    line-height:1.6;
}
.watp-card__header{display:grid;gap:.9rem;max-width:40rem}
.watp-card--network .watp-card__title{font-size:clamp(2rem,3vw,3rem);max-width:9ch}
.watp-card--definition .watp-card__title,
.watp-card--governance .watp-card__title{
    font-size:clamp(1.65rem,1.9vw,2rem);
    max-width:13ch;
}

.watp-network{
    position:relative;
    margin-top:1.35rem;
    min-height:18.5rem;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(180px,220px) minmax(0,1fr);
    align-items:center;
    gap:1rem;
}
.watp-network__lane{
    position:absolute;
    left:9%;
    right:9%;
    height:1px;
    background:linear-gradient(90deg, rgba(245,245,247,0), rgba(245,245,247,.18) 15%, rgba(245,245,247,.18) 85%, rgba(245,245,247,0));
}
.watp-network__lane--top{top:18%}
.watp-network__lane--middle{top:50%}
.watp-network__lane--bottom{top:82%}
.watp-agent,
.watp-core{
    position:relative;
    display:grid;
    gap:.45rem;
    padding:1.2rem 1.25rem;
    border:1px solid rgba(245,245,247,.08);
    border-radius:18px;
    background:rgba(255,255,255,.02);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}
.watp-agent strong,
.watp-core strong{
    font-size:1.1rem;
    font-weight:500;
    letter-spacing:-0.02em;
}
.watp-agent span,
.watp-core span{
    color:var(--fg-muted);
    font-size:.9rem;
    line-height:1.45;
}
.watp-packet{
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    padding:.38rem .72rem;
    border:1px solid rgba(245,245,247,.14);
    border-radius:999px;
    background:rgba(9,9,10,.92);
    color:var(--fg);
    font-size:.7rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    white-space:nowrap;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.watp-card__list{
    list-style:none;
    display:grid;
    gap:.75rem;
    margin:1.1rem 0 0;
    padding:0;
}
.watp-card__list li{
    display:flex;
    align-items:flex-start;
    gap:.65rem;
    color:var(--fg-muted);
    font-size:.98rem;
    line-height:1.5;
}
.watp-card__list li::before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:rgba(245,245,247,.52);
    margin-top:.52rem;
    flex-shrink:0;
}

.watp-steps{
    margin-top:1rem;
    display:grid;
    gap:1rem;
    grid-template-columns:1fr;
}
.watp-step{
    padding:1.45rem 1.5rem;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:linear-gradient(180deg, rgba(245,245,247,.03), #050505);
}
.watp-step__title{margin-top:.8rem;font-size:clamp(1.35rem,1.7vw,1.65rem)}
.watp-step__desc{margin-top:.8rem;max-width:32ch}
.watp-actions{
    margin-top:2.5rem;
    display:flex;
    justify-content:center;
}

/* --- SECTION: INDUSTRIAL --------------------------------- */
.industrial-intro .section-intro__title{max-width:18ch}
.industrial-intro .section-intro__lede{max-width:58ch}
.industrial-bento{
    margin-top:3.5rem;
    display:grid;
    gap:1rem;
    grid-template-columns:1fr;
}
.industrial-card{
    position:relative;
    overflow:hidden;
    padding:clamp(1.5rem,2vw,2rem);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    background:
        radial-gradient(140% 120% at 100% 0%, rgba(245,245,247,.08), transparent 48%),
        linear-gradient(180deg, #0b0b0b 0%, #040404 100%);
}
.industrial-card::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(245,245,247,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245,245,247,.03) 1px, transparent 1px);
    background-size:28px 28px;
    opacity:.22;
    pointer-events:none;
}
.industrial-card > *{position:relative;z-index:1}
.industrial-card__copy{display:grid;gap:.9rem;max-width:42rem}
.industrial-card__eyebrow{
    margin:0;
    font-size:.75rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--fg-faded);
}
.industrial-card__title{
    margin:0;
    font-family:var(--serif);
    font-size:clamp(1.55rem,2.3vw,2.5rem);
    line-height:1.05;
    letter-spacing:-0.03em;
    text-wrap:balance;
    max-width:15ch;
}
.industrial-card__desc{
    margin:0;
    color:var(--fg-muted);
    font-size:1rem;
    line-height:1.65;
    max-width:54ch;
}
.industrial-card__list{
    list-style:none;
    display:grid;
    gap:.8rem;
    margin:1.2rem 0 0;
    padding:0;
}
.industrial-card__list li{
    display:flex;
    align-items:flex-start;
    gap:.7rem;
    color:var(--fg-muted);
    font-size:.98rem;
    line-height:1.55;
}
.industrial-card__list li::before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:rgba(245,245,247,.5);
    margin-top:.52rem;
    flex-shrink:0;
}

.industrial-command{
    margin-top:1.5rem;
    padding:1rem;
    border:1px solid rgba(245,245,247,.08);
    border-radius:20px;
    background:rgba(255,255,255,.02);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    display:grid;
    gap:1rem;
}
.industrial-command__rail{
    display:flex;
    flex-wrap:wrap;
    gap:.6rem;
}
.industrial-command__rail span,
.industrial-signal span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:2rem;
    padding:.35rem .8rem;
    border-radius:999px;
    border:1px solid rgba(245,245,247,.1);
    background:rgba(245,245,247,.03);
    color:var(--fg);
    font-size:.72rem;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.industrial-command__metrics{
    display:grid;
    gap:.75rem;
    grid-template-columns:repeat(3,minmax(0,1fr));
}
.industrial-metric{
    min-height:8.5rem;
    padding:1rem;
    border-radius:18px;
    border:1px solid rgba(245,245,247,.08);
    background:linear-gradient(180deg, rgba(245,245,247,.04), rgba(245,245,247,.01));
    display:grid;
    align-content:start;
    gap:.55rem;
}
.industrial-metric span{
    color:var(--fg-faded);
    font-size:.72rem;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.industrial-metric strong{
    font-size:clamp(1.8rem,2.5vw,2.35rem);
    font-weight:500;
    letter-spacing:-0.04em;
    line-height:1;
}
.industrial-metric small{
    color:var(--fg-muted);
    font-size:.9rem;
    line-height:1.45;
}

.industrial-card--maintenance{
    display:grid;
    gap:1.25rem;
}
.industrial-signal{
    display:flex;
    flex-wrap:wrap;
    gap:.65rem;
}

@media (min-width:980px){
    .industrial-bento{
        grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);
        grid-template-areas:
            "control engineering"
            "control quality"
            "maintenance maintenance";
        align-items:stretch;
    }
    .industrial-card--control{grid-area:control}
    .industrial-card--engineering{grid-area:engineering}
    .industrial-card--quality{grid-area:quality}
    .industrial-card--maintenance{grid-area:maintenance;grid-template-columns:minmax(0,1fr) auto;align-items:end}
}

@media (max-width:759px){
    .industrial-command__metrics{grid-template-columns:1fr}
}

@media (min-width:980px){
    .watp-bento{
        grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);
        grid-template-areas:
            "network definition"
            "network governance";
        align-items:stretch;
    }
    .watp-card--network{grid-area:network;min-height:35rem}
    .watp-card--definition{grid-area:definition}
    .watp-card--governance{grid-area:governance}
    .watp-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:759px){
    .watp-network{
        min-height:auto;
        grid-template-columns:1fr;
        gap:.85rem;
    }
    .watp-network__lane,
    .watp-packet{display:none}
}

@media (prefers-reduced-motion: no-preference){
    .watp-core{
        animation:watp-core-breathe 6s var(--ease-out) infinite;
    }
    .watp-packet--intent{
        animation:watp-flow-right 6.8s linear infinite;
    }
    .watp-packet--proposal{
        animation:watp-flow-left 6.8s linear infinite 1.4s;
    }
    .watp-packet--commit{
        animation:watp-flow-right 6.8s linear infinite 2.8s;
    }
}

@keyframes watp-core-breathe{
    0%,100%{box-shadow:0 0 0 0 rgba(245,245,247,0)}
    50%{box-shadow:0 0 0 1px rgba(245,245,247,.08), 0 0 44px rgba(245,245,247,.05)}
}
@keyframes watp-flow-right{
    0%,10%{opacity:0;transform:translate(0,-50%) scale(.96)}
    18%,76%{opacity:1}
    100%{opacity:0;transform:translate(calc(100% - 7rem),-50%) scale(1)}
}
@keyframes watp-flow-left{
    0%,10%{opacity:0;transform:translate(calc(100% - 8rem),-50%) scale(.96)}
    18%,76%{opacity:1}
    100%{opacity:0;transform:translate(0,-50%) scale(1)}
}

/* --- SECTION: CTA ---------------------------------------- */
.cta-block{text-align:center;padding:clamp(4rem,8vw,7rem) 2rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:radial-gradient(100% 100% at 50% 0%,rgba(245,245,247,.06),transparent 60%),var(--surface)}
.cta-block .lede{margin:1.2rem auto 2rem;text-align:center}
.cta-block__actions{display:inline-flex;flex-wrap:wrap;gap:.8rem;justify-content:center}

/* --- FOOTER ---------------------------------------------- */
.site-footer{border-top:1px solid var(--border);padding-block:3rem;color:var(--fg-muted);font-size:.875rem}
.site-footer__grid{display:grid;gap:2rem;grid-template-columns:1fr;width:var(--container);margin-inline:auto}
@media (min-width:760px){.site-footer__grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.site-footer h4{font-family:var(--sans);font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-faded);margin-bottom:1rem;font-weight:500}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.site-footer a:hover{color:var(--fg)}
.site-footer__brand{max-width:28ch}
.site-footer__brand p{margin:.8rem 0 0;line-height:1.55}
.site-footer__bottom{width:var(--container);margin:2.5rem auto 0;padding-top:1.5rem;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;color:var(--fg-faded);font-size:.8125rem}

/* --- MODAL (Lead capture) -------------------------------- */
.modal{
    position:fixed;inset:0;z-index:80;
    display:none;align-items:center;justify-content:center;
    padding:1rem;
    background:rgba(0,0,0,.72);
    backdrop-filter:blur(8px);
    opacity:0;transition:opacity .3s var(--ease);
}
.modal.is-open{display:flex;opacity:1}
.modal__dialog{
    width:100%;max-width:460px;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    padding:2rem;
    transform:translateY(8px);
    transition:transform .35s var(--ease);
}
.modal.is-open .modal__dialog{transform:translateY(0)}
.modal__close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:999px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--fg-muted);background:rgba(0,0,0,.4)}
.modal__close:hover{color:var(--fg);border-color:var(--fg-faded)}
.modal__title{font-family:var(--serif);font-size:1.75rem;line-height:1.1;letter-spacing:-0.02em;margin:0 0 .5rem}
.modal__subtitle{color:var(--fg-muted);font-size:.9375rem;line-height:1.5;margin:0 0 1.6rem}

.form{display:grid;gap:.8rem}
.field{display:grid;gap:.4rem}
.field label{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faded)}
.field input{
    height:44px;padding:0 .9rem;
    background:var(--bg);
    border:1px solid var(--border-strong);
    border-radius:10px;
    color:var(--fg);
    transition:border-color .2s var(--ease),background .2s var(--ease);
}
.field input:focus{outline:none;border-color:var(--fg-muted);background:#0d0d0d}
.field--error input{border-color:#ff6b6b}
.field__error{color:#ff9f9f;font-size:.75rem;margin-top:.2rem;min-height:1em}
.form__actions{margin-top:.6rem;display:flex;justify-content:flex-end;gap:.6rem}
.form__legal{font-size:.75rem;color:var(--fg-faded);line-height:1.5;margin:0}
.form__legal a{text-decoration:underline;text-underline-offset:3px}

.form__success{display:none;text-align:center;padding:.5rem 0}
.form__success h3{font-family:var(--serif);font-size:1.6rem;margin:0 0 .5rem}
.form__success p{color:var(--fg-muted);margin:0}
.form.is-sent .form__fields{display:none}
.form.is-sent .form__success{display:block}

/* --- COOKIE BANNER --------------------------------------- */
.cookie-banner{position:fixed;inset:auto 0 0 0;z-index:70;background:rgba(10,10,10,.95);border-top:1px solid var(--border);backdrop-filter:blur(12px)}
.cookie-banner__inner{width:var(--container);margin-inline:auto;padding:1rem 0;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:space-between;font-size:.875rem}
.cookie-banner p{margin:0;color:var(--fg-muted)}
.cookie-banner a{text-decoration:underline;text-underline-offset:3px}
.cookie-banner__actions{display:flex;gap:.5rem;flex-wrap:wrap}
.cookie-banner .btn{padding:.55rem 1rem;font-size:.8125rem}

/* --- REVEAL ON SCROLL ------------------------------------ */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.reveal.is-visible{opacity:1;transform:none}

/* --- RESPONSIVE ------------------------------------------ */
@media (max-width:760px){
    .site-header__nav{display:none}
    .site-header__hamburger{display:flex}
    .hero{min-height:auto;padding-top:calc(var(--header-h) + 4rem)}
    .hero__stage{max-width:420px}
    .metric{border-left:0;border-top:1px solid var(--border);padding-left:0;padding-top:1rem}
}

/* --- PAGE LOADER ----------------------------------------- */
.page-loader{
    position:fixed;inset:0;z-index:200;
    background:#000;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;
    transition:opacity .6s var(--ease),visibility .6s var(--ease);
    will-change:opacity;
}
.page-loader.is-done{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
}
.page-loader__icon{
    width:clamp(150px, 16vw, 200px);
    height:auto;
    object-fit:contain;
    opacity:0;
    animation:loader-pulse 1.6s var(--ease) .1s infinite, loader-fade-in .5s var(--ease) .1s forwards;
}
@keyframes loader-pulse{
    0%,100%{opacity:.7;transform:scale(.95)}
    50%{opacity:1;transform:scale(1.04)}
}
.page-loader__bar{
    width:clamp(120px,20vw,200px);
    height:1px;
    background:rgba(245,245,247,.12);
    position:relative;
    overflow:hidden;
    border-radius:999px;
}
.page-loader__bar::after{
    content:'';
    position:absolute;
    inset:0 auto 0 0;
    background:var(--fg);
    animation:loader-fill 2.6s cubic-bezier(.16,1,.3,1) .3s forwards;
    transform:scaleX(0);
    transform-origin:left;
}
@keyframes loader-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes loader-fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* --- PRINT ----------------------------------------------- */
@media print{
    .site-header,.cookie-banner,.modal,.mobile-menu,.hero__bg,.spotlight,spline-viewer{display:none !important}
    body{background:#fff;color:#000}
}

/* =========================================================
   CHATBOT WIDGET
   Floating sales assistant — dark Apple design
   ========================================================= */

/* Trigger button */
.chat-trigger{
    position:fixed;
    bottom:28px;
    right:28px;
    z-index:9990;
    width:56px;
    height:56px;
    border-radius:50%;
    background:var(--fg);
    color:var(--bg);
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 24px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);
    transition:transform .2s var(--ease),box-shadow .2s var(--ease),opacity .2s var(--ease);
    will-change:transform;
}
.chat-trigger:hover{
    transform:scale(1.08);
    box-shadow:0 8px 32px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.14);
}
.chat-trigger:active{transform:scale(.96)}
.chat-trigger__icon--open,.chat-trigger__icon--close{
    position:absolute;
    transition:opacity .2s,transform .2s;
}
.chat-trigger__icon--close{opacity:0;transform:rotate(-45deg) scale(.7)}
.chat-trigger.is-open .chat-trigger__icon--open{opacity:0;transform:rotate(45deg) scale(.7)}
.chat-trigger.is-open .chat-trigger__icon--close{opacity:1;transform:rotate(0) scale(1)}

/* Unread badge */
.chat-trigger__badge{
    position:absolute;
    top:-3px;
    right:-3px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#ff3b30;
    border:2px solid var(--bg);
    font-size:10px;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    opacity:0;
    transform:scale(0);
    transition:opacity .2s,transform .2s;
}
.chat-trigger__badge.visible{opacity:1;transform:scale(1)}

/* Panel */
.chat-panel{
    position:fixed;
    bottom:96px;
    right:28px;
    z-index:9989;
    width:min(380px,calc(100vw - 32px));
    height:min(560px,calc(100dvh - 120px));
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    box-shadow:0 24px 64px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.05);
    opacity:0;
    transform:translateY(16px) scale(.97);
    pointer-events:none;
    transition:opacity .25s var(--ease),transform .25s var(--ease);
    will-change:transform,opacity;
}
.chat-panel.is-open{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:all;
}

/* Header */
.chat-panel__header{
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 18px;
    border-bottom:1px solid var(--border);
    flex-shrink:0;
}
.chat-panel__avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
    background:var(--surface-2);
}
.chat-panel__avatar img{width:100%;height:100%;object-fit:cover}
.chat-panel__info{flex:1;min-width:0}
.chat-panel__name{
    font-size:.8125rem;
    font-weight:600;
    color:var(--fg);
    line-height:1.2;
}
.chat-panel__status{
    font-size:.6875rem;
    color:#30d158;
    margin-top:2px;
    display:flex;
    align-items:center;
    gap:5px;
}
.chat-panel__status::before{
    content:'';
    width:6px;
    height:6px;
    border-radius:50%;
    background:#30d158;
    flex-shrink:0;
}
.chat-panel__close{
    width:28px;
    height:28px;
    border-radius:50%;
    background:var(--surface-2);
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--fg-muted);
    transition:background .15s,color .15s;
    flex-shrink:0;
}
.chat-panel__close:hover{background:var(--border);color:var(--fg)}

/* Messages area */
.chat-messages{
    flex:1;
    overflow-y:auto;
    padding:16px 18px;
    display:flex;
    flex-direction:column;
    gap:10px;
    scroll-behavior:smooth;
    overscroll-behavior:contain;
}
.chat-messages::-webkit-scrollbar{width:4px}
.chat-messages::-webkit-scrollbar-track{background:transparent}
.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}

/* Bubbles */
.chat-bubble{
    max-width:82%;
    padding:10px 14px;
    border-radius:18px;
    font-size:.8125rem;
    line-height:1.5;
    word-break:break-word;
    animation:bubble-in .22s var(--ease) both;
}
@keyframes bubble-in{
    from{opacity:0;transform:translateY(6px) scale(.97)}
    to{opacity:1;transform:none}
}
.chat-bubble--bot{
    background:var(--surface-2);
    color:var(--fg);
    align-self:flex-start;
    border-bottom-left-radius:4px;
}
.chat-bubble--user{
    background:var(--fg);
    color:var(--bg);
    align-self:flex-end;
    border-bottom-right-radius:4px;
}

/* Typing indicator */
.chat-typing{
    display:flex;
    align-items:center;
    gap:5px;
    align-self:flex-start;
    padding:10px 14px;
    background:var(--surface-2);
    border-radius:18px;
    border-bottom-left-radius:4px;
}
.chat-typing span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--fg-muted);
    animation:typing-dot .9s infinite both;
}
.chat-typing span:nth-child(2){animation-delay:.15s}
.chat-typing span:nth-child(3){animation-delay:.3s}
@keyframes typing-dot{
    0%,60%,100%{transform:translateY(0)}
    30%{transform:translateY(-5px)}
}

/* Lead captured celebration */
.chat-lead-captured{
    align-self:stretch;
    background:linear-gradient(135deg,rgba(48,209,88,.12),rgba(48,209,88,.06));
    border:1px solid rgba(48,209,88,.2);
    border-radius:12px;
    padding:12px 14px;
    font-size:.75rem;
    color:#30d158;
    text-align:center;
    line-height:1.5;
    animation:bubble-in .3s var(--ease) both;
}

/* Input area */
.chat-input-row{
    display:flex;
    align-items:flex-end;
    gap:8px;
    padding:12px 14px;
    border-top:1px solid var(--border);
    flex-shrink:0;
}
.chat-input{
    flex:1;
    background:var(--surface-2);
    border:1px solid var(--border);
    border-radius:22px;
    padding:10px 16px;
    font-size:.8125rem;
    font-family:var(--sans);
    color:var(--fg);
    resize:none;
    outline:none;
    line-height:1.4;
    max-height:100px;
    overflow-y:auto;
    transition:border-color .15s;
}
.chat-input::placeholder{color:var(--fg-faded)}
.chat-input:focus{border-color:rgba(255,255,255,.18)}
.chat-send{
    width:38px;
    height:38px;
    border-radius:50%;
    background:var(--fg);
    color:var(--bg);
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:transform .15s,opacity .15s;
}
.chat-send:hover{transform:scale(1.07)}
.chat-send:active{transform:scale(.93)}
.chat-send:disabled{opacity:.4;cursor:not-allowed;transform:none}

/* Mobile: full-width panel */
@media(max-width:480px){
    .chat-panel{
        width:100vw;
        right:0;
        bottom:0;
        border-radius:var(--radius-lg) var(--radius-lg) 0 0;
        height:min(520px,85dvh);
    }
    .chat-trigger{bottom:20px;right:20px}
}
