/* Logística en Reciclaje SLP — Home (B2), diseño aprobado por Cheluy en
   Claude.ai. Contenido fiel a la exportación aprobada; única adaptación
   técnica es la ruta de la textura de grano (este archivo vive en
   public/, no en public/css/). Ver docs/project-memory una vez cerrado B2. */

:root{
  --paper:#F7F4EC;
  --paper-deep:#ECE6D6;
  --stone:#C9C4A8;
  --ink:#17251D;
  --forest:#1C3A28;
  --forest-2:#28553A;
  --teal:#1E3742;
  --moss:#5A7F58;
  --bronze:#6B6151;
  --cream:#F3EFE1;
  --line: rgba(23,37,29,0.15);
  --line-on-dark: rgba(243,239,225,0.22);
  --maxw:1240px;
  --text-max: 62ch;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:'Work Sans',ui-sans-serif,system-ui,sans-serif;
  font-weight:400;line-height:1.6;font-size:16.5px;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:2000;
  background-image:url('assets/images/grain-texture.webp');
  background-size:170px 170px;background-repeat:repeat;
  mix-blend-mode:overlay;opacity:.5;
}
h1,h2,h3,.serif{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;margin:0;color:inherit;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;}
:focus-visible{outline:2px solid var(--forest);outline-offset:3px;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,64px);}

/* ---------------- NAV ---------------- */
header.site-nav{
  position:sticky;top:0;z-index:80;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--maxw);margin:0 auto;
  padding:16px clamp(20px,5vw,64px);
  display:flex;align-items:center;justify-content:flex-start;gap:clamp(36px,6vw,90px);
}
.brand{display:flex;align-items:center;gap:9px;}
.brand img.mark{height:60px;width:auto;}
nav.links{display:flex;align-items:center;gap:clamp(20px,3.2vw,42px);flex:1;}
nav.links a{
  font-size:14.5px;color:var(--ink);opacity:.68;
  padding:4px 0;border-bottom:1px solid transparent;
  transition:opacity .15s ease, border-color .15s ease;white-space:nowrap;
}
nav.links a:hover{opacity:1;}
nav.links a[aria-current="page"]{opacity:1;border-color:var(--forest);}
.nav-cta{
  background:var(--forest);color:var(--cream)!important;
  font-weight:500;font-size:14px;padding:10px 18px;
  opacity:1!important;border-radius:1px;
  margin-left:auto;
}
.nav-cta:hover{background:var(--forest-2);}
.navtoggle{display:none;background:none;border:1px solid var(--line);color:var(--ink);padding:8px 12px;font-size:14px;}
@media (max-width:780px){
  nav.links{
    position:fixed;inset:64px 0 0 0;background:var(--paper);
    flex-direction:column;align-items:flex-start;padding:20px clamp(20px,5vw,64px);
    display:none;gap:2px;overflow-y:auto;
  }
  nav.links.open{display:flex;}
  nav.links a{width:100%;padding:16px 0;border-bottom:1px solid var(--line);font-size:18px;opacity:.85;}
  .nav-cta{margin-top:14px;text-align:center;}
  .navtoggle{display:block;}
}

/* ---------------- generic section rhythm ---------------- */
section{padding:clamp(72px,11vw,148px) 0;}
section.tight{padding:clamp(48px,7vw,88px) 0;}
section.on-dark{background:var(--forest);color:var(--cream);}
section.on-dark.teal{background:var(--teal);}
section.on-deep{background:var(--paper-deep);}
section.stone{background:var(--stone);}
section.stone .eyebrow{color:var(--forest);}
.eyebrow{font-size:13.5px;color:var(--moss);margin:0 0 16px;letter-spacing:.01em;}
.lead{font-size:clamp(17px,1.6vw,19px);color:var(--ink);opacity:.78;max-width:var(--text-max);margin-top:18px;}
section.on-dark .lead{color:var(--cream);opacity:.82;}

/* ---------------- HERO — split verde/foto ---------------- */
.hero{padding:0;overflow:hidden;}
.hero-split{display:grid;grid-template-columns:45fr 55fr;min-height:calc(90vh - 93px);}
.hero-left{
  background:linear-gradient(165deg, var(--forest-2) 0%, #142A1D 78%);
  color:var(--cream);
  padding:clamp(32px,4.6vw,60px) clamp(28px,4vw,52px);
  display:flex;flex-direction:column;justify-content:center;
}
.hero-right{position:relative;overflow:hidden;}
.hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 40%;display:block;}

.wordmark-sig{margin-bottom:clamp(22px,3.2vw,34px);}
.wm-name{
  font-family:'Spectral';font-weight:700;text-transform:uppercase;
  font-size:clamp(32px,3.4vw,50px);line-height:1.08;letter-spacing:-.004em;
  color:var(--cream);margin:0;
}
.wm-legal{
  font-family:'Work Sans';font-weight:600;text-transform:uppercase;
  font-size:clamp(15px,1.3vw,19px);letter-spacing:1px;
  color:#DCEAF0;margin:7px 0 0;
}
.hero h1{font-size:clamp(24px,2.4vw,34px);line-height:1.12;letter-spacing:-.005em;color:var(--cream);max-width:26ch;}
.hero .lead{margin-top:16px;font-size:clamp(15px,1.1vw,16px);color:var(--cream);opacity:.72;max-width:40ch;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px;}
@media (max-width:480px){
  .hero-actions{flex-direction:column;align-items:stretch;gap:10px;}
  .hero-actions .btn{justify-content:center;width:100%;white-space:nowrap;}
}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 24px;font-size:15px;font-weight:500;
  border:1px solid var(--ink);transition:all .15s ease;border-radius:1px;
}
.hero .btn{padding:12px 22px;font-size:14.5px;border-color:transparent;}
.hero .btn-primary{background:var(--cream);color:var(--forest-2);}
.hero .btn-primary:hover{background:#fff;}
.hero .btn-ghost{background:transparent;color:var(--cream);border-color:rgba(243,239,225,.62);}
.hero .btn-ghost:hover{background:rgba(243,239,225,.12);}
.btn-primary{background:var(--forest);border-color:var(--forest);color:var(--cream);}
.btn-primary:hover{background:var(--forest-2);border-color:var(--forest-2);}
.btn-ghost{background:transparent;border-color:var(--ink);color:var(--ink);}
.btn-ghost:hover{background:var(--ink);color:var(--paper);}
section.on-dark .btn-ghost{border-color:var(--line-on-dark);color:var(--cream);}
section.on-dark .btn-ghost:hover{background:var(--cream);color:var(--forest);}
@media (max-width:900px){
  .hero-split{grid-template-columns:1fr;min-height:0;}
  .hero-left{padding:24px 22px 14px;}
  .hero h1{font-size:22px;max-width:100%;}
  .hero-right{height:clamp(190px,50vw,260px);}
  .wordmark-sig{margin-bottom:14px;}
  .wm-name{font-size:clamp(28px,8.6vw,34px);}
  .wm-legal{font-size:14px;letter-spacing:.8px;margin-top:6px;}
  .hero .lead{margin-top:10px;font-size:13.5px;line-height:1.42;max-width:none;}
  .hero-actions{margin-top:10px;gap:8px;}
  .hero-actions .btn{padding:9px 20px;}
}

.swatch{position:relative;overflow:hidden;aspect-ratio:4/5;}
.swatch::before{
  content:"";position:absolute;inset:0;
}
.swatch::after{
  content:"";position:absolute;top:-20%;left:-10%;width:70%;height:160%;
  background:linear-gradient(100deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.15) 50%, rgba(255,255,255,0) 60%);
  transform:rotate(8deg);
}
.swatch.bronze::before{background:linear-gradient(155deg,#7A6F5C 0%, #4E463A 60%, #322D25 100%);}

/* ---- media: photographic integrations (B2) ---- */
.media-frame{position:relative;overflow:hidden;}
.media-frame img{width:100%;height:100%;object-fit:cover;display:block;}
.phrase-media{position:absolute;inset:0;z-index:0;}
.phrase-media img{width:100%;height:100%;object-fit:cover;display:block;}
.phrase-1{position:relative;overflow:hidden;}
.phrase-1 .phrase-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg, rgba(15,23,18,.86) 0%, rgba(15,23,18,.55) 45%, rgba(15,23,18,.22) 100%);
}
.phrase-1 .wrap{position:relative;z-index:1;}
.climax{position:relative;overflow:hidden;}
.climax .phrase-media img{filter:saturate(.92);}
.climax .phrase-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(175deg, rgba(30,55,66,.82) 0%, rgba(28,58,40,.72) 55%, rgba(18,32,26,.88) 100%);
}
.climax .wrap{position:relative;z-index:1;}
.mat-media{margin-top:40px;aspect-ratio:3/1;}
@media (max-width:640px){.mat-media{aspect-ratio:4/3;}}

.trust-strip{border-top:1px solid rgba(243,239,225,.18);margin-top:clamp(32px,4.6vw,48px);padding-top:18px;
  display:flex;flex-wrap:wrap;gap:8px 24px;font-size:12.5px;color:var(--cream);opacity:.74;}
@media (max-width:900px){
  .trust-strip{margin-top:12px;padding-top:10px;}
  .trust-strip span:nth-child(2),.trust-strip span:nth-child(3){display:none;}
}

/* ---------------- TRAYECTORIA ---------------- */
.yr-grid{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,4vw,56px);align-items:start;}
.yr-num{font-family:'Fraunces';font-weight:300;font-size:clamp(76px,11vw,148px);line-height:.85;color:var(--forest);}
.yr-grid p{margin:0 0 16px;max-width:var(--text-max);}
@media (max-width:760px){.yr-grid{grid-template-columns:1fr;}}

/* ---------------- EVIDENCIA list ---------------- */
.proof-list{
  margin-top:44px;display:grid;grid-template-columns:1fr 1fr;
  column-gap:56px;
}
.proof-item{
  display:flex;gap:16px;padding:20px 0;border-top:1px solid var(--line);
}
.proof-item svg{flex:none;width:22px;height:22px;color:var(--forest);margin-top:2px;}
.proof-item h3{font-size:16.5px;font-family:'Work Sans';font-weight:600;margin:0 0 4px;}
.proof-item p{margin:0;font-size:14.5px;opacity:.72;}
@media (max-width:760px){.proof-list{grid-template-columns:1fr;column-gap:0;}}

/* ---------------- MATERIALES teaser (type as image) ---------------- */
.mat-type{margin-top:28px;}
.mat-type span{
  font-family:'Fraunces';font-weight:500;display:block;
  font-size:clamp(30px,5.6vw,64px);line-height:1.08;
}
.mat-type span:nth-child(2){padding-left:.6em;opacity:.82;}
.mat-type span:nth-child(3){padding-left:1.2em;opacity:.64;}
.mat-type span:nth-child(4){padding-left:.3em;opacity:.82;}

/* ---------------- PHRASE moments ---------------- */
.phrase{
  display:flex;align-items:center;min-height:56vh;
}
.phrase blockquote{
  margin:0;font-family:'Fraunces';font-style:italic;font-weight:400;
  font-size:clamp(30px,5.4vw,58px);line-height:1.16;max-width:16ch;
}
.phrase-1 .wrap{display:flex;justify-content:flex-start;}
.phrase-2{background:var(--paper-deep);}
.phrase-2 .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.phrase-2 .swatch,.phrase-2 .media-frame{aspect-ratio:1/1;}
.phrase-2 blockquote{text-align:right;margin-left:auto;}
@media (max-width:820px){.phrase-2 .wrap{grid-template-columns:1fr;}.phrase-2 blockquote{text-align:left;margin-left:0;}}

.climax{min-height:78vh;display:flex;align-items:center;justify-content:center;text-align:center;
  background:linear-gradient(175deg,var(--teal) 0%, var(--forest) 60%, #12201A 100%);color:var(--cream);}
.climax .wrap{display:flex;flex-direction:column;align-items:center;}
.climax blockquote{
  margin:0;font-family:'Fraunces';font-style:italic;font-weight:400;
  font-size:clamp(34px,7vw,84px);line-height:1.08;max-width:16ch;
}
.climax .after{margin-top:30px;font-size:15px;opacity:.72;max-width:46ch;}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .8s ease, transform .8s ease;}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ---------------- PROCESO ---------------- */
.proceso{background:var(--ink);color:var(--cream);}
@media (max-width:640px){.proceso{padding-bottom:40px;}}
.proceso .eyebrow{color:var(--cream);opacity:.55;}
.proc-track{margin-top:56px;display:grid;grid-template-columns:repeat(6,1fr);gap:0;border-top:1px solid var(--line-on-dark);}
.proc-step{padding:26px 18px 0 0;border-left:1px solid var(--line-on-dark);padding-left:18px;}
.proc-step:first-child{border-left:none;padding-left:0;}
.proc-step .rn{font-family:'Fraunces';font-style:italic;font-size:15px;opacity:.55;margin-bottom:14px;display:block;}
.proc-step h3{font-size:19px;margin-bottom:8px;}
.proc-step p{font-size:13px;opacity:.68;margin:0;}
@media (max-width:980px){
  .proc-track{grid-template-columns:1fr;border-top:none;}
  .proc-step{border-left:none;border-top:1px solid var(--line-on-dark);padding:28px 0 0;}
  .proc-step:first-child{border-top:none;}
}
/* HOME-PROC-OVERFLOW-001 — franja 981–1016px: el mínimo automático de las
   6 columnas (min-content de cada .proc-step) desborda .proc-track antes de
   llegar al breakpoint de 980px. Corrección acotada exclusivamente a esa
   franja, sin alterar la composición desigual del FINAL en el resto de anchos. */
@media (min-width:981px) and (max-width:1016px){
  .proc-track{grid-template-columns:repeat(6,minmax(0,1fr));}
}

/* ---------------- RESOLUTION / CTA strip ---------------- */
.resolve{text-align:center;position:relative;}
.resolve::before{
  content:"";position:absolute;top:0;left:0;right:0;height:clamp(60px,10vw,140px);
  background:linear-gradient(to bottom, rgba(15,23,18,.16), rgba(15,23,18,0));
  pointer-events:none;
}
.resolve h2{font-size:clamp(28px,4vw,44px);max-width:20ch;margin:0 auto;}
.resolve .lead{margin-left:auto;margin-right:auto;}
.resolve .btn{margin-top:30px;}

/* ---------------- generic detail pages (reservado para B3: Nosotros /
   Servicios / Materiales / Contacto — sin consumidor en esta Home) ---------------- */
.page-head{padding-top:clamp(56px,8vw,96px);padding-bottom:0;}
.page-head h2{font-size:clamp(34px,5vw,58px);max-width:18ch;}

.simple-list{margin-top:36px;border-top:1px solid var(--line);}
.simple-row{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);}
.simple-row .rn{font-family:'Fraunces';font-style:italic;font-size:17px;opacity:.5;}
.simple-row h3{font-size:21px;margin-bottom:6px;}
.simple-row p{margin:0;opacity:.74;font-size:14.5px;max-width:56ch;}
@media (max-width:640px){.simple-row{grid-template-columns:1fr;}}

.two-col-list{display:grid;grid-template-columns:1fr 1px 1fr;gap:0 44px;margin-top:44px;}
.two-col-list .rule{background:var(--line);}
.two-col-list h3{font-size:19px;margin-bottom:4px;}
.two-col-list .sub{opacity:.6;font-size:13.5px;margin-bottom:20px;}
.two-col-list ul{list-style:none;margin:0;padding:0;}
.two-col-list li{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:14.5px;}
.two-col-list li:first-child{border-top:none;}
.two-col-list .dot{width:6px;height:6px;border-radius:50%;background:var(--forest);margin-top:8px;flex:none;}
.two-col-list .no li .dot{background:var(--bronze);}
.two-col-list .no li{opacity:.75;}
@media (max-width:820px){.two-col-list{grid-template-columns:1fr;}.two-col-list .rule{display:none;}}

.who-list{margin-top:40px;display:flex;flex-direction:column;gap:22px;max-width:70ch;}
.who-list div{padding-top:18px;border-top:1px solid var(--line);}
.who-list h3{font-family:'Work Sans';font-weight:600;font-size:16px;margin:0 0 6px;}
.who-list p{margin:0;opacity:.74;font-size:14.5px;}

.infra-list{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;column-gap:56px;}
@media (max-width:760px){.infra-list{grid-template-columns:1fr;}}

.yr-mini{display:flex;gap:36px;margin-top:52px;flex-wrap:wrap;}
.yr-mini div{min-width:160px;}
.yr-mini .lab{font-size:12.5px;opacity:.55;margin-bottom:6px;}
.yr-mini .v{font-family:'Fraunces';font-size:22px;}

/* ---------------- CONTACT (reservado para B4: formulario real —
   sin consumidor en esta Home) ---------------- */
.contact-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:clamp(40px,6vw,90px);margin-top:48px;}
.cinfo-row{padding:18px 0;border-top:1px solid var(--line);}
.cinfo-row:first-child{border-top:none;padding-top:0;}
.cinfo-row .lab{font-size:12.5px;opacity:.55;margin-bottom:6px;}
.cinfo-row .v{font-size:17.5px;font-family:'Fraunces';font-weight:500;}
.cinfo-row a.v:hover{color:var(--forest);}
.field{margin-bottom:26px;}
.field label{display:block;font-size:13px;opacity:.6;margin-bottom:8px;}
.field input,.field textarea{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--ink);
  color:var(--ink);padding:8px 0;font-family:inherit;font-size:16px;
}
.field input:focus,.field textarea:focus{border-bottom-color:var(--forest);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr;}.field-row{grid-template-columns:1fr;}}
.form-note{font-size:12.5px;opacity:.55;margin-top:6px;}

/* ---------------- FOOTER ---------------- */
footer{border-top:1px solid var(--line);background:var(--paper-deep);}
.foot-inner{max-width:var(--maxw);margin:0 auto;padding:40px clamp(20px,5vw,64px);
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.foot-brand{display:flex;align-items:center;gap:10px;}
.foot-brand img{height:22px;}
footer .fmeta{font-size:12.5px;opacity:.6;}

/* ---------------- utilidades heredadas (accesibilidad) ---------------- */
.skip-link{
  position:absolute;left:-9999px;top:auto;z-index:3000;
  background:var(--forest);color:var(--cream);
  padding:12px 20px;border-radius:2px;
}
.skip-link:focus{left:16px;top:16px;}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* =================================================================
   /materiales-reciclables (B3.1) — reglas aditivas, no tocan nada de
   lo anterior. Superficie `.ink` y componentes con nombre único son
   globales/reutilizables (sin colisión posible en el markup actual).
   Ritmo/`.eyebrow`/`.lead` propios del diseño aprobado van bajo
   `body.p-materiales` para no alterar los valores globales que usa
   la Home (DEC-2026-009 — Home no se toca). El contraste corregido
   de `.eyebrow` (forest en vez de moss, WCAG AA) se preserva dentro
   de este scope; el mismo hallazgo en Home queda fuera de B3.1,
   pendiente de una decisión de sistema aparte. ================= */

/* ---- superficie ink (nueva, sin uso en Home; segura sin scope) ---- */
section.ink{background:var(--ink);color:var(--cream);}

/* ---- ritmo y tipografía base, solo dentro de esta página ----
   Los overrides contextuales (.page-intro, section.ink/.on-dark) se
   escriben con `body.p-materiales` + selector anidado a propósito,
   para que su especificidad sea mayor que la de las reglas base de
   abajo y ganen la cascada de forma predecible (no por orden de
   aparición) — evita que un eyebrow/lead quede con el color/ancho
   base en vez del contextual. */
body.p-materiales section{padding:clamp(56px,8vw,96px) 0;}
body.p-materiales .eyebrow{font-size:13.5px;color:var(--forest);margin:0 0 14px;letter-spacing:.01em;}
body.p-materiales .lead{font-size:clamp(16.5px,1.4vw,18px);opacity:.78;max-width:var(--text-max);margin-top:16px;line-height:1.6;}
body.p-materiales section.ink .eyebrow{color:#9FC79A;}
body.p-materiales section.ink .lead{color:var(--cream);opacity:.82;}

/* ---- intro de página (componente nuevo) ---- */
.page-intro{background:linear-gradient(165deg, var(--forest-2) 0%, #142A1D 82%);color:var(--cream);}
.page-intro h1{font-size:clamp(34px,4.6vw,58px);line-height:1.06;letter-spacing:-.006em;max-width:16ch;}
body.p-materiales .page-intro .eyebrow{color:var(--cream);opacity:.8;}
body.p-materiales .page-intro .lead{color:var(--cream);opacity:.82;max-width:52ch;margin-top:20px;}
.intro-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:34px;}
.intro-actions .btn-ghost-sm{
  display:inline-flex;align-items:center;padding:12px 22px;
  border:1px solid rgba(243,239,225,.55);color:var(--cream);
  font-size:14px;font-weight:500;border-radius:1px;transition:background .15s ease;
}
.intro-actions .btn-ghost-sm:hover{background:rgba(243,239,225,.12);}
.page-intro .scrolldown{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;color:var(--cream);opacity:.65;
}
@media (max-width:480px){
  .intro-actions{flex-direction:column;align-items:flex-start;gap:16px;}
}

/* ---- grupos de materiales (componente nuevo) ---- */
.mat-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px;}
.mat-group{background:var(--paper);padding:30px 28px;}
.mat-group h3{font-size:14px;text-transform:uppercase;letter-spacing:.04em;color:var(--moss);font-weight:600;font-family:'Work Sans';margin:0 0 18px;}
.mat-group ul{list-style:none;margin:0;padding:0;}
.mat-group li{
  font-family:'Fraunces';font-size:clamp(19px,1.7vw,23px);font-weight:500;
  padding:12px 0;border-top:1px solid var(--line);color:var(--ink);
}
.mat-group li:first-child{border-top:none;padding-top:0;}
body.p-materiales .mat-group-link{display:inline-block;margin-top:16px;font-size:13px;opacity:.65;text-decoration:underline;text-underline-offset:3px;}
body.p-materiales .mat-group-link:hover{opacity:1;}
@media (max-width:820px){.mat-groups{grid-template-columns:1fr;}}
.mat-note{margin-top:28px;font-size:13.5px;opacity:.62;max-width:60ch;}

/* ---- condiciones comerciales (componente nuevo) ---- */
.terms-list{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:0 56px;}
.terms-list > div{padding:20px 0;border-top:1px solid var(--line);}
.terms-list > div:nth-child(1),.terms-list > div:nth-child(2){border-top:none;padding-top:0;}
.terms-list h3{font-size:16px;font-family:'Work Sans';font-weight:600;margin:0 0 6px;}
.terms-list p{margin:0;font-size:14.5px;opacity:.75;}
@media (max-width:760px){.terms-list{grid-template-columns:1fr;}.terms-list > div:nth-child(2){border-top:1px solid var(--line);padding-top:20px;}}

/* ---- foto editorial con leyenda (componente nuevo) ---- */
.media-band{position:relative;overflow:hidden;height:clamp(260px,42vw,460px);}
.media-band img{width:100%;height:100%;object-fit:cover;display:block;}
.media-caption{
  max-width:var(--maxw);margin:16px auto 0;padding:0 clamp(20px,5vw,64px);
  font-size:13px;opacity:.55;
}

/* ---- lista de exclusiones (componente nuevo) ---- */
.exclude-list{margin-top:36px;columns:2;column-gap:48px;list-style:none;padding:0;}
.exclude-list li{
  break-inside:avoid;font-size:15.5px;padding:11px 0;border-top:1px solid var(--line-on-dark);
  display:flex;gap:10px;
}
.exclude-list li:first-child,.exclude-list li:nth-child(2){border-top:none;}
.exclude-list .x{flex:none;opacity:.55;font-family:'Fraunces';font-style:italic;}
@media (max-width:640px){.exclude-list{columns:1;}.exclude-list li:nth-child(2){border-top:1px solid var(--line-on-dark);}}

/* ---- cierre de página (componente nuevo; .btn con ámbito propio,
   sin tocar el .btn global del Hero) ---- */
.closing{text-align:center;}
.closing h2{font-size:clamp(28px,3.6vw,42px);max-width:22ch;margin:0 auto;}
.closing .lead{margin-left:auto;margin-right:auto;}
.closing .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--forest);background:var(--forest);color:var(--cream);
  border-radius:1px;transition:background .15s ease;margin-top:30px;
}
.closing .btn:hover{background:var(--forest-2);}
.closing .back{display:block;margin-top:18px;font-size:13.5px;opacity:.6;text-decoration:underline;text-underline-offset:3px;}

/* =================================================================
   /servicios-para-empresas (B3.2) — reglas aditivas, no tocan nada
   de lo anterior (ni Home ni el bloque de B3.1 arriba). Mismo patrón
   fijado en B3.1: componentes con nombre único van globales; todo lo
   que reutiliza un selector ya usado en otra página (section, eyebrow,
   lead, .page-intro h1/.eyebrow/.lead, .closing/.closing h2/.closing
   .btn) se escribe bajo `body.p-servicios` con especificidad mayor a
   propósito, porque esta auditoría confirmó que `.closing` NO es un
   componente realmente compartido entre landings — cada página le da
   valores propios (ver DEC-2026-010 y el hallazgo de auditoría global
   de B3). No se toca ninguna línea ya commiteada de B3.1. ========= */

body.p-servicios section{padding:clamp(56px,8vw,96px) 0;}
body.p-servicios .eyebrow{font-size:13.5px;color:var(--forest);margin:0 0 14px;letter-spacing:.01em;}
body.p-servicios .lead{font-size:clamp(16.5px,1.4vw,18px);opacity:.78;max-width:var(--text-max);margin-top:16px;line-height:1.6;}
body.p-servicios .page-intro h1{font-size:clamp(32px,4.2vw,52px);line-height:1.1;letter-spacing:-.006em;max-width:19ch;}
body.p-servicios .page-intro .eyebrow{color:var(--cream);opacity:.8;}
body.p-servicios .page-intro .lead{color:var(--cream);opacity:.82;max-width:56ch;margin-top:20px;}
body.p-servicios .closing h2{font-size:clamp(28px,3.6vw,42px);max-width:24ch;margin:0 auto;}
body.p-servicios .closing .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--forest);background:var(--forest);color:var(--cream);
  border-radius:1px;transition:background .15s ease;margin-top:30px;
}
body.p-servicios .closing .btn:hover{background:var(--forest-2);}

/* ---- proceso: columna continua, no cajas (componente nuevo) ---- */
.process{position:relative;}
.process-intro-text{max-width:60ch;}
.process-list{position:relative;margin-top:56px;}
.process-list::before{
  content:"";position:absolute;left:clamp(28px,4vw,46px);top:8px;bottom:8px;width:1px;
  background:var(--line);
}
.process-step{position:relative;display:grid;grid-template-columns:clamp(70px,9vw,110px) 1fr;gap:clamp(20px,3vw,40px);padding:34px 0;}
.process-step:first-child{padding-top:6px;}
.process-step .num{
  font-family:'Fraunces';font-weight:300;font-size:clamp(30px,4vw,46px);
  color:var(--forest);line-height:1;position:relative;z-index:1;
  background:var(--paper);padding-right:8px;
}
.process-step h3{font-size:clamp(19px,1.7vw,23px);font-weight:600;margin-bottom:8px;max-width:32ch;}
.process-step p{margin:0;font-size:15px;opacity:.75;max-width:52ch;}

.process-media{position:relative;overflow:hidden;height:clamp(220px,32vw,380px);margin:8px 0 8px clamp(98px,13vw,150px);}
.process-media img{width:100%;height:100%;object-fit:cover;display:block;}
.process-media-caption{margin:10px 0 8px clamp(98px,13vw,150px);font-size:12px;opacity:.5;}
.photo-caption{max-width:var(--maxw);margin:12px auto 0;padding:0 clamp(20px,5vw,64px);font-size:12px;opacity:.5;}
.process-linkout{display:inline-block;margin-top:32px;font-size:14.5px;opacity:.7;text-decoration:underline;text-underline-offset:3px;}
.process-linkout:hover{opacity:1;}
@media (max-width:700px){
  .process-step{grid-template-columns:52px 1fr;gap:16px;}
  .process-step .num{font-size:26px;}
  .process-list::before{left:26px;}
  .process-media{margin-left:0;height:clamp(180px,58vw,260px);}
  .process-media-caption{margin-left:0;}
}

/* ---- franja de operación con empresas (componente nuevo) ---- */
.op-strip{
  margin-top:40px;display:flex;flex-wrap:wrap;gap:0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.op-strip > div{flex:1 1 220px;padding:24px 28px;border-left:1px solid var(--line);}
.op-strip > div:first-child{border-left:none;}
.op-strip h3{font-size:14px;font-family:'Work Sans';font-weight:600;margin:0 0 6px;color:var(--forest);}
.op-strip p{margin:0;font-size:14px;opacity:.72;}
@media (max-width:760px){
  .op-strip > div{flex:1 1 100%;border-left:none;border-top:1px solid var(--line);padding:20px 0;}
  .op-strip > div:first-child{border-top:none;}
}

/* =================================================================
   /nosotros (B3.3) — reglas aditivas, no tocan nada de lo anterior
   (ni Home ni los bloques de B3.1/B3.2 arriba). Mismo patrón fijado
   en B3.1/DEC-2026-010: componentes con nombre único van globales;
   todo lo que reutiliza un selector ya usado en otra página va bajo
   `body.p-nosotros` con especificidad mayor a propósito — el cierre
   de esta página vive sobre `.ink` (fondo oscuro) y por eso necesita
   valores de `.closing`/`.closing h2`/`.closing .lead`/`.closing .btn`
   distintos a los ya commiteados para Materiales/Servicios (que viven
   sobre `.on-deep`, fondo claro, y sí centran su contenido). ========= */

body.p-nosotros section{padding:clamp(56px,8vw,96px) 0;}
body.p-nosotros .eyebrow{font-size:13.5px;color:var(--forest);margin:0 0 14px;letter-spacing:.01em;}
body.p-nosotros .lead{font-size:clamp(16.5px,1.4vw,18px);opacity:.78;max-width:var(--text-max);margin-top:16px;line-height:1.6;}
body.p-nosotros .page-intro h1{font-size:clamp(32px,4.2vw,54px);line-height:1.1;letter-spacing:-.006em;max-width:19ch;}
body.p-nosotros .page-intro .eyebrow{color:var(--cream);opacity:.8;}
body.p-nosotros .page-intro .lead{color:var(--cream);opacity:.82;max-width:56ch;margin-top:20px;}

/* cierre sobre .ink: sin centrado, colores heredados del fondo oscuro,
   .btn claro (no el forest/cream de Materiales/Servicios) */
body.p-nosotros .closing{text-align:left;}
body.p-nosotros .closing h2{font-size:clamp(28px,3.4vw,40px);max-width:22ch;color:inherit;margin:0;}
body.p-nosotros .closing .lead{color:inherit;margin-left:0;margin-right:0;}
body.p-nosotros .closing .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--cream);background:var(--cream);color:var(--ink);
  border-radius:1px;transition:background .15s ease;margin-top:30px;
}
body.p-nosotros .closing .btn:hover{background:#fff;}
body.p-nosotros .closing .back{opacity:.55;}

/* ---- quiénes somos: declaración editorial + prosa (componente nuevo) ---- */
.who-statement{font-family:'Fraunces';font-weight:500;font-size:clamp(24px,2.6vw,34px);
  line-height:1.24;max-width:26ch;margin:0;color:var(--ink);}
.who-copy{margin-top:30px;max-width:62ch;}
.who-copy p{margin:0 0 16px;font-size:15.5px;opacity:.82;}
.who-copy p:last-child{margin-bottom:0;}

/* ---- trayectoria: numeral editorial dominante (componente nuevo) ---- */
.trajectory{overflow:hidden;}
.trajectory-grid{display:grid;grid-template-columns:0.85fr 1.15fr;align-items:center;gap:clamp(20px,4vw,60px);}
.trajectory .yr{
  font-family:'Fraunces';font-weight:300;font-size:clamp(120px,15vw,240px);
  line-height:.85;color:var(--forest);letter-spacing:-.02em;
  margin-left:clamp(-10px,-2vw,-14px);
}
.trajectory-text p{margin:0 0 18px;font-size:clamp(16.5px,1.3vw,18px);max-width:48ch;}
.trajectory-text p:last-child{margin-bottom:0;}
@media (max-width:820px){
  .trajectory-grid{grid-template-columns:1fr;}
  .trajectory .yr{font-size:clamp(96px,32vw,160px);margin-left:-4px;margin-bottom:8px;}
}

/* ---- infraestructura: pila vertical, sin íconos (componente nuevo) ---- */
.infra-stack{margin-top:44px;max-width:78ch;}
.infra-item{padding:26px 0;border-top:1px solid var(--line-on-dark);}
.infra-item:first-child{border-top:none;padding-top:0;}
.infra-item h3{font-size:clamp(19px,1.6vw,22px);font-weight:600;margin-bottom:6px;}
.infra-item p{margin:0;font-size:15px;opacity:.78;max-width:56ch;}
section.on-dark .infra-item{border-top-color:var(--line-on-dark);}

/* ---- horario y visitas: franja compacta en línea (componente nuevo) ---- */
.fact-line{
  margin-top:28px;display:flex;flex-wrap:wrap;gap:10px 28px;
  font-size:14px;color:var(--ink);opacity:.7;border-top:1px solid var(--line);padding-top:20px;
}
.fact-line strong{font-weight:600;opacity:1;}

/* ---- enlaces contextuales del cierre (componente nuevo) ---- */
.closing-links{margin-top:22px;display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14.5px;}
.closing-links a{text-decoration:underline;text-underline-offset:3px;opacity:.85;}
.closing-links a:hover{opacity:1;}

/* =================================================================
   /contacto (B3.4) — reglas aditivas, no tocan nada de lo anterior
   (ni Home ni los bloques de B3.1/B3.2/B3.3 arriba). Mismo patrón
   fijado en B3.1/DEC-2026-010. Sin formulario en este bloque — la
   conversión aprobada es WhatsApp/tel/mailto; #quoteForm y el resto
   del CSS ya reservado para el formulario de B4 (`.contact-grid`
   original, `.cinfo-row`, `.field`, `.field-row`, `.form-note`) se
   preserva intacto, sin tocar, sin consumidor todavía. `.contact-grid`
   de esta página tiene valores propios y una colisión real de nombre
   con esa reserva de B4, por eso va completo bajo `body.p-contacto`
   con su propia media query — nunca modificando la regla original. */

body.p-contacto section{padding:clamp(56px,8vw,96px) 0;}
body.p-contacto .eyebrow{font-size:13.5px;color:var(--forest);margin:0 0 14px;letter-spacing:.01em;}
body.p-contacto .lead{font-size:clamp(16.5px,1.4vw,18px);opacity:.78;max-width:var(--text-max);margin-top:16px;line-height:1.6;}
body.p-contacto .page-intro h1{font-size:clamp(34px,4.6vw,58px);line-height:1.08;letter-spacing:-.006em;max-width:16ch;}
body.p-contacto .page-intro .eyebrow{color:var(--cream);opacity:.8;}
body.p-contacto .page-intro .lead{color:var(--cream);opacity:.82;max-width:54ch;margin-top:20px;}

/* .contact-grid propia de esta página — no es la reservada para B4 */
body.p-contacto .contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(40px,6vw,90px);align-items:start;}
@media (max-width:820px){
  body.p-contacto .contact-grid{grid-template-columns:1fr;}
  body.p-contacto .contact-aside{margin-top:52px;padding-top:32px;border-top:1px solid var(--line);}
}

/* ---- bloque principal de contacto (componentes nuevos) ---- */
.contact-primary .tag{font-size:13px;color:var(--moss);letter-spacing:.02em;margin-bottom:10px;}
.contact-primary h2{font-size:clamp(28px,3.2vw,40px);max-width:16ch;line-height:1.12;}
.contact-primary p.sub{margin:16px 0 0;font-size:16px;opacity:.75;max-width:40ch;}
.wa-btn{
  display:inline-flex;align-items:center;gap:10px;margin-top:28px;
  background:var(--forest);color:var(--cream);
  padding:16px 30px;font-size:16px;font-weight:500;border-radius:1px;
  transition:background .15s ease;
}
.wa-btn:hover{background:var(--forest-2);}
.wa-number{display:block;margin-top:14px;font-size:14px;opacity:.55;}

.contact-secondary{margin-top:44px;padding-top:24px;border-top:1px solid var(--line);}
.contact-secondary p{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--moss);}
.contact-secondary .opt{display:block;font-size:16px;margin-bottom:8px;}
.contact-secondary .opt:last-child{margin-bottom:0;}
.contact-secondary .opt span{opacity:.55;font-size:14px;margin-left:4px;}
.contact-secondary a.opt:hover{text-decoration:underline;text-underline-offset:3px;}

.contact-aside{padding-top:6px;}
.contact-aside .block{margin-bottom:36px;}
.contact-aside .block:last-child{margin-bottom:0;}
.contact-aside h3{font-size:14px;text-transform:uppercase;letter-spacing:.04em;font-weight:600;color:var(--forest);margin:0 0 10px;}
.contact-aside p{margin:0;font-size:14.5px;opacity:.78;max-width:38ch;}
.contact-aside .facts{margin:0;padding:0;list-style:none;}
.contact-aside .facts li{padding:8px 0;border-top:1px solid var(--line);font-size:14.5px;}
.contact-aside .facts li:first-child{border-top:none;padding-top:0;}
.contact-aside .facts strong{font-weight:600;opacity:.85;}

/* ---- cierre contextual (componente nuevo) ---- */
.context-links{display:flex;flex-wrap:wrap;gap:8px 40px;margin-top:6px;}
.context-links a{font-size:15px;text-decoration:underline;text-underline-offset:3px;opacity:.85;}
.context-links a:hover{opacity:1;}

/* =================================================================
   /reciclaje-industrial (B3.5) — reglas aditivas, no tocan nada de
   lo anterior (ni Home ni los bloques de B3.1–B3.4 arriba). Mismo
   patrón fijado en B3.1/DEC-2026-010. `.photo-caption` (B3.2) e
   `.intro-actions` (B3.1) ya existen globales con valores distintos
   a los que necesita esta página — se sobreescriben aquí con scope,
   sin tocar las reglas originales. */

body.p-reciclaje-industrial section{padding:clamp(56px,8vw,96px) 0;}
body.p-reciclaje-industrial .page-intro h1{font-size:clamp(32px,4vw,50px);line-height:1.12;letter-spacing:-.006em;max-width:20ch;}
body.p-reciclaje-industrial .page-intro .lead{color:var(--cream);opacity:.82;max-width:58ch;margin-top:20px;}
body.p-reciclaje-industrial .intro-actions{margin-top:32px;}
body.p-reciclaje-industrial .photo-caption{margin:14px auto 0;font-size:12.5px;opacity:.55;}
body.p-reciclaje-industrial .closing h2{font-size:clamp(28px,3.4vw,40px);max-width:24ch;color:inherit;}
body.p-reciclaje-industrial .closing .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--cream);background:var(--cream);color:var(--ink);
  border-radius:1px;transition:background .15s ease;margin-top:30px;
}
body.p-reciclaje-industrial .closing .btn:hover{background:#fff;}

/* ---- componentes nuevos (sin colisión) ---- */
.narrow{max-width:70ch;}
.mat-synthesis{font-size:clamp(18px,1.7vw,21px);line-height:1.55;max-width:64ch;margin-top:24px;font-family:'Fraunces';font-weight:500;}
.mat-synthesis b{font-weight:600;}
section.stone .mat-synthesis{color:var(--ink);}

.linkout{display:inline-block;margin-top:22px;font-size:15px;text-decoration:underline;text-underline-offset:3px;opacity:.85;}
.linkout:hover{opacity:1;}

.chain{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 6px;margin-top:30px;
  font-family:'Fraunces';font-weight:500;font-size:clamp(18px,1.8vw,24px);
}
.chain .step{white-space:nowrap;}
.chain .arrow{opacity:.4;font-size:.8em;padding:0 2px;}
.chain-note{margin-top:20px;font-size:14.5px;opacity:.65;max-width:60ch;}

.directory{margin-top:40px;max-width:80ch;}
.directory a{
  display:block;padding:22px 0;border-top:1px solid var(--line);
  font-family:'Fraunces';font-size:clamp(19px,1.7vw,23px);font-weight:500;
  transition:opacity .15s ease;
}
.directory a:first-child{border-top:none;padding-top:0;}
.directory a:hover{opacity:.6;}
.directory a .path{display:block;margin-top:4px;font-family:'Work Sans';font-size:13px;font-weight:400;opacity:.5;text-decoration:underline;text-underline-offset:3px;}

.photo-band{position:relative;overflow:hidden;height:clamp(240px,36vw,420px);}
.photo-band img{width:100%;height:100%;object-fit:cover;display:block;}

/* =================================================================
   /compra-de-chatarra (B3.6) — reglas aditivas, no tocan nada de lo
   anterior (ni Home ni los bloques de B3.1–B3.5 arriba). Mismo patrón
   fijado en B3.1/DEC-2026-010. Ritmo de `section` propio (48–80px,
   más ajustado que el patrón de landings de 56–96px), `.page-intro`
   con su propio padding, `.photo-band`/`.photo-band img` (B3.5) y
   `.context-links` (B3.4) ya existen globales con valores distintos
   a los que necesita esta página — se sobreescriben aquí con scope,
   sin tocar las reglas originales. `.photo-caption` (B3.2) SÍ coincide
   exactamente, se reutiliza sin duplicar. */

body.p-compra-de-chatarra section{padding:clamp(48px,7vw,80px) 0;}
body.p-compra-de-chatarra .page-intro{padding:clamp(64px,9vw,104px) 0;}
body.p-compra-de-chatarra .page-intro h1{font-size:clamp(32px,4.2vw,52px);line-height:1.1;letter-spacing:-.006em;max-width:18ch;}
body.p-compra-de-chatarra .page-intro .lead{color:var(--cream);opacity:.85;max-width:56ch;margin-top:18px;font-size:clamp(16.5px,1.4vw,18px);}
body.p-compra-de-chatarra .lead{font-size:clamp(16px,1.3vw,17.5px);opacity:.78;max-width:var(--text-max);margin-top:14px;line-height:1.6;}
body.p-compra-de-chatarra .intro-actions{margin-top:30px;}
body.p-compra-de-chatarra .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--cream);background:var(--cream);color:var(--ink);
  border-radius:1px;transition:background .15s ease;
}
body.p-compra-de-chatarra .btn:hover{background:#fff;}
body.p-compra-de-chatarra .photo-band{height:clamp(200px,30vw,340px);}
body.p-compra-de-chatarra .photo-band img{object-position:70% 45%;}
body.p-compra-de-chatarra .closing h2{font-size:clamp(26px,3vw,36px);max-width:18ch;color:inherit;}
body.p-compra-de-chatarra .context-links{
  margin-top:30px;padding-top:22px;border-top:1px solid var(--line-on-dark);
  display:flex;flex-direction:column;gap:10px;
}
body.p-compra-de-chatarra .context-links a{font-size:14px;opacity:.72;text-decoration:underline;text-underline-offset:3px;}
body.p-compra-de-chatarra .context-links a:hover{opacity:1;}
@media (max-width:480px){
  body.p-compra-de-chatarra .intro-actions{flex-direction:column;align-items:flex-start;gap:14px;}
}

/* ---- componentes nuevos (sin colisión) ---- */
.intro-actions .quiet{font-size:14px;opacity:.65;text-decoration:underline;text-underline-offset:3px;}
.intro-actions .quiet:hover{opacity:1;}

.qa{display:grid;grid-template-columns:0.95fr 1.3fr;gap:clamp(30px,5vw,70px);align-items:start;}
.qa .q{font-size:clamp(23px,2.4vw,32px);line-height:1.18;max-width:14ch;}
.qa .a{max-width:56ch;}
.qa .a p{margin:0 0 14px;font-size:15.5px;opacity:.82;}
.qa .a p:last-child{margin-bottom:0;}
@media (max-width:760px){.qa{grid-template-columns:1fr;gap:14px;}}

.closing-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:clamp(30px,5vw,64px);align-items:start;}
.closing-actions{display:flex;flex-direction:column;gap:12px;margin-top:26px;align-items:flex-start;}
.closing .wa{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;opacity:.8;text-decoration:underline;text-underline-offset:3px;}
.closing .wa:hover{opacity:1;}
.hint{margin:0;font-size:14px;opacity:.68;max-width:40ch;}
.hint b{opacity:1;font-weight:600;}
@media (max-width:760px){.closing-grid{grid-template-columns:1fr;}}

/* =================================================================
   /compra-de-metales (B3.7) — reglas aditivas, no tocan nada de lo
   anterior (ni Home ni los bloques de B3.1–B3.6 arriba). Mismo patrón
   fijado en B3.1/DEC-2026-010. `section`/`.page-intro`/`.page-intro
   h1`/`.page-intro .lead`/`.eyebrow`/`.lead`/`.intro-actions`/`.btn`/
   `.photo-band`/`.closing h2`/`.context-links` ya existen globales o
   scoped en otras páginas con valores distintos a los que necesita
   esta página (confirmado valor por valor, no por nombre) — se
   sobreescriben aquí con scope, sin tocar las reglas originales.
   `.photo-band img`, `.photo-caption`, `.closing-grid`,
   `.closing-actions`, `.closing .wa`, `.hint`/`.hint b` y el
   breakpoint 760px de `.closing-grid` (B3.6) SÍ coinciden exactamente,
   se reutilizan sin duplicar. Tokens `--m-aluminio/--m-cobre/
   --m-bronce/--m-zinc` viven en este scope, no en `:root`, porque solo
   los usan los `.swatch` de esta página. `.btn` del cierre reutiliza
   este mismo scope (sin `.closing .btn` adicional), igual que B3.6. */

body.p-compra-de-metales{
  --m-aluminio:#9CA4A2;
  --m-cobre:#AD6B3E;
  --m-bronce:#8C6A3D;
  --m-zinc:#7C8A96;
}
body.p-compra-de-metales section{padding:clamp(48px,7vw,80px) 0;}
body.p-compra-de-metales .page-intro{padding:clamp(56px,8vw,92px) 0;}
body.p-compra-de-metales .page-intro h1{font-size:clamp(32px,4.2vw,52px);line-height:1.1;letter-spacing:-.006em;max-width:18ch;}
body.p-compra-de-metales .page-intro .lead{color:var(--cream);opacity:.85;max-width:56ch;margin-top:18px;}
body.p-compra-de-metales .eyebrow{font-size:13.5px;color:var(--forest);margin:0 0 14px;letter-spacing:.01em;}
body.p-compra-de-metales .lead{font-size:clamp(16px,1.35vw,18px);opacity:.78;max-width:var(--text-max);margin-top:14px;line-height:1.6;}
body.p-compra-de-metales .intro-actions{margin-top:28px;}
body.p-compra-de-metales .btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;font-size:15px;font-weight:500;
  border:1px solid var(--cream);background:var(--cream);color:var(--ink);
  border-radius:1px;transition:background .15s ease;
}
body.p-compra-de-metales .btn:hover{background:#fff;}
body.p-compra-de-metales .photo-band{height:clamp(220px,32vw,380px);}
body.p-compra-de-metales .closing h2{font-size:clamp(26px,3vw,36px);max-width:18ch;color:inherit;}
body.p-compra-de-metales .context-links{
  margin-top:30px;padding-top:22px;border-top:1px solid var(--line-on-dark);
  display:flex;flex-direction:column;gap:10px;
}
body.p-compra-de-metales .context-links a{font-size:14px;opacity:.72;text-decoration:underline;text-underline-offset:3px;}
body.p-compra-de-metales .context-links a:hover{opacity:1;}
@media (max-width:480px){
  body.p-compra-de-metales .intro-actions{flex-direction:column;align-items:flex-start;gap:14px;}
}

/* ---- identificación de materiales: dispositivo propio (sin colisión) ---- */
.mat-id-list{margin-top:40px;display:flex;flex-direction:column;}
.mat-id{
  display:flex;align-items:baseline;gap:18px;padding:22px 0;
  border-top:1px solid var(--line);
}
.mat-id:first-child{border-top:none;padding-top:0;}
.mat-id .swatch{
  flex:none;width:13px;height:13px;border-radius:50%;
  position:relative;top:2px;
}
.mat-id .name{font-family:'Fraunces';font-weight:600;font-size:clamp(21px,2vw,27px);min-width:9ch;}
.mat-id .desc{font-size:15px;opacity:.72;}
@media (max-width:620px){
  .mat-id{flex-wrap:wrap;gap:6px 18px;}
  .mat-id .desc{flex-basis:100%;margin-left:31px;}
}
.mat-id-note{margin-top:26px;font-size:13.5px;opacity:.6;max-width:64ch;}

/* ---- confianza operativa: cita editorial (sin colisión) ---- */
.op-statement{
  font-family:'Fraunces';font-style:italic;font-weight:500;
  font-size:clamp(26px,3.4vw,42px);line-height:1.22;max-width:20ch;color:inherit;
}
.op-detail{margin-top:24px;font-size:15.5px;opacity:.82;max-width:52ch;}
.op-detail + .op-detail{margin-top:10px;}

/* HOME-DELTA-001 — enlace contextual aprobado del proceso hacia /reciclaje-industrial */
.proceso-linkout{display:inline-block;margin-top:32px;font-size:14.5px;opacity:.62;color:var(--cream);text-decoration:underline;text-underline-offset:3px;}
.proceso-linkout:hover{opacity:1;}

/* =================================================================
   B4-A — formulario real de /contacto (namespace `.lead-form*`, nuevo
   y sin colisión) + página `/aviso-de-privacidad` (`.privacy-content`,
   nuevo). No toca ni reutiliza la reserva original de B4 (`.contact-grid`
   con `0.9fr 1.1fr`, `.cinfo-row`, `.field`, `.field-row`, `.form-note`)
   ni el `.contact-grid` real y activo de B3.4 — ambos permanecen
   intactos, sin una sola línea modificada. */

.lead-form-intro h2{font-size:clamp(26px,3vw,36px);max-width:22ch;}
.lead-form-intro .lead{margin-bottom:0;}

.lead-form{margin-top:36px;}
.lead-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 28px;}
.lf-field-full{grid-column:1 / -1;}
.lf-field label{display:block;font-size:13px;opacity:.65;margin-bottom:6px;letter-spacing:.01em;}
.lf-required{color:var(--forest);opacity:1;}
.lf-field input,.lf-field select,.lf-field textarea{
  width:100%;background:var(--paper);border:1px solid var(--line);border-radius:1px;
  color:var(--ink);padding:11px 12px;font-family:inherit;font-size:15.5px;
  transition:border-color .15s ease;
}
.lf-field input:focus,.lf-field select:focus,.lf-field textarea:focus{outline:none;border-color:var(--forest);}
.lf-field textarea{resize:vertical;min-height:96px;}
.lf-field[data-invalid="true"] input,
.lf-field[data-invalid="true"] select,
.lf-field[data-invalid="true"] textarea{border-color:#A33A2E;}
.lf-error{margin:6px 0 0;font-size:13px;color:#A33A2E;}
.lf-error:empty{display:none;}
@media (max-width:640px){.lead-form-grid{grid-template-columns:1fr;}}

/* honeypot: oculto visualmente y fuera del flujo de tabulación, pero
   presente en el DOM — nunca debe llenarse */
.lf-honeypot{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}

.lf-privacy-note{margin-top:22px;font-size:13px;opacity:.65;max-width:56ch;}
.lf-privacy-note a{text-decoration:underline;text-underline-offset:3px;opacity:.85;}
.lf-privacy-note a:hover{opacity:1;}

.lf-actions{margin-top:26px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.lead-form .btn.lf-submit{border:1px solid var(--forest);background:var(--forest);color:var(--cream);}
.lead-form .btn.lf-submit:hover{background:var(--forest-2);}
.lead-form .btn.lf-submit:disabled{opacity:.55;cursor:not-allowed;}
.lf-status{margin:0;font-size:14px;opacity:.75;}
.lf-status[data-tone="error"]{color:#A33A2E;opacity:1;}
.lf-status[data-tone="success"]{color:var(--forest);opacity:1;}

.lf-success{margin-top:36px;padding-top:28px;border-top:1px solid var(--line);max-width:60ch;}
.lf-success h3{font-size:clamp(20px,2.2vw,26px);}
.lf-success p{margin-top:12px;font-size:15px;opacity:.8;}
.lf-success a{text-decoration:underline;text-underline-offset:3px;}
.lf-reset{
  margin-top:16px;background:none;border:none;padding:0;
  font-size:14px;text-decoration:underline;text-underline-offset:3px;
  color:inherit;opacity:.75;cursor:pointer;font-family:inherit;
}
.lf-reset:hover{opacity:1;}

/* ---------------- /aviso-de-privacidad — mismo patrón DEC-2026-010:
   `.page-intro h1`/`.page-intro .lead` no tienen fallback global seguro
   (el `.lead` base hereda `color:var(--ink)`, invisible sobre el fondo
   oscuro de `.page-intro` si no se sobreescribe con scope — mismo
   hallazgo que B3.1). ---------------- */
body.p-privacidad section{padding:clamp(56px,8vw,96px) 0;}
body.p-privacidad .page-intro h1{font-size:clamp(34px,4.6vw,58px);line-height:1.08;letter-spacing:-.006em;max-width:16ch;}
body.p-privacidad .page-intro .lead{color:var(--cream);opacity:.82;max-width:54ch;margin-top:20px;}

/* ---------------- página /aviso-de-privacidad (componente nuevo) ---------------- */
.privacy-content{max-width:72ch;}
.privacy-content h2{font-size:clamp(22px,2.6vw,30px);margin-top:44px;}
.privacy-content h2:first-child{margin-top:0;}
.privacy-content p{margin-top:14px;font-size:15.5px;opacity:.82;}
.privacy-content ul{margin:14px 0 0;padding-left:20px;}
.privacy-content li{font-size:15.5px;opacity:.82;margin-top:6px;}
.privacy-content .privacy-updated{margin-top:36px;font-size:13px;opacity:.55;}