/* Distribuciones Leal's · v2 · una familia (Archivo), la anchura hace la identidad */
:root{
  --paper:#f6f6f1;--paper-2:#ecede4;--white:#ffffff;
  --ink:#10241a;--ink-2:#4a5a50;
  --green:#0b6b3f;--green-deep:#0a3a24;--green-soft:#dfeadf;
  --yellow:#f2cb1d;--yellow-2:#e2b90c;
  --line:#d9dbd0;
  --font:'Archivo','Arial Narrow',Arial,sans-serif;
  --wrap:1240px;
  --sal:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem}
body{background:var(--paper);color:var(--ink);font-family:var(--font);font-size:1.0625rem;line-height:1.6;font-weight:400;font-stretch:100%;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--yellow);color:var(--ink)}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:3px}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px),4vw);padding-right:max(16px,env(safe-area-inset-right,0px),4vw)}
@media (min-width:1400px){.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem;top:1rem}

/* tipografía */
.h1,.h2,.h3,.disp{font-stretch:118%;font-weight:800;letter-spacing:-.02em;line-height:.96;text-wrap:balance}
.h1{font-size:clamp(2.5rem,6.2vw,5.6rem);font-stretch:122%}
.h2{font-size:clamp(1.9rem,3.8vw,3.3rem)}
.h3{font-size:1.3rem;font-stretch:108%;font-weight:750;line-height:1.1;letter-spacing:-.01em}
.lead{font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.5;max-width:52ch;text-wrap:pretty}
.muted{color:var(--ink-2)}
.tag{font-stretch:78%;font-weight:600;font-size:.86rem;letter-spacing:.01em;color:var(--green)}
.num{font-variant-numeric:tabular-nums}
p{text-wrap:pretty}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.1rem;padding:.8rem 1.4rem;border-radius:8px;font-weight:700;font-stretch:108%;font-size:.95rem;text-decoration:none;background:var(--yellow);color:var(--ink);border:1px solid var(--yellow);transition:background .25s,border-color .25s,color .25s,transform .15s}
.btn:hover{background:var(--yellow-2);border-color:var(--yellow-2)}
.btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.green{background:var(--green);border-color:var(--green);color:#fff}
.btn.green:hover{background:var(--green-deep);border-color:var(--green-deep)}
.btn.ghost{background:transparent;border-color:currentColor}
.btn.ghost:hover{background:rgba(255,255,255,.08)}
.on-dark .btn.ghost{color:#fff}
.btn svg{width:1.15rem;height:1.15rem;flex-shrink:0}
.link{color:var(--green);font-weight:650;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.link:hover{color:var(--green-deep)}

/* barra de utilidad */
.util{background:var(--green-deep);color:#dfe9e2;font-size:.84rem;font-stretch:90%}
.util .wrap{display:flex;gap:.4rem 1.6rem;align-items:center;min-height:2.4rem;flex-wrap:wrap;justify-content:flex-end}
.util a{text-decoration:none;color:#fff}
.util a:hover{text-decoration:underline}
.util .util-h{margin-right:auto}
@media (max-width:760px){.util .util-h,.util .util-mail{display:none}.util .wrap{justify-content:center}}

/* cabecera */
.cab{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.cab .wrap{display:flex;align-items:center;gap:2rem;height:4.6rem}
.cab-logo{display:block;flex-shrink:0}
.cab-logo img{height:2.4rem;width:auto}
.nav{display:flex;align-items:center;gap:.3rem;margin-left:auto}
.nav>a,.nav .dd>button{display:inline-flex;align-items:center;gap:.3rem;padding:.55rem .85rem;border-radius:6px;text-decoration:none;font-weight:600;font-stretch:105%;font-size:.97rem}
.nav>a:hover,.nav .dd>button:hover{background:var(--paper-2)}
.nav a[aria-current="page"],.nav .dd.cur>button{color:var(--green);box-shadow:inset 0 -2px 0 var(--green)}
.dd{position:relative}
.dd>button svg{width:.8rem;height:.8rem;transition:transform .25s}
.dd-menu{position:absolute;top:calc(100% + .4rem);left:-.5rem;min-width:15rem;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 40px -18px rgba(16,36,26,.35);padding:.45rem;display:none}
.dd.open .dd-menu,.dd:focus-within .dd-menu{display:grid}
@media (hover:hover){.dd:hover .dd-menu{display:grid}}
.dd.open>button svg{transform:rotate(180deg)}
.dd-menu a{display:flex;justify-content:space-between;gap:1rem;padding:.55rem .7rem;border-radius:6px;text-decoration:none;font-weight:550}
.dd-menu a:hover{background:var(--paper)}
.dd-menu a small{color:var(--ink-2);font-stretch:80%;font-weight:500}
.cab .btn{min-height:2.7rem;padding:.55rem 1.1rem}
.burger{display:none;width:2.8rem;height:2.8rem;border-radius:8px;margin-left:auto;position:relative}
.burger span{position:absolute;left:.75rem;right:.75rem;height:2px;background:var(--ink);transition:transform .3s,opacity .2s}
.burger span:nth-child(1){top:.95rem}.burger span:nth-child(2){top:1.35rem}.burger span:nth-child(3){top:1.75rem}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(.4rem) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-.4rem) rotate(-45deg)}
@media (max-width:980px){
  .burger{display:block}
  .cab .btn{display:none}
  .nav{position:fixed;inset:4.6rem 0 0 0;top:calc(4.6rem + var(--utilh,0px));background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:1rem max(16px,4vw) 2rem;margin:0;overflow:auto;display:none;border-top:1px solid var(--line)}
  .nav.open{display:flex}
  .nav>a,.nav .dd>button{font-size:1.25rem;font-stretch:115%;font-weight:750;padding:.9rem .2rem;border-bottom:1px solid var(--line);border-radius:0;width:100%;justify-content:space-between}
  .nav a[aria-current="page"],.nav .dd.cur>button{box-shadow:none}
  .dd-menu{position:static;box-shadow:none;border:0;padding:.2rem 0 .6rem 0;min-width:0}
  .nav .btn{display:flex;margin-top:1.2rem}
}

/* hero */
.hero{position:relative;color:#fff;background:var(--green-deep);overflow:hidden;isolation:isolate}
.hero-img{position:absolute;inset:0;z-index:-2}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:60% 45%;animation:zoom 18s ease-out both}
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,30,19,.92) 0%,rgba(8,30,19,.72) 38%,rgba(8,30,19,.15) 75%),linear-gradient(0deg,rgba(8,30,19,.6),transparent 40%)}
.hero .wrap{padding-block:clamp(4.5rem,12vh,8rem) clamp(2.5rem,6vh,4rem);display:grid;gap:1.4rem;min-height:min(82svh,760px);align-content:end}
.hero .tag{color:var(--yellow)}
.hero .h1{max-width:12.5ch}
.hero .lead{color:#e7efe9;max-width:46ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:.4rem}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.18);border-top:1px solid rgba(255,255,255,.18);margin-top:clamp(1.5rem,4vh,3rem)}
.facts div{background:rgba(8,30,19,.55);padding:1rem 1rem 1.1rem;backdrop-filter:blur(4px)}
.facts b{display:block;font-stretch:122%;font-weight:800;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1;letter-spacing:-.02em}
.facts span{font-size:.86rem;font-stretch:85%;color:#cfe0d4}
@media (max-width:700px){.facts{grid-template-columns:1fr 1fr}}

/* cabecera de página interior */
.phead{background:var(--green-deep);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.phead .wrap{padding-block:clamp(3rem,8vh,5rem) clamp(2.2rem,5vh,3.4rem);display:grid;gap:1rem}
.phead .tag{color:var(--yellow)}
.phead .lead{color:#dce8df}
.phead-img{position:absolute;inset:0;z-index:-1;opacity:.28}
.phead-img img{width:100%;height:100%;object-fit:cover}
.crumbs{font-size:.86rem;font-stretch:88%;color:#cfe0d4;display:flex;gap:.4rem;flex-wrap:wrap}
.crumbs a{color:#fff}

/* secciones */
.sec{padding-block:clamp(3.5rem,9vh,6.5rem)}
.sec.alt{background:var(--paper-2)}
.sec.white{background:#fff}
.sec-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:1rem 3rem;align-items:end;margin-bottom:2.4rem}
.sec-head .lead,.sec-head p{color:var(--ink-2)}
@media (max-width:820px){.sec-head{grid-template-columns:1fr}}

/* bento de categorías */
.bento{display:grid;gap:.75rem;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"q q e e" "q q c s" "m d n s";grid-auto-rows:minmax(13rem,auto)}
.cat{position:relative;overflow:hidden;border-radius:12px;display:flex;flex-direction:column;justify-content:flex-end;padding:1.2rem;min-height:13rem;color:#fff;text-decoration:none;isolation:isolate;background:var(--green-deep)}
.cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .9s var(--sal)}
.cat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(8,30,19,.85),rgba(8,30,19,0) 62%)}
.cat:hover img{transform:scale(1.05)}
.cat b{font-stretch:118%;font-weight:800;font-size:clamp(1.25rem,2vw,1.7rem);line-height:1;letter-spacing:-.015em}
.cat span{font-size:.88rem;font-stretch:85%;color:#e2ece5;margin-top:.35rem}
.cat.pack{background:#fff;color:var(--ink)}
.cat.pack img{object-fit:contain;object-position:right center;left:auto;width:46%;padding:1rem .8rem}.cat.pack b,.cat.pack span{max-width:56%}
.cat.pack::after{background:none}
.cat.pack span{color:var(--ink-2)}
.c-q{grid-area:q}.c-e{grid-area:e}.c-c{grid-area:c}.c-s{grid-area:s}.c-m{grid-area:m}.c-d{grid-area:d}.c-n{grid-area:n}
@media (max-width:900px){.bento{grid-template-columns:1fr 1fr;grid-template-areas:"q q" "e e" "s c" "s m" "d n"}}
@media (max-width:520px){.bento{grid-template-columns:1fr;grid-template-areas:"q" "e" "s" "c" "m" "d" "n"}.cat{min-height:14rem}.c-q,.c-s{min-height:20rem}}

/* marcas */
.brands{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.6rem}
.brand{background:#fff;border:1px solid var(--line);border-radius:12px;display:grid;grid-template-rows:6.5rem auto;gap:.6rem;padding:1rem .8rem .9rem;text-decoration:none;transition:transform .3s var(--sal),box-shadow .3s,border-color .3s}
.brand:hover{transform:translateY(-2px);border-color:var(--green);box-shadow:0 14px 30px -18px rgba(16,36,26,.4)}
.brand img{max-height:100%;max-width:100%;width:auto;margin:auto;object-fit:contain}
.brand span{font-size:.84rem;font-stretch:85%;text-align:center;color:var(--ink-2)}
.brand span b{display:block;color:var(--ink);font-stretch:105%;font-size:.95rem}
@media (max-width:1100px){.brands{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:560px){.brands{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ventajas / pasos */
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.trio>div{background:#fff;padding:1.6rem 1.4rem 1.7rem;display:grid;gap:.6rem;align-content:start}
.trio p{color:var(--ink-2)}
@media (max-width:820px){.trio{grid-template-columns:1fr}}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;counter-reset:s}
.steps li{counter-increment:s;border-top:3px solid var(--green);padding-top:1rem;display:grid;gap:.5rem;align-content:start}
.steps li::before{content:counter(s,decimal-leading-zero);font-stretch:122%;font-weight:800;font-size:1.6rem;color:var(--green);line-height:1}
.steps p{color:var(--ink-2);font-size:.98rem}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* banda de foto */
.band{position:relative;color:#fff;isolation:isolate;overflow:hidden;background:var(--green-deep)}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,30,19,.88),rgba(8,30,19,.35))}
.band .wrap{padding-block:clamp(4rem,12vh,7rem);display:grid;gap:1.2rem;justify-items:start}
.band .h2{max-width:16ch}
.band p{color:#e2ece5;max-width:48ch}

/* cierre */
.close{background:var(--green);color:#fff}
.close .wrap{padding-block:clamp(3rem,7vh,4.5rem);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem 3rem;align-items:center}
.close p{color:#e2ece5;margin-top:.6rem;max-width:52ch}
.close .acts{display:flex;flex-wrap:wrap;gap:.7rem}
@media (max-width:820px){.close .wrap{grid-template-columns:1fr}}

/* catálogo: filtros */
.filters{position:sticky;top:4.6rem;z-index:20;background:rgba(246,246,241,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.filters .wrap{display:grid;gap:.7rem;padding-block:1rem}
.f-row{display:flex;gap:.45rem;flex-wrap:wrap;align-items:center}
.f-row label{font-size:.82rem;font-stretch:80%;font-weight:600;color:var(--ink-2);margin-right:.3rem}
.chip{padding:.45rem .85rem;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.88rem;font-weight:600;font-stretch:95%;transition:background .2s,border-color .2s,color .2s}
.chip:hover{border-color:var(--green)}
.chip[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}
.chip small{font-weight:500;opacity:.75;margin-left:.2rem}
.search{display:flex;gap:.6rem;align-items:center}
.search input{flex:1;min-width:0;height:2.8rem;padding:0 1rem;border:1px solid var(--line);border-radius:8px;background:#fff;font:inherit;font-size:1rem}
.search input:focus{outline:2px solid var(--green);outline-offset:0;border-color:var(--green)}
.count{font-size:.88rem;font-stretch:85%;color:var(--ink-2);white-space:nowrap}
@media (max-width:720px){.filters{position:static}.f-scroll{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.3rem;-webkit-overflow-scrolling:touch}.chip{flex-shrink:0}}

/* grupos y tarjetas de producto */
.group{padding-top:2.6rem}
.group-head{display:flex;align-items:center;gap:1rem;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:.8rem;margin-bottom:1.4rem;flex-wrap:wrap}
.group-head .h3{font-size:1.6rem}
.group-head a{font-size:.9rem}
.sub{font-stretch:85%;font-weight:600;font-size:.92rem;color:var(--green);margin:1.6rem 0 .8rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14.5rem,1fr));gap:1rem}
.pc{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:box-shadow .3s,transform .3s var(--sal)}
.pc:hover{box-shadow:0 16px 34px -20px rgba(16,36,26,.45);transform:translateY(-2px)}
.pc-img{aspect-ratio:4/5;background:#fbfaf7;overflow:hidden;max-width:100%}
.pc-img img{width:100%;height:100%;object-fit:cover}
.pc-b{padding:1rem 1rem 1.1rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.pc-brand{font-size:.8rem;font-stretch:80%;font-weight:600;color:var(--green)}
.pc-name{font-stretch:108%;font-weight:750;font-size:1.06rem;line-height:1.15;letter-spacing:-.005em}
.pc-desc{font-size:.9rem;color:var(--ink-2);line-height:1.45}
.pc-meta{display:grid;grid-template-columns:1fr 1fr;gap:.35rem .8rem;margin-top:auto;padding-top:.6rem;border-top:1px solid var(--line);font-size:.84rem}
.pc-meta div:first-child{grid-column:1/-1}
.pc-meta dt{font-stretch:78%;font-weight:600;color:var(--ink-2);font-size:.74rem}
.pc-meta dd{font-variant-numeric:tabular-nums;font-weight:550}
.pc-cta{display:inline-flex;align-items:center;gap:.4rem;font-size:.88rem;font-weight:700;color:var(--green);text-decoration:none;margin-top:.4rem}
.pc-cta svg{width:1rem;height:1rem}
.pc-cta:hover{text-decoration:underline;text-underline-offset:3px}
.pc[hidden],.group[hidden],.sub[hidden],.grid[hidden]{display:none!important}
.empty{padding:3rem 0;text-align:center;color:var(--ink-2)}
@media (max-width:520px){.grid{grid-template-columns:1fr 1fr;gap:.6rem}.pc-b{padding:.7rem}.pc-name{font-size:.95rem}.pc-desc{display:none}.pc-meta{font-size:.78rem}}

/* tabla de otras referencias */
.tbl{overflow-x:auto;margin-top:1.4rem;border:1px solid var(--line);border-radius:12px;background:#fff}
.tbl table{width:100%;border-collapse:collapse;min-width:34rem;font-size:.92rem}
.tbl caption{text-align:left;padding:.9rem 1rem .4rem;font-stretch:85%;font-weight:650;color:var(--green)}
.tbl th,.tbl td{text-align:left;padding:.6rem 1rem;border-top:1px solid var(--line);vertical-align:top}
.tbl th{font-stretch:78%;font-weight:600;color:var(--ink-2);font-size:.78rem}
.tbl td.num{font-variant-numeric:tabular-nums}

/* página de marca */
.bhead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem 3.5rem;align-items:center}
.bhead-logo{width:8rem;height:6rem;background:#fff;border-radius:12px;display:grid;place-items:center;padding:.8rem}
.bhead-logo img{max-height:100%;width:auto;object-fit:contain}
.bhead-txt{display:grid;gap:1rem;justify-items:start}
.bhead-txt .lead{color:#dce8df}
.bhead-claim{font-stretch:110%;font-weight:700;color:var(--yellow);font-size:1.1rem}
.bhead-img{border-radius:12px;overflow:hidden;aspect-ratio:4/3;max-width:100%}
.bhead-img img{width:100%;height:100%;object-fit:cover}
.mosaic{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;gap:.5rem;aspect-ratio:4/3;max-width:100%}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.mosaic img:first-child{grid-row:1/3}
@media (max-width:860px){.bhead{grid-template-columns:1fr}}
.others{display:flex;gap:.5rem;flex-wrap:wrap}

/* nosotros */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem 4rem;align-items:center}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.pillars{display:flex;flex-wrap:wrap;gap:.5rem}
.pillars li{list-style:none;padding:.5rem .9rem;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:600;font-stretch:95%;font-size:.92rem}
.photo{border-radius:12px;overflow:hidden;max-width:100%}
.photo img{width:100%;height:100%;object-fit:cover}
.photo figcaption{font-size:.84rem;color:var(--ink-2);padding-top:.5rem}
.map{position:relative;aspect-ratio:1244/551;max-width:100%}
.map img{width:100%;height:100%;object-fit:contain}
.map span{position:absolute;transform:translate(-50%,-50%);font-size:clamp(.62rem,1.1vw,.82rem);font-stretch:85%;font-weight:650;background:#fff;padding:.15rem .45rem;border-radius:4px;white-space:nowrap;box-shadow:0 2px 8px rgba(16,36,26,.12)}
.map span.sede{background:var(--yellow)}
.isl{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.2rem}
.isl li{list-style:none;font-size:.86rem;padding:.35rem .75rem;border-radius:999px;background:var(--green-soft);color:var(--green-deep);font-weight:600;font-stretch:92%}

/* contacto */
.cgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2.5rem 4rem;align-items:start}
@media (max-width:900px){.cgrid{grid-template-columns:1fr}}
.cdata{display:grid;gap:0;font-style:normal;border-top:1px solid var(--line)}
.cdata>div{display:grid;gap:.2rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.cdata dt,.cdata .k{font-size:.8rem;font-stretch:80%;font-weight:600;color:var(--ink-2)}
.cdata .v{font-stretch:112%;font-weight:750;font-size:1.3rem;line-height:1.2;display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}
.cdata .v a{text-decoration:none}
.cdata .v a:hover{color:var(--green)}
.copy{font-size:.74rem;font-stretch:85%;font-weight:600;padding:.3rem .65rem;border:1px solid var(--line);border-radius:999px;color:var(--ink-2)}
.copy:hover{border-color:var(--green);color:var(--green)}
.copy.ok{background:var(--green);border-color:var(--green);color:#fff}
.form{background:#fff;border:1px solid var(--line);border-radius:14px;padding:clamp(1.3rem,3vw,2.2rem);display:grid;gap:1.1rem}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media (max-width:560px){.f2{grid-template-columns:1fr}}
.fld{display:grid;gap:.35rem}
.fld label{font-size:.84rem;font-weight:600;font-stretch:88%}
.fld input,.fld select,.fld textarea{width:100%;min-width:0;font:inherit;font-size:1rem;padding:.7rem .85rem;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink)}
.fld textarea{min-height:7rem;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--green);outline-offset:0;border-color:var(--green);background:#fff}
.fld .err{display:none;font-size:.82rem;color:#a2381f}
.fld.bad input,.fld.bad textarea,.fld.bad select{border-color:#a2381f}
.fld.bad .err{display:block}
.chk{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem;color:var(--ink-2)}
.chk input{margin-top:.25rem;accent-color:var(--green);width:1rem;height:1rem;flex-shrink:0}
.form-ok{display:none;border:1px solid var(--green);background:var(--green-soft);border-radius:10px;padding:1rem 1.1rem}
.form.sent .form-ok{display:block}
.form.sent .form-fields{display:none}
.form-fields{display:grid;gap:1.1rem}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 0;font-stretch:108%;font-weight:700;font-size:1.08rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;font-weight:400;color:var(--green);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 1.2rem;color:var(--ink-2);max-width:68ch}

/* legal */
.legal{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:2rem 4rem;align-items:start}
.legal nav{position:sticky;top:6rem;display:grid;gap:.3rem;font-size:.9rem;border-top:2px solid var(--ink);padding-top:.8rem}
.legal nav a{text-decoration:none;color:var(--ink-2)}
.legal nav a:hover{color:var(--green)}
.legal article{max-width:70ch;min-width:0}.legal nav{min-width:0}
.legal h2{font-stretch:112%;font-weight:800;font-size:1.5rem;line-height:1.15;margin:2.4rem 0 .8rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.legal h2:first-child{margin-top:0;padding-top:0;border-top:0}
.legal h3{font-weight:700;font-size:1.02rem;margin:1.4rem 0 .5rem}
.legal p,.legal li{margin-bottom:.8rem}
.legal ul{margin-left:1.2rem}
.legal a{color:var(--green)}
.legal dl{display:grid;grid-template-columns:minmax(0,10rem) minmax(0,1fr);gap:.5rem 1rem;background:#fff;border:1px solid var(--line);border-radius:10px;padding:1rem 1.2rem;margin-bottom:1.2rem}
.legal dt{font-stretch:80%;font-weight:600;color:var(--ink-2)}
.legal .tabla-scroll{overflow-x:auto;margin-bottom:1.2rem}
.legal table{width:100%;border-collapse:collapse;min-width:34rem;font-size:.92rem;background:#fff}
.legal th,.legal td{text-align:left;padding:.6rem .8rem;border:1px solid var(--line);vertical-align:top}
.legal th{font-stretch:80%;font-weight:600;color:var(--ink-2)}
@media (max-width:860px){.legal{grid-template-columns:1fr}.legal nav{position:static}.legal dl{grid-template-columns:1fr}}

/* pie */
.pie{background:var(--green-deep);color:#cfe0d4;font-size:.92rem}
.pie .wrap{padding-block:3.5rem 2rem}
.pie-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:2rem}
.pie-logo img{width:11rem;height:auto}
.pie-top p{margin-top:1rem;max-width:30ch}
.pie h2{font-stretch:105%;font-weight:700;font-size:.95rem;color:#fff;margin-bottom:.8rem}
.pie ul{list-style:none;display:grid;gap:.45rem}
.pie a{color:#cfe0d4;text-decoration:none}
.pie a:hover{color:#fff;text-decoration:underline}
.pie address{font-style:normal;line-height:1.6}
.pie-bot{display:flex;justify-content:space-between;gap:.8rem 2rem;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.15);margin-top:2.5rem;padding-top:1.2rem;font-size:.82rem}
@media (max-width:900px){.pie-top{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.pie-top{grid-template-columns:1fr}}

/* whatsapp flotante */
.wa{position:fixed;z-index:60;right:max(1rem,env(safe-area-inset-right,0px));bottom:max(1rem,env(safe-area-inset-bottom,0px));display:inline-flex;align-items:center;gap:.55rem;height:3.3rem;padding:0 1.1rem 0 .55rem;border-radius:999px;background:#25d366;color:#0a2a17;font-weight:700;font-stretch:105%;font-size:.9rem;text-decoration:none;box-shadow:0 12px 28px -10px rgba(0,0,0,.45);transition:transform .25s}
.wa:hover{transform:translateY(-2px)}
.wa svg{width:2.2rem;height:2.2rem}
@media (max-width:720px){.wa{width:3.3rem;padding:0;justify-content:center}.wa span{display:none}}

/* marquesina */
.marq{overflow:hidden;border-block:1px solid var(--line);background:#fff;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marq ul{display:flex;width:max-content;animation:slide 40s linear infinite;list-style:none}
.marq li{padding:1.1rem 2.6rem;display:flex;align-items:center}
.marq img{height:3rem;width:auto;max-width:none}
.marq:hover ul{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

.hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.7)}

.fam-h{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;font-stretch:110%;font-weight:800;font-size:1.15rem;color:var(--ink);margin:2rem 0 .8rem;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.fam-h a{color:inherit;text-decoration:none}.fam-h a:hover{color:var(--green)}
.fam-h small{font-stretch:85%;font-weight:550;font-size:.82rem;color:var(--ink-2)}.fam-h small a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.pc-sku .pc-name{font-size:.98rem;line-height:1.25}
.pc-sku .pc-meta div:first-child{grid-column:auto}
.pc-acts{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.6rem}
.pc-acts .pc-cta{margin-top:0;background:var(--green);color:#fff;padding:.42rem .75rem;border-radius:8px;font-size:.84rem}
.pc-acts .pc-cta:hover{text-decoration:none;background:var(--green-deep)}
.pc-more{font-size:.82rem;color:var(--green);font-weight:650}
@media (max-width:640px){.grid:has(.pc-sku){grid-template-columns:1fr;gap:.6rem}
.pc-sku{flex-direction:row}.pc-sku .pc-link{flex:0 0 6.5rem}.pc-sku .pc-img{aspect-ratio:auto;height:100%;min-height:8.5rem}
.pc-sku .pc-logo{padding:.8rem}.pc-sku .pc-b{padding:.7rem .8rem;gap:.15rem}.pc-sku .pc-brand{font-size:.72rem}
.pc-sku .pc-meta{grid-template-columns:repeat(3,auto);justify-content:start;gap:.2rem 1rem;padding-top:.4rem}
.pc-acts{margin-top:.45rem}.fam-h{margin-top:1.5rem;font-size:1.05rem}}

.pc-link{display:block}.pc-name a{text-decoration:none}.pc-name a:hover{color:var(--green)}
.pc-logo{display:grid;place-items:center;background:#fff;padding:2rem}.pc-logo img{width:70%;height:auto;object-fit:contain}
.crumbs.dark{color:var(--ink-2)}.crumbs.dark a{color:var(--green)}
.pd-crumbs{padding-top:1.4rem}
.pd{padding-block:1.4rem 3rem}
.pd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:2rem 3.5rem;align-items:start}
.pd-gal{display:grid;gap:.7rem;position:sticky;top:6rem}
.pd-main{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;aspect-ratio:4/5;max-width:100%}
.pd-main img{width:100%;height:100%;object-fit:cover}
.pd-logo{display:grid;place-items:center;padding:3rem}.pd-logo img{width:70%;height:auto;object-fit:contain}
.pd-th{display:flex;gap:.5rem;flex-wrap:wrap}.th{width:4.6rem;border:2px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}.th[aria-current="true"]{border-color:var(--green)}.th img{width:100%;aspect-ratio:4/5;object-fit:cover}
.pd-info{display:grid;gap:1.1rem;min-width:0}
.pd-brand{font-stretch:80%;font-weight:650;color:var(--green);text-decoration:none}
.pd-h1{font-stretch:118%;font-weight:800;font-size:clamp(2rem,4.2vw,3.4rem);line-height:.98;letter-spacing:-.02em;text-wrap:balance}
.pd-info .tbl{margin-top:0}
.pd-cta{display:flex;gap:.6rem;flex-wrap:wrap}.pd-cta .btn.ghost{color:var(--ink)}
.pd-facts{list-style:none;display:grid;gap:.35rem;font-size:.92rem;color:var(--ink-2)}
.pd-facts li::before{content:"✓ ";color:var(--green);font-weight:700}
@media (max-width:860px){.pd-grid{grid-template-columns:1fr}.pd-gal{position:static;max-width:30rem}}
.pd-body{display:grid;gap:1.2rem;max-width:900px}
.tabs{display:flex;gap:.2rem;border-bottom:2px solid var(--line);overflow-x:auto}
.tabs button{padding:.8rem 1.1rem;font-weight:700;font-stretch:105%;color:var(--ink-2);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--green)}
.tabp{display:grid;gap:.8rem;padding:.6rem 0 1rem}.tabp p{max-width:70ch}
.tabp-t{position:absolute;left:-9999px}
.js .tabp[hidden]{display:none}
.kv{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr);border-top:1px solid var(--line)}
.kv>div{display:contents}.kv dt,.kv dd{padding:.6rem 0;border-bottom:1px solid var(--line)}.kv dt{font-stretch:82%;font-weight:600;color:var(--ink-2);padding-right:1rem}
@media (max-width:560px){.kv{grid-template-columns:1fr}.kv dt{border-bottom:0;padding-bottom:0}}
.nut{border-collapse:collapse;width:100%;max-width:28rem;font-size:.92rem;margin-top:.6rem}
.nut caption{text-align:left;font-stretch:85%;font-weight:650;padding-bottom:.4rem}
.nut th,.nut td{border-bottom:1px solid var(--line);padding:.45rem .2rem;text-align:left}.nut td{text-align:right;font-variant-numeric:tabular-nums}
.nut tr.sub-r th{padding-left:1rem;font-weight:400;color:var(--ink-2)}
.pd-faq{margin-top:2rem}
.guide{display:grid;gap:2.4rem;max-width:960px}
.gq{display:grid;gap:.7rem;border-top:1px solid var(--line);padding-top:1.6rem}.gq .h3{font-size:clamp(1.3rem,2.4vw,1.8rem)}.gq p{color:var(--ink-2);max-width:70ch}
.ck{position:fixed;z-index:90;left:max(1rem,env(safe-area-inset-left,0px));bottom:max(1rem,env(safe-area-inset-bottom,0px));max-width:26rem;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 50px -20px rgba(16,36,26,.45);padding:1.2rem 1.2rem 1.1rem;display:grid;gap:.6rem;font-size:.92rem}
.ck[hidden]{display:none}.ck-t{font-stretch:112%;font-weight:800;font-size:1.05rem}.ck a{color:var(--green)}.ck-b{display:flex;gap:.6rem;flex-wrap:wrap}.ck .btn{min-height:2.6rem;padding:.5rem 1.1rem}.ck .btn.ghost{color:var(--ink)}
.link-cookies{font:inherit;cursor:pointer}.link-cookies:hover{text-decoration:underline;color:#fff}
@media (max-width:520px){.ck{right:max(1rem,env(safe-area-inset-right,0px));max-width:none;bottom:5rem}}