﻿:root{--navy:#0b1624;--navy2:#162c42;--orange:#ef6224;--paper:#fff;--pale:#f6f4ef;--ink:#142131;--muted:#647385;--line:#dfe4e7;--shadow:0 24px 65px #0b162422;--wrap:min(1160px,calc(100% - 40px))}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:78px}body{margin:0;color:var(--ink);font:19px/1.6 Outfit,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input,textarea{font:inherit}.container{width:var(--wrap);margin:auto}.skip{position:fixed;left:15px;top:-70px;z-index:999;background:#fff;padding:10px}.skip:focus{top:15px}header{height:78px;position:sticky;top:0;z-index:20;background:#ffffffee;border-bottom:1px solid #0b162412;backdrop-filter:blur(16px)}.nav{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font:800 15px Raleway,sans-serif;letter-spacing:.05em}.brand img{width:83px;height:40px;object-fit:contain}.brand span{padding-left:12px;border-left:1px solid var(--line);color:#536171}.nav nav{display:flex;align-items:center;gap:27px;font-size:17px;font-weight:600}.menu{display:none;background:none;border:0}.menu i{display:block;width:24px;height:2px;margin:5px;background:var(--navy)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:51px;padding:12px 23px;border:1px solid transparent;border-radius:10px;font-weight:700;line-height:1.2;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn.primary{color:#fff;background:var(--orange);box-shadow:0 12px 26px #ef62243d}.btn.secondary{background:#fff;border-color:#ccd3d9}.btn.white{color:var(--navy);background:#fff}.btn.small{min-height:41px;padding:9px 16px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.eyebrow{color:var(--orange);font-size:14px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.eyebrow:before{content:"";display:inline-block;width:22px;height:2px;margin:0 9px 3px 0;background:currentColor}.eyebrow.light{color:#ff9b69}h1,h2{margin:14px 0 18px;color:var(--navy);font:800 clamp(36px,4.4vw,56px)/1.08 Raleway,sans-serif;letter-spacing:-.03em}h2{font-size:clamp(30px,3.2vw,42px)}h1 em,h2 em{color:var(--orange);font-style:normal}h3{margin:0;font:700 22px/1.25 Raleway,sans-serif;color:var(--navy)}.hero{min-height:700px;padding:85px 0;display:flex;align-items:center;overflow:hidden;background:radial-gradient(circle at 83% 22%,#ef622423,transparent 26%),linear-gradient(155deg,#fff 44%,var(--pale))}.hero-grid,.two{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}.lead{max-width:600px;color:var(--muted);font-size:20px}.actions{display:flex;gap:12px;margin:34px 0}.proof{display:flex;gap:20px;flex-wrap:wrap;color:#596879;font-size:16px}.proof span:first-letter{color:#398169}.visual{min-height:550px;position:relative;display:grid;place-items:center}.orbit{position:absolute;width:490px;height:490px;border:1px solid #ef62242b;border-radius:50%}.phone{position:relative;z-index:2;width:270px;height:540px;padding:9px;border:4px solid #273342;border-radius:40px;background:#101822;box-shadow:0 35px 75px #0b162447;transform:rotate(2deg)}.phone:before{content:"";position:absolute;z-index:3;top:12px;left:50%;width:77px;height:19px;border-radius:15px;background:#101822;transform:translateX(-50%)}.screen{height:100%;position:relative;padding:17px 14px;border-radius:28px;background:#fbfaf7;overflow:hidden;font-size:13px}.status{display:flex;justify-content:space-between;padding:0 5px 12px;font-weight:700}.hero .rc{height:auto}.hero .rc-body{gap:11px;padding-bottom:6px}.hero .rc-map{height:78px}.appnav{position:absolute;left:17px;right:17px;bottom:16px;display:flex;justify-content:space-around;padding-top:10px;border-top:1px solid #e3e6e7;color:#8a949e;text-align:center}.appnav>*{display:flex;flex-direction:column;font-size:16px}.appnav small{font-size:10px}.appnav b{color:var(--orange)}.float{position:absolute;z-index:3;display:flex;align-items:center;gap:11px;padding:13px 16px;border:1px solid #ffffffcc;border-radius:13px;background:#fffffff2;box-shadow:var(--shadow);font-size:14px}.float div{display:flex;flex-direction:column}.float small{color:var(--muted)}.float.top{right:-10px;top:100px}.float.bottom{left:-10px;bottom:80px}.float>i{width:12px;height:12px;border-radius:50%;background:#42ad78;box-shadow:0 0 0 6px #e1f4ea}.float>strong{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:#398169;background:#e4f4ec}.strip,.navy{color:#fff;background:var(--navy)}.values{display:grid;grid-template-columns:repeat(4,1fr)}.values>div{display:flex;gap:14px;padding:27px 20px;border-left:1px solid #ffffff18}.values>div:last-child{border-right:1px solid #ffffff18}.values>div>b{color:var(--orange);font:700 14px Raleway}.values span{color:#9fabb8;font-size:15px;line-height:1.4}.values strong{display:block;color:#fff;font-size:17px}.section,.community{padding:80px 0}.pale{background:var(--pale)}.heading{max-width:720px;margin:0 auto 38px;text-align:center}.heading p{max-width:650px;margin:auto;color:var(--muted)}.about-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:50px;align-items:start;margin-top:8px}.about-story p{margin:0 0 14px;color:var(--muted);font-size:17px;line-height:1.65}.about-pillars{display:grid;gap:12px}.about-pillars>div{padding:20px 22px;border:1px solid var(--line);border-radius:16px;background:#fff}.about-pillars b{display:block;margin-bottom:6px;color:var(--orange);font:800 14px Raleway,sans-serif;text-transform:uppercase;letter-spacing:.08em}.about-pillars p{margin:0;color:var(--muted);font-size:16px;line-height:1.55}
.audience-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.audience-grid.cols-3{grid-template-columns:repeat(3,1fr);max-width:820px;margin:0 auto}.audience-grid article{padding:26px 22px;border:1px solid var(--line);border-radius:18px;background:#fff}.audience-grid i{width:42px;height:42px;display:grid;place-items:center;margin-bottom:14px;border-radius:11px;color:var(--orange);background:#fff0e8;font-size:20px;font-style:normal}.audience-grid h3{margin-bottom:8px;font-size:19px}.audience-grid p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.55}
.community-roles{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:26px 0 0;padding:0;}
.community-roles>div{padding:16px 18px;border:1px solid #ffffff22;border-radius:14px;background:#ffffff08;}
.community-roles dt{margin:0 0 5px;color:#fff;font:700 16px Raleway,sans-serif;}
.community-roles dd{margin:0;color:#a9b4bf;font-size:14.5px;line-height:1.5;}
.community-note{margin-top:16px!important;color:#93a1ad!important;font-size:15.5px!important}

/* "Quiénes somos" ampliado con contenido real del Manifiesto Fundacional
   y el Brand Master (2026-08-28, pedido explícito de Leo: "esa
   información que salga del manifiesto y en el brand book") */
.trait-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none;margin:0 0 40px;padding:0;}
.trait-chips li{padding:7px 16px;border:1px solid var(--line);border-radius:99px;background:#fff;color:var(--navy);font-size:15px;font-weight:700;}
.never-sacrifice{margin-top:56px;padding:38px 40px;border-radius:22px;background:var(--navy);color:#fff;}
.never-sacrifice h3{color:#fff;margin-bottom:22px;font-size:24px;}
.never-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.never-grid>div{display:flex;flex-direction:column;gap:8px;}
.never-grid i{font-size:24px;font-style:normal;}
.never-grid p{margin:0;color:#c3ccd4;font-size:15.5px;line-height:1.5;}
.growth-path{margin-top:48px;}
.growth-path h3{margin-bottom:8px;}
.growth-path>p{margin:0 0 24px;color:var(--muted);font-size:16.5px;max-width:700px;}
.growth-path ol{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0;padding:0;list-style:none;}
.growth-path li{display:flex;gap:12px;padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:transform .25s ease,box-shadow .25s ease;}
.growth-path li:hover{transform:translateY(-3px);box-shadow:0 14px 30px #0b16241a;}
.growth-path li span{flex:0 0 auto;color:var(--orange);font:800 15px Raleway;}
.growth-path li b{display:block;margin-bottom:4px;font-size:16.5px;color:var(--navy);}
.growth-path li p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.4;}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.cards article{min-height:295px;position:relative;padding:33px;border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden}.cards article.dark{color:#fff;background:var(--navy);border-color:var(--navy)}.cards article>i{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;color:var(--orange);background:#fff0e8;font-size:26px;font-style:normal}.cards article.dark>i{background:#ffffff13}.cards h3{margin:39px 0 12px;font:700 24px/1.25 Raleway}.cards p{color:var(--muted);font-size:17px}.cards .dark p{color:#a9b4bf}.cards article>b{position:absolute;right:24px;bottom:4px;color:#edf0f1;font:800 54px Raleway}.cards .dark>b{color:#233548}.navy .two{gap:95px}.navy h2,.community h2{color:#fff}.navy .two>div>p{color:#a9b4bf}.steps{list-style:none;margin:35px 0;padding:0}.steps li{display:flex;gap:17px;padding:15px 0;border-top:1px solid #ffffff19}.steps li>b{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #ffffff32;border-radius:50%;color:#ff9b69}.steps span{display:flex;flex-direction:column;color:#9eabb8;font-size:16px}.steps strong{color:#fff;font-size:18px}.tabs{display:flex;justify-content:center;gap:6px;margin-bottom:14px}.tabs button{padding:8px 12px;border:1px solid #ffffff2f;border-radius:99px;color:#b3bdc6;background:none;font-size:14px;cursor:pointer}.tabs button.active{color:#fff;background:var(--orange);border-color:var(--orange)}.role-card{max-width:390px;min-height:450px;margin:auto;padding:31px 25px;border:12px solid #d4d8dc;border-radius:30px;color:var(--ink);background:#f7f5f0;box-shadow:0 32px 68px #0005}.role-card>small{color:var(--orange);font-weight:800;letter-spacing:.12em}.role-card h3{margin:9px 0;font:700 28px/1.2 Raleway}.role-card>p{color:var(--muted);font-size:16px}.map{height:135px;position:relative;margin:22px 0 13px;border-radius:15px;background:repeating-linear-gradient(35deg,#e4e7e1 0 20px,#edf0ea 20px 40px);overflow:hidden}.map i{position:absolute;left:25%;top:54%;width:51%;height:3px;background:var(--orange);transform:rotate(-18deg)}.map b,.map strong{position:absolute;z-index:2;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:0 5px 12px #0002;color:var(--orange)}.map b{left:21%;top:47%}.map strong{right:18%;top:27%}.role-order{display:flex;align-items:center;gap:9px;padding:11px;border-radius:11px;background:#fff}.role-order>span{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#fff0e8}.role-order div{display:flex;flex:1;flex-direction:column}.role-order small{font-size:11px;color:#85919c}.role-order div b{font-size:13px}.role-order em{padding:4px 6px;border-radius:5px;color:#397b67;background:#e5f5ed;font-size:10px;font-style:normal;font-weight:800}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.metrics span{padding:8px;text-align:center;border-radius:8px;background:#fff;color:#7e8993;font-size:11px}.metrics b{display:block;color:var(--ink);font-size:16px}.note{color:#82909d!important;text-align:center;font-size:13px!important}.code-demo{min-height:430px;padding:42px;border:1px solid var(--line);border-radius:32px;background:linear-gradient(145deg,var(--pale),#fff);text-align:center}.code-demo>div{padding:25px;border-radius:17px;color:#fff;background:var(--navy);box-shadow:var(--shadow)}.code-demo small,.code-demo span{display:block;color:#abb6c1;font-size:13px;letter-spacing:.12em}.code-demo>div b{display:block;margin:9px;color:#ff9865;font:800 29px Raleway;letter-spacing:.12em}.code-demo>p{color:#398169;font-size:15px}.code-demo section{display:flex;justify-content:space-around;margin-top:23px}.code-demo section span{color:var(--muted);letter-spacing:0}.code-demo section b{width:65px;height:65px;display:grid;place-items:center;margin-bottom:7px;border:6px solid #fff;border-radius:50%;color:var(--navy);background:#dde5e5;box-shadow:0 10px 23px #0b162422;font:800 23px Raleway}.find-copy>p{color:var(--muted)}.find-copy ul{padding:0;list-style:none}.find-copy li{padding:9px 0 9px 31px;border-bottom:1px solid var(--line)}.find-copy li:before{content:"✓";margin-left:-30px;margin-right:15px;color:#398169;font-weight:800}.find-copy details{padding:15px 17px;border:1px solid var(--line);border-radius:11px;background:#fafaf8}.find-copy summary{cursor:pointer;font-weight:700}.find-copy details p{color:var(--muted);font-size:16px}.community{color:#fff;background:linear-gradient(120deg,#0b1624,#173047)}.community .container>div{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:end}.community .container>div p{color:#b7c1ca;font-size:18px}.community section{display:grid;grid-template-columns:repeat(4,1fr);margin-top:35px;border-block:1px solid #ffffff1d}.community section span{padding:20px;border-right:1px solid #ffffff1d;text-align:center;font-size:16px}.contact-grid{gap:85px}.contact-copy>p{color:var(--muted)}.contact-copy>a{display:flex;align-items:center;gap:13px;padding:15px 0;border-bottom:1px solid #d7dcd9}.contact-copy>a>b{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;color:var(--orange);background:#fff}.contact-copy>a>span{display:flex;flex:1;flex-direction:column;font-weight:700}.contact-copy small{color:var(--muted);font-size:12px;letter-spacing:.1em}.contact-social{display:flex;gap:12px;margin-top:24px}.contact-social a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;color:var(--orange);background:#fff;transition:.2s}.contact-social a:hover{color:#fff;background:var(--orange);transform:translateY(-2px)}.form-card{padding:36px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow)}.form-card>em{padding:5px 9px;border-radius:99px;color:#d84c12;background:#fff0e8;font-size:13px;font-style:normal;font-weight:800;letter-spacing:.1em}.form-card h3{margin:14px 0 5px;font:700 30px Raleway}.form-card>p{color:var(--muted);font-size:16px}.form-card form>div{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-card label{display:block;margin:0 0 11px;font-size:15px;font-weight:700}.form-card label small{color:var(--muted);font-weight:400}.form-card input,.form-card textarea{width:100%;margin-top:5px;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:#f4f4f2;resize:vertical}.form-card button{width:100%}.form-card form>small{display:block;margin-top:9px;color:var(--muted);text-align:center}footer{padding:60px 0 24px;color:#fff;background:#07101b}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .9fr .8fr 1.2fr;gap:36px}.footer-grid>div{display:flex;align-items:flex-start;flex-direction:column;gap:7px}.footer-grid p,.footer-grid a,.footer-grid span{color:#8f9ba7;font-size:16px}.footer-grid>div>b{margin-bottom:7px}.footer-grid a:hover{color:#fff}.lr-badge{display:inline-block;margin-top:8px;max-width:120px;transition:.2s}.lr-badge img{display:block;width:100%;border-radius:6px}.lr-badge:hover{transform:translateY(-2px)}
.foot-bottom a{color:#a9b4bf;text-decoration:underline;text-underline-offset:3px}
.foot-bottom a:hover{color:#fff}.foot-bottom{display:flex;justify-content:space-between;margin-top:45px;padding-top:19px;border-top:1px solid #222e39;color:#74818d;font-size:14px}
@media(max-width:950px){.nav nav{gap:14px}.nav nav>a:not(.btn){display:none}.hero-grid,.two{grid-template-columns:1fr;gap:55px}.hero-grid>div:first-child{text-align:center}.lead{margin:auto}.actions,.proof{justify-content:center}.values{grid-template-columns:1fr 1fr}.cards{grid-template-columns:1fr 1fr}.cards article{min-height:230px}.navy .two{max-width:720px}.role-wrap{order:-1}.community .container>div{grid-template-columns:1fr;gap:10px}.community section{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.4fr 1fr 1fr}.footer-grid>div:last-child{grid-column:1/-1}.never-grid{grid-template-columns:1fr 1fr}.growth-path ol{grid-template-columns:1fr 1fr}}
@media(max-width:1280px) and (min-width:1181px){.nav nav{gap:18px;font-size:16px}}
@media(max-width:1280px){.nav nav a{white-space:nowrap}}
@media(max-width:1180px){.menu{display:block}.nav nav{display:none;position:absolute;left:20px;right:20px;top:78px;align-items:stretch;flex-direction:column;gap:18px;padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow)}.nav nav.open{display:flex}.nav nav>a:not(.btn){display:block}}
@media(max-width:680px){:root{--wrap:min(100% - 28px,1160px)}header{height:67px}.brand img{width:70px}.brand span{font-size:13px}.menu{display:block}.nav nav{display:none;position:absolute;left:14px;right:14px;top:70px;align-items:stretch;flex-direction:column;padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow)}.nav nav.open{display:flex}.nav nav>a:not(.btn){display:block}.hero{padding:70px 0}.hero-grid{gap:10px}.hero h1{font-size:45px}.lead{font-size:19px}.actions{flex-direction:column}.proof{align-items:flex-start;flex-direction:column}.visual{min-height:500px;transform:scale(.88);margin:-25px 0}.orbit{width:425px;height:425px}.float.top{right:-8px}.float.bottom{left:-6px}.values{grid-template-columns:1fr}.values>div{border-bottom:1px solid #ffffff18}.section,.community{padding:56px 0}.heading{text-align:left}.cards article{padding:26px}.about-grid{grid-template-columns:1fr;gap:26px}.audience-grid{grid-template-columns:1fr 1fr;gap:12px}.audience-grid.cols-3{grid-template-columns:1fr}.community-roles{grid-template-columns:1fr;gap:10px}.never-grid{grid-template-columns:1fr 1fr;gap:14px}.never-sacrifice{padding:26px 22px}.growth-path ol{grid-template-columns:1fr}.trait-chips{margin-bottom:28px}.navy .two{gap:40px}.findme-grid{gap:40px}.code-demo{min-height:380px;padding:25px 17px}.community section{grid-template-columns:1fr}.community section span{border-bottom:1px solid #ffffff1d}.form-card{padding:24px 17px}.form-card form>div{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child,.footer-grid>div:last-child{grid-column:1/-1}.foot-bottom{flex-direction:column;gap:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}

/* Experiencia por rol: flujo real de ECL app */
.role-experience{position:relative;overflow:hidden;background:radial-gradient(circle at 92% 8%,#ef62242b,transparent 26%),linear-gradient(150deg,#0b1624,#10263a 62%,#0b1624)}
.role-experience:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
.role-experience>.container{position:relative;z-index:1}
.role-heading{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:end;margin-bottom:46px}
.role-heading h2{margin-bottom:0}
.role-heading>p{margin:0 0 9px;color:#b1bdc8;font-size:20px}
.role-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.role-tabs button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:13px;padding:17px 19px;border:1px solid #ffffff21;border-radius:15px;color:#aeb9c4;background:#ffffff08;text-align:left;cursor:pointer;transition:.2s}
.role-tabs button:hover{border-color:#ffffff45;background:#ffffff0e}
.role-tabs button.active{color:#fff;border-color:#ef6224;background:#ef62241d;box-shadow:inset 0 -3px #ef6224}
.role-tabs button>span{grid-row:1/3;align-self:center;color:#ff9363;font:800 14px Raleway,sans-serif}
.role-tabs button>b{font:700 19px Raleway,sans-serif}
.role-tabs button>small{color:#8f9dac;font-size:14px}
.role-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.9fr);gap:0;overflow:hidden;border:1px solid #ffffff1f;border-radius:28px;background:#ffffff0a;box-shadow:0 38px 90px #0004}
.role-story{padding:46px 48px}
.role-kicker{color:#ff9363;font-size:13px;font-weight:800;letter-spacing:.14em}
.role-story h3{max-width:620px;margin:13px 0 10px;color:#fff;font:700 clamp(31px,3vw,44px)/1.12 Raleway,sans-serif;letter-spacing:-.025em}
.role-story>p{max-width:650px;margin:0 0 26px;color:#aebac5}
.role-journey{margin:0 0 28px;padding:0;list-style:none}
.role-journey li{display:grid;grid-template-columns:39px 1fr;gap:14px;position:relative;padding:10px 0}
.role-journey li:not(:last-child):before{content:"";position:absolute;left:18px;top:43px;bottom:-5px;width:1px;background:#ffffff21}
.role-journey li>span{width:37px;height:37px;display:grid;place-items:center;z-index:1;border:1px solid #ffffff32;border-radius:50%;color:#ff9b69;background:#12283b;font-weight:800}
.role-journey li b{display:block;color:#fff;font-size:17px}
.role-journey li p{margin:2px 0;color:#96a5b4;font-size:15px;line-height:1.45}
.role-journey li .role-importance{margin-top:6px;padding-left:10px;border-left:2px solid #ef6224;color:#bdc7d0}
.role-journey li .role-importance strong{color:#ff9b69;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.app-walkthrough{align-self:center;width:calc(100% - 34px);max-width:500px;margin:34px 34px 34px 0;padding:25px;border:8px solid #d6dadd;border-radius:30px;color:var(--ink);background:#f5f3ed;box-shadow:0 25px 65px #0005}
.walkthrough-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid #dfe2df}
.walkthrough-top span{color:var(--navy);font:800 19px Raleway,sans-serif}
.walkthrough-top small{color:#81909d;font-size:11px;font-weight:800;letter-spacing:.12em}
.walkthrough-screen{position:relative;height:460px;margin:16px 0;border-radius:16px;overflow:hidden;background:#f6f4ef;border:1px solid #dfe2df;box-shadow:inset 0 0 0 1px #fff}
.walkthrough-focus{margin:13px 0;padding:16px;border:1px solid #dedfdb;border-radius:13px;background:#fff}
.walkthrough-focus small{display:block;color:var(--orange);font-size:11px;font-weight:800;letter-spacing:.12em}
.walkthrough-focus b{display:block;margin:6px 0;color:var(--navy);font-size:15px;line-height:1.35}
.walkthrough-focus p{margin:0;color:#6d7b88;font-size:13px;line-height:1.4}
.walkthrough-nav{display:flex;justify-content:space-around;padding-top:12px;border-top:1px solid #dfe2df;color:#8b969f}
.walkthrough-nav span{display:flex;align-items:center;flex-direction:column;font-size:16px}
.walkthrough-nav span.active{color:var(--orange)}
.walkthrough-nav small{font-size:10px}

/* --- Ruta real del remitente (2026-09-06): 6 capturas reales de la App en
   producción, reemplazando el teléfono recreado (rc-*) SOLO en la pestaña
   Remitente -- pedido explícito de Leo, y regla ya escrita en
   mockups/README.md ("sustituir pantallas neutras por capturas reales
   anonimizadas"). Destinatario/Repartidor siguen con el mockup recreado.
   Nombres en las capturas reemplazados por los mismos ficticios del
   simulador (Camila/Diego/Mateo) -- las originales mostraban datos reales. */
.role-stage.rem-real-active{grid-template-columns:1fr}
.rem-real-rail{grid-column:1/-1;padding:0 48px 44px}
.rrail-track{display:flex;gap:22px;overflow-x:auto;padding:6px 4px 16px;scroll-snap-type:x proximity}
.rrail-track::-webkit-scrollbar{height:8px}
.rrail-track::-webkit-scrollbar-thumb{background:#ffffff2a;border-radius:99px}
.rrail-step{flex:0 0 auto;width:190px;scroll-snap-align:start}
.rrail-tag{display:flex;align-items:center;gap:8px;margin-bottom:12px;color:#ff9b69;font:800 11px Outfit,Arial;letter-spacing:.08em;text-transform:uppercase}
.rrail-tag i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--orange);color:#fff;font-size:11px;font-style:normal}
.rrail-phone{border:4px solid #fff;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 20px 45px #0006}
.rrail-phone img{width:100%;display:block}
.rrail-step h4{margin:14px 0 5px;color:#fff;font:700 18px Raleway,sans-serif}
.rrail-step p{margin:0;color:#9fabb8;font-size:13.5px;line-height:1.5}
.rrail-note{margin:0;padding-top:18px;border-top:1px solid #ffffff1d;color:#8b96a1;font-size:12.5px;text-align:center}
@media(max-width:680px){.rem-real-rail{padding:0 21px 30px}.rrail-step{width:158px}}
.role-note{margin:12px 2px 0;color:#7c8994;font-size:12px;line-height:1.35;text-align:center}
.shared-route{margin-top:24px;padding:25px;border:1px solid #ffffff18;border-radius:18px;background:#ffffff07}
.shared-route>strong{display:block;margin-bottom:18px;color:#fff;font:700 19px Raleway,sans-serif}
.shared-route>div{display:grid;grid-template-columns:repeat(5,1fr)}
.shared-route span{display:grid;grid-template-columns:29px 1fr;grid-template-rows:auto auto;column-gap:9px;position:relative;padding-right:12px}
.shared-route span:not(:last-child):after{content:"→";position:absolute;right:5px;top:5px;color:#ef622480}
.shared-route i{grid-row:1/3;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--orange);font-size:13px;font-style:normal;font-weight:800}
.shared-route b{color:#fff;font-size:13px}
.shared-route small{color:#8493a1;font-size:12px}
@media(max-width:950px){
  .role-heading{grid-template-columns:1fr;gap:15px}.role-heading>p{max-width:700px}
  .role-stage{grid-template-columns:1fr}.app-walkthrough{width:calc(100% - 70px);max-width:620px;margin:0 auto 38px}
  .shared-route>div{overflow-x:auto;grid-template-columns:repeat(5,minmax(145px,1fr));padding-bottom:7px}
}
@media(max-width:680px){
  .role-experience{padding:78px 0}.role-heading{margin-bottom:30px}.role-heading h2{font-size:40px}.role-heading>p{font-size:17px}
  .role-tabs{gap:5px}.role-tabs button{display:flex;align-items:center;flex-direction:column;gap:1px;padding:12px 5px;text-align:center}.role-tabs button>span{font-size:12px}.role-tabs button>b{font-size:14px}.role-tabs button>small{font-size:11px}
  .role-stage{border-radius:20px}.role-story{padding:30px 21px}.role-story h3{font-size:31px}.role-story>p{font-size:16px}.role-journey li p{font-size:14px}
  .app-walkthrough{width:calc(100% - 26px);margin:0 13px 18px;padding:16px;border-width:6px;border-radius:24px}.walkthrough-top small{max-width:120px;text-align:right}.walkthrough-screen{height:400px}
  .shared-route{padding:19px 15px}.shared-route>div{grid-template-columns:repeat(5,145px)}
}

/* --- fix: título invisible en la card oscura (h3 heredaba var(--navy)
   del selector base, sobre un fondo también navy -- 2026-08-27,
   reportado por el usuario con captura real) --- */
.cards article.dark h3{color:#fff;}

/* --- Rediseño "nivel pro" (2026-08-27 noche): pedido explícito de Leo
   tras revisar referencias DHL/Olva Courier — cinta horizontal de
   confianza, pestañas por tipo de público, y un pase de pulido visual
   (hover, profundidad) sobre las tarjetas existentes. --- */

/* cinta informativa horizontal en loop continuo, como el bloque
   repetido de DHL ("+220 países · Tracking 24/7 · Envíos
   internacionales"). Contenido duplicado una vez para un loop
   perfecto vía translateX(-50%); la mitad duplicada se oculta de
   lectores de pantalla. */
.ticker{overflow:hidden;background:var(--navy);border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14;padding:23px 0;}
.ticker-track{display:inline-flex;width:max-content;white-space:nowrap;animation:ticker-scroll 36s linear infinite;}
.ticker-track span{display:inline-flex;align-items:center;padding:0 32px;border-right:1px solid #ffffff1d;color:#dbe3ea;font-size:19px;font-weight:600;}
.ticker:hover .ticker-track{animation-play-state:paused;}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* pestañas "A quién servimos" -- Personas / Emprendedores / Empresa /
   Corporativo (en construcción, meta futura con flota propia). */
.audience-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:6px;}
.audience-tabs button{appearance:none;-webkit-appearance:none;padding:12px 22px;border:1px solid var(--line);border-radius:99px;color:var(--muted);background:#fff;font-weight:700;font-size:16px;cursor:pointer;transition:.2s;}
.audience-tabs button:hover{border-color:var(--orange);color:var(--navy);}
.audience-tabs button.active{color:#fff;background:var(--navy);border-color:var(--navy);}
.audience-panel{max-width:900px;margin:34px auto 0;padding:38px 40px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(160deg,#fff,var(--pale));box-shadow:var(--shadow);display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start;transition:background .25s ease;}
.audience-panel.building{background:linear-gradient(160deg,#fff8f2,#fdecdf);}
.audience-panel-icon{width:56px;height:56px;display:grid;place-items:center;border-radius:14px;color:var(--orange);background:#fff0e8;font-size:26px;font-style:normal;}
.audience-panel.building .audience-panel-icon{background:#ffe1c7;}
.audience-panel-body h3{margin:0 0 8px;font:700 26px/1.28 Raleway,sans-serif;color:var(--navy);}
.audience-panel-body>p{margin:0 0 16px;color:var(--muted);font-size:17px;line-height:1.6;}
.audience-badge{display:inline-block;margin-bottom:10px;padding:5px 12px;border-radius:99px;background:var(--orange);color:#fff;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.audience-panel-body ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;}
.audience-panel-body li{position:relative;padding-left:26px;color:var(--ink);font-size:16.5px;line-height:1.5;}
.audience-panel-body li:before{content:"✓";position:absolute;left:0;color:#398169;font-weight:800;}
.audience-panel.building .audience-panel-body li:first-child:before{content:"🚧";color:var(--orange);}

/* pulido: profundidad e interacción en tarjetas que antes eran estáticas */
.about-pillars>div{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.about-pillars>div:hover{transform:translateY(-3px);border-color:#d8dee2;box-shadow:0 16px 34px #0b16241a;}
.cards article{transition:transform .25s ease,box-shadow .25s ease;}
.cards article:hover{transform:translateY(-4px);box-shadow:0 22px 46px #0b16241f;}

@media(max-width:680px){
  .ticker-track span{padding:0 22px;font-size:17px;}
  .audience-tabs{gap:6px;}
  .audience-tabs button{padding:10px 16px;font-size:15px;}
  .audience-panel{grid-template-columns:1fr;padding:26px 22px;margin-top:22px;}
  .audience-panel-icon{width:46px;height:46px;font-size:22px;}
}

/* --- SIMULADOR: 3 celulares en simultáneo (2026-08-27; agrandado y
   compactado esa misma noche; segunda ronda de ajustes horas después
   tras nuevo feedback de Leo: letras "al menos el doble" más grandes,
   simular que se presionan los botones y que se escriben/llenan los
   datos (código Encuéntrame, código de entrega), y que el código de
   entrega del repartidor sí coincida con el del destinatario). La
   ventana respeta el alto de pantalla con max-height+scroll interno
   en vez de forzar zoom del navegador. --- */
.sim-overlay{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:14px;background:rgba(11,22,36,.65);backdrop-filter:blur(4px);}
.sim-overlay.open{display:flex;}
.sim-frame{position:relative;width:100%;max-width:340px;max-height:96vh;overflow-y:auto;background:#fff;border-radius:20px;padding:14px;box-shadow:0 40px 90px rgba(0,0,0,.35);}
.sim-frame-wide{max-width:1080px;}
.sim-topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;padding:7px 12px;border-radius:99px;background:#1c2b3d;color:#ffb38a;font-size:13px;font-weight:700;letter-spacing:.03em;}
.sim-close{border:0;background:none;color:#fff;font-size:19px;cursor:pointer;line-height:1;padding:2px 6px;}
.sim-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.sim-col{display:flex;flex-direction:column;align-items:center;gap:7px;}
.sim-col-label{font:800 18px Outfit,Arial;color:var(--navy);}

/* celular más realista: bisel fino, esquinas redondeadas de verdad, notch
   punch-hole centrado, barra de estado con hora + iconos. 300px: más
   grande otra vez para dar espacio a la tipografía subida abajo. */
.sim-phone{position:relative;width:100%;max-width:300px;aspect-ratio:9/19.5;padding:0;border:3px solid #1a222c;border-radius:36px;background:#fff;box-shadow:0 18px 34px rgba(11,22,36,.28),inset 0 0 0 2px #05070a;overflow:hidden;transition:box-shadow .25s ease,transform .25s ease;}
.sim-phone.sim-active{box-shadow:0 0 0 3px var(--orange),0 18px 34px rgba(239,98,36,.35);transform:translateY(-3px);}
.sim-notch{position:absolute;z-index:4;top:11px;left:50%;width:11px;height:11px;border-radius:50%;background:#0c1118;transform:translateX(-50%);box-shadow:0 0 0 2px #1a222c;}
.sim-status{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;justify-content:space-between;padding:11px 19px 0;font-size:15px;font-weight:700;color:var(--navy);}
.sim-screen{position:absolute;inset:0;padding-top:30px;background:#f6f4ef;overflow:hidden;}

/* recreación real de pantallas de la App (no más tarjetas genéricas de
   ícono+texto) — basada en capturas reales de pagina-web/mockups/.
   Tipografía subida por segunda vez -- "aumenta el tamaño de las
   letras, al menos el doble" -- ya suma ~55-65% sobre la versión
   original de esta noche en los textos más chicos (labels, badges). */
.rc{width:100%;height:100%;display:flex;flex-direction:column;font-family:Outfit,Arial,sans-serif;}
.rc-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--navy);color:#fff;}
.rc-head .rc-logo{font:800 15px Raleway,Arial;letter-spacing:.02em;}
.rc-head .rc-ico{position:relative;font-size:14.5px;opacity:.9;}
.rc-dot{position:absolute;top:-4px;right:-6px;min-width:10px;height:10px;padding:0 1px;border-radius:99px;background:var(--orange);color:#fff;font-size:9.5px;font-weight:800;line-height:10px;text-align:center;}
.rc-body{flex:1 1 auto;overflow:hidden;padding:11px 12px;display:flex;flex-direction:column;gap:9px;}
.rc-hi{display:flex;align-items:center;gap:7px;}
.rc-avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:14px;font-weight:800;flex:0 0 auto;}
.rc-hi b{display:block;font-size:15px;color:var(--navy);}
.rc-hi span{display:block;font-size:12px;font-weight:800;letter-spacing:.02em;}
.rc-stats{display:flex;gap:5px;}
.rc-stat{flex:1;background:#fff;border:1px solid var(--line);border-radius:7px;padding:6px 4px;text-align:center;}
.rc-stat b{display:block;font-size:16px;color:var(--navy);}
.rc-stat small{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.02em;}
.rc-cta{display:block;width:100%;text-align:center;border:0;border-radius:8px;padding:10px 6px;font:800 13.5px Outfit,Arial;color:#fff;letter-spacing:.01em;cursor:default;}
.rc-cta.interactive{cursor:pointer;animation:rc-pulse 1.6s ease-in-out infinite;}
.rc-cta.pressed{animation:rc-press .32s ease;}
@keyframes rc-press{0%{transform:scale(1);filter:brightness(1);}35%{transform:scale(.93);filter:brightness(1.3);}100%{transform:scale(1);filter:brightness(1);}}
.rc-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:10px 11px;}
.rc-card h6{margin:0 0 3px;font-size:13.5px;color:var(--navy);font-weight:800;}
.rc-card p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.4;}
.rc-badge{display:inline-block;padding:3px 7px;border-radius:99px;font-size:11px;font-weight:800;letter-spacing:.02em;}
.rc-badge.orange{background:#fdecdf;color:#b3540f;}
.rc-badge.green{background:#e2f3e8;color:#1f7a45;}
.rc-badge.blue{background:#e3eafc;color:#1e3f8f;}
.rc-newbadge{display:inline-block;align-self:flex-start;margin-bottom:2px;padding:4px 9px;border-radius:99px;background:#fdecdf;color:var(--orange);font-size:11.5px;font-weight:800;letter-spacing:.02em;animation:rc-badge-pop .4s ease;}
@keyframes rc-badge-pop{0%{transform:scale(.6);opacity:0;}70%{transform:scale(1.08);opacity:1;}100%{transform:scale(1);}}
.rc-check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin-bottom:4px;}
.rc-check b{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:10px;border:1.4px solid var(--line);flex:0 0 auto;color:var(--muted);background:#fff;font-weight:800;}
.rc-check.done{color:var(--navy);font-weight:700;}
.rc-check.done b{background:#398169;border-color:#398169;color:#fff;}
.rc-check.now b{border-color:var(--orange);color:var(--orange);}
.rc-map{height:56px;border-radius:8px;background:linear-gradient(135deg,#dce8f5,#eaf1e4);position:relative;flex:0 0 auto;}
.rc-map:after{content:"📍";position:absolute;top:50%;left:50%;transform:translate(-50%,-62%);font-size:19px;}
.rc-field{border:1px solid var(--line);border-radius:7px;padding:6px 8px;font-size:12.5px;color:var(--muted);background:#fff;transition:border-color .25s ease,background .25s ease,color .25s ease;}
.rc-field-pin{min-height:1.3em;}
.rc-field-ok{border-color:#398169;background:#eefaf3;color:#1f7a45;}
.rc-code{font:800 20px ui-monospace,Consolas,monospace;letter-spacing:.07em;color:var(--navy);text-align:center;border:1.4px dashed var(--orange);border-radius:8px;padding:9px;background:#fff8f2;min-height:1.3em;}
.rc-btnrow{display:flex;gap:6px;}
.rc-btnrow span{flex:1;text-align:center;border-radius:7px;padding:6px 4px;font-size:11.5px;font-weight:800;}
.rc-modal{margin-top:auto;background:#fff;border:1px solid var(--line);border-radius:10px 10px 0 0;padding:11px 12px;box-shadow:0 -5px 14px rgba(11,22,36,.12);}
.rc-modal h6{margin:0 0 4px;font-size:13.5px;color:var(--navy);font-weight:800;}
.rc-modal p{font-size:12.5px;color:var(--muted);margin:0;}
.rc-stars-mini{display:flex;gap:3px;justify-content:center;font-size:18px;color:#f5a623;margin:5px 0;}
.rc-chat{background:#eef3f8;border-radius:9px;padding:10px 11px;font-size:11.5px;color:var(--navy);}
/* campos que se revelan después de que el código termina de "escribirse"
   -- simulan un formulario real llenándose, no datos ya resueltos */
.rc-extra-fields{opacity:0;transform:translateY(-4px);transition:opacity .35s ease,transform .35s ease;}
.rc-extra-fields.show{opacity:1;transform:none;}
@keyframes rc-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,98,36,.45);}50%{box-shadow:0 0 0 4px rgba(239,98,36,0);}}

/* nube de mensaje bajo cada celular — explica en una frase qué está pasando */
.sim-caption{position:relative;max-width:300px;margin-top:1px;padding:8px 12px;border-radius:10px;background:#1c2b3d;color:#fff;font-size:15.5px;line-height:1.35;text-align:left;min-height:30px;}
.sim-caption b{display:block;font-size:15.5px;margin-bottom:2px;color:#ffb38a;}
.sim-caption:before{content:"";position:absolute;top:-5px;left:22px;border:6px solid transparent;border-bottom-color:#1c2b3d;}

.sim-tracker{display:flex;gap:4px;margin-top:12px;}
.sim-track-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;}
.sim-track-step span{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--line);background:#fff;font-size:14px;font-weight:800;color:var(--muted);}
.sim-track-step small{font-size:13.5px;color:var(--muted);line-height:1.25;max-width:72px;}
.sim-track-step.active span{border-color:var(--orange);background:var(--orange);color:#fff;}
.sim-track-step.active small{color:var(--navy);font-weight:700;}
.sim-track-step.done span{border-color:#398169;background:#398169;color:#fff;}
.sim-track-step:not(:last-child){position:relative;}
.sim-track-step:not(:last-child):after{content:"";position:absolute;top:13px;left:60%;width:80%;height:2px;background:var(--line);z-index:-1;}
.sim-track-step.done:not(:last-child):after{background:#398169;}

.sim-controls{display:flex;justify-content:center;gap:10px;margin-top:14px;}
.sim-controls .btn{min-height:44px;padding:11px 22px;}
.sim-rate-wrap{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);text-align:center;}
.sim-full{width:100%;margin-top:10px;max-width:280px;}
.sim-stars{display:flex;justify-content:center;gap:6px;margin:10px 0 14px;font-size:28px;color:#dfe4e7;cursor:pointer;}
.sim-stars span.on{color:#f5a623;}
.sim-note{margin:0;color:var(--muted);font-size:14.5px;}

/* Ventana de chat triangular dentro del simulador (2026-09-01, pedido
   explícito de Leo: "agregar la ventana del chat triangular con una
   conversación entre los 3 roles [...] cuando repartidor recibe
   paquete"). Aparece centrada sobre los 3 celulares, muestra 3 mensajes
   uno por uno y luego se "minimiza" a un botón -- mismo criterio de
   interactividad ya usado en el resto del simulador (nada instantáneo,
   todo con su propio ritmo). */
.sim-chat-backdrop{position:fixed;inset:0;z-index:110;background:#0b162466;opacity:1;transition:opacity .35s ease;}
.sim-chat-backdrop.sim-chat-hidden{opacity:0;pointer-events:none;}
.sim-chat-window{position:fixed;left:50%;top:50%;z-index:111;width:min(430px,88vw);max-height:74vh;display:flex;flex-direction:column;border-radius:20px;background:#fff;box-shadow:0 30px 70px #0007;overflow:hidden;transform:translate(-50%,-50%) scale(1);opacity:1;transition:opacity .35s ease,transform .35s ease;}
.sim-chat-window.sim-chat-hidden{opacity:0;pointer-events:none;transform:translate(-50%,-42%) scale(.4);}
.sim-chat-head{display:flex;align-items:center;justify-content:space-between;padding:13px 17px;background:var(--navy);color:#fff;}
.sim-chat-head b{font:800 17px Raleway,sans-serif;}
.sim-chat-head small{opacity:.75;font-size:13px;}
.sim-chat-body{flex:1;overflow-y:auto;min-height:190px;padding:15px 17px;display:flex;flex-direction:column;gap:11px;background:#f3f1ec;}
.sim-chat-msg{max-width:80%;padding:10px 13px;border-radius:15px;font-size:16px;line-height:1.4;opacity:0;transform:translateY(7px);transition:opacity .3s ease,transform .3s ease;}
.sim-chat-msg.sim-chat-show{opacity:1;transform:none;}
.sim-chat-msg b{display:block;margin-bottom:2px;font-size:13px;letter-spacing:.02em;}
.sim-chat-msg.rem{align-self:flex-start;background:#e3eafc;color:#1e3f8f;border-bottom-left-radius:4px;}
.sim-chat-msg.dst{align-self:flex-end;background:#e2f3e8;color:#1f7a45;border-bottom-right-radius:4px;}
.sim-chat-msg.rep{align-self:flex-start;background:#fdecdf;color:#b3540f;border-bottom-left-radius:4px;}
.sim-chat-min-btn{position:relative;z-index:2;margin:12px auto 0;display:flex;align-items:center;gap:8px;padding:10px 18px;border:0;border-radius:99px;background:var(--navy);color:#fff;font:700 16px Outfit,Arial,sans-serif;cursor:pointer;box-shadow:0 10px 24px #0b16243d;opacity:0;transform:translateY(7px);transition:opacity .3s ease,transform .3s ease;}
.sim-chat-min-btn.sim-chat-show{opacity:1;transform:none;}
.sim-chat-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);}

@media(max-width:720px){
  .sim-overlay{padding:8px;}
  .sim-frame{max-height:98vh;}
  .sim-trio{grid-template-columns:1fr;gap:12px;}
  .sim-phone{max-width:240px;margin:0 auto;}
  .sim-caption{max-width:240px;}
  .sim-chat-window{width:92%;max-height:80%;}
  .sim-chat-body{min-height:150px;}
  .sim-tracker{flex-wrap:wrap;}
  .sim-track-step{flex:0 0 30%;margin-bottom:10px;}
  .sim-track-step:not(:last-child):after{display:none;}
}
.sim-cta{margin-top:18px;}

/* --- Detalle de marca (2026-09-02, pedido explícito de Leo: "líneas de
   velocidad horizontales súper sutiles... lo dejo a tu criterio").
   Reutiliza el mismo motivo que ya tiene el isotipo del logo (ver
   CLAUDE.md §11 Branding, "rayitas de velocidad"), llevado a algunas
   secciones como una capa decorativa casi imperceptible -- nunca compite
   con el contenido: opacidad muy baja, z-index por debajo del
   contenedor real, y puramente aria-hidden. La animación de deriva
   queda cubierta por la regla global de prefers-reduced-motion de
   arriba (línea 33), que ya congela cualquier animation/transition. */
.speedlines{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;}
.speedlines i{position:absolute;left:-45%;width:30%;height:1.5px;background:linear-gradient(90deg,transparent,currentColor 45%,currentColor 55%,transparent);opacity:.15;animation:speedline-drift 23s linear infinite;}
.speedlines i:nth-child(1){top:14%;width:24%;animation-duration:20s;}
.speedlines i:nth-child(2){top:37%;width:38%;animation-duration:28s;animation-delay:-9s;}
.speedlines i:nth-child(3){top:60%;width:20%;animation-duration:17s;animation-delay:-4s;}
.speedlines i:nth-child(4){top:81%;width:32%;animation-duration:25s;animation-delay:-15s;}
@keyframes speedline-drift{from{transform:translateX(0);}to{transform:translateX(320%);}}
.hero{position:relative;}
.hero .speedlines{color:var(--orange);}
.hero-grid{position:relative;z-index:1;}
.role-experience,.community{position:relative;overflow:hidden;}
.role-experience .speedlines,.community .speedlines{color:#fff;}
.role-experience .speedlines i,.community .speedlines i{opacity:.12;}
.role-experience>.container,.community>.container{position:relative;z-index:1;}

/* Segundo efecto sutil, en el resto de secciones: los títulos aparecen con
   un leve ascenso al entrar en pantalla, en vez de estar siempre
   estáticos. La clase que oculta el elemento la agrega el propio JS
   (ver app.js, initRevealOnScroll) -- así, si JS no carga, el título
   nunca queda invisible: el progressive-enhancement es la prioridad
   sobre el efecto. */
.reveal-pending{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease;}
.reveal-pending.reveal-in{opacity:1;transform:none;}

/* --- FAQ (2026-09-02): acordeón nativo <details>/<summary>, mismo
   patrón ya usado en .find-copy details de la sección Encuéntrame --
   sin JS adicional para abrir/cerrar. --- */
.faq-list{max-width:800px;margin:0 auto;display:grid;gap:12px;}
.faq-list details{padding:20px 24px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:border-color .2s ease,box-shadow .2s ease;}
.faq-list details[open]{border-color:#f0d2bd;box-shadow:0 16px 34px #0b16240f;}
.faq-list summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;font:700 18px/1.35 Raleway,sans-serif;color:var(--navy);}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary:after{content:"+";flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;color:var(--orange);background:#fff0e8;font-size:19px;font-weight:800;transition:transform .25s ease;}
.faq-list details[open] summary:after{content:"–";transform:rotate(180deg);}
.faq-list details p{margin:14px 0 2px;color:var(--muted);font-size:16.5px;line-height:1.62;}
.faq-note{max-width:800px;margin:22px auto 0;text-align:center;color:var(--muted);font-size:15.5px;}
.faq-note a{color:var(--orange);font-weight:700;}

@media(prefers-reduced-motion:reduce){.speedlines{display:none;}}
@media(max-width:680px){.faq-list details{padding:16px 18px;}.faq-list summary{font-size:16.5px;}}

/* --- Encuéntrame: capturas reales en vez del mockup ilustrativo (2026-08-27) --- */
.code-demo.code-demo-real{display:flex;flex-direction:column;gap:18px;padding:22px;text-align:left;background:var(--pale);}
.code-demo-real figure{margin:0;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 14px 30px #0b16240f;}
.code-demo-real img{width:100%;display:block;}
.code-demo-real figcaption{padding:11px 14px;color:var(--navy);font-size:14.5px;font-weight:700;border-top:1px solid var(--line);}
@media(max-width:680px){.code-demo.code-demo-real{padding:14px;}}
