/* ============================================================
   Temporada · Flores amarillas (hasta el 25 de septiembre de 2026)
   ------------------------------------------------------------
   Todo lo visual de la temporada vive acá. Se carga desde el <head>
   de todas las páginas (ver .build/gen.sh) porque el enlace del menú
   y la banda de la portada también son de temporada.

   Colores propios: el catálogo trabaja sobre papel crema con amarillo.
   Se usan solo dentro de las secciones de temporada, para que el resto
   del sitio siga en su paleta oscura.
   ============================================================ */

:root{
  --am-amarillo:#e8b73a;
  --am-amarillo-hondo:#b8860b;
  --am-amarillo-tenue:rgba(232,183,58,.18);
  --am-crema:#f6eedb;
  --am-crema-hondo:#e9dcbb;
  --am-papel:#fffaf0;
  --am-tinta:#2b241b;
  --am-tinta-2:#6a5a42;
}

/* ---------- Enlace del menú ---------- */
.nav a[data-temporada]{color:var(--am-amarillo)}
.nav a[data-temporada]::before{
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--am-amarillo);box-shadow:0 0 0 3px var(--am-amarillo-tenue);
  margin-right:.55rem;vertical-align:middle;transform:translateY(-1px);
}

/* ---------- Portada de la temporada ---------- */
.am-hero{
  position:relative;overflow:hidden;isolation:isolate;text-align:center;color:var(--hueso);
  padding:calc(var(--nav-alto) + clamp(3.5rem,8vw,6.5rem)) 0 clamp(4.5rem,9vw,7rem);
  background:
    radial-gradient(60% 55% at 50% 38%,rgba(232,183,58,.22) 0%,rgba(232,183,58,0) 70%),
    var(--negro);
}
.am-hero__deco{position:absolute;z-index:-1;height:auto;pointer-events:none;opacity:.92}
.am-hero__deco--izq{width:clamp(150px,22vw,290px);left:-50px;bottom:-60px;transform:rotate(-14deg)}
.am-hero__deco--der{width:clamp(130px,19vw,250px);right:-40px;top:calc(var(--nav-alto) + 1rem);transform:rotate(22deg)}
.am-hero__eyebrow{
  display:inline-block;font-size:.62rem;letter-spacing:.42em;text-transform:uppercase;color:var(--am-amarillo);
  padding:.55rem 1.4rem;border:1px solid var(--am-amarillo-tenue);margin-bottom:1.8rem;
}
.am-hero h1{font-family:var(--display);font-weight:400;font-size:clamp(3rem,8.5vw,6.2rem);line-height:.98;color:var(--hueso)}
.am-hero h1 em{display:block;font-style:normal;font-weight:200;color:var(--am-amarillo)}
.am-hero p{max-width:34rem;margin:1.6rem auto 2.4rem;color:rgba(245,241,232,.72);line-height:1.85}

/* ---------- Secciones sobre papel ---------- */
.am-papel{
  /* Papel crema con manchas de acuarela, como el catálogo impreso.
     Hecho con gradientes para no depender de una imagen de fondo. */
  background:
    radial-gradient(38% 30% at 6% 8%,rgba(245,208,74,.38) 0%,rgba(245,208,74,0) 70%),
    radial-gradient(34% 28% at 96% 18%,rgba(244,184,150,.32) 0%,rgba(244,184,150,0) 70%),
    radial-gradient(40% 32% at 92% 92%,rgba(245,208,74,.30) 0%,rgba(245,208,74,0) 70%),
    linear-gradient(180deg,#f8f1e1 0%,var(--am-crema) 100%);
  color:var(--am-tinta);padding:clamp(4rem,8vw,6.5rem) 0;
}
.am-papel .eyebrow{color:var(--am-amarillo-hondo)}
.am-papel .eyebrow::before{background:var(--am-amarillo-hondo)}
.am-papel h2,.am-papel h3{color:var(--am-tinta)}

.am-grupo + .am-grupo{margin-top:clamp(3.5rem,7vw,5rem)}
.am-grupo__cab{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.6rem 2rem;
  border-bottom:1px solid var(--am-crema-hondo);padding-bottom:1rem;margin-bottom:1.8rem;
}
.am-grupo__cab h2{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,3.4vw,2.4rem);margin:0}
.am-grupo__cab p{margin:0;color:var(--am-tinta-2);font-size:.9rem;max-width:34rem}

.am-ramos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.4rem}

.am-ramo{
  display:flex;flex-direction:column;background:var(--am-papel);
  border:1px solid var(--am-crema-hondo);transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.am-ramo:hover{transform:translateY(-6px);box-shadow:0 26px 40px -28px rgba(80,58,20,.45)}
.am-ramo__foto{
  /* Alto fijo por proporción. La foto va en absoluto: si fuera un hijo
     normal, los ramos unitarios —muy verticales— estirarían la caja y
     con ella toda la fila de tarjetas. */
  position:relative;display:block;aspect-ratio:4/4.6;overflow:hidden;
  background:radial-gradient(70% 60% at 50% 48%,#fffdf6 0%,var(--am-papel) 60%,#f3e8cc 100%);
}
.am-ramo__foto img{
  position:absolute;top:1.3rem;right:1.3rem;bottom:.7rem;left:1.3rem;
  width:calc(100% - 2.6rem);height:calc(100% - 2rem);object-fit:contain;
  filter:drop-shadow(0 16px 16px rgba(70,50,15,.2));transition:transform .9s var(--ease);
}
.am-ramo:hover .am-ramo__foto img{transform:scale(1.04)}
.am-ramo__cuerpo{display:flex;flex-direction:column;flex:1;padding:1.2rem 1.4rem 1.4rem}
.am-ramo__cuerpo h3{font-family:var(--display);font-weight:500;font-size:1.25rem;line-height:1.2;margin:0 0 .35rem}
.am-ramo__cuerpo p{margin:0;color:var(--am-tinta-2);font-size:.84rem;line-height:1.65;flex:1}
.am-ramo__chip{
  align-self:flex-start;margin-top:.7rem;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--am-amarillo-hondo);background:var(--am-amarillo-tenue);padding:.3rem .6rem;
}
.am-ramo__pie{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--am-crema-hondo);
}
.am-ramo__precio{font-family:var(--display);font-size:1.5rem;color:var(--am-tinta);font-variant-numeric:tabular-nums}
.am-ramo__link{
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--am-amarillo-hondo);
  white-space:nowrap;transition:letter-spacing .3s;
}
.am-ramo__link:hover{letter-spacing:.26em}
.am-ramo__link:focus-visible,.am-ramo__foto:focus-visible{outline:2px solid var(--am-amarillo-hondo);outline-offset:3px}

/* ---------- Condiciones ---------- */
.am-condiciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.2rem 2.4rem;margin-top:2.4rem}
.am-condicion h3{font-family:var(--display);font-weight:400;font-size:1.25rem;color:var(--hueso);margin:0 0 .5rem}
.am-condicion p{margin:0;color:var(--texto-tenue);font-size:.86rem;line-height:1.75}
.am-condicion strong{color:var(--am-amarillo);font-weight:500}

/* ---------- Banda en la portada ---------- */
.am-banda .am-ramos{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.am-banda__cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.4rem 2rem;margin-bottom:2.2rem}
.am-banda__cab h2{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4.2vw,3rem);margin:.3rem 0 0}
.am-banda__cab h2 em{font-style:normal;font-weight:300;color:var(--am-amarillo-hondo)}
.am-banda__cab p{margin:.6rem 0 0;color:var(--am-tinta-2);max-width:32rem;font-size:.92rem}
.am-boton{
  display:inline-flex;align-items:center;gap:.6rem;background:var(--am-tinta);color:var(--am-papel);
  font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;padding:1rem 1.6rem;
  border:1px solid var(--am-tinta);transition:background .35s,color .35s;
}
.am-boton:hover{background:transparent;color:var(--am-tinta)}

/* ---------- Temporada terminada ---------- */
.am-fin{text-align:center;padding:clamp(4rem,9vw,7rem) 0}
.am-fin p{max-width:32rem;margin:1rem auto 2rem;color:var(--texto-tenue)}

@media (prefers-reduced-motion:reduce){
  .am-ramo,.am-ramo__foto img,.am-ramo__link{transition:none}
  .am-ramo:hover,.am-ramo:hover .am-ramo__foto img{transform:none}
}
