/* ============================================================
   Ultratug — Leadership — styles (compilado del export Claude Design)
   Scopeado a .lp2. Convive con nav/footer globales de Webflow.
   Variables del DS resueltas inline. Fuentes hospedadas como asset.
   ============================================================ */

/* ---- Helvetica Neue (licenciada por el cliente) — 6 pesos usados ---- */
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a92563eb1fe0ff815faf3_HelveticaNeueLight.otf") format("opentype");  font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a9258ba878f2855f1e73e_HelveticaNeueRoman.otf") format("opentype");  font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a925bb5d285db7fcef593_HelveticaNeueMedium.otf") format("opentype"); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a925d26751907357275e3_HelveticaNeueBold.otf") format("opentype");   font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a925f4717acd8a9a3f5f2_HelveticaNeueHeavy.otf") format("opentype");  font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:"Helvetica Neue"; src:url("https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a9262d3ac6323034eec98_HelveticaNeueBlack.otf") format("opentype");  font-weight:900; font-style:normal; font-display:swap; }

/* ---- Variables del DS resueltas sobre el scope .lp2 ---- */
.lp2{
  --ut-accent:      #019cde;
  --ut-font-display:"Helvetica Neue", -apple-system, BlinkMacSystemFont, "Helvetica", "Arial", sans-serif;
  --ut-font-body:   "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Helvetica", "Arial", sans-serif;
  --ut-font-mono:   "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ut-ease-expo:   cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes lp2-floatY { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-16px);} }
@keyframes lp2-up { to { opacity:1; transform:translateY(0); } }
@keyframes lp2-left { to { opacity:1; transform:translateX(0); } }
@keyframes lp2-fade { to { opacity:1; } }
@keyframes lp2-bob { 0%,100%{transform:translateY(0);} 50%{transform:translateY(7px);} }
@keyframes heroKen { from{ transform:scale(1.04); } to{ transform:scale(1.16); } }

.lp2{ background:#000e1e; color:#fff; font-family:var(--ut-font-body); overflow-x:clip; }
.lp2 *{ box-sizing:border-box; }
.lp2 img{ display:block; max-width:100%; }
.lp2 .wrap{ width:100%; max-width:1280px; margin:0 auto; padding:0 40px; }
.lp2 .sec{ padding:110px 0; position:relative; }
.lp2 .sec-title{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.02em; font-size:clamp(34px,5vw,64px); line-height:1; text-align:center; margin:0 0 18px; color:#fff; }
.lp2 .sec-title .dim{ color:rgba(255,255,255,.45); }
.lp2 .sec-sub{ text-align:center; font-weight:300; font-size:clamp(15px,1.5vw,20px); color:rgba(255,255,255,.6); margin:0 auto; max-width:680px; }
.lp2 .waves{ position:absolute; inset:0; background:radial-gradient(130% 80% at 50% 0%, rgba(1,156,222,.06), transparent 62%); pointer-events:none; }

/* reveal */
.lp2 .r{ opacity:0; }
.lp2.no-anim .r{ opacity:1 !important; }

/* HERO (póster + ken-burns; el vídeo del export se descarta) */
.hero2{ position:relative; min-height:100vh; display:flex; align-items:flex-end; overflow:hidden;
       border-radius:0 0 32px 32px; isolation:isolate; }
.hero2-bg{ position:absolute; inset:0; z-index:0; will-change:transform; }
.hero2-kb{ position:absolute; inset:-6%; background:url('https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a69d6cd9abc250be7b9b320_leadership-hero-poster.jpg') center/cover no-repeat; animation:heroKen 22s ease-in-out infinite alternate; will-change:transform; }
.lp2.no-anim .hero2-kb{ animation:none; }
.hero2-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(0,14,30,.30) 0%, rgba(0,14,30,.12) 42%, rgba(0,14,30,.86) calc(100% - 72px), rgba(0,14,30,.30) 100%); }
.hero2-wrap{ position:relative; z-index:2; width:100%; max-width:1280px; margin:0 auto; padding:0 40px 86px; }
.hero2-card{ display:inline-block; max-width:min(760px,90vw); background:rgba(8,20,38,.34); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); border:1px solid rgba(255,255,255,.12); border-radius:28px; padding:38px 48px 42px; }
.hero2-title{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.02em; font-size:clamp(40px,7vw,92px); line-height:.92; margin:0 0 16px; color:#fff; }
.hero2-sub{ font-weight:300; font-size:clamp(15px,1.4vw,19px); line-height:1.5; color:rgba(255,255,255,.85); margin:0; max-width:380px; }
.hero2-fab{ position:absolute; right:30px; bottom:96px; z-index:5; display:flex; flex-direction:column; gap:14px; align-items:center; }
.hero2-chat{ width:56px; height:56px; border-radius:16px 16px 16px 5px; background:#0a2a43; display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 8px 20px rgba(0,0,0,.3); }
.hero2-down{ width:64px; height:64px; border-radius:14px; background:#0a2540; display:flex; align-items:center; justify-content:center; color:#fff; animation:lp2-bob 2s ease-in-out infinite; border:none; cursor:pointer; box-shadow:0 8px 20px rgba(0,0,0,.3); }

/* INTRO */
.intro2{ position:relative; padding:88px 44px; min-height:560px; display:flex; align-items:center; justify-content:center; }
.intro2-collage{ position:absolute; top:88px; left:44px; right:44px; bottom:88px; }
.col-photo{ position:absolute; border-radius:18px; overflow:hidden; box-shadow:0 16px 44px rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.06); will-change:transform; }
.col-photo img{ width:100%; height:100%; object-fit:cover; }
.intro2-text{ position:relative; z-index:3; max-width:540px; margin:0 auto; text-align:center; font-family:var(--ut-font-display); font-weight:700; letter-spacing:-.01em; font-size:clamp(24px,2.8vw,40px); line-height:1.22; padding:0 12px; }
.hl-word{ color:rgba(255,255,255,.18); transition:color .25s linear; }
.hl-word.lit{ color:#fff; }

/* CARD CAROUSEL */
.caro{ display:flex; gap:26px; overflow-x:auto; scroll-snap-type:x mandatory; padding:18px 4px 24px; scrollbar-width:none;
  -webkit-mask:linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%);
  mask:linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%); }
.caro::-webkit-scrollbar{ display:none; }
.caro-arrows{ display:flex; gap:14px; justify-content:center; margin-top:14px; }
.caro-btn{ width:62px; height:58px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; border:none; transition:transform .2s var(--ut-ease-expo), background .2s; }
.caro-btn.prev{ background:#cfd8e0; color:#0a2a43; }
.caro-btn.next{ background:#0a2a52; color:#fff; }
.caro-btn:hover{ transform:translateY(-2px); }

/* TEAM CARD (board) */
.lp2 .sec-board{ min-height:100vh; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; padding:52px 0 32px; }
.sec-board .sec-title{ margin-bottom:10px; }
.sec-board .caro{ align-items:stretch; padding:12px 4px 16px; }
.tcard{ position:relative; flex:0 0 320px; scroll-snap-align:start; padding-top:12px; display:flex; }
.tcard-frame{ position:absolute; top:0; right:-8px; width:74%; height:56%; background:linear-gradient(155deg, rgba(150,198,232,.6), rgba(120,175,215,.12)); border-radius:22px; z-index:0; }
.tcard-inner{ position:relative; z-index:1; flex:1; display:flex; flex-direction:column; background:rgba(10,24,44,.94); border:1px solid rgba(255,255,255,.09); border-radius:22px; padding:14px 18px 16px; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition:transform .35s var(--ut-ease-expo), border-color .35s; }
.tcard:hover .tcard-inner{ transform:translateY(-6px); border-color:rgba(1,156,222,.4); }
.tcard-photo{ border-radius:14px; overflow:hidden; aspect-ratio:1/0.74; background:#dfe6ee; margin-bottom:14px; }
.tcard-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top; transition:transform .7s var(--ut-ease-expo); }
.tcard:hover .tcard-photo img{ transform:scale(1.05); }
.tcard-name{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.01em; font-size:20px; margin:0 0 3px; color:#fff; }
.tcard-role{ color:var(--ut-accent); font-family:var(--ut-font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin:0 0 12px; }
.tcard-desc{ color:rgba(255,255,255,.6); font-size:13px; font-weight:300; line-height:1.5; margin:0 0 12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tcard.exp .tcard-desc{ -webkit-line-clamp:unset; }
.vermas{ align-self:flex-start; display:inline-flex; align-items:center; gap:6px; background:rgba(1,156,222,.1); border:1px solid rgba(1,156,222,.3); color:var(--ut-accent); font-family:var(--ut-font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; padding:7px 14px; border-radius:999px; cursor:pointer; margin:0 0 14px; }
.verchev{ transition:transform .3s var(--ut-ease-expo); }
.tcard.exp .verchev{ transform:rotate(180deg); }
.tcard-divider{ height:1px; background:rgba(255,255,255,.12); margin-top:auto; margin-bottom:14px; }
.tcard-acts{ display:flex; gap:10px; }
.btn-wa{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#1aa0e0; color:#fff; border:none; border-radius:11px; padding:11px; font-size:14px; cursor:pointer; transition:background .2s; }
.btn-wa:hover{ background:#0f8fce; }
.btn-mail{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; background:transparent; color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:11px; padding:11px; font-size:14px; cursor:pointer; transition:border-color .2s,color .2s; }
.btn-mail:hover{ border-color:var(--ut-accent); color:var(--ut-accent); }

/* REGIONAL TEAM CARD */
.rcard{ flex:0 0 330px; scroll-snap-align:start; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:24px; padding:14px; transition:transform .35s var(--ut-ease-expo), border-color .35s; }
.rcard:hover{ transform:translateY(-6px); border-color:rgba(1,156,222,.4); }
.rcard-photo{ border-radius:16px; overflow:hidden; aspect-ratio:1/0.92; background:#eef2f6; }
.rcard-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top; transition:transform .7s var(--ut-ease-expo); }
.rcard:hover .rcard-photo img{ transform:scale(1.05); }
.rcard-name{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.01em; font-size:22px; margin:18px 4px 4px; }
.rcard-role{ color:var(--ut-accent); font-family:var(--ut-font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin:0 4px 16px; }

/* STRATEGY */
.strat-marquee{ margin-top:52px; overflow:hidden; -webkit-mask:linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); mask:linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.strat-track{ display:flex; gap:24px; width:max-content; animation:stratPan 55s linear infinite; }
.strat-marquee:hover .strat-track{ animation-play-state:paused; }
.lp2.no-anim .strat-track{ animation:none; }
@keyframes stratPan{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.strat-track figure{ margin:0; flex:0 0 auto; width:440px; aspect-ratio:4/3; border-radius:24px; overflow:hidden; background:#0b1f3a; }
.strat-track img{ width:100%; height:100%; object-fit:cover; object-position:center; transition:transform .9s var(--ut-ease-expo); }
.strat-track figure:hover img{ transform:scale(1.05); }

/* REGIONAL LEADERSHIP / COUNTRY MANAGEMENT */
.regblock{ max-width:1240px; margin:56px auto 0; border-radius:28px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.4); }
.feat-card{ background:#13315f; display:grid; grid-template-columns:200px 1fr auto; gap:30px; align-items:center; padding:30px 44px; cursor:pointer; }
.feat-photo{ align-self:end; margin-bottom:-30px; display:flex; align-items:flex-end; justify-content:center; }
.feat-photo img{ width:100%; height:auto; max-height:250px; object-fit:contain; object-position:bottom; display:block; }
.feat-name{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.01em; font-size:clamp(26px,3vw,38px); margin:0 0 12px; color:#fff; }
.feat-desc{ color:rgba(255,255,255,.7); font-weight:300; font-size:15px; line-height:1.5; max-width:520px; margin:0 0 10px; }
.feat-desc.clamp{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.feat-more{ background:none; border:none; color:#7fc3ec; font-family:var(--ut-font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; display:inline-flex; gap:6px; align-items:center; padding:0; margin:0 0 16px; }
.feat-more svg{ transition:transform .3s var(--ut-ease-expo); }
.feat-more.open svg{ transform:rotate(180deg); }
.feat-divider{ height:1px; background:rgba(255,255,255,.14); margin:0 0 16px; max-width:520px; }
.feat-acts{ display:flex; gap:12px; }
.feat-country{ font-family:var(--ut-font-mono); font-size:13px; letter-spacing:.12em; line-height:1.5; text-transform:uppercase; color:#3aa6e6; text-align:right; align-self:flex-start; }
.cm-list{ background:#fff; }
/* acordeón: por defecto colapsado (fila); .open muestra la feat-card */
.cm-item .feat-card{ display:none; }
.cm-item.open .feat-card{ display:grid; }
.cm-item.open .cm-row{ display:none; }
.cm-row{ background:#fff; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:30px; padding:24px 44px; border-top:1px solid #e8edf2; transition:background .2s, padding-left .25s; cursor:pointer; }
.cm-item:first-child .cm-row{ border-top:none; }
.cm-row:hover{ background:#f5f8fb; padding-left:54px; }
.cm-row:hover .cm-name{ color:var(--ut-accent); }
.cm-name{ transition:color .2s; }
@keyframes featSwap{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
.feat-card{ animation:featSwap .5s cubic-bezier(.16,1,.3,1); }
.cm-avatar{ width:76px; height:76px; border-radius:50%; overflow:hidden; background:#0a2a43; flex:none; }
.cm-avatar img{ width:100%; height:100%; object-fit:cover; object-position:center top; }
.cm-name{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.01em; font-size:clamp(22px,2.4vw,32px); color:#0a2a43; }
.cm-country{ font-family:var(--ut-font-mono); font-size:12px; letter-spacing:.12em; line-height:1.5; text-transform:uppercase; color:var(--ut-accent); text-align:right; }
.btn-linkedin{ display:inline-flex; align-items:center; gap:8px; background:#1aa0e0; color:#fff; border:none; border-radius:11px; padding:11px 20px; font-size:14px; cursor:pointer; }
.btn-mail-dark{ display:inline-flex; align-items:center; gap:8px; background:transparent; color:#fff; border:1px solid rgba(255,255,255,.3); border-radius:11px; padding:11px 20px; font-size:14px; cursor:pointer; }

/* PRINCIPLES */
.principles{ position:relative; padding:120px 0 160px; background:#04101f; }
.principles-bg{ position:absolute; inset:0; background:url('https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a923bb5d285db7fceeb24_ocean.png') center/cover; opacity:.5; }
.principles-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, #04101f 0%, rgba(4,16,31,.55) 30%, rgba(4,16,31,.55) 70%, #04101f 100%); }
.pstack{ position:relative; z-index:2; max-width:1120px; margin:72px auto 0; padding:0 60px; display:flex; flex-direction:column; }
.pcard{ position:sticky; top:104px; display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:0; background:#0b1f3a; border:1px solid rgba(255,255,255,.08); border-radius:30px; overflow:hidden; margin-bottom:16px; box-shadow:0 -14px 44px rgba(0,0,0,.5), 0 26px 60px rgba(0,0,0,.4); }
.pcard:nth-child(2){ top:174px; }
.pcard:nth-child(3){ top:244px; }
.pcard:last-child{ margin-bottom:16px; }
.pcard-photo{ aspect-ratio:16/10; overflow:hidden; }
.pcard-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ut-ease-expo); }
.pcard:hover .pcard-photo img{ transform:scale(1.05); }
.pcard-body{ padding:40px 54px; }
.pc-icon{ width:78px; height:78px; border-radius:20px; background:linear-gradient(150deg,#14365f,#0a2240); display:flex; align-items:center; justify-content:center; margin-bottom:24px; box-shadow:0 10px 26px rgba(0,0,0,.3); }
.pc-icon span{ width:50px; height:50px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; color:var(--ut-accent); }
.pc-title{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.01em; font-size:clamp(24px,2.6vw,34px); line-height:1.05; margin:0 0 16px; }
.pc-desc{ color:rgba(255,255,255,.62); font-weight:300; font-size:16px; line-height:1.6; margin:0; max-width:420px; }

/* CTA */
.cta2{ position:relative; padding:150px 0 160px; overflow:hidden; }
.cta2::before, .cta2::after{ content:""; position:absolute; top:0; bottom:0; width:18%; z-index:1; pointer-events:none; }
.cta2::before{ left:0; background:linear-gradient(to right, #000e1e 6%, rgba(4,18,42,.5) 55%, rgba(0,14,30,0) 100%); }
.cta2::after{ right:0; background:linear-gradient(to left, #000e1e 6%, rgba(4,18,42,.5) 55%, rgba(0,14,30,0) 100%); }
.cta2-map{ position:absolute; inset:0; overflow:hidden; opacity:.9; pointer-events:none;
  -webkit-mask:linear-gradient(to bottom, transparent 0%, #000 20%, #000 80%, transparent 100%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite:source-in; mask-composite:intersect;
  mask:linear-gradient(to bottom, transparent 0%, #000 20%, #000 80%, transparent 100%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%); }
.cta2-track{ position:absolute; top:-6%; bottom:-6%; left:0; display:flex; width:max-content; animation:ctaPan 60s linear infinite; will-change:transform; }
.cta2-track img{ height:100%; width:auto; display:block; }
@keyframes ctaPan{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.lp2.no-anim .cta2-track{ animation:none; }
.cta2-inner{ position:relative; z-index:2; text-align:center; }
.cta2-title{ font-family:var(--ut-font-display); font-weight:800; text-transform:uppercase; letter-spacing:-.02em; font-size:clamp(40px,7vw,96px); line-height:.95; margin:0 0 22px; color:#fff; }
.cta2-sub{ color:rgba(255,255,255,.75); font-weight:300; font-size:clamp(15px,1.5vw,19px); margin:0 0 30px; }
.cta2-btn{ display:inline-flex; align-items:center; gap:12px; background:#0a2a55; color:#fff; border:none; border-radius:12px; padding:16px 30px; font-family:var(--ut-font-mono); font-size:13px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; transition:background .2s; }
.cta2-btn:hover{ background:var(--ut-accent); }

/* SUNSET */
.sunset2{ position:relative; height:62vh; min-height:440px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.sunset2-bg{ position:absolute; inset:0; background:url('https://cdn.prod.website-files.com/6978e20568291edea0b5726e/6a5a92411ecca924f598b35d_sunset.png') center/cover; will-change:transform; }
.sunset2 img.ulogo{ position:relative; z-index:2; width:min(340px,46vw); filter:brightness(0) invert(1); }

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .lp2 .wrap{ padding:0 24px; }
  .lp2 .sec{ padding:80px 0; }
  .feat-card{ grid-template-columns:1fr; gap:18px; text-align:left; }
  .feat-country{ text-align:left; }
  .feat-photo{ width:150px; margin-bottom:0; align-self:start; }
  .pstack{ padding:0 22px; }
  .pcard{ grid-template-columns:1fr; top:70px; margin-bottom:14px; }
  .pcard:last-child{ margin-bottom:14px; }
  .pcard:nth-child(2){ top:128px; }
  .pcard:nth-child(3){ top:186px; }
  .pcard-body{ padding:30px 30px 36px; }
  .strat-track figure{ width:300px; aspect-ratio:4/3; }
  .cm-row{ padding:20px 26px; gap:20px; }
  .feat-card{ padding:26px; }
}
@media(max-width:640px){
  .hero2-card{ padding:24px 26px 28px; border-radius:20px; }
  .hero2-wrap{ padding:0 18px 64px; }
  .hero2-fab{ right:14px; bottom:84px; }
  .hero2-down{ width:50px; height:50px; }
  .hero2-chat{ width:44px; height:44px; }
  .intro2{ min-height:auto; padding:64px 22px; }
  .intro2-collage{ top:64px; left:22px; right:22px; bottom:64px; }
  .intro2-text{ font-size:26px; padding:0 6px; max-width:320px; }
  .tcard,.rcard{ flex-basis:78vw; }
  .cm-row{ grid-template-columns:auto 1fr; row-gap:6px; }
  .cm-country{ grid-column:2; text-align:left; }
  .cm-name{ font-size:20px; }
  .cm-avatar{ width:58px; height:58px; }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .lp2 .r{ opacity:1 !important; }
  .hero2-kb, .strat-track, .cta2-track, .hero2-down{ animation:none !important; }
}

/* ─────────────────────────────────────────────────────────────────
   Revisión con el cliente 24-jul-2026 (Paula) — ajustes Deploy 2
   ───────────────────────────────────────────────────────────────── */

/* C2 · "Country Manager <País>" se leía demasiado pequeño. Sin bandera:
   Paula descartó explícitamente añadirla. */
.cm-country{ font-size:15px; font-weight:500; letter-spacing:.1em; }
.feat-country{ font-size:16px; font-weight:500; letter-spacing:.1em; }

/* C4 · Los country managers no usan LinkedIn: los botones ahora son
   enlaces reales de email y WhatsApp. */
.feat-acts .btn-mail-dark,
.feat-acts .btn-wa{ flex:0 0 auto; text-decoration:none; padding:11px 20px; }
.feat-acts .btn-wa{ border-radius:11px; }

/* C5 · Sobraba espacio vertical entre las cards de principios y el mapa. */
.principles{ padding-bottom:90px; }
.cta2{ padding-top:90px; }

/* D2 (29-jul) · El H2 "Leading the future..." se salia del mapa y el boton sobresalia ~20px.
   El mapa NO faltaba: .cta2-map esta enmascarado y su ventana opaca va solo del 20% al 80%
   de la altura, asi que el titulo caia dentro de la banda de fade de arriba. Se extiende el
   bloque enmascarado por fuera de la caja (.cta2 ya es overflow:hidden) — y como
   .cta2-track img{height:100%} toma su tamaño de ahi, esto ADEMAS es el zoom que pidio Paula. */
.cta2{ padding-bottom:190px; }
.cta2-map{ inset:-22% 0; }
@media (max-width:767px){
  .cta2{ padding:70px 0 120px; }
  .cta2-map{ inset:-14% 0; }
  .cta2-track img{ min-width:100vw; object-fit:cover; }
}

/* C6 · En móvil el collage de 4 fotos se apelmazaba: se dejan 2
   (el capitán y la del equipo), pedido de Paula. */
@media (max-width:767px){
  .intro2-collage .col-photo:nth-child(2),
  .intro2-collage .col-photo:nth-child(4){ display:none; }
  .intro2-collage .col-photo:nth-child(1){ left:12px !important; top:2% !important; width:42vw !important; height:auto !important; }
  .intro2-collage .col-photo:nth-child(3){ right:12px !important; left:auto !important; bottom:2% !important; width:42vw !important; height:auto !important; }
  .intro2-collage .col-photo img{ width:100%; height:auto; }
}

/* C1 · Vídeo del hero. El HANDOFF lo había descartado por "Webflow no sirve mp4";
   comprobado que sí (leadership-hero.mp4, 10 MB, content-type video/mp4).
   El ken-burns queda debajo como respaldo si el vídeo no carga. */
.hero2-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }

/* ─────────────────────────────────────────────────────────────────
   Revisión 28-jul-2026 — ajustes Deploy 3
   ───────────────────────────────────────────────────────────────── */

/* D1 · Intro "Leading regional…": margen lateral mínimo de 60px en todos
   los breakpoints de desktop y ancho del collage capado a 1280px centrado,
   para que en pantallas grandes las fotos no se alejen del texto.
   (Las fotos llevan además 40px de inset inline dentro del collage.) */
@media (min-width:768px){
  .intro2{ padding-left:60px; padding-right:60px; }
  .intro2-collage{ left:max(60px, calc(50% - 640px)); right:max(60px, calc(50% - 640px)); }
}

/* D3 · Card de Paula (regional team): botones como enlaces reales. */
.tcard-acts .btn-wa, .tcard-acts .btn-mail{ text-decoration:none; }

/* bundle: lead-styles-v4 (29-jul-2026) */

/* ─────────────────────────────────────────────────────────────────
   Revisión de Andrés 10-sep-2026 (vídeo) — UT-41 · UT-42 · UT-43 · UT-44
   ───────────────────────────────────────────────────────────────── */

/* UT-41 · Las cards del board ya no llevan divisor ni botón de Email (quitados del markup
   en embedB1; el Regional Team y Country Management conservan sus contactos). Sin acciones
   debajo, el "Ver más" cierra la card. */
.tcard-inner > .vermas:last-child{ margin-bottom:2px; }

/* UT-42 · Retratos. El problema era el ASSET + la caja: fuentes apaisadas (522x467) o
   cuadradas (212x212) con cabezas de distinto tamaño, pintadas en una caja 1/0.74 anclada
   arriba → aire a los lados y mentón contra el borde (en las cuadradas el mentón caía al 92%
   de la caja). Los assets pasan a recortes 4:5 compuestos sobre la cara (photos-v2/, Vision)
   y la caja pasa a 4:5 sin desplazamiento: el encuadre ya viene hecho. */
.tcard-photo{ aspect-ratio:4/5; }
.tcard-photo img{ object-position:center center; }

/* UT-43 · El mapa punteado del CTA tenía borde duro arriba y abajo. Dos causas: (1) el PNG
   termina en línea recta (los puntos ocupan las filas 23%→79% de su alto) y con el bloque
   extendido por D2 (inset:-22%) esos bordes caen a ~6,5% y ~97% de la sección, donde la
   máscara aún está al 99%/86%; (2) en la regla original el shorthand `mask:` venía DESPUÉS
   de `mask-composite:intersect` y lo reseteaba a `add`, así que el fundido vertical ni
   siquiera se aplicaba en la banda central. Ahora el fundido arranca justo donde empiezan
   los puntos (fila 23% del PNG = 19,8% del bloque; por encima no hay nada que perder) y
   llega a opaco al ~33% de la sección; simétrico abajo (los puntos acaban en el 82,7% del
   bloque). Coordenadas del bloque enmascarado, no de la sección (bloque = 144% del alto en
   desktop y 128% en móvil: c_sección → (c+22)/1.44 y (c+14)/1.28). El composite va detrás
   del shorthand. */
.cta2-map{
  -webkit-mask:linear-gradient(to bottom, transparent 20%, #000 38%, #000 64%, transparent 82%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask:linear-gradient(to bottom, transparent 20%, #000 38%, #000 64%, transparent 82%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite:source-in; mask-composite:intersect;
}
@media (max-width:767px){
  .cta2-map{
    -webkit-mask:linear-gradient(to bottom, transparent 20%, #000 40%, #000 64%, transparent 82%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%);
    mask:linear-gradient(to bottom, transparent 20%, #000 40%, #000 64%, transparent 82%), linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%);
    -webkit-mask-composite:source-in; mask-composite:intersect;
  }
}

/* UT-44 · "Contact our team" iba en JetBrains Mono (la mono de los rótulos pequeños), que no
   es la familia del sitio. Pasa a la Helvetica Neue hospedada de la página (la misma de
   títulos y textos; el sitio global la declara como 'Helveticaneueltstd Bd/Md'). */
.cta2-btn{ font-family:var(--ut-font-display); font-weight:700; font-size:14px; letter-spacing:.06em; }

/* UT-03 · Margen inferior de la tarjeta del hero = el de la home (82 px escritorio / 85 px
   móvil), constante a cualquier alto de viewport (medido en la home: 82 a 1440x900, 1440x700
   y 1920x1080; 85 a 393x659 y 393x850). Quien pone hoy los 180 px NO es este bundle: es el
   bloque `flamel-hero-card` del custom code de SITIO, que hace `[data-fl-hero-card]{position:
   absolute !important; bottom:20% !important}` (18 % a <=767 px) — 20 % de 900 = 180, 18 % de
   659 = 119. Como ese bloque no está en el repo y sin conector no se toca, se le gana desde
   aquí por especificidad (0,3,0 + !important > 0,1,0 + !important). Sólo cambia el eje
   vertical: `left`/`width` del bloque de sitio (-18 px / 686 px) se respetan.
   Las dos reglas de respaldo (`.hero2-wrap` + `vertical-align`) dejan el mismo 82/85 si algún
   día el bloque de sitio desaparece y la tarjeta vuelve al flujo. */
.lp2 .hero2 .hero2-card{ bottom:82px !important; vertical-align:bottom; }
.lp2 .hero2 .hero2-wrap{ padding-bottom:82px; }
@media (max-width:767px){
  .lp2 .hero2 .hero2-card{ bottom:85px !important; }
  .lp2 .hero2 .hero2-wrap{ padding-bottom:85px; }
}

/* UT-04 · El hero nacía con `border-bottom-left-radius:0` (medido) frente a los 32 px de
   `.hero-section` de Deploy 1 (`border-radius:0 0 32px 32px; overflow:hidden`). Se añade el
   radio a la propia sección y `isolation:isolate` para que el recorte redondeado alcance a
   la capa de vídeo/ken-burns, que lleva `will-change:transform` y viaja en su propia capa de
   composición (mismo remedio que se aplicó hoy a `.lau-hero`). Además el velo de
   `.hero2-bg::after` terminaba en rgba(0,14,30,.96) justo sobre el borde inferior —el mismo
   navy del fondo de página—, de modo que aunque el radio existiese no se leería: ahora baja a
   .30 en los últimos 72 px (el valor con el que termina `.lau-hero-photo::after`). */

/* ═══ Ajuste del 23-oct · móvil: chips de país de Country Management, todos del mismo largo ═══
   Paula y Andrés (19-oct): «el chip de país en móvil debe tener el mismo largo en todas las filas y no ir hasta el
   margen». Por debajo de 641 px la fila es una rejilla de dos columnas y el chip, como elemento de rejilla, se
   estiraba a todo el ancho de la columna. Ahora todos miden lo que el más largo (ARGENTINA, 142 px) y arrancan
   alineados bajo el nombre. min() evita desbordar a 320 px, donde la columna mide justo 142. */
@media (max-width: 640px) {
  .lp2 .regblock .cm-row .cm-country { justify-self: start; width: min(144px, 100%); white-space: nowrap; }
}
