/* ==========================================================================
   Oaseeds · Marca v2 · newsletter y pie de página (docs/Marca/marca.md)
   Primera pieza de la marca nueva en PRODUCCIÓN (Toni, 12/11/2026): «pie nuevo completo». Se carga en todas las webs
   (templates/_partials/head.tpl), después de oaseeds.css y antes de marca-v2.css. El resto de la marca v2 sigue solo en
   staging. Al lanzar, se fusiona con oaseeds.css junto con marca-v2.css.
   Incluye: tokens de color, newsletter sobre Arena (encima del pie, para que la hierba salga de la arena), pie Tinta con
   la entrada de hierba en pixel art, aviso legal enmarcado y el campo de cuadritos animado (js/marca-v2.js, escritorio).
   ========================================================================== */
:root {
  --oa-arena: #F3EBD8; --oa-papel: #FCF8EE; --oa-duna: #E6DCC3; --oa-tinta: #311B0D; --oa-humo: #6B5D50;
  --oa-sol: #F89702; --oa-yema: #FFD602; --oa-hierba: #5A9E3A;
  --oa-font-titular: 'Bangers', Impact, sans-serif;
  --oa-borde: 2px solid var(--oa-tinta); --oa-sombra: 4px 4px 0 var(--oa-tinta);
}
.oa-nl__title { font-family: var(--oa-font-titular); font-weight: 400; text-transform: uppercase; letter-spacing: 0.03em; color: var(--oa-tinta); }

/* ---- Newsletter antes del pie: liso sobre Arena (la trama va en la entrada del pie) ---- */
.oa-nl { background: var(--oa-arena); border-top: 0; }
.oa-nl::before { content: none; }
.oa-nl__icon { background: var(--oa-tinta); color: var(--oa-yema); }
.oa-nl__title { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.1; }
.oa-nl__btn { background: var(--oa-sol); border: var(--oa-borde); color: var(--oa-tinta); box-shadow: var(--oa-sombra); border-radius: 4px; }
.oa-nl__btn:hover, .oa-nl__btn:focus { background: var(--oa-yema); border-color: var(--oa-tinta); color: var(--oa-tinta); }
.oa-nl__btn:active { transform: translate(4px, 4px); box-shadow: none; }
.oa-nl__conditions { color: var(--oa-humo); }

/* ---- Pie: Tinta liso con texto Arena, títulos en Bangers sobre Yema, entrada con trama de puntos ---- */
.oa-footer.footer__main { background: var(--oa-tinta); color: var(--oa-arena); padding-top: calc(48px + 3rem); }
.oa-footer.footer__main::before {   /* trama de Arena a Tinta: PNG de dos colores, punto de 3 px, sin suavizar */
  inset: 0 0 auto 0; height: 48px; z-index: 0;
  background: url('../img/marca/trama-arena-tinta.png') repeat-x 0 0 / 48px 48px; image-rendering: pixelated;
  -webkit-mask-image: none; mask-image: none;
}
.oa-footer a { color: var(--oa-arena); }
.oa-footer a:hover { color: var(--oa-yema); }
.oa-footer .footer-block__title {
  display: inline-block; background: var(--oa-yema); color: var(--oa-tinta); padding: 2px 8px 0; border-radius: 3px;
  font-family: var(--oa-font-titular); font-weight: 400; font-size: 20px; letter-spacing: 0.05em;
}
.oa-footer .footer-block__title .material-icons { color: var(--oa-tinta); }
.oa-footer .footer-block__list a { color: var(--oa-arena); }
.oa-footer .footer-block__list a:hover { color: var(--oa-yema); }
.oa-footer__contact .material-icons, .oa-footer__wa { color: var(--oa-yema); }
.oa-footer__legal { border-top: 1px solid var(--oa-humo); }
.oa-footer__legal p { color: var(--oa-duna); }
.oa-footer__legal strong { color: var(--oa-arena); }
.oa-footer__age { border-color: var(--oa-yema); color: var(--oa-yema); }
.oa-footer__bottom { background: var(--oa-tinta); border-top: 1px solid var(--oa-humo); color: var(--oa-duna); }
.oa-footer__bottom::before { content: none; }
.oa-footer__copy { color: var(--oa-arena); }
.oa-footer__pay { background: var(--oa-papel); border-radius: 4px; }
@media (max-width: 767.98px) {
  .oa-footer.footer__main { padding-top: calc(48px + 2rem); }
  .oa-footer .footer-block { border-top: 1px solid var(--oa-humo); }
  .oa-footer .footer-block__title { display: flex; background: transparent; color: var(--oa-yema); padding: 0.9rem 0; }
  .oa-footer .footer-block__title .material-icons { color: var(--oa-arena); }
}

/* ---- Pie: campo de cuadritos animado a los lados (assets/js/marca-v2.js) ---- */
.oa-field { position: absolute; left: 0; top: 48px; z-index: 0; pointer-events: none; image-rendering: pixelated; contain: strict; }
.oa-footer.footer__main > .container { position: relative; z-index: 1; }
.oa-footer__bottom { background: transparent; }
/* Deja hueco a los lados para el campo: columna de contenido algo más estrecha en escritorio */
@media (min-width: 992px) {
  .oa-footer.footer__main > .container, .oa-footer__bottom > .container { max-width: min(1140px, calc(100% - 200px)); }
}

/* Pie (Toni, 12/11/2026): aviso legal enmarcado y más pegado a las columnas; sin raya de lado a lado sobre el copyright */
.oa-footer__top { padding-bottom: 1rem; }
.oa-footer__legal { border: 1px solid var(--oa-humo); border-radius: 4px; padding: 1rem 1.25rem; margin-bottom: 1.5rem; align-items: center; }
.oa-footer__bottom { border-top: 0; }
@media (max-width: 767.98px) { .oa-footer__legal { margin-top: 1.5rem; } }
/* Aprobada (Toni, 12/11/2026): la trama de entrada al pie como hierba que sale de la tierra. Los puntos claros de la mitad
   de abajo pasan a verde hierba #5A9E3A con un borde irregular (tesela de 288 px); por encima de la hierba, arena limpia sin
   puntos de tinta y la punta de cada brizna en verde. Para volver atrás, borrar esta regla. */
.oa-footer.footer__main::before { background: url('../img/marca/trama-hierba.png') repeat-x 0 0 / 288px 48px; }
