@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('fuentes/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('fuentes/inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('fuentes/inter-700.woff2') format('woff2')}

/* ==========================================================================
   ORALTECK · Laboratorio Dental Digital
   Hoja de estilos única. Orden: tokens → base → layout → componentes → responsive
   ========================================================================== */

/* 1 · TOKENS ============================================================== */
:root{
  /* Paleta oficial */
  --porcelana:#F2F2F0;  --blanco:#FFFFFF;   --bruma:#D5DCDD;
  --acero:#8FA0A4;      --pizarra:#5C7176;  --petroleo:#39494D;
  --carbon:#20292B;     --tinta:#3A3A38;    --cian:#35B6C9;
  --cian-osc:#2AA0B2;   --profundo:#20292B;
  --tx-2:rgba(58,58,56,.74); --tx-3:rgba(58,58,56,.52); --filete:rgba(58,58,56,.16);

  /* Espaciado · base 4px */
  --e1:4px;  --e2:8px;  --e3:12px; --e4:16px; --e5:20px; --e6:24px;
  --e8:32px; --e10:40px; --e12:48px; --e14:56px; --e16:64px; --e20:80px; --e24:96px;

  /* Bordes y radios */
  --b1:1px; --b2:2px; --b3:3px;
  --r1:2px; --r-pill:100px; --r-circ:50%;

  /* Tipografía */
  --fuente:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --tk-tit:-.04em; --tk-eti:.28em;
}

/* 2 · BASE ================================================================ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--fuente);font-size:15px;line-height:1.6;
  background:var(--porcelana);color:var(--tinta);-webkit-font-smoothing:antialiased}
h1,h2,h3,p,dl,dd{margin:0}
h1,h2,h3{font-weight:700;letter-spacing:var(--tk-tit);line-height:1.04}
h1{font-size:clamp(34px,4.4vw,60px)}
h2{font-size:clamp(26px,3.4vw,44px)}
h3{font-size:19px;letter-spacing:-.02em}
ul{margin:0;padding:0;list-style:none}
a{text-decoration:none;color:inherit}
img,svg{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:var(--b2) solid var(--cian);outline-offset:3px}
::selection{background:var(--cian);color:var(--carbon)}

/* 3 · LAYOUT ============================================================== */
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--e8);position:relative}
.sec,.top,.hero,.cond,.tbl,.vevi,.cta,.area,.step,.loc,.chan{display:flow-root}
.sec{padding:var(--e20) 0}
.top{padding:var(--e8) 0 var(--e6)}
.hero{padding:var(--e8) 0 var(--e12)}
.on-dark{background:var(--carbon);color:var(--porcelana);
  --tinta:var(--porcelana); --tx-2:rgba(242,242,240,.76); --tx-3:rgba(242,242,240,.54);
  --filete:rgba(242,242,240,.18); --blanco:var(--petroleo)}
.on-paper{background:var(--blanco)}

/* 4 · TIPOGRAFÍA DE APOYO ================================================= */
.eyebrow,.blk-n,.step-n,.area-n,.chan-t,.spec-l,.lst-t,.hd,.tbl-h,.side-e,.est-l,
.vevi-n,.ms-t,.k,.tally,.count,.uni,label,.dl dt{
  font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;font-weight:500;color:var(--tx-3)}
.eyebrow{display:block;margin-bottom:var(--e3)}
.hero-lead,.top p:not(.vias),.sec-h p,.area-d,.step-d,.intro{
  font-size:clamp(16px,1.4vw,19px);line-height:1.58;color:var(--pizarra);margin-top:var(--e4);max-width:46ch}
.on-dark .hero-lead,.on-dark .top p:not(.vias),.on-dark .sec-h p,.on-dark .area-d,.on-dark .step-d,.on-dark .intro{color:var(--tx-2)}
.hint,.odo-nota,.borrador,.ms-p{font-size:13px;line-height:1.6;color:var(--tx-3);margin-top:var(--e2)}
.sec-h{max-width:52ch;margin-bottom:var(--e12);padding-top:var(--e5);border-top:var(--b1) solid var(--filete)}
.sec-h h2{margin-top:var(--e3)}

/* 5 · BOTONES ============================================================= */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--e2);
  padding:var(--e3) var(--e6);border-radius:var(--r1);border:var(--b1) solid transparent;
  font-size:14px;font-weight:700;letter-spacing:-.01em;transition:background .18s,color .18s,border-color .18s}
.btn-cta,.btn-solid,.btn-inv{background:var(--cian);color:var(--carbon);border-color:var(--cian)}
.btn-cta:hover,.btn-solid:hover,.btn-inv:hover{background:var(--cian-osc);border-color:var(--cian-osc)}
.btn-vevi{background:var(--petroleo);color:var(--porcelana);border-color:var(--petroleo)}
.btn-vevi:hover{background:var(--carbon);border-color:var(--carbon)}
.btn-line{border-color:var(--tinta);color:var(--tinta)}
.btn-line:hover{background:var(--tinta);color:var(--porcelana)}
.btn-ghost,.btn-invline{border-color:rgba(242,242,240,.4);color:var(--porcelana)}
.btn-ghost:hover,.btn-invline:hover{background:var(--porcelana);color:var(--carbon)}
.on-dark .btn-vevi,.cta .btn-vevi,.vevi .btn-vevi,.foot .btn-vevi{
  background:transparent;border-color:var(--porcelana);color:var(--porcelana)}
.on-dark .btn-vevi:hover,.cta .btn-vevi:hover,.vevi .btn-vevi:hover,.foot .btn-vevi:hover{
  background:var(--porcelana);color:var(--carbon)}
.acciones,.hero-cta,.cta-b,.foot-b{display:flex;gap:var(--e3);flex-wrap:wrap;margin-top:var(--e6)}

/* 6 · CABECERA ============================================================ */
.hdr{background:var(--porcelana);border-bottom:var(--b1) solid var(--filete);position:sticky;top:0;z-index:30}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:var(--e5);padding:var(--e3) 0;position:relative}
.brand{display:flex;align-items:center;gap:var(--e3)}
.brand-tx{display:flex;flex-direction:column;justify-content:center}
.brand-nm{font-size:22px;font-weight:700;letter-spacing:var(--tk-tit);line-height:1;color:var(--carbon)}
.brand-sub{font-size:7.5px;letter-spacing:var(--tk-eti);color:var(--acero);
  margin-top:var(--e1);font-weight:500;white-space:nowrap;text-transform:uppercase}
.nav,.hdr-nav{display:flex;align-items:center;gap:var(--e6)}
.nav a:not(.btn),.hdr-nav a:not(.btn){font-size:14px;color:var(--tx-2);padding:var(--e1) 0}
.nav a:not(.btn):hover,.hdr-nav a:not(.btn):hover{color:var(--tinta)}
.nav a[aria-current="page"],.hdr-nav a[aria-current="page"]{
  color:var(--carbon);font-weight:700;box-shadow:inset 0 -3px 0 var(--cian)}
.nav a.btn,.hdr-nav a.btn{padding:var(--e2) var(--e4)}
.mnu{display:none;background:none;border:var(--b1) solid var(--acero);padding:var(--e2);border-radius:var(--r1);line-height:0}
.mnu span{display:block;width:18px;height:2px;background:var(--carbon);margin:3px 0;transition:transform .2s,opacity .2s}
.mnu[aria-expanded="true"] span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.mnu[aria-expanded="true"] span:nth-child(2){opacity:0}
.mnu[aria-expanded="true"] span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* 7 · SÍMBOLO ============================================================= */
.gem{height:clamp(260px,30vw,380px);width:auto;margin:0 auto}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--e10);align-items:center}
.gem .fc{opacity:0;animation:fc .3s ease forwards}
.gem .wl{stroke-dasharray:130;stroke-dashoffset:130;animation:trazo .28s ease forwards,ocultar .3s ease 1.05s forwards}
.gem .wv{opacity:0;transform-origin:center;animation:nodo .22s cubic-bezier(.3,1.5,.5,1) forwards,ocultar .3s ease 1.05s forwards}
.gem .oline{opacity:0;animation:borde .35s ease .95s forwards}
@keyframes fc{to{opacity:1}}
@keyframes trazo{to{stroke-dashoffset:0}}
@keyframes nodo{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
@keyframes borde{to{opacity:1}}
@keyframes ocultar{to{opacity:0}}

/* 8 · FRANJA DE DATOS ===================================================== */
.spec{border-bottom:var(--b1) solid var(--filete)}
.spec-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.spec-c{padding:var(--e6) var(--e6) var(--e6) 0;border-top:var(--b1) solid var(--filete)}
.spec-c+.spec-c{border-left:var(--b1) solid var(--filete);padding-left:var(--e6)}
.spec-v{font-size:24px;font-weight:700;line-height:1;letter-spacing:-.03em;color:var(--cian);font-variant-numeric:tabular-nums}
.spec-l{display:block;margin-top:var(--e2)}

/* 9 · ÁREAS Y PASOS ======================================================= */
.areas{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));border-top:var(--b1) solid var(--filete)}
.area{padding:var(--e6) var(--e6) var(--e6) 0;border-bottom:var(--b1) solid var(--filete)}
.area+.area{border-left:var(--b1) solid var(--filete);padding-left:var(--e6)}
.area-ic{height:28px;width:auto;margin-bottom:var(--e4)}
.area h3{font-size:16px;font-weight:700}
.area p{font-size:13.5px;line-height:1.6;color:var(--pizarra);margin-top:var(--e2)}
.area-in,.step-in{display:grid;grid-template-columns:1fr 1fr;gap:var(--e12);align-items:start}
.area-n,.step-n,.blk-n{color:var(--cian)}
.area h2,.step h2{margin-top:var(--e3);font-size:clamp(26px,3.4vw,42px)}
.step{padding:var(--e12) 0;border-top:var(--b2) solid var(--filete)}
.step:nth-of-type(odd){background:var(--blanco)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}
.jump{display:flex;gap:var(--e2);flex-wrap:wrap;margin-top:var(--e6)}
.jump a{font-size:11px;letter-spacing:.06em;padding:var(--e2) var(--e3);
  border:var(--b1) solid var(--filete);color:var(--tx-2)}
.jump a:hover{border-color:var(--tinta);color:var(--tinta)}
.plazo{display:inline-flex;align-items:baseline;gap:var(--e4);margin-top:var(--e6);
  padding:var(--e4) var(--e5);border:var(--b1) solid var(--filete)}
.plazo b{font-size:30px;font-weight:700;line-height:1;color:var(--cian);
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.det li{display:flex;gap:var(--e3);padding:var(--e3) 0;border-bottom:var(--b1) solid var(--filete);
  font-size:14.5px;line-height:1.6;color:var(--pizarra)}
.det li::before{content:'';flex:none;width:7px;height:7px;margin-top:8px;background:var(--cian)}
.req,.mark,.note,.est{padding:var(--e4) var(--e5);margin-top:var(--e5);
  background:var(--blanco);border-left:var(--b2) solid var(--cian)}
.req b,.mark b{display:block;margin-bottom:var(--e2)}
.req p,.mark p,.note{font-size:14px;line-height:1.62;color:var(--pizarra)}

/* 10 · TARJETAS DE CONDICIONES Y VEVI ===================================== */
.cond,.tbl,.vevi{padding:var(--e20) 0}
.cond-g,.vevi-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--b1);background:var(--filete);margin-top:var(--e10)}
.cond-c,.vevi-c{background:var(--carbon);padding:var(--e6);display:flex;flex-direction:column}
.vevi{background:var(--carbon);color:var(--porcelana)}
.vevi-c{background:var(--petroleo);border-top:var(--b3) solid var(--cian)}
.cond-c b,.vevi-c b{display:block;font-size:17px;font-weight:700;line-height:1.24;
  letter-spacing:-.02em;color:var(--porcelana)}
.cond-c p,.vevi-c p{font-size:14px;line-height:1.6;color:var(--acero);margin-top:var(--e3)}
.cond-c .k,.vevi-n{display:block;margin-bottom:var(--e3);color:var(--cian)}
.vevi h2,.vevi .eyebrow{color:var(--porcelana)}
.vevi .eyebrow{color:var(--acero)}
.vevi-pie{margin-top:var(--e8);padding-top:var(--e5);border-top:var(--b1) solid rgba(242,242,240,.2);
  display:flex;justify-content:space-between;gap:var(--e5);flex-wrap:wrap;align-items:center}
.vevi-pie span{font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;color:var(--acero)}

/* 11 · TABLAS Y ARANCEL =================================================== */
.tools{background:var(--blanco);border-bottom:var(--b1) solid var(--filete);
  position:sticky;top:57px;z-index:20;padding:var(--e3) 0}
.tools-in{display:flex;gap:var(--e3);align-items:center;flex-wrap:wrap}
#q{flex:1;min-width:200px}
.tabs{display:flex;gap:var(--e2);flex-wrap:wrap;padding:var(--e6) 0 0;border-bottom:var(--b1) solid var(--filete)}
.tab{font-size:14px;font-weight:500;padding:var(--e3) var(--e5);border:0;border-bottom:var(--b2) solid transparent;
  background:none;color:var(--tx-3);transition:color .16s,border-color .16s}
.tab:hover{color:var(--tinta)}
.tab[aria-pressed="true"]{color:var(--carbon);border-bottom-color:var(--cian);font-weight:700}
.tab small{display:block;font-size:10px;letter-spacing:.1em;color:var(--acero);margin-top:3px;font-weight:400}
.tab[aria-pressed="true"] small{color:var(--cian)}
.compartir{background:none;border:var(--b1) solid var(--filete);color:var(--pizarra);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;padding:var(--e2) var(--e3);white-space:nowrap;border-radius:var(--r1)}
.compartir:hover{border-color:var(--tinta);color:var(--carbon)}
.compartir.ok{background:var(--cian);border-color:var(--cian);color:var(--carbon)}
.idx{display:flex;gap:var(--e2);flex-wrap:wrap;padding:var(--e5) 0 0}
.idx a{font-size:11px;letter-spacing:.06em;padding:var(--e2) var(--e3);
  border:var(--b1) solid var(--filete);color:var(--tx-2)}
.idx a:hover{border-color:var(--tinta);color:var(--tinta)}
.sec-t{display:flex;align-items:baseline;gap:var(--e3);padding-bottom:var(--e3);border-bottom:var(--b2) solid var(--tinta)}
.sec-t h2{font-size:23px}
.hd,.it,.tbl-h,.tbl-r{display:grid;grid-template-columns:1fr 96px 128px;gap:var(--e4);
  align-items:baseline;padding:var(--e3) 0}
.hd,.tbl-h{border-bottom:var(--b2) solid var(--tinta)}
.it,.tbl-r{border-bottom:var(--b1) solid var(--filete);color:inherit;position:relative;transition:background .14s}
.it:hover{background:var(--blanco)}
.it-n,.row-n{font-size:14.5px}
.it,.tbl-r,.hd,.tbl-h,.lst li,.item,.est-v,.tot b{font-variant-numeric:tabular-nums}
.it-d,.tbl-r span:nth-child(2){text-align:right;color:var(--cian);font-variant-numeric:tabular-nums;font-size:13.5px}
.it-p{text-align:right;font-weight:500;font-variant-numeric:tabular-nums;font-size:13.5px}
.it .add{position:absolute;right:0;top:50%;transform:translateY(-50%);opacity:0;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--carbon);background:var(--cian);
  padding:var(--e2) var(--e3);font-weight:500;transition:opacity .14s;pointer-events:none}
.it:hover .add{opacity:1}
.count,.tally{margin-left:auto;white-space:nowrap}
.empty{padding:var(--e16) 0;text-align:center;color:var(--tx-3);font-size:15px;display:none}
.cond div span{display:block}

/* 12 · GALERÍA ============================================================ */
.filt{position:sticky;top:57px;z-index:20;background:var(--porcelana);
  border-bottom:var(--b1) solid var(--filete);padding:var(--e3) 0}
.filt-in{display:flex;gap:var(--e2);flex-wrap:wrap;align-items:center}
.chip{font-size:13px;font-weight:500;padding:var(--e2) var(--e4);border:var(--b1) solid var(--filete);
  background:transparent;color:var(--tx-2);border-radius:var(--r-pill);transition:all .16s}
.chip:hover{border-color:var(--tinta);color:var(--tinta)}
.chip[aria-pressed="true"]{background:var(--carbon);border-color:var(--carbon);color:var(--porcelana)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--e4);padding:var(--e8) 0 0}
.card{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--petroleo);
  border-radius:var(--r1);cursor:zoom-in}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:grayscale(1);mix-blend-mode:luminosity;opacity:.94;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.card::before{content:'';position:absolute;inset:0;background:linear-gradient(150deg,var(--petroleo),var(--acero));z-index:0}
.card img{position:relative;z-index:1}
.card:hover img,.card:focus-within img{transform:scale(1.045)}
.veil{position:absolute;inset:0;z-index:2;transition:background .3s;
  background:linear-gradient(to top,rgba(14,20,18,.94) 0%,rgba(14,20,18,.6) 34%,rgba(14,20,18,.08) 66%)}
.card:hover .veil,.card:focus-within .veil{
  background:linear-gradient(to top,rgba(14,20,18,.96) 0%,rgba(14,20,18,.82) 55%,rgba(14,20,18,.4) 100%)}
.tag{position:absolute;top:var(--e3);left:var(--e3);z-index:4;font-size:8.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--porcelana);background:rgba(14,20,18,.62);
  border:var(--b1) solid rgba(242,242,240,.24);padding:var(--e1) var(--e2);border-radius:var(--r-pill)}
.card .body{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:var(--e4)}
.card .body h3{color:var(--porcelana);font-size:17px;font-weight:700;line-height:1.22;padding-right:var(--e10)}
.card .body p{color:rgba(242,242,240,.82);font-size:13px;line-height:1.55;margin-top:var(--e2);
  max-height:0;opacity:0;overflow:hidden;transform:translateY(8px);
  transition:max-height .38s cubic-bezier(.2,.7,.3,1),opacity .3s,transform .38s cubic-bezier(.2,.7,.3,1)}
.card:hover .body p,.card:focus-within .body p{max-height:120px;opacity:1;transform:translateY(0)}
.arw{position:absolute;right:var(--e4);bottom:var(--e4);z-index:5;width:36px;height:36px;
  border-radius:var(--r-circ);background:rgba(242,242,240,.16);border:var(--b1) solid rgba(242,242,240,.34);
  display:flex;align-items:center;justify-content:center;color:var(--porcelana);font-size:15px;
  transition:background .2s,transform .2s}
.card:hover .arw{background:var(--cian);border-color:var(--cian);color:var(--carbon);transform:translateX(3px)}
.ref{position:absolute;left:var(--e3);bottom:var(--e3);z-index:6;font-size:7.5px;
  letter-spacing:.14em;color:rgba(242,242,240,.5)}
.card:hover .ref{opacity:0}
.visor{position:fixed;inset:0;z-index:90;background:rgba(20,26,28,.94);
  display:none;align-items:center;justify-content:center;padding:var(--e12)}
.visor.on{display:flex}
.visor-c{max-width:1080px;width:100%;display:grid;grid-template-columns:1.35fr .65fr;gap:var(--e8);align-items:center}
.visor-img{background:var(--petroleo);aspect-ratio:4/5;overflow:hidden;position:relative}
.visor-img::before{content:'';position:absolute;inset:0;background:linear-gradient(150deg,var(--petroleo),var(--acero))}
.visor-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);mix-blend-mode:luminosity;position:relative}
.visor-tx .tag{position:static;display:inline-block;margin-bottom:var(--e4)}
.visor-tx h3{font-size:clamp(24px,2.6vw,36px);font-weight:700;color:var(--porcelana);line-height:1.1}
.visor-tx p{font-size:16px;line-height:1.62;color:var(--bruma);margin-top:var(--e4)}
.visor-x{position:absolute;top:var(--e5);right:var(--e6);background:none;
  border:var(--b1) solid var(--acero);color:var(--porcelana);width:42px;height:42px;
  border-radius:var(--r-circ);font-size:19px;line-height:1}
.visor-x:hover{background:var(--porcelana);color:var(--carbon)}
.visor-nav{display:flex;gap:var(--e2);margin-top:var(--e6)}
.visor-nav button{background:none;border:var(--b1) solid var(--acero);color:var(--porcelana);
  padding:var(--e2) var(--e4);font-size:13px;border-radius:var(--r1)}
.visor-nav button:hover{background:var(--porcelana);color:var(--carbon)}
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--e3)}
.gal .ph{aspect-ratio:4/5}
.gal .ph:first-child{grid-column:span 2;aspect-ratio:8/5}

.img{position:relative;overflow:hidden;background:var(--petroleo);border:0;padding:0}
.img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);
  mix-blend-mode:luminosity;opacity:.92;position:relative;z-index:1}
.img::before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,var(--petroleo),var(--acero));z-index:0}
.img::after{content:'REFERENCIAL';position:absolute;left:var(--e3);bottom:var(--e3);z-index:2;
  font-size:8.5px;letter-spacing:.16em;color:var(--porcelana);background:rgba(23,29,31,.72);padding:3px 7px}
/* Testimonios · pendientes de material real, estilos listos */
.tst{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--e5)}
.tst-c{border-top:var(--b2) solid var(--tinta);padding-top:var(--e5)}
.tst-c .ph{width:56px;height:56px;border-radius:var(--r-circ);margin-bottom:var(--e3);padding:0}
.tst-c .img::after{display:none}
.tst-q{font-size:15px;line-height:1.6;color:var(--pizarra)}
.tst-n{font-size:14px;font-weight:700;margin-top:var(--e3)}
.tst-r{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--tx-3);margin-top:var(--e1)}

/* 13 · FORMULARIO ========================================================= */
input,select,textarea{font-family:inherit;font-size:14.5px;color:var(--tinta);background:var(--blanco);
  border:var(--b1) solid var(--filete);border-radius:var(--r1);padding:var(--e3);width:100%}
input::placeholder,textarea::placeholder{color:var(--tx-3)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--cian);box-shadow:0 0 0 3px rgba(53,182,201,.16)}
input.mal,select.mal{border-color:#C0562F;background:#FDF4F1}
label{display:block;margin-bottom:var(--e1)}
label.obl::after{content:" *";color:var(--cian-osc)}
.err{font-size:12.5px;color:#C0562F;margin-top:var(--e1);display:none}
.err.on{display:block}
.layout{display:grid;grid-template-columns:1fr 340px;gap:var(--e10);align-items:start;padding-bottom:var(--e20)}
.blk{border-top:var(--b2) solid var(--tinta);padding:var(--e5) 0 var(--e8)}
.blk-h{display:flex;align-items:baseline;gap:var(--e3);margin-bottom:var(--e5)}
.blk-h h2{font-size:21px}
.g1,.g2{display:grid;row-gap:var(--e4);column-gap:var(--e4)}
.g2{grid-template-columns:1fr 1fr}
.drop{border:var(--b1) dashed var(--tx-3);padding:var(--e6);text-align:center;background:var(--blanco);border-radius:var(--r1)}
.drop p{font-size:13.5px;color:var(--pizarra);margin-bottom:var(--e3)}
.drop input{border:0;background:none;width:auto}
.odo{background:var(--blanco);border:var(--b1) solid var(--filete);padding:var(--e4) var(--e3);border-radius:var(--r1)}
.arcs{display:grid;grid-template-columns:1fr 1fr;gap:var(--e4)}
.arc{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}
.mid{border-top:var(--b1) solid var(--filete);margin:var(--e2) 0}
.t{cursor:pointer;background:none;border:0;padding:2px 0;display:flex;flex-direction:column;align-items:center}
.t svg{width:100%}
.t svg path{fill:var(--porcelana);stroke:var(--acero);stroke-width:2;stroke-linejoin:round}
.t:hover svg path{fill:var(--bruma)}
.t.on svg path{fill:var(--cian);stroke:var(--cian-osc)}
.t b{font-size:9.5px;font-weight:400;color:var(--tx-3);margin-top:3px;font-variant-numeric:tabular-nums}
.t.on b{color:var(--tinta);font-weight:500}
.lower{flex-direction:column-reverse}
.lower svg{transform:scaleY(-1)}
.odo-f{display:flex;justify-content:space-between;align-items:center;gap:var(--e3);margin-top:var(--e3);flex-wrap:wrap}
.odo-f span{font-size:13px;color:var(--pizarra)}
.odo-f b{font-weight:500;color:var(--tinta);font-variant-numeric:tabular-nums}
.ata{display:flex;gap:var(--e2);flex-wrap:wrap;margin-bottom:var(--e3)}
.ata button{font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:var(--e2) var(--e3);
  border:var(--b1) solid var(--filete);background:var(--blanco);color:var(--pizarra);
  font-weight:500;border-radius:var(--r1)}
.ata button:hover{border-color:var(--petroleo);color:var(--carbon)}
.est{display:none}
.est-g{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
.est-v{font-size:22px;font-weight:700;margin-top:var(--e1);line-height:1;font-variant-numeric:tabular-nums}
.est-n{font-size:12.5px;line-height:1.6;color:var(--pizarra);margin-top:var(--e3)}
.uni{display:inline-block;padding:var(--e1) var(--e2);background:var(--bruma);
  color:var(--petroleo);margin-bottom:var(--e3);border-radius:var(--r1)}
.cant-w{display:none;margin-top:var(--e3)}
.cant-w.on{display:block}
.odo-off{opacity:.42;pointer-events:none}
.side{position:sticky;top:var(--e20);background:var(--carbon);color:var(--porcelana);padding:var(--e6);border-radius:var(--r1)}
.side h3{margin-top:var(--e2);color:var(--porcelana)}
.side-e{color:rgba(242,242,240,.5)}
.item{border-top:var(--b1) solid rgba(242,242,240,.18);padding:var(--e3) 0;
  display:flex;justify-content:space-between;gap:var(--e3)}
.item h4{font-size:14px;font-weight:700;margin:0;line-height:1.35}
.item p{font-size:10.5px;color:rgba(242,242,240,.6);margin-top:var(--e1);line-height:1.55}
.item-r{text-align:right;white-space:nowrap}
.item-v{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums}
.item-acc{display:flex;gap:var(--e2);justify-content:flex-end;margin-top:var(--e1)}
.item-acc button,.del{background:none;border:0;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(242,242,240,.6);padding:2px 0}
.item-acc button:hover,.del:hover{color:var(--cian)}
.side .empty{display:block;font-size:13.5px;color:rgba(242,242,240,.55);line-height:1.6;padding:var(--e4) 0;text-align:left}
.tot{border-top:var(--b2) solid rgba(242,242,240,.35);margin-top:var(--e3);
  padding-top:var(--e4);display:flex;justify-content:space-between;align-items:baseline}
.tot span{font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;color:rgba(242,242,240,.55)}
.tot b{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums}
.side small{display:block;font-size:10px;line-height:1.7;color:rgba(242,242,240,.5);margin-top:var(--e3);letter-spacing:.03em}
.aviso.on{transform:translateX(-50%) translateY(0)}

.aviso{position:fixed;left:50%;transform:translateX(-50%) translateY(90px);bottom:var(--e5);z-index:60;
  background:var(--carbon);color:var(--porcelana);padding:var(--e3) var(--e5);font-size:14px;font-weight:500;
  box-shadow:0 4px 18px rgba(32,41,43,.3);transition:transform .28s cubic-bezier(.2,.9,.3,1);
  pointer-events:none;border-radius:var(--r1)}
.aviso.on{transform:translateX(-50%) translateY(0)}
.aviso b{color:var(--cian);font-weight:500}

/* 14 · CONTACTO Y PREGUNTAS =============================================== */
.chan-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));border-top:var(--b1) solid var(--filete)}
.chan-c{padding:var(--e6) var(--e6) var(--e6) 0;border-bottom:var(--b1) solid var(--filete)}
.chan-c+.chan-c{border-left:var(--b1) solid var(--filete);padding-left:var(--e6)}
.chan-c h2{font-size:19px;margin-top:var(--e3)}
.chan-c p{font-size:14px;line-height:1.6;color:var(--pizarra);margin-top:var(--e2)}
.link{display:inline-block;margin-top:var(--e3);font-size:12.5px;
  border-bottom:var(--b1) solid var(--cian);padding-bottom:2px;word-break:break-all}
.link:hover{border-color:var(--tinta)}
.loc-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--e12);align-items:start}
.dl dt{padding-top:var(--e4)}
.dl dd{margin-top:var(--e1);font-size:15.5px;line-height:1.6;padding-bottom:var(--e4);
  border-bottom:var(--b1) solid var(--filete)}
.map{aspect-ratio:4/3;border:var(--b1) solid var(--filete);overflow:hidden;background:var(--blanco)}
.map iframe{width:100%;height:100%;border:0}
.faq details{border-bottom:var(--b1) solid var(--filete)}
.faq summary{list-style:none;cursor:pointer;padding:var(--e5) 0;font-size:16px;font-weight:700;
  display:flex;justify-content:space-between;gap:var(--e4);align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:20px;color:var(--tx-3);flex:none}
.faq details[open] summary::after{content:'\2212'}
.faq p{padding:0 0 var(--e5);font-size:15px;line-height:1.68;color:var(--pizarra);max-width:78ch}
.todo{border:var(--b1) dashed var(--tx-3);padding:var(--e12) var(--e8);text-align:center}
.todo p{max-width:46ch;margin:var(--e3) auto 0;font-size:15.5px;line-height:1.66;color:var(--pizarra)}

/* 15 · CIERRE Y PIE ======================================================= */
.cta{background:var(--profundo);color:var(--porcelana);text-align:center;padding:var(--e24) 0}
.cta h2{color:var(--porcelana)}
.cta p{font-size:17px;color:rgba(242,242,240,.72);margin:var(--e3) auto 0;max-width:52ch;line-height:1.6}
.cta-b{justify-content:center}
.mapa-sitio{background:var(--carbon);padding:var(--e14) 0 var(--e10);border-top:var(--b1) solid rgba(242,242,240,.14)}
.ms-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--e8)}
.ms-t{display:block;color:var(--cian);margin-bottom:var(--e4)}
.mapa-sitio a{display:block;font-size:14px;color:var(--bruma);padding:var(--e1) 0;line-height:1.4}
.mapa-sitio a:hover{color:var(--blanco)}
.ms-p{font-size:14px;color:var(--acero);line-height:1.6}
.foot,.ft{background:var(--profundo);padding:var(--e10) 0}
.foot h2{color:var(--porcelana)}
.foot p{color:rgba(242,242,240,.7);font-size:15.5px;line-height:1.65;margin-top:var(--e3);max-width:48ch}
.foot-in,.ft-in,.foot-l{display:flex;justify-content:space-between;gap:var(--e6);flex-wrap:wrap}
.foot-in p,.ft-in p,.foot-l p,.foot-in a,.ft-in a,.foot-l a{
  font-size:11px;line-height:1.9;color:rgba(242,242,240,.56);letter-spacing:.04em}
.foot-in a:hover,.ft-in a:hover,.foot-l a:hover{color:var(--porcelana)}
.up{position:fixed;right:var(--e5);bottom:var(--e5);z-index:40;width:44px;height:44px;
  border-radius:var(--r-circ);background:var(--petroleo);color:var(--porcelana);border:0;font-size:17px;
  line-height:1;opacity:0;pointer-events:none;transition:opacity .2s;box-shadow:0 2px 10px rgba(32,41,43,.24)}
.up.on{opacity:1;pointer-events:auto}
.up:hover{background:var(--carbon)}

/* 15b · AGREGADOS 2026-09 ================================================= */

/* Unidad de cobro junto al nombre de la prestacion */
.est-g3{grid-template-columns:repeat(3,1fr)}
.est-v2{color:var(--pizarra);font-weight:500}
.est-c{margin-top:var(--e3);padding-top:var(--e3);border-top:var(--b1) solid var(--filete);
  font-size:13px;line-height:1.55;color:var(--pizarra);font-variant-numeric:tabular-nums}
.est-nom{font-size:15px;font-weight:700;line-height:1.3;color:var(--tinta);margin-bottom:var(--e2)}
.it-u{font-style:normal;font-size:11px;letter-spacing:.02em;color:var(--acero);white-space:nowrap}

/* Condiciones operativas: titulo al costado, sin celdas vacias */
.cond-lay{display:grid;grid-template-columns:minmax(230px,320px) 1fr;gap:var(--e10)}
.cond-lay .cond-g{grid-template-columns:repeat(2,1fr);gap:0;background:transparent;margin-top:0;
  border-top:var(--b1) solid var(--filete)}
.cond-lay .cond-c{background:transparent;padding:var(--e5) var(--e6) var(--e5) 0;
  border-bottom:var(--b1) solid var(--filete)}

/* 16 · RESPONSIVE ========================================================= */
@media(max-width:1100px){
}
@media(max-width:1000px){
  .cond-lay{grid-template-columns:1fr;gap:var(--e8)}
  .pago-lay{grid-template-columns:1fr;gap:var(--e8)}
  .dif-g,.testi-g{grid-template-columns:1fr}
  .testi-c,.testi-c+.testi-c{padding:var(--e6) 0;border-left:0}
  .vevi .vevi-g{grid-template-columns:repeat(2,1fr)}
  .vevi-b-in{flex-direction:column;align-items:flex-start}
  .dif-c,.dif-c+.dif-c{padding:var(--e6) 0;border-left:0}
}

@media(max-width:600px){
  .cond-lay .cond-g{grid-template-columns:1fr}
  .vevi .vevi-g{grid-template-columns:1fr}
  .hero-areas li{font-size:10px}
  .hero-areas li:not(:last-child)::after{margin:0 var(--e2)}
}
@media(max-width:980px){
  .layout{grid-template-columns:1fr;gap:var(--e6)}
  .side{position:static}
}
@media(max-width:860px){
  .hero-in,.area-in,.step-in,.loc-in,.visor-c{grid-template-columns:1fr;gap:var(--e8)}
  .gem{order:-1;height:190px}
  .sec{padding:var(--e14) 0}
  .cond,.tbl,.vevi{padding:var(--e14) 0}
}
/* El menu pasa a hamburguesa antes que el resto: con ocho pestanas la
   cabecera se parte en dos lineas bajo los 1000 px. */
@media(max-width:999px){
  .mnu{display:block}
  .nav,.hdr-nav{position:absolute;left:0;right:0;top:100%;background:var(--blanco);
    border-bottom:var(--b1) solid var(--filete);flex-direction:column;align-items:stretch;
    gap:0;padding:var(--e2) var(--e5) var(--e4);display:none;z-index:50;
    box-shadow:0 10px 24px rgba(32,41,43,.10)}
  .nav.abierto,.hdr-nav.abierto{display:flex}
  .nav a:not(.btn),.hdr-nav a:not(.btn){padding:var(--e3) 0;
    border-bottom:var(--b1) solid var(--filete)}
  .nav a.btn,.hdr-nav a.btn{margin-top:var(--e3);text-align:center}
}
@media(max-width:760px){
  .wrap{padding:0 var(--e5)}
  /* En celular la barra deja solo los iconos, para que quepan los tres */
  .barra-in{justify-content:center;gap:var(--e4);height:32px}
  .barra a{font-size:11px}
  .barra a+a{padding-left:var(--e4)}
  .wa{width:52px;height:52px;right:var(--e4);bottom:var(--e4)}
  .wa svg{width:26px;height:26px}
  .up{bottom:calc(var(--e4) + 58px);width:40px;height:40px}
  .nav,.hdr-nav{position:absolute;left:0;right:0;top:100%;background:var(--blanco);
    border-bottom:var(--b1) solid var(--filete);flex-direction:column;align-items:stretch;
    gap:0;padding:var(--e2) var(--e5) var(--e4);display:none}
  .nav.abierto,.hdr-nav.abierto{display:flex}
  .nav a:not(.btn),.hdr-nav a:not(.btn){padding:var(--e3) 0;
    border-bottom:var(--b1) solid var(--filete);font-size:15px}
  .nav a.btn,.hdr-nav a.btn{margin-top:var(--e3)}
  .g2,.est-g,.areas{grid-template-columns:1fr}
  .spec-in{grid-template-columns:repeat(2,1fr)}
  .spec-c+.spec-c,.area+.area,.chan-c+.chan-c{border-left:0;padding-left:0}
  .spec-c,.chan-c,.area{padding-right:0}
  .grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--e3)}
  .gal .ph:first-child{grid-column:span 1;aspect-ratio:4/5}
  .hd,.it,.tbl-h,.tbl-r{grid-template-columns:1fr 72px 96px;gap:var(--e2)}
  .it .add,.arw{display:none}
  .card .body p{max-height:0;opacity:0}
  .visor{padding:var(--e5)}
  .visor-img{aspect-ratio:16/10}
  .brand-nm{font-size:19px}
  .top,.hero{padding:var(--e6) 0 var(--e5)}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .gem .fc,.gem .oline{opacity:1}
  .gem .wl,.gem .wv{opacity:0}
}
@media print{
  .hdr,.tools,.tabs,.idx,.foot,.ft,.up,.mnu,.acciones,.compartir,.mapa-sitio,.cta{display:none}
  body{background:#fff;color:#000;font-size:10.5pt}
  .top{background:#fff;color:#000;padding:0}
  .top h1{font-size:24pt;color:#000}
  .top p{color:#333}
  .cond div{background:#fff;color:#000;padding:8pt}
  .sec{page-break-inside:avoid;padding-top:14pt}
  .sec-t{border-bottom:1.5pt solid #000}
  .sec-t h2{font-size:13pt}
  .it{border-bottom:.5pt solid #ccc;page-break-inside:avoid}
  .it-d,.it-p{color:#000}
  .it .add,.empty{display:none}
  a{color:#000}
}

/* 17 · AJUSTES FINALES ==================================================== */
.step-c{padding:var(--e6) var(--e5) var(--e6) 0;border-top:var(--b2) solid var(--tinta)}
.step-c h3{margin-top:var(--e2);font-size:15px;font-weight:700;line-height:1.35}
.step-c p{font-size:13px;line-height:1.58;color:var(--pizarra);margin-top:var(--e2)}
.step-c .step-n{color:var(--cian);margin-bottom:var(--e2)}
.areas a{display:block;color:inherit}
.areas a:hover h3{color:var(--cian)}
.gal .img{border:0;padding:0}

.tst-c .ph{border:0}
.plazo span{color:var(--tx-3)}
.dl dd:last-of-type{border-bottom:0}
.chan-c .eyebrow{margin-bottom:0}
.req .eyebrow{display:block;margin-bottom:var(--e2)}

/* Rótulo que enmarca las dos vías de pedido */
p.vias{font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;font-weight:500;
  color:var(--tx-3);margin-top:var(--e6);margin-bottom:calc(var(--e2) * -1)}
.cta p.vias,.on-dark p.vias{color:rgba(242,242,240,.6)}
.cta p.vias{margin-top:var(--e6);margin-bottom:0}

/* Condiciones del arancel sobre fondo claro */
/* Como trabajamos · VEVI en petroleo para separarse del bloque anterior */
.vevi{background:var(--petroleo)}
.vevi .vevi-c{background:var(--carbon)}
.vevi .vevi-g{grid-template-columns:repeat(3,1fr)}
.vevi .sec-h p,.vevi>.wrap>p{color:var(--bruma)}

/* Como trabajamos · tabla de plazos centrada y compacta */
.tbl .tbl-h,.tbl .tbl-r{grid-template-columns:1fr 92px 168px;max-width:600px;
  margin-left:auto;margin-right:auto}
.tbl .sec-h{text-align:center;max-width:600px;margin-left:auto;margin-right:auto}
.tbl .tbl-r span:last-child,.tbl .tbl-h span:last-child{text-align:right}

/* Enviar pedido · franja VEVI sobre el formulario */
.vevi-b{background:var(--carbon);color:var(--porcelana);
  border-bottom:var(--b3) solid var(--cian)}
.vevi-b-in{display:flex;align-items:center;justify-content:space-between;
  gap:var(--e6);padding:var(--e5) 0}
.vevi-b p{font-size:14px;line-height:1.6;color:var(--bruma);max-width:74ch}
.vevi-b b{color:var(--porcelana);font-weight:700}

/* Boton para vaciar el formulario completo */
.btn-limpiar{display:block;width:100%;margin-top:var(--e3);padding:var(--e3);
  background:none;border:var(--b1) solid rgba(242,242,240,.22);color:var(--acero);
  font:500 12px/1 Inter,Arial,sans-serif;letter-spacing:var(--tk-eti);
  text-transform:uppercase;cursor:pointer;transition:color .16s,border-color .16s}
.btn-limpiar:hover{color:var(--porcelana);border-color:rgba(242,242,240,.45)}
.aside small a{color:var(--acero);text-decoration:underline;text-underline-offset:2px}
.aside small a:hover{color:var(--cian)}

/* Testimonios · seccion oculta hasta tener reales */
.testi[hidden]{display:none}
.testi{background:var(--blanco)}
.testi-g{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:var(--b1) solid var(--filete)}
.testi-c{margin:0;padding:var(--e8) var(--e6) var(--e6) 0;
  border-bottom:var(--b1) solid var(--filete)}
.testi-c+.testi-c{padding-left:var(--e6);border-left:var(--b1) solid var(--filete)}
.testi-c blockquote{margin:0;font-size:15.5px;line-height:1.68;color:var(--pizarra)}
.testi-c blockquote::before{content:"\201C";display:block;font-size:34px;line-height:.6;
  color:var(--cian);margin-bottom:var(--e3)}
.testi-c figcaption{margin-top:var(--e5);padding-top:var(--e4);
  border-top:var(--b1) solid var(--filete)}
.testi-c figcaption b{display:block;font-size:14px;font-weight:700;color:var(--tinta)}
.testi-c figcaption span{display:block;margin-top:2px;font-size:10px;
  letter-spacing:var(--tk-eti);text-transform:uppercase;color:var(--acero);font-weight:500}

/* Barra de accesos directos, sobre la cabecera */
.barra{background:var(--carbon);color:var(--bruma)}
.barra-in{display:flex;justify-content:flex-end;align-items:center;gap:var(--e5);
  height:34px}
.barra a{display:inline-flex;align-items:center;gap:var(--e2);font-size:11.5px;
  letter-spacing:.04em;font-weight:500;color:var(--bruma);white-space:nowrap;
  transition:color .16s}
.barra a:hover{color:var(--cian)}
.barra svg{width:13px;height:13px;max-width:13px;max-height:13px;
  fill:currentColor;flex:none}
.barra a+a{padding-left:var(--e5);border-left:var(--b1) solid rgba(242,242,240,.16)}

/* Boton flotante de WhatsApp */
.wa{position:fixed;right:var(--e5);bottom:var(--e5);z-index:45;
  width:54px;height:54px;border-radius:var(--r-circ);background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 16px rgba(32,41,43,.28);transition:transform .18s,box-shadow .18s}
.wa svg{width:30px;height:30px;max-width:30px;max-height:30px;fill:#FFFFFF}
.wa:hover{transform:scale(1.06);box-shadow:0 6px 22px rgba(32,41,43,.34)}
/* El boton de subir se apila encima, para que no se pisen */
.up{bottom:calc(var(--e5) + 64px)}

/* Pago en linea */
.pago-lay{display:grid;grid-template-columns:1fr minmax(280px,360px);gap:var(--e10);
  align-items:start}
.pago-f{background:var(--blanco);padding:var(--e8);border-top:var(--b3) solid var(--cian)}
.pago-m{display:flex;align-items:center;gap:var(--e2);background:var(--porcelana);
  border:var(--b1) solid var(--filete);padding:0 var(--e4)}
.pago-m span{font-size:22px;font-weight:700;color:var(--acero)}
.pago-m input{border:0;background:none;font-size:26px;font-weight:700;letter-spacing:-.02em;
  color:var(--tinta);padding:var(--e3) 0;width:100%;font-variant-numeric:tabular-nums}
.pago-m input:focus{outline:0}
.pago-btn{width:100%;margin-top:var(--e6);font-size:15px;padding:var(--e4)}
.pago-btn:disabled{opacity:.6;cursor:default}
.pago-legal{margin-top:var(--e4);font-size:12px;line-height:1.6;color:var(--acero)}
.pago-err{background:#FDF4F1;border-left:var(--b3) solid #C0562F;color:#8C3D20;
  font-size:13.5px;line-height:1.55;padding:var(--e4);margin-bottom:var(--e5)}
.pago-a h2{font-size:15px;font-weight:700;color:var(--tinta);letter-spacing:-.01em}
.pago-l{list-style:none;margin-top:var(--e4);border-top:var(--b1) solid var(--filete)}
.pago-l li{font-size:13.5px;line-height:1.6;color:var(--pizarra);padding:var(--e4) 0;
  border-bottom:var(--b1) solid var(--filete)}
.pago-l b{display:block;font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;
  color:var(--acero);font-weight:500;margin-bottom:var(--e2)}
.pago-tbk{margin-top:var(--e6);padding:var(--e5);background:var(--carbon);color:var(--bruma)}
.pago-tbk span{display:block;font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase}
.pago-tbk b{display:block;margin-top:var(--e2);font-size:15px;color:var(--porcelana)}

/* Comprobante de pago */
.comp{max-width:620px}
.comp-c{background:var(--blanco);padding:var(--e10) var(--e8) var(--e8);
  border-top:var(--b3) solid var(--cian)}
.comp-c h1{font-size:29px;font-weight:700;letter-spacing:-.03em;line-height:1.1;
  margin-top:var(--e3);color:var(--tinta)}
.comp-t{font-size:15px;line-height:1.66;color:var(--pizarra);margin-top:var(--e4)}
.comp-tb{width:100%;border-collapse:collapse;margin-top:var(--e6);
  border-top:var(--b1) solid var(--filete)}
.comp-tb td{font-size:14px;padding:var(--e3) 0;border-bottom:var(--b1) solid var(--filete);
  color:var(--tinta)}
.comp-tb td:first-child{color:var(--acero);font-size:12px;letter-spacing:.02em}
.comp-tb td:last-child{text-align:right;font-variant-numeric:tabular-nums}
.comp-l{list-style:none;margin-top:var(--e5);border-top:var(--b1) solid var(--filete)}
.comp-l li{font-size:13.5px;line-height:1.6;color:var(--pizarra);padding:var(--e3) 0 var(--e3) var(--e5);
  border-bottom:var(--b1) solid var(--filete);position:relative}
.comp-l li::before{content:"";position:absolute;left:0;top:13px;width:5px;height:5px;
  background:var(--acero)}
.comp-n{margin-top:var(--e5);font-size:12px;color:var(--acero)}
.comp-b{display:flex;gap:var(--e3);flex-wrap:wrap;margin-top:var(--e8)}
.ft-min{background:var(--carbon);color:var(--acero);padding:var(--e8) 0}
.ft-min p{font-size:12px;line-height:1.7}

/* Politica de privacidad */
.priv{max-width:74ch}
.priv h2{font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--tinta);
  margin-top:var(--e8);padding-top:var(--e5);border-top:var(--b1) solid var(--filete)}
.priv h2:first-child{margin-top:0;padding-top:0;border-top:0}
.priv p{font-size:15px;line-height:1.72;color:var(--pizarra);margin-top:var(--e4)}
.priv b{color:var(--tinta);font-weight:700}
.priv a{color:var(--cian-osc);text-decoration:underline;text-underline-offset:2px}
.priv-l{list-style:none;margin-top:var(--e4)}
.priv-l li{font-size:15px;line-height:1.72;color:var(--pizarra);
  padding:var(--e3) 0 var(--e3) var(--e5);border-bottom:var(--b1) solid var(--filete);
  position:relative}
.priv-l li::before{content:"";position:absolute;left:0;top:14px;width:5px;height:5px;
  background:var(--cian)}
.priv-c{margin-top:var(--e8);padding:var(--e5);background:var(--blanco);
  border-left:var(--b3) solid var(--cian)}
.priv-c p{margin:0;font-size:14px}

/* Arancel · pista de que las filas son clicables */
.arn-pista{font-size:13px;line-height:1.6;color:var(--acero);margin:var(--e6) 0 var(--e2);
  padding-left:var(--e4);border-left:var(--b3) solid var(--cian)}

/* Inicio · areas del hero y tres atributos diferenciadores */
.hero-areas{list-style:none;display:flex;flex-wrap:wrap;margin-top:var(--e5);
  padding-top:var(--e4);border-top:var(--b1) solid var(--filete)}
.hero-areas li{font-size:13.5px;font-weight:500;color:var(--pizarra);white-space:nowrap}
.hero-areas li:not(:last-child)::after{content:"·";margin:0 var(--e3);color:var(--acero)}
.dif-s{background:var(--blanco)}
.dif-g{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:var(--b1) solid var(--filete)}
.dif-c{padding:var(--e8) var(--e8) var(--e8) 0;border-bottom:var(--b1) solid var(--filete)}
.dif-c+.dif-c{padding-left:var(--e8);border-left:var(--b1) solid var(--filete)}
.dif-n{display:block;font-size:11px;letter-spacing:var(--tk-eti);font-weight:700;
  color:var(--cian);margin-bottom:var(--e4)}
.dif-c h2{font-size:21px;font-weight:700;line-height:1.2;letter-spacing:-.025em;
  color:var(--tinta)}
.dif-c p{font-size:14.5px;line-height:1.66;color:var(--pizarra);margin-top:var(--e4)}

/* Bloque de condiciones del arancel. Clases propias: no comparte nada con las
   condiciones operativas de "Como trabajamos" para que no se afecten entre si. */
.arn-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--b1);background:var(--filete);margin-top:var(--e10)}
.arn-c{background:var(--blanco);padding:var(--e6);display:flex;flex-direction:column}
.arn-c b{display:block;font-size:17px;font-weight:700;line-height:1.24;
  letter-spacing:-.02em;color:var(--tinta)}
.arn-c p{font-size:14px;line-height:1.6;color:var(--pizarra);margin-top:var(--e3)}
/* Las viñetas de la vía VEVI, centradas en su bloque */
.vias-lista{align-self:center}
/* Nota del resumen, legible */
.side small{color:rgba(242,242,240,.78)}
.borrador{color:rgba(242,242,240,.7)}

/* Prueba sobre el pliegue */
.hero-prueba{display:flex;gap:var(--e8);flex-wrap:wrap;margin-top:var(--e6);
  padding-top:var(--e5);border-top:var(--b1) solid var(--filete)}
.hero-prueba li{display:flex;flex-direction:column}
.hero-prueba b{font-size:clamp(26px,2.6vw,36px);font-weight:700;line-height:1;
  letter-spacing:-.03em;color:var(--cian);font-variant-numeric:tabular-nums}
.hero-prueba span{font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;
  font-weight:500;color:var(--tx-3);margin-top:var(--e2)}
.hero h1{max-width:19ch;line-height:1.02}
@media(max-width:760px){.hero-prueba{gap:var(--e5)}}

/* Política de garantías */
.gar-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--b1);
  background:var(--filete);border:var(--b1) solid var(--filete)}
.gar-c{background:var(--blanco);padding:var(--e6)}
.gar-c b{display:block;font-size:clamp(30px,3.4vw,44px);font-weight:700;line-height:1;
  letter-spacing:-.03em;color:var(--cian);font-variant-numeric:tabular-nums}
.gar-c span{display:block;font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;
  font-weight:500;color:var(--tx-3);margin-top:var(--e2)}
.gar-c p{font-size:13.5px;line-height:1.6;color:var(--pizarra);margin-top:var(--e3)}
.gar-in{display:grid;grid-template-columns:1fr 1fr;gap:var(--e10);margin-top:var(--e10);align-items:start}
.gar-nota{background:var(--blanco);border-left:var(--b2) solid var(--cian);padding:var(--e5) var(--e6)}
.gar-nota p:not(.chan-t){font-size:14.5px;line-height:1.65;color:var(--pizarra)}
@media(max-width:820px){.gar-in{grid-template-columns:1fr;gap:var(--e6)}}

/* Dos formas de enviar el pedido, en paralelo */
.ramas{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6);align-items:stretch}
@media(max-width:820px){.ramas{grid-template-columns:1fr}}

/* Fotografías propias: a color, sin tratamiento */
.img.real img,.card img{filter:none;mix-blend-mode:normal;opacity:1}
.img.real::before,.img.real::after{display:none}
.img.real{border:0;padding:0;background:var(--carbon)}
.cond-img.real{padding:0;overflow:hidden}
.cond-img.real img{width:100%;height:100%;object-fit:cover;display:block}
.card::before{display:none}
.visor-img::before{display:none}
.visor-img img{filter:none;mix-blend-mode:normal}

/* La galería de la portada usa el mismo comportamiento que las tarjetas */
.gal{gap:var(--e4)}
.gal .card{aspect-ratio:4/5;cursor:default}
.gal .card:first-child{grid-column:span 2;aspect-ratio:8/5}
.gal .card:hover img{transform:scale(1.045)}
.gal .card .body p{max-height:0;opacity:0}
.gal .card:hover .body p,.gal .card:focus-within .body p{max-height:120px;opacity:1;transform:translateY(0)}

/* 2 · aire entre la galería y el bloque de cierre */
.grid{padding-bottom:var(--e20)}

/* La celda de imagen de condiciones ya no se usa */
@media(max-width:760px){.gal .card:first-child{grid-column:span 1;aspect-ratio:4/5}}

/* Resultado en boca */
.sonrisas{padding:var(--e20) 0}
.son-ad{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6)}
.son-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--e6);margin-top:var(--e6)}
.son-f{margin:0;background:var(--petroleo);border-radius:var(--r1);overflow:hidden}
.son-f img{width:100%;height:auto;display:block}
.son-g .son-f img{aspect-ratio:16/9;object-fit:cover}
.son-f figcaption{padding:var(--e4) var(--e5);font-size:13.5px;line-height:1.6;color:var(--bruma)}
.son-t{display:block;font-size:10px;letter-spacing:var(--tk-eti);text-transform:uppercase;
  font-weight:500;color:var(--cian);margin-bottom:var(--e2)}
.son-pie{font-size:12px;color:var(--acero);margin-top:var(--e6);letter-spacing:.02em}
@media(max-width:820px){.son-ad{grid-template-columns:1fr}}

/* Antes y después: imagen y texto equilibrados */
.son-ad{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6);align-items:stretch}
.son-ad-f{margin:0;background:var(--petroleo);border-radius:var(--r1);overflow:hidden;
  display:grid;grid-template-rows:auto 1fr}
.son-ad-f img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.son-ad-f figcaption{padding:var(--e5) var(--e6) var(--e6);display:flex;flex-direction:column;justify-content:center}
.son-ad-f h3{font-size:19px;font-weight:700;color:var(--porcelana);letter-spacing:-.02em;
  line-height:1.25;margin-top:var(--e2)}
.son-ad-f p{font-size:14px;line-height:1.62;color:var(--acero);margin-top:var(--e3)}
@media(max-width:820px){.son-ad{grid-template-columns:1fr}}

/* ═══ OLA 1 · correcciones de la auditoria ═══════════════════════════════
   Bloque agregado al final para que sobrescriba lo anterior sin tocar
   las reglas originales. Cada seccion indica el ID del hallazgo. */

/* MOB-01 · Desborde horizontal en movil.
   Causa: los hijos directos de un grid conservan min-width:auto y no se
   encogen por debajo de su contenido, desbordando el contenedor.
   Afecta a enviar-pedido (main), pagar (aside) y como-trabajamos (vevi-c). */
.layout > *, .pago-lay > *, .cond-lay > *, .vevi-g > *, .dif-g > *,
.areas > *, .chan-g > *, .loc-in > *, .hero-in > * { min-width: 0 }
main, aside { min-width: 0 }

/* MOB-03 · Areas tactiles bajo el minimo de 44px (WCAG 2.5.5). */
@media (max-width: 999px) {
  .mnu { width: 44px; height: 44px; display: flex; align-items: center;
         justify-content: center; flex-direction: column }
  .nav a:not(.btn), .hdr-nav a:not(.btn) { min-height: 44px; display: flex;
         align-items: center }
  .barra-in { height: auto }
  .barra a { min-height: 44px; padding-top: var(--e2); padding-bottom: var(--e2) }
}

/* MOB-02 · Auto-zoom de iOS: Safari hace zoom si el campo baja de 16px. */
@media (max-width: 999px) {
  input, select, textarea, .pago-m input { font-size: 16px }
}

/* MOB-04 · Los botones flotantes tapaban controles al final de la pagina. */
body { padding-bottom: 0 }
.sec:last-of-type, .tbl, .cta, .mapa-sitio { scroll-margin-bottom: 90px }
@media (max-width: 760px) {
  .foot, .mapa-sitio { padding-bottom: 96px }
}

/* ACC-01 a ACC-07 · Contraste bajo el minimo AA (WCAG 2.2).
   No se corrige selector por selector, sino redefiniendo los tokens de
   color de texto segun el contexto. Asi cada regla existente que usa
   var(--acero) o var(--pizarra) toma automaticamente el valor que cumple
   sobre el fondo en que esta.
   Ratios medidos: sobre porcelana #F2F2F0 y sobre carbon #20292B. */

:root {
  --acero:   #4A5D62;   /* 6,18:1 sobre porcelana  (antes 2,42) */
  --pizarra: #41504F;   /* 7,54:1 sobre porcelana  (antes 4,23) */
  --cian-txt:#1B6F7C;   /* 5,19:1 sobre porcelana  (el cian da 2,16) */
  --tx-2:    #41504F;
  --tx-3:    #4A5D62;
}

/* En superficie oscura los mismos tokens toman su version clara. */
.on-dark, .vevi, .cond, .side, .barra, .cta, .foot, .ft, .ft-min,
.mapa-sitio, .vevi-b, .pn-k, .pago-tbk, .info-p.on-dark {
  --acero:   #BBC7C9;   /* 8,58:1 sobre carbon */
  --pizarra: #D5DCDD;   /* 10,69:1 sobre carbon */
  --cian-txt:#35B6C9;   /* 6,15:1 sobre carbon */
  --tx-2:    #D5DCDD;
  --tx-3:    #BBC7C9;
}

/* El cian queda para superficie y para texto grande; cuando lleva texto
   pequeno sobre fondo claro, se usa la variante legible. */
.it-d, .blk-n, .dif-n, .step-n, .arn-pista, .link, .son-t,
.cons a, .priv a, .est-nom + .uni { color: var(--cian-txt) }
.spec-v, .hero-prueba b, .pn-k .cian { color: var(--cian-osc) }
.arw { color: var(--acero) }          /* estaba blanco sobre blanco */

/* Reglas que ganaban por especificidad u orden y seguian en cian claro. */
.step-c .step-n, .area-n, .step-n, .blk-n { color: var(--cian-txt) }
.tab[aria-pressed="true"] small { color: var(--cian-txt) }
.son-f .son-t, .son-t { color: var(--cian-txt) }
.it-d, .tbl-r span:nth-child(2) { color: var(--cian-txt) }
/* Texto grande: le basta 3:1, pero el cian claro da 2,42. */
.spec-v, .hero-prueba b, .gar-p b, .tot b { color: var(--cian-osc) }
/* Sobre fondo oscuro, esas mismas piezas vuelven al cian de marca. */
.on-dark .step-n, .on-dark .blk-n, .on-dark .area-n, .side .tot b,
.vevi .vevi-n, .cond .k { color: var(--cian) }

/* Ultimos cuatro: cifras grandes de garantia y el rotulo de la galeria.
   Necesitan 3:1 y el cian claro da 2,42; el oscuro da 2,77. */
.gar-c b, .gar-g b, .gar-t b, b.gar-v { color: var(--cian-txt) }
/* El rotulo de la galeria va sobre fondo oscuro. Sobre petroleo el cian
   da 3,89:1 y a 10px hacen falta 4,5. En vez de cambiar el color de marca,
   se oscurece el pie de foto a carbon, donde el cian llega a 6,15:1. */
.son-f .son-t, figcaption .son-t, .son-t { color: var(--cian) }
.son-f figcaption, .son-ad-f figcaption { background: var(--carbon) }
.son-f, .son-ad-f { background: var(--carbon) }
.spec-v, .hero-prueba b { color: var(--cian-txt) }
/* Cifras de la tabla de plazos: 30px necesita 3:1. */
.tbl b, .tbl-r b, .plazo-v, .plazo b { color: var(--cian-txt) }

/* ACC-08 · Enlace para saltar al contenido, visible solo al tabular. */
.skip { position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--carbon); color: var(--porcelana); padding: var(--e3) var(--e5);
  font-size: 14px; font-weight: 500 }
.skip:focus { left: 0 }

/* MOB-01 (resto) · dos causas puntuales que sobrevivian al min-width:0.
   En pagar, el minmax del grid fijaba 280px al panel lateral.
   En el formulario, los campos sumaban su padding al 100% del ancho. */
@media (max-width: 1000px) {
  .pago-lay { grid-template-columns: 1fr }
  .pago-a { max-width: 100% }
}
input, select, textarea { max-width: 100%; box-sizing: border-box }

/* VIS-01 · Los dos fondos claros se separaban por 1,07:1, asi que el
   recorrido se leia como una sola superficie continua. */
.on-paper { background: #E9E9E6 }

/* MOB-03 (resto) · el padding de la regla original (linea 491) ganaba por
   especificidad de orden; se fuerza el alto minimo del area tactil. */
@media (max-width: 999px) {
  .nav a:not(.btn), .hdr-nav a:not(.btn) {
    padding-top: var(--e4); padding-bottom: var(--e4);
    min-height: 44px; box-sizing: border-box }
}

/* MOB-01 (resto) · bajo 400px las tablas de tres columnas no caben.
   La regla original vive en el @media de 760px, asi que hay que
   declarar esta despues y con el mismo o menor punto de corte. */
@media (max-width: 400px) {
  .hd, .it, .tbl-h, .tbl-r { grid-template-columns: 1fr 56px 84px; gap: var(--e2) }
  /* La tabla de plazos tiene una tercera columna de texto largo
     («Impresión funcional»), que no cabe bajo 340px. */
  .tbl .tbl-h, .tbl .tbl-r { grid-template-columns: minmax(0,1fr) 46px minmax(0,86px) }
  .tbl .tbl-r span:last-child, .tbl .tbl-h span:last-child {
    overflow-wrap: anywhere; hyphens: auto }
  .tbl-r span, .tbl-h span, .it-n, .it-p { font-size: 12.5px }
  .it-n, .tbl-r span:first-child { overflow-wrap: anywhere }
}

/* MOB-03 (resto, bis) · misma razon: la regla original esta en el
   @media de 760px y por orden de cascada ganaba a la de 999px. */
@media (max-width: 760px) {
  .nav a:not(.btn), .hdr-nav a:not(.btn) {
    padding: var(--e4) 0; min-height: 44px; display: flex;
    align-items: center; box-sizing: border-box }
}



/* ═══ CORRECCIONES DE MOVIL · reportadas al revisar la ola 1 ══════════
   Todas por la misma causa: reglas de escritorio declaradas DESPUES de
   sus @media, que por orden de cascada ganaban en pantallas chicas. */

/* Las tarjetas de atributos y las de VEVI quedaban en tres columnas de
   116px en un celular: el texto salia en tiras de dos palabras. */
@media (max-width: 860px) {
  .dif-g, .testi-g, .vevi .vevi-g, .vevi-g, .cond-lay .cond-g,
  .arn-g, .gar-g, .chan-g { grid-template-columns: 1fr }
  .dif-c, .dif-c + .dif-c { padding: var(--e6) 0; border-left: 0 }
  .vevi-c, .cond-c { padding: var(--e5) }
}

/* La galeria mostraba dos columnas de 169px: fotos chicas y apretadas.
   En celular conviene una sola columna, a ancho completo. */
@media (max-width: 700px) {
  .grid, .gal, .son-g, .casos-g { grid-template-columns: 1fr }
  .gal .ph:first-child { grid-column: span 1 }
  .card { aspect-ratio: 4/5 }
}

/* El enlace de salto solo debe verse al navegar con teclado.
   Se refuerza por si alguna regla posterior lo hacia visible. */
.skip { position: absolute !important; left: -9999px; top: 0; width: 1px;
  height: 1px; overflow: hidden }
.skip:focus, .skip:focus-visible { left: 0; width: auto; height: auto;
  overflow: visible }


/* ═══ OLA 2 · captura de bajo compromiso ═════════════════════════════
   FUN-01. Reemplaza el cierre generico de cada pagina. Cuatro campos,
   ningun dato clinico: la orden completa queda como segundo paso. */
.ctc { background: var(--carbon); color: var(--porcelana) }
.ctc-in { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e10);
  align-items: start }
.ctc-t h2 { font-size: clamp(26px, 3vw, 34px); font-weight: 700;
  letter-spacing: -.03em; line-height: 1.1; color: var(--porcelana) }
.ctc-t p { font-size: 16px; line-height: 1.65; color: var(--bruma);
  margin-top: var(--e4) }
.ctc-alt { font-size: 14px !important; color: var(--bruma) !important;
  margin-top: var(--e6) !important }
.ctc-alt a { color: var(--cian); text-decoration: underline;
  text-underline-offset: 3px }
.ctc-f { background: var(--blanco); padding: var(--e8) !important;
  border-top: var(--b3) solid var(--cian) }
.ctc-g { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e4) }
.ctc-f label { display: block; font-size: 11px; letter-spacing: var(--tk-eti);
  text-transform: uppercase; font-weight: 500; color: var(--acero);
  margin-bottom: var(--e2) }
.ctc-f .opt { text-transform: none; letter-spacing: 0; font-size: 10.5px;
  color: var(--acero); font-weight: 400 }
.ctc-f input, .ctc-f textarea { width: 100%; box-sizing: border-box;
  padding: var(--e3) var(--e4); border: var(--b1) solid var(--filete);
  background: var(--porcelana); font: inherit; font-size: 15px;
  color: var(--tinta) }
.ctc-f textarea { resize: vertical; min-height: 78px }
.ctc-f input:focus, .ctc-f textarea:focus { outline: 0;
  border-color: var(--cian-osc); background: var(--blanco) }
.ctc-b { width: 100%; margin-top: var(--e6); font-size: 15px; padding: var(--e4) }
.ctc-b:disabled { opacity: .6; cursor: default }
.ctc-legal { margin-top: var(--e4); font-size: 11.5px; line-height: 1.6;
  color: var(--acero) }
.ctc-msg { background: #FDF4F1; border-left: var(--b3) solid #C0562F;
  color: #8C3D20; font-size: 13.5px; line-height: 1.55; padding: var(--e4);
  margin-bottom: var(--e5) }
.ctc-msg.ok { background: #E7F4F6; border-left-color: var(--cian-osc);
  color: #1B6F7C; font-weight: 500 }
@media (max-width: 860px) {
  .ctc-in { grid-template-columns: 1fr; gap: var(--e8) }
  .ctc-g { grid-template-columns: 1fr }
  .ctc-f { padding: var(--e5) }
}
@media (max-width: 999px) {
  .ctc-f input, .ctc-f textarea { font-size: 16px }
}


/* Cifras de trayectoria · bajaron del hero a Como trabajamos */
.cifras { background: var(--blanco) }
.cifras-l { list-style: none; display: flex; flex-wrap: wrap; gap: var(--e12);
  margin-top: var(--e6); padding-top: var(--e5);
  border-top: var(--b1) solid var(--filete) }
.cifras-l li { display: flex; flex-direction: column }
.cifras-l b { font-size: clamp(30px, 3.4vw, 42px); font-weight: 700; line-height: 1;
  letter-spacing: -.03em; color: var(--cian-txt); font-variant-numeric: tabular-nums }
.cifras-l span { font-size: 10px; letter-spacing: var(--tk-eti); text-transform: uppercase;
  font-weight: 500; color: var(--acero); margin-top: var(--e3) }

/* La ilustracion del hero, mas contenida en movil */
@media (max-width: 860px) {
  .gem { height: 120px; order: -1; opacity: .9 }
}


/* Hero sin la franja de datos. La seccion de areas ya trae su propio filete
   superior, asi que el hero no necesita otro: basta con acotar el aire para
   que el cierre lo haga esa linea y no quede un hueco muerto en medio. */
.hero { padding-bottom: var(--e12) }
.hero-in { align-items: center; min-height: 0 }
.hero + .sec, .hero + section { padding-top: var(--e12) }
@media (max-width: 860px) {
  .hero { padding-bottom: var(--e8) }
  .hero + .sec, .hero + section { padding-top: var(--e10) }
}


/* Corte de seccion al estilo BTG: la linea cruza todo el ancho de la
   pantalla y el encabezado va centrado debajo. Reemplaza el patron
   anterior, que dejaba un filete a media pagina con el texto a la
   izquierda y el bloque se veia metido en la esquina. */
.sec-h.centro { max-width: 640px; margin: 0 auto var(--e10); text-align: center;
  border-top: 0; padding-top: 0 }
.sec-h.centro h2 { max-width: none }
.sec-h.centro p { margin-left: auto; margin-right: auto; max-width: 56ch }
.sec-h.centro::before, .sec-h.centro::after { content: none }

/* La linea de corte pasa a la seccion, para que llegue de borde a borde. */
.sec:has(.sec-h.centro) { border-top: var(--b1) solid var(--filete) }
.sec.on-dark:has(.sec-h.centro),
.sec.cond:has(.sec-h.centro) { border-top-color: rgba(242,242,240,.16) }

@media (max-width: 860px) {
  .sec-h.centro { margin-bottom: var(--e8) }
}


/* Corte de seccion al estilo BTG. La linea cruza todo el ancho de la
   pantalla y el encabezado va centrado debajo, en vez del filete a media
   pagina con el texto pegado a la izquierda. Se aplica a toda la portada
   para que el criterio sea uno solo. */
.corte { border-top: var(--b1) solid var(--filete) }
.sec-h.centro { text-align: center; max-width: 640px; margin: 0 auto var(--e10);
  border-top: 0; padding-top: 0 }
.sec-h.centro h2 { max-width: none }
.sec-h.centro p { margin-left: auto; margin-right: auto; max-width: 56ch }
.sec-h.centro .eyebrow { display: block }
/* En superficie oscura el corte usa un filete claro. */
.on-dark.corte, .cond.corte, .vevi.corte { border-top-color: rgba(242,242,240,.16) }
@media (max-width: 860px) {
  .sec-h.centro { margin-bottom: var(--e8) }
}


/* Simbolo Corona CAD · manual de marca 3.1.
   El simbolo nuevo es casi cuadrado (146x143) y el anterior era vertical
   (104x128), asi que el alto heredado lo dejaba desproporcionado. */
.gem { height: auto; width: clamp(180px, 22vw, 260px); max-width: 100% }
@media (max-width: 860px) {
  .gem { width: 130px; height: auto }
}


/* ═══ Manual de marca 3.1 · ajustes de cumplimiento ══════════════════
   Dos valores que el manual especifica y el sitio no aplicaba. */

/* El nombre del logotipo va en Tinta (N—001), no en Carbon.
   El manual asigna Tinta a "nombre y tipografia". */
.brand-nm, .logo-t { color: var(--tinta) }

/* El tracking del nombre es -0.03em segun la seccion de tipografia.
   El sitio usaba -0.04em, heredado del tracking general de titulares. */
.brand-nm, .logo-t { letter-spacing: -.03em }