/* Entradas cortas y movimiento ligado a la interacción. */
:root { --ease-out:cubic-bezier(.16,1,.3,1); }
.hero { position:relative; isolation:isolate; overflow:hidden; }
.hero::before { content:""; position:absolute; z-index:-1; width:min(900px,110vw); height:660px; left:50%; top:-280px; translate:-50% 0; border-radius:50%; background:radial-gradient(ellipse,#3454d12b,transparent 66%); pointer-events:none; }
.motion-enabled .hero::before { animation:ambient-drift 18s ease-in-out infinite alternate; animation-play-state:paused; }
.motion-enabled .hero.in-motion-view::before { animation-play-state:running; }
.motion-enabled .hero .button-primary { animation:cta-halo 3.4s ease-in-out infinite; animation-play-state:paused; }
.motion-enabled .hero.in-motion-view .button-primary { animation-play-state:running; }
.hero-copy,.flow-panel { position:relative; }
.motion-enabled .hero h1 span::after { transform-origin:left; animation:underline-in .9s .3s var(--ease-out) both; }
[data-reveal] { transition:opacity .7s var(--ease-out),translate .7s var(--ease-out); transition-delay:var(--reveal-delay,0ms); }
.reveal-pending { opacity:0; translate:0 24px; }
.reveal-pending.is-revealed { opacity:1; translate:0 0; }
.button { transition:background .25s,transform .3s var(--ease-out),box-shadow .3s,border-color .25s; }
.button-primary:hover,.button-primary:focus-visible { box-shadow:0 8px 28px #3454d13d; transform:translateY(-3px); }
.button:active { transform:translateY(0) scale(.98); }
.flow-panel { transition:border-color .35s,box-shadow .35s; }
.flow-panel:hover { border-color:#6d86b1; box-shadow:0 26px 75px #0005; }
.flow-tab { transition:background .25s,color .25s,box-shadow .25s; }
.flow-tab[aria-selected=true] { box-shadow:0 3px 14px #0c183a26; }
.flow-number { transition:background .3s,border-color .3s,color .3s; }
.flow-panel { width:min(100%,920px); }
.flow-steps { gap:20px; grid-template-columns:repeat(4,minmax(0,1fr)); padding-top:5px; }
.flow-steps li,.flow-steps li:last-child { flex-direction:column; align-items:center; gap:13px; padding-bottom:22px; min-height:175px; text-align:center; }
.flow-number { width:48px; height:48px; border-radius:50%; background:#22334e; border-color:#5875a4; color:#eaf1ff; z-index:1; }
.flow-number::after { content:""; position:absolute; inset:-6px; border:1px solid #62c3ff2b; border-radius:50%; pointer-events:none; }
.flow-steps li:not(:last-child)::before { display:block; left:calc(50% + 29px); top:24px; width:calc(100% + 20px - 58px); height:1px; background:linear-gradient(90deg,#62c3ff77 50%,transparent 50%) 0 0/8px 1px repeat-x; }
.flow-steps strong { font-size:15px; line-height:1.4; padding-top:0; }
.flow-steps div span { font-size:13px; }
.flow-result,.flow-footnote { text-align:center; }
.motion-enabled .flow-number { animation:node-current 3.6s ease-in-out infinite; animation-delay:var(--node-delay,0s); animation-play-state:paused; }
.motion-enabled .flow-steps li:not(:last-child)::before { animation:connection-flow 1.2s linear infinite; animation-play-state:paused; }
.motion-enabled .flow-panel.in-motion-view .flow-number,.motion-enabled .flow-panel.in-motion-view .flow-steps li::before { animation-play-state:running; }
.motion-toggle { display:block; margin:18px auto 0; padding:6px 12px; font-size:12px; color:#c0cce1; background:transparent; border:1px solid #586985; border-radius:20px; cursor:pointer; transition:background .25s,border-color .25s; }
.motion-toggle:hover { background:#ffffff0a; border-color:#87a5ce; }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation:none!important; transition:none!important; }
.motion-paused .reveal-pending { opacity:1; translate:none; }
.motion-paused .hero h1 span::after { transform:scaleX(1); }
.service,.price-card { transition:transform .4s var(--ease-out),border-color .35s,box-shadow .4s; }
.service-preview { transition:background .35s; overflow:hidden; }
.mini-record,.mini-booking,.mini-content span { transition:transform .45s var(--ease-out),box-shadow .35s; }
.route-line { position:relative; overflow:hidden; }
.route-line::after { content:""; position:absolute; inset:0; background:var(--blue); transform:translateX(-105%); }
.service-link,.who-cta { transition:color .25s,text-decoration-color .25s; }
.service-link:hover,.who-cta:hover { text-decoration-color:transparent; }
.faqs details p { transform-origin:top; }
.motion-enabled .faqs details[open] p { animation:answer-in .32s var(--ease-out); }
.faqs summary::after { transition:transform .3s var(--ease-out); }
.faqs details[open] summary::after { transform:rotate(180deg); }
.contact-form-wrap { transition:box-shadow .35s,border-color .35s; }
.contact-form-wrap:focus-within { box-shadow:0 0 0 4px #62c3ff26; border-color:#62c3ff; }
.motion-enabled .draft-result:not([hidden]) { animation:answer-in .35s var(--ease-out); }
.experience-section { position:relative; isolation:isolate; overflow:hidden; }
.experience-section>.container { position:relative; }
.who-brand-backdrop { position:absolute; z-index:-1; top:26px; left:50%; width:min(1350px,125%); height:auto; translate:-50% 0; opacity:.035; filter:grayscale(1) invert(1); mix-blend-mode:screen; pointer-events:none; user-select:none; }
.experience-grid { gap:54px; align-items:center; }
.experience-section .who-intro { max-width:480px; }
.who-visual { min-width:0; margin:0; }
.who-image-frame { aspect-ratio:3/2; overflow:hidden; border:1px solid #ffffff17; border-radius:20px; background:#1b2435; }
.who-image-frame img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease-out); }
.who-visual figcaption { font-size:12px; color:#aab8d4; padding:10px 2px 17px; }
.who-comparison { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.who-comparison>div { border-top:1px solid #ffffff26; padding-top:15px; }
.who-comparison>div:last-child { border-color:var(--cyan); }
.who-comparison span { display:block; font-size:12px; font-weight:700; letter-spacing:.1em; color:#aab8d4; margin-bottom:6px; }
.who-comparison>div:last-child span { color:var(--cyan); }
.who-comparison strong { font-size:17px; }
.experience-section .who-comparison p { font-size:13px; line-height:1.5; margin:5px 0 0; }
.who-story { grid-template-columns:repeat(3,1fr); gap:30px; margin-top:48px; }
.who-story>div { border-top:1px solid #ffffff1c; padding-top:22px; }
.who-story h3 { font-size:19px; line-height:1.25; }
.who-story p { font-size:15px; }
@media(hover:hover) and (pointer:fine) {
  .service:hover { transform:translateY(-6px); border-color:#b1c1ef; box-shadow:0 18px 36px #17213b0e; }
  .service:hover .service-preview { background:#edf1fc; }
  .service:hover .mini-record,.service:hover .mini-booking { transform:translateY(-3px); box-shadow:0 8px 16px #17213b10; }
  .service:hover .mini-content span { transform:translateY(-3px); }
  .service:hover .mini-content span:nth-child(2) { transition-delay:60ms; }
  .service:hover .mini-content span:nth-child(3) { transition-delay:120ms; }
  .service:hover .route-line::after { animation:route-travel .85s var(--ease-out); }
  .price-card:hover { transform:translateY(-5px); border-color:#b1c1ef; box-shadow:0 16px 35px #17213b0b; }
  .price-highlight:hover { border-color:var(--blue); box-shadow:0 18px 42px #3454d114; }
  .who-visual:hover img { transform:scale(1.035); }
}
@keyframes underline-in { from {transform:scaleX(0)} to {transform:scaleX(1)} }
@keyframes ambient-drift { from {opacity:.65;transform:translate(-25px,-14px) scale(.94)} to {opacity:1;transform:translate(25px,18px) scale(1.14)} }
@keyframes cta-halo { 0%,100% {box-shadow:0 0 0 0 #62c3ff00} 50% {box-shadow:0 0 0 8px #62c3ff10,0 10px 40px #3454d133} }
@keyframes node-current { 0%,24%,100% {background:#22334e;border-color:#5875a4;box-shadow:0 0 0 0 #62c3ff00} 8%,16% {background:#29497a;border-color:#62c3ff;box-shadow:0 0 0 6px #62c3ff0c,0 0 24px #62c3ff20} }
@keyframes connection-flow { to {background-position:8px 0} }
@keyframes connection-flow-vertical { to {background-position:0 8px} }
@keyframes route-travel { from {transform:translateX(-105%)} to {transform:translateX(105%)} }
@keyframes answer-in { from {opacity:0;transform:translateY(8px)} to {opacity:1;transform:translateY(0)} }
@media(max-width:1040px) { .experience-grid {gap:32px} .who-story {gap:22px} }
@media(max-width:760px) { .experience-grid {gap:26px} .who-story {grid-template-columns:1fr;gap:22px;margin-top:32px} .who-image-frame {border-radius:15px} .who-comparison {gap:20px} .who-comparison strong {font-size:16px} .reveal-pending {translate:0 16px} }
@media(max-width:760px) {
  .flow-steps { grid-template-columns:1fr; gap:0; }
  .flow-steps li,.flow-steps li:last-child { flex-direction:row; align-items:flex-start; gap:17px; padding-bottom:27px; min-height:101px; text-align:left; }
  .flow-steps li:last-child { padding-bottom:15px; min-height:74px; }
  .flow-steps div {padding-top:4px}
  .flow-steps li:not(:last-child)::before { left:24px; top:55px; width:1px; height:calc(100% - 62px); background:linear-gradient(180deg,#62c3ff77 50%,transparent 50%) 0 0/1px 8px repeat-y; }
  .motion-enabled .flow-steps li:not(:last-child)::before {animation-name:connection-flow-vertical}
  .flow-result,.flow-footnote {text-align:left}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .reveal-pending {opacity:1;translate:none}
  .button:hover,.button:active,.service:hover,.price-card:hover,.who-visual:hover img,.service:hover .mini-record,.service:hover .mini-booking,.service:hover .mini-content span {transform:none}
}
@media print { [data-reveal] {opacity:1!important;translate:none!important} .who-story {grid-template-columns:1fr} }