/* Global Connect Languages · servicios/languages.html. Diseño de globalconnect-languages-oficial.html (Update_24_10_2026):
   sus estilos, sin su cabecera, pie ni selector de idioma (los pone el sitio: site-chrome/). Figtree del propio sitio. */
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;ascent-override:97%;
  src:url(../fonts/figtree-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;ascent-override:97%;
  src:url(../fonts/figtree-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* ==========================================================================
   Global Connect Languages
   La tipografía replica la de globalconnect.ai (Webflow): Figtree, sin
   letter-spacing, y la misma escala de clases (.h1 / .h3 / .h4 / .h5 / .h6 /
   .body-large / .body-regular / .is-small) con sus mismos breakpoints.
   ========================================================================== */
:root{
  /* --- Escala tipográfica de globalconnect.ai (desktop) --- */
  --fs-display:56px; --lh-display:70px;  /* .h1 */
  --fs-title:40px;   --lh-title:46px;    /* .h3  — títulos de sección */
  --fs-h4:32px;      --lh-h4:36px;       /* .h4 */
  --fs-h5:24px;      --lh-h5:30px;       /* .h5  — títulos de tarjeta */
  --fs-h6:18px;      --lh-h6:24px;       /* .h6.is-bold */
  --fs-h6r:20px;     --lh-h6r:24px;      /* .h6.is-regular */
  --fs-lead:18px;    --lh-lead:28px;     /* .body-large */
  --fs-body:16px;    --lh-body:24px;     /* .body-regular */
  --fs-small:14px;   --lh-small:20px;    /* .body-regular.is-small */
  --fs-btn:14px;     --fs-btn-lg:16px;   /* .button / .button.is-large */
  --btn-pad:16px 24px; --btn-lg-pad:28px 56px;

  /* --- Colores base del sitio --- */
  --ink:#141518;          /* gris-oscuro-principal */
  --ink-2:#48494d;        /* gris-oscuro-auxiliar */
  --line:#e6e3e3;         /* gris-claro */

  /* --- Colores de Global Connect Languages --- */
  --muted:#4a5262;
  --navy:#0a0b2e;
  --navy-panel:#09193d;
  --blue:#1d5df0;
  --blue-band:#1f6bfe;
  --blue-services:#1675fd;
  --blue-soft:#5b9bff;
  --tint:#e3ecff;
  --tint-soft:#f5f8ff;
  --tint-line:#e3eaf7;
  --level-bg:#dce8ff;
  --hero-bg:#eaf0fd;
  --grey-bg:#f6f6f6;
  --tr-bg:#5f93d4;
  --shadow:0 2px 12px rgba(20,30,80,.07);

  --gutter:5%;

  /* Movimiento: mismo preset "Slide in bottom" de Webflow que usa globalconnect.ai
     (medido en la home: 100px → 0, opacidad 0 → 1, 1s, outQuart) */
  --ease-out:cubic-bezier(.25,1,.5,1);
  --reveal-y:100px; --reveal-t:1s;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{font-family:Figtree,sans-serif;font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;color:var(--ink);background:#fff}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
b,strong{font-weight:700}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:100%;max-width:1240px;margin-inline:auto}

/* --- Clases tipográficas (equivalentes a las de Webflow) --- */
.t-display{font-size:var(--fs-display);line-height:var(--lh-display);font-weight:700}
.t-title{font-size:var(--fs-title);line-height:var(--lh-title);font-weight:700}
.t-h4{font-size:var(--fs-h4);line-height:var(--lh-h4);font-weight:700}
.t-h5{font-size:var(--fs-h5);line-height:var(--lh-h5);font-weight:700}
.t-h6{font-size:var(--fs-h6);line-height:var(--lh-h6);font-weight:700}
.t-h6r{font-size:var(--fs-h6r);line-height:var(--lh-h6r);font-weight:400}
.t-lead{font-size:var(--fs-lead);line-height:var(--lh-lead);font-weight:400}
.t-body{font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400}
.t-small{font-size:var(--fs-small);line-height:var(--lh-small);font-weight:400}
.tag{display:inline-flex;padding:2px 12px;border-radius:999px;background:rgba(139,182,255,.18);color:#8bb6ff;font-size:var(--fs-small);line-height:var(--lh-small);font-weight:600}

/* --- Botones (mismas medidas que .button.is-small / .is-large del sitio) --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:var(--btn-pad);border:1px solid var(--ink);border-radius:30px;background:var(--ink);color:#fff;font-size:var(--fs-btn);line-height:20px;font-weight:400;white-space:nowrap}
.btn--outline{background:transparent;color:var(--ink)}
.btn--lg{padding:var(--btn-lg-pad);border-radius:50px;font-size:var(--fs-btn-lg)}
.btn svg{width:20px;height:20px;flex:none;transition:transform .25s var(--ease-out)}
.btn:hover svg{transform:translateX(4px)}
.btn.bump{animation:btn-bump .35s var(--ease-out)}
@keyframes btn-bump{40%{transform:scale(1.04)}}

/* Animaciones de entrada (equivalente al "Slide in bottom" de Webflow) */
.js [data-reveal]{opacity:0;transform:translateY(var(--reveal-y))}
.js [data-reveal].is-in{opacity:1;transform:none;transition:opacity var(--reveal-t) var(--ease-out) var(--d,0s),transform var(--reveal-t) var(--ease-out) var(--d,0s)}

/* ==========================================================================
   Header (idéntico al navbar de globalconnect.ai)
   ========================================================================== */

.chev{width:16px;height:16px;flex:none}

/* ==========================================================================
   Hero (versión sin panel) — la foto se ancla a la derecha y se funde con un
   fondo de color sólido; el texto siempre queda sobre color liso, nunca sobre
   la foto, así el contraste no depende de la imagen.
   Variantes: .hero--dark  → azul #092d6d (data-blue auxiliar-1), texto blanco
              .hero--light → #eaf0fd, texto oscuro
   ========================================================================== */
.hero{--hero-rgb:9,45,109;--hero-pad:max(var(--gutter),calc((100% - 1240px) / 2));position:relative;overflow:hidden;height:max(429px,29.8vw);background:rgb(var(--hero-rgb))}
.hero--dark{background:radial-gradient(ellipse 45% 100% at 0 0,rgba(38,115,249,.35),transparent 70%),rgb(var(--hero-rgb))}
.hero--light{--hero-rgb:234,240,253}
.hero-media{position:absolute;top:0;right:0;width:min(max(830px,57.6vw),calc(100% - var(--hero-pad) - 480px));height:100%}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:35% 50%}
.hero-media::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgb(var(--hero-rgb)) 0,rgba(var(--hero-rgb),.9) 5%,rgba(var(--hero-rgb),.55) 11%,rgba(var(--hero-rgb),.2) 17%,rgba(var(--hero-rgb),0) 24%)}
.hero-content{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;height:100%;padding-left:var(--hero-pad)}
.hero-content>*{max-width:480px}
.hero-logo{width:286px;height:auto}
.hero-title{margin-top:24px;font-weight:400}
.hero-title strong{display:block;font-weight:800;font-style:italic}  /* = .h1.is-extrabold-italic de la home */
.hero-text{margin-top:12px}
.hero-btns{display:flex;flex-wrap:wrap;gap:16px;margin-top:28px}
.hero--dark .hero-title{color:#fff}
.hero--dark .hero-text{color:rgba(255,255,255,.88)}
.hero--dark .btn{border-color:#fff;background:#fff;color:var(--ink)}
.hero--dark .btn--outline{background:transparent;color:#fff}
.hero--light .hero-title{color:var(--ink)}
.hero--light .hero-text{color:#4d4d4d}
.hero--dark .logo-on-light,.hero--light .logo-on-dark{display:none}
/* Cuadrícula de papel, como el fondo del hero de la home; se desvanece antes de la foto */
.hero--light::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.8) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.8) 2px,transparent 2px);background-size:48px 48px;-webkit-mask-image:linear-gradient(90deg,#000 0,#000 26%,transparent 44%);mask-image:linear-gradient(90deg,#000 0,#000 26%,transparent 44%)}

.hero--light .hero-media::before{background:linear-gradient(90deg,rgb(var(--hero-rgb)) 0,rgba(var(--hero-rgb),.8) 3%,rgba(var(--hero-rgb),.35) 8%,rgba(var(--hero-rgb),0) 14%)}

/* ==========================================================================
   Servicios
   ========================================================================== */
.services{padding:80px var(--gutter) 64px;background:var(--blue-services) url(../img/languages/fondo-servicios-b0b89280.webp) center/cover}
.services h2,.services .sub{text-align:center;color:#fff}
.services .sub{margin-top:14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.card{display:flex;flex-direction:column;align-items:center;min-height:440px;padding:40px 28px 28px;border-radius:16px;background:#fff;text-align:center}
.card-ico{width:84px;height:84px;margin-bottom:18px}
.card h3{color:var(--navy)}
.toefl-logo{width:152px;height:auto;margin-top:14px}
.card p{max-width:320px;margin-top:14px;color:var(--muted)}
.card-grow{flex:1;min-height:20px}

/* ==========================================================================
   Conoce el TOEFL ITP Digital
   ========================================================================== */
.tx{padding-bottom:72px;background:#fff;color:var(--navy)}
.tx-top{display:grid;grid-template-columns:minmax(0,1fr) min(570px,40vw);min-height:690px;padding-left:max(var(--gutter),calc((100% - 1240px) / 2));padding-right:max(0px,calc((100% - 1440px) / 2 + 38px))}
.tx-l{padding:41px 40px 40px 0}
.tx-h1{color:var(--navy)}
.tx-sub{max-width:560px;margin-top:16px;color:var(--muted)}
.tx-rows{display:flex;flex-direction:column;gap:12px;max-width:642px;margin-top:28px}
.tx-row{display:grid;grid-template-columns:48px 46px 1fr;gap:20px;align-items:center;min-height:98px;padding:14px 22px;border:1px solid var(--tint-line);border-radius:16px;background:var(--tint-soft)}
.tx-n{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--tint);color:var(--blue)}
.tx-ri{width:46px;height:46px;color:var(--blue)}
.tx-row b{display:block;color:var(--navy)}
.tx-row span:not(.tx-n){display:block;color:var(--muted)}
.tx-row em{display:block;margin-top:2px;font-style:normal;color:var(--muted)}
.tx-photo{width:100%;height:100%;min-height:690px;object-fit:cover}

.tx-band{padding-inline:var(--gutter);background:var(--blue-band)}
.tx-band-in{display:grid;grid-template-columns:repeat(3,1fr);min-height:138px}
.tx-st{position:relative;display:flex;align-items:center;justify-content:center;gap:26px;padding-block:16px;color:#fff}
.tx-st+.tx-st::before{content:"";position:absolute;left:0;top:30px;bottom:30px;width:1px;background:rgba(255,255,255,.3)}
.tx-sc{display:flex;align-items:center;justify-content:center;flex:none;width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.2)}
.tx-sc svg{width:38px;height:38px}
.tx-st div>b,.tx-st div>span{display:block}
.tx-st b{font-variant-numeric:tabular-nums}

.tx-in{padding-inline:var(--gutter)}
.tx-h2{margin-top:54px;color:var(--navy)}
.tx-lvs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.tx-lv{min-height:152px;padding:18px 12px 16px;border:1px solid #dfe7f6;border-radius:12px;background:var(--level-bg);box-shadow:var(--shadow);text-align:center}
.tx-lv span{display:block;color:var(--muted)}
.tx-lv b,.tx-lv strong{display:block;color:var(--navy)}
.tx-lv>i{display:block;height:1px;margin:8px 28px 10px;background:#d9dfec}
/* Barra de rango: dónde cae cada nivel dentro de la escala 343–677 */
.lv-bar{position:relative;height:6px;margin:14px 20px 0;border-radius:6px;background:rgba(29,93,240,.14);overflow:hidden}
.lv-bar i{position:absolute;top:0;bottom:0;left:var(--from);width:calc(var(--to) - var(--from));border-radius:inherit;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease-out) calc(var(--d,0s) + .35s)}
.tx-lv.is-in .lv-bar i{transform:none}
.lv-note{margin-top:14px;color:var(--muted)}

.tx-sp{display:grid;grid-template-columns:100px 1fr 330px;gap:38px;align-items:center;min-height:230px;margin-top:34px;padding:28px 40px 28px 38px;border-radius:18px;background:var(--navy-panel)}
.tx-spc{display:flex;align-items:center;justify-content:center;width:100px;height:100px;border-radius:50%;background:var(--blue-band);color:#fff}
.tx-spc svg{width:54px;height:54px}
.tx-spt h3{margin-top:10px;color:#fff}
.tx-spt .m{margin-top:8px;color:#fff}
.tx-spt .s{margin-top:6px;color:#b6c3e0}
.tx-spi{width:330px;height:auto;padding-left:30px;border-left:1px solid rgba(255,255,255,.25);-webkit-mask-image:linear-gradient(to right,#000 85%,transparent);mask-image:linear-gradient(to right,#000 85%,transparent)}

.tx-res{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.tx-rc{display:flex;align-items:center;gap:28px;min-height:136px;padding:20px 28px;border:1px solid var(--tint-line);border-radius:14px;background:#fff;box-shadow:var(--shadow);color:var(--navy)}
.tx-rci{display:flex;align-items:center;justify-content:center;flex:none;width:88px;height:88px;border-radius:50%;background:var(--tint);color:var(--blue)}
.tx-rci svg{width:44px;height:44px}

/* ==========================================================================
   Próximas fechas
   ========================================================================== */
.dates{position:relative;padding:56px var(--gutter) 72px;background:var(--grey-bg)}
.dates::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.05),transparent 28px)}
.dates-in{position:relative;max-width:1160px;margin-inline:auto;text-align:center}
.dates .sub{margin-top:6px}
.pill{display:inline-block;margin-top:14px;padding:6px 20px;border-radius:999px;background:#e5ebf8}
.dgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px;text-align:left}
.dcard{display:flex;flex-direction:column;padding:34px 30px 28px;border-radius:16px;background:#fff;box-shadow:0 2px 14px rgba(20,30,80,.08)}
.dhead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;min-height:72px}
.price{flex:none;text-align:right}
.price b{display:block;color:var(--blue)}
.price span{display:block;margin-top:2px;color:var(--muted)}
.inc{margin-top:14px}
.checks{min-height:158px;margin-top:8px}
.checks li{display:flex;align-items:center;gap:14px;padding:3px 0}
.checks svg{width:24px;height:24px;flex:none}
.sel{margin-bottom:12px}
.opts{display:flex;flex-direction:column;gap:14px;min-width:0;margin-top:22px;border:0}
.opt{position:relative;display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;padding:14px 18px 14px 20px;border:1px solid #dfe6f5;border-radius:14px;background:#f7f9fe;cursor:pointer;transition:border-color .15s,background-color .15s}
.opt input{position:absolute;opacity:0;pointer-events:none}
.radio{position:relative;width:24px;height:24px;margin-top:2px;border:1.6px solid #35405f;border-radius:50%;background:#fff}
.opt:has(input:checked){border-color:var(--blue);background:#eef3ff}
.opt:has(input:checked) .radio{border-color:var(--blue)}
.radio::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--blue);transform:scale(0);transition:transform .25s var(--ease-out)}
.opt:has(input:checked) .radio::after{transform:scale(1)}
.opt:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:2px}
.rows{display:flex;flex-direction:column;gap:4px}
.rows>span{display:flex;align-items:center;gap:14px}
.rows svg{width:24px;height:24px;flex:none;color:var(--blue)}
.note{margin-top:14px;color:var(--muted);text-align:center}
.date-hint{display:none;margin-top:12px;color:#c62828;text-align:center}
.dcard.needs-date .date-hint{display:block}
.dcard.needs-date .opt{border-color:#e7a5a5}
.dcard .btn{align-self:center;margin-top:auto}
.dcard .card-grow{flex:1;min-height:18px}

/* ==========================================================================
   Talleres
   ========================================================================== */
.wk{padding:56px var(--gutter) 80px;background:#fff}
.wk h2,.wk-sub,.wk-dur{text-align:center}
.wk-sub{margin-top:4px;color:var(--muted)}
.wk-dur{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px;color:var(--blue);font-weight:600}
.wk-dur svg{width:30px;height:30px;flex:none}
.wk-meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px 28px;margin-top:10px}
.wk-meta .wk-dur{margin:0}
.wk-meta-sep{width:1px;height:32px;background:var(--tint-line);flex:none}
.wk-min{display:flex;align-items:center;gap:12px;margin:0;padding:10px 22px;border-radius:999px;background:var(--tint);color:var(--blue);font-weight:500}
.wk-min svg{width:30px;height:30px;flex:none}
@media (max-width:720px){.wk-meta-sep{display:none}}
.wk-card{margin-top:24px;padding:16px 16px 28px;border:1px solid #e8ebf2;border-radius:18px;background:#fff;box-shadow:0 4px 22px rgba(20,30,80,.08)}
.wk-top{display:grid;grid-template-columns:minmax(0,648px) 1fr;gap:44px;align-items:center}
.wk-photo{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:12px}
.wk-list{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.wk-list li{display:flex;align-items:center;gap:16px;color:#2c3358}
.wk-ic{display:flex;align-items:center;justify-content:center;flex:none;width:52px;height:52px;border-radius:50%;background:var(--tint);color:var(--blue)}
.wk-ic svg{width:28px;height:28px}
.wk-p{max-width:440px;margin-top:12px;color:var(--muted)}
.wk-plans{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;padding-top:16px;border-top:1px solid #e8ebf2}
.wk-plan{display:flex;align-items:center;gap:12px;min-height:100px;padding:12px 20px 12px 18px;border:1px solid #e1e8f7;border-radius:12px;background:var(--tint-soft)}
.wk-pc{display:flex;align-items:center;justify-content:center;flex:none;width:56px;height:56px;border-radius:50%;background:var(--tint);color:var(--blue)}
.wk-pc svg{width:30px;height:30px}
.wk-plus{margin:0 -4px;color:var(--blue)}
.wk-pt{flex:1;min-width:0}
.wk-pt b{display:block}
.wk-pt span{display:block;margin-top:3px;color:#2c3358}
.wk-pr{flex:none;padding-left:16px;border-left:1px solid #d5dcee;color:var(--blue);white-space:nowrap}
.wk-cta-t{margin-top:20px;text-align:center}
.wk-card .btn{display:flex;width:max-content;margin:12px auto 0}

/* ==========================================================================
   Traducciones
   ========================================================================== */
.tr{padding:56px var(--gutter) 52px;color:#fff;background:var(--tr-bg);background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 51px,rgba(255,255,255,.1) 51px,rgba(255,255,255,.1) 52px),radial-gradient(ellipse at 20% 0,rgba(255,255,255,.12),transparent 60%)}
.tr h2,.tr-sub{text-align:center}
.tr-sub{max-width:900px;margin:6px auto 0}
.tr-top{display:grid;grid-template-columns:minmax(0,700px) 1fr;gap:48px;align-items:center;margin-top:26px}
.tr-photo{width:100%;aspect-ratio:700/336;object-fit:cover;object-position:50% 38%;border-radius:14px}
.tr-r h3{max-width:420px}
.tr-p{margin-top:10px}
.tr-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.tr-list li{display:flex;align-items:center;gap:16px}
.tr-ic{display:flex;align-items:center;justify-content:center;flex:none;width:52px;height:52px;border-radius:50%;background:#fff;color:var(--blue)}
.tr-ic svg{width:28px;height:28px}
.tr-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:22px}
.tr-c{display:flex;align-items:center;gap:18px;min-height:154px;padding:24px 22px;border-radius:12px;background:#fff;box-shadow:0 3px 14px rgba(10,30,80,.15);color:var(--ink)}
.tr-cc{display:flex;align-items:center;justify-content:center;flex:none;width:80px;height:80px;border-radius:50%;background:var(--tint);color:var(--blue)}
.tr-cc svg{width:40px;height:40px}
.tr-c p{margin-top:6px;color:var(--muted)}
.tr-steps{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:20px}
.tr-s{display:flex;align-items:center;gap:20px}
.tr-s i{display:flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;font-style:normal}
.tr-ln{width:130px;height:1px;margin:0 12px;background:rgba(255,255,255,.55)}
.tr .btn{display:flex;width:max-content;margin:20px auto 0;border-color:#000;background:#000}
.tr-note{margin-top:10px;text-align:center}

/* ==========================================================================
   Preguntas frecuentes — mismo patrón de acordeón que la home y Mobility
   ========================================================================== */
.faq{padding:80px var(--gutter);background:#fff}
.faq-in{max-width:1000px;margin-inline:auto}
.faq h2,.faq .sub{text-align:center}
.faq .sub{margin-top:8px;color:var(--ink-2)}
.faq-list{margin-top:40px;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:24px 0;text-align:left;color:var(--ink)}
.faq-q svg{width:20px;height:20px;flex:none;transition:transform .35s var(--ease-out)}
.faq-q[aria-expanded="true"] svg{transform:rotate(180deg)}
.faq-a{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .45s var(--ease-out),visibility .45s}
.faq-a>div{overflow:hidden}
.faq-a p{padding:0 48px 24px 0;font-weight:300;color:var(--ink-2)}
.faq-a p:not(:last-child){padding-bottom:12px}
.faq-types{padding:0 48px 12px 22px;list-style:disc;font-weight:300;color:var(--ink-2)}
.faq-types li+li{margin-top:6px}
.faq-types b{font-weight:600;color:var(--ink)}
.faq-item.open .faq-a{grid-template-rows:1fr;visibility:visible}

/* ==========================================================================
   CTA final — mismo esquema que el cierre de la home (texto + foto, fondo gris)
   ========================================================================== */
.cta{padding:100px var(--gutter);background:#f7f7f7}
.cta-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.cta p{margin-top:24px;color:var(--ink-2)}
.cta .btn{margin-top:40px}
.cta-img{width:100%;aspect-ratio:829/586;object-fit:cover;border-radius:16px}

/* ==========================================================================
   Footer (idéntico al de globalconnect.ai)
   ========================================================================== */
.divider-gradient{height:12px;background-image:linear-gradient(90deg,#62de1a,#ffdd32 29%,#32e8df 64%,#2673f9)}

/* Laptops pequeñas / iPad horizontal: las 7 columnas del footer no caben */

/* ==========================================================================
   Tablet — mismos cambios de escala que el sitio en ≤991px
   ========================================================================== */
@media (max-width:991px){
  :root{
    --fs-display:40px; --lh-display:50px;
    --fs-title:32px;   --lh-title:40px;
    --fs-h4:24px;      --lh-h4:30px;
    --fs-h5:18px;      --lh-h5:24px;
    --fs-h6:16px;      --lh-h6:22px;
    --fs-h6r:18px;     --lh-h6r:24px;
    --fs-lead:16px;    --lh-lead:24px;
    --fs-body:14px;    --lh-body:22px;
    --fs-small:12px;   --lh-small:18px;
    --fs-btn:12px;     --btn-pad:10px 20px; --btn-lg-pad:16px 40px;
  }

  html{scroll-padding-top:80px}
  
  
  
  
  
  
  
  
  
  
  
  

  .hero{height:auto}
  .hero-content{height:auto;padding:48px var(--gutter) 40px}
  .hero-media{position:relative;width:100%;height:auto;aspect-ratio:1319/682}
  .hero .hero-media::before{background:linear-gradient(180deg,rgb(var(--hero-rgb)) 0,rgba(var(--hero-rgb),.6) 8%,rgba(var(--hero-rgb),0) 22%)}
  .hero-logo{width:240px}
  .hero--light::before{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 30%,transparent 55%);mask-image:linear-gradient(180deg,#000 0,#000 30%,transparent 55%)}
  .tr,.faq{padding-block:64px}
  .cta{padding-block:64px}
  .cta-in{grid-template-columns:1fr;gap:40px}
  .faq-q{padding:20px 0}
  .faq-a p{padding-right:0}
  .faq-types{padding-right:0}

  .cards{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .card{min-height:0}

  .tx-top{grid-template-columns:1fr;min-height:0;padding:0}
  .tx-l{padding:48px var(--gutter) 40px}
  .tx-rows{max-width:none}
  .tx-photo{min-height:0;height:auto;aspect-ratio:4/3;object-position:50% 30%}
  .tx-sc{width:64px;height:64px}
  .tx-sc svg{width:30px;height:30px}
  .tx-st{gap:16px}
  .tx-sp{grid-template-columns:80px 1fr;gap:24px;padding:28px}
  .tx-spc{width:80px;height:80px}
  .tx-spc svg{width:44px;height:44px}
  .tx-spi{display:none}
  .tx-rci{width:72px;height:72px}
  .tx-rci svg{width:36px;height:36px}

  .dgrid{grid-template-columns:1fr;max-width:640px;margin-inline:auto}

  .wk-top,.tr-top{grid-template-columns:1fr;gap:24px}
  .wk-r{padding-inline:8px}
  .wk-plans{grid-template-columns:1fr}

  .tr-cards{grid-template-columns:1fr;max-width:640px;margin-inline:auto}
  .tr-c{min-height:0}

  
  
}

/* ==========================================================================
   Móvil grande
   ========================================================================== */
@media (max-width:767px){
  .tx-band-in{grid-template-columns:1fr;padding-block:12px}
  .tx-st{justify-content:flex-start;padding:14px 0}
  .tx-st+.tx-st::before{left:0;right:0;top:0;bottom:auto;width:auto;height:1px}
  .tx-lvs{grid-template-columns:1fr 1fr}
  .tx-res{grid-template-columns:1fr}
  .tx-rc{gap:20px;min-height:0}
  .tr-steps{flex-direction:column;align-items:flex-start;width:max-content;margin-inline:auto}
  .tr-ln{width:1px;height:16px;margin:0 0 0 20px}
  
  
}

/* ==========================================================================
   Móvil — mismos cambios de escala que el sitio en ≤479px
   ========================================================================== */
@media (max-width:479px){
  :root{
    --fs-display:26px; --lh-display:30px;
    --fs-title:24px;   --lh-title:30px;
    --fs-h4:24px;      --lh-h4:30px;
    --fs-h5:18px;      --lh-h5:24px;
    --fs-h6:16px;      --lh-h6:20px;
    --fs-h6r:16px;     --lh-h6r:20px;
    --fs-lead:14px;    --lh-lead:20px;
    --fs-body:14px;    --lh-body:20px;
    --btn-pad:12px 24px; --btn-lg-pad:20px 30px;
  }
  
  
  
  .hero-logo{width:200px}
  .hero-btns{gap:10px}
  .card{padding:32px 20px 24px}
  .tx-row{grid-template-columns:40px 1fr;gap:14px;padding:14px 16px}
  .tx-n{width:40px;height:40px}
  .tx-ri{display:none}
  .tx-lv i{margin-inline:16px}
  .tx-sp{grid-template-columns:1fr;gap:16px;padding:24px}
  .tx-spc{width:64px;height:64px}
  .tx-spc svg{width:36px;height:36px}
  .tx-rc{padding:18px 20px}
  .tx-rci{width:56px;height:56px}
  .tx-rci svg{width:28px;height:28px}
  .dcard{padding:24px 18px}
  .dhead{flex-direction:column;min-height:0}
  .price{text-align:left}
  .checks{min-height:0}
  .opt{grid-template-columns:28px 1fr;gap:10px;padding:12px 14px}
  .rows>span{gap:10px}
  .rows svg{width:20px;height:20px}
  .btn{max-width:100%;white-space:normal;text-align:center}
  .wk-plan{flex-wrap:wrap}
  .wk-pt{flex:1 1 100%}
  .wk-pr{width:100%;padding:10px 0 0;border-left:0;border-top:1px solid #d5dcee}
  .tr-c{align-items:flex-start;padding:20px 18px}
  .tr-cc{width:56px;height:56px}
  .tr-cc svg{width:28px;height:28px}
  
  
}

/* ==========================================================================
   Alianza Fulbright Perú (propuesta)
   ========================================================================== */
.fb-new{display:inline-flex;align-items:center;padding:3px 10px;border-radius:6px;background:#ffd23f;color:var(--navy);font-size:12px;line-height:18px;font-weight:700;letter-spacing:.12em}

/* Franja bajo el hero: marquee horizontal continuo */
.fb-trust{position:relative;overflow:hidden;background:#fff;border-block:1px solid var(--line)}
.fb-trust::before,.fb-trust::after{content:"";position:absolute;top:0;bottom:0;z-index:1;width:min(12vw,140px);pointer-events:none}
.fb-trust::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.fb-trust::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.fb-trust-in{display:block;color:var(--ink)}
.fb-tk-track{display:flex;width:max-content;animation:fb-ticker var(--tk-t,75s) linear infinite}
.fb-tk-group{display:flex;flex:none}
.fb-tk-item{display:flex;align-items:center;flex:none;gap:20px;min-height:76px;padding-block:12px;font-size:var(--fs-h6r);line-height:24px;white-space:nowrap}
.fb-tk-item img{width:auto;height:38px;flex:none}
.fb-trust-cta{display:inline-flex;align-items:center;gap:6px;padding-left:20px;border-left:1px solid #d5dcee;color:var(--blue);font-weight:500}
.fb-trust-cta svg{width:18px;height:18px}
.fb-tk-sep{width:0;height:0;margin-inline:47px;flex:none}
@keyframes fb-ticker{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* Sección */
.fb{position:relative;overflow:hidden;padding:88px var(--gutter) 72px;color:#fff;background:radial-gradient(ellipse at 85% 10%,rgba(91,155,255,.55),transparent 55%),linear-gradient(135deg,#071640 0%,#0d2a7a 55%,var(--blue-band) 100%)}
.fb::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(to bottom,#000,transparent 70%);mask-image:linear-gradient(to bottom,#000,transparent 70%)}
.fb-in{position:relative}
.fb-top{display:grid;grid-template-columns:1fr minmax(0,500px);gap:56px;align-items:center}
.fb-eye{display:flex;align-items:center;gap:12px;color:#9cc2ff;font-size:14px;line-height:18px;font-weight:700;letter-spacing:.22em}
.fb-h2{margin-top:14px;max-width:640px;color:#fff}
.fb-h2 em{font-style:normal;color:#ffd23f}
.fb-p{margin-top:18px;max-width:600px;color:#d7e3ff}
.fb-p b{color:#fff}
.fb-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.fb-chips li{display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 10px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);font-size:15px;line-height:20px;font-weight:500}
.fb-chips svg{width:20px;height:20px;flex:none}
.fb-btns{display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px;margin-top:32px}
.fb .fb-btn{background:#fff;border-color:#fff;color:var(--ink)}
.fb-link{display:inline-flex;align-items:center;gap:8px;padding-bottom:2px;border-bottom:1.5px solid rgba(255,255,255,.5);font-size:var(--fs-btn-lg);font-weight:600}
.fb-link svg{width:20px;height:20px;transition:transform .25s var(--ease-out)}
.fb-link:hover svg{transform:translateX(4px)}

.fb-lock{position:relative;display:flex;flex-direction:column;align-items:center;padding:48px 40px 32px;border-radius:20px;background:#fff;color:var(--ink);text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.35),0 0 0 8px rgba(255,255,255,.08);rotate:-1.5deg}
.fb-tag{position:absolute;top:-17px;left:50%;translate:-50% 0;display:inline-flex;align-items:center;height:34px;padding:0 18px;border-radius:999px;background:#ffd23f;color:var(--navy);font-size:14px;font-weight:700;white-space:nowrap;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.fb-gc{width:100%;max-width:400px}
.fb-x{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:22px 0;border-radius:50%;background:#eef3ff;color:var(--blue)}
.fb-x svg{width:20px;height:20px}
.fb-logo{width:300px}
.fb-cap{width:100%;margin-top:24px;padding-top:18px;border-top:1px solid #e8ebf2;color:var(--muted)}

.fb-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.fb-c{display:flex;align-items:flex-start;gap:18px;padding:26px 24px;border-radius:14px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}
.fb-ci{display:flex;align-items:center;justify-content:center;width:64px;height:64px;flex:none;border-radius:50%;background:var(--tint);color:var(--blue)}
.fb-ci svg{width:32px;height:32px}
.fb-c p{margin-top:6px;color:var(--muted)}

.fb-tbl{margin-top:20px;overflow:hidden;border-radius:14px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}
.fb-tbl h3{padding:22px 28px 16px}
.fb-row{display:grid;grid-template-columns:240px 1fr 300px;gap:16px;align-items:center;padding:16px 28px;border-top:1px solid #e8ebf2;color:var(--muted);font-size:var(--fs-body);line-height:var(--lh-body)}
.fb-row b{color:var(--ink)}
.fb-head{padding-block:12px;border-top:0;background:var(--navy-panel);color:#d7e0f3;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.fb-gcrow{background:#eef3ff;box-shadow:inset 4px 0 0 var(--blue)}
.fb-gcrow b{color:#1d4fb8}
.fb-legal{margin-top:14px;text-align:center;color:#9fb3dc}

/* Variante clara de la sección Fulbright */
.fb{color:var(--navy);background:radial-gradient(ellipse 60% 70% at 100% 0,rgba(255,255,255,.9),transparent 60%),radial-gradient(ellipse 70% 60% at 0 100%,rgba(173,203,255,.45),transparent 65%),linear-gradient(160deg,#eef4ff 0%,#e3edff 55%,#dce8ff 100%)}
.fb::before{background-image:radial-gradient(rgba(29,93,240,.18) 1.2px,transparent 1.2px);background-size:18px 18px;-webkit-mask-image:radial-gradient(ellipse 22% 45% at 0 55%,#000,transparent 75%);mask-image:radial-gradient(ellipse 22% 45% at 0 55%,#000,transparent 75%)}
.fb::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 90% 40% at 20% 105%,rgba(255,255,255,.55),transparent 60%),radial-gradient(ellipse 70% 30% at 90% 40%,rgba(255,255,255,.35),transparent 70%)}
.fb-eye{color:var(--navy)}
.fb-h2{color:var(--navy)}
.fb-h2 em{color:var(--blue)}
.fb-p{color:#3a4257}
.fb-p b{color:var(--navy)}
.fb-chips li{background:rgba(255,255,255,.75);border-color:#cfdcf6;color:var(--ink)}
.fb .fb-btn{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:500;box-shadow:0 8px 20px rgba(20,21,24,.22)}
.fb-link{color:var(--ink);border-bottom-color:var(--ink)}
.fb-lock{box-shadow:0 24px 50px rgba(29,93,240,.16),0 0 0 8px rgba(255,255,255,.55);--tilt:-1.5deg;rotate:var(--tilt)}
/* The card hangs from its tag like a card pinned to a wall: when it comes into view it swings and settles at its
   resting tilt (--tilt) within 2s, each swing smaller than the last. It uses rotate, not transform, so the entrance
   animation ([data-reveal]) still works. */
.fb-lock{transform-origin:50% 0}
.js .fb-lock.is-in{animation:fb-swing 2s ease-in-out}
html.gca-pause-anims .fb-lock.is-in{animation:none}  /* accessibility plugin: «stop animations» */
@keyframes fb-swing{
  0%{rotate:calc(var(--tilt) - 4deg)}
  20%{rotate:calc(var(--tilt) + 3deg)}
  40%{rotate:calc(var(--tilt) - 1.8deg)}
  58%{rotate:calc(var(--tilt) + 1deg)}
  76%{rotate:calc(var(--tilt) - .45deg)}
  90%{rotate:calc(var(--tilt) + .15deg)}
  100%{rotate:var(--tilt)}
}
.fb-c,.fb-tbl{box-shadow:0 6px 24px rgba(20,50,120,.08)}
.fb-legal{color:#6b7387}

@media (max-width:991px){
  .fb{padding-block:64px}
  .fb-top{grid-template-columns:1fr;gap:56px}
  .fb-lock{max-width:500px;width:100%;margin-inline:auto}
  .fb-cards{grid-template-columns:1fr;max-width:640px;margin-inline:auto;margin-top:40px}
  .fb-tbl{max-width:640px;margin-inline:auto}
  .fb-head{display:none}
  .fb-row{grid-template-columns:1fr 1fr;gap:10px 16px;padding:18px 24px}
  .fb-row>span::before{content:attr(data-l);display:block;font-size:11px;line-height:16px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#8a93a6}
  .fb-tbl h3{padding:20px 24px 14px}
}
@media (max-width:767px){
  .fb-tk-item{gap:14px;min-height:64px}
  .fb-tk-sep{margin-inline:31px}
  .fb-trust{--tk-t:64s}
}
@media (max-width:479px){
  .fb-eye{letter-spacing:.16em;font-size:12px}
  .fb-chips li{font-size:13px}
  .fb-lock{padding:44px 22px 24px;--tilt:0deg}
  .fb-gc{max-width:290px}
  .fb-logo{width:230px}
  .fb-c{padding:20px 18px}
  .fb-ci{width:56px;height:56px}
  .fb-ci svg{width:28px;height:28px}
  .fb-row{grid-template-columns:1fr}
  .fb-tk-item{font-size:15px}
  .fb-tk-item img{height:30px}
  .fb-trust-cta{padding-left:14px}
}

/* Sin animaciones para quien lo pide en su sistema */
@media (prefers-reduced-motion:reduce){
  .fb-tk-track{animation:none;width:100%}
  .fb-tk-group{flex:1 1 auto;width:100%}
  .fb-tk-group[aria-hidden],.fb-tk-item+.fb-tk-item,.fb-tk-sep,.fb-trust::before,.fb-trust::after{display:none}
  .fb-tk-item{flex:1 1 auto;min-width:0;flex-wrap:wrap;justify-content:center;gap:10px 16px;white-space:normal;padding-inline:var(--gutter);text-align:center}
  html{scroll-behavior:auto}
  .js [data-reveal]{opacity:1;transform:none;transition:none}
  .lv-bar i{transform:none;transition:none}
  .faq-a,.faq-q svg,.radio::after,.btn svg{transition:none}
  .btn.bump{animation:none}
  .js .fb-lock.is-in{animation:none}
}