/* =========================================================
   Fundación Tierra Nueva — hoja de estilos única
   Paleta: dosel de bosque + miel (producto real del IFAD)
   ========================================================= */

:root{
  --verde-hondo:#0E2A1C;
  --verde-monte:#2B5C3E;
  --verde-claro:#5C8A6B;
  --miel:#D9A441;
  --miel-hondo:#A9752A;
  --papel:#EDF0E8;
  --papel-2:#E1E7DB;
  --tinta:#141A15;
  --blanco:#FBFCF8;

  --display:"Zilla Slab",Georgia,serif;
  --texto:"Karla","Helvetica Neue",Arial,sans-serif;

  --ancho:1180px;
  --ancho-angosto:760px;
  --radio:2px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--papel);
  color:var(--tinta);
  font-family:var(--texto);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:inherit}

.contenedor{width:100%;max-width:var(--ancho);margin:0 auto;padding:0 24px}
.contenedor--angosto{max-width:var(--ancho-angosto)}

.saltar{
  position:absolute;left:-9999px;top:0;background:var(--miel);color:var(--verde-hondo);
  padding:10px 16px;font-weight:700;z-index:200;
}
.saltar:focus{left:8px;top:8px}

:focus-visible{outline:3px solid var(--miel);outline-offset:3px}

/* ---------- Tipografía ---------- */
.eyebrow{
  font-family:var(--texto);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--miel-hondo);
  margin:0 0 14px;
}
.eyebrow--claro{color:var(--miel)}

.t-xl,.t-l,.t-m,.t-s{font-family:var(--display);font-weight:600;line-height:1.12;margin:0 0 18px;letter-spacing:-.01em}
.t-xl{font-size:clamp(2.5rem,6.2vw,4.4rem);font-weight:700}
.t-l{font-size:clamp(1.9rem,3.8vw,2.9rem)}
.t-m{font-size:clamp(1.35rem,2.3vw,1.75rem)}
.t-s{font-size:1.08rem;letter-spacing:0}

.lede{font-size:clamp(1.05rem,1.6vw,1.28rem);line-height:1.6;max-width:62ch;margin:0 0 22px}
.parrafo{max-width:66ch;margin:0 0 18px}
.parrafo:last-child{margin-bottom:0}

.mini{font-size:.86rem;line-height:1.55;opacity:.8}

/* ---------- Botones ---------- */
.btn{
  display:inline-block;
  font-family:var(--texto);
  font-weight:700;
  font-size:.9rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  padding:15px 28px;
  border:2px solid transparent;
  border-radius:var(--radio);
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn--miel{background:var(--miel);color:var(--verde-hondo);border-color:var(--miel)}
.btn--miel:hover{background:#e8b556;border-color:#e8b556}
.btn--linea{background:transparent;color:var(--papel);border-color:rgba(237,240,232,.5)}
.btn--linea:hover{border-color:var(--papel);background:rgba(237,240,232,.08)}
.btn--oscuro{background:var(--verde-hondo);color:var(--papel);border-color:var(--verde-hondo)}
.btn--oscuro:hover{background:var(--verde-monte);border-color:var(--verde-monte)}
.btn--linea-osc{background:transparent;color:var(--verde-hondo);border-color:rgba(14,42,28,.35)}
.btn--linea-osc:hover{border-color:var(--verde-hondo)}

.botonera{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

/* ---------- Encabezado ---------- */
.barra{
  position:sticky;top:0;z-index:100;
  background:var(--verde-hondo);
  border-bottom:1px solid rgba(217,164,65,.28);
}
.barra__fila{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}

.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--papel)}
.marca__glifo{width:34px;height:34px;flex:0 0 34px}
.marca__texto{display:flex;flex-direction:column;line-height:1.05}
.marca__nombre{font-family:var(--display);font-weight:700;font-size:1.02rem;letter-spacing:.01em}
.marca__lugar{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--miel);margin-top:3px}

.menu{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.menu a{
  display:block;text-decoration:none;color:var(--papel);
  font-size:.84rem;font-weight:500;letter-spacing:.04em;
  padding:9px 12px;border-radius:var(--radio);
  transition:background .16s ease,color .16s ease;
}
.menu a:hover{background:rgba(237,240,232,.1)}
.menu .es-actual{color:var(--miel);font-weight:700}
.menu .menu__cta{background:var(--miel);color:var(--verde-hondo);font-weight:700;margin-left:8px;padding:10px 18px}
.menu .menu__cta:hover{background:#e8b556}

.hamburguesa{
  display:none;background:none;border:1px solid rgba(237,240,232,.35);
  color:var(--papel);padding:9px 13px;font-family:var(--texto);
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  border-radius:var(--radio);cursor:pointer;
}

/* ---------- Portada ---------- */
.portada{position:relative;background:var(--verde-hondo);overflow:hidden}
.portada__fondo{position:absolute;inset:0}
.portada__fondo img{width:100%;height:100%;object-fit:cover;opacity:.42}
.portada__velo{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(14,42,28,.55) 0%,rgba(14,42,28,.78) 55%,rgba(14,42,28,.96) 100%);
}
.portada__cuerpo{position:relative;padding:120px 0 96px;color:var(--papel)}
.portada__titulo{font-family:var(--display);font-weight:700;font-size:clamp(3rem,9vw,6.2rem);line-height:.98;letter-spacing:-.025em;margin:0 0 24px}
.portada__titulo em{font-style:normal;color:var(--miel)}
.portada__texto{font-size:clamp(1.05rem,1.7vw,1.3rem);max-width:56ch;margin:0;color:rgba(237,240,232,.9)}

.portada--interna .portada__cuerpo{padding:84px 0 64px}
.portada--interna .portada__titulo{font-size:clamp(2.3rem,5.5vw,3.8rem)}

/* ---------- Riel de cifras ---------- */
.riel{background:var(--verde-monte);color:var(--papel)}
.riel__fila{display:grid;grid-template-columns:repeat(4,1fr)}
.riel__dato{padding:34px 22px;border-left:1px solid rgba(237,240,232,.16)}
.riel__dato:first-child{border-left:0}
.riel__cifra{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1;color:var(--miel);margin:0 0 8px}
.riel__pie{font-size:.8rem;line-height:1.4;letter-spacing:.04em;margin:0;color:rgba(237,240,232,.88)}

/* ---------- Secciones ---------- */
.bloque{padding:90px 0}
.bloque--pale{background:var(--papel-2)}
.bloque--oscuro{background:var(--verde-hondo);color:var(--papel)}
.bloque--oscuro .parrafo,.bloque--oscuro .lede{color:rgba(237,240,232,.88)}
.bloque--ajustado{padding:64px 0}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.duo--texto-der{grid-template-columns:1fr 1fr}
.duo__figura{margin:0}
.duo__figura img{width:100%;height:100%;object-fit:cover;border-radius:var(--radio)}
.duo__pie{font-size:.78rem;letter-spacing:.03em;margin-top:10px;opacity:.7}

.regla{height:1px;background:rgba(14,42,28,.14);border:0;margin:0 0 34px;max-width:120px}
.regla--miel{background:var(--miel);height:3px;max-width:56px}

/* ---------- Cita ---------- */
.cita{
  border-left:3px solid var(--miel);
  padding:6px 0 6px 26px;
  margin:36px 0;
  max-width:60ch;
}
.cita__texto{font-family:var(--display);font-size:clamp(1.2rem,2.2vw,1.6rem);line-height:1.32;font-weight:500;margin:0 0 10px}
.cita__fuente{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--miel-hondo);margin:0}
.bloque--oscuro .cita__fuente{color:var(--miel)}

/* ---------- Parcelas (proyectos) ---------- */
.parcelas{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(14,42,28,.16);border:1px solid rgba(14,42,28,.16)}
.parcela{background:var(--papel);padding:0;display:flex;flex-direction:column}
.parcela__foto{aspect-ratio:4/3;overflow:hidden;background:var(--papel-2)}
.parcela__foto img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.parcela:hover .parcela__foto img{transform:scale(1.05)}
.parcela__cuerpo{padding:22px 22px 26px;flex:1}
.parcela__nombre{font-family:var(--display);font-weight:600;font-size:1.12rem;margin:0 0 8px}
.parcela__texto{font-size:.9rem;line-height:1.55;margin:0;opacity:.86}
.parcela__marca{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--miel-hondo);margin:0 0 10px}

/* ---------- Elemento firma: aporte simbólico ---------- */
.aporte{
  background:var(--verde-hondo);
  color:var(--papel);
  border-top:4px solid var(--miel);
  padding:44px 42px 40px;
  max-width:640px;
}
.aporte__titulo{font-family:var(--display);font-size:1.5rem;font-weight:600;margin:0 0 28px;color:var(--papel)}
.aporte__linea{
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:16px 0;border-bottom:1px dashed rgba(217,164,65,.4);
}
.aporte__linea:last-of-type{border-bottom:0}
.aporte__concepto{font-size:.92rem;color:rgba(237,240,232,.82);margin:0;flex:1}
.aporte__valor{font-family:var(--display);font-weight:600;font-size:1.15rem;color:var(--miel);margin:0;text-align:right;white-space:nowrap}
.aporte__valor--suave{font-size:1rem;white-space:normal;text-align:right}
.aporte__nota{
  margin:26px 0 0;padding-top:22px;border-top:1px solid rgba(217,164,65,.4);
  font-family:var(--display);font-size:1.05rem;line-height:1.4;color:var(--papel);
}

/* ---------- Listas ---------- */
.lista{list-style:none;padding:0;margin:0}
.lista li{padding:13px 0 13px 26px;border-bottom:1px solid rgba(14,42,28,.12);position:relative;font-size:.97rem}
.lista li::before{content:"";position:absolute;left:0;top:22px;width:10px;height:2px;background:var(--miel)}
.lista li:last-child{border-bottom:0}
.bloque--oscuro .lista li{border-bottom-color:rgba(237,240,232,.18)}

.tarjetas{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tarjeta{background:var(--blanco);border:1px solid rgba(14,42,28,.13);padding:30px 28px;border-radius:var(--radio)}
.bloque--oscuro .tarjeta{background:rgba(237,240,232,.06);border-color:rgba(217,164,65,.3)}
.tarjeta__titulo{font-family:var(--display);font-weight:600;font-size:1.15rem;margin:0 0 12px}
.tarjeta__texto{font-size:.93rem;line-height:1.6;margin:0;opacity:.88}

/* ---------- Galería ---------- */
.galeria{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.galeria img{aspect-ratio:1/1;object-fit:cover;width:100%;border-radius:var(--radio)}

/* ---------- Banda de cierre ---------- */
.banda{background:var(--miel);color:var(--verde-hondo);padding:76px 0}
.banda__titulo{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4vw,3rem);line-height:1.1;margin:0 0 18px}
.banda__texto{max-width:56ch;margin:0;font-size:1.05rem}

/* ---------- Datos de donación ---------- */
.cuenta{background:var(--blanco);border:1px solid rgba(14,42,28,.15);border-left:4px solid var(--miel);padding:32px 30px}
.cuenta__fila{display:flex;justify-content:space-between;gap:18px;padding:11px 0;border-bottom:1px solid rgba(14,42,28,.1);font-size:.95rem}
.cuenta__fila:last-child{border-bottom:0}
.cuenta__clave{color:rgba(20,26,21,.65);margin:0}
.cuenta__valor{font-weight:700;margin:0;text-align:right}

/* ---------- Pie ---------- */
.pie{background:var(--verde-hondo);color:var(--papel);padding:70px 0 34px}
.pie__rejilla{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px;padding-bottom:44px;border-bottom:1px solid rgba(237,240,232,.16)}
.pie__titulo{font-family:var(--texto);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--miel);margin:0 0 18px}
.pie__texto{font-size:.92rem;line-height:1.65;color:rgba(237,240,232,.82);margin:0 0 14px;max-width:38ch}
.pie__enlaces{list-style:none;margin:0;padding:0}
.pie__enlaces li{margin-bottom:10px}
.pie__enlaces a{color:rgba(237,240,232,.85);text-decoration:none;font-size:.92rem}
.pie__enlaces a:hover{color:var(--miel)}
.pie__base{padding-top:26px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.8rem;color:rgba(237,240,232,.6)}
.pie__base a{color:rgba(237,240,232,.6)}

/* ---------- Aparición al hacer scroll ---------- */
.js .aparece{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .aparece.es-visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .aparece{opacity:1;transform:none;transition:none}
  .btn:hover{transform:none}
  .parcela:hover .parcela__foto img{transform:none}
}

/* ---------- Adaptable ---------- */
@media (max-width:1000px){
  .parcelas{grid-template-columns:repeat(2,1fr)}
  .tarjetas{grid-template-columns:repeat(2,1fr)}
  .pie__rejilla{grid-template-columns:1fr 1fr}
}

@media (max-width:860px){
  .hamburguesa{display:block}
  .menu{
    display:none;position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--verde-hondo);border-bottom:1px solid rgba(217,164,65,.3);
    padding:10px 16px 20px;
  }
  .menu.esta-abierto{display:flex}
  .menu a{padding:14px 8px;border-bottom:1px solid rgba(237,240,232,.1);font-size:.95rem}
  .menu .menu__cta{margin:14px 0 0;text-align:center;border-bottom:0}
  .barra__fila{position:relative}

  .duo{grid-template-columns:1fr;gap:34px}
  .riel__fila{grid-template-columns:1fr 1fr}
  .riel__dato{border-left:0;border-top:1px solid rgba(237,240,232,.16)}
  .riel__dato:nth-child(-n+2){border-top:0}
  .riel__dato:nth-child(even){border-left:1px solid rgba(237,240,232,.16)}
  .galeria{grid-template-columns:repeat(3,1fr)}
  .bloque{padding:64px 0}
  .portada__cuerpo{padding:88px 0 72px}
  .aporte{padding:34px 26px 30px}
}

@media (max-width:430px){
  .marca__glifo{width:28px;height:28px;flex:0 0 28px}
  .marca__nombre{font-size:.85rem}
  .marca__lugar{font-size:.6rem}
}

@media (max-width:560px){
  body{font-size:16px}
  .parcelas{grid-template-columns:1fr}
  .tarjetas{grid-template-columns:1fr}
  .pie__rejilla{grid-template-columns:1fr;gap:32px}
  .galeria{grid-template-columns:repeat(2,1fr)}
  .aporte__linea{flex-direction:column;gap:4px}
  .aporte__valor,.aporte__valor--suave{text-align:left}
  .botonera .btn{width:100%;text-align:center}
}