:root{
  --cream:#FBF6EC; --paper:#FFFFFF; --teal:#159B94; --teal-d:#0E7A74;
  --coral:#EB5346; --gold:#F2B705; --ink:#1C1815; --body:#5A5048;
  --muted:#8A8377; --line:#EFE7D6; --soft:#F6EFE1;
  --sh:0 10px 40px rgba(28,24,21,.07); --sh2:0 20px 60px rgba(28,24,21,.12);
  --r:22px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-text-size-adjust:100%}
html{scroll-behavior:smooth;scroll-padding-top:74px}
body{font-family:'Poppins',system-ui,-apple-system,sans-serif;color:var(--body);
  background:var(--cream);line-height:1.7;font-size:16.5px;-webkit-font-smoothing:antialiased;
  overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:'Poppins',sans-serif;color:var(--ink);line-height:1.14;font-weight:800}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.sec{padding:78px 0}
.sec.alt{background:var(--paper)}
.sec.soft{background:var(--soft);position:relative;overflow:hidden}
.sec.soft > .wrap{position:relative;z-index:1}
.texbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;z-index:0}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}

/* ---------- eyebrow / titles ---------- */
.eye{display:inline-flex;align-items:center;gap:8px;font-family:'Poppins';font-weight:700;
  font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);
  background:rgba(21,155,148,.09);border:1px solid rgba(21,155,148,.2);
  padding:7px 15px;border-radius:100px;margin-bottom:14px}
.h2{font-size:clamp(28px,4.6vw,44px);letter-spacing:-.5px}
.lead{font-size:17.5px;max-width:56ch;margin-top:12px}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:'Poppins';font-weight:700;font-size:16px;padding:15px 28px;border-radius:100px;
  border:2px solid transparent;cursor:pointer;transition:.22s cubic-bezier(.16,1,.3,1);white-space:nowrap}
.btn-wa{background:var(--teal);color:#fff;box-shadow:0 10px 26px rgba(21,155,148,.3)}
.btn-wa:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(21,155,148,.38)}
.btn-gh{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-gh:hover{background:var(--ink);color:#fff;transform:translateY(-3px)}
.btn-coral{background:var(--coral);color:#fff;box-shadow:0 10px 26px rgba(235,83,70,.28)}
.btn-coral:hover{transform:translateY(-3px)}
.btn-sm{padding:11px 20px;font-size:14.5px}
.btn svg{width:18px;height:18px;flex:0 0 18px}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:60;background:rgba(251,246,236,.92);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.brand img{height:34px;width:auto}
nav.main{display:flex;gap:24px;font-weight:700;font-size:14.5px}
nav.main a{position:relative;padding:4px 0;color:var(--ink)}
nav.main a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--teal);transition:right .3s}
nav.main a:hover::after{right:0}
.prog{position:absolute;left:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--teal),var(--gold));width:0}
.burger{display:none;background:none;border:0;cursor:pointer;padding:8px}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.3s}
.mnav{display:none;flex-direction:column;gap:2px;padding:10px 20px 20px}
.mnav a{padding:12px 4px;border-bottom:1px solid var(--line);font-weight:700;color:var(--ink)}
.mnav.open{display:flex}

/* ---------- hero ---------- */
.hero{padding:0 0 64px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;width:620px;height:620px;right:-180px;top:-240px;
  background:radial-gradient(circle,rgba(242,183,5,.16),transparent 68%);border-radius:50%}
.hero-g{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:stretch;position:relative}
.hero-txt{display:flex;flex-direction:column;justify-content:center;padding:46px 0 10px}
.hero h1{font-size:clamp(34px,5.6vw,56px);letter-spacing:-1px}
.hero h1 em{font-style:normal;color:var(--teal)}
.hero p.sub{font-size:18px;margin:16px 0 8px;max-width:34ch}
.trust{display:flex;gap:22px;flex-wrap:wrap;margin:24px 0 26px}
.trust .t{display:flex;gap:10px;align-items:center;max-width:150px}
.trust .ic{width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:#fff;
  border:1px solid var(--line);display:grid;place-items:center;color:var(--teal)}
.trust .tx{font-size:12.8px;font-weight:700;color:var(--ink);line-height:1.35}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-img-w{position:relative;align-self:stretch;min-height:520px}
.hero-img-w img{width:100%;height:100%;object-fit:cover;object-position:center 28%;
  border-radius:0 0 30px 30px;box-shadow:var(--sh2)}
.hero-note{position:absolute;left:-18px;bottom:44px;background:#fff;border:1px solid var(--line);
  border-radius:18px;padding:14px 18px;box-shadow:var(--sh);max-width:190px;
  font-family:'Poppins';font-weight:600;font-size:13.5px;color:var(--ink);line-height:1.4}
.hero-note span{color:var(--teal)}
.floaty{position:absolute;background:#fff;border-radius:16px;padding:11px 15px;
  box-shadow:var(--sh);border:1px solid var(--line);font-family:'Poppins';font-weight:700;
  font-size:13px;color:var(--ink);display:flex;align-items:center;gap:9px;
  animation:fl 4.5s ease-in-out infinite}
.floaty i{font-style:normal;font-size:17px}
.f1{top:12%;left:-16px}
.f2{bottom:14%;right:-12px;animation-delay:1.6s}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}


/* ---------- BLOQUE SUPERIOR estilo mockup ---------- */
.top-wrap{padding:18px 0 0}
.hero-card{background:#fff;border-radius:28px;padding:20px 28px 0;position:relative;overflow:hidden;
  box-shadow:0 14px 50px rgba(28,24,21,.07)}
.tbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-bottom:6px}
.tbar .brand img{height:74px;width:auto}
.tbar nav{display:flex;gap:17px;font-family:'Poppins';font-weight:600;font-size:13.6px;
  letter-spacing:.01em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.tbar nav a{position:relative;padding:3px 0}
.tbar nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;
  background:var(--teal);transition:right .3s}
.tbar nav a:hover::after{right:0}
.hero-g2{display:grid;grid-template-columns:1.02fr .98fr;gap:26px;align-items:center;
  padding:22px 0 0}
.hero-g2 h1{font-size:clamp(32px,4.3vw,50px);line-height:1.1;letter-spacing:-1px}
.hero-g2 h1 em{font-style:normal;color:var(--teal)}
.hero-g2 .sub{font-size:16.5px;margin:14px 0 0;max-width:32ch;color:var(--body)}
.hero-ph{position:relative;align-self:end}
.hero-ph img{width:100%;display:block;
  -webkit-mask-image:radial-gradient(74% 70% at 54% 48%,#000 38%,transparent 74%);
  mask-image:radial-gradient(74% 70% at 54% 48%,#000 38%,transparent 74%)}
.hnote{position:absolute;left:-6px;top:24%;max-width:150px;font-family:'Caveat',cursive;
  font-size:21px;line-height:1.25;color:var(--ink);text-align:center;transform:rotate(-3deg)}
.hnote span{display:block;color:var(--coral);font-size:19px;margin-top:2px}
/* iconos de confianza en circulo fino */
.trust2{display:flex;gap:30px;flex-wrap:wrap;margin:26px 0 24px}
.trust2 .t{text-align:center;max-width:104px}
.trust2 .ic{width:46px;height:46px;margin:0 auto 8px;border-radius:50%;
  border:1.6px solid var(--ink);display:grid;place-items:center;color:var(--ink)}
.trust2 .tx{font-size:11.6px;font-weight:700;color:var(--ink);line-height:1.35}
.hero-actions2{display:flex;gap:12px;flex-wrap:wrap;padding-bottom:30px}
/* nav flotante que aparece al bajar */
.snav{position:fixed;top:0;left:0;right:0;z-index:70;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line);
  transform:translateY(-100%);transition:transform .3s cubic-bezier(.16,1,.3,1)}
.snav.show{transform:none}
.snav .in{display:flex;align-items:center;justify-content:space-between;height:62px;gap:16px}
.snav img{height:52px}
.snav nav{display:flex;gap:18px;font-family:'Poppins';font-weight:600;font-size:13.6px;
  text-transform:uppercase;color:var(--ink);white-space:nowrap}
.social{display:flex;gap:9px;align-items:center}
.social a{width:38px;height:38px;border-radius:50%;border:1.6px solid var(--ink);
  display:grid;place-items:center;color:var(--ink);transition:.2s}
.social a svg{width:19px;height:19px}
.social a:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.tbar nav a.nav-eb,.snav nav a.nav-eb{color:var(--gold);}
.tbar nav a.nav-eb::after,.snav nav a.nav-eb::after{background:var(--gold)}
.tbar .right{display:flex;align-items:center;gap:12px}
footer .social{justify-content:flex-start;margin-top:14px}
footer .social a{border-color:rgba(255,255,255,.28);color:#B7B1A7;width:36px;height:36px}
footer .social a:hover{background:var(--gold);border-color:var(--gold);color:#1a1305}
@media(max-width:980px){ .hero-g2{grid-template-columns:1fr} .hnote{display:none} }
@media(max-width:640px){
  .top-wrap{padding:10px 0 0}
  .hero-card{border-radius:22px;padding:16px 20px 0;margin:0}
  .tbar nav,.snav nav{display:none}
  .tbar{gap:10px}
  .tbar .brand img{height:42px}
  .tbar .social{display:none}
  .snav .social{display:none}
  .tbar .btn-wa{padding:10px 15px;font-size:13px}
  .tbar .btn-wa .lbl{display:none}
  .snav .in{height:56px}
  .hero-g2{gap:0;padding-top:6px}
  .hero-ph{order:-1;margin:0 -20px 10px;width:calc(100% + 40px)}
  .hero-g2 .htxt{text-align:center}
  .hero-g2 .sub{margin-left:auto;margin-right:auto}
  .trust2{justify-content:center;gap:18px}
  .hero-actions2{justify-content:center}
}

/* ---------- problema vs solucion ---------- */
.pvs{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:stretch;margin-top:34px}
.pvs-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 26px;
  box-shadow:var(--sh)}
.pvs-card.bad{border-top:4px solid var(--coral)}
.pvs-card.good{border-top:4px solid var(--teal);background:linear-gradient(180deg,#fff,#FAFDFC)}
.pvs-card h3{font-size:20px;margin-bottom:4px}
.pvs-card .tag{font-family:'Poppins';font-weight:700;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:10px;display:block}
.bad .tag{color:var(--coral)} .good .tag{color:var(--teal)}
.pvs ul{list-style:none;margin-top:14px}
.pvs li{display:flex;gap:11px;padding:9px 0;font-size:15px;border-bottom:1px dashed var(--line)}
.pvs li:last-child{border-bottom:0}
.pvs li b{flex:0 0 20px;font-size:15px}
.bad li b{color:var(--coral)} .good li b{color:var(--teal)}
.pvs-arrow{display:grid;place-items:center;font-size:30px;color:var(--gold)}

/* ---------- beneficios ---------- */
.bgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:38px}
.bcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 18px;
  text-align:center;transition:.25s cubic-bezier(.16,1,.3,1)}
.bcard:hover{transform:translateY(-6px);box-shadow:var(--sh2);border-color:var(--teal)}
.bcard .ic{width:54px;height:54px;margin:0 auto 14px;border-radius:16px;
  background:rgba(21,155,148,.09);display:grid;place-items:center;color:var(--teal)}
.bcard h4{font-size:15.5px;margin-bottom:5px}
.bcard p{font-size:13.5px;color:var(--muted)}

/* ---------- menus (tabs) ---------- */
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:30px 0 26px}
.tab{font-family:'Poppins';font-weight:700;font-size:14.5px;padding:11px 22px;border-radius:100px;
  border:2px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:.2s}
.tab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.tab:hover:not(.on){border-color:var(--teal);color:var(--teal)}
.mpanel{display:none}
.mpanel.on{display:block;animation:fade .45s ease}
@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:var(--sh)}
.mgrid img{border-radius:18px}
.mchip{display:inline-block;font-family:'Poppins';font-weight:700;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;padding:6px 13px;border-radius:100px;margin-bottom:12px}
.c-pollo{background:#FFF4D6;color:#9C7400}
.c-carne{background:#FDE6E3;color:#B93529}
.c-cerdo{background:#DCEFEE;color:#0E7A74}
.mgrid h3{font-size:26px;margin-bottom:8px}
.mstats{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.mstat{background:var(--soft);border-radius:14px;padding:10px 14px;min-width:96px}
.mstat b{display:block;font-family:'Poppins';font-size:19px;color:var(--ink)}
.mstat span{font-size:11.5px;color:var(--muted)}
.mtags{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px}
.mtag{font-size:11.5px;font-weight:700;color:var(--teal);background:rgba(21,155,148,.08);
  border:1px solid rgba(21,155,148,.18);padding:5px 11px;border-radius:100px}

/* ---------- ingredientes ---------- */
.ing{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:34px}
.icard{background:#FBF6EC;border:1px solid var(--line);border-radius:18px;padding:0 14px 20px;text-align:center;
  transition:.22s;overflow:hidden}
.icard:hover{transform:translateY(-5px);box-shadow:var(--sh)}
.icard img{width:calc(100% + 28px);margin:0 -14px 12px;aspect-ratio:1/1;object-fit:cover;display:block}
.icard h4{font-size:14.5px}
.icard p{font-size:12.5px;color:var(--muted);margin-top:3px}
.nono{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:26px}
.nono span{font-family:'Poppins';font-weight:700;font-size:13px;color:var(--coral);
  background:#FDE9E7;border:1px solid #F8CFCA;padding:8px 16px;border-radius:100px}

/* ---------- comparativa nutricional ---------- */
.nut{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--sh);margin-top:32px}
.nrow{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center;padding:14px 0;
  border-bottom:1px solid var(--line)}
.nrow:last-child{border-bottom:0}
.nrow .nl{font-weight:700;color:var(--ink);font-size:14.5px}
.bars{display:grid;gap:8px}
.barw{display:flex;align-items:center;gap:10px}
.barw .who{font-size:11.5px;font-weight:700;width:64px;flex:0 0 64px;color:var(--muted)}
.bar{flex:1;height:22px;background:var(--soft);border-radius:100px;overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:100px;transition:width 1.1s cubic-bezier(.16,1,.3,1)}
.bar.cd i{background:linear-gradient(90deg,var(--teal),#3FC2B9)}
.bar.kb i{background:linear-gradient(90deg,#C9BFAE,#DED5C6)}
.barw .v{font-family:'Poppins';font-weight:700;font-size:13px;width:52px;text-align:right;color:var(--ink)}

/* ---------- calculadora ---------- */
.calc{background:linear-gradient(160deg,#12312F,#0B1F1E);color:#fff;border-radius:28px;
  padding:34px;box-shadow:var(--sh2)}
.calc h3{color:#fff;font-size:24px}
.calc .sub{color:#B9CFCD;font-size:15px;margin-top:6px}
.calc-g{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;margin-top:24px;align-items:start}
.fld{margin-bottom:18px}
.fld label{display:block;font-family:'Poppins';font-weight:700;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:#8FB3B0;margin-bottom:9px}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#E7F0EF;
  font-family:'Poppins';font-weight:700;font-size:13.5px;padding:9px 16px;border-radius:100px;cursor:pointer;
  transition:.18s}
.pill.on{background:var(--gold);border-color:var(--gold);color:#22190A}
.pill:hover:not(.on){background:rgba(255,255,255,.14)}
input[type=range]{width:100%;-webkit-appearance:none;height:6px;border-radius:100px;
  background:rgba(255,255,255,.18);outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;
  background:var(--gold);cursor:pointer;box-shadow:0 3px 10px rgba(0,0,0,.35)}
input[type=range]::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:50%;background:var(--gold);cursor:pointer}
.wnum{font-family:'Poppins';font-weight:800;font-size:30px;color:var(--gold)}
.res{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:24px;text-align:center}
.res .big{font-family:'Poppins';font-weight:800;font-size:46px;color:var(--gold);line-height:1}
.res .unit{font-size:13px;color:#9FBDBA;margin-top:2px}
.res .split{display:flex;gap:10px;margin-top:16px}
.res .sp{flex:1;background:rgba(255,255,255,.06);border-radius:14px;padding:11px}
.res .sp b{display:block;font-family:'Poppins';font-size:17px;color:#fff}
.res .sp span{font-size:11px;color:#9FBDBA}
.res .note{font-size:11.5px;color:#8FB3B0;margin-top:14px;line-height:1.5}

/* ---------- pasos ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}
.step{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 20px;position:relative;
  transition:.24s}
.step:hover{transform:translateY(-6px);box-shadow:var(--sh2)}
.step{padding:0;overflow:hidden}
.step img{aspect-ratio:16/11;object-fit:cover;width:100%}
.step .sb{padding:22px 20px 26px;position:relative}
.step .n{font-family:'Poppins';font-weight:800;font-size:38px;color:var(--soft);line-height:1;
  position:absolute;top:14px;right:18px}
.step .ic{width:48px;height:48px;border-radius:14px;background:rgba(242,183,5,.14);
  display:grid;place-items:center;color:#B98C00;margin-bottom:14px}
.step h4{font-size:16px;margin-bottom:5px}
.step p{font-size:13.6px;color:var(--muted)}

/* ---------- para quien ---------- */
.who-g{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.who-c{background:#fff;border:1px solid var(--line);border-radius:20px;padding:0;overflow:hidden;transition:.24s}
.who-c img{aspect-ratio:1/1;object-fit:cover;width:100%}
.who-c .wb{padding:20px}
.who-c:hover{transform:translateY(-5px);box-shadow:var(--sh);border-color:var(--gold)}
.who-c .em{font-size:32px;margin-bottom:10px}
.who-c h4{font-size:16px;margin-bottom:5px}
.who-c p{font-size:13.6px;color:var(--muted)}

/* ---------- testimonios ---------- */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.tcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:var(--sh)}
.stars{color:var(--gold);font-size:15px;letter-spacing:2px;margin-bottom:10px}
.tcard p{font-size:15px;font-style:italic;color:var(--ink)}
.tcard .who{display:flex;align-items:center;gap:11px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.tcard .av{width:40px;height:40px;border-radius:50%;background:var(--soft);display:grid;place-items:center;
  font-family:'Poppins';font-weight:800;color:var(--teal)}
.tcard .nm{font-family:'Poppins';font-weight:700;font-size:14px;color:var(--ink)}
.tcard .rz{font-size:12px;color:var(--muted)}

/* ---------- fundador ---------- */
.fnd{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:26px;padding:32px;box-shadow:var(--sh)}
.fnd img{width:196px;height:196px;border-radius:50%;object-fit:cover;flex:0 0 196px;border:6px solid var(--soft);box-shadow:0 10px 30px rgba(28,24,21,.12)}
.fnd h3{font-size:22px;margin-bottom:8px}
.fnd p{font-size:15.5px}
.fnd .sig{font-family:'Poppins';font-weight:700;color:var(--teal);margin-top:12px;font-size:14.5px}

/* ---------- ebooks ---------- */
.bk-g{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.bk{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:var(--sh);transition:.24s;display:flex;flex-direction:column}
.bk:hover{transform:translateY(-6px);box-shadow:var(--sh2)}
.bk img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#FBF7EF}
.bk .bd{padding:18px}
.bk h4{font-size:16px;margin-bottom:4px}
.bk p{font-size:13px;color:var(--muted);margin-bottom:10px}
.bk .bkt{font-size:16px;margin-bottom:4px}
.bk .bkp{font-family:'Poppins';font-weight:800;font-size:19px;color:var(--gold);margin-bottom:12px}
.bk .bkp span{font-family:'Poppins';font-weight:700;font-size:12px;color:var(--muted)}

/* ---------- faq ---------- */
.faq{max-width:820px;margin:30px auto 0}
.q{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:10px;overflow:hidden}
.q summary{list-style:none;cursor:pointer;padding:18px 22px;font-family:'Poppins';font-weight:700;
  font-size:15.5px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:14px}
.q summary::-webkit-details-marker{display:none}
.q summary::after{content:"+";font-size:22px;color:var(--teal);font-weight:400;line-height:1}
.q[open] summary::after{content:"\2212"}
.q .a{padding:0 22px 20px;font-size:14.8px;color:var(--body)}

/* ---------- blog ---------- */
.pg{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.pc{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:.24s;
  display:flex;flex-direction:column}
.pc:hover{transform:translateY(-6px);box-shadow:var(--sh2)}
.pc img{aspect-ratio:16/9;object-fit:cover}
.pc .bd{padding:20px;display:flex;flex-direction:column;flex:1}
.pc .cat{font-family:'Poppins';font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--teal);margin-bottom:7px}
.pc h4{font-size:16.5px;margin-bottom:6px;line-height:1.3}
.pc p{font-size:13.6px;color:var(--muted)}
.pmore{margin-top:auto;padding-top:14px}
.pmore summary{list-style:none;cursor:pointer;font-family:'Poppins';font-weight:700;font-size:13.5px;
  color:var(--teal);display:inline-flex;align-items:center;gap:7px;transition:.2s}
.pmore summary::-webkit-details-marker{display:none}
.pmore summary::after{content:'+';font-size:17px;line-height:1}
.pmore[open] summary::after{content:'\2212'}
.pmore summary:hover{color:var(--teal-d)}
.pbody{margin-top:14px;font-size:14.2px;color:var(--body);line-height:1.72;
  border-top:1px solid var(--line);padding-top:14px}
.pbody p{font-size:14.2px;color:var(--body);margin-bottom:12px}
.pbody p:last-child{margin-bottom:0}
.pbody h4{font-family:'Poppins';font-size:14.5px;color:var(--ink);margin:16px 0 6px}
.pbody strong{color:var(--ink)}
.pbody em{font-style:italic}

/* ---------- zona ---------- */
.zona-g{display:grid;grid-template-columns:1.15fr 0.85fr;gap:28px;align-items:center;
  margin-top:34px;text-align:left}
.mapw{border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh);
  position:relative;background:var(--soft)}
.mapw img{width:100%;aspect-ratio:16/9;height:auto;object-fit:cover;object-position:center;display:block}
.mapw .mtag{position:absolute;right:14px;bottom:14px;background:rgba(255,255,255,.94);
  border-radius:100px;padding:8px 16px;font-family:'Poppins';font-weight:700;font-size:12.5px;
  color:var(--ink);box-shadow:var(--sh);display:flex;align-items:center;gap:7px}
.zlist{display:flex;flex-direction:column;gap:12px}
.zrow{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:16px 20px;transition:.22s}
.zrow:hover{transform:translateX(4px);border-color:var(--teal);box-shadow:var(--sh)}
.zrow .pin{width:40px;height:40px;flex:0 0 40px;border-radius:50%;background:rgba(21,155,148,.09);
  border:1.5px solid rgba(21,155,148,.3);display:grid;place-items:center;color:var(--teal)}
.zrow .pin svg{width:19px;height:19px}
.zrow h4{font-size:16.5px;margin-bottom:1px}
.zrow p{font-size:13px;color:var(--muted)}
.zg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.zc{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;text-align:center}
.zc .em{font-size:28px}
.zc h4{font-size:17px;margin:8px 0 3px}
.zc p{font-size:13.5px;color:var(--muted)}
.zn{background:rgba(242,183,5,.12);border:1px solid rgba(242,183,5,.32);border-radius:16px;
  padding:16px 20px;margin-top:18px;text-align:center;font-size:14.5px;color:var(--ink)}

/* ---------- cta final ---------- */
.cta{background:linear-gradient(150deg,#22201C,#0F0E0C);color:#fff;border-radius:30px;
  padding:52px 40px;text-align:center;position:relative;overflow:hidden;isolation:isolate}
.cta-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left center;
  opacity:.42;z-index:-1}
.cta::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(15,14,12,.5) 0%,rgba(15,14,12,.86) 55%,rgba(15,14,12,.95) 100%)}
.cta::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:linear-gradient(90deg,var(--teal),var(--gold),var(--coral))}
.cta h2{color:#fff;font-size:clamp(26px,4.4vw,40px)}
.cta h2 em{font-style:normal;color:var(--gold)}
.cta p{color:#CFC9BF;margin:12px auto 26px;max-width:44ch;font-size:16.5px}
.cta-badges{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin-top:28px;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.cta-badges .b{font-size:12.6px;color:#B7B1A7;max-width:150px}
.cta-badges .b b{display:block;color:var(--gold);font-family:'Poppins';font-size:13.5px;margin-bottom:2px}

/* ---------- footer ---------- */
footer{background:#0F0E0C;color:#8A847A;padding:44px 0 30px;font-size:13.5px}
footer .fg{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px;margin-bottom:28px}
footer img{height:52px;margin-bottom:14px}
footer h5{font-family:'Poppins';color:var(--gold);font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:12px}
footer a{display:block;padding:4px 0;color:#B7B1A7}
footer a:hover{color:#fff}
.fbot{border-top:1px solid rgba(255,255,255,.09);padding-top:20px;text-align:center;font-size:12.5px}

/* ---------- whatsapp flotante ---------- */
.wafab{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;align-items:center;gap:10px;
  background:#25D366;color:#fff;font-family:'Poppins';font-weight:700;font-size:15px;
  padding:14px 20px;border-radius:100px;box-shadow:0 12px 30px rgba(37,211,102,.42);
  transition:.24s}
.wafab:hover{transform:translateY(-3px) scale(1.03)}
.wafab svg{width:22px;height:22px;flex:0 0 22px}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .bgrid{grid-template-columns:repeat(3,1fr)}
  .ing{grid-template-columns:repeat(3,1fr)}
  .steps,.who-g{grid-template-columns:repeat(2,1fr)}
  .tgrid,.pg,.bk-g,.zg{grid-template-columns:repeat(2,1fr)}
  .zona-g{grid-template-columns:1fr;gap:20px}
  .hero-g,.mgrid,.calc-g{grid-template-columns:1fr}
  .pvs{grid-template-columns:1fr}
  .pvs-arrow{transform:rotate(90deg)}
  footer .fg{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  body{font-size:16px}
  .sec{padding:56px 0}
  nav.main{display:none}
  .burger{display:block}
  .bgrid,.ing{grid-template-columns:repeat(2,1fr)}
  .steps,.who-g,.tgrid,.pg,.bk-g,.zg{grid-template-columns:1fr}
  .mapw img{aspect-ratio:16/9}
  .mapw .mtag{font-size:11.5px;padding:7px 13px}
  .hero{padding:0 0 46px}
  .hero-g{gap:0}
  .hero-img-w{order:-1;min-height:0;margin:0 -20px 22px;width:calc(100% + 40px)}
  .hero-img-w img{height:auto;aspect-ratio:4/3;border-radius:0 0 26px 26px}
  .hero-txt{padding:22px 0 0;text-align:center;align-items:center}
  .hero-txt .lead,.hero p.sub{margin-left:auto;margin-right:auto}
  .trust{justify-content:center}
  .hero-actions{justify-content:center}
  .floaty,.hero-note{display:none}
  .nrow{grid-template-columns:1fr;gap:8px}
  .calc,.cta{padding:28px 20px;border-radius:22px}
  .fnd{grid-template-columns:1fr;text-align:center;padding:26px 20px}
  .fnd img{margin:0 auto;width:150px;height:150px;flex:0 0 150px}
  .wafab{padding:13px 17px;font-size:14px;right:14px;bottom:14px}
  footer .fg{grid-template-columns:1fr}
}


/* ==================================================================
   PÁGINAS INTERNAS — cabecera, artículos, locales
   ================================================================== */
.phdr{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.phdr .in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:84px}
.phdr-brand img{height:64px;width:auto}
.phdr-nav{display:flex;gap:17px;font-family:'Poppins';font-weight:600;font-size:13.6px;
  text-transform:uppercase;color:var(--ink);white-space:nowrap}
.phdr-nav a{position:relative;padding:3px 0}
.phdr-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;
  background:var(--teal);transition:right .3s}
.phdr-nav a:hover::after{right:0}
.phdr-nav a.on{color:var(--gold)}
.phdr-nav a.on::after{right:0;background:var(--gold)}
.phdr-right{display:flex;align-items:center;gap:12px}
.phdr-mnav{display:none}
.pburger{display:none;background:none;border:0;flex-direction:column;gap:5px;padding:8px;cursor:pointer}
.pburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
.pburger.x span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.pburger.x span:nth-child(2){opacity:0}
.pburger.x span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.crumbs{background:var(--soft);border-bottom:1px solid var(--line);font-size:13px;padding:11px 0}
.crumbs .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:7px;color:var(--muted)}
.crumbs a{color:var(--teal);font-weight:700}
.crumbs a:hover{text-decoration:underline}
.crumbs .sep{color:#C9C1B2}

/* ---------- cabecera de artículo ---------- */
.ahero{padding:44px 0 6px}
.ahero .kick{display:inline-block;font-family:'Poppins';font-weight:700;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--teal);
  background:rgba(21,155,148,.10);border-radius:100px;padding:6px 14px}
.ahero h1{font-size:clamp(29px,4.2vw,44px);line-height:1.12;letter-spacing:-.5px;margin:16px 0 12px;max-width:20ch}
.ahero .stand{font-size:18px;color:var(--body);max-width:60ch;line-height:1.62}
.ahero .amet{margin-top:16px;font-size:13.5px;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap}
.afig{margin:26px 0 0;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.afig img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}

.alayout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:44px;align-items:start;padding:34px 0 10px}
.abody{max-width:none;font-size:17px;line-height:1.78;color:var(--body)}
.abody>p{margin:0 0 18px}
.abody h2{font-size:clamp(23px,2.7vw,30px);line-height:1.2;margin:38px 0 12px;scroll-margin-top:110px}
.abody h3{font-size:19.5px;line-height:1.28;margin:26px 0 8px}
.abody ul,.abody ol{margin:0 0 20px;padding-left:22px}
.abody li{margin:0 0 8px}
.abody strong{color:var(--ink);font-weight:700}
.abody a{color:var(--teal);font-weight:700;text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1.5px;text-decoration-color:rgba(21,155,148,.35)}
.abody a:hover{text-decoration-color:var(--teal)}
.abody .cal{background:var(--soft);border-left:4px solid var(--gold);border-radius:0 16px 16px 0;
  padding:18px 20px;margin:26px 0}
.abody .cal b{display:block;font-family:'Poppins';font-weight:700;color:var(--ink);font-size:16px;margin-bottom:5px}
.abody .cal p{margin:0;font-size:15.6px}
.abody .warn{background:#FDF2F0;border-left:4px solid var(--coral);border-radius:0 16px 16px 0;
  padding:18px 20px;margin:26px 0}
.abody .warn b{display:block;font-family:'Poppins';font-weight:700;color:#A32E22;font-size:16px;margin-bottom:5px}
.abody .warn p{margin:0;font-size:15.6px}
.warn.med{background:#FBF7EF;border-left-color:var(--gold);margin:30px 0 0}
.warn.med b{color:var(--gold-d)}
.abody .tblwrap{overflow-x:auto;margin:26px 0;border:1px solid var(--line);border-radius:16px;background:#fff}
.abody table{border-collapse:collapse;width:100%;font-size:14.6px;min-width:520px}
.abody thead th{background:var(--soft);text-align:left;font-family:'Poppins';font-weight:700;
  color:var(--ink);font-size:13px;padding:12px 14px;border-bottom:1px solid var(--line)}
.abody tbody td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.abody tbody tr:last-child td{border-bottom:0}
.abody tbody tr:nth-child(even){background:#FDFBF6}

/* ---------- barra lateral ---------- */
.aside{position:sticky;top:110px;display:flex;flex-direction:column;gap:16px}
.toc{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px;box-shadow:var(--sh)}
.toc h2{font-family:'Poppins';font-size:13px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin:0 0 10px;font-weight:700}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t;margin:0 0 8px;font-size:14px;line-height:1.4;display:flex;gap:9px}
.toc li::before{content:counter(t,decimal-leading-zero);font-family:'Poppins';font-weight:700;
  color:var(--gold);font-size:12px;padding-top:2px}
.toc a{color:var(--body)}
.toc a:hover{color:var(--teal)}
.sidecard{background:radial-gradient(130% 100% at 50% 0%,#232323,#000);color:#fff;
  border-radius:18px;padding:22px 20px;text-align:center}
.sidecard h2{color:#fff;font-size:19px;margin:0 0 8px;line-height:1.22}
.sidecard p{color:#d3cec4;font-size:14px;margin:0 0 14px}
.sidecard .btn{width:100%;justify-content:center}
.sidecard .sc-f{margin-top:10px;font-size:11.6px;color:#8d877d}

/* ---------- bloques de cierre ---------- */
.faqsec{padding:10px 0 6px}
.faqsec h2{font-size:clamp(23px,2.7vw,30px);margin:0 0 16px}
.rel{margin:38px 0 0;padding:26px 0 0;border-top:1px solid var(--line)}
.rel h2{font-size:22px;margin:0 0 14px}
.rl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.rl a{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px 18px;transition:.2s}
.rl a:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--sh)}
.rl .rl-t{display:block;font-family:'Poppins';font-weight:700;color:var(--ink);font-size:15.5px;line-height:1.28}
.rl .rl-d{display:block;font-size:13.4px;color:var(--muted);margin-top:4px}
.bib{margin:34px 0 0;padding:24px 0 0;border-top:1px solid var(--line)}
.bib h2{font-size:20px;margin:0 0 6px}
.bib .bib-n{font-size:13.4px;color:var(--muted);margin:0 0 14px}
.bib ol{margin:0;padding:0;list-style:none;counter-reset:b}
.bib li{font-size:13.6px;line-height:1.6;color:var(--body);padding-left:1.6em;text-indent:-1.6em;margin:0 0 10px}
.authorbox{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);
  border-radius:18px;padding:16px 20px;margin:0 0 8px}
.authorbox img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:0 0 64px;border:3px solid var(--soft)}
.authorbox .ab-l{margin:0;font-size:14.4px;color:var(--body)}
.authorbox .ab-l b{color:var(--ink)}
.authorbox .ab-d{margin:5px 0 0;font-size:12.6px;color:var(--muted)}

/* ---------- CTA de cierre ---------- */
.ctablock{padding:54px 0}
.ctacard{background:radial-gradient(130% 100% at 50% 0%,#232323,#000);color:#fff;border-radius:26px;
  padding:44px 34px;text-align:center;position:relative;overflow:hidden}
.ctacard::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:linear-gradient(90deg,var(--gold),#f4d488,var(--gold))}
.ctacard h2{color:#fff;font-size:clamp(24px,3.2vw,34px);margin:0 0 10px;line-height:1.16}
.ctacard p{color:#d3cec4;font-size:16.5px;max-width:52ch;margin:0 auto 22px}
.ctabtns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.ctacard .btn-gh{border-color:rgba(255,255,255,.4);color:#fff}
.ctacard .btn-gh:hover{background:rgba(255,255,255,.1)}
.ctafoot{font-size:12.6px!important;color:#8d877d!important;margin:18px auto 0!important}

/* ---------- índice de artículos ---------- */
.ahub{padding:46px 0 8px;text-align:center}
.ahub h1{font-size:clamp(30px,4.4vw,46px);line-height:1.1;margin:12px 0 12px}
.ahub .lead{max-width:56ch;margin:0 auto}
.filtros{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin:26px 0 0}
.filtros button{background:#fff;border:1px solid var(--line);border-radius:100px;padding:9px 18px;
  font-family:'Poppins';font-weight:700;font-size:13.5px;color:var(--ink);cursor:pointer;transition:.2s}
.filtros button:hover{border-color:var(--teal);color:var(--teal)}
.filtros button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:34px 0 0}
.acard{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;
  display:flex;flex-direction:column;transition:.24s;box-shadow:var(--sh)}
.acard:hover{transform:translateY(-6px);box-shadow:var(--sh2)}
.acard img{width:100%;aspect-ratio:16/9;object-fit:cover}
.acard .bd{padding:20px;display:flex;flex-direction:column;flex:1}
.acard .cat{font-family:'Poppins';font-weight:700;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--teal);margin-bottom:7px}
.acard h2,.acard h3{font-size:17px;line-height:1.28;margin:0 0 7px}
.acard p{font-size:13.8px;color:var(--muted);margin:0 0 14px}
.acard .go{margin-top:auto;font-family:'Poppins';font-weight:700;font-size:13.6px;color:var(--teal)}
.acard:hover .go{text-decoration:underline}

/* ---------- páginas locales / pilar ---------- */
.lhero{padding:44px 0 10px}
.lgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center}
.lhero h1{font-size:clamp(30px,4.3vw,46px);line-height:1.1;letter-spacing:-.6px;margin:14px 0 14px}
.lhero .lead{font-size:17.5px;max-width:46ch}
.lchips{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0 24px}
.lchips span{background:#fff;border:1px solid var(--line);border-radius:100px;padding:8px 15px;
  font-size:13.2px;font-weight:700;color:var(--ink)}
.lfig{border-radius:var(--r);overflow:hidden;box-shadow:var(--sh2)}
.lfig img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.lbody{padding:16px 0 0;font-size:17px;line-height:1.78;color:var(--body);max-width:74ch;margin:0 auto}
.lbody h2{font-size:clamp(24px,3vw,32px);margin:40px 0 12px;line-height:1.18}
.lbody h3{font-size:20px;margin:26px 0 8px}
.lbody p{margin:0 0 18px}
.lbody ul{margin:0 0 20px;padding-left:22px}
.lbody li{margin:0 0 8px}
.lbody a{color:var(--teal);font-weight:700;text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(21,155,148,.35)}
.lbody .cal{background:var(--soft);border-left:4px solid var(--gold);border-radius:0 16px 16px 0;
  padding:18px 20px;margin:26px 0}
.lbody .cal b{display:block;font-family:'Poppins';font-weight:700;color:var(--ink);margin-bottom:5px}
.lbody .cal p{margin:0;font-size:15.6px}
.lbody .tblwrap{overflow-x:auto;margin:26px 0;border:1px solid var(--line);border-radius:16px;background:#fff}
.lbody table{border-collapse:collapse;width:100%;font-size:14.6px;min-width:480px}
.lbody thead th{background:var(--soft);text-align:left;font-family:'Poppins';font-weight:700;
  font-size:13px;color:var(--ink);padding:12px 14px;border-bottom:1px solid var(--line)}
.lbody tbody td{padding:11px 14px;border-bottom:1px solid var(--line)}
.lbody tbody tr:last-child td{border-bottom:0}
.mini{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:26px 0}
.mini .m{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;text-align:center}
.mini .m b{display:block;font-family:'Poppins';font-size:26px;color:var(--gold);line-height:1}
.mini .m span{display:block;font-size:13.4px;color:var(--muted);margin-top:6px}

/* ---------- pie de páginas internas ---------- */
.pfoot{background:var(--ink);color:#B7B1A7;padding:52px 0 26px;font-size:14.4px}
.pfoot .fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.pfoot img{filter:brightness(0) invert(1);opacity:.92;margin-bottom:12px}
.pfoot p{font-size:14px;line-height:1.7;max-width:34ch}
.pfoot h4{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px}
.pfoot a{display:block;color:#B7B1A7;margin-bottom:8px;font-size:14px}
.pfoot a:hover{color:var(--gold)}
.pfoot .social a{display:grid;margin:0}
.pfoot .fbot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:20px;font-size:12.6px;color:#7C766C}

@media(max-width:1040px){
  .alayout{grid-template-columns:1fr;gap:0}
  .aside{position:static;flex-direction:row;flex-wrap:wrap;margin-top:26px}
  .aside>*{flex:1 1 260px}
  .toc{display:none}
  .agrid{grid-template-columns:repeat(2,1fr)}
  .lgrid{grid-template-columns:1fr}
  .pfoot .fg{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .phdr-nav,.phdr .social,.phdr .btn .lbl{display:none}
  .pburger{display:flex}
  .phdr .in{min-height:68px}
  .phdr-brand img{height:48px}
  .phdr .btn-sm{padding:10px 12px}
  .phdr-mnav{display:none;flex-direction:column;background:#fff;border-top:1px solid var(--line);
    padding:10px 20px 16px}
  .phdr-mnav.open{display:flex}
  .phdr-mnav a{padding:12px 0;border-bottom:1px solid var(--line);font-family:'Poppins';
    font-weight:600;font-size:15px;color:var(--ink)}
  .phdr-mnav a:last-child{border-bottom:0}
  .agrid,.rl,.mini{grid-template-columns:1fr}
  .abody{font-size:16.4px}
  .abody table{font-size:13.6px;min-width:420px}
  .ctacard{padding:32px 20px}
  .pfoot .fg{grid-template-columns:1fr}
  .authorbox{flex-direction:column;text-align:center}
}

.btn-gold{background:linear-gradient(180deg,#f0c766,var(--gold));color:#1a1305;border:0}
.btn-gold:hover{filter:brightness(1.04)}
.sidecard .btn-gold{color:#1a1305}

.pfoot .fh{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px;
  font-family:'Poppins';font-weight:700;max-width:none}
.abody,.lbody{overflow-wrap:anywhere}
.abody .tblwrap,.lbody .tblwrap{max-width:100%}

/* corrección de desbordes en móvil */
.alayout{min-width:0}
.abody,.abody>*{min-width:0;max-width:100%}
.authorbox{max-width:100%;flex-wrap:wrap}
.authorbox>div{min-width:0;flex:1 1 220px}

.ahero h1{max-width:26ch}
.afig img{max-height:430px}
.ahero{max-width:900px}

/* ==================================================================
   PORTADA — foto más contenida y composición más equilibrada
   ================================================================== */
.hero-card{padding:22px 40px 0}
.hero-g2{grid-template-columns:1.22fr .78fr;gap:40px;align-items:center;padding:30px 0 0}
.hero-g2 h1{font-size:clamp(32px,4vw,47px);max-width:15ch}
.hero-g2 .sub{font-size:16.5px;max-width:40ch;margin:18px 0 0;line-height:1.68}
.hero-ph{align-self:center;max-width:400px;margin-left:auto}
.hero-ph img{width:100%;height:auto;max-height:400px;object-fit:contain;object-position:center bottom}
.hnote{left:-58px;top:16%;max-width:132px;font-size:19px}
.hnote span{font-size:17px}
.trust2{gap:26px;margin:28px 0 26px}
.hero-actions2{padding-bottom:36px}

@media(max-width:1120px){
  .hero-card{padding:20px 28px 0}
  .hero-g2{grid-template-columns:1.15fr .85fr;gap:28px}
  .hero-ph{max-width:340px}
  .hero-ph img{max-height:340px}
  .hnote{left:-30px;font-size:17px;max-width:118px}
}
@media(max-width:980px){
  .hero-g2{grid-template-columns:1fr;gap:8px;padding-top:18px}
  .hero-ph{max-width:360px;margin:0 auto}
  .hero-ph img{max-height:330px}
  .hero-g2 h1,.hero-g2 .sub{max-width:none}
}
@media(max-width:640px){
  .hero-card{padding:16px 20px 0}
  .hero-ph{order:-1;margin:2px auto 4px;max-width:250px;width:100%}
  .hero-ph img{max-height:230px}
  .hero-g2 h1{font-size:clamp(27px,7.6vw,34px)}
  .hero-g2 .sub{font-size:15.4px}
  .trust2{gap:14px;margin:20px 0 22px;justify-content:center}
  .trust2 .t{max-width:96px}
  .hero-actions2{padding-bottom:26px;justify-content:center}
}

/* equilibrio de la portada en pantallas anchas */
.hero-g2{grid-template-columns:1.06fr .94fr;gap:30px}
.hero-g2 h1{max-width:17ch}
.hero-g2 .sub{max-width:44ch}
.hero-ph{max-width:430px;margin:0 auto}
.hero-ph img{max-height:410px}
.trust2 .t{max-width:118px}
.trust2 .tx{font-size:12px;line-height:1.4}
.hnote{left:-46px;top:14%}
@media(min-width:1300px){
  .hero-g2{gap:36px}
  .hero-ph{max-width:460px}
  .hero-ph img{max-height:440px}
}

/* el logo no debe comprimirse dentro del flex */
.tbar .brand,.phdr-brand,.pfoot .fg>div>img{flex:0 0 auto}
.tbar .brand img,.phdr-brand img{width:auto;max-width:none;flex:0 0 auto}
.tbar .brand img{height:70px}
/* la foto ocupa bien su columna */
.hero-ph{max-width:none;width:100%}
.hero-ph img{margin:0 auto;max-height:400px}
@media(min-width:1300px){.hero-ph img{max-height:430px}}

/* la barra superior debe caber siempre dentro de la tarjeta */
.tbar{flex-wrap:nowrap}
.tbar nav{flex:0 1 auto;min-width:0;overflow:hidden}
.tbar .right{flex:0 0 auto}
@media(max-width:1300px){
  .tbar nav{gap:14px;font-size:13px}
  .tbar .brand img{height:62px}
}
@media(max-width:1180px){
  .tbar .social{display:none}
  .tbar nav{gap:12px;font-size:12.4px}
  .tbar .brand img{height:56px}
  .tbar .btn-sm{padding:11px 16px;font-size:13.5px}
}
@media(max-width:1040px){
  .tbar nav a:nth-child(n+5){display:none}
}
/* degradado más suave en la foto de portada */
.hero-ph img{
  -webkit-mask-image:radial-gradient(78% 76% at 52% 44%,#000 42%,rgba(0,0,0,.55) 66%,transparent 84%);
  mask-image:radial-gradient(78% 76% at 52% 44%,#000 42%,rgba(0,0,0,.55) 66%,transparent 84%)}

/* la foto vuelve a su render natural para que el degradado funcione */
.hero-ph{width:100%;max-width:420px;margin:0 auto;align-self:center}
.hero-ph img{width:100%;height:auto;max-height:none;object-fit:fill}
@media(min-width:1300px){.hero-ph{max-width:450px}.hero-ph img{max-height:none}}
@media(max-width:980px){.hero-ph{max-width:360px}.hero-ph img{max-height:none}}
@media(max-width:640px){.hero-ph{max-width:255px}.hero-ph img{max-height:none}}

/* la navegación superior nunca se corta: se van cayendo items por prioridad */
.tbar nav{overflow:visible}
@media(max-width:1400px){.tbar nav a:nth-child(3){display:none}}   /* Calculadora */
@media(max-width:1240px){.tbar .social{display:none}}
@media(max-width:1120px){.tbar nav a:nth-child(4){display:none}}   /* Guayaquil */
@media(max-width:1000px){.tbar nav a:nth-child(2){display:none}}   /* Comida natural */

/* la altura manda: así la foto queda proporcional al bloque de texto */
.hero-ph img{width:auto;max-width:100%;height:auto;max-height:410px;display:block;margin:0 auto}
@media(min-width:1300px){.hero-ph img{max-height:440px}}
@media(max-width:980px){.hero-ph img{max-height:330px}}
@media(max-width:640px){.hero-ph img{max-height:250px}}

/* ---- tamaño de la foto de portada: una sola regla, por ancho ---- */
.hero-ph{width:100%;max-width:310px;margin:0 auto;align-self:center;position:relative}
.hero-ph img{width:100%;height:auto;max-height:none;max-width:none;display:block;margin:0}
@media(min-width:1300px){.hero-ph{max-width:340px}}
@media(max-width:1180px){.hero-ph{max-width:280px}}
@media(max-width:980px){.hero-ph{max-width:260px;margin:0 auto}}
@media(max-width:640px){.hero-ph{max-width:200px;width:100%;margin:4px auto 2px;order:-1}}

/* ---- una sola columna en pantallas medianas y móvil (debe ir al final) ---- */
@media(max-width:980px){
  .hero-g2{grid-template-columns:1fr!important;gap:10px;padding-top:16px;text-align:center}
  .hero-g2 .htxt{text-align:center}
  .hero-g2 h1,.hero-g2 .sub{max-width:none;margin-left:auto;margin-right:auto}
  .hero-ph{order:-1}
  .trust2,.hero-actions2{justify-content:center}
  .hnote{display:none}
}

/* ---- la barra superior no se comprime: se ocultan piezas por prioridad ---- */
.tbar{gap:20px}
.tbar nav{flex:0 0 auto;overflow:visible}
@media(max-width:1520px){.tbar .social{display:none}}
@media(max-width:1240px){.tbar nav{gap:13px;font-size:13px}}
@media(max-width:1100px){.tbar nav a:nth-child(3){display:none}}
@media(max-width:1000px){.tbar nav a:nth-child(4){display:none}}
@media(max-width:900px){.tbar nav a:nth-child(2){display:none}}

/* ---- degradado real en los cuatro lados de la foto ---- */
.hero-ph img{
  -webkit-mask-image:radial-gradient(62% 58% at 50% 44%,#000 34%,rgba(0,0,0,.5) 70%,transparent 95%);
  mask-image:radial-gradient(62% 58% at 50% 44%,#000 34%,rgba(0,0,0,.5) 70%,transparent 95%)}

@media(max-width:640px){
  .trust2{gap:10px;flex-wrap:nowrap;margin:22px 0 24px}
  .trust2 .t{max-width:none;flex:1 1 0;min-width:0}
  .trust2 .tx{font-size:11.2px;line-height:1.35}
  .trust2 .ic{width:42px;height:42px}
  .hero-actions2{padding-bottom:30px;gap:10px}
  .hero-actions2 .btn{flex:1 1 auto;justify-content:center}
}

/* ---- cabecera de páginas internas: nunca se desborda ---- */
.phdr .in{gap:18px;flex-wrap:nowrap}
.phdr-nav{flex:0 0 auto;overflow:visible}
.phdr-right{flex:0 0 auto}
@media(max-width:1520px){.phdr .social{display:none}}
@media(max-width:1260px){.phdr-nav{gap:13px;font-size:13px}.phdr-brand img{height:56px}}
@media(max-width:1120px){.phdr-nav a:nth-child(3){display:none}}
@media(max-width:1020px){
  .phdr-nav{display:none}
  .pburger{display:flex}
  .phdr .btn .lbl{display:none}
  .phdr .in{min-height:70px}
  .phdr-brand img{height:52px}
  .phdr-mnav{display:none;flex-direction:column;background:#fff;border-top:1px solid var(--line);padding:10px 20px 16px}
  .phdr-mnav.open{display:flex}
  .phdr-mnav a{padding:12px 0;border-bottom:1px solid var(--line);font-family:'Poppins';font-weight:600;font-size:15px;color:var(--ink)}
  .phdr-mnav a:last-child{border-bottom:0}
}

/* la foto de portada conserva siempre su proporción original (3:4) */
.hero-ph img{aspect-ratio:3/4;object-fit:cover;height:auto}

/* ningún logo puede deformarse en ninguna parte del sitio */
img[src$="logo.webp"]{width:auto!important;max-width:100%;object-fit:contain}
.phdr-brand img{height:64px}
.tbar .brand img{height:70px}
.pfoot .fg>div>img{height:60px;margin-bottom:12px}
@media(max-width:1260px){.phdr-brand img{height:56px}}
@media(max-width:1020px){.phdr-brand img{height:52px}}
@media(max-width:1300px){.tbar .brand img{height:62px}}
@media(max-width:1180px){.tbar .brand img{height:56px}}

/* ---- tamaños definitivos del logo, por contexto ---- */
.tbar .brand img{height:58px!important}
.snav img{height:40px!important}
.phdr-brand img{height:54px!important}
.pfoot .fg>div>img{height:50px!important}
.snav .in{height:64px;padding:0;flex-wrap:nowrap}
@media(max-width:1300px){.tbar .brand img{height:54px!important}}
@media(max-width:1180px){.tbar .brand img{height:50px!important}}
@media(max-width:1260px){.phdr-brand img{height:50px!important}}
@media(max-width:1020px){.phdr-brand img{height:46px!important}}
@media(max-width:640px){.tbar .brand img{height:46px!important}.snav img{height:36px!important}}

/* la barra flotante alinea bien sus piezas (antes .right solo estaba definido para .tbar) */
.snav .in{align-items:center}
.snav .right{display:flex;align-items:center;gap:12px}
.snav .btn-sm{padding:10px 18px;font-size:14px}
.snav .social a{width:34px;height:34px}
.snav .social a svg{width:17px;height:17px}

/* ---- carta del fundador: palabras clave en los colores de la marca ---- */
.fnd h3 em{font-style:normal;color:var(--teal)}
.fnd .hl-t{color:var(--teal);font-weight:800}
.fnd .hl-c{color:var(--coral);font-weight:800}
.fnd .hl-g{font-weight:800;color:var(--ink);background:linear-gradient(180deg,transparent 58%,rgba(242,183,5,.42) 58%);
  padding:0 2px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.fnd .fnd-key{font-size:16.5px}
.fnd p{font-size:15.8px;line-height:1.7}

/* ---- la foto ocupa todo el alto del bloque de texto, sin deformarse ---- */
.hero-g2{align-items:stretch}
.hero-g2 .htxt{display:flex;flex-direction:column;justify-content:center}
.hero-ph{align-self:stretch;max-width:none;width:100%;display:flex;align-items:flex-end;
  justify-content:center;padding-bottom:6px}
.hero-ph img{height:100%;width:auto;max-width:100%;max-height:none;object-fit:contain;margin:0 auto}
@media(min-width:1300px){.hero-ph{max-width:none}.hero-ph img{max-height:none}}
@media(max-width:1180px){.hero-ph{max-width:none}}
@media(max-width:980px){
  .hero-g2{align-items:center}
  .hero-ph{align-self:center;max-width:280px;padding-bottom:0;display:block}
  .hero-ph img{height:auto;width:100%;max-height:none}
}
@media(max-width:640px){
  .hero-ph{max-width:215px}
  .hero-ph img{height:auto;width:100%}
}

/* el pie tiene 4 columnas desde que añadimos "Zonas de entrega" */
footer .fg{grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px}
@media(max-width:1040px){footer .fg{grid-template-columns:1fr 1fr;gap:26px}}
@media(max-width:640px){footer .fg{grid-template-columns:1fr;gap:22px}}

/* ==================================================================
   PORTADA ANCHA — texto arriba, foto panorámica abajo
   ================================================================== */
.hero-card{padding:22px 30px 0}
.hero-wide{grid-template-columns:1fr!important;gap:0;padding:30px 0 0;align-items:center}
.hero-wide .htxt{text-align:center;max-width:840px;margin:0 auto;display:block}
.hero-wide h1{max-width:20ch;margin:0 auto;font-size:clamp(31px,4.1vw,49px)}
.hero-wide .sub{max-width:60ch;margin:16px auto 0}
.hero-wide .trust2{justify-content:center;gap:34px;margin:26px 0 24px}
.hero-wide .hero-actions2{justify-content:center;padding-bottom:30px}
.hero-wide .hero-ph{position:relative;width:calc(100% + 60px);max-width:none;
  margin:0 -30px;align-self:auto;padding:0}
.hero-wide .hero-ph img{width:100%;height:auto;max-height:none;aspect-ratio:3/2;
  object-fit:cover;display:block;border-radius:0 0 26px 26px;
  -webkit-mask-image:none;mask-image:none}
.hero-wide .hnote{position:absolute;left:4%;top:8%;max-width:150px;font-size:20px;
  text-align:left;transform:rotate(-3deg);display:block}
.hero-wide .hnote span{font-size:18px}

@media(max-width:1120px){
  .hero-card{padding:20px 24px 0}
  .hero-wide .hero-ph{width:calc(100% + 48px);margin:0 -24px}
  .hero-wide .hnote{font-size:17px;max-width:126px}
}
@media(max-width:760px){
  .hero-card{padding:16px 20px 0}
  .hero-wide{padding-top:20px}
  .hero-wide .hero-ph{width:calc(100% + 40px);margin:0 -20px;order:0}
  .hero-wide .hero-ph img{border-radius:0 0 22px 22px}
  .hero-wide .hnote{display:none}
  .hero-wide h1{font-size:clamp(27px,7.4vw,34px);max-width:none}
  .hero-wide .sub{font-size:15.4px}
  .hero-wide .trust2{gap:10px;flex-wrap:nowrap;margin:20px 0 22px}
  .hero-wide .hero-actions2{padding-bottom:24px}
}

/* el bloque de texto más compacto para que la foto panorámica no alargue tanto la portada */
.hero-wide{padding-top:24px}
.hero-wide h1{font-size:clamp(30px,3.7vw,44px);line-height:1.08;max-width:19ch}
.hero-wide .sub{font-size:16.2px;margin:13px auto 0;max-width:58ch}
.hero-wide .trust2{margin:22px 0 20px;gap:30px}
.hero-wide .trust2 .t{max-width:126px}
.hero-wide .hero-actions2{padding-bottom:26px}

/* ---- foto de portada en su sitio de siempre: columna derecha ---- */
.hero-card{padding:22px 30px 0}
.hero-g2{grid-template-columns:1.02fr .98fr;gap:30px;align-items:center;padding:28px 0 0}
.hero-g2 .htxt{display:flex;flex-direction:column;justify-content:center;text-align:left}
.hero-g2 h1{max-width:16ch;margin:0;font-size:clamp(31px,3.9vw,46px)}
.hero-g2 .sub{max-width:42ch;margin:16px 0 0}
.hero-g2 .trust2{justify-content:flex-start;gap:26px;margin:26px 0 24px}
.hero-g2 .hero-actions2{justify-content:flex-start;padding-bottom:32px}
.hero-ph{position:relative;width:100%;max-width:470px;margin:0 auto;align-self:center;padding:0}
.hero-ph img{width:100%;height:auto;max-width:none;max-height:none;aspect-ratio:3/2;
  object-fit:cover;display:block;border-radius:22px;
  box-shadow:0 18px 50px rgba(28,24,21,.10);
  -webkit-mask-image:none;mask-image:none}
.hnote{position:absolute;left:-40px;top:6%;max-width:132px;font-size:19px;display:block;
  text-align:center;transform:rotate(-3deg)}
.hnote span{font-size:17px}

@media(min-width:1300px){.hero-ph{max-width:510px}}
@media(max-width:1180px){.hero-ph{max-width:400px}.hnote{left:-22px;font-size:17px;max-width:118px}}
@media(max-width:980px){
  .hero-g2{grid-template-columns:1fr!important;gap:10px;padding-top:18px;text-align:center}
  .hero-g2 .htxt{text-align:center}
  .hero-g2 h1,.hero-g2 .sub{max-width:none;margin-left:auto;margin-right:auto}
  .hero-g2 .trust2,.hero-g2 .hero-actions2{justify-content:center}
  .hero-ph{order:-1;max-width:420px;margin:0 auto}
  .hnote{display:none}
}
@media(max-width:640px){
  .hero-card{padding:16px 20px 0}
  .hero-ph{max-width:330px;margin:4px auto 2px}
  .hero-g2 h1{font-size:clamp(27px,7.4vw,34px)}
  .hero-g2 .hero-actions2{padding-bottom:26px}
}

/* ==================================================================
   PORTADA — versión del diseño aprobado
   ================================================================== */
.hbadge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
  border-radius:100px;padding:9px 18px;font-family:'Poppins';font-weight:600;font-size:12.4px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin-bottom:20px;
  box-shadow:0 4px 16px rgba(28,24,21,.05)}
.hbadge svg{color:var(--teal);flex:0 0 auto}
.hero-g2 .htxt{align-items:flex-start}
.hero-g2 .hero-actions2 .btn{display:inline-flex;align-items:center}

/* nota manuscrita como tarjeta blanca sobre la foto */
.hnote{position:absolute;left:-46px;top:8%;max-width:none;width:210px;background:#fff;
  border-radius:16px;padding:16px 18px;box-shadow:0 14px 40px rgba(28,24,21,.13);
  font-family:'Caveat',cursive;font-size:22px;line-height:1.24;color:var(--ink);
  text-align:left;transform:none;z-index:2}
.hnote b{display:block;font-weight:500}
.hnote span{display:block;color:var(--coral);font-size:22px;margin-top:0}

/* franja de garantías bajo la portada */
.hfeat{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;background:var(--soft);
  border-radius:20px;padding:22px 24px;margin:6px 0 26px}
.hfeat .hf{display:flex;align-items:flex-start;gap:13px;min-width:0}
.hfeat .hf img{width:46px;height:46px;flex:0 0 46px;object-fit:contain}
.hfeat .hf b{display:block;font-family:'Poppins';font-weight:700;font-size:14.4px;color:var(--ink);line-height:1.25}
.hfeat .hf span{display:block;font-size:13.2px;color:var(--body);line-height:1.45;margin-top:3px}

@media(max-width:1180px){
  .hnote{left:-26px;width:184px;font-size:20px;padding:14px 16px}
  .hnote span{font-size:20px}
  .hfeat{gap:16px;padding:20px}
  .hfeat .hf img{width:40px;height:40px;flex:0 0 40px}
  .hfeat .hf b{font-size:13.6px}
  .hfeat .hf span{font-size:12.4px}
}
@media(max-width:980px){
  .hero-g2 .htxt{align-items:center}
  .hbadge{margin-bottom:16px}
  .hfeat{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .hbadge{font-size:11px;padding:8px 14px;letter-spacing:.09em}
  .hfeat{grid-template-columns:1fr;gap:14px;padding:18px;margin:2px 0 20px}
}

/* ---- ajustes finos de la portada ---- */
/* los iconos de redes vuelven a verse en escritorio */
@media(min-width:1200px){
  .tbar .social{display:flex}
  .tbar .social a{width:34px;height:34px}
  .tbar .social a svg{width:17px;height:17px}
  .tbar{gap:16px}
  .tbar nav{gap:14px;font-size:13px}
  .tbar .brand img{height:56px!important}
  .tbar .btn-sm{padding:12px 20px;font-size:14px}
}
@media(max-width:1199px){.tbar .social{display:none}}

/* tarjeta de la nota, más arriba y más compacta */
.hnote{left:-34px;top:4%;width:196px;padding:15px 17px;font-size:21px}
.hnote span{font-size:21px}

/* franja de garantías: iconos algo mayores y texto que respira */
.hfeat{gap:26px;padding:24px 26px}
.hfeat .hf img{width:52px;height:52px;flex:0 0 52px}
.hfeat .hf b{font-size:14px}
.hfeat .hf span{font-size:12.8px;line-height:1.42}

/* los tres sellos de confianza, algo más grandes */
.trust2 .ic{width:50px;height:50px}
.trust2 .tx{font-size:12.2px}

/* ---- los dos botones de la portada, siempre en una sola línea ---- */
@media(min-width:981px){
  .hero-actions2{flex-wrap:nowrap;gap:12px;align-items:center}
  .hero-actions2 .btn{white-space:nowrap;flex:0 0 auto}
  .hero-actions2 .btn-wa,.hero-actions2 .btn-gh{padding:13px 19px;font-size:14.4px;line-height:1.2}
  .hero-actions2 .btn-gh svg{margin-left:7px!important;width:16px;height:16px}
}
@media(min-width:981px) and (max-width:1240px){
  .hero-actions2 .btn-wa,.hero-actions2 .btn-gh{padding:13px 18px;font-size:14.2px}
  .hero-actions2 .btn-gh svg{margin-left:6px!important;width:15px;height:15px}
}
/* con el texto más compacto, la foto puede crecer */
.hero-g2{grid-template-columns:.98fr 1.02fr;gap:28px}
.hero-ph{max-width:520px}
@media(min-width:1300px){.hero-ph{max-width:560px}}
@media(max-width:1240px){.hero-ph{max-width:460px}}
@media(max-width:1080px){.hero-ph{max-width:400px}}
.hnote{left:-30px;top:5%;width:188px;font-size:20px}
.hnote span{font-size:20px}

/* la columna de texto necesita un poco más de aire para los dos botones */
.hero-g2{grid-template-columns:1.05fr .95fr}
.hero-ph{max-width:500px}
@media(min-width:1300px){.hero-ph{max-width:530px}}

/* ---- palabras clave del subtítulo de portada, en los colores de la marca ---- */
.hero-g2 .sub{font-size:17px;line-height:1.7}
.hero-g2 .sub .k-t{color:var(--teal);font-weight:800}
.hero-g2 .sub .k-c{color:var(--coral);font-weight:800}
.hero-g2 .sub .k-g{font-weight:800;color:var(--ink);
  background:linear-gradient(180deg,transparent 60%,rgba(242,183,5,.42) 60%);
  padding:0 2px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero-g2 .sub b{color:var(--ink);font-weight:800}

/* ---- en móvil sobra el botón flotante: el de WhatsApp ya está en la cabecera ---- */
@media(max-width:900px){
  .wafab{display:none!important}
}

/* ---- la foto llena el alto del bloque de texto ---- */
.hero-g2{grid-template-columns:.9fr 1.1fr;gap:26px;align-items:center}
.hero-ph{max-width:none;width:100%}
@media(min-width:1300px){.hero-ph{max-width:none}}
@media(max-width:1240px){.hero-ph{max-width:none}}
@media(max-width:1080px){.hero-ph{max-width:none}}
@media(max-width:980px){.hero-ph{max-width:420px;margin:0 auto}}
@media(max-width:640px){.hero-ph{max-width:330px}}

/* ---- la foto va dentro de un panel crema que sí llena todo el alto ---- */
.hero-g2{align-items:stretch}
.hero-g2 .htxt{justify-content:center}
.hero-ph{align-self:stretch;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#FBF7F0 0%,#F3EADC 100%);
  border-radius:24px;padding:20px;box-shadow:0 14px 44px rgba(28,24,21,.07)}
.hero-ph img{width:100%;height:auto;max-width:100%;max-height:100%;aspect-ratio:3/2;
  object-fit:contain;border-radius:16px;box-shadow:none;margin:0}
.hnote{left:-26px;top:9%}
@media(max-width:980px){
  .hero-ph{align-self:center;padding:14px;border-radius:20px;max-width:430px}
  .hero-ph img{border-radius:14px}
}
@media(max-width:640px){
  .hero-ph{padding:10px;border-radius:18px;max-width:340px}
}


/* ═══════════════════════════════════════════════════════════════
   MENÚ SUPERIOR — nunca se pierde ninguna opción   (15 ago 2026)
   Antes había reglas que escondían el 3er enlace por ancho de
   pantalla. Estaban hechas para el menú viejo ("Calculadora"), y
   con el menú nuevo el 3er enlace es PEDIDO: en cualquier laptop
   de menos de 1400 px desaparecía justo el enlace más importante.
   Ahora el menú se compacta y, si de verdad no cabe, pasa entero
   al botón de hamburguesa.
   ═══════════════════════════════════════════════════════════════ */
.tbar nav a:nth-child(n), .snav nav a:nth-child(n), .phdr-nav a:nth-child(n){
  display:inline-block; white-space:nowrap }
@media(max-width:1400px){ .tbar nav,.snav nav{gap:14px;font-size:13.2px} .phdr-nav{gap:14px;font-size:13.2px} }
@media(max-width:1240px){ .tbar nav,.snav nav{gap:12px;font-size:12.6px} .phdr-nav{gap:12px;font-size:12.6px} }
@media(max-width:1120px){ .tbar nav,.snav nav{gap:10px;font-size:12.1px} .phdr-nav{gap:10px;font-size:12.1px} }
@media(max-width:1040px){
  .tbar nav,.snav nav{display:none}
  .burger{display:block}
}

/* la barra fija también necesita su hamburguesa por debajo de 1040 px */
.snav-burger{display:none;margin-left:4px}
.snav .mnav{background:#fff;border-top:1px solid var(--line);padding:6px 20px 14px}
.snav .mnav a{padding:12px 4px;border-bottom:1px solid var(--line);font-weight:700;color:var(--ink)}
@media(max-width:1040px){ .snav-burger{display:block} }
@media(min-width:1041px){ .snav .mnav{display:none!important} }
/* ================================================================
   BARRA DE MENÚ · 18 ago 2026 (versión final)
   Se mantiene el DISEÑO PLANO original de la barra.
   De la versión anterior solo se conservan: tamaño del logo,
   iconos de redes, espaciado, tamaño de letra y Poppins.
   ================================================================ */

/* --- se anula la pastilla: barra plana, como estaba --- */
.tbar{
  background:transparent;
  border-radius:0;
  box-shadow:none;
  min-height:0;
  padding:14px 0 14px;
  margin-bottom:0;
  gap:22px;
}
.snav{
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
  padding:0;
}
.snav .in{
  background:transparent;border-radius:0;box-shadow:none;
  min-height:0;height:72px;padding:0;gap:22px;
}
.phdr{
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
  padding:0;
}
.phdr .in{
  background:transparent;border-radius:0;box-shadow:none;
  min-height:84px;padding:0;gap:22px;
}
.top-wrap{padding:10px 0 0}

/* --- lo que SÍ se conserva --- */

/* tamaño del logo */
.tbar .brand img,
.phdr-brand img{height:46px !important}
.snav img{height:44px}

/* tipografía Poppins, espaciado y tamaño de letra */
.tbar, .tbar nav, .tbar nav a, .tbar .btn-wa,
.snav, .snav nav, .snav nav a, .snav .btn-wa,
.phdr, .phdr-nav, .phdr-nav a, .phdr-right .btn-wa,
.top, .top nav, .top nav a, .top .btn-wa,
.mnav, .mnav a, .phdr-mnav, .phdr-mnav a{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
}
.tbar nav, .snav nav, .phdr-nav{
  gap:26px !important;
  font-size:14px !important;
  font-weight:600 !important;
  letter-spacing:.02em !important;
}
.tbar nav a, .snav nav a, .phdr-nav a{
  padding:4px 0 !important;
  border-radius:0;
  color:var(--ink);
  background:none !important;
  transition:color .22s;
}
.tbar nav a:hover, .snav nav a:hover, .phdr-nav a:hover{color:var(--teal)}

/* subrayado que crece al pasar, como en el diseño original */
.tbar nav a::after, .snav nav a::after, .phdr-nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;
  background:var(--teal);transition:right .3s;display:block !important;
}
.tbar nav a:hover::after, .snav nav a:hover::after, .phdr-nav a:hover::after{right:0}
.tbar nav a.on, .snav nav a.on, .phdr-nav a.on{color:var(--teal) !important}
.tbar nav a.on::after, .snav nav a.on::after, .phdr-nav a.on::after{right:0}
.tbar nav a.on::before, .snav nav a.on::before, .phdr-nav a.on::before{display:none}

/* iconos de redes */
.tbar .social a,
.snav .social a,
.phdr-right .social a{
  width:40px;height:40px;
  border:1.5px solid var(--line) !important;
  color:var(--ink);
}
.tbar .social a:hover,
.snav .social a:hover,
.phdr-right .social a:hover{
  background:var(--teal) !important;border-color:var(--teal) !important;color:#fff;
}

/* botón de pedido */
.tbar .btn-wa,
.snav .btn-wa,
.phdr-right .btn-wa{
  height:50px;padding:0 24px;border-radius:100px;
  font-size:15px;font-weight:700;
  display:inline-flex;align-items:center;gap:10px;
}

/* hamburguesa */
.tbar .burger, .snav .burger, .phdr .pburger{
  width:46px;height:46px;border-radius:50%;
  border:1.5px solid var(--line);background:#fff;
}

/* menú desplegable del celular */
.mnav, .phdr-mnav{
  background:#fff;border-radius:22px;padding:10px;margin-top:10px;
  box-shadow:0 14px 40px rgba(28,24,21,.10);
}
.mnav a, .phdr-mnav a{
  display:block;padding:13px 18px;border-radius:14px;
  font-weight:600;letter-spacing:.02em;font-size:14px;
}
.mnav a:hover, .phdr-mnav a:hover{background:#F1F7F6;color:var(--teal)}

/* --- responsivo: se compacta, nunca esconde un enlace --- */
@media(min-width:1041px){
  .tbar .social, .snav .social, .phdr .social,
  .phdr-right .social, .top .social{display:flex !important}
}
@media(max-width:1440px){
  .tbar nav, .snav nav, .phdr-nav{gap:18px !important;font-size:13.4px !important}
  .tbar .btn-wa, .snav .btn-wa, .phdr-right .btn-wa{height:48px;padding:0 20px;font-size:14.5px}
}
@media(max-width:1240px){
  .tbar nav, .snav nav, .phdr-nav{gap:13px !important;font-size:12.6px !important}
  .tbar .social a, .snav .social a, .phdr-right .social a{width:36px;height:36px}
}
@media(max-width:1040px){
  .tbar nav, .snav nav, .phdr-nav{display:none !important}
  .tbar .social, .snav .social, .phdr-right .social{display:none !important}
  .tbar .brand img, .phdr-brand img{height:40px !important}
}
@media(max-width:640px){
  .tbar .brand img, .phdr-brand img{height:34px !important}
}

/* ================================================================
   BANNER Y PÁGINA DE LA APP MI PERRO · 18 ago 2026
   ================================================================ */

/* banner en la portada */
.app-banner-sec{padding-top:0}
.app-banner{display:block;border-radius:28px;overflow:hidden;
  box-shadow:0 18px 44px rgba(28,24,21,.10);
  transition:transform .28s cubic-bezier(.16,1,.3,1), box-shadow .28s}
.app-banner img{display:block;width:100%;height:auto}
.app-banner:hover{transform:translateY(-4px);
  box-shadow:0 26px 60px rgba(28,24,21,.16)}

/* imagen grande de la página /app/ */
.app-hero{display:block;width:100%;height:auto;border-radius:28px;
  box-shadow:0 18px 44px rgba(28,24,21,.10);margin-top:26px}

/* cuadrícula de las 8 pantallas */
.app-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:34px}
.app-shot{margin:0;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);
  display:flex;flex-direction:column}
.app-shot img{display:block;width:100%;height:auto;background:#FBF6EC}
.app-shot figcaption{padding:18px 24px 24px;border-top:1px solid var(--line)}
.app-shot h3{margin:0 0 4px;font-size:20px;line-height:1.25}
.app-shot .app-sub{margin:0 0 10px;color:var(--teal);font-weight:700;font-size:14.5px}
.app-shot p{margin:0;color:var(--body);font-size:15.5px;line-height:1.65}

/* llamado final */
.app-cta{display:flex;align-items:center;justify-content:space-between;
  gap:28px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:34px 36px;box-shadow:var(--sh)}
.app-cta h2{margin:0 0 8px;font-size:clamp(22px,2.6vw,28px)}
.app-cta p{margin:0;color:var(--body);max-width:52ch}
.app-cta-btns{display:flex;gap:12px;flex-wrap:wrap}

@media(max-width:900px){
  .app-grid{grid-template-columns:1fr;gap:20px}
  .app-cta{padding:26px 24px}
}
@media(max-width:640px){
  .app-banner,.app-hero{border-radius:20px}
  .app-shot figcaption{padding:18px 20px 22px}
  .app-shot h3{font-size:18px}
}

/* ================================================================
   AJUSTES DE BARRA · 18 ago 2026 (segunda ronda)
   ================================================================ */

/* 1 · toda la barra en Poppins */
.tbar, .tbar nav, .tbar nav a, .tbar .btn-wa,
.snav, .snav nav, .snav nav a, .snav .btn-wa,
.phdr, .phdr-nav, .phdr-nav a, .phdr-right .btn-wa,
.top, .top nav, .top nav a, .top .btn-wa,
.mnav, .mnav a, .phdr-mnav, .phdr-mnav a{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
}

/* 2 · el botón de la barra dice solo "Pedir" */
.tbar .btn-wa .lbl,
.snav .btn-wa .lbl,
.phdr-right .btn-wa .lbl,
.top .btn-wa .lbl{
  font-size:0;                      /* se oculta el texto largo */
  letter-spacing:0;
}
.tbar .btn-wa .lbl::after,
.snav .btn-wa .lbl::after,
.phdr-right .btn-wa .lbl::after,
.top .btn-wa .lbl::after{
  content:"Pedir";
  font-size:15.5px;
  letter-spacing:.005em;
}
.tbar .btn-wa, .snav .btn-wa,
.phdr-right .btn-wa, .top .btn-wa{ padding:0 24px }

@media(max-width:1440px){
  .tbar .btn-wa .lbl::after, .snav .btn-wa .lbl::after,
  .phdr-right .btn-wa .lbl::after, .top .btn-wa .lbl::after{ font-size:14.5px }
}

/* 3 · fuera la burbuja verde flotante de WhatsApp */
.wafab{ display:none !important }

/* 2b · variantes del botón que NO usan <span class="lbl"> */

/* páginas con <span class="t"> (barf-vs, estómago sensible, transición) */
.hdr-cta .btn-wa .t{font-size:0;letter-spacing:0}
.hdr-cta .btn-wa .t::after{content:"Pedir";font-size:15.5px;letter-spacing:.005em}

/* botones cuyo texto va suelto, sin etiqueta (barra fija de /plan/) */
/* Parche retirado el 28 ago 2026: imprimía "Pedir" ENCIMA del texto
   largo cuando otra regla posterior devolvía el font-size al enlace,
   y salía "Pedir por WhatsAppPedir". Ahora esos botones llevan
   <span class="lbl"> y los maneja la regla de abajo, que sí gana. */
.snav .btn-wa svg{width:26px;height:26px;flex:0 0 auto}

/* ================================================================
   AJUSTES MÓVIL · 19 ago 2026
   ================================================================ */

@media(max-width:640px){

  /* 1 · BARRA FIJA: que quepa entera en la pantalla ------------- */
  .snav{padding:8px 0}
  .snav .in{
    min-height:60px;height:auto;
    padding:0 12px;
    gap:10px;
    box-sizing:border-box;
    max-width:100%;
    overflow:visible;
  }
  .tbar{padding:10px 0;gap:10px}

  /* el logo no se estira ni se encoge */
  .tbar .brand, .snav .brand, .tbar a:first-child, .snav a:first-child{flex:0 0 auto}

  /* el botón "Pedir" pierde el icono de WhatsApp: en móvil sobra
     y era lo que empujaba el hamburguesa fuera de la pantalla */
  .tbar .btn-wa svg, .snav .btn-wa svg{display:none !important}
  .tbar .btn-wa, .snav .btn-wa{
    height:44px;
    padding:0 20px;
    font-size:15px;
    gap:0;
    flex:0 0 auto;
    white-space:nowrap;
  }

  /* el hamburguesa siempre visible y dentro del margen */
  .tbar .burger, .snav .burger{
    flex:0 0 auto;
    width:44px;height:44px;
    margin-right:0;
  }

  /* 2 · UNA SOLA COLUMNA: se acaba el texto cortado -------------- */
  .bgrid, .ing{grid-template-columns:1fr !important;gap:14px}

  /* las tarjetas dejan de parecer botones: nada de sombra al tocar,
     ni cursor de mano, ni movimiento. Así no se espera que pase algo */
  .bcard, .icard{
    cursor:default;
    transition:none;
    -webkit-tap-highlight-color:transparent;
  }
  .bcard:hover, .bcard:active, .bcard:focus,
  .icard:hover, .icard:active, .icard:focus{
    transform:none !important;
    box-shadow:none !important;
    border-color:var(--line) !important;
  }

  /* En una columna, la tarjeta se lee mejor en horizontal.
     Se usa rejilla porque la imagen y el texto son hermanos:
     con flex quedaban los tres en la misma fila y el título
     se cortaba. Aquí la imagen ocupa la columna 1 completa y
     el texto se apila en la columna 2. */
  .bcard{
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    column-gap:14px;align-items:center;
    text-align:left;padding:18px;
  }
  .bcard .ic{grid-column:1;grid-row:1 / span 2;margin:0;width:46px;height:46px;border-radius:14px}
  .bcard h3, .bcard h4{grid-column:2;align-self:end;font-size:16.5px;margin:0 0 3px}
  .bcard p{grid-column:2;align-self:start;font-size:14.5px;line-height:1.5;margin:0}

  .icard{
    display:grid;
    grid-template-columns:112px minmax(0,1fr);
    column-gap:14px;align-items:center;
    text-align:left;padding:0;overflow:hidden;
  }
  .icard img{
    grid-column:1;grid-row:1 / span 2;
    width:112px;height:112px;margin:0;aspect-ratio:1/1;
  }
  .icard h3, .icard h4{
    grid-column:2;align-self:end;
    font-size:16px;margin:0;padding:0 14px 0 0;
    overflow-wrap:anywhere;
  }
  .icard p{
    grid-column:2;align-self:start;
    font-size:14px;line-height:1.45;margin:3px 0 0;padding:0 14px 0 0;
  }
}

@media(max-width:400px){
  .tbar .btn-wa, .snav .btn-wa{padding:0 16px;font-size:14.5px;height:42px}
  .tbar .burger, .snav .burger{width:42px;height:42px}
  .icard{grid-template-columns:96px minmax(0,1fr)}
  .icard img{width:96px;height:96px}
}

/* ================================================================
   LOGO MÁS GRANDE + ICONO DE WHATSAPP EN ESCRITORIO · 19 ago 2026
   ================================================================ */

/* 1 · Logo más grande en las cuatro barras */
.tbar .brand img,
.phdr-brand img{height:62px !important}
.snav img{height:56px !important}
.top .brand img{height:62px !important}

/* la barra crece un poco para que el logo respire */
.tbar{padding:18px 0 18px}
.phdr .in{min-height:96px}
.snav .in{height:84px}

/* 2 · El botón "Pedir" lleva el icono de WhatsApp en escritorio.
   Algunos botones (como el de /plan/) no tienen el icono en el
   HTML, así que se dibuja aquí y así sale igual en todas. */
@media(min-width:641px){
  .tbar .btn-wa::before,
  .snav .btn-wa::before,
  .phdr-right .btn-wa::before,
  .top .btn-wa::before{
    content:"";
    width:24px;height:24px;
    flex:0 0 auto;
    margin-right:2px;
    background-color:#fff;
    -webkit-mask:var(--wa-ic) center/contain no-repeat;
            mask:var(--wa-ic) center/contain no-repeat;
  }
  /* si el botón YA trae su icono en el HTML, no se dibuja otro */
  .tbar .btn-wa:has(svg)::before,
  .snav .btn-wa:has(svg)::before,
  .phdr-right .btn-wa:has(svg)::before,
  .top .btn-wa:has(svg)::before{display:none}
}

:root{
  --wa-ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000' d='M17.47 14.38c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15s-.77.97-.94 1.17c-.17.2-.35.22-.65.07-.3-.15-1.25-.46-2.38-1.47-.88-.78-1.48-1.75-1.65-2.05-.17-.3-.02-.46.13-.61.14-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.02-.52-.08-.15-.67-1.61-.92-2.21-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.48s1.07 2.88 1.22 3.08c.15.2 2.1 3.2 5.08 4.49.71.3 1.26.49 1.69.63.71.23 1.36.19 1.87.12.57-.09 1.76-.72 2-1.41.25-.7.25-1.29.17-1.42-.07-.13-.27-.2-.57-.35Z'/><path fill='%23000' d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5.03-1.32A10 10 0 1 0 12 2Zm0 18.2a8.2 8.2 0 0 1-4.18-1.14l-.3-.18-3.1.81.83-3.02-.2-.31A8.2 8.2 0 1 1 12 20.2Z'/></svg>");
}

/* En celular el logo también sube, pero sin sacar nada de sitio */
@media(max-width:1040px){
  .tbar .brand img, .phdr-brand img, .snav img, .top .brand img{height:50px !important}
  .tbar{padding:12px 0}
  .phdr .in{min-height:82px}
  .snav .in{height:72px}
}
@media(max-width:640px){
  .tbar .brand img, .phdr-brand img, .snav img, .top .brand img{height:44px !important}
  .tbar{padding:10px 0}
  .snav .in{min-height:64px;height:auto}
}
@media(max-width:400px){
  .tbar .brand img, .phdr-brand img, .snav img, .top .brand img{height:38px !important}
}

/* ================================================================
   CORRECCIONES MÓVIL · 22 ago 2026
   ================================================================ */

/* 1 · El botón salía como una pastilla turquesa VACÍA en la portada.
   Una regla heredada (.tbar .btn-wa .lbl{display:none}) escondía la
   etiqueta, y con ella desaparecía el texto "Pedir" que se dibuja
   encima. Se vuelve a mostrar la etiqueta, vacía de texto propio. */
.tbar .btn-wa .lbl,
.snav .btn-wa .lbl,
.phdr .btn .lbl,
.phdr-right .btn-wa .lbl,
.top .btn-wa .lbl{
  display:inline !important;
  font-size:0 !important;
  letter-spacing:0;
}
.tbar .btn-wa .lbl::after,
.snav .btn-wa .lbl::after,
.phdr .btn .lbl::after,
.phdr-right .btn-wa .lbl::after,
.top .btn-wa .lbl::after{
  content:"Pedir";
  font-size:15px;
  font-weight:700;
  letter-spacing:.005em;
}
@media(max-width:640px){
  .tbar .btn-wa .lbl::after,
  .snav .btn-wa .lbl::after,
  .phdr .btn .lbl::after,
  .phdr-right .btn-wa .lbl::after,
  .top .btn-wa .lbl::after{font-size:14.5px}
  .tbar .btn-wa, .snav .btn-wa,
  .phdr-right .btn-wa, .top .btn-wa{padding:0 20px;min-width:0}
}

/* 2 · "¿Solo quieres probar? Pide sin cuestionario" se salía de su
   recuadro: el texto es largo y el botón no lo dejaba partir. */
#irRapido, .btn.btn-gh{
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.35;
  text-align:center;
  height:auto;
  min-height:0;
}
@media(max-width:640px){
  #irRapido{
    font-size:14px;
    padding:13px 16px;
    display:block;
    width:100%;
    box-sizing:border-box;
  }
}

/* ================================================================
   BOTÓN "PEDIR" AL FORMULARIO + LOGO MÁS GRANDE · 22 ago 2026
   ================================================================ */

/* El botón de la barra ya no lleva a WhatsApp sino al formulario,
   así que se le quita el logo de WhatsApp: prometía otra cosa. */
.tbar .btn-wa svg,
.snav .btn-wa svg,
.phdr-right .btn-wa svg,
.top .btn-wa svg,
.hdr-cta .btn-wa svg{display:none !important}

.tbar .btn-wa::before,
.snav .btn-wa::before,
.phdr-right .btn-wa::before,
.top .btn-wa::before,
.hdr-cta .btn-wa::before{content:none !important}

.tbar .btn-wa,
.snav .btn-wa,
.phdr-right .btn-wa,
.top .btn-wa,
.hdr-cta .btn-wa{gap:0;padding:0 26px}

/* Logo más grande, sobre todo en celular */
.tbar .brand img,
.phdr-brand img,
.snav img,
.top .brand img{height:66px !important}
.hdr-logo{height:66px !important}

@media(max-width:1040px){
  .tbar .brand img,.phdr-brand img,.snav img,.top .brand img,
  .hdr-logo{height:58px !important}
}
@media(max-width:640px){
  .tbar .brand img,.phdr-brand img,.snav img,.top .brand img,
  .hdr-logo{height:54px !important}
  .tbar .btn-wa,.snav .btn-wa,
  .phdr-right .btn-wa,.top .btn-wa,.hdr-cta .btn-wa{padding:0 22px}
}
@media(max-width:360px){
  .tbar .brand img,.phdr-brand img,.snav img,.top .brand img,
  .hdr-logo{height:48px !important}
  .tbar .btn-wa,.snav .btn-wa,
  .phdr-right .btn-wa,.top .btn-wa,.hdr-cta .btn-wa{padding:0 18px}
}


/* ==================================================================
   OPCIÓN "SOCIOS" EN LA BARRA DE MENÚ            25 ago 2026
   Añade la pastilla coral y compacta la barra para que la opción
   nueva entre sin esconder ningún enlace en ningún ancho.
   No modifica ningún contenido de las páginas.
   ================================================================== */

/* La barra del sitio impone 'background:none !important' a sus enlaces, así que
   la pastilla necesita la misma fuerza para que el fondo coral se vea. */
.tbar nav a.nav-socios,
.snav nav a.nav-socios,
.phdr-nav a.nav-socios,
.hdr nav a.nav-socios,
.top nav a.nav-socios,
a.nav-socios{
  background:#EB5346 !important;
  color:#fff !important;
  border-radius:100px !important;
  padding:7px 15px !important;
  line-height:1.15 !important;
  align-self:center;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 2px 8px rgba(235,83,70,.24);
  transition:background .2s;
}
.tbar nav a.nav-socios:hover,
.snav nav a.nav-socios:hover,
.phdr-nav a.nav-socios:hover,
.hdr nav a.nav-socios:hover,
.top nav a.nav-socios:hover,
a.nav-socios:hover{background:#D8422F !important; color:#fff !important}
.nav-socios::after{display:none !important}   /* sin el subrayado de los demás */

/* en el menú desplegable del celular se ve como un enlace más, en coral */
.mnav a.nav-socios, .phdr-mnav a.nav-socios{
  background:none !important; color:#EB5346 !important; box-shadow:none;
  font-weight:700; padding:13px 18px !important; border-radius:14px !important;
}
.mnav a.nav-socios:hover, .phdr-mnav a.nav-socios:hover{background:#FDF0EE !important}

/* --- la barra se compacta para dar cabida a la opción nueva --- */
@media(min-width:1141px){
  .tbar nav, .snav nav, .phdr-nav, .hdr nav, .top nav{gap:12px !important; font-size:12.4px !important}
  .tbar .brand img, .phdr-brand img, .hdr .brand img{height:54px !important}
  .tbar .social a, .snav .social a, .phdr-right .social a{width:34px !important; height:34px !important}
  .tbar .btn-wa, .snav .btn-wa, .phdr-right .btn-wa{padding:0 18px !important; font-size:14px !important}
}
@media(min-width:1041px) and (max-width:1140px){
  .tbar nav, .snav nav, .phdr-nav, .hdr nav, .top nav{gap:9px !important; font-size:11.6px !important}
  .tbar .brand img, .phdr-brand img, .hdr .brand img{height:46px !important}
  .tbar .social a, .snav .social a, .phdr-right .social a{width:32px !important; height:32px !important}
  .tbar .btn-wa, .snav .btn-wa, .phdr-right .btn-wa{padding:0 13px !important; font-size:13px !important}
  .phdr .in, .snav .in{gap:12px !important}
  .nav-socios{padding:7px 13px !important}
}


/* ══════════════════════════════════════════════════════════════
   CELULAR · "Socios" sale del menú hamburguesa y se pone al lado
   del botón Pedir, en coral de marca y del mismo alto.
   ══════════════════════════════════════════════════════════════ */
@media(max-width:640px){
  /* la barra de enlaces vuelve a mostrarse, pero SOLO con Socios */
  .tbar nav, .snav nav, .phdr-nav, .hdr nav, .top nav{
    display:flex !important; gap:0 !important; flex:0 0 auto !important;
    overflow:visible !important; margin-left:auto}
  .tbar nav a:not(.nav-socios), .snav nav a:not(.nav-socios),
  .phdr-nav a:not(.nav-socios), .hdr nav a:not(.nav-socios),
  .top nav a:not(.nav-socios){display:none !important}

  /* la pastilla coral, del mismo alto que el botón Pedir */
  .tbar nav a.nav-socios, .snav nav a.nav-socios,
  .phdr-nav a.nav-socios, .hdr nav a.nav-socios, .top nav a.nav-socios{
    display:inline-flex !important; align-items:center; justify-content:center;
    height:42px; padding:0 18px !important; font-size:14.5px !important;
    font-family:'Poppins'; font-weight:700; white-space:nowrap;
    box-shadow:0 8px 20px rgba(235,83,70,.28) !important}

  /* y desaparece del desplegable */
  .mnav a.nav-socios, .phdr-mnav a.nav-socios{display:none !important}

  .tbar .right, .snav .right, .phdr-right{gap:8px}
}
@media(max-width:400px){
  .tbar nav a.nav-socios, .snav nav a.nav-socios,
  .phdr-nav a.nav-socios, .hdr nav a.nav-socios, .top nav a.nav-socios{
    padding:0 13px !important; font-size:13.5px !important}
}

/* ══════════════════════════════════════════════════════════════
   Aviso de zona de entrega, junto a los botones de pedido
   ══════════════════════════════════════════════════════════════ */
.zona-aviso{
  flex:1 0 100%; width:100%; margin:14px 0 0;
  display:flex; align-items:flex-start; gap:9px;
  background:#FFF8E8; border:1px solid #F3E2B4; border-radius:14px;
  padding:11px 14px; font-size:13.5px; line-height:1.55; color:#6B5B2E;
  text-align:left}
.zona-aviso b{color:#4A3D18}
.zona-aviso a{color:var(--teal); font-weight:700; text-decoration:underline}
.zona-aviso svg{flex:0 0 auto; margin-top:2px; color:#D9A21B}
.center .zona-aviso{margin-left:auto; margin-right:auto; max-width:520px}

/* Enlaces legales del pie — una sola línea, discretos */
.fleg{display:inline-block;margin-top:9px;font-size:12px;opacity:.85;line-height:1.7}
.fleg a{color:inherit;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.fbot .fleg{display:block;width:100%;text-align:center}

/* ── Franja de consentimiento de cookies ─────────────────────── */
.cdck{position:fixed;left:0;right:0;bottom:0;z-index:9999;
  background:rgba(251,246,236,.97);-webkit-backdrop-filter:saturate(180%) blur(8px);
  backdrop-filter:saturate(180%) blur(8px);border-top:1px solid #EFE7D6;
  box-shadow:0 -6px 24px rgba(28,24,21,.07);font-family:'Mulish','Poppins',system-ui,sans-serif;
  transform:translateY(100%);transition:transform .28s ease}
.cdck.on{transform:translateY(0)}
.cdck-in{max-width:1240px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:16px}
.cdck-tx{flex:1;min-width:0;margin:0;font-size:12px;line-height:1.4;color:#5A5048}
.cdck-tx a{color:#159B94;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.cdck-bt{display:flex;gap:8px;flex-shrink:0}
.cdck-bt button{font-family:inherit;font-size:12px;font-weight:700;border-radius:100px;
  padding:8px 18px;cursor:pointer;white-space:nowrap;border:1px solid #EFE7D6;line-height:1.2}
.cdck-no{background:#fff;color:#1C1815}
.cdck-si{background:#159B94;border-color:#159B94;color:#fff}
.cdck-si:hover{background:#0E7A74;border-color:#0E7A74}
@media(max-width:720px){
  .cdck-in{flex-direction:column;align-items:stretch;gap:10px;padding:12px 16px}
  .cdck-bt button{flex:1;padding:10px 12px}
}