/* bridge-portal.css — BuscasTrabajo · Portal Puente
   Design system aligned to usa.buscastrabajo.info ("Claude Design").
   Ports directly into the astra-child theme. */

/* ---------- Tokens ---------- */
:root{
  --brand-blue:#2563EB;
  --brand-blue-700:#1D4ED8;
  --brand-blue-900:#1E3A8A;
  --brand-yellow:#FAD636;

  --bg:#f5f8fd;
  --surface:#ffffff;
  --surface-2:#eef3fb;
  --ink:#18222f;
  --muted:#5b6878;
  --line:#e6ecf4;
  --footer:#374151;

  --r-card:18px;
  --r-pill:999px;
  --shadow-sm:0 1px 2px rgba(24,34,47,.06);
  --shadow-card:0 14px 34px -20px rgba(24,34,47,.35);
  --maxw:1160px;
  --font:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
html[data-mode="dark"]{
  --brand-blue:#3b82f6;
  --brand-blue-700:#2563EB;
  --brand-blue-900:#bfdbfe;
  --bg:#0d1320;
  --surface:#141d2e;
  --surface-2:#1b2740;
  --ink:#eaf1fb;
  --muted:#9fb0c6;
  --line:#26334b;
  --footer:#0a0f1a;
  --shadow-card:0 14px 34px -18px rgba(0,0,0,.6);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);background:var(--bg);color:var(--ink);
  -webkit-font-smoothing:antialiased;line-height:1.55;transition:background .25s,color .25s;
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
img{max-width:100%;display:block;}
.bt-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;width:100%;}
.bt-section{padding:64px 0;}
.bt-eyebrow{font-weight:700;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--brand-blue);margin:0 0 12px;}
.bt-h2{font-weight:800;font-size:clamp(26px,3.2vw,38px);line-height:1.12;margin:0 0 12px;letter-spacing:-.02em;text-wrap:balance;}
.bt-lead{font-size:17px;color:var(--muted);margin:0;max-width:60ch;}
.bt-center{text-align:center;}
.bt-center .bt-lead{margin-inline:auto;}

/* ---------- Buttons ---------- */
.bt-btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px;border-radius:var(--r-pill);padding:12px 22px;transition:.16s;white-space:nowrap;border:1.5px solid transparent;}
.bt-btn--primary{background:var(--brand-blue);color:#fff;box-shadow:0 12px 22px -12px var(--brand-blue);}
.bt-btn--primary:hover{background:var(--brand-blue-700);transform:translateY(-1px);}
.bt-btn--yellow{background:var(--brand-yellow);color:#3a2f00;}
.bt-btn--yellow:hover{filter:brightness(1.04);transform:translateY(-1px);}
.bt-btn--ghost{background:var(--surface);color:var(--brand-blue);border-color:var(--line);}
.bt-btn--ghost:hover{border-color:var(--brand-blue);}
.bt-btn--sm{padding:9px 16px;font-size:14px;}

/* ---------- Header ---------- */
.bt-header{position:sticky;top:0;z-index:60;background:var(--brand-blue);color:#fff;box-shadow:0 2px 14px rgba(13,31,66,.18);}
html[data-mode="dark"] .bt-header{background:var(--brand-blue-900);background:#101a2e;}
.bt-header__inner{display:flex;align-items:center;gap:18px;height:70px;}
.bt-logo{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:20px;letter-spacing:-.01em;}
.bt-logo__mark{width:30px;height:30px;border-radius:9px;background:#fff;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.bt-logo__b{color:#fff;}
.bt-logo__t{color:var(--brand-yellow);}
.bt-nav{display:flex;align-items:center;gap:24px;margin-left:8px;}
.bt-nav a{font-weight:600;font-size:14.5px;color:rgba(255,255,255,.86);transition:.15s;}
.bt-nav a:hover{color:#fff;}
.bt-header__right{margin-left:auto;display:flex;align-items:center;gap:12px;}

/* compact country dropdown */
.bt-cselect{position:relative;}
.bt-cselect__btn{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.28);border-radius:var(--r-pill);padding:8px 14px;font-weight:600;font-size:14px;}
.bt-cselect__btn:hover{background:rgba(255,255,255,.22);}
.bt-cselect__chev{font-size:11px;opacity:.8;}
.bt-cselect__menu{position:absolute;right:0;top:calc(100% + 8px);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-card);padding:8px;width:260px;max-height:340px;overflow:auto;display:none;}
.bt-cselect.is-open .bt-cselect__menu{display:block;}
.bt-cselect__item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;border-radius:10px;font-size:14.5px;font-weight:600;}
.bt-cselect__item:hover{background:var(--surface-2);}
.bt-cselect__item[disabled]{opacity:.55;cursor:not-allowed;}
.bt-cselect__flag{flex:none;width:26px;height:19px;border-radius:4px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.25);}
.bt-cselect__soon{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted);background:var(--surface-2);padding:2px 8px;border-radius:var(--r-pill);}

/* mode toggle */
.bt-modebtn{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.28);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:16px;}
.bt-modebtn:hover{background:rgba(255,255,255,.24);}

.bt-burger{display:none;flex-direction:column;gap:5px;padding:8px;}
.bt-burger span{width:22px;height:2.5px;background:#fff;border-radius:2px;}

/* ---------- Geo banner ---------- */
.bt-geo{background:linear-gradient(90deg,rgba(37,99,235,.10),rgba(250,214,54,.16));border-bottom:1px solid var(--line);}
html[data-mode="dark"] .bt-geo{background:linear-gradient(90deg,rgba(59,130,246,.16),rgba(250,214,54,.10));}
.bt-geo__inner{display:flex;align-items:center;gap:14px;padding:12px 24px;}
.bt-geo__pin{font-size:20px;flex:none;}
.bt-geo__text{margin:0;font-size:14.5px;color:var(--ink);flex:1;min-width:0;}
.bt-geo__text strong{font-weight:800;}
.bt-geo__actions{display:flex;align-items:center;gap:10px;flex:none;}
.bt-geo__alt{font-size:13px;color:var(--muted);text-decoration:underline;text-underline-offset:2px;}
.bt-geo__alt:hover{color:var(--ink);}
.bt-geo__close{width:30px;height:30px;border-radius:50%;color:var(--muted);font-size:14px;}
.bt-geo__close:hover{background:var(--surface-2);color:var(--ink);}
.bt-geo[hidden]{display:none;}

/* ---------- Hero ---------- */
.bt-hero{padding:52px 0 40px;}
.bt-hero__inner{display:grid;grid-template-columns:1.12fr .88fr;gap:30px;align-items:center;}
.bt-hero__copy{text-align:left;}
.bt-hero__chip{display:inline-flex;align-items:center;gap:8px;background:rgba(37,99,235,.10);color:var(--brand-blue);font-weight:800;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;padding:7px 14px;border-radius:999px;margin:0 0 18px;white-space:nowrap;}
.bt-hero__chip i{width:8px;height:8px;border-radius:50%;background:var(--brand-blue);display:inline-block;}
html[data-mode="dark"] .bt-hero__chip{background:rgba(59,130,246,.18);}
.bt-hero__trust{margin:22px 0 0;font-size:14.5px;color:var(--muted);font-weight:600;display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.bt-hero__trust strong{color:var(--ink);font-weight:800;}
.bt-hero__trust .sep{width:4px;height:4px;border-radius:50%;background:var(--line);display:inline-block;}
.bt-hero__eyebrow{font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-blue);margin:0 0 16px;}
.bt-hero__title{font-weight:800;font-size:clamp(34px,5.4vw,60px);line-height:1.02;letter-spacing:-.03em;margin:0 0 18px;max-width:none;}
.bt-hero__title .hl{color:var(--brand-blue);}
.bt-hero__title .hl-y{background:linear-gradient(180deg,transparent 62%,var(--brand-yellow) 62%);padding:0 .1em;}
.bt-hero__lead{font-size:18px;color:var(--muted);max-width:48ch;margin:0 0 26px;}
.bt-hero__cta{display:flex;gap:12px;flex-wrap:wrap;}
.bt-hero__art{position:relative;display:flex;justify-content:center;align-items:flex-end;min-height:330px;}
.bt-hero__artbg{position:absolute;width:330px;height:330px;border-radius:50%;background:radial-gradient(circle, rgba(250,214,54,.34) 0%, rgba(250,214,54,0) 68%);top:50%;left:50%;transform:translate(-50%,-48%);}
.bt-hero__av{position:relative;width:300px;max-width:100%;height:auto;filter:drop-shadow(0 20px 32px rgba(13,31,66,.28));}

/* avatar volador como acompañante interactivo del mapa */
.bt-mapbuddy{position:absolute;width:96px;height:auto;left:78%;top:6%;opacity:0;transform:translate(-50%,-50%) scale(.7);transition:left .5s cubic-bezier(.3,.8,.3,1),top .5s cubic-bezier(.3,.8,.3,1),opacity .25s,transform .3s;pointer-events:none;z-index:6;filter:drop-shadow(0 10px 16px rgba(13,31,66,.3));}
.bt-map.is-buddy .bt-mapbuddy{opacity:1;transform:translate(-50%,-50%) scale(1);}
.bt-mapbuddy--idle{animation:btFloat 3.2s ease-in-out infinite;}
@keyframes btFloat{0%,100%{transform:translate(-50%,-50%) translateY(0) scale(1);}50%{transform:translate(-50%,-50%) translateY(-8px) scale(1);}}

/* ---------- Mascota / ayudante BT ---------- */
.bt-helper{display:flex;align-items:center;gap:22px;max-width:780px;margin:0 auto;background:linear-gradient(120deg, rgba(37,99,235,.07), rgba(250,214,54,.12));border:1.5px solid var(--line);border-radius:20px;padding:16px 26px 16px 16px;}
.bt-helper__av{width:140px;flex:none;align-self:flex-end;filter:drop-shadow(0 10px 16px rgba(13,31,66,.22));}
.bt-helper__bubble{flex:1;position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:16px 20px;box-shadow:var(--shadow-sm);}
.bt-helper__bubble::before{content:"";position:absolute;left:-9px;top:50%;transform:translateY(-50%) rotate(45deg);width:16px;height:16px;background:var(--surface);border-left:1.5px solid var(--line);border-bottom:1.5px solid var(--line);}
.bt-helper__name{font-weight:800;font-size:12px;color:var(--brand-blue);text-transform:uppercase;letter-spacing:.06em;margin:0 0 4px;}
.bt-helper__msg{font-size:16px;color:var(--ink);margin:0;font-weight:600;line-height:1.5;}
.bt-helper__msg a{color:var(--brand-blue);text-decoration:underline;}
.bt-helper--center{margin-top:30px;text-align:left;}

/* ---------- Country selector ---------- */
.bt-selector{padding-top:46px;background:radial-gradient(100% 78% at 50% 0%, #e9f0ff 0%, var(--bg) 60%);}
html[data-mode="dark"] .bt-selector{background:radial-gradient(100% 78% at 50% 0%, #16223a 0%, var(--bg) 60%);}
.bt-selgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:16px;margin-top:30px;}
.bt-ccard{display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 6px 18px -10px rgba(24,34,47,.18);transition:.2s cubic-bezier(.3,.8,.3,1);position:relative;text-align:left;align-items:stretch;overflow:hidden;}
.bt-ccard::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--brand-blue),#5b86e6);transform:scaleX(0);transform-origin:left;transition:.25s;}
.bt-ccard--active{cursor:pointer;}
.bt-ccard--active:hover{transform:translateY(-5px);box-shadow:0 22px 40px -18px rgba(37,99,235,.45);border-color:transparent;}
.bt-ccard--active:hover::before{transform:scaleX(1);}
.bt-ccard--soon{opacity:.82;}
.bt-ccard__top{display:flex;align-items:flex-start;gap:12px;}
.bt-ccard__id{flex:1;min-width:0;}
.bt-ccard__flag{flex:none;width:50px;height:50px;border-radius:50%;overflow:hidden;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--line),0 4px 10px rgba(0,0,0,.14);}
.bt-flagimg{width:100%;height:100%;display:block;background-size:cover;background-position:center;background-repeat:no-repeat;}
.bt-ccard--soon .bt-flagimg{filter:grayscale(.7) opacity(.9);}
.bt-ccard__name{font-weight:800;font-size:18px;margin:0;}
.bt-ccard__region{font-size:12.5px;color:var(--muted);margin:2px 0 0;font-weight:600;}
.bt-ccard__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line);}
.bt-ccard__count{font-size:13.5px;color:var(--muted);font-weight:600;}
.bt-ccard__count b{color:var(--ink);font-weight:800;}
.bt-ccard__go{flex:none;width:36px;height:36px;border-radius:50%;background:rgba(37,99,235,.10);color:var(--brand-blue);display:inline-flex;align-items:center;justify-content:center;font-size:17px;font-weight:700;transition:.2s;}
html[data-mode="dark"] .bt-ccard__go{background:rgba(59,130,246,.2);}
.bt-ccard--active:hover .bt-ccard__go{background:var(--brand-blue);color:#fff;}
.bt-badge{flex:none;align-self:flex-start;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 9px;border-radius:var(--r-pill);white-space:nowrap;}
.bt-badge--active{background:rgba(37,99,235,.12);color:var(--brand-blue);}
.bt-badge--soon{background:var(--surface-2);color:var(--muted);}

.bt-selnote{margin-top:22px;font-size:13.5px;color:var(--muted);text-align:center;}

/* ---------- How it works ---------- */
.bt-how{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.bt-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px;}
.bt-step{text-align:center;padding:8px;}
.bt-step__num{width:52px;height:52px;border-radius:50%;background:var(--brand-blue);color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.bt-step:nth-child(2) .bt-step__num{background:var(--brand-yellow);color:#3a2f00;}
.bt-step__h{font-weight:800;font-size:18px;margin:0 0 6px;}
.bt-step__p{font-size:14.5px;color:var(--muted);margin:0;max-width:34ch;margin-inline:auto;}

/* ---------- Global content ---------- */
.bt-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;}
.bt-gcard{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--shadow-sm);transition:.18s;display:flex;flex-direction:column;}
.bt-gcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-card);}
.bt-gcard__media{height:128px;background:linear-gradient(135deg,var(--brand-blue),var(--brand-blue-900));display:flex;align-items:flex-end;padding:12px;}
.bt-gcard__tag{background:rgba(255,255,255,.92);color:#18222f;font-weight:800;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:var(--r-pill);}
.bt-gcard__body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1;}
.bt-gcard__h{font-weight:800;font-size:17px;margin:0;line-height:1.25;}
.bt-gcard__p{font-size:14px;color:var(--muted);margin:0;flex:1;}
.bt-gcard__link{font-weight:700;font-size:14px;color:var(--brand-blue);}

/* ---------- Stats ---------- */
.bt-stats{background:var(--brand-blue);color:#fff;}
html[data-mode="dark"] .bt-stats{background:#101a2e;}
.bt-statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.bt-stat{text-align:center;padding:8px;}
.bt-stat__n{font-weight:800;font-size:clamp(28px,3.4vw,40px);letter-spacing:-.01em;}
.bt-stat__n .y{color:var(--brand-yellow);}
.bt-stat__l{font-size:14px;color:rgba(255,255,255,.82);margin-top:4px;}

/* ---------- Footer ---------- */
.bt-footer{background:var(--footer);color:#e5e9f0;}
.bt-footer__inner{display:grid;grid-template-columns:1.6fr 1.4fr 1fr 1fr;gap:30px;padding:54px 0 40px;}
.bt-footer__brand p{font-size:14px;color:#aeb7c6;margin:14px 0 0;max-width:34ch;}
.bt-footer h4{font-weight:800;font-size:15px;margin:0 0 14px;color:#fff;}
.bt-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.bt-footer__countries ul{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;}
.bt-footer__flag{display:inline-block;width:22px;height:16px;border-radius:3px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.3);flex:none;}
.bt-footer a{font-size:14px;color:#c2cad6;transition:.15s;display:inline-flex;align-items:center;gap:7px;}
.bt-footer a:hover{color:#fff;}
.bt-footer__soon{font-size:10px;font-weight:700;color:#aeb7c6;} /* AA sobre slate footer */
.bt-footer__bar{border-top:1px solid rgba(255,255,255,.1);padding:18px 0;text-align:center;font-size:13px;color:#c2cad6;}
.bt-footer__bar strong{color:#fff;}

/* ---------- Section anchor offset (sticky header) ---------- */
.bt-section,[id]{scroll-margin-top:84px;}

/* ---------- Interactive map ---------- */
.bt-mapwrap{margin-top:26px;display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;position:relative;}
.bt-map{position:relative;width:100%;max-width:430px;margin:0 auto;aspect-ratio:460/640;}
.bt-mapsvg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.bt-mapland{fill:url(#btLandGrad);stroke:var(--brand-blue);stroke-opacity:.28;stroke-width:1.5;}
html[data-mode="dark"] .bt-mapland{stroke-opacity:.4;}
.bt-pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;}
.bt-pin__flag{width:34px;height:34px;border-radius:50%;background-size:cover;background-position:center;border:2.5px solid #fff;box-shadow:0 3px 9px rgba(0,0,0,.3);transition:.16s;}
.bt-pin--active{z-index:3;cursor:pointer;}
.bt-pin--active .bt-pin__flag{border-color:var(--brand-blue);box-shadow:0 0 0 4px rgba(37,99,235,.18),0 4px 12px rgba(0,0,0,.3);}
.bt-pin--active::before{content:"";position:absolute;top:17px;left:50%;width:34px;height:34px;border-radius:50%;background:var(--brand-blue);z-index:-1;transform:translate(-50%,-50%) scale(1);animation:btPinPulse 2.4s ease-out infinite;}
@keyframes btPinPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.45;}70%{transform:translate(-50%,-50%) scale(2.3);opacity:0;}100%{opacity:0;}}
.bt-pin--active:hover .bt-pin__flag,.bt-pin--active:focus .bt-pin__flag{transform:scale(1.14);}
.bt-pin__lbl{font-size:11.5px;font-weight:800;color:var(--ink);background:var(--surface);padding:2px 8px;border-radius:999px;box-shadow:0 2px 6px rgba(0,0,0,.16);white-space:nowrap;}
.bt-pin--soon{z-index:2;}
.bt-pin--soon .bt-pin__flag{width:23px;height:23px;border-width:2px;filter:grayscale(.55);opacity:.92;border-color:#d4dcea;box-shadow:0 2px 5px rgba(0,0,0,.18);}
.bt-mappin{cursor:default;}
.bt-mappin circle{transition:.15s;}
.bt-mappin--active{cursor:pointer;}
.bt-mappin--active circle.dot{fill:var(--brand-blue);}
.bt-mappin--active:hover circle.dot,.bt-mappin--active:focus circle.dot{fill:var(--brand-blue-700);}
.bt-mappin--active .pulse{fill:var(--brand-blue);opacity:.25;transform-origin:center;animation:btPulse 2.4s ease-out infinite;}
@keyframes btPulse{0%{transform:scale(1);opacity:.35;}70%{transform:scale(2.6);opacity:0;}100%{opacity:0;}}
.bt-mappin--soon circle.dot{fill:#aeb8c8;}
html[data-mode="dark"] .bt-mappin--soon circle.dot{fill:#45516a;}
.bt-mappin__lbl{font-size:13px;font-weight:700;fill:var(--ink);}
.bt-mapregion{font-size:11.5px;font-weight:800;letter-spacing:.06em;fill:var(--muted);opacity:.5;}
.bt-mappin--soon .bt-mappin__lbl{fill:var(--muted);}
.bt-maptip{position:absolute;transform:translate(-50%,-118%);background:var(--ink);color:var(--surface);font-size:12.5px;font-weight:600;padding:6px 10px;border-radius:8px;white-space:nowrap;pointer-events:none;opacity:0;transition:.12s;z-index:5;}
.bt-maptip::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ink);}
.bt-maptip.is-on{opacity:1;}
.bt-mapaside h3{font-weight:800;font-size:24px;margin:6px 0 8px;letter-spacing:-.01em;}
.bt-mapaside p{font-size:15px;color:var(--muted);margin:0 0 16px;}
.bt-maplegend{display:flex;gap:18px;flex-wrap:wrap;font-size:13.5px;font-weight:600;color:var(--muted);}
.bt-maplegend span{display:inline-flex;align-items:center;gap:7px;}
.bt-maplegend i{width:12px;height:12px;border-radius:50%;display:inline-block;}
.bt-maplegend i.on{background:var(--brand-blue);}
.bt-maplegend i.off{background:#aeb8c8;}

/* ---------- Ad slots (AdSense compatible) ---------- */
.bt-ad{margin:0 auto;max-width:var(--maxw);padding:0 24px;}
.bt-ad__inner{border:1px dashed var(--line);border-radius:14px;background:var(--surface-2);min-height:110px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;}
.bt-ad--leader .bt-ad__inner{min-height:130px;}

/* ---------- About / generic prose ---------- */
.bt-about__grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;margin-top:14px;}
.bt-about__media{aspect-ratio:4/3;border-radius:var(--r-card);background:linear-gradient(135deg,var(--brand-blue),var(--brand-blue-900));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:22px;text-align:center;padding:24px;overflow:hidden;}
.bt-about__media--team{background:radial-gradient(circle at 50% 24%, #e8f0ff 0%, var(--surface) 72%);padding:12px;}
html[data-mode="dark"] .bt-about__media--team{background:radial-gradient(circle at 50% 24%, #1b2942 0%, var(--surface) 72%);}
.bt-about__media--team img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 24px rgba(13,31,66,.22));}
.bt-about__p{font-size:16px;color:var(--muted);margin:0 0 14px;}
.bt-about__list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.bt-about__list li{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--ink);}
.bt-about__list .ck{color:var(--brand-blue);font-weight:800;flex:none;}

/* ---------- FAQ ---------- */
.bt-faq{max-width:780px;margin:30px auto 0;display:flex;flex-direction:column;gap:12px;}
.bt-faqitem{background:var(--surface);border:1.5px solid var(--line);border-radius:14px;overflow:hidden;}
.bt-faqq{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;padding:18px 20px;font-weight:700;font-size:16px;color:var(--ink);}
.bt-faqq:hover{color:var(--brand-blue);}
.bt-faqq__ic{flex:none;width:26px;height:26px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:16px;transition:.2s;color:var(--brand-blue);}
.bt-faqitem.is-open .bt-faqq__ic{transform:rotate(45deg);background:var(--brand-blue);color:#fff;}
.bt-faqa{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.bt-faqa__in{padding:0 20px 18px;font-size:15px;color:var(--muted);line-height:1.6;}

/* ---------- Contact ---------- */
.bt-contact{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.bt-contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:14px;}
.bt-contact__info p{font-size:16px;color:var(--muted);margin:0 0 18px;}
.bt-contact__chan{display:flex;flex-direction:column;gap:12px;margin-top:8px;}
.bt-contact__chan a{display:inline-flex;align-items:center;gap:11px;font-weight:600;font-size:15px;color:var(--ink);}
.bt-contact__chan a:hover{color:var(--brand-blue);}
.bt-contact__ic{width:38px;height:38px;border-radius:10px;background:var(--surface-2);display:inline-flex;align-items:center;justify-content:center;font-size:18px;flex:none;}
.bt-form{display:flex;flex-direction:column;gap:12px;background:var(--bg);border:1.5px solid var(--line);border-radius:var(--r-card);padding:22px;}
.bt-form input,.bt-form textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;font-family:var(--font);font-size:15px;color:var(--ink);background:var(--surface);outline:none;transition:.15s;}
.bt-form input:focus,.bt-form textarea:focus{border-color:var(--brand-blue);}
.bt-form textarea{resize:vertical;min-height:110px;}
.bt-form__row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.bt-form button{margin-top:4px;}
.bt-form__ok{background:rgba(37,99,235,.1);color:var(--brand-blue);border-radius:10px;padding:12px 14px;font-weight:700;font-size:14.5px;text-align:center;}

/* ---------- Mobile nav drawer ---------- */
.bt-nav.is-open{display:flex !important;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--brand-blue);padding:8px 0;gap:0;margin:0;}
html[data-mode="dark"] .bt-nav.is-open{background:#101a2e;}
.bt-nav.is-open a{padding:13px 24px;width:100%;}

/* ---------- Active country showcase (big flags) ---------- */
.bt-active{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;}
.bt-atile{display:flex;flex-direction:column;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--shadow-card);transition:.18s;text-align:left;}
.bt-atile:hover{transform:translateY(-4px);border-color:var(--brand-blue);}
.bt-atile__flag{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;}
.bt-atile__flag .bt-flagimg{width:100%;height:100%;}
.bt-atile__shine{position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(0,0,0,.30));}
.bt-atile__body{padding:20px;display:flex;flex-direction:column;gap:3px;position:relative;}
.bt-atile__badge{position:absolute;top:-14px;right:18px;white-space:nowrap;background:var(--brand-blue);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:5px 12px;border-radius:var(--r-pill);box-shadow:0 8px 16px -7px var(--brand-blue);}
.bt-atile__name{font-weight:800;font-size:22px;}
.bt-atile__region{font-size:13px;color:var(--muted);font-weight:600;}
.bt-atile__count{font-size:14.5px;color:var(--muted);margin-top:10px;}
.bt-atile__count b{color:var(--ink);font-weight:800;}
.bt-atile__go{margin-top:12px;display:inline-flex;align-items:center;gap:7px;font-weight:700;color:var(--brand-blue);font-size:15px;}
.bt-atile__go .ar{transition:.18s;}
.bt-atile:hover .bt-atile__go .ar{transform:translateX(4px);}
.bt-selsep{margin:36px 0 0;text-align:center;font-size:13.5px;color:var(--muted);font-weight:700;letter-spacing:.04em;text-transform:uppercase;position:relative;}

/* ---------- Inner page hero / breadcrumb ---------- */
.bt-phero{background:linear-gradient(180deg,#1E3A8A,#2563EB);color:#fff;padding:52px 0;text-align:center;}
html[data-mode="dark"] .bt-phero{background:linear-gradient(180deg,#0a0f1a,#101a2e);}
.bt-phero__bc{font-size:13px;font-weight:600;color:rgba(255,255,255,.82);margin:0 0 10px;}
.bt-phero__bc a{text-decoration:underline;text-underline-offset:2px;}
.bt-phero h1{font-weight:800;font-size:clamp(28px,4vw,44px);margin:0 0 10px;letter-spacing:-.02em;}
.bt-phero p{font-size:17px;color:rgba(255,255,255,.9);max-width:62ch;margin:0 auto;}

/* ---------- Prose / legal ---------- */
.bt-prose{max-width:800px;margin:0 auto;}
.bt-prose__upd{font-size:13px;color:var(--muted);font-weight:700;margin:0 0 24px;}
.bt-prose h2{font-weight:800;font-size:21px;margin:30px 0 10px;color:var(--ink);}
.bt-prose h2:first-of-type{margin-top:0;}
.bt-prose p{font-size:15.5px;color:var(--muted);line-height:1.72;margin:0 0 14px;}
.bt-prose ul{margin:0 0 16px;padding-left:22px;color:var(--muted);font-size:15.5px;line-height:1.72;}
.bt-prose a{color:var(--brand-blue);text-decoration:underline;}
.bt-prose strong{color:var(--ink);}

/* ---------- Categorías ---------- */
.bt-catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:16px;margin-top:28px;}
.bt-cat{display:flex;align-items:center;gap:14px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-card);padding:18px;box-shadow:var(--shadow-sm);transition:.18s;text-align:left;}
.bt-cat:hover{transform:translateY(-3px);box-shadow:var(--shadow-card);border-color:var(--brand-blue);}
.bt-cat__ic{width:48px;height:48px;border-radius:12px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:23px;flex:none;}
.bt-cat__t{font-weight:800;font-size:16px;}
.bt-cat__d{font-size:13px;color:var(--muted);margin-top:2px;}
.bt-catnote{margin-top:26px;text-align:center;font-size:14px;color:var(--muted);}

/* ---------- Artículo / entrada ---------- */
.bt-article{max-width:760px;margin:0 auto;}
.bt-article__meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:14px;font-weight:600;margin-bottom:18px;}
.bt-article__cat{background:#eef1ff;color:var(--brand-blue);padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
html[data-mode="dark"] .bt-article__cat{background:rgba(59,130,246,.18);}
.bt-article__cover{aspect-ratio:16/7.5;border-radius:18px;background:linear-gradient(135deg,#2563EB,#1E3A8A);margin-bottom:26px;display:flex;align-items:flex-end;padding:20px;color:#fff;font-weight:700;font-size:15px;}
.bt-share{display:flex;gap:10px;align-items:center;margin:30px 0;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.bt-share span{font-weight:700;font-size:14px;color:var(--muted);margin-right:4px;}
.bt-share a,.bt-share button{width:38px;height:38px;border-radius:10px;background:var(--surface-2);display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:.15s;cursor:pointer;border:none;color:var(--ink);}
.bt-share a:hover,.bt-share button:hover{background:var(--brand-blue);color:#fff;}
.bt-related h2{font-weight:800;font-size:21px;margin:8px 0 16px;}

/* ---------- Búsqueda ---------- */
.bt-searchbar{display:flex;gap:8px;max-width:640px;margin:0 auto;background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:7px 7px 7px 18px;box-shadow:var(--shadow-card);align-items:center;}
.bt-searchbar input{flex:1;border:none;outline:none;background:none;font-family:var(--font);font-size:16px;color:var(--ink);min-width:0;}
.bt-searchbar__ic{color:var(--muted);flex:none;display:flex;}
.bt-results{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:32px;}
.bt-resultnote{text-align:center;color:var(--muted);margin-top:24px;font-size:15px;}
.bt-chipsrow{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-top:18px;}
@media(max-width:560px){.bt-results{grid-template-columns:1fr;}}

/* ---------- Listado de posts ---------- */
.bt-postgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:30px;}
.bt-gcard__meta{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--muted);font-weight:600;margin:0 0 2px;}
.bt-gcard__meta .dot{width:3px;height:3px;border-radius:50%;background:var(--line);display:inline-block;}
.bt-gcard[hidden]{display:none;}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .bt-nav{display:none;}
  .bt-burger{display:flex;}
  .bt-steps{grid-template-columns:1fr;gap:18px;}
  .bt-cards3{grid-template-columns:1fr;}
  .bt-statgrid{grid-template-columns:1fr 1fr;}
  .bt-footer__inner{grid-template-columns:1fr 1fr;}
  .bt-mapwrap{grid-template-columns:1fr;gap:20px;}
  .bt-about__grid,.bt-contact__grid{grid-template-columns:1fr;gap:22px;}
  .bt-about__media{order:-1;aspect-ratio:16/9;}
  .bt-hero__inner{grid-template-columns:1fr;gap:8px;text-align:center;}
  .bt-hero__copy{text-align:center;}
  .bt-hero__lead{margin-left:auto;margin-right:auto;}
  .bt-hero__cta{justify-content:center;}
  .bt-hero__art{order:-1;min-height:0;}
  .bt-hero__av{width:230px;}
  .bt-hero__artbg{width:250px;height:250px;}
}
@media(max-width:560px){
  .bt-wrap{padding:0 16px;}
  .bt-header__inner{height:62px;}
  .bt-cselect__btn span.lbl{display:none;}
  .bt-geo__inner{flex-wrap:wrap;}
  .bt-geo__text{flex-basis:100%;order:2;}
  .bt-selgrid{grid-template-columns:1fr 1fr;gap:12px;}
  .bt-ccard{padding:14px;}
  .bt-ccard__flag{width:44px;height:44px;}
  .bt-statgrid{grid-template-columns:1fr 1fr;}
  .bt-footer__inner{grid-template-columns:1fr;}
  .bt-footer__countries ul{grid-template-columns:1fr 1fr;}
  .bt-form__row{grid-template-columns:1fr;}
  .bt-map{max-width:300px;margin:0 auto;}
  .bt-active{grid-template-columns:1fr;}
  .bt-helper{flex-direction:column;text-align:center;gap:8px;padding:18px;}
  .bt-helper__av{width:150px;align-self:center;}
  .bt-helper__bubble::before{display:none;}
}
@media(max-width:380px){
  .bt-selgrid{grid-template-columns:1fr;}
}

/* ============================================================
   PAGINACIÓN (WordPress: publicaciones, archivo, búsqueda)
   Añadido para las plantillas PHP del tema; usa los tokens de marca.
   ============================================================ */
.bt-pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:40px;}
.bt-pagination .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 14px;
  border:1px solid var(--line);border-radius:var(--r-pill);
  background:var(--surface);color:var(--ink);font-weight:600;text-decoration:none;
  transition:background .15s,border-color .15s,color .15s;
}
.bt-pagination .page-numbers:hover{border-color:var(--brand-blue);color:var(--brand-blue);}
.bt-pagination .page-numbers.current{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;}
.bt-pagination .page-numbers.dots{border-color:transparent;background:transparent;}

/* ============================================================
   FIX MODO OSCURO — endurecimiento frente a Astra/LiteSpeed
   Astra (servido optimizado por LiteSpeed) pinta de blanco los <a>/<input>
   y de gris #3a3a3a los títulos, ganándole a var(--surface)/var(--ink) por
   orden de carga. Forzamos nuestras superficies y textos SOLO en oscuro.
   ============================================================ */
html[data-mode="dark"] body{ background:var(--bg) !important; color:var(--ink) !important; }

/* Superficies (tarjetas, tiles, inputs, buscador, etc.) */
html[data-mode="dark"] .bt-ccard,
html[data-mode="dark"] .bt-gcard,
html[data-mode="dark"] .bt-cat,
html[data-mode="dark"] .bt-atile,
html[data-mode="dark"] .bt-searchbar,
html[data-mode="dark"] .bt-btn--ghost,
html[data-mode="dark"] .bt-form input,
html[data-mode="dark"] .bt-form textarea{ background:var(--surface) !important; border-color:var(--line) !important; }

/* Tooltip del mapa: pill de alto contraste en oscuro (fondo oscuro, texto claro).
   (NO debe usar var(--surface) como fondo, porque su texto ya es var(--surface).) */
html[data-mode="dark"] .bt-maptip{ background:#0a0f1a !important; color:var(--ink) !important; border:1px solid var(--line); }
html[data-mode="dark"] .bt-maptip::after{ border-top-color:#0a0f1a; }

/* Texto principal en oscuro (títulos y nombres) */
html[data-mode="dark"] .bt-h2,
html[data-mode="dark"] .bt-hero__title,
html[data-mode="dark"] .bt-step__h,
html[data-mode="dark"] .bt-about__grid h2,
html[data-mode="dark"] .bt-ccard__name,
html[data-mode="dark"] .bt-gcard__h,
html[data-mode="dark"] .bt-cat__t,
html[data-mode="dark"] .bt-prose,
html[data-mode="dark"] .bt-prose h1,
html[data-mode="dark"] .bt-prose h2,
html[data-mode="dark"] .bt-prose h3,
html[data-mode="dark"] .bt-btn--ghost,
html[data-mode="dark"] .bt-form input,
html[data-mode="dark"] .bt-form textarea{ color:var(--ink) !important; }

/* Texto secundario en oscuro */
html[data-mode="dark"] .bt-ccard__region,
html[data-mode="dark"] .bt-gcard__p,
html[data-mode="dark"] .bt-gcard__meta,
html[data-mode="dark"] .bt-cat__d,
html[data-mode="dark"] .bt-step__p{ color:var(--muted) !important; }

/* Placeholders y buscador en oscuro */
html[data-mode="dark"] .bt-form input::placeholder,
html[data-mode="dark"] .bt-form textarea::placeholder,
html[data-mode="dark"] .bt-searchbar input::placeholder{ color:var(--muted) !important; }
html[data-mode="dark"] .bt-searchbar input{ background:transparent !important; color:var(--ink) !important; }

/* Subtítulos h3 sueltos dentro del contenido (p. ej. .bt-mapaside, relacionados) en oscuro */
html[data-mode="dark"] .bt-mapaside h3,
html[data-mode="dark"] .bt-related h2,
html[data-mode="dark"] main h3:not(.bt-step__h):not(.bt-gcard__h){ color:var(--ink) !important; }

/* Contraste AA en oscuro: el blanco sobre --brand-blue aclarado (#3b82f6) da 3.68.
   Para SUPERFICIES DE ACCIÓN con texto blanco usamos un azul más oscuro (#2563EB → ~5.1).
   No afecta al azul de acentos de texto (eyebrow, enlaces), que sí cumplen. */
html[data-mode="dark"] .bt-btn--primary,
html[data-mode="dark"] .bt-pagination .page-numbers.current,
html[data-mode="dark"] .bt-atile__badge,
html[data-mode="dark"] .bt-ccard--active:hover .bt-ccard__go,
html[data-mode="dark"] .bt-share a:hover,
html[data-mode="dark"] .bt-share button:hover{ background-color:#2563EB !important; }

/* Título de la banda interna (.bt-phero): Astra lo pinta gris #3a3a3a y queda
   ilegible sobre la banda azul/oscura. Forzamos blanco en AMBOS modos. */
.bt-phero h1{ color:#fff !important; }

/* ============================================================
   BOTONES Y ENLACES — color de texto estable en TODOS los estados.
   Astra define a:hover/a:focus globalmente y, como nuestros botones son <a>,
   les cambiaba el texto a su color de enlace (p. ej. naranja sobre azul) al
   pasar el cursor. Reafirmamos el color correcto en normal/hover/focus/active,
   en claro y oscuro, y añadimos foco visible por teclado.
   ============================================================ */

/* Primario: SIEMPRE texto blanco */
.bt-btn--primary,
.bt-btn--primary:hover,
.bt-btn--primary:focus,
.bt-btn--primary:active{ color:#fff !important; }

/* Amarillo: texto marrón oscuro */
.bt-btn--yellow,
.bt-btn--yellow:hover,
.bt-btn--yellow:focus,
.bt-btn--yellow:active{ color:#3a2f00 !important; }

/* Ghost: azul de marca (claro) / tinta clara (oscuro) */
.bt-btn--ghost,
.bt-btn--ghost:hover,
.bt-btn--ghost:focus,
.bt-btn--ghost:active{ color:var(--brand-blue) !important; }
html[data-mode="dark"] .bt-btn--ghost,
html[data-mode="dark"] .bt-btn--ghost:hover,
html[data-mode="dark"] .bt-btn--ghost:focus,
html[data-mode="dark"] .bt-btn--ghost:active{ color:var(--ink) !important; }

/* Cabecera: nav, selector país y botones de modo → texto/icono blanco */
.bt-nav a,
.bt-nav a:hover,
.bt-nav a:focus,
.bt-cselect__btn,
.bt-cselect__btn:hover,
.bt-cselect__btn:focus,
.bt-modebtn,
.bt-modebtn:hover,
.bt-modebtn:focus{ color:#fff !important; }

/* Selector país (light): oscurecemos el pill para que el blanco contraste (≥4.5).
   En oscuro mantenemos overlay claro para que el pill sea visible sobre el header. */
.bt-cselect__btn{ background:rgba(0,0,0,.18); }
.bt-cselect__btn:hover{ background:rgba(0,0,0,.30); }
.bt-modebtn{ background:rgba(0,0,0,.18); }
.bt-modebtn:hover{ background:rgba(0,0,0,.30); }
html[data-mode="dark"] .bt-cselect__btn{ background:rgba(255,255,255,.14); }
html[data-mode="dark"] .bt-cselect__btn:hover{ background:rgba(255,255,255,.24); }
html[data-mode="dark"] .bt-modebtn{ background:rgba(255,255,255,.14); }
html[data-mode="dark"] .bt-modebtn:hover{ background:rgba(255,255,255,.24); }

/* Footer: enlaces → claro normal, blanco en hover/focus */
.bt-footer a:hover,
.bt-footer a:focus{ color:#fff !important; }

/* Iconos de compartir: tinta normal, blanco sobre azul al hover */
.bt-share a, .bt-share button{ color:var(--ink) !important; }
.bt-share a:hover, .bt-share a:focus,
.bt-share button:hover, .bt-share button:focus{ color:#fff !important; }

/* FAQ, paginación y enlaces de contacto: azul de marca al interactuar */
.bt-faqq:hover, .bt-faqq:focus,
.bt-contact__chan a:hover, .bt-contact__chan a:focus,
.bt-pagination .page-numbers:hover, .bt-pagination .page-numbers:focus{ color:var(--brand-blue) !important; }
.bt-pagination .page-numbers.current{ color:#fff !important; }

/* Enlaces dentro de prosa y tarjetas: azul de marca estable (no el naranja de Astra) */
.bt-prose a, .bt-prose a:hover, .bt-prose a:focus,
.bt-gcard__link, .bt-gcard:hover .bt-gcard__link{ color:var(--brand-blue) !important; }

/* Foco visible por teclado (accesibilidad) — outline amarillo, visible en azul y oscuro */
.bt-btn:focus-visible,
.bt-chip:focus-visible,
.bt-faqq:focus-visible,
.bt-modebtn:focus-visible,
.bt-cselect__btn:focus-visible,
.bt-cselect__item:focus-visible,
.bt-pagination .page-numbers:focus-visible,
.bt-share a:focus-visible,
.bt-share button:focus-visible,
.bt-nav a:focus-visible,
.bt-ccard--active:focus-visible{ outline:3px solid var(--brand-yellow); outline-offset:2px; border-radius:6px; }

/* ============================================================
   FAQ — estado seleccionado/foco ON-BRAND.
   Una hoja externa (Astra optimizado/extensión) inyectaba un fondo amarillo
   #FBD846 en la pregunta al enfocar/abrir, que chocaba con el diseño oscuro.
   Lo anulamos y usamos acento azul de marca + foco azul interior.
   ============================================================ */
.bt-faqq,
.bt-faqq:hover,
.bt-faqq:focus,
.bt-faqq:focus-visible,
.bt-faqq:active{ background-color:transparent !important; background-image:none !important; }
.bt-faqq:focus-visible{ outline:2px solid var(--brand-blue) !important; outline-offset:-2px; }
.bt-faqitem.is-open,
.bt-faqitem:focus-within{ border-color:var(--brand-blue); }
.bt-faqitem.is-open .bt-faqq{ color:var(--brand-blue) !important; }

/* ============================================================
   SOMOS — imagen del equipo más grande (más presencia en el bloque).
   ============================================================ */
.bt-about__media--team{ padding:0; }
.bt-about__media--team img{ transform:scale(1.12); transform-origin:center 60%; }

/* ============================================================
   MENÚ PRINCIPAL REAL (wp_nav_menu) — el menú bt_main genera <li>;
   los mostramos como nav horizontal limpio, sin viñetas.
   ============================================================ */
.bt-nav ul{ display:flex; align-items:center; gap:24px; list-style:none; margin:0; padding:0; }
.bt-nav li{ list-style:none; margin:0; padding:0; }
.bt-nav li::marker{ content:""; }
.bt-nav .menu-link{ display:inline-block; }

/* Categorías: título y descripción apilados (eran spans inline pegados) */
.bt-cat__t{ display:block; }
.bt-cat__d{ display:block; }

/* ============================================================
   HERO — legibilidad del resaltado amarillo (.hl-y) en OSCURO.
   El texto del título es blanco; sobre la banda amarilla queda con poco
   contraste. Añadimos una sombra/halo oscuro suave que lo separa del amarillo
   sin perder el estilo del marcador. (En claro el texto es oscuro y no aplica.)
   ============================================================ */
html[data-mode="dark"] .bt-hero__title .hl-y{
  text-shadow:
    0 1px 1px rgba(8,12,20,.55),
    0 0 7px rgba(8,12,20,.45);
}

/* ============================================================
   PANEL DEL MAPA (.bt-mapaside) — presentación LIMPIA y ABIERTA (sin caja).
   Solo el texto principal + el botón, centrado, ligero y con buen aire.
   ============================================================ */
.bt-mapaside{
  text-align:center;
  max-width:400px;
  margin:0 auto;
  padding:6px;
}
.bt-mapaside h3{ font-size:26px; margin:4px 0 12px; }
.bt-mapaside p{ margin:0 auto 4px; max-width:34ch; }
.bt-mapaside .bt-btn{ margin-top:26px; }
/* sin barra de acento ni brillo (composición sin contenedor) */
.bt-mapaside::before, .bt-mapaside::after{ content:none; }

/* ============================================================
   MENÚ MÓVIL (drawer) — items a ancho completo.
   El menú real usa <li>; en el drawer (columna) heredaban align-items:center
   y quedaban al ancho del texto. Los estiramos a filas tappables completas.
   ============================================================ */
.bt-nav.is-open{ align-items:stretch; }
.bt-nav.is-open li{ width:100%; }
.bt-nav.is-open a,
.bt-nav.is-open .menu-link{ display:block; width:100%; padding:13px 24px; }

/* ============================================================
   COLOR SECUNDARIO — morado del avatar (#51307F) como ACENTO.
   Uso estratégico (avatar, estados "próximamente", decorativos del mapa),
   sin reemplazar el azul/amarillo principales. Variante clara en oscuro.
   ============================================================ */
:root{ --brand-purple:#51307F; --brand-purple-soft:rgba(81,48,127,.12); }
html[data-mode="dark"]{ --brand-purple:#a98cdb; --brand-purple-soft:rgba(169,140,219,.16); }

/* Halo detrás del avatar del hero: morado del traje → cálido amarillo */
.bt-hero__artbg{ background:radial-gradient(circle, rgba(81,48,127,.30) 0%, rgba(250,214,54,.18) 46%, rgba(250,214,54,0) 70%); }

/* Burbujas "BT te guía / BT responde" (donde aparece el avatar) */
.bt-helper{ background:linear-gradient(120deg, rgba(81,48,127,.10), rgba(250,214,54,.10)); }
.bt-helper__name{ color:var(--brand-purple); }

/* Chip del hero (insignia junto al avatar) */
.bt-hero__chip{ background:var(--brand-purple-soft); color:var(--brand-purple); }
.bt-hero__chip i{ background:var(--brand-purple); }
html[data-mode="dark"] .bt-hero__chip{ background:var(--brand-purple-soft); }

/* Estado "próximamente" en morado: tarjetas, dropdown y mapa */
.bt-badge--soon{ background:var(--brand-purple-soft); color:var(--brand-purple); }
.bt-cselect__soon{ background:var(--brand-purple-soft); color:var(--brand-purple); }
.bt-maplegend i.off{ background:var(--brand-purple); opacity:.75; }
.bt-mappin--soon circle.dot,
html[data-mode="dark"] .bt-mappin--soon circle.dot{ fill:var(--brand-purple); }

/* Barra de acento del panel del mapa: azul → morado */

/* ============================================================
   AJUSTES RESPONSIVE (auditoría móvil/tablet)
   ============================================================ */
/* Tarjetas de país a 1 columna en móviles: a 2-col (~165px) el badge se
   solapaba con el nombre. Full-width = bandera + nombre + badge sin choque. */
@media(max-width:480px){
  .bt-selgrid{ grid-template-columns:1fr; }
}
/* Banner geo: el MENSAJE primero y el CTA debajo (antes el botón iba antes del texto). */
@media(max-width:560px){
  .bt-geo__inner{ flex-wrap:wrap; row-gap:6px; }
  .bt-geo__text{ flex:1 1 auto; order:0; }
  .bt-geo__actions{ flex-basis:100%; order:1; justify-content:flex-start; flex-wrap:wrap; }
}
/* "Somos": sin escalar la imagen del equipo en móvil (se recortaba al achicar la caja). */
@media(max-width:560px){
  .bt-about__media--team img{ transform:none; }
}
/* Respiración vertical, toque y tipografía de tarjeta en móvil. */
@media(max-width:560px){
  .bt-section{ padding:48px 0; }
  .bt-btn{ padding-top:13px; padding-bottom:13px; }
  .bt-ccard__name{ font-size:16.5px; }
}

/* ============================================================
   AJUSTES MÓVIL — header más limpio + hero equilibrado
   ============================================================ */
/* Ocultar el dropdown "Elegir país" cuando el menú está en modo hamburguesa
   (es redundante: "Países" está en el menú y el módulo de selección en la página). */
@media(max-width:900px){
  .bt-cselect{ display:none; }
}
/* Avatar del hero más pequeño en móvil para equilibrar el primer bloque. */
@media(max-width:560px){
  .bt-hero__av{ width:165px; }
  .bt-hero__artbg{ width:190px; height:190px; }
}

/* ============================================================
   ANIMACIONES SUAVES — aparición al hacer scroll + microinteracciones.
   Solo opacity/transform (sin layout shift/CLS), disparadas con
   IntersectionObserver. Respetan prefers-reduced-motion y NO afectan
   al bloque de anuncios (.bt-ad).
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  .bt-reveal{ opacity:0; transform:translateY(20px); transition:opacity .5s ease, transform .6s cubic-bezier(.16,.72,.3,1); }
  .bt-reveal.is-in{ opacity:1; transform:none; }

  /* Float suave de los avatares de personaje único */
  .bt-hero__av{ animation:btFloatSoft 5.5s ease-in-out infinite; }
  .bt-helper__av{ animation:btFloatSoft 6.2s ease-in-out infinite; }
  @keyframes btFloatSoft{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-9px); } }

  /* Microinteracción: leve pulsación al presionar botones */
  .bt-btn:active{ transform:translateY(1px) scale(.985); }
}

/* Entrada del HERO al cargar (gated por la clase .bt-anim que pone el script del <head>,
   antes del primer render → sin parpadeo y sin depender del JS). */
@keyframes btRise{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: no-preference){
  html.bt-anim .bt-hero__chip { animation:btRise .55s .02s both cubic-bezier(.16,.72,.3,1); }
  html.bt-anim .bt-hero__title{ animation:btRise .60s .10s both cubic-bezier(.16,.72,.3,1); }
  html.bt-anim .bt-hero__lead { animation:btRise .60s .18s both cubic-bezier(.16,.72,.3,1); }
  html.bt-anim .bt-hero__cta  { animation:btRise .60s .26s both cubic-bezier(.16,.72,.3,1); }
  html.bt-anim .bt-hero__trust{ animation:btRise .60s .32s both cubic-bezier(.16,.72,.3,1); }
  html.bt-anim .bt-hero__art  { animation:btRise .70s .12s both cubic-bezier(.16,.72,.3,1); }
}

/* Cifras: dígitos de ancho fijo para que el contador animado no provoque saltos. */
.bt-stat__n{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }

/* ============================================================
   HUB DE PAÍS (page-pais-hub.php) — informativo + CTA al subdominio
   ============================================================ */
.bt-phead{ max-width:760px; }
.bt-pintro{ margin:10px auto 26px; }
.bt-pcount{ margin-top:14px; font-weight:700; color:var(--brand-blue); }

.bt-hubsectors{ margin-top:30px; }
.bt-hubcard{ text-align:left; padding:22px 22px 20px; }
.bt-hubcard__h{ font-size:18px; margin:0 0 8px; color:var(--ink); }
.bt-hubcard__p{ margin:0; color:var(--muted); font-size:15px; line-height:1.55; }

.bt-hubsplit{ display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:start; }
.bt-hublist{ list-style:none; padding:0; margin:18px 0 0; }
.bt-hublist li{ position:relative; padding:10px 0 10px 30px; border-bottom:1px solid var(--line); color:var(--ink); }
.bt-hublist li::before{ content:"✓"; position:absolute; left:0; top:9px; color:var(--brand-blue); font-weight:800; }
.bt-hubnote{ margin-top:18px; padding:14px 16px; background:var(--surface-2); border-radius:14px; color:var(--muted); font-size:14px; }

.bt-hubaside{ background:var(--surface-2); border:1px solid var(--line); border-radius:18px; padding:24px; }
.bt-hubaside h3{ font-size:17px; margin:0 0 14px; }
.bt-hublinks{ list-style:none; padding:0; margin:0; }
.bt-hublinks li{ margin:0 0 12px; }
.bt-hublinks a{ color:var(--brand-blue); font-weight:600; text-decoration:none; }
.bt-hublinks a:hover{ text-decoration:underline; }

.bt-hubcta{ max-width:680px; }
.bt-hubcta .bt-btn{ margin-top:18px; }

@media (max-width:760px){
  .bt-hubsplit{ grid-template-columns:1fr; gap:28px; }
}

/* ============================================================
   BOTÓN "VOLVER ARRIBA" (#bt-totop) — sitewide, fixed (sin CLS)
   ============================================================ */
.bt-totop{
  position:fixed; right:22px; bottom:22px; z-index:60;
  width:48px; height:48px; display:grid; place-items:center;
  border:0; border-radius:50%; cursor:pointer;
  color:#fff; background:var(--brand-blue);
  box-shadow:0 8px 22px rgba(37,99,235,.38);
  opacity:0; visibility:hidden; transform:translateY(14px);
  transition:opacity .25s ease, transform .25s ease, background .2s ease, box-shadow .2s ease;
}
.bt-totop.is-on{ opacity:1; visibility:visible; transform:translateY(0); }
.bt-totop:hover{ background:var(--brand-purple); box-shadow:0 10px 26px rgba(81,48,127,.42); transform:translateY(-2px); }
.bt-totop:active{ transform:translateY(0); }
.bt-totop:focus-visible{ outline:3px solid var(--brand-yellow); outline-offset:3px; }
.bt-totop svg{ display:block; }

html[data-mode="dark"] .bt-totop{ box-shadow:0 8px 22px rgba(0,0,0,.5); }

@media (max-width:560px){
  .bt-totop{ right:16px; bottom:16px; width:44px; height:44px; }
}
@media (prefers-reduced-motion: reduce){
  .bt-totop{ transition:opacity .15s linear; transform:none; }
  .bt-totop.is-on{ transform:none; }
  .bt-totop:hover{ transform:none; }
}

/* <picture> wrapper transparente: el <img> sigue siendo el flex/grid item (no rompe layout). */
.bt-pic{ display:contents; }