/* Pressumo — site-specific styles. Indigo + the bottle spectrum; everything else quiet. */
:root{--verde:#3d6b16;--noche-2:#322e78}
a{color:var(--verde)}
:focus-visible{outline-color:var(--brand)}
h1,h2,h3{font-weight:700;letter-spacing:0}
h2{font-size:clamp(2.2rem,1.6rem + 2.6vw,3.6rem);line-height:1}
.lede{color:var(--ink-2)}

/* ---- Header: indigo bar ---------------------------------------- */
.site-header{background:var(--brand);border-bottom:0;backdrop-filter:none}
.site-header .brand img{height:34px;width:auto}
.nav a{color:#dcdaf2;font-size:var(--fs-sm)}
.nav a:hover,.nav a[aria-current="page"]{color:#fff}
.nav a.btn-accent,.nav a.btn-accent:hover{color:var(--accent-ink)}
.nav-toggle{color:#fff}
@media(max-width:860px){
  .nav{background:var(--brand);border-bottom:1px solid var(--noche-2)}
  .nav a{border-bottom-color:var(--noche-2);color:#fff}
}
.site-header :focus-visible,.hero :focus-visible,.site-footer :focus-visible{outline-color:var(--accent)}

/* ---- Hero ------------------------------------------------------- */
.hero-pressumo{background:var(--brand);color:#fff;padding:clamp(2.5rem,7vw,5.5rem) 0 0}
.hero-pressumo h1{font-family:var(--font-display);font-size:clamp(3rem,1.4rem + 7vw,7.2rem);line-height:.92;font-weight:700;max-width:12ch;margin:0}
.hero-pressumo .lede{color:#dcdaf2;margin-top:var(--s-5)}
.hero-pressumo .cluster{margin-top:var(--s-6)}
.btn-onDark{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-onDark:hover{border-color:#fff;color:#fff}
.hero-pressumo .poster{margin-top:clamp(2rem,5vw,3.5rem);display:block}
.hero-pressumo .poster img{width:100%;height:auto;animation:rise .9s var(--ease) .1s both}
@keyframes rise{from{transform:translateY(28px)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.hero-pressumo .poster img{animation:none}}

/* ---- La carta: the spectrum ----------------------------------- */
.carta-head{padding-block:var(--section) var(--s-6)}
.carta-head p{max-width:58ch}
.spectrum{list-style:none;margin:0;padding:0}
.spectrum li{background:var(--c);color:var(--t)}
.spectrum .row{display:grid;gap:var(--s-2) var(--s-6);grid-template-columns:1fr;padding:var(--s-5) 0;align-items:baseline}
@media(min-width:820px){.spectrum .row{grid-template-columns:minmax(0,5fr) minmax(0,6fr) minmax(0,3fr);padding:var(--s-6) 0}}
.spectrum h3{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(2rem,1.4rem + 2.4vw,3.2rem);line-height:.95;margin:0}
.spectrum h3 a{color:inherit;text-decoration:none}
.spectrum h3 a:hover{text-decoration:underline;text-decoration-thickness:3px}
.spectrum p{margin:0;font-size:var(--fs-md)}
.spectrum .nada{font-weight:600}
.spectrum .tags{font-size:var(--fs-sm);opacity:.92}
@media(min-width:820px){.spectrum .tags{text-align:right}}
.spectrum li :focus-visible{outline-color:currentColor}
.j-pura-vida{--c:#a3122e;--t:#fff}
.j-amor-de-verano{--c:#c8202f;--t:#fff}
.j-flor-de-piel{--c:#ec7a1c;--t:#1c1a3f}
.j-arriba-juan{--c:#f39a1e;--t:#1c1a3f}
.j-super-citrico{--c:#f4c51b;--t:#1c1a3f}
.j-ananahh{--c:#c9c43a;--t:#1c1a3f}
.j-green-power{--c:#8fb52f;--t:#1c1a3f}
.j-pacha-mama{--c:#4d7a1c;--t:#fff}
.j-elixir{--c:#3a6119;--t:#fff}

/* ---- Editorial sections -------------------------------------- */
.split.top{align-items:start}
.photo-tall{max-width:380px;margin-inline:auto;aspect-ratio:700/1033;background:#eeeef0}
.photo-tall img{width:100%;height:100%;object-fit:cover}
.claims{list-style:none;padding:0;margin:var(--s-5) 0 0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.claims li{border:1.5px solid var(--ink);border-radius:999px;padding:.3em .9em;font-size:var(--fs-sm);font-weight:600}
.list-rows h3{font-family:var(--font-display);font-size:clamp(1.6rem,1.3rem + 1vw,2.1rem)}
.list-rows li>span:last-child{font-weight:600;color:var(--ink)}
.facts{display:grid;grid-template-columns:auto 1fr;gap:.6em var(--s-5);margin:0}
.facts dt{color:var(--ink-2);font-size:var(--fs-sm);padding-top:.15em}
.facts dd{margin:0;font-weight:600}
.stores{columns:2 12rem;column-gap:var(--s-6);padding:0;list-style:none;margin:0}
.stores li{padding:.5em 0;border-bottom:1px solid var(--line);break-inside:avoid}
.btn-primary{box-shadow:none}

/* ---- Footer ------------------------------------------------------ */
.site-footer{background:var(--brand);color:#dcdaf2}
.site-footer .brand img{height:30px;width:auto}
.footer-bottom{color:#b9b6dd;border-top-color:rgba(255,255,255,.14)}

/* ---- Inner pages ------------------------------------------------- */
.page-title{font-size:clamp(2.6rem,1.6rem + 4vw,4.6rem);line-height:.95}
.juice-hero{border-top:18px solid var(--c)}
.juice-name{font-size:clamp(3.2rem,2rem + 5vw,6rem);line-height:.9;text-transform:uppercase}
.crumbs{font-size:var(--fs-sm);color:var(--ink-2)}
.swatch{background:var(--c);color:var(--t);display:grid;place-items:center;text-align:center;padding:var(--s-5)}
.swatch span{font-family:var(--font-display);font-size:clamp(2.6rem,2rem + 3vw,4rem);line-height:.9;text-transform:uppercase}
.chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.chips li{background:var(--c);color:var(--t);border-radius:999px}
.chips a{display:block;padding:.55em 1.05em;color:inherit;text-decoration:none;font-weight:600;font-size:var(--fs-sm);min-height:44px;line-height:1.9}
.chips a:hover{text-decoration:underline}
.prose{max-width:760px}
.prose h2{font-size:clamp(1.8rem,1.4rem + 1.4vw,2.4rem);margin-top:var(--s-7)}
.prose h2:first-child{margin-top:0}
.h-form{font-size:clamp(1.8rem,1.4rem + 1.4vw,2.4rem)}
.form select{appearance:auto}
.map{margin-top:var(--s-5)}

@media(max-width:600px){.btn{white-space:normal;text-align:center;max-width:100%}}
