:root{
  --white:#fff;--g900:#0e3a20;--g800:#14532d;--g700:#176a2d;--g600:#1e7f37;--lime:#a6e05f;
  --m50:#f4faf0;--m100:#e7f4dd;--m200:#d5ecc6;--m300:#c1e3ac;
  --ink:#16281d;--mut:#3b4f42;
  --fs-s:1rem;
  --fs-b:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --fs-l:clamp(1.25rem,1.1rem + .6vw,1.5rem);
  --fs-m:clamp(1.75rem,1.4rem + 1.4vw,2.5rem);
  --fs-h:clamp(2.25rem,1.5rem + 3vw,3.75rem);
  --fs-d:clamp(2.5rem,1.3rem + 4.2vw,4.25rem);
  --m:clamp(18px,3.4vw,48px);
  --r:20px;
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--white)}
body{margin:0;background:var(--white);color:var(--ink);font:400 var(--fs-b)/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.03em;line-height:1.08;color:var(--g900)}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--g600);outline-offset:3px}
.dark :focus-visible{outline-color:var(--lime)}
.skip{position:absolute;left:-999px}.skip:focus{left:var(--m);top:8px;background:var(--g800);color:#fff;padding:8px 14px;z-index:99}
.wrap{max-width:1360px;margin:0 auto;padding:0 var(--m)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0 clamp(16px,2vw,28px)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--g600);color:#fff;font:700 var(--fs-s)/1 var(--sans);font-size:1.0625rem;text-decoration:none;padding:17px 28px;border:0;border-radius:14px;cursor:pointer;min-height:54px;transition:transform .2s ease,background-color .2s ease}
.btn:hover{background:var(--g700);transform:translateY(-2px)}
.btn:active{transform:none}
.btn svg{width:21px;height:21px;fill:currentColor;flex:none}
.btn.block{display:flex;width:100%}
.btn.sm{padding:12px 20px;min-height:46px;font-size:1rem}
.btn.light{background:#fff;color:var(--g800)}
.btn.light:hover{background:var(--m100)}
.btn.soft{background:var(--m100);color:var(--g800)}
.btn.soft:hover{background:var(--m200)}
.link{font-weight:600;color:var(--g700);text-underline-offset:5px;text-decoration-thickness:2px}
.link:hover{color:var(--g900)}

/* header */
.top{position:sticky;top:0;z-index:30;background:#fff;transition:box-shadow .25s}
.top.stuck{box-shadow:0 6px 24px rgba(14,58,32,.10)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:76px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:52px;width:auto}
.top nav{display:flex;gap:clamp(18px,2.6vw,36px);font-weight:600;font-size:1rem}
.top nav a{text-decoration:none;color:var(--ink);padding:10px 0;transition:color .2s}
.top nav a:hover{color:var(--g600)}

/* hero */
.hero{padding:clamp(28px,4vw,56px) 0 clamp(48px,6vw,88px);overflow:hidden}
.hero .grid{align-items:center}
.hero .copy{grid-column:1/8}
.hero h1{font-size:var(--fs-d);line-height:1.02;letter-spacing:-.04em;margin-bottom:.45em}
.hero h1 span{display:block}
.hero .lead{font-size:var(--fs-l);line-height:1.45;color:var(--mut);max-width:34ch;margin-bottom:1.4em}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.chip{background:var(--m100);color:var(--g800);font-weight:700;font-size:var(--fs-s);padding:10px 16px;border-radius:999px}
.chip small{font-weight:500;color:var(--mut);font-size:inherit}
.mosaic{grid-column:8/13;display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;height:clamp(460px,46vw,620px)}
.tile{position:relative;overflow:hidden;border-radius:var(--r);background:var(--m100)}
.tile img{width:100%;height:100%;object-fit:cover}
.tile.item img{object-fit:contain;mix-blend-mode:multiply;padding:8%}
.tile .tag{position:absolute;left:12px;bottom:12px;background:#fff;color:var(--g900);font-weight:700;font-size:var(--fs-s);padding:7px 12px;border-radius:999px}
.mosaic .a{grid-row:1/3}
.mosaic .d{grid-column:1/3}
.mosaic .a img{animation:zoom 22s ease-in-out infinite alternate}
@keyframes zoom{from{transform:scale(1)}to{transform:scale(1.07)}}
/* fondos de producto: blanco (prueba). Arena: --sand-1 #f1ebdd / --sand-2 #e8dfcb */
:root{--sand-1:#f1ebdd;--sand-2:#e8dfcb;--sand-3:#f6f2e8}
.c1,.c2,.c3,.c4{background:#fff;box-shadow:inset 0 0 0 2px #e4e8e1}

/* stats */
.stats{background:var(--m50)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(40px,5vw,64px)}
.stat b{display:block;font-size:var(--fs-h);font-weight:800;letter-spacing:-.04em;color:var(--g600);line-height:1}
.stat span{display:block;margin-top:10px;color:var(--mut);font-size:var(--fs-s);max-width:24ch}

section{position:relative}
.pad{padding:clamp(72px,9vw,128px) 0}
.sec-head{margin-bottom:clamp(36px,4vw,56px)}
.sec-head h2{font-size:var(--fs-h);grid-column:1/7}
.sec-head p{grid-column:8/13;color:var(--mut);font-size:var(--fs-l);line-height:1.45;margin:0;align-self:end}

/* catalogue */
.fam{display:grid;grid-template-columns:repeat(12,1fr);gap:0 clamp(16px,2vw,28px);align-items:center}
.fam+.fam{margin-top:clamp(48px,6vw,88px)}
.fam .tiles{grid-column:1/7;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fam.rev .tiles{grid-column:7/13;grid-row:1}
.fam.rev .info{grid-column:1/7;grid-row:1}
.fam .tiles .tile{aspect-ratio:4/5}
.fam .tiles .wide{grid-column:1/3;aspect-ratio:16/8}
.fam .info{grid-column:8/13;padding:0}
.fam.rev .info{padding-right:clamp(0px,2vw,32px)}
.fam h3{font-size:var(--fs-m);margin-bottom:.4em}
.fam .desc{color:var(--mut);margin-bottom:1.2em}
.specs{list-style:none;margin:0 0 1.6em;padding:0;display:grid;gap:8px}
.specs li{position:relative;padding-left:30px}
.specs li::before{content:"";position:absolute;left:0;top:.42em;width:18px;height:18px;border-radius:50%;background:var(--m200) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.2l2.6 2.6L13 6.4' fill='none' stroke='%231e7f37' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.prices{display:grid;gap:10px}
.pr{display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;background:var(--m50);border-radius:16px;padding:14px 14px 14px 20px}
.pr b{display:block;font-size:1.0625rem;color:var(--g900)}
.pr small{display:block;color:var(--mut);font-size:var(--fs-s)}
.pr .amt{font-size:var(--fs-l);font-weight:800;letter-spacing:-.03em;color:var(--g800);white-space:nowrap}

/* calculator */
.calcsec{background:var(--m100)}
.calcsec .grid{align-items:stretch}
.calcsec .left{grid-column:1/7;padding:0}
.calcsec h2{font-size:var(--fs-h);margin-bottom:.4em}
.calcsec .left>p{color:var(--mut);font-size:var(--fs-l);line-height:1.45;max-width:34ch}
.calc{background:#fff;border-radius:24px;padding:clamp(20px,2.6vw,32px);display:grid;gap:14px;margin-top:28px}
.calc label{display:grid;grid-template-columns:1fr 130px;gap:16px;align-items:center;font-weight:600;font-size:var(--fs-s)}
.calc label small{display:block;font-weight:400;color:var(--mut)}
.calc label span{line-height:1.3}
input,select{font:500 var(--fs-b) var(--sans);color:var(--ink);background:var(--m50);border:2px solid transparent;border-radius:12px;padding:12px 14px;width:100%;min-height:52px;transition:border-color .2s,background-color .2s}
input:focus,select:focus{outline:none;border-color:var(--g600);background:#fff}
.sum{grid-column:8/13;background:var(--g800);color:#fff;border-radius:24px;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column}
.sum h3{color:#fff;font-size:var(--fs-l);margin-bottom:20px}
.sum .rows{display:grid;gap:16px;min-height:96px;margin-bottom:24px}
.sum .r{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.sum .r small{display:block;color:#b9d9c1;font-size:var(--fs-s)}
.sum .r[data-amt]::after{content:attr(data-amt);font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:auto;padding-top:24px;font-weight:600}
.sum .tot strong{font-size:var(--fs-h);font-weight:800;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.sum .fine{color:#b9d9c1;font-size:var(--fs-s);margin:14px 0 22px}
.sum .btn{background:#fff;color:var(--g800)}
.sum .btn:hover{background:var(--m100)}

/* journey (tiles that grow) */
.journey .head{display:grid;grid-template-columns:repeat(12,1fr);gap:0 24px;margin-bottom:clamp(28px,4vw,48px)}
.journey h2{font-size:var(--fs-h);grid-column:1/7}
.steps{display:grid;grid-template-columns:3fr 4fr 5fr;gap:12px;align-items:stretch}
.steps>div{display:flex;flex-direction:column;justify-content:flex-end}
.steps .tile{height:clamp(200px,22vw,300px)}
.steps .s2 .tile{height:clamp(260px,30vw,420px)}
.steps .s3 .tile{height:clamp(320px,38vw,540px)}
.steps h3{font-size:var(--fs-l);margin:18px 0 6px}
.steps p{color:var(--mut);margin:0;max-width:36ch;min-height:7.2em}

/* why */
.why .grid{align-items:center}
.why .ph{grid-column:1/6;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5}
.why .ph img{width:100%;height:100%;object-fit:cover}
.why .txt{grid-column:7/13}
.why h2{font-size:var(--fs-h);margin-bottom:.5em}
.why .txt>p{color:var(--mut);font-size:var(--fs-l);line-height:1.45;max-width:38ch}
.why .specs{margin:1.4em 0 1.8em}
.why .specs b{color:var(--g900)}
.why .links{display:flex;gap:10px 28px;flex-wrap:wrap}

/* guides */
.guides{background:var(--m50)}
.gcards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.gcard{background:#fff;border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .25s}
.gcard:hover{transform:translateY(-4px)}
.gcard img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--m100)}
.gcard div{padding:22px 24px 26px}
.gcard b{display:block;font-size:var(--fs-l);line-height:1.2;letter-spacing:-.02em;color:var(--g900);margin-bottom:8px}
.gcard span{display:block;color:var(--mut);font-size:var(--fs-s);line-height:1.5}
.guides .more{margin-top:28px}

/* faq */
.faq .grid{align-items:start}
.faq .hd{grid-column:1/5}
.faq h2{font-size:var(--fs-h);margin-bottom:.4em}
.faq .hd p{color:var(--mut)}
.acc{grid-column:6/13;display:grid;gap:10px}
.acc details{background:var(--m50);border-radius:16px;padding:0 24px;transition:background-color .2s}
.acc details[open]{background:var(--m100)}
.acc summary{list-style:none;cursor:pointer;font-weight:700;font-size:1.125rem;color:var(--g900);padding:20px 0;display:flex;justify-content:space-between;gap:16px;align-items:center}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:1.75rem;font-weight:500;color:var(--g600);line-height:1;transition:transform .25s}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc p{margin:0 0 22px;color:var(--mut);max-width:60ch}

/* closing */
.strip{display:grid;grid-template-columns:repeat(3,1fr)}
.strip img{width:100%;height:clamp(200px,32vw,420px);object-fit:cover}
.close{background:var(--g800);color:#fff}
.close .grid{padding:clamp(56px,7vw,96px) 0;align-items:center}
.close .t{grid-column:1/8}
.close h2{color:#fff;font-size:var(--fs-h);margin-bottom:.4em}
.close .t p{color:#cfe6d4;font-size:var(--fs-l);max-width:34ch;margin-bottom:1.4em}
.close .c{grid-column:9/13;display:grid;gap:14px;font-size:var(--fs-b)}
.close .c a{text-decoration:none;font-weight:600}
.close .c a:hover{color:var(--lime)}
.close .c small{display:block;color:#b9d9c1;font-weight:400;font-size:var(--fs-s)}
footer{background:var(--g900);color:#cfe6d4;padding:56px 0 28px;font-size:var(--fs-s)}
footer .grid{gap:32px clamp(16px,2vw,28px)}
footer .ab{grid-column:1/5}
footer .ab img{height:56px;background:#fff;border-radius:12px;padding:4px;margin-bottom:16px}
footer h4{color:#fff;font-size:var(--fs-s);margin:0 0 12px;font-weight:700}
footer nav{display:grid;gap:8px;align-content:start}
footer .col1{grid-column:6/9}footer .col2{grid-column:9/13}
footer a{text-decoration:none;color:#cfe6d4}footer a:hover{color:#fff}
footer .imp{grid-column:1/-1;margin:16px 0 0;color:#9bbfa5}

/* inner pages */
.phero{background:var(--m50);padding:clamp(28px,4vw,56px) 0}
.phero .grid{align-items:center}
.phero .t{grid-column:1/11}
.phero h1{font-size:clamp(1.75rem,1.2rem + 2.6vw,3rem);line-height:1.08;margin-bottom:.5em}
.phero .pl{font-size:var(--fs-l);line-height:1.45;color:var(--mut);max-width:44ch}
.phero .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}
.phero .ph{grid-column:1/-1;margin-top:clamp(24px,3vw,40px);border-radius:var(--r);overflow:hidden;aspect-ratio:3.2/1}
.phero .ph img{width:100%;height:100%;object-fit:cover;animation:zoom 24s ease-in-out infinite alternate}
.art{display:grid;grid-template-columns:repeat(12,1fr);gap:0 clamp(24px,3vw,48px);padding:clamp(40px,5vw,72px) 0 clamp(72px,9vw,120px);align-items:start}
.body{grid-column:1/9}
.body h2{font-size:clamp(1.375rem,1.1rem + 1vw,1.875rem);margin:1.7em 0 .5em}
.body h3{font-size:var(--fs-l);margin:1.4em 0 .4em;letter-spacing:-.02em}
.body>h2:first-child{margin-top:0}
.body p,.body li{font-size:var(--fs-b);line-height:1.7;max-width:70ch}
.body ul{padding-left:1.3em;margin:0 0 1.2em}
.body li{margin:.3em 0}
.body li::marker{color:var(--g600)}
.body a{color:var(--g700);font-weight:600;text-underline-offset:3px}
.body a.btn{color:#fff;text-decoration:none}
.body figure{margin:1.8em 0}
.body figure img{width:100%;height:auto;border-radius:var(--r)}
.body table{width:100%;border-collapse:separate;border-spacing:0 6px;margin:1.4em 0}
.body th,.body td{text-align:left;padding:14px 18px;background:var(--m50);font-size:var(--fs-s)}
.body th{background:var(--m200);font-weight:700;color:var(--g900)}
.body th:first-child,.body td:first-child{border-radius:12px 0 0 12px}
.body th:last-child,.body td:last-child{border-radius:0 12px 12px 0}
.pricepill{display:inline-block;background:var(--m100);color:var(--g800);font-weight:800;font-size:var(--fs-l);padding:8px 18px;border-radius:999px;letter-spacing:-.02em}
.aside{grid-column:9/13;position:sticky;top:96px;display:grid;gap:16px}
.pcard{background:var(--g800);color:#fff;border-radius:24px;padding:28px}
.pcard h3{color:#fff;font-size:var(--fs-l);margin-bottom:18px}
.pcard .r{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:14px}
.pcard .r b{font-weight:600}
.pcard .r small{display:block;color:#b9d9c1;font-size:var(--fs-s)}
.pcard .r span:last-child{font-size:var(--fs-l);font-weight:800;letter-spacing:-.03em}
.pcard .fine{color:#b9d9c1;font-size:var(--fs-s);margin:18px 0 20px}
.pcard .btn{background:#fff;color:var(--g800)}.pcard .btn:hover{background:var(--m100)}
.plates{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.plates .tile{aspect-ratio:1}
.plates .tile:first-child{grid-column:1/-1;aspect-ratio:16/9}
.qf{display:grid;gap:14px;margin:18px 0 28px;background:var(--m50);padding:24px;border-radius:var(--r)}
.qf label{display:grid;gap:6px;font-weight:600;font-size:var(--fs-s)}
.qf input,.qf select{background:#fff}

/* blog index */
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 20px;padding:clamp(40px,5vw,72px) 0 clamp(72px,9vw,120px)}
.bgrid .gcard{background:var(--m50)}


/* motion */
.js [data-rise]{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0ms)}
.js [data-rise].in{opacity:1;transform:none}
.mosaic .tile{animation:tilein .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0ms)}
@keyframes tilein{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:none}}
.tile img{transition:transform .6s ease}
.tile:hover img{transform:scale(1.04)}
.tile.item:hover img{transform:scale(1.06)}

@media(max-width:1000px){
  .top nav{display:none}
  .hero .copy,.mosaic,.sec-head h2,.sec-head p,.calcsec .left,.sum,.journey h2,.why .ph,.why .txt,.faq .hd,.acc,.close .t,.close .c,.phero .t,.phero .ph,.body,.aside{grid-column:1/-1}
  .mosaic{margin:32px 0 0;height:auto;grid-template-rows:none;grid-auto-rows:minmax(0,1fr)}
  .mosaic .a{grid-row:auto;aspect-ratio:4/5}.mosaic .b,.mosaic .c{aspect-ratio:1}
  .mosaic .d{grid-column:1/3;aspect-ratio:16/8;border-radius:var(--r)}
  .stats .wrap{grid-template-columns:1fr 1fr;gap:32px 20px}
  .fam,.fam.rev{display:block}
  .fam .info,.fam.rev .info{margin-top:28px;padding:0}
  .sec-head p{margin-top:14px}
  .sum{margin-top:20px}
  .steps{grid-template-columns:1fr;gap:28px}
  .steps .tile,.steps .s2 .tile,.steps .s3 .tile{height:auto;aspect-ratio:16/9}
  .steps .s2 .tile{aspect-ratio:16/10}.steps .s3 .tile{aspect-ratio:4/3}
  .why .txt{margin-top:28px}
  .gcards,.bgrid{grid-template-columns:1fr 1fr}
  .acc{margin-top:28px}
  .close .c{margin-top:28px}
  footer .ab,footer .col1,footer .col2{grid-column:1/-1}
  .aside{position:static;margin-top:32px}
  .plates{display:none}
  .phero .ph{aspect-ratio:16/9}
}
@media(max-width:620px){
  .gcards,.bgrid{grid-template-columns:1fr}
  .pr{grid-template-columns:1fr auto}
  .pr .btn{grid-column:1/-1}
  .calc label{grid-template-columns:1fr 110px}
  .strip{grid-template-columns:1fr}
  .strip img{height:200px}
  .hero .cta .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .js [data-rise]{opacity:1;transform:none;transition:none}
  .mosaic .tile,.mosaic .a img,.phero .ph img{animation:none}
  html{scroll-behavior:auto}
}
.body table{display:block;overflow-x:auto;max-width:100%}
@media(max-width:620px){.body th,.body td{padding:12px 12px}}
@media(max-width:520px){.phero h1{font-size:1.5rem}}

.tile.wide img{object-position:50% 80%}
.why .ph img{object-position:34% 50%}
.mosaic .a img{object-position:38% 50%}
.mosaic .d img{object-position:50% 58%}

.meta{font-size:var(--fs-s);color:var(--mut);margin:0 0 1.2em}
.previewbar{background:#fff3cd;color:#5c4400;text-align:center;padding:10px var(--m);font-weight:600;font-size:var(--fs-s)}
.body blockquote{margin:1.4em 0;padding:6px 0 6px 20px;border-left:4px solid var(--g600);color:var(--mut)}
.body img{max-width:100%;height:auto;border-radius:var(--r);margin:1em 0}

/* clientes */
.clients{padding:clamp(24px,4vw,56px) 0 clamp(56px,7vw,96px)}
.clients h2{font-size:var(--fs-m);margin-bottom:clamp(20px,3vw,36px)}
.logos{display:flex;flex-wrap:wrap;gap:20px clamp(24px,5vw,72px);align-items:center;justify-content:center}
.logo{width:clamp(104px,10.5vw,140px);aspect-ratio:1;border-radius:50%;background:var(--m100);border:3px solid var(--g600);display:grid;place-items:center;transition:transform .25s,background-color .25s,border-color .25s,box-shadow .25s}
.logo img{width:78%;height:78%;object-fit:contain;mix-blend-mode:multiply}
.logo:hover{transform:translateY(-5px);background:var(--m200);border-color:var(--g800);box-shadow:0 10px 22px rgba(20,83,45,.18)}
@media(max-width:620px){.logos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px;justify-items:center}.logo{width:100%;max-width:108px;border-width:2.5px}}
@media(min-width:621px){.clients h2{text-align:center}}

/* menú móvil */
.hd-r{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;width:46px;height:46px;border:0;border-radius:12px;background:var(--m100);cursor:pointer;padding:0;position:relative;flex:none}
.menu-btn span{position:absolute;left:13px;right:13px;height:2.5px;border-radius:2px;background:var(--g800);transition:transform .25s,opacity .2s,top .25s}
.menu-btn span:nth-child(1){top:15px}.menu-btn span:nth-child(2){top:22px}.menu-btn span:nth-child(3){top:29px}
.top.menu-open .menu-btn span:nth-child(1){top:22px;transform:rotate(45deg)}
.top.menu-open .menu-btn span:nth-child(2){opacity:0}
.top.menu-open .menu-btn span:nth-child(3){top:22px;transform:rotate(-45deg)}
@media(max-width:1000px){
  .menu-btn{display:block}
  .top .wrap{position:relative}
  .top nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;gap:0;padding:8px var(--m) 18px;box-shadow:0 14px 28px rgba(14,58,32,.14);border-radius:0 0 20px 20px}
  .top.menu-open nav{display:flex}
  .top nav a{font-size:1.125rem;padding:15px 4px;border-top:1px solid var(--m100)}
  .top nav a:first-child{border-top:0}
}
@media(max-width:480px){.hd-long{display:none}.top .wrap{gap:12px}.brand img{height:46px}}

/* precios por tipo de proyecto */
.tiers{padding:0 0 clamp(72px,9vw,128px)}
.tier-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tier{border-radius:24px;padding:clamp(26px,3.4vw,44px);display:flex;flex-direction:column;align-items:flex-start;gap:0}
.tier.t1{background:var(--g800);color:#fff}
.tier.t2{background:var(--m100);color:var(--ink)}
.tier h3{font-size:var(--fs-m);margin-bottom:.45em;line-height:1.1}
.tier.t1 h3{color:#fff}
.tier>p{font-size:var(--fs-b);margin-bottom:1.1em;max-width:40ch}
.tier.t1>p{color:#d4e8d9}.tier.t2>p{color:var(--mut)}
.tier .specs{margin-bottom:1.8em}
.tier.t1 .specs li{color:#fff}
.tier .btn{margin-top:auto}
@media(max-width:1000px){.tier-grid{grid-template-columns:1fr}}

/* calculadora por rollos */
.calc{gap:6px}
.crow{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;padding:12px 4px}
.crow+.crow{border-top:1px solid var(--m100)}
.crow .cl b{display:block;color:var(--g900);font-size:1.0625rem}
.crow .cl small{display:block;color:var(--mut);font-size:var(--fs-s)}
.crow .eq{display:block;min-height:1.4em;margin-top:2px;color:var(--g600);font-weight:700;font-size:var(--fs-s)}
.step{display:flex;align-items:center;gap:6px;background:var(--m50);border-radius:999px;padding:4px}
.step button{width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:var(--g800);font:700 1.5rem/1 var(--sans);cursor:pointer;display:grid;place-items:center;transition:background-color .15s,transform .15s}
.step button:hover{background:var(--m200)}
.step button:active{transform:scale(.92)}
.step input{width:52px;min-height:42px;padding:0;text-align:center;background:transparent;border:0;font-weight:800;font-size:1.25rem;-moz-appearance:textfield}
.step input::-webkit-outer-spin-button,.step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.step input:focus{background:#fff;border-radius:10px}
@media(max-width:620px){.crow{grid-template-columns:1fr}.step{justify-self:start}}

/* cierre y pie en salvia: dos tonos */
:root{--sv-1:#bccbb4;--sv-2:#a4b79b}
.close{background:var(--sv-1);color:var(--g900)}
.close h2{color:var(--g900)}
.close .t p{color:#203a29}
.close .c a{color:var(--g900)}
.close .c a:hover{color:var(--g600)}
.close .c small{color:#2f4a38}
.close .btn,.close .btn.light{background:var(--g600);color:#fff}
.close .btn:hover,.close .btn.light:hover{background:var(--g700)}
footer{background:var(--sv-2);color:#1c3625}
footer h4{color:var(--g900)}
footer a{color:#1c3625}
footer a:hover{color:var(--g700)}
footer .imp{color:#2f4a38}
footer .ab p{color:#1c3625}
.close :focus-visible,footer :focus-visible{outline-color:var(--g800)}
