:root{color-scheme:light;--paper:#f6f8f8;--white:#fff;--ink:#0a0d12;--muted:#52606d;--quiet:#71808e;--line:rgba(10,13,18,.1);--teal:#0d9488;--teal-dark:#08766e;--mint:#5eead4;--sky:#7dd3fc;--blue:#1d6d91;--soft-teal:rgba(13,148,136,.08);--soft-blue:rgba(29,109,145,.07);--display:"Aptos Display","Segoe UI Variable Display","Trebuchet MS",sans-serif;--body:"Aptos","Segoe UI Variable Text",sans-serif;--mono:"Cascadia Code",Consolas,monospace;--curve:cubic-bezier(.32,.72,0,1);--wrap:1200px;--radius:30px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 86% 8%,rgba(125,211,252,.12),transparent 25rem),radial-gradient(circle at 8% 28%,rgba(94,234,212,.08),transparent 29rem),var(--paper);color:var(--ink);font-family:var(--body);line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}img,svg{display:block;max-width:100%}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}::selection{color:var(--ink);background:var(--mint)}:focus-visible{outline:3px solid var(--teal);outline-offset:4px}:target{scroll-margin-top:120px}.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;z-index:30;top:10px;left:10px;padding:11px 16px;border-radius:999px;background:var(--ink);color:var(--white);transform:translateY(-160%);transition:transform 450ms var(--curve)}.skip-link:focus{transform:translateY(0)}
.site-header{position:sticky;z-index:20;top:16px;height:0}.site-nav{min-height:64px;display:flex;align-items:center;gap:26px;padding:7px 8px 7px 18px;border-radius:999px;background:rgba(255,255,255,.88);box-shadow:inset 0 0 0 1px rgba(10,13,18,.08),0 18px 55px rgba(32,51,63,.1);backdrop-filter:blur(18px)}.brand{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;text-decoration:none}.brand img{width:43px;height:43px}.brand-word{font-family:var(--display);font-size:1.06rem;font-weight:410;letter-spacing:-.04em}.brand-word strong{color:var(--teal);font-weight:760}.nav-links{display:flex;align-items:center;gap:2px;margin-left:auto}.nav-links>a{min-height:44px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;color:var(--muted);font-size:.89rem;font-weight:620;text-decoration:none;transition:color 450ms var(--curve),background-color 450ms var(--curve),transform 450ms var(--curve)}.nav-links>a:hover,.nav-links>a[aria-current=page]{color:var(--ink);background:rgba(10,13,18,.045);transform:translateY(-1px)}.nav-links .nav-cta{padding-inline:18px 7px;background:var(--ink);color:var(--white)}.nav-links .nav-cta:hover{color:var(--white);background:#18212a}.mini-arrow,.button-icon{width:31px;height:31px;display:inline-grid;place-items:center;margin-left:10px;border-radius:50%;background:rgba(255,255,255,.12);transition:transform 500ms var(--curve)}.nav-cta:hover .mini-arrow,.button:hover .button-icon{transform:translate(3px,-1px) scale(1.05)}.nav-toggle{display:none;width:48px;height:48px;margin-left:auto;border:0;border-radius:50%;background:var(--ink);color:var(--white)}.nav-toggle span:not(.sr-only){width:18px;height:1px;display:block;margin:5px auto;background:currentColor;transition:transform 500ms var(--curve),opacity 350ms var(--curve)}.nav-toggle[aria-expanded=true] span:nth-child(2){transform:translateY(3px) rotate(45deg)}.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-3px) rotate(-45deg)}
.eyebrow,.kicker,.status{display:inline-flex;align-items:center;gap:9px;color:var(--teal-dark);font:650 .7rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase}.eyebrow:before,.kicker:before{width:22px;height:1px;background:currentColor;content:""}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--display);letter-spacing:-.055em;line-height:.98}h1{font-size:clamp(3.3rem,7.3vw,7.6rem);font-weight:690}h2{font-size:clamp(2.45rem,5vw,5.1rem);font-weight:660}h3{font-size:clamp(1.45rem,2.4vw,2.25rem);font-weight:650}.lead{max-width:710px;color:var(--muted);font-size:clamp(1.08rem,1.7vw,1.3rem)}.small-note{color:var(--quiet);font:.74rem/1.6 var(--mono)}.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:6px 7px 6px 21px;border-radius:999px;font-weight:680;text-decoration:none;transition:transform 550ms var(--curve),background-color 550ms var(--curve),color 550ms var(--curve),box-shadow 550ms var(--curve)}.button:hover{transform:translateY(-3px)}.button:active{transform:scale(.98)}.button-primary{background:var(--ink);color:var(--white);box-shadow:0 13px 30px rgba(10,13,18,.14)}.button-soft{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.button-soft .button-icon{background:rgba(10,13,18,.05)}.actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:30px}.bezel{padding:7px;border-radius:calc(var(--radius) + 7px);background:rgba(10,13,18,.035);box-shadow:inset 0 0 0 1px rgba(10,13,18,.055)}.bezel-core{height:100%;border-radius:var(--radius);background:rgba(255,255,255,.94);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 20px 65px rgba(35,55,68,.07)}
.threshold{min-height:100dvh;display:grid;place-items:center;padding:150px 0 84px}.threshold-inner{text-align:center}.threshold-mark{width:76px;height:76px;margin:0 auto 28px;filter:drop-shadow(0 14px 30px rgba(13,148,136,.15));animation:mark-arrival 1.1s var(--curve) both}.threshold h1{max-width:990px;margin:18px auto 24px}.threshold .lead{margin-inline:auto}.threshold-copy{animation:copy-arrival 1s 120ms var(--curve) both}.intent-stage{position:relative;margin-top:64px;padding-top:50px}.intent-stage:before{position:absolute;top:0;left:50%;width:1px;height:50px;background:linear-gradient(var(--teal),rgba(13,148,136,.14));content:"";transform-origin:top;animation:signal-grow .9s 500ms var(--curve) both}.intent-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left}.intent-grid:before{position:absolute;z-index:-1;top:0;left:25%;right:25%;height:1px;background:linear-gradient(90deg,rgba(13,148,136,.25),var(--teal),rgba(29,109,145,.3));content:""}.intent-card{min-height:350px;color:inherit;text-decoration:none;transition:transform 750ms var(--curve)}.intent-card:hover{transform:translateY(-9px)}.intent-card .bezel-core{position:relative;overflow:hidden;padding:clamp(28px,4vw,46px)}.intent-card .bezel-core:after{position:absolute;right:-50px;bottom:-80px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(94,234,212,.15),transparent 67%);content:"";transition:transform 900ms var(--curve),opacity 650ms var(--curve)}.intent-card.knowledge .bezel-core:after{background:radial-gradient(circle,rgba(125,211,252,.18),transparent 67%)}.intent-card:hover .bezel-core:after{opacity:.7;transform:translate(-16px,-14px) scale(1.1)}.intent-label{display:flex;justify-content:space-between;color:var(--teal-dark);font:650 .7rem var(--mono);letter-spacing:.12em;text-transform:uppercase}.knowledge .intent-label{color:var(--blue)}.intent-card h2{max-width:560px;margin:50px 0 19px;font-size:clamp(2rem,4.1vw,4rem)}.intent-card p{max-width:510px;color:var(--muted)}.intent-tags{display:flex;flex-wrap:wrap;gap:7px;margin:27px 0 30px}.intent-tags span{padding:7px 10px;border-radius:999px;background:var(--soft-teal);color:var(--teal-dark);font:600 .68rem var(--mono)}.knowledge .intent-tags span{color:var(--blue);background:var(--soft-blue)}.intent-action{position:absolute;bottom:38px;left:clamp(28px,4vw,46px);display:inline-flex;align-items:center;font-weight:710}.intent-action i{width:35px;height:35px;display:inline-grid;place-items:center;margin-left:10px;border-radius:50%;background:var(--ink);color:var(--white);font-style:normal;transition:transform 500ms var(--curve)}.intent-card:hover .intent-action i{transform:translateX(5px)}
.assurance{padding:25px 0;border-block:1px solid var(--line);background:rgba(255,255,255,.45)}.assurance-list{display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:0;list-style:none}.assurance li{min-height:74px;display:grid;place-content:center;padding:10px 28px;border-left:1px solid var(--line);text-align:center}.assurance li:first-child{border-left:0}.assurance strong{display:block;font-size:.91rem}.assurance span{color:var(--quiet);font-size:.78rem}.section{padding:clamp(92px,11vw,150px) 0}.section-tint{border-block:1px solid var(--line);background:rgba(255,255,255,.48)}.section-head{max-width:820px;margin-bottom:52px}.section-head h2{margin:18px 0 20px}.section-head p{max-width:690px;color:var(--muted);font-size:1.08rem}.page-hero{min-height:88dvh;display:grid;align-items:center;padding:160px 0 90px}.page-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:clamp(44px,8vw,110px);align-items:center}.page-hero h1{max-width:880px;margin:22px 0 28px;font-size:clamp(3.2rem,6.7vw,7rem)}.hero-aside .bezel-core{padding:34px}.hero-aside h2{margin:18px 0;font-size:2rem}.aside-list{display:grid;margin:25px 0 0;padding:0;list-style:none}.aside-list li{padding:15px 0;border-top:1px solid var(--line);color:var(--muted)}.aside-list strong{display:block;color:var(--ink);font-size:.9rem}
.pain-grid,.scope-grid,.track-grid,.preparation-grid{display:grid;gap:14px}.pain-grid{grid-template-columns:1.15fr .85fr .85fr}.pain-card .bezel-core,.track-card .bezel-core,.preparation-card .bezel-core{padding:31px}.pain-card:first-child{grid-row:span 2}.pain-card h3{margin:45px 0 14px}.pain-card p,.track-card p,.preparation-card p{color:var(--muted)}.card-index{color:var(--quiet);font:650 .68rem var(--mono);letter-spacing:.1em}.scope-grid{grid-template-columns:repeat(2,1fr)}.scope-item{min-height:210px;display:grid;grid-template-columns:54px 1fr;gap:21px;padding:31px;border-radius:25px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}.scope-symbol{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--soft-teal);color:var(--teal-dark);font:680 .72rem var(--mono);box-shadow:inset 0 0 0 1px rgba(13,148,136,.18)}
.scope-symbol svg{width:24px;height:24px}.scope-item h3{margin:5px 0 12px;font-size:1.36rem}.scope-item p{color:var(--muted);font-size:.92rem}.authorization-note{margin-top:18px;padding:22px 25px;border-radius:20px;background:#10171e;color:#dbe5eb}.authorization-note strong{color:var(--mint)}
.offer-panel .bezel-core{display:grid;grid-template-columns:.82fr 1.18fr;gap:60px;padding:clamp(34px,6vw,72px)}.offer-price{display:block;margin:25px 0 12px;font-family:var(--display);font-size:clamp(3.8rem,7vw,7rem);font-weight:720;letter-spacing:-.075em;line-height:.82}.offer-price small{display:block;margin-top:18px;color:var(--muted);font:500 .78rem/1.5 var(--mono);letter-spacing:0}.included{display:grid;margin:0;padding:0;list-style:none}.included li{display:grid;grid-template-columns:35px 1fr;gap:14px;padding:17px 0;border-top:1px solid var(--line)}.included li:first-child{border-top:0}.included li>span{color:var(--teal-dark);font:650 .7rem var(--mono)}.included p{margin:4px 0 0;color:var(--muted);font-size:.88rem}.boundaries{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:15px}.boundary{padding:30px;border-radius:24px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}.boundary h3{font-size:1.45rem}.boundary ul{padding-left:19px;color:var(--muted)}.timeline{max-width:950px;margin-left:auto}.timeline-row{display:grid;grid-template-columns:120px 1fr;gap:36px;padding:31px 0;border-top:1px solid var(--line)}.timeline-row:last-child{border-bottom:1px solid var(--line)}.timeline-row>span{color:var(--teal-dark);font:650 .72rem var(--mono);letter-spacing:.1em}.timeline-row h3{margin-bottom:10px;font-size:1.55rem}.timeline-row p{margin:0;color:var(--muted)}.progression-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.progression-card{min-height:230px;padding:31px;border-radius:24px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}.progression-card h3{margin:42px 0 12px;font-size:1.5rem}.progression-card p{color:var(--muted)}
.track-grid{grid-template-columns:repeat(2,1fr)}.track-card{min-height:280px}.track-card h3{margin:40px 0 14px}.track-state,.preparation-card .status{display:inline-flex;padding:6px 9px;border-radius:999px;background:var(--soft-blue);color:var(--blue);font:620 .65rem var(--mono);letter-spacing:.08em;text-transform:uppercase}.product-panel .bezel-core{display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.product-preview{min-height:570px;display:grid;place-items:center;padding:45px;background:linear-gradient(rgba(94,234,212,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(94,234,212,.04) 1px,transparent 1px),#0a0d12;background-size:30px 30px}.product-preview img{width:min(100%,520px);border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.34)}.product-copy{padding:clamp(35px,6vw,72px)}.product-copy h2{margin:20px 0;font-size:clamp(2.5rem,4.8vw,4.6rem)}.product-copy>p{color:var(--muted)}.price-line{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:30px 0 25px;padding-block:22px;border-block:1px solid var(--line)}.price-line span{color:var(--quiet);font:.7rem var(--mono)}.price-line strong{font-family:var(--display);font-size:3.3rem;letter-spacing:-.06em;line-height:1}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);margin:25px 0}.stat-grid div{padding:12px;border-left:1px solid var(--line)}.stat-grid div:first-child{padding-left:0;border-left:0}.stat-grid strong{display:block;font-size:1.35rem}.stat-grid span{color:var(--quiet);font-size:.72rem}.preparation-grid{grid-template-columns:repeat(3,1fr)}.preparation-card{min-height:270px}.preparation-card h3{margin:37px 0 13px}
.faq{max-width:880px}.faq details{border-top:1px solid var(--line)}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:20px 0;cursor:pointer;font-weight:700;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{width:31px;height:31px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:rgba(10,13,18,.05);content:"+";transition:transform 450ms var(--curve)}.faq details[open] summary:after{transform:rotate(45deg)}.faq details p{max-width:730px;padding-bottom:23px;color:var(--muted)}.cta-panel .bezel-core{display:grid;grid-template-columns:1.25fr .75fr;gap:35px;align-items:center;padding:clamp(38px,6vw,72px);background:radial-gradient(circle at 94% 20%,rgba(94,234,212,.16),transparent 17rem),var(--white)}.cta-panel h2{margin:15px 0}.cta-panel p{max-width:610px;color:var(--muted)}.cta-actions{display:flex;justify-content:flex-end}.site-footer{padding:60px 0 38px;border-top:1px solid var(--line)}.footer-main{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:50px}.footer-brand{max-width:370px}.footer-brand .brand{margin-bottom:17px}.footer-brand p{color:var(--muted);font-size:.88rem}.footer-column strong{display:block;margin-bottom:13px;font:650 .67rem var(--mono);letter-spacing:.1em;text-transform:uppercase}.footer-column a,.footer-column span{display:block;margin-top:8px;color:var(--muted);font-size:.84rem;text-decoration:none}.footer-column a:hover{color:var(--teal-dark)}.footer-bottom{display:flex;justify-content:space-between;gap:25px;margin-top:42px;padding-top:22px;border-top:1px solid var(--line);color:var(--quiet);font:.7rem var(--mono)}
.motion-ready .reveal{opacity:0;transform:translateY(46px)}.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0);transition:opacity 900ms var(--curve),transform 900ms var(--curve)}.motion-ready .reveal[data-delay="1"]{transition-delay:90ms}.motion-ready .reveal[data-delay="2"]{transition-delay:180ms}@keyframes mark-arrival{from{opacity:0;transform:translateY(18px) scale(.88)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes copy-arrival{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes signal-grow{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}
@media(max-width:920px){.page-hero-grid,.offer-panel .bezel-core,.product-panel .bezel-core,.cta-panel .bezel-core{grid-template-columns:1fr}.pain-grid{grid-template-columns:1fr 1fr}.pain-card:first-child{grid-row:auto;grid-column:1/-1}.progression-grid,.preparation-grid{grid-template-columns:1fr}.cta-actions{justify-content:flex-start}.footer-main{grid-template-columns:1.2fr .8fr}}
@media(max-width:760px){.wrap{width:min(var(--wrap),calc(100% - 28px))}.site-header{top:9px}.site-nav{min-height:58px;padding:5px 5px 5px 13px}.brand-word{display:none}.brand img{width:42px;height:42px}.nav-toggle{display:block}.nav-links{position:absolute;top:68px;right:0;left:0;display:grid;gap:4px;padding:13px;border-radius:24px;background:rgba(255,255,255,.97);box-shadow:0 25px 70px rgba(32,51,63,.16),inset 0 0 0 1px var(--line);opacity:0;pointer-events:none;transform:translateY(-15px) scale(.98);transition:opacity 450ms var(--curve),transform 550ms var(--curve)}.nav-links.open{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}.nav-links>a{min-height:51px;justify-content:space-between;padding-inline:17px}.threshold{padding:132px 0 62px}.threshold-mark{width:65px;height:65px}.intent-stage{margin-top:46px;padding-top:30px}.intent-stage:before{height:30px}.intent-grid{grid-template-columns:1fr}.intent-grid:before{display:none}.intent-card{min-height:380px}.intent-card h2{margin-top:38px}.assurance-list{grid-template-columns:1fr}.assurance li{border-top:1px solid var(--line);border-left:0}.assurance li:first-child{border-top:0}.page-hero{min-height:auto;padding:135px 0 75px}.page-hero h1{font-size:clamp(3rem,15vw,5.2rem)}.pain-grid,.scope-grid,.track-grid,.boundaries{grid-template-columns:1fr}.scope-item{grid-template-columns:46px 1fr;padding:25px}.offer-price{font-size:4.3rem}.timeline{margin:0}.timeline-row{grid-template-columns:1fr;gap:10px}.product-preview{min-height:390px;padding:24px}.stat-grid{grid-template-columns:1fr}.stat-grid div{padding:11px 0;border-top:1px solid var(--line);border-left:0}.stat-grid div:first-child{border-top:0}.footer-main{grid-template-columns:1fr;gap:30px}.footer-bottom{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.motion-ready .reveal{opacity:1;transform:none}}@media print{.site-header,.actions,.cta-panel{display:none}body{background:#fff}.section,.page-hero{padding-block:35px}.bezel,.bezel-core{box-shadow:none}}
.actions-center{justify-content:center}
.product-preview img{height:auto}
.price-line strong{white-space:nowrap}

/* L99 clarity layer · 2026-08-30 */
:root{--quiet:#596775}
.brand img,.threshold-mark{object-fit:cover;border-radius:50%}
.intent-card{display:block}
.intent-card .bezel-core{display:flex;flex-direction:column}
.intent-card h2{margin:30px 0 16px}
.intent-card p{margin-bottom:24px}
.intent-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:24px;padding-top:17px;border-top:1px solid var(--line);color:var(--quiet);font:.67rem var(--mono)}
.intent-meta b{color:var(--teal-dark);font-weight:700}.knowledge .intent-meta b{color:var(--blue)}
.intent-action{position:static;left:auto;bottom:auto;width:max-content;min-height:48px;margin-top:auto;padding:6px 7px 6px 18px;border-radius:999px;background:var(--ink);color:var(--white)}
.intent-action i{background:rgba(255,255,255,.13)}
.flow-map,.process-map{margin:0}.flow-map .bezel-core,.process-map .bezel-core{padding:clamp(30px,5vw,58px)}
.flow-map figcaption,.process-map figcaption{margin-bottom:30px;color:var(--muted);font:.78rem var(--mono);letter-spacing:.04em}
.flow-map ol,.process-map ol{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:0;padding:0;list-style:none}
.flow-map ol:before,.process-map ol:before{position:absolute;top:25px;right:8%;left:8%;height:1px;background:linear-gradient(90deg,var(--mint),var(--teal),var(--sky));content:""}
.flow-map li,.process-map li{position:relative;display:grid;justify-items:center;gap:8px;padding:0 11px;text-align:center}
.flow-map li>span,.process-map li>span{z-index:1;width:50px;height:50px;display:grid;place-items:center;border-radius:50%;background:var(--ink);color:var(--mint);box-shadow:0 0 0 8px var(--white);font:700 .68rem var(--mono)}
.flow-map strong,.process-map strong{margin-top:13px;font-size:1rem}.flow-map small,.process-map small{color:var(--quiet);font-size:.73rem}
.process-map .bezel-core>p{max-width:780px;margin:38px auto 0;padding-top:24px;border-top:1px solid var(--line);color:var(--muted);text-align:center}
.academy-process li>span{color:var(--sky)}
.actions-equal{display:grid;grid-template-columns:1fr 1fr}.actions-equal .button{width:100%}.knowledge-button{background:#155c78}
.state-band{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:24px 0 0}.state-band time{color:var(--quiet);font:.68rem var(--mono)}
.state-pill{width:max-content;display:inline-flex;padding:7px 10px;border-radius:999px;font:700 .62rem var(--mono);letter-spacing:.07em;text-transform:uppercase}
.quick-intent-selector{display:none}
.state-progress{background:var(--soft-teal);color:var(--teal-dark)}.state-future{background:var(--soft-blue);color:var(--blue)}.state-blocked{background:#fff0df;color:#8a4b00}
.scope-item .state-pill{margin:0 0 14px}.scope-item .state-pill+h3{margin-top:0}
.progression-card .state-pill{margin-bottom:35px}.progression-card .state-pill+h3{margin-top:0}
.course-roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.roadmap-card{min-height:255px;display:flex;flex-direction:column;padding:31px;border-radius:25px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.roadmap-card h3{margin:34px 0 12px;font-size:1.55rem}.roadmap-card p{color:var(--muted);font-size:.9rem}.roadmap-card>time,.roadmap-card>span:last-child{margin-top:auto;color:var(--quiet);font:.67rem var(--mono)}
.roadmap-lead{background:radial-gradient(circle at 90% 12%,rgba(94,234,212,.18),transparent 12rem),var(--white)}
@media(max-width:920px){.course-roadmap{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
  .nav-links{visibility:hidden}.nav-links.open{visibility:visible}
  .threshold{min-height:auto;padding:86px 0 48px}.threshold-mark{width:48px;height:48px;margin-bottom:13px}.threshold h1{margin:10px auto 12px;font-size:clamp(2.45rem,11.5vw,4rem)}.threshold .lead{font-size:.94rem;line-height:1.48}.quick-intent-selector{display:block;margin-top:17px}.quick-intent-selector>time{display:block;margin-bottom:7px;color:var(--quiet);font:.59rem var(--mono)}.quick-intent-selector>span{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quick-intent-selector a{min-height:58px;display:grid;place-content:center;padding:8px 10px;border-radius:16px;background:var(--ink);color:var(--white);text-align:left;text-decoration:none}.quick-intent-selector a:last-child{background:#155c78}.quick-intent-selector b{font-size:.8rem}.quick-intent-selector small{color:rgba(255,255,255,.75);font:.53rem var(--mono)}
  .intent-stage{margin-top:30px;padding-top:22px}.intent-stage:before{height:22px}.intent-card{min-height:205px}.intent-card .bezel-core{padding:21px}.intent-label{font-size:.61rem}.intent-meta{margin-top:14px;padding-top:12px;font-size:.58rem}.intent-meta time{display:none}.intent-card h2{margin:18px 0 13px;font-size:1.45rem}.intent-card p,.intent-tags{display:none}.intent-action{min-height:42px;padding-left:15px;font-size:.81rem}.intent-action i{width:30px;height:30px}
  .flow-map ol,.process-map ol{grid-template-columns:1fr}.flow-map ol:before,.process-map ol:before{top:25px;bottom:25px;left:25px;width:1px;height:auto}.flow-map li,.process-map li{grid-template-columns:50px 1fr;justify-items:start;align-items:center;gap:14px;padding:10px 0;text-align:left}.flow-map strong,.process-map strong{margin:0}.flow-map small,.process-map small{grid-column:2}.flow-map li>span,.process-map li>span{grid-row:1/3}.process-map .bezel-core>p{text-align:left}
  .actions-equal,.course-roadmap{grid-template-columns:1fr}.state-band{margin-top:18px}.state-band time{width:100%}
  .offer-price{font-size:3.75rem}.offer-price small{font-size:.68rem}.roadmap-card{min-height:225px}
}

/* ============================================================
   MOTION LAYER · 2026-08-31 · vanilla CSS only (CSP: style-src 'self')
   Signature: "se hace visible lo oculto" — scan sweep + process line
   drawn on scroll. All gated behind .motion-ready (JS-added, only when
   prefers-reduced-motion is NOT reduce). No JS / reduced-motion => final
   state visible. GPU-only (transform / opacity). No content changes.
   ============================================================ */

:root{
  --ease-out:cubic-bezier(.16,1,.3,1);        /* smooth deceleration */
  --ease-spring:cubic-bezier(.34,1.56,.64,1); /* gentle overshoot */
  --ease-inout:cubic-bezier(.76,0,.24,1);
}

/* ---- Base contract: without .motion-ready everything is at rest state.
   .motion-ready is ONLY set by site.js when motion is allowed. ---- */

/* ---------- 1. HERO: staggered spring-in (no text splitting) ---------- */
/* We reuse existing .threshold-copy / .page-hero children as reveal units
   via [data-hero] markers. Final state = no transform, full opacity. */
.motion-ready [data-hero]{opacity:0;transform:translateY(26px)}
.motion-ready [data-hero].is-in{
  opacity:1;transform:none;
  transition:opacity .8s var(--ease-out),transform .9s var(--ease-spring);
}
.motion-ready [data-hero][data-hero="1"].is-in{transition-delay:.05s}
.motion-ready [data-hero][data-hero="2"].is-in{transition-delay:.14s}
.motion-ready [data-hero][data-hero="3"].is-in{transition-delay:.24s}
.motion-ready [data-hero][data-hero="4"].is-in{transition-delay:.34s}

/* ---------- 2. SIGNATURE SCAN sweep across the glyph ---------- */
/* Encodes "exposure made visible": a faint horizontal light band that
   passes over the mark once on load, then rests. Very restrained. */
.motion-ready .threshold-mark,.motion-ready .brand img{position:relative}
.motion-ready .threshold-mark{
  -webkit-mask:linear-gradient(#000,#000);mask:linear-gradient(#000,#000);
}
.motion-ready .scan-glyph{position:relative;display:inline-block;isolation:isolate}
.motion-ready .scan-glyph::after{
  content:"";position:absolute;inset:-2px;border-radius:50%;pointer-events:none;z-index:2;
  background:linear-gradient(105deg,transparent 38%,rgba(94,234,212,.55) 50%,transparent 62%);
  mix-blend-mode:screen;opacity:0;
  transform:translateX(-120%);
  animation:scan-sweep 2.6s .5s var(--ease-inout) 1 both;
}
@keyframes scan-sweep{
  0%{opacity:0;transform:translateX(-120%)}
  12%{opacity:1}
  60%{opacity:.9}
  100%{opacity:0;transform:translateX(120%)}
}
/* ambient radar ring that breathes once, then holds (secondary action) */
.motion-ready .scan-glyph::before{
  content:"";position:absolute;inset:-9px;border-radius:50%;z-index:0;pointer-events:none;
  box-shadow:0 0 0 1px rgba(13,148,136,.35);
  opacity:0;transform:scale(.75);
  animation:radar-arrival 1.2s .2s var(--ease-spring) 1 both;
}
@keyframes radar-arrival{
  0%{opacity:0;transform:scale(.6)}
  55%{opacity:.55}
  100%{opacity:.28;transform:scale(1)}
}

/* ---------- 3. INTENT CARDS: pointer tilt + lift + border glow ---------- */
/* JS sets --mx/--my (-1..1) on hover for the tilt; CSS does the rest.
   Defaults keep the card flat when JS/pointer absent. */
.intent-card{--mx:0;--my:0}
.motion-ready .intent-card{
  transform:perspective(1200px) translateY(0) rotateX(calc(var(--my)*-3deg)) rotateY(calc(var(--mx)*3.4deg));
  transition:transform .5s var(--ease-out);
  will-change:transform;
}
.motion-ready .intent-card:hover{
  transform:perspective(1200px) translateY(-10px) rotateX(calc(var(--my)*-3.4deg)) rotateY(calc(var(--mx)*4deg));
}
.motion-ready .intent-card .bezel-core{transition:box-shadow .5s var(--ease-out)}
.motion-ready .intent-card:hover .bezel-core{
  box-shadow:inset 0 0 0 1px rgba(13,148,136,.5),0 26px 70px rgba(13,148,136,.14),0 1px 0 rgba(255,255,255,.9)
}
.motion-ready .intent-card.knowledge:hover .bezel-core{
  box-shadow:inset 0 0 0 1px rgba(29,109,145,.5),0 26px 70px rgba(29,109,145,.14),0 1px 0 rgba(255,255,255,.9)
}
/* keep focus ring untouched by tilt (accessibility) */
.intent-card:focus-visible{transform:none}

/* ---------- 4. PROCESS LINE drawn on scroll (SIGNATURE) ---------- */
/* JS drives --draw 0..1 on .flow-map/.process-map as it scrolls through.
   The connecting rule scales-X from origin; nodes pop in sequence; a mint
   "signal" pulse travels the drawn segment. Static fallback = fully drawn. */
.flow-map .bezel-core,.process-map .bezel-core{--draw:1}
.motion-ready .flow-map .bezel-core,.motion-ready .process-map .bezel-core{--draw:0}

.motion-ready .flow-map ol::before,.motion-ready .process-map ol::before{
  transform:scaleX(var(--draw));transform-origin:left center;
  transition:transform .1s linear;
}
/* traveling signal head riding the drawn line (left = 8% + draw*84%) */
.motion-ready .flow-map ol::after,.motion-ready .process-map ol::after{
  content:"";position:absolute;top:25px;width:14px;height:14px;margin:-7px 0 0 -7px;
  left:calc(8% + var(--draw) * 84%);
  border-radius:50%;background:var(--mint);
  box-shadow:0 0 0 4px rgba(94,234,212,.28),0 0 16px rgba(94,234,212,.8);
  opacity:calc(var(--draw) * (1 - var(--draw)) * 4);      /* fades in mid-draw, out at ends */
  transition:left .1s linear,opacity .1s linear;
  pointer-events:none;
}

/* nodes pop in sequence as the line reaches them */
.motion-ready .flow-map li,.motion-ready .process-map li{opacity:.28;transform:translateY(10px) scale(.94)}
.motion-ready .flow-map li.lit,.motion-ready .process-map li.lit{
  opacity:1;transform:none;
  transition:opacity .5s var(--ease-out),transform .55s var(--ease-spring);
}
.motion-ready .flow-map li>span,.motion-ready .process-map li>span{transition:box-shadow .45s var(--ease-out),transform .45s var(--ease-spring)}
.motion-ready .flow-map li.lit>span,.motion-ready .process-map li.lit>span{
  box-shadow:0 0 0 8px var(--white),0 10px 26px rgba(13,148,136,.22)
}
/* one gentle pulse on the node that just lit (follow-through) */
.motion-ready .flow-map li.pulse>span,.motion-ready .process-map li.pulse>span{
  animation:node-pulse .7s var(--ease-out) 1}
@keyframes node-pulse{
  0%{box-shadow:0 0 0 8px var(--white),0 0 0 8px rgba(94,234,212,.55)}
  100%{box-shadow:0 0 0 8px var(--white),0 0 0 20px rgba(94,234,212,0)}
}
/* mobile: line becomes vertical (base rule) — keep it fully visible and
   skip the horizontal scaleX draw + traveling signal; nodes still light
   in sequence as the reader scrolls (works with the vertical layout). */
@media(max-width:760px){
  .motion-ready .flow-map ol::before,.motion-ready .process-map ol::before{transform:none}
  .motion-ready .flow-map ol::after,.motion-ready .process-map ol::after{display:none}
}

/* ---------- 5. SCROLL-REVEAL (enrich existing .reveal) ---------- */
/* existing rule handles base; we add a per-child stagger inside grids so
   cards flow in rather than snapping together. Uses --i set by JS. */
.motion-ready .stagger>*{opacity:0;transform:translateY(30px)}
.motion-ready .stagger.is-visible>*{
  opacity:1;transform:none;
  transition:opacity .7s var(--ease-out),transform .8s var(--ease-out);
  transition-delay:calc(var(--i,0) * 70ms);
}

/* ---------- 6. MICRO-INTERACTIONS ---------- */
/* nav underline grow */
.motion-ready .nav-links>a:not(.nav-cta){position:relative}
.motion-ready .nav-links>a:not(.nav-cta)::after{
  content:"";position:absolute;left:14px;right:14px;bottom:7px;height:1.5px;border-radius:2px;
  background:var(--teal);transform:scaleX(0);transform-origin:left;opacity:.85;
  transition:transform .4s var(--ease-out);
}
.motion-ready .nav-links>a:not(.nav-cta):hover::after,
.motion-ready .nav-links>a:not(.nav-cta)[aria-current=page]::after{transform:scaleX(1)}

/* magnetic buttons — JS sets --bx/--by (px), spring-damped */
.button-primary,.nav-cta{--bx:0;--by:0}
.motion-ready .button-primary,.motion-ready .nav-cta{
  transform:translate(var(--bx),calc(var(--by)));
  transition:transform .35s var(--ease-out),background-color .4s var(--ease-out),box-shadow .4s var(--ease-out);
}
.motion-ready .button-primary:hover{transform:translate(var(--bx),calc(var(--by) - 2px))}
.button-primary:focus-visible,.nav-cta:focus-visible{transform:none}

/* footer/link arrow nudge already in base; add on intent-action already present */

/* ---------- REDUCED MOTION / NO-JS: force final visible states ---------- */
@media(prefers-reduced-motion:reduce){
  .motion-ready [data-hero]{opacity:1!important;transform:none!important}
  .motion-ready .stagger>*{opacity:1!important;transform:none!important}
  .motion-ready .flow-map li,.motion-ready .process-map li{opacity:1!important;transform:none!important}
  .motion-ready .flow-map .bezel-core,.motion-ready .process-map .bezel-core{--draw:1}
  .motion-ready .scan-glyph::after,.motion-ready .scan-glyph::before{animation:none!important;opacity:0!important}
  .motion-ready .flow-map ol::after,.motion-ready .process-map ol::after{opacity:0!important}
  .motion-ready .intent-card{transform:none!important}
}

/* ============================================================
   ACADEMY REFRAME · 2026-08-31 · cert-prep + resources-center
   Additive only — new classes, no existing selector changed. Reused
   across academy.html only. Motion gated behind .motion-ready; no-JS /
   reduced-motion => final resting state. GPU-only (transform/opacity).
   CSP-safe: lives in this external stylesheet, no inline styles.
   ============================================================ */

/* ---- Console rack: the resources center as a rack of study consoles ---- */
.console-rack{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.console-card{min-height:270px}
.console-card .bezel-core{display:flex;flex-direction:column;padding:31px}
.console-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.console-meta{color:var(--quiet);font:.62rem var(--mono);letter-spacing:.06em;text-transform:uppercase}
.console-card h3{margin:26px 0 12px}
.console-card p{color:var(--muted);font-size:.92rem}
.console-facts{display:flex;flex-wrap:wrap;gap:18px;margin:20px 0 0;padding:20px 0 0;border-top:1px solid var(--line);list-style:none}
.console-facts li{color:var(--quiet);font:.72rem var(--mono)}
.console-facts b{display:block;font-family:var(--display);font-size:1.25rem;font-weight:700;letter-spacing:-.04em;color:var(--ink)}
.console-status{margin-top:auto;padding-top:20px;color:var(--quiet);font:.67rem var(--mono);letter-spacing:.04em}
.console-link{margin-top:auto;padding-top:20px;display:inline-flex;align-items:center;gap:8px;color:var(--teal-dark);font-weight:700;font-size:.9rem;text-decoration:none}
.console-link span{transition:transform .5s var(--curve)}
.console-link:hover span{transform:translateX(4px)}
/* READY (Falcon) is the signature card: faint scanline texture + teal edge */
.console-ready .bezel-core{position:relative;overflow:hidden;background:linear-gradient(rgba(94,234,212,.05),rgba(255,255,255,.94) 40%),rgba(255,255,255,.94);box-shadow:inset 0 0 0 1px rgba(13,148,136,.24),inset 0 1px 0 rgba(255,255,255,.95),0 20px 65px rgba(13,148,136,.08)}
.console-ready .bezel-core::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background:repeating-linear-gradient(0deg,rgba(13,148,136,.05) 0,rgba(13,148,136,.05) 1px,transparent 1px,transparent 5px);mask:linear-gradient(#000,transparent 55%);-webkit-mask:linear-gradient(#000,transparent 55%)}
.console-ready .console-facts b{color:var(--teal-dark)}

/* status pills */
.pill-live,.pill-prep{width:max-content;display:inline-flex;align-items:center;gap:7px;padding:6px 10px 6px 9px;border-radius:999px;font:700 .62rem var(--mono);letter-spacing:.06em;text-transform:uppercase}
.pill-live{background:var(--soft-teal);color:var(--teal-dark)}
.pill-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(13,148,136,.18)}
.pill-prep{background:var(--soft-blue);color:var(--blue)}
.pill-prep::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5}
.rack-note{max-width:760px;margin:26px auto 0;color:var(--quiet);font:.74rem/1.6 var(--mono);text-align:center}

/* ---- Official free resources: link clusters + tool strip ---- */
.resource-cluster{margin-top:18px}
.resource-cluster:first-of-type{margin-top:0}
.resource-title{margin:0 0 16px;font-size:1.2rem}
.resource-links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0;padding:0;list-style:none}
.resource-links a{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 17px;border-radius:16px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .5s var(--curve),box-shadow .5s var(--curve),color .5s var(--curve)}
.resource-links a span{color:var(--quiet);transition:transform .5s var(--curve),color .5s var(--curve)}
.resource-links a:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(13,148,136,.35),0 14px 34px rgba(13,148,136,.09);color:var(--teal-dark)}
.resource-links a:hover span{transform:translate(3px,-2px);color:var(--teal-dark)}
.tool-strip{margin-top:22px}
.tool-strip .bezel-core{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:clamp(28px,4vw,44px);background:radial-gradient(circle at 92% 20%,rgba(94,234,212,.14),transparent 15rem),rgba(255,255,255,.94)}
.tool-strip h3{margin:14px 0 10px;font-size:1.7rem}
.tool-strip p{max-width:560px;margin:0;color:var(--muted);font-size:.94rem}
.tool-strip-action{flex:0 0 auto}

@media(max-width:920px){.console-rack{grid-template-columns:1fr 1fr}.resource-links{grid-template-columns:1fr 1fr}.tool-strip .bezel-core{flex-direction:column;align-items:flex-start}}
@media(max-width:760px){.console-rack{grid-template-columns:1fr}.resource-links{grid-template-columns:1fr}.console-card{min-height:auto}.rack-note{text-align:left}}

/* ---- Immersion motion (restrained, GPU-only, .motion-ready gated) ---- */
/* console cards join the existing .stagger reveal via site.js (grid selector
   extended). Here: hover lift + edge glow on the READY signature card, and a
   single slow ambient pulse on the live status dot (communicates real status;
   kept very subtle per web-motion-design; killed under reduced-motion). */
.motion-ready .console-card{transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.motion-ready .console-card:hover{transform:translateY(-6px)}
.motion-ready .console-ready:hover .bezel-core{box-shadow:inset 0 0 0 1px rgba(13,148,136,.5),0 26px 70px rgba(13,148,136,.15),inset 0 1px 0 rgba(255,255,255,.95)}
.motion-ready [data-live]::before{animation:live-breathe 2.6s var(--ease-inout) infinite}
@keyframes live-breathe{0%,100%{box-shadow:0 0 0 3px rgba(13,148,136,.10)}50%{box-shadow:0 0 0 5px rgba(13,148,136,.22)}}
.motion-ready .tool-strip{transition:transform .5s var(--ease-out)}
.motion-ready .tool-strip:hover{transform:translateY(-3px)}

@media(prefers-reduced-motion:reduce){
  .motion-ready [data-live]::before{animation:none!important}
  .motion-ready .console-card,.motion-ready .tool-strip{transform:none!important}
}

/* ============================================================
   AUTHORITY + VALUE LAYER · 2026-08-31 · vanilla CSS only
   Purpose (Pablo): raise VALUE + AUTHORITY, lower sobriety with class.
   Method: introduce ONE signature dark moment per page that breaks the
   uniform-white flatness (the "authority slab"), plus a tangible value
   visual. Additive only — new classes, zero existing selector changed.
   Reuses the existing token system + bezel language. Dark-on-ink slab
   keeps the security-brand register (refined, not gaudy). Motion gated
   behind .motion-ready; no-JS / reduced-motion => final resting state.
   GPU-only (transform/opacity). CSP-safe (external sheet, no inline).
   ============================================================ */

/* ---- The authority slab: a deep ink section that anchors the page ---- */
.authority{position:relative;overflow:clip;padding:clamp(84px,10vw,140px) 0;background:#0a0d12;color:#e7eef2}
.authority:before{position:absolute;inset:0;z-index:0;pointer-events:none;content:"";
  background:
    radial-gradient(circle at 82% 8%,rgba(94,234,212,.16),transparent 34%),
    radial-gradient(circle at 6% 92%,rgba(29,109,145,.20),transparent 40%),
    linear-gradient(#0a0d12,#0a0d12)}
/* faint scan grid (the "made visible" motif) — very restrained, static */
.authority:after{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;content:"";
  background:repeating-linear-gradient(0deg,rgba(94,234,212,.045) 0,rgba(94,234,212,.045) 1px,transparent 1px,transparent 46px);
  mask:radial-gradient(circle at 50% 30%,#000,transparent 78%);-webkit-mask:radial-gradient(circle at 50% 30%,#000,transparent 78%)}
.authority .wrap{position:relative;z-index:1}
.authority .kicker,.authority .eyebrow{color:var(--mint)}
.authority h2{color:#fff;font-size:clamp(2.4rem,4.8vw,4.6rem)}
.authority-head{max-width:840px;margin-bottom:56px}
.authority-head p{max-width:660px;color:#a9b8c2;font-size:1.1rem}

/* profile + method as an asymmetric split (not centered-generic) */
.authority-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(20px,3vw,34px);align-items:start}

/* the operator card — dark bezel variant, teal signature edge */
.operator{position:relative;border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(160deg,rgba(94,234,212,.08),rgba(255,255,255,.02) 46%),rgba(255,255,255,.035);
  box-shadow:inset 0 0 0 1px rgba(94,234,212,.22),inset 0 1px 0 rgba(255,255,255,.06),0 30px 80px rgba(0,0,0,.4);
  padding:clamp(30px,3.6vw,44px)}
/* signature corner glyph on the operator card */
.operator:before{position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;content:"";pointer-events:none;
  background:radial-gradient(circle,rgba(94,234,212,.14),transparent 68%)}
.op-top{position:relative;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin-bottom:22px}
.op-avatar{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;
  background:linear-gradient(150deg,rgba(94,234,212,.22),rgba(29,109,145,.28));
  box-shadow:inset 0 0 0 1px rgba(94,234,212,.4),0 12px 30px rgba(0,0,0,.35)}
.op-avatar b{font-family:var(--display);font-size:1.5rem;font-weight:740;letter-spacing:-.03em;color:#effefb}
.operator .op-mark{display:inline-flex;align-items:center;gap:9px;color:var(--mint);font:650 .66rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
.operator .op-mark span{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(94,234,212,.18)}
.op-id h3{margin:9px 0 4px;color:#fff;font-size:clamp(1.7rem,2.4vw,2.2rem)}
.operator .op-role{margin:0;color:var(--mint);font:600 .8rem var(--mono);letter-spacing:.01em}
.operator .op-bio{margin:0 0 24px;color:#c2cfd8;font-size:.98rem}
.operator .op-bio b{color:#fff;font-weight:700}
.op-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:0 0 24px;padding:0;list-style:none;background:rgba(255,255,255,.09);border-radius:16px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.09)}
.op-facts li{padding:17px 14px;background:#0c1017;text-align:center}
.op-facts b{display:block;font-family:var(--display);font-size:1.55rem;font-weight:720;letter-spacing:-.04em;color:var(--mint);line-height:1}
.op-facts small{display:block;margin-top:6px;color:#9fb0bb;font-size:.7rem;line-height:1.3}
.op-context{margin:0 0 13px;color:#9fb0bb;font-size:.86rem}
.op-sectors{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 24px}
.op-sectors span{padding:6px 12px;border-radius:999px;background:rgba(94,234,212,.09);color:#bfeee4;font:600 .7rem var(--mono);box-shadow:inset 0 0 0 1px rgba(94,234,212,.18)}
.op-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:22px;border-top:1px solid rgba(255,255,255,.09)}
.op-link{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:6px 7px 6px 18px;border-radius:999px;background:#fff;color:var(--ink);font-weight:700;font-size:.88rem;text-decoration:none;transition:transform .5s var(--curve),box-shadow .5s var(--curve)}
.op-link i{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:rgba(10,13,18,.08);font-style:normal}
.op-link:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(0,0,0,.35)}
.op-infra{display:inline-flex;align-items:center;gap:8px;color:#8ea0ab;font:.72rem var(--mono)}
.op-infra i{width:7px;height:7px;border-radius:50%;background:var(--mint);opacity:.7}

/* method column: the differential authority (multilayer + evidence) */
.method{display:grid;gap:12px;align-content:start}
.method-eyebrow{margin:0 0 4px;color:var(--mint);font:650 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase}
.method-line{position:relative;display:grid;grid-template-columns:46px 1fr;gap:18px;padding:22px;border-radius:22px;
  background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.method-line .m-no{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:rgba(94,234,212,.1);color:var(--mint);font:720 .9rem var(--display);letter-spacing:-.02em;box-shadow:inset 0 0 0 1px rgba(94,234,212,.24)}
.method-line h4{margin:2px 0 7px;color:#fff;font-family:var(--display);font-size:1.24rem;font-weight:640;letter-spacing:-.02em}
.method-line p{margin:0;color:#a9b8c2;font-size:.92rem}
/* the evidence funnel: the "143 observations to 3 findings" method sample */
.funnel{margin:4px 0 0;padding:26px clamp(22px,3.4vw,40px);border-radius:22px;
  background:linear-gradient(120deg,rgba(29,109,145,.16),rgba(94,234,212,.06));box-shadow:inset 0 0 0 1px rgba(94,234,212,.22)}
.funnel-viz{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(12px,2.4vw,30px)}
.funnel-step{text-align:center}
.funnel-step b{display:block;font-family:var(--display);font-size:clamp(1.9rem,3.2vw,2.9rem);font-weight:740;letter-spacing:-.05em;line-height:1;color:#e7eef2}
.funnel-step.is-signal b{color:var(--mint)}
.funnel-step small{display:block;margin-top:8px;color:#9fb0bb;font:.66rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase}
/* the flow: three narrowing dashes that visualise distillation */
.funnel-flow{display:grid;gap:5px;justify-items:center;color:var(--mint)}
.funnel-flow i{height:3px;border-radius:2px;background:linear-gradient(90deg,rgba(94,234,212,.35),var(--mint));display:block}
.funnel-flow i:nth-child(1){width:46px;opacity:.5}
.funnel-flow i:nth-child(2){width:32px;opacity:.75}
.funnel-flow i:nth-child(3){width:18px;opacity:1}
.funnel-note{margin:18px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);color:#8ea0ab;font:.72rem/1.6 var(--mono)}

/* principles ribbon under the split */
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:34px;background:rgba(255,255,255,.09);border-radius:20px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.09)}
.principles li{list-style:none;padding:26px 28px;background:#0c1017}
.principles strong{display:block;margin-bottom:8px;color:#fff;font-size:1.05rem}
.principles span{color:#9fb0bb;font-size:.86rem}
.principles li:before{content:attr(data-p);display:block;margin-bottom:14px;color:var(--mint);font:700 .66rem var(--mono);letter-spacing:.12em}
.systems{margin-top:40px;padding-top:36px;border-top:1px solid rgba(255,255,255,.09)}
.systems-eyebrow{margin:0 0 12px;color:var(--mint);font:650 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase}
.systems-frame{max-width:720px;margin:0 0 26px;color:#a9b8c2;font-size:1rem}
.systems-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:0;padding:0;list-style:none;background:rgba(255,255,255,.09);border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.09)}
.systems-grid li{padding:20px 20px 21px;background:#0c1017}
.systems-grid b{display:block;font-family:var(--display);font-size:1.12rem;font-weight:680;letter-spacing:-.03em;color:#fff;line-height:1.05}
.systems-grid small{display:block;margin-top:7px;color:#9fb0bb;font-size:.78rem;line-height:1.34}

/* ---- VALUE: the "what you leave with" deliverable strip (risk-facing) ---- */
.outcome{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.outcome-card{position:relative;display:flex;flex-direction:column;padding:30px;border-radius:24px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.outcome-card .oc-no{color:var(--teal-dark);font:700 .68rem var(--mono);letter-spacing:.1em}
.outcome-card h3{margin:18px 0 10px;font-size:1.4rem}
.outcome-card p{margin:0;color:var(--muted);font-size:.92rem}
.outcome-card .oc-tag{margin-top:auto;padding-top:20px;color:var(--quiet);font:.68rem var(--mono);letter-spacing:.03em}
.outcome-card.oc-lead{background:radial-gradient(circle at 88% 12%,rgba(94,234,212,.16),transparent 14rem),#0a0d12;color:#e7eef2;box-shadow:inset 0 0 0 1px rgba(94,234,212,.22)}
.outcome-card.oc-lead .oc-no{color:var(--mint)}
.outcome-card.oc-lead h3{color:#fff}
.outcome-card.oc-lead p{color:#a9b8c2}
.outcome-card.oc-lead .oc-plan{margin-top:22px;display:grid;gap:7px}
.oc-plan-row{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;font:.74rem var(--mono);color:#bfeee4}
.oc-plan-row span{width:20px;height:20px;display:grid;place-items:center;border-radius:6px;background:rgba(94,234,212,.14);color:var(--mint);font-size:.62rem}

/* ---- VALUE: elevated tool feature (¿Me Afecta? as proof) ---- */
.tool-strip.tool-proof .bezel-core{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:clamp(28px,4vw,52px);background:linear-gradient(120deg,rgba(94,234,212,.1),transparent 45%),#0a0d12;color:#e7eef2}
.tool-strip.tool-proof .status{color:var(--mint)}
.tool-strip.tool-proof h3{color:#fff}
.tool-strip.tool-proof .tool-proof-copy p{color:#a9b8c2}
.tool-strip.tool-proof .button-soft{background:var(--mint);color:var(--ink);box-shadow:none}
.tool-strip.tool-proof .button-soft .button-icon{background:rgba(10,13,18,.12)}
.tool-strip.tool-proof .tool-strip-action{margin-top:22px}
/* priority visual: three severity tiers as a stack, communicates the method */
.prio-viz{display:grid;gap:9px}
.prio-row{position:relative;display:flex;flex-direction:column;gap:2px;padding:14px 16px 14px 20px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.prio-row:before{position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:0 3px 3px 0;content:""}
.prio-row b{color:#fff;font-size:.92rem;font-weight:640}
.prio-row small{color:#93a4af;font:.66rem var(--mono);letter-spacing:.02em}
.prio-hi{background:linear-gradient(90deg,rgba(94,234,212,.14),rgba(255,255,255,.03) 55%)}
.prio-hi:before{background:var(--mint);box-shadow:0 0 12px rgba(94,234,212,.6)}
.prio-hi b{color:var(--mint)}
.prio-mid:before{background:var(--sky);opacity:.85}
.prio-lo:before{background:rgba(159,176,187,.5)}
.prio-lo{opacity:.82}

/* ---- hero signature radar: concentric scan rings around the mark ---- */
.threshold-radar{position:relative;display:inline-grid;place-items:center;width:132px;height:132px;margin:0 auto 26px}
.threshold-radar .threshold-mark{position:relative;z-index:2;margin:0}
.threshold-radar i{position:absolute;border-radius:50%;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(13,148,136,.28)}
.threshold-radar i:nth-child(1){inset:16px;box-shadow:inset 0 0 0 1px rgba(13,148,136,.34)}
.threshold-radar i:nth-child(2){inset:2px;box-shadow:inset 0 0 0 1px rgba(13,148,136,.2)}
.threshold-radar i:nth-child(3){inset:-14px;box-shadow:inset 0 0 0 1px rgba(13,148,136,.1);background:radial-gradient(circle,rgba(94,234,212,.08),transparent 62%)}
.motion-ready .threshold-radar i:nth-child(3){animation:radar-ping 3.4s var(--ease-out) infinite}
@keyframes radar-ping{0%{transform:scale(.92);opacity:.9}70%{transform:scale(1.14);opacity:0}100%{opacity:0}}

/* ---- responsive ---- */
@media(max-width:920px){
  .authority-grid{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr}
  .outcome{grid-template-columns:1fr}
  .op-facts{grid-template-columns:repeat(2,1fr)}
  .systems-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .funnel{padding:22px}
  .funnel-viz{gap:14px}
  .systems-grid{grid-template-columns:1fr}
  .op-sectors span{font-size:.64rem}
  .op-top{grid-template-columns:auto 1fr;gap:14px}
  .op-avatar{width:54px;height:54px;border-radius:16px}
  .op-avatar b{font-size:1.25rem}
  .op-foot{flex-direction:column;align-items:flex-start;gap:12px}
  .method-line{grid-template-columns:40px 1fr;gap:13px;padding:18px}
  .method-line .m-no{width:40px;height:40px}
  .threshold-radar{width:112px;height:112px;margin-bottom:16px}
  .tool-strip.tool-proof .bezel-core{grid-template-columns:1fr;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.motion-ready .threshold-radar i:nth-child(3){animation:none!important}}

/* ---- motion (gated, GPU-only, reduced-motion => final state) ---- */
.motion-ready .operator,.motion-ready .method-line,.motion-ready .outcome-card{will-change:transform}
.motion-ready .op-link{transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.motion-ready .funnel-step b{transition:transform .5s var(--ease-spring)}
.motion-ready .authority.is-visible .funnel-step.is-signal b{animation:signal-pop .9s .3s var(--ease-spring) both}
@keyframes signal-pop{0%{transform:scale(.6);opacity:.2}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
.motion-ready .outcome-card{transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.motion-ready .outcome-card:hover{transform:translateY(-5px)}
.motion-ready .method-line{transition:box-shadow .45s var(--ease-out),transform .45s var(--ease-out)}
.motion-ready .method-line:hover{box-shadow:inset 0 0 0 1px rgba(94,234,212,.3);transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){
  .motion-ready .authority .funnel-step.is-signal b{animation:none!important}
  .motion-ready .outcome-card,.motion-ready .method-line{transform:none!important}
}

/* ============================================================
   HERO FIELD · 2026-08-31 · signature moment (the strongest viewport)
   Purpose (Pablo): raise the hero to Awwwards bar. A deep exposure
   field (WebGL, lazy) sits behind the copy; a static poster is the
   first frame and the no-JS / reduced-motion / no-WebGL fallback.
   The interactive "exposure report" example lives to the right.
   Dark-tech register on an ink stage that breaks the uniform white.
   Additive only; token system reused. GPU-only motion; a11y AA.
   ============================================================ */
.hero-field{position:relative;isolation:isolate;overflow:clip;min-height:100dvh;display:grid;align-items:start;padding:clamp(96px,11vh,124px) 0 clamp(52px,6vh,80px);background:#080b10;color:#eaf1f4}
/* the static poster: a hand-tuned field of light that matches the WebGL
   idea (concentric scan + surfaced points). It IS the first frame and the
   permanent fallback. Radial scan rings + dotted signal field, no JS. */
.hero-canvas,.hero-canvas-poster{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.hero-canvas{opacity:0;transition:opacity 1.1s var(--ease-out)}
.hero-field.webgl-live .hero-canvas{opacity:1}
.hero-field.webgl-live .hero-canvas-poster{opacity:.35}
.hero-canvas-poster{
  background:
    radial-gradient(circle at 68% 42%,rgba(94,234,212,.16),transparent 30%),
    radial-gradient(circle at 68% 42%,transparent 12%,rgba(13,148,136,.14) 12.4%,transparent 13%),
    radial-gradient(circle at 68% 42%,transparent 20%,rgba(13,148,136,.10) 20.4%,transparent 21%),
    radial-gradient(circle at 68% 42%,transparent 29%,rgba(13,148,136,.07) 29.4%,transparent 30%),
    radial-gradient(circle at 12% 88%,rgba(29,109,145,.22),transparent 42%),
    radial-gradient(circle at 90% 8%,rgba(125,211,252,.10),transparent 34%),
    #080b10;
  transition:opacity 1.1s var(--ease-out)}
/* a faint dotted "signal" grain over the poster, static, cheap */
.hero-canvas-poster::after{content:"";position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(125,211,252,.18) 1px,transparent 1.4px);
  background-size:34px 34px;
  mask:radial-gradient(circle at 62% 45%,#000,transparent 72%);
  -webkit-mask:radial-gradient(circle at 62% 45%,#000,transparent 72%)}
/* vignette so copy stays legible over whatever the field does */
.hero-field::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,rgba(8,11,16,.92) 30%,rgba(8,11,16,.55) 52%,rgba(8,11,16,.15) 100%)}
@media(max-width:920px){.hero-field::after{background:linear-gradient(180deg,rgba(8,11,16,.72),rgba(8,11,16,.9) 55%)}}

.hero-field-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,5vw,72px);align-items:start}
.hero-copy{max-width:640px}
.hero-field .eyebrow{color:var(--mint)}
.hero-field h1{margin:20px 0 22px;font-size:clamp(3rem,5.6vw,5.6rem);color:#fff;line-height:.96}
.hero-accent{position:relative;color:var(--mint);white-space:nowrap}
.hero-accent::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.5px;background:linear-gradient(90deg,var(--mint),transparent)}
.hero-field .lead{max-width:540px;color:#b3c2cc;font-size:clamp(1.05rem,1.6vw,1.24rem)}
.hero-cta{margin-top:30px}
.hero-field .button-soft{background:rgba(255,255,255,.06);color:#eaf1f4;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.hero-field .button-soft .button-icon{background:rgba(255,255,255,.1)}
.hero-field .button-primary{background:var(--mint);color:#04201c;box-shadow:0 14px 34px rgba(13,148,136,.28)}
.hero-field .button-primary .button-icon{background:rgba(4,32,28,.14)}
.hero-microstate{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:26px 0 0;color:#8ea0ab;font:.72rem/1.5 var(--mono);letter-spacing:.02em}
.live-dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(94,234,212,.16)}
.motion-ready .live-dot{animation:live-breathe 2.6s var(--ease-inout) infinite}

/* ---- the exposure report demo (interactive example) ---- */
.report-demo{width:100%}
.report-demo .bezel-core{padding:clamp(22px,2.6vw,32px);background:linear-gradient(165deg,rgba(94,234,212,.06),rgba(255,255,255,.02) 44%),rgba(12,17,24,.86);box-shadow:inset 0 0 0 1px rgba(94,234,212,.18),inset 0 1px 0 rgba(255,255,255,.05),0 30px 80px rgba(0,0,0,.45);backdrop-filter:blur(8px)}
.report-demo{border-radius:calc(var(--radius) + 7px);background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.report-demo-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.report-tag{display:inline-flex;align-items:center;gap:8px;color:var(--mint);font:700 .62rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.report-meta{color:#8ea0ab;font:.62rem var(--mono);letter-spacing:.06em;text-transform:uppercase}
.report-demo h2{margin:16px 0 8px;color:#fff;font-size:clamp(1.7rem,2.6vw,2.3rem);letter-spacing:-.04em}
.report-demo-sub{margin:0 0 18px;color:#9fb0bb;font-size:.9rem;line-height:1.5}
.report-input-row{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px;border-radius:16px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .4s var(--ease-out)}
.report-input-row:focus-within{box-shadow:inset 0 0 0 1px rgba(94,234,212,.55),0 0 0 4px rgba(94,234,212,.12)}
.report-input-icon{flex:0 0 auto;display:grid;place-items:center;color:var(--mint);opacity:.8}
.report-input-icon svg{width:18px;height:18px}
.report-input{flex:1;min-width:0;min-height:46px;border:0;background:transparent;color:#fff;font:600 .95rem var(--body);outline:none}
.report-input::placeholder{color:#71808e}
.report-run{flex:0 0 auto;min-height:44px;display:inline-flex;align-items:center;padding:0 8px 0 16px;border:0;border-radius:12px;background:var(--mint);color:#04201c;font:700 .85rem var(--body);cursor:pointer;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out)}
.report-run .button-icon{background:rgba(4,32,28,.16)}
.motion-ready .report-run:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(13,148,136,.32)}
.report-run:active{transform:scale(.98)}
.report-disclaimer{margin:16px 0 0;color:#7f909b;font:.66rem/1.55 var(--mono);letter-spacing:.01em}

/* result card */
.report-out{margin-top:18px}
.report-card{border-radius:20px;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);overflow:hidden;outline:none}
.report-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.08)}
.report-scope{color:#c2cfd8;font:.72rem var(--mono);letter-spacing:.02em}
.report-scope b{color:#fff}
.report-badge{padding:5px 9px;border-radius:999px;background:rgba(94,234,212,.12);color:var(--mint);font:700 .58rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.report-band{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.report-scanned{text-align:center;padding-right:16px;border-right:1px solid rgba(255,255,255,.08)}
.report-scanned b{display:block;font-family:var(--display);font-size:1.7rem;font-weight:740;letter-spacing:-.04em;color:#eaf1f4;line-height:1}
.report-scanned small{display:block;margin-top:5px;color:#8ea0ab;font:.6rem var(--mono);text-transform:uppercase;letter-spacing:.05em}
.report-sev-mix{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.report-sev-mix .mix{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:11px;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.report-sev-mix .mix b{font-family:var(--display);font-size:1.2rem;font-weight:720;letter-spacing:-.03em;line-height:1}
.report-sev-mix .mix{color:#8ea0ab;font:.58rem var(--mono);text-transform:uppercase;letter-spacing:.04em}
.mix-hi{box-shadow:inset 0 0 0 1px rgba(94,234,212,.3)!important}.mix-hi b{color:var(--mint)}
.mix-mid b{color:var(--sky)}.mix-lo b{color:#9fb0bb}

.findings{margin:0;padding:6px;list-style:none;display:grid;gap:6px}
.finding{display:grid;grid-template-columns:auto 1fr;gap:13px;padding:14px 15px;border-radius:14px;background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.finding-sev{align-self:start;padding:5px 9px;border-radius:8px;font:700 .58rem var(--mono);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.finding.sev-hi{box-shadow:inset 0 0 0 1px rgba(94,234,212,.24)}
.finding.sev-hi .finding-sev{background:rgba(94,234,212,.16);color:var(--mint)}
.finding.sev-mid .finding-sev{background:rgba(125,211,252,.14);color:var(--sky)}
.finding.sev-lo .finding-sev{background:rgba(159,176,187,.12);color:#9fb0bb}
.finding-top{margin-bottom:4px}
.finding-area{color:#8ea0ab;font:650 .6rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.finding h4{margin:0 0 5px;color:#fff;font-family:var(--display);font-size:1.02rem;font-weight:640;letter-spacing:-.02em}
.finding p{margin:0 0 8px;color:#a9b8c2;font-size:.83rem;line-height:1.5}
.finding-source{color:#78899a;font:.62rem var(--mono);letter-spacing:.01em}
.report-foot{padding:16px 18px;border-top:1px solid rgba(255,255,255,.08)}
.report-foot p{margin:0 0 13px;color:#9fb0bb;font-size:.82rem;line-height:1.5}
.report-cta{width:100%;justify-content:center}
.report-cta-domain{font-weight:800}

/* motion: the card flows in on render (CSS); findings stagger via WAAPI in
   report-demo.js so dynamically-injected rows animate reliably. The two do
   not overlap (card = CSS, findings = WAAPI). */
.motion-ready .report-card{animation:report-in .55s var(--ease-out) both}
@keyframes report-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* live badge: distinguishes a real DNS read from the seeded example */
.report-badge.is-live{display:inline-flex;align-items:center;gap:7px;background:rgba(94,234,212,.16);color:var(--mint)}
.report-badge.is-live .live-dot{width:6px;height:6px}
.report-card.is-live{box-shadow:inset 0 0 0 1px rgba(94,234,212,.22)}

/* the "what this is vs what needs authorization" honesty note */
.report-scope-note{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:rgba(94,234,212,.06);box-shadow:inset 0 0 0 1px rgba(94,234,212,.14);color:#a9bcc6;font-size:.78rem;line-height:1.55}
.report-scope-note b{color:#cfe0e6;font-weight:700}

/* clean state: no prioritised gaps in the public DNS */
.report-clean{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;padding:20px 18px}
.report-clean-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(94,234,212,.14);color:var(--mint)}
.report-clean-mark svg{width:22px;height:22px}
.report-clean h4{margin:0 0 5px;color:#fff;font-family:var(--display);font-size:1.05rem;font-weight:640;letter-spacing:-.02em}
.report-clean p{margin:0;color:#a9b8c2;font-size:.83rem;line-height:1.5}

/* loading state: honest "querying public DNS" with a scan bar + skeleton */
.report-loading{padding:18px}
.report-loading-head{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center}
.report-loading-head b{display:block;color:#fff;font-size:.92rem}
.report-loading-head small{display:block;margin-top:3px;color:#8ea0ab;font:.66rem var(--mono);letter-spacing:.02em}
.report-scan-bar{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(94,234,212,.1);overflow:hidden;position:relative}
.report-scan-bar i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(94,234,212,.6),transparent);transform:translateX(-100%);animation:scan-sweep 1.15s var(--ease-out) infinite}
@keyframes scan-sweep{to{transform:translateX(100%)}}
.report-skeleton{display:grid;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.report-skeleton li{height:52px;border-radius:12px;background:linear-gradient(100deg,rgba(255,255,255,.03) 30%,rgba(255,255,255,.07) 50%,rgba(255,255,255,.03) 70%);background-size:220% 100%;animation:skeleton-shimmer 1.4s linear infinite}
.report-skeleton li:nth-child(2){animation-delay:.15s}
.report-skeleton li:nth-child(3){animation-delay:.3s}
@keyframes skeleton-shimmer{to{background-position:-120% 0}}

/* error / invalid notice */
.report-notice{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:20px 18px}
.report-notice-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(125,211,252,.12);color:var(--sky);align-self:start}
.report-notice-mark svg{width:22px;height:22px}
.report-notice h4{margin:0 0 5px;color:#fff;font-family:var(--display);font-size:1.02rem;font-weight:640;letter-spacing:-.02em}
.report-notice p{margin:0 0 12px;color:#a9b8c2;font-size:.83rem;line-height:1.5}
.report-notice a{margin-top:2px}

/* the intent section, now below the hero, gets a touch of the ink edge */
.threshold-intent{padding-top:clamp(80px,10vw,130px)}

/* ---- service contract card: the mental contract in 5 seconds (Krug) ---- */
.svc-contract .bezel-core{padding:clamp(28px,4vw,44px) clamp(26px,4vw,48px);background:#0c1017;color:#e6edf2}
.svc-row{display:grid;grid-template-columns:190px 1fr;gap:24px 40px;padding:26px 0;border-top:1px solid rgba(255,255,255,.09)}
.svc-row:first-child{padding-top:0;border-top:0}
.svc-row:last-child{padding-bottom:0}
.svc-label{font:650 .68rem var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--mint);padding-top:3px}
.svc-body>p{margin:0;color:#c3cfd8;font-size:1rem;line-height:1.55;max-width:60ch}
.svc-body>p+p{margin-top:12px}
.svc-body b{color:#fff;font-weight:640}
.svc-deliver,.svc-steps{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.svc-deliver li,.svc-steps li{position:relative;padding-left:30px;color:#c3cfd8;font-size:.98rem;line-height:1.5;max-width:60ch}
.svc-deliver li:before{content:"";position:absolute;left:2px;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--mint)}
.svc-steps{counter-reset:svc}
.svc-steps li{counter-increment:svc;padding-left:38px}
.svc-steps li:before{content:counter(svc,decimal-leading-zero);position:absolute;left:0;top:0;font:650 .72rem var(--mono);color:var(--mint);letter-spacing:.02em}
.svc-expect-yes{color:#cdd8df}
.svc-expect-no{margin-top:14px!important;padding:14px 18px;border-radius:14px;background:rgba(255,255,255,.045);border-left:2px solid rgba(94,234,212,.5);color:#aeb9c2!important;font-size:.95rem!important}
.svc-row-next .svc-body .button{margin-top:16px}
.svc-next-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.svc-next-actions .button{margin-top:0}

/* ---- responsive ---- */
@media(max-width:920px){
  .hero-field{min-height:auto;padding:clamp(104px,14vh,140px) 0 64px}
  .hero-field-grid{grid-template-columns:1fr;gap:34px}
  .hero-copy{max-width:none}
  .report-demo{max-width:560px}
}
@media(max-width:760px){
  .hero-field h1{font-size:clamp(2.7rem,12vw,4rem)}
  .hero-field .lead{font-size:1rem}
  .hero-cta.actions{gap:9px}
  .report-band{grid-template-columns:1fr;gap:12px}
  .report-scanned{padding:0 0 12px;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .finding{grid-template-columns:1fr;gap:9px}
  .finding-sev{justify-self:start}
  .svc-row{grid-template-columns:1fr;gap:12px;padding:22px 0}
  .svc-label{padding-top:0}
  .svc-next-actions{flex-direction:column;align-items:stretch}
}
@media(prefers-reduced-motion:reduce){
  .hero-canvas{transition:none}
  .motion-ready .live-dot{animation:none!important}
  .motion-ready .report-card,.motion-ready .finding{animation:none!important;opacity:1!important;transform:none!important}
  .report-scan-bar i,.report-skeleton li{animation:none!important}
  .report-scan-bar i{transform:none;background:rgba(94,234,212,.35)}
}
@media(prefers-reduced-transparency:reduce){
  .report-demo .bezel-core{backdrop-filter:none;background:rgba(12,17,24,.96)}
}

/* ============================================================
   LEGAL LAYER · 2026-08-31 · footer 4-col + páginas legales
   Aditivo, tokens existentes, CSP-safe (style-src 'self').
   Publicación con nombre de empresa GhostIntel (sin NIF/CIF).
   ============================================================ */

/* footer: 3 -> 4 columnas (Recorridos · Contacto · Legal) */
.footer-main{grid-template-columns:1.25fr .8fr .8fr .7fr}
@media(max-width:920px){.footer-main{grid-template-columns:1fr 1fr;gap:34px}}
@media(max-width:760px){.footer-main{grid-template-columns:1fr;gap:30px}}

/* páginas legales: documento legible sobre el mismo sistema */
.legal-hero{padding:150px 0 8px}
.legal-hero .eyebrow{margin-bottom:16px}
.legal-hero h1{max-width:900px;font-size:clamp(2.6rem,5.4vw,4.6rem)}
.legal-hero .lead{margin-top:20px}
.legal-updated{margin-top:18px;color:var(--quiet);font:.72rem var(--mono);letter-spacing:.02em}
.legal-body{padding:44px 0 clamp(80px,10vw,130px)}
.prose{max-width:760px}
.prose section{padding:34px 0;border-top:1px solid var(--line)}
.prose section:first-child{border-top:0;padding-top:6px}
.prose h2{margin:0 0 18px;font-size:clamp(1.7rem,3vw,2.4rem);letter-spacing:-.045em}
.prose h3{margin:26px 0 10px;font-size:1.2rem}
.prose p{color:var(--muted);margin:0 0 15px}
.prose p:last-child{margin-bottom:0}
.prose a{color:var(--teal-dark);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:var(--ink)}
.prose ul{margin:0 0 15px;padding-left:20px;color:var(--muted)}
.prose li{margin:8px 0}
.prose li b,.prose p b{color:var(--ink);font-weight:700}
.prose .callout{margin:20px 0 6px;padding:20px 24px;border-radius:18px;background:var(--soft-teal);
  box-shadow:inset 0 0 0 1px rgba(13,148,136,.18);color:var(--ink);font-size:.94rem}
.prose .callout b{color:var(--teal-dark)}
.prose .third-parties{display:grid;gap:12px;margin:8px 0 4px;padding:0;list-style:none}
.prose .third-parties li{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;padding:16px 18px;margin:0;
  border-radius:16px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.prose .third-parties b{grid-column:1;align-self:start;color:var(--ink)}
.prose .third-parties span{grid-column:2;color:var(--muted);font-size:.9rem}
.legal-toc{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0}
.legal-toc a{padding:7px 13px;border-radius:999px;background:rgba(10,13,18,.045);color:var(--muted);
  font:600 .74rem var(--mono);text-decoration:none;transition:color .4s var(--curve),background-color .4s var(--curve)}
.legal-toc a:hover{color:var(--ink);background:rgba(10,13,18,.08)}
@media(max-width:760px){.legal-hero{padding:120px 0 4px}.legal-body{padding:30px 0 80px}.prose section{padding:28px 0}}