
@font-face{font-family:GS;src:url(fonts/GeneralSans-Light.woff2) format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:GS;src:url(fonts/GeneralSans-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:GS;src:url(fonts/GeneralSans-Medium.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:GS;src:url(fonts/GeneralSans-Bold.woff2) format('woff2');font-weight:700;font-display:swap}

:root{
  --navy:#07223C; --navy-2:#0C2E4F; --teal:#40BFB4; --teal-d:#1F8079;
  --mint:#DCEEEA; --mint-2:#EFF8F6;
  --t1:#123C5E;   /* navy tile */
  --t2:#1F6E72;   /* teal profundo */
  --t3:#40BFB4;   /* teal de marca */
  --t4:#6FCFC0;   /* mint teal */
  --t5:#9A5B3F;   /* terracota profundo */
  --hub:#C0704B;  /* Florida */
  --num:#DCEEEA;  /* numeral gigante sobre blanco */
  --num-m:#C3E4DC; /* numeral gigante sobre mint */
  --terra:#CD8B67;      /* terracota de las piezas de Instagram, sobre navy */
  --terra-d:#A96844;    /* misma familia, sobre fondos claros */
  --ink:#07223C; --ink-2:#4A6076; --ink-3:#8098AD;
  --paper:#fff;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:GS,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --pad:clamp(20px,5vw,80px);
  --maxw:1240px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:700;letter-spacing:-.015em;line-height:1.03;margin:0}
p{margin:0}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}

/* ---------- eyebrow ---------- */
.eyebrow{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--teal-d);display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--teal-d);flex:none}
.eyebrow.on-dark{color:var(--t4)}
.eyebrow.on-dark::before{background:var(--t4)}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid rgba(7,34,60,.09)}
.hd{display:flex;align-items:center;gap:34px;height:76px}
.logo{color:var(--navy);display:block;flex:none}
.logo svg,.logo img{height:30px;width:auto;display:block}
header nav{margin-left:auto;display:flex;align-items:center;gap:30px}
header nav a{font-size:14.5px;font-weight:500;text-decoration:none;color:var(--ink-2);
  transition:color .2s}
header nav a:hover{color:var(--navy)}
.lang{display:flex;gap:9px;font-size:12px;font-weight:500;color:var(--ink-3);
  padding-left:26px;border-left:1px solid rgba(7,34,60,.14)}
.lang b{color:var(--navy)}
header nav .lang a{font-size:inherit;text-decoration:none;color:var(--ink-3);transition:color .2s}
header nav .lang a:hover{color:var(--navy)}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:500;
  font-size:15px;text-decoration:none;padding:13px 24px;border-radius:2px;transition:.22s}
.btn-p{background:var(--navy);color:#fff}
.btn-p:hover{background:var(--teal-d)}
.btn-s{color:var(--navy);border:1px solid rgba(7,34,60,.24)}
.btn-s:hover{border-color:var(--navy)}
.btn-w{background:#fff;color:var(--navy)}
.btn-w:hover{background:var(--teal);color:#fff}
.btn-o{color:#fff;border:1px solid rgba(255,255,255,.34)}
.btn-o:hover{border-color:#fff}
header nav .btn{padding:11px 20px}
.burger{display:none;background:none;border:0;padding:10px 0 10px 14px;cursor:pointer}
.burger span{display:block;width:22px;height:1.5px;background:var(--navy);
  transition:transform .28s,opacity .2s}
.burger span+span{margin-top:6px}
.burger[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.burger[aria-expanded=true] span+span{transform:translateY(-3.75px) rotate(-45deg)}
.mnav{display:none;border-top:1px solid rgba(7,34,60,.09);background:#fff;
  padding:8px var(--pad) 22px}
.mnav a{display:block;text-decoration:none;font-family:var(--serif);font-weight:700;
  font-size:26px;color:var(--navy);padding:13px 0;border-bottom:1px solid rgba(7,34,60,.09)}
.mlang{display:flex;gap:16px;padding-top:20px;font-size:13px;font-weight:500;color:var(--ink-3)}
.mlang b{color:var(--navy)}
.mlang a{text-decoration:none;color:var(--ink-3);transition:color .2s}
.mlang a:hover{color:var(--navy)}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:clamp(70px,11vw,132px) 0 clamp(64px,9vw,110px)}
.hero .arcs{position:absolute;right:-16%;top:-30%;width:min(74vw,860px);aspect-ratio:1;
  pointer-events:none;opacity:.5}
.hero .arcs circle{fill:none;stroke:var(--teal);stroke-width:.9}
.hero .arcs circle:nth-child(2){stroke:var(--terra)}
.hero-in{position:relative}
h1{font-size:clamp(38px,6.4vw,80px);margin:26px 0 0;max-width:15ch}
h1 em{font-style:normal;color:var(--teal-d)}
.lede{font-size:clamp(18px,2vw,22px);line-height:1.5;color:var(--ink-2);font-weight:300;
  max-width:640px;margin-top:30px}
.lede b{color:var(--navy);font-weight:500}
.tag{margin-top:20px;font-family:var(--serif);font-weight:500;font-size:clamp(17px,1.8vw,20px);
  color:var(--navy)}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:42px}
.hero-meta{display:flex;flex-wrap:wrap;gap:36px;margin-top:64px;padding-top:26px;
  border-top:1px solid rgba(7,34,60,.11);font-size:13.5px;color:var(--ink-3)}
.hero-meta span{display:flex;align-items:center;gap:9px}
.dot{width:5px;height:5px;border-radius:50%;background:var(--teal-d);flex:none}

/* ---------- section shells ---------- */
section{position:relative}
.dark{background:var(--navy);color:#fff}
.dark h2{color:#fff}
.mint{background:var(--mint)}
.pad{padding:clamp(70px,10vw,124px) 0}
h2{font-size:clamp(30px,4.4vw,54px);margin-top:22px}
h2 em{font-style:normal;color:var(--t4)}
.mint h2 em,.paper h2 em,.close h2 em{color:var(--teal-d)}
.body{font-size:clamp(16.5px,1.6vw,19px);line-height:1.62;color:var(--ink-2);font-weight:300}
.dark .body{color:rgba(255,255,255,.74)}
.split .body{font-size:clamp(16px,1.65vw,18.5px);max-width:30ch}

/* ---------- problem (split) ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:56px;
  border-top:1px solid rgba(255,255,255,.16)}
.split>div{padding:40px 48px 44px 0;border-right:1px solid rgba(255,255,255,.16)}
.split>div:last-child{padding-right:0;padding-left:40px;border-right:0}
.split h3{font-size:clamp(22px,2.6vw,32px);color:#fff;margin-bottom:16px}
.split .n{font-family:var(--sans);font-size:11px;letter-spacing:.22em;font-weight:500;
  color:var(--t4);text-transform:uppercase;display:block;margin-bottom:20px}
.verdict{margin-top:52px;font-family:var(--serif);font-weight:500;
  font-size:clamp(21px,2.6vw,31px);line-height:1.25;color:#fff;max-width:760px}
.verdict em{font-style:normal;color:var(--t4)}

/* ---------- SELL (dominant) ---------- */
.sell{padding:clamp(84px,12vw,150px) 0}
.sell .num{position:absolute;right:var(--pad);top:clamp(30px,5vw,60px);
  font-family:var(--sans);font-weight:700;font-size:clamp(160px,26vw,340px);
  letter-spacing:-.04em;line-height:.72;color:var(--num);z-index:0;
  pointer-events:none;user-select:none}
.sell-in{position:relative;z-index:1}
.sell h2{max-width:14ch}
.grid6{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:60px}
.cell{background:#fff;padding:30px 28px 34px;min-height:186px;
  border:1px solid rgba(7,34,60,.14);border-radius:3px;
  transition:transform .3s cubic-bezier(.22,.7,.3,1),box-shadow .3s,border-color .3s}
.cell:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(7,34,60,.09);
  border-color:transparent}
.cell b{display:block;font-family:var(--serif);font-weight:700;font-size:20px;
  color:var(--navy);margin:16px 0 9px;letter-spacing:-.01em}
.cell p{font-size:15px;line-height:1.55;color:var(--ink-2);font-weight:300}
.cell i{font-style:normal;font-family:var(--sans);font-weight:700;font-size:11px;
  letter-spacing:.1em;color:#07223C;background:var(--t4);
  display:inline-block;padding:5px 10px;border-radius:2px}
.note{margin-top:44px;padding-left:26px;border-left:2px solid var(--teal-d);
  font-size:clamp(16px,1.7vw,19px);line-height:1.55;color:var(--ink-2);font-weight:300;max-width:660px}


/* ---------- OPERATE como bloque central ---------- */
.opsec{padding:clamp(84px,12vw,150px) 0}
.opsec .num{position:absolute;right:var(--pad);top:clamp(30px,5vw,60px);
  font-family:var(--sans);font-weight:700;font-size:clamp(160px,26vw,340px);
  letter-spacing:-.04em;line-height:.72;color:var(--num-m);z-index:0;
  pointer-events:none;user-select:none}
.opsec h2{max-width:15ch}
.chain li{padding:17px 0}
.chain b{font-size:clamp(16.5px,1.75vw,19px)}

/* ---------- chain (OPERATE) ---------- */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,7vw,96px);
  align-items:start}
.chain{margin-top:6px}
.chain li{list-style:none;display:flex;gap:20px;align-items:baseline;
  padding:15px 0;border-bottom:1px solid rgba(7,34,60,.13)}
.chain li:first-child{border-top:1px solid rgba(7,34,60,.13)}
.chain span{font-family:var(--sans);font-weight:700;font-size:11.5px;color:var(--t2);
  width:26px;flex:none;letter-spacing:.06em}
.chain b{font-weight:500;font-size:16.5px;color:var(--navy)}
.affil{margin-top:36px;padding:24px 26px;background:var(--mint-2);border-left:2px solid var(--terra-d)}
.affil p{font-size:15.5px;line-height:1.56;color:var(--ink-2);font-weight:300}
.affil b{color:var(--navy);font-weight:500}
.stand{margin-top:34px;font-family:var(--serif);font-weight:500;font-size:clamp(18px,2vw,23px);
  line-height:1.3;color:var(--navy);max-width:26ch}

/* ---------- GROW ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:56px}
.step{padding-top:22px;border-top:2px solid var(--teal-d)}
.step b{display:block;font-family:var(--serif);font-weight:700;font-size:19px;margin-bottom:8px}
.step p{font-size:14.5px;color:var(--ink-2);font-weight:300;line-height:1.55}
.option{margin-top:56px;max-width:640px;font-size:16px;line-height:1.6;color:var(--ink-2);
  font-weight:300;padding-top:26px;border-top:1px solid rgba(7,34,60,.13)}

/* ---------- why ---------- */

/* ---------- close ---------- */
.close{background:#fff;text-align:center;padding:clamp(84px,12vw,146px) 0}
.close h2{max-width:17ch;margin-inline:auto}
.close .body{max-width:520px;margin:26px auto 0}
.close .cta-row{justify-content:center;margin-top:40px}
.close .eyebrow{justify-content:center}

/* ---------- footer ---------- */
footer{background:var(--navy);color:rgba(255,255,255,.6);font-size:14px;
  padding:70px 0 42px}
.ft{display:grid;grid-template-columns:1.5fr 1fr 1fr .9fr 1.15fr;gap:36px}
.ft h4{font-family:var(--sans);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.42);font-weight:500;margin:0 0 16px}
.ft a{display:block;text-decoration:none;padding:5px 0;color:rgba(255,255,255,.68)}
.ft a:hover{color:var(--teal)}
.ft .logo{color:#fff;margin-bottom:18px}
.ft .logo svg,.ft .logo img{height:26px}
.ft-note{font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.45);max-width:34ch}
.ft-bot{margin-top:54px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;font-size:12.5px;
  color:rgba(255,255,255,.4)}



/* ---------- why: jerarquia ---------- */
.why{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:60px}
.wc{background:#fff;padding:38px 34px 40px;border-radius:3px;position:relative;
  border-top:3px solid var(--t3)}
.wc:nth-child(2){border-top-color:var(--t4)}
.wc:nth-child(3){border-top-color:var(--hub)}
.wc:nth-child(4){border-top-color:var(--t2)}
.wn{font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.14em;
  color:var(--teal-d);display:block;margin-bottom:16px}

.wc b{display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(21px,2.2vw,26px);color:var(--navy);margin-bottom:12px;letter-spacing:-.012em}
.wc p{font-size:16px;line-height:1.58;color:var(--ink-2);font-weight:300}
.why-min{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 46px;margin-top:34px;
  padding-top:32px;border-top:1px solid rgba(7,34,60,.16)}
.why-min b{display:block;font-family:var(--sans);font-weight:500;font-size:15.5px;
  color:var(--navy);margin-bottom:5px}
.why-min p{font-size:14.5px;line-height:1.55;color:var(--ink-2);font-weight:300}

/* ---------- tile map de estados ---------- */
.usmap{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(4px,.55vw,8px);
  margin:56px 0 20px;max-width:820px}
.usmap .tl{grid-column:auto;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  border-radius:4px;font-family:var(--sans);font-weight:500;
  font-size:clamp(8px,.85vw,12px);letter-spacing:.04em;
  font-style:normal;opacity:0;transform:scale(.82);
  transition:opacity .5s ease,transform .5s cubic-bezier(.22,.9,.3,1),filter .25s}
.usmap .t1{background:var(--t1);color:rgba(255,255,255,.46)}
.usmap .t2{background:var(--t2);color:rgba(255,255,255,.78)}
.usmap .t3{background:var(--t3);color:#07223C;font-weight:700}
.usmap .t4{background:var(--t4);color:#07223C;font-weight:700}
.usmap .t5{background:var(--t5);color:#FFF1E9;font-weight:700}
.usmap .tl:hover{filter:brightness(1.16)}
.rv.in .usmap .tl{opacity:1;transform:none;transition-delay:calc(var(--i) * 11ms)}
.usmap .tl:hover{background:var(--tile-2);color:rgba(255,255,255,.85)}
.usmap .hub{background:var(--hub);color:#FFF1E9;font-weight:700;
  box-shadow:0 0 0 2.5px rgba(255,255,255,.92)}
.rv.in .usmap .hub{transition-delay:.62s}

.maplg{display:flex;align-items:center;gap:14px;margin:26px 0 8px;
  font-family:var(--serif);font-weight:500;font-size:clamp(17px,1.9vw,21px);
  line-height:1.3;color:#fff}
.maplg .sw{width:26px;height:2px;background:var(--hub);flex:none}
@media (prefers-reduced-motion:reduce){.usmap .tl{opacity:1;transform:none}}

/* arcos de fondo en las secciones navy */
.arc-bg{position:absolute;right:0;top:0;width:min(58vw,700px);height:auto;
  pointer-events:none;opacity:.5}
.arc-bg circle{fill:none;stroke:rgba(64,191,180,.34);stroke-width:1}

/* GROW sobre navy */
.dark .step{border-top-color:var(--t3)}
.dark .step:nth-child(2){border-top-color:var(--t4)}
.dark .step:nth-child(3){border-top-color:var(--hub)}
.dark .step:nth-child(4){border-top-color:var(--t2)}
.dark .step b{color:#fff}
.dark .step p{color:rgba(255,255,255,.62)}
.dark .option{color:rgba(255,255,255,.6);border-top-color:rgba(255,255,255,.16)}
.dark .wrap{position:relative;z-index:1}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.22,.7,.3,1),transform .7s cubic-bezier(.22,.7,.3,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .grid6{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);gap:22px 26px}
  .two{grid-template-columns:1fr;gap:44px}
  .ft{grid-template-columns:1fr 1fr}
  .ft>div:nth-child(5){grid-column:1/-1}
  .ft>div:first-child{grid-column:1/-1;margin-bottom:14px}
}
@media (max-width:760px){
  body{font-size:16px}
  header nav > a:not(.btn){display:none}
  /* el idioma queda a la vista en la barra, no escondido en el menu */
  .lang{gap:1px;padding-left:0;border-left:0;margin-left:0;font-size:12.5px}
  .lang a,.lang b{padding:8px 6px;border-radius:2px;line-height:1}
  .lang b{background:var(--navy);color:#fff}
  .burger{display:block}
  .mnav:not([hidden]){display:block}
  header nav{gap:4px}
  .eyebrow{font-size:10.5px;letter-spacing:.18em;gap:11px}
  .eyebrow::before{width:20px}
  .hd{height:64px}
  .logo svg{height:26px}
  .hero{padding:56px 0 62px}
  .hero .arcs{right:-40%;top:-14%;width:120vw;opacity:.42}
  h1{font-size:clamp(34px,9.6vw,46px)}
  .lede{font-size:17.5px;margin-top:22px}
  .cta-row{margin-top:32px}
  .cta-row .btn{flex:1 1 100%;justify-content:center}
  .hero-meta{gap:12px;flex-direction:column;margin-top:44px}
  .split{grid-template-columns:1fr;margin-top:38px}
  .split>div{padding:26px 0 28px;border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}
  .split>div:last-child{padding-left:0;border-bottom:0}
  .grid6,.why,.why-min{grid-template-columns:1fr}
  .wc{padding:30px 26px 34px}
  .why-min{gap:22px;margin-top:26px;padding-top:26px}
  .cell{min-height:0;padding:26px 24px 30px}
  .sell .num,.opsec .num{font-size:132px;top:18px;right:calc(var(--pad) - 6px)}
  .steps{grid-template-columns:1fr;gap:0}
  .usmap{gap:3px;margin:38px 0 16px}
  .usmap .tl{font-size:7.5px;border-radius:2px}
  .maplg{font-size:17px;align-items:flex-start;gap:12px}
  .maplg .sw{margin-top:12px;width:20px}
  .arc-bg{width:150vw;opacity:.4}
  .step{padding:20px 0;border-top:1px solid rgba(7,34,60,.13);border-width:1px}
  .step:first-child{border-top:2px solid var(--teal-d)}
}

/* pantallas muy angostas: que la barra entre entera con el selector de idioma */
@media (max-width:400px){
  .logo svg,.logo img{height:24px}
  header nav .btn{padding:10px 14px;font-size:14px}
  .lang{font-size:12px}
  .lang a,.lang b{padding:8px 4px}
  .burger{padding-left:10px}
}


.social{display:flex;gap:14px;margin-top:22px}
.social a{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.22);border-radius:50%;transition:.22s}
.social a:hover{border-color:var(--t4);background:rgba(111,207,192,.1)}
.social svg{width:16px;height:16px;fill:rgba(255,255,255,.72);transition:fill .22s}
.social a:hover svg{fill:var(--t4)}

/* ---------- una estructura, tres capacidades ---------- */
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}
.cap{display:block;text-decoration:none;background:#fff;border-radius:3px;
  padding:28px 28px 26px;border:1px solid rgba(7,34,60,.14);border-top:3px solid var(--t3);
  transition:transform .3s cubic-bezier(.22,.7,.3,1),box-shadow .3s,border-color .3s}
.cap:nth-child(2){border-top-color:var(--hub)}
.cap:nth-child(3){border-top-color:var(--t2)}
.cap:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(7,34,60,.09)}
.capk{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--teal-d);display:block}
.cap:nth-child(2) .capk{color:var(--terra-d)}
.cap:nth-child(3) .capk{color:var(--t2)}
.cap b{display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(19px,2vw,23px);color:var(--navy);margin:14px 0 10px;letter-spacing:-.012em}
.cap p{font-size:15px;line-height:1.55;color:var(--ink-2);font-weight:300}
.cap i{font-style:normal;display:inline-block;margin-top:18px;font-family:var(--sans);
  font-weight:500;font-size:14px;color:var(--teal-d)}
.cap i span{display:inline-block;transition:transform .22s}
.cap:hover i span{transform:translateX(4px)}
.notwhat{margin-top:44px;padding:26px 28px;background:var(--mint-2);
  border-left:2px solid var(--terra-d);font-size:clamp(15.5px,1.6vw,17px);line-height:1.58;
  color:var(--ink-2);font-weight:300;max-width:880px}
.notwhat b{color:var(--navy);font-weight:500}
.capline{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:9px 14px;
  font-size:13px;color:var(--ink-3)}
.capline b{font-family:var(--sans);font-weight:500;color:var(--ink-2)}
.capline a{text-decoration:none;font-weight:500;font-size:13px;color:var(--teal-d);
  padding:6px 12px;border:1px solid rgba(31,128,121,.32);border-radius:2px;transition:.2s}
.capline a:hover{border-color:var(--teal-d);background:var(--mint-2)}
.capline a.on{background:var(--navy);border-color:var(--navy);color:#fff}
@media (max-width:1000px){ .caps{grid-template-columns:1fr} }
@media (max-width:760px){
  .caps{margin-top:36px}
  .cap{padding:24px 24px 22px}
  .notwhat{margin-top:32px;padding:22px 22px}
  .capline{gap:8px 10px}
}

/* ---------- consentimiento (CMP) ---------- */
.cmp{position:fixed;left:0;right:0;bottom:0;z-index:200;background:#fff;
  border-top:1px solid rgba(7,34,60,.14);box-shadow:0 -10px 40px rgba(7,34,60,.13)}
.cmp-in{max-width:var(--maxw);margin:0 auto;padding:22px var(--pad) 24px;
  display:flex;flex-wrap:wrap;align-items:center;gap:18px 40px;
  max-height:80vh;overflow-y:auto}
.cmp-txt{order:0;flex:1 1 400px}
.cmp-opt{order:1;flex:1 1 100%}
.cmp-btn{order:2;margin-left:auto}
.cmp p{font-size:14.5px;line-height:1.55;color:var(--ink-2);font-weight:300;max-width:64ch}
.cmp p b{color:var(--navy);font-weight:500}
.cmp a{color:var(--teal-d);text-decoration:underline;text-underline-offset:2px}
.cmp-sub{font-size:13px;color:var(--ink-3);margin-top:7px}
.cmp-opt{display:grid;gap:12px;padding:18px 0 2px;border-top:1px solid rgba(7,34,60,.12)}
.cmp-opt[hidden]{display:none}
.cmp-opt label{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;
  color:var(--ink-2);font-weight:300;cursor:pointer}
.cmp-opt input{margin:4px 0 0;accent-color:var(--teal-d);width:16px;height:16px;flex:none}
.cmp-opt b{color:var(--navy);font-weight:500}
.cmp-btn{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cmp-btn button{font-family:var(--sans);font-weight:500;font-size:14.5px;line-height:1;
  padding:13px 20px;border-radius:2px;cursor:pointer;border:1px solid transparent;
  transition:.2s;white-space:nowrap}
.cmp-btn .cmp-y{background:var(--navy);color:#fff;border-color:var(--navy)}
.cmp-btn .cmp-y:hover{background:var(--teal-d);border-color:var(--teal-d)}
.cmp-btn .cmp-n{background:#fff;color:var(--navy);border-color:var(--navy)}
.cmp-btn .cmp-n:hover{background:var(--mint-2)}
.cmp-btn .cmp-l{background:none;color:var(--ink-2);border-color:transparent;
  padding-inline:6px;text-decoration:underline;text-underline-offset:3px}
.cmp-btn .cmp-l:hover{color:var(--navy)}
@media (max-width:760px){
  .cmp-in{gap:14px;padding:20px var(--pad)}
  .cmp p{font-size:14px}
  .cmp-txt{flex:1 1 100%}
  .cmp-btn{margin-left:0;flex:1 1 100%;gap:9px}
  .cmp-btn .cmp-n,.cmp-btn .cmp-y{flex:1 1 calc(50% - 5px);justify-content:center;
    text-align:center}
  .cmp-btn #cmp-cus{order:3;flex:1 1 100%;padding-block:8px}
}

/* boton flotante de WhatsApp -------------------------------------------------
   Verde oficial de WhatsApp a proposito: es el color que la gente reconoce.
   Mientras el banner de cookies esta abierto sube para no quedar tapado.      */
.waf{position:fixed;right:20px;bottom:20px;z-index:60;width:54px;height:54px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:#25D366;color:#fff;box-shadow:0 6px 20px rgba(7,34,60,.28);
  transition:transform .18s ease,box-shadow .18s ease,bottom .2s ease}
.waf svg{width:30px;height:30px;display:block}
.waf:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(7,34,60,.34)}
.waf:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
body:has(#cmp:not([hidden])) .waf{bottom:calc(20px + var(--cmp-h,300px))}
@media (max-width:760px){
  .waf{right:14px;bottom:14px;width:50px;height:50px}
  .waf svg{width:27px;height:27px}
  body:has(#cmp:not([hidden])) .waf{bottom:calc(14px + var(--cmp-h,330px))}
}
@media (prefers-reduced-motion:reduce){.waf{transition:none}.waf:hover{transform:none}}

/* ---------- imagenes editoriales -------------------------------------------
   Son recurso de atmosfera, NO evidencia documental de la operacion: van sin
   caption, con alt vacio y aria-hidden. La prueba factual esta en el copy
   (Buenavida Imports LLC, estructura licenciada, Miami).
   Nunca dentro de una card ni con borde: la foto emerge del color de la
   seccion con un degrade y sangra hasta el borde de pantalla.               */
.bleed{position:relative;line-height:0;overflow:hidden;
  height:clamp(280px,32vw,440px);margin-top:clamp(46px,6vw,86px);
  pointer-events:none;user-select:none}
.bleed img{width:100%;height:100%;object-fit:cover;object-position:50% 46%;display:block}
.bleed::after{content:"";position:absolute;inset:0;pointer-events:none}
.bleed-mint::after{background:linear-gradient(180deg,
  rgba(220,238,234,1) 0%,rgba(220,238,234,.62) 15%,rgba(220,238,234,0) 48%)}
/* la banda cierra la seccion: se come el padding de abajo */
section:has(> .bleed:last-child){padding-bottom:0}
.bleed-paper::after{background:linear-gradient(180deg,
  rgba(255,255,255,1) 0%,rgba(255,255,255,.66) 15%,rgba(255,255,255,0) 48%)}
.bleed-paper img{object-position:56% 44%}
.bleed-pack img{object-position:50% 66%}
@media (max-width:900px){
  .bleed{height:clamp(215px,48vw,300px)}
}


/* ---------- cinta de logos (prueba social) ---------------------------------
   Deliberadamente secundaria: se descubre, no compite. Vive dentro de WHY
   HUBLY, sobre el mismo mint, sin caja ni borde propio.
   Los archivos son los originales de la web vieja, negro sobre blanco. En vez
   de recortarles el fondo (recomprimir el logo de un tercero degrada), se usa
   mix-blend-mode:darken: el blanco se funde con el mint y el trazo queda.
   darken y no multiply porque son JPEG: los bordes tienen pixeles casi-blancos
   (250,250,250) y multiply los deja un poco mas oscuros que el mint -> se ve el
   recuadro. darken toma el minimo por canal, asi que cualquier cosa mas clara
   que el mint desaparece exacto.
   OJO: .lgs-track se anima con transform, y eso crea un stacking context que
   AISLA el blend. Sin un fondo real debajo dentro de ese contexto, el blanco
   del JPEG se ve como recuadro. Por eso .lgs-track lleva background:var(--mint).
   Por eso tambien la cinta SOLO funciona sobre mint.                       */
.lgs{margin-top:clamp(34px,4.5vw,52px);padding-top:clamp(26px,3vw,34px);
  border-top:1px solid rgba(7,34,60,.13)}
.lgs-h{font-family:var(--sans);font-weight:700;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-3);margin:0 0 18px}
.lgs-vp{position:relative;overflow:hidden}
/* los bordes se desvanecen en el fondo de la seccion: la cinta no "empieza" */
.lgs-vp::before,.lgs-vp::after{content:"";position:absolute;top:0;bottom:0;width:64px;
  z-index:2;pointer-events:none}
.lgs-vp::before{left:0;background:linear-gradient(90deg,var(--mint),rgba(220,238,234,0))}
.lgs-vp::after{right:0;background:linear-gradient(270deg,var(--mint),rgba(220,238,234,0))}
.lgs-track{display:flex;width:max-content;background:var(--mint);
  animation:lgs-run 68s linear infinite}
.lgs-set{display:flex;align-items:center;gap:clamp(40px,4.6vw,66px);
  padding-right:clamp(40px,4.6vw,66px)}
.lgs-set img{height:var(--h,30px);width:auto;flex:none;display:block;
  mix-blend-mode:darken;filter:grayscale(1);opacity:.78;
  transition:opacity .3s ease,filter .3s ease}
.lgs-vp:hover .lgs-track{animation-play-state:paused}
.lgs-set img:hover{opacity:1;filter:grayscale(0)}
@keyframes lgs-run{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (max-width:760px){
  .lgs-set{gap:34px;padding-right:34px}
  .lgs-set img{height:calc(var(--h,30px) * .86)}
  .lgs-vp::before,.lgs-vp::after{width:34px}
  .lgs-track{animation-duration:44s}
}
@media (prefers-reduced-motion:reduce){
  .lgs-track{animation:none;width:100%}
  .lgs-set{flex-wrap:wrap;justify-content:center;row-gap:22px;padding-right:0}
  .lgs-set+.lgs-set{display:none}
  .lgs-vp::before,.lgs-vp::after{display:none}
}


/* ---------- paginas internas ---------- */
.phero{padding:clamp(64px,9vw,110px) 0 clamp(48px,6vw,74px);position:relative;overflow:hidden}
.phero .arcs{position:absolute;right:-14%;top:-46%;width:min(66vw,760px);aspect-ratio:1;
  pointer-events:none;opacity:.4}
.phero .arcs circle{fill:none;stroke:var(--teal);stroke-width:.9}
.phero-in{position:relative}
.phero h1{font-size:clamp(34px,5.4vw,66px);margin:24px 0 0;max-width:14ch}
.phero h1 em{font-style:normal;color:var(--teal-d)}
.phero .lede{font-size:clamp(17.5px,1.9vw,21px);line-height:1.52;color:var(--ink-2);
  font-weight:300;max-width:620px;margin-top:26px}
.crumb{display:flex;gap:10px;align-items:center;font-family:var(--sans);font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.crumb a{text-decoration:none;color:var(--ink-3)}
.crumb a:hover{color:var(--navy)}

/* bloques de detalle */
.rows{margin-top:8px}
.row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);
  gap:clamp(28px,5vw,72px);padding:clamp(34px,4vw,52px) 0;
  border-top:1px solid rgba(7,34,60,.14);align-items:start}
.dark .row{border-top-color:rgba(255,255,255,.17)}
.row:last-child{border-bottom:1px solid rgba(7,34,60,.14)}
.dark .row:last-child{border-bottom-color:rgba(255,255,255,.17)}
.row .lbl{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.16em;
  color:var(--teal-d);text-transform:uppercase;margin-bottom:14px;display:block}
.dark .row .lbl{color:var(--t4)}
.row h3{font-family:var(--serif);font-weight:700;font-size:clamp(22px,2.5vw,30px);
  color:var(--navy);letter-spacing:-.012em;line-height:1.1}
.dark .row h3{color:#fff}
.row p{font-size:16.5px;line-height:1.6;color:var(--ink-2);font-weight:300}
.dark .row p{color:rgba(255,255,255,.72)}
.row p+p{margin-top:14px}
.row .who{margin-top:18px;padding-top:14px;border-top:1px solid rgba(7,34,60,.12);
  font-size:14.5px;color:var(--ink-2)}
.row .who b{font-weight:500;color:var(--navy)}

/* tres pasos / tarjetas de contexto */
.ctx{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}
.ctx>div{background:#fff;border:1px solid rgba(7,34,60,.14);border-radius:3px;
  padding:30px 28px 34px}
.mint .ctx>div{border-color:transparent}
.ctx b{display:block;font-family:var(--serif);font-weight:700;font-size:20px;
  color:var(--navy);margin-bottom:10px}
.ctx p{font-size:15px;line-height:1.56;color:var(--ink-2);font-weight:300}
.step-n{font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.1em;
  color:#07223C;background:var(--t4);display:inline-block;padding:5px 10px;
  border-radius:2px;margin-bottom:16px}

/* pull quote */
.pull{font-family:var(--serif);font-weight:500;font-size:clamp(21px,2.8vw,33px);
  line-height:1.24;color:var(--navy);max-width:22ch;margin:0}
.dark .pull{color:#fff}
.pull em{font-style:normal;color:var(--teal-d)}
.dark .pull em{color:var(--t4)}

/* navegacion entre paginas */
.xnav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:56px}
.xnav a{display:block;text-decoration:none;background:#fff;border:1px solid rgba(7,34,60,.14);
  border-radius:3px;padding:28px 30px 32px;transition:.25s}
.xnav a:hover{border-color:var(--navy);transform:translateY(-2px)}
.xnav span{font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--teal-d);display:block;margin-bottom:10px}
.xnav b{display:block;font-family:var(--serif);font-weight:700;font-size:21px;
  color:var(--navy);margin-bottom:7px}
.xnav p{font-size:14.5px;color:var(--ink-2);font-weight:300;line-height:1.5}

@media (max-width:1000px){ .ctx{grid-template-columns:1fr 1fr} }
@media (max-width:760px){
  .phero{padding:44px 0 40px}
  .phero .arcs{right:-40%;top:-16%;width:120vw}
  .row{grid-template-columns:1fr;gap:18px;padding:28px 0}
  .ctx,.xnav{grid-template-columns:1fr;gap:12px}
  .pull{max-width:none}
}


/* ================= /operate · diagrama de los tres tiers ================= */
.tiers{margin-top:56px;position:relative}
.tier-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,20px);
  align-items:stretch}
.tier{position:relative;background:var(--t1);border-radius:4px;padding:26px 22px 28px;
  border-top:3px solid var(--t2)}
.tier.t-imp{border-top-color:var(--t3)}
.tier.t-dist{border-top-color:var(--t3)}
.tier.t-ret{border-top-color:var(--t4)}
.tier .tg{font-family:var(--sans);font-weight:700;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--t4);display:block;margin-bottom:12px}
.tier.t-you .tg{color:rgba(255,255,255,.44)}
.tier b{display:block;font-family:var(--serif);font-weight:700;font-size:clamp(17px,1.9vw,22px);
  color:#fff;margin-bottom:9px;line-height:1.1}
.tier p{font-size:14px;line-height:1.55;color:rgba(255,255,255,.68);font-weight:300}
.tier.t-you{background:transparent;border:1px dashed rgba(255,255,255,.3);border-top-width:1px}
.arrows{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,20px);
  margin-top:14px}
.arrows i{display:block;height:1px;background:rgba(255,255,255,.24);position:relative;
  margin-top:9px}
.arrows i::after{content:"";position:absolute;right:-1px;top:-3px;width:7px;height:7px;
  border-top:1px solid rgba(255,255,255,.42);border-right:1px solid rgba(255,255,255,.42);
  transform:rotate(45deg)}
.arrows i:last-child{background:none}
.arrows i:last-child::after{display:none}
.hubly-span{margin-top:16px;display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(10px,1.4vw,20px)}
.hubly-span .sp{grid-column:2 / span 2;border:1px solid var(--hub);border-top:0;
  border-radius:0 0 4px 4px;height:52px;position:relative}
.hubly-span .sp span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  background:var(--navy);padding:0 14px;font-family:var(--sans);font-weight:700;
  font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--hub);
  white-space:nowrap}
@media (max-width:820px){
  .tier-rail,.hubly-span{grid-template-columns:1fr;gap:10px}
  .arrows{display:none}
  .hubly-span .sp{grid-column:1;height:auto;border:0;border-left:2px solid var(--hub);
    padding:12px 0 12px 16px;border-radius:0}
  .hubly-span .sp span{position:static;transform:none;background:none;padding:0;display:block}
}

/* ================= /sell · frentes con numeral grande ================= */
.fronts{margin-top:52px}
.front{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(20px,3.4vw,54px);padding:clamp(32px,4vw,48px) 0;
  border-top:1px solid rgba(7,34,60,.14);align-items:start}
.front:last-child{border-bottom:1px solid rgba(7,34,60,.14)}
.front .fn{font-family:var(--sans);font-weight:700;font-size:clamp(40px,5vw,72px);
  line-height:.8;letter-spacing:-.04em;color:var(--t4);width:2.2ch;flex:none}
.front h3{font-family:var(--serif);font-weight:700;font-size:clamp(22px,2.5vw,30px);
  color:var(--navy);letter-spacing:-.012em;line-height:1.08}
.front p{font-size:16.5px;line-height:1.6;color:var(--ink-2);font-weight:300}
.front p+p{margin-top:14px}
.front .fits{margin-top:20px;padding-left:18px;border-left:2px solid var(--hub);
  font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.front .fits b{font-weight:500;color:var(--navy)}
@media (max-width:900px){
  .front{grid-template-columns:auto minmax(0,1fr);gap:16px 20px;padding:28px 0}
  .front>div:last-child{grid-column:1 / -1}
  .front .fn{font-size:40px}
}

/* ================= /grow · hero con mapa + diagrama depth/width ================= */
.ghero{background:var(--navy);color:#fff;padding:clamp(56px,8vw,96px) 0 clamp(56px,7vw,88px);
  position:relative;overflow:hidden}
.ghero h1{color:#fff;font-size:clamp(34px,5.4vw,64px);margin:24px 0 0;max-width:13ch}
.ghero h1 em{font-style:normal;color:var(--t4)}
.ghero .lede{color:rgba(255,255,255,.74);font-size:clamp(17.5px,1.9vw,21px);
  font-weight:300;line-height:1.5;max-width:560px;margin-top:24px}
.ghero .crumb,.ghero .crumb a{color:rgba(255,255,255,.5)}
.ghero .crumb a:hover{color:#fff}
.ghero-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);
  gap:clamp(32px,5vw,72px);align-items:center;position:relative;z-index:1}
.ghero .usmap{margin:0;max-width:none}
@keyframes tlin{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
.ghero .usmap .tl{opacity:1;transform:none;animation:tlin .5s cubic-bezier(.22,.9,.3,1) both;
  animation-delay:calc(var(--i) * 11ms)}
.ghero .usmap .hub{animation-delay:.64s}
@media (prefers-reduced-motion:reduce){.ghero .usmap .tl{animation:none}}
.ghero .maplg{margin-top:26px}
@media (max-width:900px){
  .ghero-grid{grid-template-columns:1fr;gap:38px}
  .ghero h1{max-width:none}
}

.dw{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);margin-top:52px}
.dw>div{border-top:2px solid rgba(7,34,60,.16);padding-top:24px}
.dw.mint>div{border-top-color:rgba(7,34,60,.2)}
.dw .dwt{font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.1vw,24px);
  color:var(--navy);margin-bottom:6px}
.dw .dws{font-size:14.5px;color:var(--ink-2);font-weight:300;line-height:1.5;
  margin-bottom:22px;max-width:32ch}
.dwg{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;max-width:280px}
.dwg i{aspect-ratio:1;border-radius:3px;background:#E6EFF3;display:block}
.dw .deep i:nth-child(5n+1){background:var(--t2)}
.dw .deep i:nth-child(5n+1):nth-child(-n+16){background:var(--t3)}
.dw .wide i:nth-child(-n+5){background:var(--t4)}
.dw .dwg.deep i:first-child{background:var(--hub)}
.dwl{margin-top:16px;font-family:var(--sans);font-size:12.5px;letter-spacing:.04em;
  color:var(--ink-3)}
@media (max-width:760px){ .dw{grid-template-columns:1fr;gap:30px} }


/* ================= /contact ================= */
.ctwo{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(36px,6vw,86px);align-items:start;margin-top:8px}
.cform{margin-top:38px;max-width:520px}
.fld{display:block;margin-bottom:18px}
.fld span{display:block;font-family:var(--sans);font-weight:500;font-size:13px;
  letter-spacing:.02em;color:var(--navy);margin-bottom:7px}
.fld span i{font-style:normal;font-weight:400;color:var(--ink-3)}
.fld input,.fld textarea{width:100%;font-family:var(--sans);font-size:16px;font-weight:300;
  color:var(--navy);background:#fff;border:1px solid rgba(7,34,60,.22);border-radius:3px;
  padding:13px 14px;transition:border-color .2s,box-shadow .2s}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--teal-d);
  box-shadow:0 0 0 3px rgba(31,128,121,.14)}
.fld input:user-invalid,.fld textarea:user-invalid{border-color:#B4432F}
.cform .btn{margin-top:8px;border:0;cursor:pointer;font-size:15px}
.cform .btn[disabled]{opacity:.55;cursor:default}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ferr{margin-top:14px;font-size:14.5px;color:#8E3423;max-width:44ch}
.dlist{list-style:none;padding:0;margin:38px 0 0}
.dlist li{padding:16px 0;border-top:1px solid rgba(7,34,60,.16);font-size:16.5px;
  color:var(--navy);font-weight:300}
.dlist li:last-child{border-bottom:1px solid rgba(7,34,60,.16)}
.dlist span{display:block;font-family:var(--sans);font-weight:700;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--teal-d);margin-bottom:6px}
.dlist a{color:var(--navy);text-decoration:none;border-bottom:1px solid var(--t4);
  padding-bottom:1px}
.dlist a:hover{border-bottom-color:var(--navy)}
.inl{color:var(--teal-d);text-decoration:none;border-bottom:1px solid var(--t4)}
.inl:hover{border-bottom-color:var(--teal-d)}
@media (max-width:900px){ .ctwo{grid-template-columns:1fr;gap:44px} }

/* ================= paginas de estado (thank-you, call-booked, 404) ============ */
.mid{position:relative;overflow:hidden;padding:clamp(70px,11vw,130px) 0 clamp(70px,10vw,120px);
  min-height:62vh;display:flex;align-items:center}
.mid .arcs{position:absolute;right:-16%;top:-40%;width:min(70vw,820px);aspect-ratio:1;
  pointer-events:none;opacity:.4}
.mid .arcs circle{fill:none;stroke:var(--teal);stroke-width:.9}
.mid-in{position:relative;width:100%}
.mid h1{font-size:clamp(34px,5.6vw,66px);margin:22px 0 0;max-width:13ch}
.mid h1 em{font-style:normal;color:var(--teal-d)}
.mid .lede{font-size:clamp(17.5px,1.9vw,21px);line-height:1.52;color:var(--ink-2);
  font-weight:300;max-width:600px;margin-top:24px}
.nextsteps{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:48px;max-width:900px}
.nextsteps>div{background:var(--mint-2);border-radius:3px;padding:30px 28px 32px;
  border-top:3px solid var(--t3)}
.nextsteps>div:nth-child(2){border-top-color:var(--t4)}
.nextsteps b{display:block;font-family:var(--serif);font-weight:700;font-size:21px;
  color:var(--navy);margin-bottom:9px}
.nextsteps p{font-size:15px;line-height:1.56;color:var(--ink-2);font-weight:300;
  margin-bottom:20px}
.nextsteps .btn{font-size:14.5px;padding:11px 20px}
@media (max-width:760px){ .nextsteps{grid-template-columns:1fr} .mid{min-height:0} }


/* ================= Hubly.club como prueba de DTC ================= */
.proof{margin:6px 0 0;display:grid;grid-template-columns:minmax(0,1fr);gap:20px;
  background:var(--navy);border-radius:4px;overflow:hidden}
.proof-txt{padding:30px 30px 26px}
.plbl{display:inline-block;font-family:var(--sans);font-weight:700;font-size:10.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--hub);margin-bottom:14px}
.proof-txt b{display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(20px,2.2vw,26px);color:#fff;line-height:1.1;margin-bottom:11px}
.proof-txt p{font-size:15.5px;line-height:1.56;color:rgba(255,255,255,.72);
  font-weight:300;margin-bottom:22px;max-width:44ch}
.proof .btn-s.club{color:#fff;border-color:rgba(255,255,255,.34)}
.proof .btn-s.club:hover{border-color:var(--hub);color:var(--hub)}
.proof-img{margin:0;padding:0 22px 0;display:flex;justify-content:center;align-items:flex-end}
.proof-img img{display:block;width:auto;max-width:100%;height:auto;max-height:400px;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.42))}
@media (min-width:820px){
  .proof{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:0;align-items:end}
  .proof-txt{padding:52px 24px 52px 48px}
  .proof-img{padding:34px 40px 0 12px;justify-content:flex-start}
  .proof-img img{max-height:430px}
}
/* link chico en la card de DTC de la home */
.cardlink{display:inline-block;margin-top:14px;font-family:var(--sans);font-weight:500;
  font-size:13.5px;text-decoration:none;color:var(--teal-d);
  border-bottom:1px solid var(--t4);padding-bottom:1px}
.cardlink:hover{border-bottom-color:var(--teal-d)}
.ft a.club{color:var(--t4)}
.ft a.club:hover{color:#fff}


/* ================= /faq ================= */
.faqwrap{margin-top:10px}
.faqgrp{display:grid;grid-template-columns:minmax(0,.5fr) minmax(0,1.5fr);
  gap:clamp(24px,4vw,64px);padding:clamp(32px,4vw,48px) 0;
  border-top:1px solid rgba(7,34,60,.16);align-items:start}
.faqgrp:first-child{border-top:0;padding-top:8px}
.faqgrp .eyebrow{position:sticky;top:104px}
.q{border-bottom:1px solid rgba(7,34,60,.14)}
.q:first-child{border-top:1px solid rgba(7,34,60,.14)}
.q>summary{list-style:none;cursor:pointer;display:flex;gap:18px;align-items:baseline;
  padding:20px 34px 20px 0;position:relative;
  font-family:var(--serif);font-weight:700;font-size:clamp(17.5px,1.9vw,21px);
  line-height:1.24;color:var(--navy);letter-spacing:-.008em;transition:color .2s}
.q>summary::-webkit-details-marker{display:none}
.q>summary:hover{color:var(--teal-d)}
.qn{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.1em;
  color:var(--teal-d);flex:none;width:2.4ch;padding-top:.35em}
.q>summary::after{content:"";position:absolute;right:6px;top:calc(50% - 5px);
  width:9px;height:9px;border-right:2px solid var(--hub);border-bottom:2px solid var(--hub);
  transform:rotate(45deg);transition:transform .25s}
.q[open]>summary::after{transform:rotate(-135deg)}
.q[open]>summary{color:var(--teal-d)}
.a{padding:0 34px 24px calc(2.4ch + 18px)}
.a p{font-size:16.5px;line-height:1.6;color:var(--ink-2);font-weight:300}
.a p+p{margin-top:13px}
.a b{color:var(--navy);font-weight:500}
.q[open] .a{animation:faqin .3s ease both}
@keyframes faqin{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.q[open] .a{animation:none}}
@media (max-width:900px){
  .faqgrp{grid-template-columns:1fr;gap:16px;padding:28px 0}
  .faqgrp .eyebrow{position:static}
  .a{padding-left:0;padding-right:8px}
  .q>summary{padding-right:30px}
}


/* ================= paginas legales ================= */
.lhero{background:var(--mint);padding:clamp(48px,7vw,88px) 0 clamp(34px,4vw,48px)}
.lhero h1{font-size:clamp(30px,4.4vw,52px);margin:20px 0 0;color:var(--navy)}
.lmeta{margin-top:16px;font-size:15.5px;color:var(--ink-2);font-weight:300}
.lmeta b{color:var(--navy);font-weight:500}
.ldraft{margin-top:26px;max-width:70ch;background:#fff;border-left:3px solid var(--hub);
  padding:18px 22px;font-size:15px;line-height:1.55;color:var(--ink-2);font-weight:300}
.ldraft b{color:var(--navy);font-weight:500}
.ldraft code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;
  background:var(--mint-2);padding:1px 6px;border-radius:2px}

.ldoc{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1.6fr);
  gap:clamp(30px,5vw,74px);align-items:start}
.ltoc{position:sticky;top:104px}
.ltoc ol{list-style:none;counter-reset:toc;padding:0;margin:20px 0 0}
.ltoc li{counter-increment:toc;margin-bottom:2px}
.ltoc a{display:flex;gap:10px;text-decoration:none;font-size:14.5px;line-height:1.4;
  color:var(--ink-2);padding:6px 0;transition:color .18s}
.ltoc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--sans);
  font-weight:700;font-size:11px;color:var(--ink-3);flex:none;padding-top:.25em}
.ltoc a:hover{color:var(--navy)}

.lbody>section{padding:0 0 34px;scroll-margin-top:110px}
.lbody h2{font-size:clamp(20px,2.2vw,26px);color:var(--navy);margin-bottom:14px;
  letter-spacing:-.01em}
.lbody p{font-size:16.5px;line-height:1.62;color:var(--ink-2);font-weight:300;max-width:70ch}
.lbody p+p,.lbody ul+p,.lbody p+ul{margin-top:13px}
.lbody b{color:var(--navy);font-weight:500}
.lbody ul{margin:13px 0 0;padding-left:20px;max-width:70ch}
.lbody li{font-size:16.5px;line-height:1.62;color:var(--ink-2);font-weight:300;margin-bottom:8px}
.lbox{background:var(--mint-2);border-left:2px solid var(--teal-d);padding:16px 20px;
  margin-top:16px !important}
.lnote{font-size:14.5px !important;color:var(--ink-3) !important;margin-top:14px !important}

/* bloque pendiente de abogado: imposible de confundir con texto aprobado */
.lbody section.lr{background:repeating-linear-gradient(135deg,#FFF6F1,#FFF6F1 11px,#FDEFE7 11px,#FDEFE7 22px);
  border:1px solid var(--hub);border-radius:3px;padding:26px 26px 20px;margin-bottom:26px}
.lrtag,.lbody .lrtag{display:inline-block;font-family:var(--sans);font-weight:700;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;color:#FFF3EC;background:#8F3F22;
  padding:5px 11px;border-radius:2px;margin-bottom:14px !important}
.lbody section.lr h2{color:#7A3B22}

@media (max-width:900px){
  .ldoc{grid-template-columns:minmax(0,1fr);gap:26px}
  .ltoc{position:static}
  .ltoc ol{columns:2;column-gap:22px}
}
.ltable{overflow-x:auto;margin-top:16px;max-width:70ch}
.ltable table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}
.ltable th{text-align:left;font-family:var(--sans);font-weight:700;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--teal-d);
  padding:0 16px 10px 0;border-bottom:1px solid rgba(7,34,60,.2)}
.ltable td{padding:12px 16px 12px 0;border-bottom:1px solid rgba(7,34,60,.11);
  color:var(--ink-2);font-weight:300;line-height:1.5;vertical-align:top}
.ltable td:first-child{color:var(--navy);font-weight:500;white-space:nowrap}
