@font-face{font-family:'Big Shoulders Display';font-weight:700;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/big-shoulders-display@5.3.0/files/big-shoulders-display-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Big Shoulders Display';font-weight:800;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/big-shoulders-display@5.3.0/files/big-shoulders-display-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Big Shoulders Display';font-weight:900;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/big-shoulders-display@5.3.0/files/big-shoulders-display-latin-900-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:400;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/barlow@5.3.0/files/barlow-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:500;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/barlow@5.3.0/files/barlow-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:600;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/barlow@5.3.0/files/barlow-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:700;font-style:normal;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/barlow@5.3.0/files/barlow-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:400;font-style:italic;font-display:swap;src:url(https://cdn.jsdelivr.net/npm/@fontsource/barlow@5.3.0/files/barlow-latin-400-italic.woff2) format('woff2')}
:root{
  --kraft:#d4b083; --kraft-claro:#e6cfac; --kraft-osc:#7a5a35;
  --tinta:#1b2a1f; --verde:#1f5c2e; --verde-osc:#14401f; --lima:#8cc63f;
  --blanco:#ffffff; --gris:#5b6660; --linea:#d9d2c5;
  --display:'Big Shoulders Display',Impact,'Arial Narrow',sans-serif;
  --texto:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ancho:72rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--blanco);color:var(--tinta);font:400 1.0625rem/1.6 var(--texto);-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:var(--verde)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--lima);outline-offset:2px}
h1,h2,h3{font-family:var(--display);line-height:1.02;margin:0;letter-spacing:.005em}
h1{font-size:clamp(2.9rem,7vw,5.6rem);font-weight:900}
h2{font-size:clamp(2.1rem,4.4vw,3.3rem);font-weight:800}
h3{font-size:1.55rem;font-weight:800}
p{margin:0}
.envoltura{max-width:var(--ancho);margin:0 auto;padding:0 1.25rem}
.saltar{position:absolute;left:-9999px}
.saltar:focus{left:1rem;top:1rem;z-index:20;background:var(--blanco);padding:.5rem 1rem}

/* Barra */
.barra{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--linea);backdrop-filter:blur(6px)}
.barra__in{display:flex;align-items:center;justify-content:space-between;height:4.25rem}
.marca{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--tinta)}
.marca__caja{width:2.4rem;height:2.4rem}
.marca__txt{font-family:var(--display);font-size:1.7rem;font-weight:800;margin:0}
.marca__txt b{color:var(--verde)}
.menu__btn{display:none;font:600 1rem var(--texto);background:none;border:2px solid var(--tinta);border-radius:.4rem;padding:.35rem .9rem;color:var(--tinta)}
.menu__lista{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0;align-items:center}
.menu__lista a{color:var(--tinta);text-decoration:none;font-weight:600}
.menu__lista a:hover{color:var(--verde)}
.menu__lista .menu__cta{background:var(--verde);color:var(--blanco);padding:.5rem 1.1rem;border-radius:.4rem}
.menu__lista .menu__cta:hover{background:var(--verde-osc);color:var(--blanco)}

/* Botones */
.boton{display:inline-block;font:700 1.08rem var(--texto);text-decoration:none;padding:.9rem 1.5rem;border-radius:.4rem;border:2px solid transparent;cursor:pointer}
.boton--verde{background:var(--verde);color:var(--blanco)}
.boton--verde:hover{background:var(--verde-osc)}
.boton--linea{border-color:var(--tinta);color:var(--tinta)}
.boton--linea:hover{background:var(--tinta);color:var(--kraft-claro)}

/* Héroe: el cartón mismo */
.heroe{position:relative;background:
  repeating-linear-gradient(90deg,rgba(122,90,53,.07) 0 2px,transparent 2px 9px),
  linear-gradient(180deg,var(--kraft-claro),var(--kraft));padding:4.5rem 0 0;overflow:hidden}
.heroe__in{display:grid;grid-template-columns:1.25fr .9fr;gap:3rem;align-items:center;padding-bottom:4rem}
.heroe h1{max-width:13ch;color:var(--tinta)}
.heroe__sub{margin-top:1.4rem;max-width:36rem;font-size:1.2rem;color:#3a3326}
.heroe__acciones{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
.heroe__datos{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;list-style:none;padding:0;margin:2.2rem 0 0;color:#3a3326}
.heroe__datos b{color:var(--verde-osc)}
.sello{margin:0;color:var(--verde);transform:rotate(-8deg);opacity:.92;mix-blend-mode:multiply;justify-self:center;width:min(22rem,100%)}
@media (prefers-reduced-motion:no-preference){
  .sello{animation:sellar .55s cubic-bezier(.2,1.6,.4,1) .25s both}
  @keyframes sellar{from{transform:rotate(-8deg) scale(1.35);opacity:0}to{transform:rotate(-8deg) scale(1);opacity:.92}}
}
.flauta{width:100%;height:28px;background:var(--kraft-claro)}

/* Secciones */
.seccion{padding:5.5rem 0}
.seccion--kraft{background:var(--kraft-claro)}
.seccion--verde{background:var(--verde-osc);color:#eef3ea}
.seccion--verde a{color:var(--lima)}
.encabezado{max-width:42rem;margin-bottom:2.8rem}
.encabezado p{margin-top:1rem;color:var(--gris);font-size:1.12rem}
.seccion--kraft .encabezado p{color:#4c4232}
.dos{display:grid;grid-template-columns:1fr 1.1fr;gap:3.5rem;align-items:start}
.dos .encabezado{margin-bottom:0}

/* Formatos con su suaje */
.formatos{display:grid;grid-template-columns:repeat(4,1fr);gap:2.2rem}
.formato h3{margin-top:1rem}
.formato p{margin-top:.5rem;color:var(--gris)}
.suaje{width:100%;aspect-ratio:22/15;background:var(--kraft-claro);border-radius:.3rem;padding:.6rem}
.suaje .corte path,.suaje .corte rect,.suaje .corte circle{fill:var(--kraft);stroke:var(--tinta);stroke-width:2}
.suaje .doblez path{fill:none;stroke:var(--verde);stroke-width:1.6;stroke-dasharray:5 4}
.suaje .flautas path{fill:none;stroke:var(--kraft-osc);stroke-width:2}
.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:3.5rem 0 0;border-top:3px solid var(--tinta)}
.specs div{padding:1.1rem 1.4rem 0 0}
.specs dt{font-family:var(--display);font-weight:800;font-size:1.3rem}
.specs dd{margin:.3rem 0 0;color:var(--gris)}

/* Precios */
.tabla-precio table{width:100%;border-collapse:collapse;margin-bottom:2rem;background:var(--blanco)}
.tabla-precio caption{text-align:left;font-weight:700;padding-bottom:.5rem}
.tabla-precio th,.tabla-precio td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--linea)}
.tabla-precio thead th{font-size:.92rem;color:var(--gris);font-weight:600}
.tabla-precio td{text-align:right;font-family:var(--display);font-size:1.6rem;font-weight:800;color:var(--verde)}
.tabla-precio thead th:last-child{text-align:right}
.tabla-precio tbody th{font-weight:600}
.tabla-precio small{display:block;font-weight:400;color:var(--gris)}
.nota{font-size:.95rem;color:var(--gris);margin-top:1rem}
.seccion--kraft .nota{color:#4c4232}

.lista-precios{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
.lista-precios h3{font-size:1.4rem;padding-bottom:.4rem;border-bottom:3px solid var(--tinta);margin-bottom:.4rem}
.lista-precios h3:not(:first-child){margin-top:2rem}
.lista-precios ul{list-style:none;margin:0;padding:0}
.lista-precios li{display:flex;align-items:baseline;gap:.5rem;padding:.4rem 0}
.lista-precios li span:first-child{flex:1;display:flex;align-items:baseline;gap:.5rem}
.lista-precios li span:first-child::after{content:"";flex:1;border-bottom:2px dotted var(--linea);transform:translateY(-.25rem)}
.lista-precios li span:last-child{font-weight:700;white-space:nowrap}

/* Pasos */
.seccion--verde h2{color:var(--blanco)}
.pasos{list-style:none;counter-reset:paso;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.pasos li{counter-increment:paso;border-top:3px solid var(--lima);padding-top:1rem}
.pasos li::before{content:counter(paso);font-family:var(--display);font-weight:900;font-size:3.4rem;line-height:1;color:var(--lima)}
.pasos h3{margin-top:.6rem;color:var(--blanco)}
.pasos p{margin-top:.5rem;color:#c9d6c6}
.letra-chica{margin-top:3rem;border-top:1px solid rgba(255,255,255,.2);padding-top:1.2rem}
.letra-chica summary{cursor:pointer;font-weight:700;color:var(--blanco)}
.letra-chica ul{margin:1rem 0 0;padding-left:1.2rem;color:#c9d6c6;max-width:46rem}
.letra-chica li{margin:.3rem 0}

/* Cotizar */
.contacto{list-style:none;padding:0;margin:1.8rem 0 0;font-size:1.12rem}
.contacto li{margin:.35rem 0}
.contacto a{font-weight:700;text-decoration:none}
.formulario{display:grid;gap:1.1rem;background:var(--kraft-claro);padding:1.8rem;border-radius:.4rem}
.campo{display:grid;gap:.35rem;border:0;margin:0;padding:0;min-width:0}
.campo label,.campo legend{font-weight:600}
.opc{font-weight:400;color:var(--gris)}
.formulario input,.formulario select,.formulario textarea{font:inherit;width:100%;padding:.7rem .8rem;border:2px solid #b89a72;border-radius:.3rem;background:var(--blanco);color:var(--tinta)}
.medidas{grid-template-columns:repeat(3,1fr);gap:.8rem}
.medidas legend{grid-column:1/-1;margin-bottom:.35rem}
.medidas label{display:grid;gap:.25rem;font-weight:400}
.error{color:#9b1c1c;font-weight:600}
.formulario .boton{justify-self:start}

/* Pie */
.pie{background:var(--tinta);color:#cfd6cf;padding:3rem 0}
.pie__in{display:grid;gap:.6rem}
.pie .marca__txt{color:var(--blanco)}
.pie .marca__txt b{color:var(--lima)}
.pie ul{display:flex;flex-wrap:wrap;gap:1.4rem;list-style:none;padding:0;margin:.6rem 0 0}
.pie a{color:var(--blanco)}

.flotante{position:fixed;right:1rem;bottom:1rem;z-index:9;background:#1fa855;color:var(--blanco);font-weight:700;text-decoration:none;padding:.8rem 1.2rem;border-radius:2rem;box-shadow:0 6px 18px rgba(20,64,31,.35)}

/* Páginas de texto */
.texto-legal{max-width:46rem;padding:4rem 1.25rem}
.texto-legal h1{font-size:clamp(2.4rem,6vw,3.6rem)}
.texto-legal h2{font-size:1.7rem;margin-top:2.2rem}
.texto-legal p,.texto-legal li{margin-top:.8rem}

@media (max-width:960px){
  .heroe__in,.dos{grid-template-columns:1fr}
  .sello{width:min(16rem,70%);justify-self:start}
  .formatos,.specs,.pasos{grid-template-columns:repeat(2,1fr)}
  .lista-precios{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:1rem}
  .menu__btn{display:block}
  .menu__lista{display:none;position:absolute;left:0;right:0;top:4.25rem;background:var(--blanco);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1rem;border-bottom:1px solid var(--linea)}
  .menu__lista.abierto{display:flex}
  .menu__lista a{display:block;padding:.75rem 0}
  .menu__lista .menu__cta{text-align:center;margin-top:.5rem}
  .heroe{padding-top:3rem}
  .formatos,.specs,.pasos,.lista-precios{grid-template-columns:1fr}
  .seccion{padding:4rem 0}
  .formulario{padding:1.2rem}
  .heroe__acciones .boton{width:100%;text-align:center}
}
.texto-legal .boton{margin-top:2rem}