/* Motion is progressive: all content is readable before these effects run. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reading-progress{height:3px;position:fixed;inset:0 0 auto;z-index:90;background:var(--red);transform:scaleX(0);transform-origin:left;pointer-events:none}
.site-header{transition:box-shadow .25s,border-color .25s}
.site-header.has-scrolled{box-shadow:0 5px 22px #111d3409;border-color:#e2e7ee}
.button .icon,.text-link .icon,.service-card-top>.icon{transition:transform .24s cubic-bezier(.2,.75,.25,1)}
.button:hover>.icon:last-child,.text-link:hover>.icon:last-child{transform:translateX(3px)}
.service-card:hover .service-card-top>.icon{transform:translateY(-3px) rotate(-4deg)}
.detail-card,.values-grid article,.ip-sector-grid article{transition:transform .25s,box-shadow .25s,border-color .25s}
.detail-card:hover,.values-grid article:hover,.ip-sector-grid article:hover{transform:translateY(-4px);box-shadow:0 13px 30px #111d3408;border-color:#d9a8af}
.footer-grid>div>a{transition:color .2s,transform .2s}
.footer-grid>div>a:hover{transform:translateX(3px)}
.faq-list details[open]>div{animation:detailEnter .25s ease-out}
@keyframes detailEnter{from{opacity:.3;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}

.hero{padding-top:48px;padding-bottom:43px}
.hero h1{margin-bottom:22px}
.hero-audience-row{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.hero-audiences{display:flex;gap:7px;flex-wrap:wrap}
.hero-audiences>button{position:relative;overflow:hidden;border:1px solid #e0e5ec;border-radius:5px;background:#fff;color:#68748a;font-size:11px;font-weight:800;line-height:1.5;min-height:36px;padding:8px 13px;transition:background .22s,color .22s,border-color .22s}
.hero-audiences>button:hover{border-color:#d69da5;color:var(--red)}
.hero-audiences>button[aria-pressed=true]{border-color:#efb8c0;background:#fff3f5;color:#b71e32}
.hero-audiences>button[aria-pressed=true]:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left}
.is-playing .hero-audiences>button[aria-pressed=true]:after{animation:audienceTime 7s linear both}
@keyframes audienceTime{to{transform:scaleX(1)}}
.hero-playback{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid #e0e5ec;background:#fff;border-radius:50%;width:34px;height:34px;color:#8490a2;transition:color .2s,border-color .2s}
.hero-playback>.icon{width:14px;height:14px;stroke-width:2}
.hero-playback:hover{color:var(--red);border-color:#df9ba5}
.hero-playback .play-icon{display:none}
.hero-playback[aria-label="Reanudar movimiento"] .pause-icon{display:none}
.hero-playback[aria-label="Reanudar movimiento"] .play-icon{display:block}
.hero-playback[aria-disabled=true]{opacity:.45;cursor:default}
.hero-copy>.hero-sector-copy{font-size:15px;line-height:1.8;min-height:81px;max-width:445px}
.hero .hero-actions{margin-top:24px}
.hero .hero-location{margin-top:26px}
.hero-photo-frame{height:100%;width:100%;overflow:hidden;border-radius:inherit;background:var(--navy)}
.hero-photo-frame>img{height:100%;width:100%;object-fit:cover;object-position:66% 50%;transform-origin:70% 57%}
.hero.is-playing .hero-photo-frame>img,.hero.is-paused .hero-photo-frame>img{animation:photoDrift 18s ease-in-out infinite alternate}
.hero.is-paused .hero-photo-frame>img{animation-play-state:paused}
@keyframes photoDrift{from{transform:scale(1)}to{transform:scale(1.045)}}
.hero-photo-glow{position:absolute;inset:0;border:1px solid #ffffff16;border-radius:inherit;pointer-events:none;z-index:1}
.hero-image-label #hero-context-label{font-size:inherit;letter-spacing:inherit}
.hero-visual:after{pointer-events:none}

.solution-explorer{align-self:center;overflow:hidden;position:relative;padding:28px;border:1px solid #293954;border-radius:17px;background:var(--navy);color:white;box-shadow:0 18px 35px #111d3410;min-width:0}
.explorer-kicker{display:flex;gap:9px;align-items:center;font-size:8px;font-weight:800;letter-spacing:.14em;color:#b7c6dd;line-height:1.8;margin-bottom:28px}
.explorer-kicker>span{width:6px;height:6px;flex-shrink:0;background:#ff657b}
.explorer-diagram{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-bottom:28px;margin-bottom:25px;border-bottom:1px solid #354159}
.explorer-device{position:relative;z-index:1;background:#192940;border:1px solid #40516d;border-radius:9px;min-width:0;text-align:center;padding:18px 5px 14px;transition:background .25s,transform .25s,border-color .25s}
.explorer-device>.icon{display:block;width:31px;height:31px;margin:0 auto 12px;color:#ff7d90}
.explorer-device>span{display:block;font-size:9px;color:#d0d9e8;font-weight:600;line-height:1.5}
.explorer-path{position:absolute;left:15%;right:15%;top:42px;height:1px;background:#687a98}
.explorer-path>i{position:absolute;left:0;top:-2px;width:5px;height:5px;border-radius:50%;background:#ff7186;box-shadow:0 0 12px #ff657b;opacity:0;animation:signalTravel 3.4s ease-in-out 1}
@keyframes signalTravel{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
.solution-explorer:hover .explorer-path>i,.solution-explorer:focus-within .explorer-path>i{animation:signalTravelHover 2.8s ease-in-out 1}
@keyframes signalTravelHover{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
.explorer-controls{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px}
.explorer-controls>button{display:flex;align-items:center;gap:6px;flex:1;justify-content:center;min-width:0;min-height:39px;border:1px solid #3d4b64;background:#1a2942;color:#b5c4db;border-radius:5px;font-size:9px;font-weight:800;padding:9px 7px;transition:background .2s,color .2s,border-color .2s}
.explorer-controls>button>span{font-size:8px;font-weight:600;color:#92a2bc}
.explorer-controls>button:hover{border-color:#ff8a9a;color:#fff}
.explorer-controls>button[aria-pressed=true]{background:#df2035;border-color:#df2035;color:#fff}
.explorer-controls>button[aria-pressed=true]>span{color:#ffe1e6}
.explorer-panel{min-height:153px;position:relative;padding-right:33px}
.explorer-panel>h2{font-size:26px;line-height:1.24;letter-spacing:-.04em;color:#fff;max-width:320px;margin-bottom:13px}
.explorer-panel>p{font-size:12px;line-height:1.85;color:#b7c6dd;max-width:340px}
.explorer-symbol{position:absolute;right:0;top:3px;opacity:.4;color:#ff8d9e}
.explorer-symbol>.icon{width:25px;height:25px}
.explorer-caption{font-size:8px;line-height:1.8;letter-spacing:.025em;color:#8c9cb7;border-top:1px solid #354159;padding-top:14px;margin-top:8px}
.solution-soporte{background:#fff;border-color:#dce3ec}
.solution-soporte .explorer-kicker{color:#748197}
.solution-soporte .explorer-device{background:#f4f6fa;border-color:#dce3ec}
.solution-soporte .explorer-device>span{color:#5b6980}
.solution-soporte .explorer-device>.icon{color:#c73549}
.solution-soporte .explorer-diagram,.solution-soporte .explorer-caption{border-color:#e2e7ef}
.solution-soporte .explorer-controls>button{background:#f4f6fa;border-color:#dce3ec;color:#5e6d85}
.solution-soporte .explorer-controls>button[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.solution-soporte .explorer-panel>h2{color:var(--ink)}
.solution-soporte .explorer-panel>p{color:var(--muted)}
.solution-soporte .explorer-panel{min-height:153px}
.solution-proyectos .explorer-controls{display:grid;grid-template-columns:repeat(4,1fr)}
.solution-proyectos .explorer-controls>button{flex-direction:column;gap:3px;font-size:9px;padding:10px 4px}
.solution-proyectos .explorer-panel{min-height:143px}
.solution-explorer[data-active-topic="1"] .explorer-device:nth-child(2),.solution-explorer[data-active-topic="2"] .explorer-device:nth-child(3){border-color:#f16b7f;transform:translateY(-3px)}
.web-visual{transition:transform .35s,box-shadow .35s}
.web-visual:hover{transform:rotate(0);box-shadow:0 23px 40px #111d3419}
.web-visual .mock-shape{transition:transform .6s cubic-bezier(.2,.75,.25,1)}
.web-visual:hover .mock-shape{transform:rotate(12deg) translate(-5px,-3px)}
.mock-cards>div{transition:transform .25s}
.mock-cards>div:hover{transform:translateY(-4px)}
.about-year>strong{transition:letter-spacing .5s,color .3s}
.about-year:hover>strong{letter-spacing:-.055em;color:var(--red-dark)}
.system-node{transition:transform .25s,border-color .25s,background .25s}
.system-node:hover{transform:translateX(4px);border-color:#dc7d8b;background:#182940}
.contact-method{transition:padding-left .25s,background .25s}
.contact-method:hover{padding-left:7px}

@media(max-width:1150px){.hero-copy>.hero-sector-copy{font-size:14px;min-height:100px}.solution-explorer{padding:24px}.explorer-panel>h2{font-size:24px}.explorer-panel>p{font-size:11px}.explorer-controls>button{font-size:8px}.explorer-diagram{gap:9px}.explorer-device>span{font-size:8px}}
@media(max-width:1000px){.hero-audiences>button{font-size:10px;padding:8px 11px}.hero-audience-row{gap:8px}.hero-copy>.hero-sector-copy{font-size:13px;min-height:117px}.solution-explorer{padding:21px}.explorer-kicker{font-size:7px;letter-spacing:.1em}.explorer-panel{padding-right:24px;min-height:178px}.explorer-panel>h2{font-size:23px}.explorer-diagram{gap:8px;padding-bottom:21px;margin-bottom:20px}.explorer-device{padding:14px 3px 12px}.explorer-device>.icon{width:27px;height:27px}.solution-proyectos .explorer-controls{grid-template-columns:repeat(2,1fr)}.solution-proyectos .explorer-controls>button{flex-direction:row;gap:8px}.solution-proyectos .explorer-panel{min-height:165px}}
@media(max-width:700px){.hero{padding-top:31px;padding-bottom:31px}.hero h1{margin-bottom:22px}.hero-audience-row{margin-bottom:17px;gap:10px}.hero-audiences{gap:6px}.hero-audiences>button{min-height:36px;font-size:10px;padding:8px 12px}.hero-playback{width:32px;height:32px}.hero-copy>.hero-sector-copy{font-size:13px;min-height:94px;line-height:1.85;max-width:440px}.hero .hero-actions{margin-top:18px}.hero .hero-location{margin-top:21px}.hero-photo-frame>img{object-position:67% 58%}.hero-visual{max-width:530px}.solution-explorer{padding:25px;width:100%;max-width:530px;margin-inline:auto;border-radius:13px}.explorer-kicker{font-size:7px;letter-spacing:.13em;margin-bottom:23px}.explorer-diagram{gap:11px;margin-bottom:22px;padding-bottom:23px}.explorer-device{padding:17px 4px 13px}.explorer-device>.icon{width:30px;height:30px;margin-bottom:10px}.explorer-device>span{font-size:8px}.explorer-panel,.solution-soporte .explorer-panel{min-height:152px;padding-right:25px}.explorer-panel>h2{font-size:25px}.explorer-panel>p{font-size:12px}.explorer-controls>button{font-size:9px;min-height:42px;padding:9px 7px}.solution-proyectos .explorer-controls{grid-template-columns:repeat(4,1fr)}.solution-proyectos .explorer-controls>button{flex-direction:column;gap:4px;font-size:8px;padding:9px 3px}.solution-proyectos .explorer-panel{min-height:151px}.explorer-caption{font-size:8px}.explorer-symbol>.icon{width:22px;height:22px}}
@media(max-width:370px){.hero-audiences>button{padding:8px 9px;font-size:9px}.hero-audience-row{gap:8px}.hero-playback{width:29px;height:29px}.hero-copy>.hero-sector-copy{min-height:101px}.solution-explorer{padding:21px}.explorer-panel>h2{font-size:23px}.solution-proyectos .explorer-controls{grid-template-columns:repeat(2,1fr)}.solution-proyectos .explorer-controls>button{flex-direction:row;gap:7px;font-size:9px}.explorer-panel,.solution-proyectos .explorer-panel{min-height:167px}}
@media(prefers-reduced-motion:reduce){.hero-photo-frame>img{animation:none!important;transform:none!important}.hero-audiences>button:after,.explorer-path>i{animation:none!important}.hero-playback{display:none}.solution-explorer:hover .explorer-path>i,.solution-explorer:focus-within .explorer-path>i{animation:none!important}.faq-list details[open]>div{animation:none!important}}
