:root {
  --naranja: #e38736;
  --naranja-fuerte: #ee6f0e;
  --dorado: #ad9c67;
  --dorado-texto: #7d6f3f;   /* dorado oscurecido: el original no da contraste sobre blanco */
  --tinta: #181818;
  --verde: #d7fda4;
  --gris: #dbdbdb;
  --ancho: 1040px;
  --cabecera: 76px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font: 400 1.0625rem/1.75 "Raleway", system-ui, sans-serif;
  color: var(--tinta);
  background: #fff;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--dorado-texto); text-underline-offset: 3px; }
a:hover { color: var(--naranja-fuerte); }
:focus-visible { outline: 3px solid var(--naranja-fuerte); outline-offset: 2px; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 20px; }
.solo-lectores { position: absolute; left: -9999px; }
.saltar { position: absolute; left: -9999px; top: 8px; background: #fff; padding: 8px 14px; z-index: 100; }
.saltar:focus { left: 8px; }

/* ── Tipografía ─────────────────────────────────────── */
h1, h2, h3 {
  font-family: "Suez One", Georgia, serif;
  font-weight: 400;
  color: var(--naranja);
  line-height: 1.15;
  margin: 0 0 .5em;
}
h1 { font-size: clamp(2.1rem, 5.5vw, 3.4rem); text-align: center; }
h2 { font-size: clamp(1.7rem, 4vw, 2.5rem); }
h3 { font-size: 1.35rem; }
.subtitulo {
  font: 600 clamp(1.15rem, 2.6vw, 1.55rem)/1.35 "Poppins", sans-serif;
  text-align: center;
  margin: 0 0 1.5rem;
}
.texto-dorado { color: var(--dorado-texto); }
.centrado { text-align: center; }

/* ── Cabecera y menú ────────────────────────────────── */
.cabecera {
  position: sticky; top: 0; z-index: 50;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
}
.cabecera .contenedor {
  display: flex; align-items: center; justify-content: space-between;
  min-height: var(--cabecera);
}
.logo img { height: 60px; width: auto; }

.menu-boton {
  display: none;
  background: none; border: 0; padding: 10px; margin: 0 -10px 0 auto;
  cursor: pointer; color: var(--tinta);
}
.menu-boton svg { width: 28px; height: 28px; display: block; }
.menu-boton .cerrar { display: none; }
.menu-boton[aria-expanded="true"] .abrir { display: none; }
.menu-boton[aria-expanded="true"] .cerrar { display: block; }

.menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; align-items: center; }
.menu a {
  display: block; padding: 10px 14px;
  font: 500 .95rem/1.2 "Raleway", sans-serif;
  color: var(--tinta); text-decoration: none; border-radius: 4px; white-space: nowrap;
}
.menu a:hover { color: var(--naranja-fuerte); }
.menu a[aria-current="page"] { color: var(--naranja-fuerte); font-weight: 700; }

.tiene-sub { position: relative; }
.submenu {
  list-style: none; margin: 0; padding: 6px 0;
  position: absolute; left: 0; top: 100%; min-width: 230px;
  background: #fff; box-shadow: 0 6px 16px rgba(0,0,0,.18); border-radius: 0 0 6px 6px;
  display: none;
}
.tiene-sub:hover > .submenu,
.tiene-sub:focus-within > .submenu { display: block; }

@media (max-width: 960px) {
  .menu-boton { display: block; }
  .menu {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; box-shadow: 0 8px 12px rgba(0,0,0,.15);
    padding: 6px 20px 14px; max-height: calc(100vh - var(--cabecera)); overflow-y: auto;
  }
  .menu.abierto { display: flex; }
  .menu a { padding: 14px 4px; font-size: 1.05rem; border-bottom: 1px solid #eee; white-space: normal; }
  .submenu { display: block; position: static; box-shadow: none; padding: 0 0 0 18px; min-width: 0; }
  .submenu a { font-weight: 400; }
}

/* ── Secciones ──────────────────────────────────────── */
main { display: block; }
.seccion { padding: 44px 0; }
.seccion-angosta { max-width: 820px; margin: 0 auto; }
.seccion + .seccion { padding-top: 12px; }

.dos-col { display: grid; gap: 28px 40px; align-items: center; grid-template-columns: 1fr; }
@media (min-width: 760px) {
  .dos-col { grid-template-columns: 1fr 1fr; }
  .dos-col.foto-izq > :first-child { order: 0; }
}
.foto { border-radius: 4px; width: 100%; object-fit: cover; }

/* Inicio */
.inicio-hero { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: center; }
.inicio-circulos { display: flex; gap: 16px; justify-content: center; }
.inicio-circulos img { width: min(38vw, 190px); aspect-ratio: 1; border-radius: 50%; object-fit: cover; }
@media (min-width: 900px) {
  .inicio-hero { grid-template-columns: 200px 1fr; gap: 44px; align-items: start; }
  .inicio-circulos { flex-direction: column; align-items: center; }
  .inicio-circulos img { width: 190px; }
}
.inicio-texto p { color: var(--dorado-texto); font-size: 1.125rem; margin: 0 0 1em; }
@media (min-width: 900px) { .inicio-texto p { text-align: justify; } }

/* Contacto */
.contacto { background: var(--gris); padding: 40px 0; }
.contacto-tarjeta {
  background: #f9f9f9; padding: 32px 22px;
  display: grid; gap: 28px; grid-template-columns: 1fr;
}
@media (min-width: 800px) { .contacto-tarjeta { grid-template-columns: 1fr 1.2fr; padding: 44px; gap: 44px; } }
.contacto h2 { color: var(--tinta); font: 400 2.4rem/1.2 "Poppins", sans-serif; text-align: center; }
.contacto .lead { color: var(--dorado-texto); font-size: 1.3rem; text-align: center; line-height: 1.6; }
.contacto .correo { display: block; text-align: center; font-size: 1.3rem; color: var(--tinta); margin: 1rem 0; }
.redes { display: flex; gap: 14px; justify-content: center; }
.redes a { color: var(--tinta); display: inline-flex; padding: 6px; }
.redes svg { width: 26px; height: 26px; fill: currentColor; }

.formulario { display: grid; gap: 14px; align-content: start; }
.formulario input, .formulario textarea {
  width: 100%; font: inherit; font-size: 1rem; color: var(--tinta);
  background: transparent; border: 0; border-bottom: 1.5px solid var(--tinta);
  padding: 12px 8px; border-radius: 0;
}
.formulario textarea { min-height: 130px; resize: vertical; }
.formulario input:focus, .formulario textarea:focus { outline: 0; border-bottom-color: var(--naranja-fuerte); box-shadow: 0 2px 0 var(--naranja-fuerte); }
.formulario .trampa { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.boton {
  display: inline-block; cursor: pointer; text-align: center; text-decoration: none;
  font: 500 1rem/1.3 "Raleway", sans-serif; color: #fff; background: var(--tinta);
  border: 0; padding: 14px 22px; border-radius: 3px;
}
.boton:hover { background: #000; color: #fff; }
.boton[disabled] { opacity: .6; cursor: wait; }
.estado-formulario { margin: 0; text-align: center; font-size: 1.05rem; }
.estado-formulario.ok { color: #2f6b1f; }
.estado-formulario.error { color: #b3261e; }

/* Nosotros */
.mision {
  font: 600 clamp(1.15rem, 2.8vw, 1.6rem)/1.6 "Poppins", sans-serif;
  color: var(--dorado-texto); text-align: center; max-width: 820px; margin: 0 auto 2.5rem;
}
.tres-col { display: grid; gap: 28px; grid-template-columns: 1fr; color: var(--dorado-texto); font-size: 1.1rem; }
@media (min-width: 760px) { .tres-col { grid-template-columns: repeat(3, 1fr); } }
.tres-col h3 { font: 500 1.15rem/1.4 "Raleway", sans-serif; color: var(--dorado-texto); text-align: center; margin-bottom: .4rem; }
.tres-col ul { margin: 0 0 1.4rem; padding-left: 1.3rem; }
.tres-col li::marker { color: var(--dorado); }

/* La biodinámica */
.principios { display: grid; gap: 12px 40px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 760px) { .principios { grid-template-columns: 1fr 1fr; } }
.principios h2 { color: var(--naranja-fuerte); }
.principios ol { margin: 0; padding-left: 1.4rem; font-size: 1.1rem; }
.principios li { margin-bottom: .3rem; }

/* Certificación */
.bloque-cert { display: grid; gap: 26px 40px; grid-template-columns: 1fr; align-items: start; margin-bottom: 44px; }
@media (min-width: 800px) { .bloque-cert { grid-template-columns: 5fr 7fr; } }
.descarga { text-align: center; }
.descarga .rotulo { font: 500 1rem/1 "Poppins", sans-serif; letter-spacing: .38em; text-transform: none; margin: 14px 0 12px; display: block; }
.boton-naranja {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--naranja-fuerte); color: var(--tinta); text-decoration: none;
  font: 500 .95rem/1.2 "Raleway", sans-serif; padding: 12px 20px; border-radius: 999px; margin: 0 auto 12px;
}
.boton-naranja:hover { background: #ff8a2a; color: var(--tinta); }
.boton-naranja svg { width: 16px; height: 16px; fill: currentColor; flex: none; }
.boton-circulo {
  width: 150px; height: 150px; border-radius: 50%; padding: 0; flex-direction: column;
  text-align: center; margin: 14px auto 0;
}
.sub-h { font: 600 clamp(1.3rem, 3vw, 1.8rem)/1.3 "Poppins", sans-serif; text-align: center; margin: 0 0 1.5rem; }
.aparte { text-align: center; font-size: .98rem; }
.bloque-cert .boton { margin-top: 6px; }
.cierre { max-width: 860px; margin: 0 auto; text-align: center; font-size: 1.1rem; }

/* Formación */
.lista-acciones p { margin: 0 0 1em; }
.link-ig { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; }
.link-ig svg { width: 26px; height: 26px; fill: var(--tinta); }

/* Productores */
.pagina-verde { background: var(--verde); }
.grupo-productores { padding: 34px 0 20px; }
.grupo-productores h1 { font-size: clamp(1.8rem, 4.5vw, 2.4rem); margin-bottom: 1.2rem; }
.tarjetas { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .tarjetas { grid-template-columns: repeat(3, 1fr); } }
.tarjeta { background: #fff; border-radius: 4px; overflow: hidden; box-shadow: 0 2px 6px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.tarjeta img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.tarjeta .cuerpo { padding: 12px 14px 16px; font-size: .95rem; line-height: 1.5; }
.tarjeta h3 { font: 700 1rem/1.3 "Raleway", sans-serif; color: var(--tinta); margin: 0 0 .3rem; }
.tarjeta p { margin: 0; }
.tarjeta .lugar { color: #555; margin-top: .3rem; font-size: .88rem; }

/* Newsletter */
.descargas { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 12px; max-width: 520px; margin-inline: auto; }
.descargas .boton-naranja { justify-content: flex-start; padding: 14px 22px; border-radius: 8px; margin: 0; font-size: 1.05rem; }

/* Pie */
.pie { padding: 26px 0; font-size: .92rem; }
.pie .contenedor { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: space-between; }
.pie p { margin: 0; }
.pie .redes { margin: 0; }
.pagina-verde .pie { background: #fff; }

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }