/* AZUA marketing and design — poster chrome: jet black + hot orange.
   Venture sections are drenched in each venture's own brand palette. */

:root{
  --bg: oklch(0.10 0 0);
  --ink: oklch(0.97 0 0);
  --muted: oklch(0.74 0.02 36);
  --primary: oklch(0.62 0.19 36);       /* hot burnt orange */
  --primary-bright: oklch(0.70 0.19 40);
  --accent: oklch(0.86 0.14 95);        /* acid gold, small doses */
  --max: 1200px;
  --pad: clamp(1.25rem, 4vw, 3rem);
}

*{ box-sizing:border-box; margin:0; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Archivo", system-ui, sans-serif;
  font-size:1.0625rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }

h1,h2,h3{ text-wrap:balance; }

/* ---------- top bar ---------- */
.top{
  position:sticky; top:0; z-index:10;
  display:flex; justify-content:space-between; align-items:center;
  padding:0.9rem var(--pad);
  background:color-mix(in oklab, var(--bg) 82%, transparent);
  backdrop-filter:blur(10px);
}
.wordmark{
  font-weight:900; font-stretch:125%; letter-spacing:0.02em;
  font-size:1.35rem; color:var(--ink); text-decoration:none;
}
.wordmark:hover{ color:var(--primary-bright); }
.top-mail{
  color:var(--bg); background:var(--primary);
  text-decoration:none; font-weight:700; font-size:0.95rem;
  padding:0.45rem 0.95rem; border-radius:999px;
  color:#fff;
}
.top-mail:hover{ background:var(--primary-bright); }

/* ---------- hero ---------- */
.hero{
  padding:clamp(4rem, 12vh, 8rem) var(--pad) clamp(3rem, 8vh, 5rem);
  max-width:var(--max); margin-inline:auto;
}
.hero h1{ line-height:0.95; }
.hero-azua{
  display:block;
  font-size:clamp(4rem, 17vw, 6rem);
  font-weight:900; font-stretch:125%;
  letter-spacing:-0.015em;
  color:var(--primary);
}
.hero-sub{
  display:block;
  font-size:clamp(1.6rem, 5.4vw, 2.9rem);
  font-weight:650; font-stretch:105%;
  margin-top:0.35rem;
}
.hero-sub em{ font-style:italic; font-weight:400; color:var(--muted); }
.hero-lede{
  max-width:56ch; margin-top:1.75rem;
  font-size:clamp(1.05rem, 1.6vw, 1.25rem);
  color:oklch(0.88 0.01 36);
  text-wrap:pretty;
}
.hero-tickets{
  display:flex; flex-wrap:wrap; gap:0.55rem;
  margin-top:2.25rem;
}
.hero-tickets span{
  background:var(--c); color:var(--t);
  font-weight:700; font-size:0.92rem;
  padding:0.42rem 0.9rem; border-radius:6px;
  transform:rotate(-1deg);
}
.hero-tickets span:nth-child(even){ transform:rotate(1.2deg); }

/* ---------- venture bands ---------- */
.venture{
  display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:center;
  padding:clamp(3.5rem, 9vh, 6.5rem) var(--pad);
}
.venture > *{ max-width:calc(var(--max) * 0.55); }
.venture .v-copy{ justify-self:end; width:100%; }
.venture .v-media{ justify-self:start; width:100%; }
.venture.flip{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); }
.venture.flip .v-copy{ order:2; justify-self:start; }
.venture.flip .v-media{ order:1; justify-self:end; }

.venture h2{
  font-size:clamp(2.6rem, 7vw, 5rem);
  font-weight:900; font-stretch:118%;
  letter-spacing:-0.01em; line-height:0.98;
}
.v-lede{
  margin-top:1.1rem;
  font-size:clamp(1.05rem, 1.5vw, 1.2rem);
  max-width:48ch; text-wrap:pretty;
}
.v-role{
  margin-top:1rem; font-size:0.95rem; font-weight:600;
  max-width:44ch;
  opacity:0.82;
}
.v-link{
  display:inline-block; margin-top:1.5rem;
  font-weight:800; font-size:1.05rem;
  text-decoration:none;
  border-bottom:3px solid currentColor;
  padding-bottom:2px;
}
.v-link:hover{ opacity:0.75; }

.v-media img{ border-radius:10px; }
.v-media.browser{
  border-radius:12px; overflow:hidden;
  box-shadow:0 24px 60px oklch(0 0 0 / 0.35);
}
.v-media.browser img{ border-radius:0; }
.chrome{
  display:flex; align-items:center; gap:6px;
  padding:9px 12px;
  background:oklch(0.22 0.01 0 / 0.9);
}
.chrome i{ width:10px; height:10px; border-radius:50%; background:oklch(0.55 0.02 0); }
.chrome b{
  margin-left:10px; font-weight:600; font-size:0.78rem;
  color:oklch(0.85 0 0); letter-spacing:0.02em;
}

/* venture worlds */
.gs{ background:#264326; color:#e2efdd; }
.gs .v-role{ color:#e0c6a3; }
.gs .v-link{ color:#e2efdd; }
.gs .v-media img{ box-shadow:0 24px 60px oklch(0 0 0 / 0.4); }

.bx{ background:#eef4ec; color:#14201a; }
.bx .v-role{ color:#2c5c3f; }
.bx .v-link{ color:#14201a; }

.en{ background:#1F2937; color:#f3ede4; }
.en h2{ color:#E99289; }
.en .v-role{ color:#E99289; }
.en .v-link{ color:#f3ede4; }

.rt{ background:#e3cda6; color:#1c1a16; }
.rt .v-role{ color:#0d6e66; }
.rt .v-link{ color:#1c1a16; }

.pf{ background:#15110d; color:#e9dcc3; }
.pf h2{ color:#d8b56a; }
.pf .v-role{ color:#d8b56a; }
.pf .v-link{ color:#e9dcc3; }

.rn{ background:var(--bg); color:var(--ink); }
.rn h2{ color:var(--primary); }
.rn .v-role{ color:var(--muted); }
.rn .v-link{ color:var(--primary-bright); }
.rn .v-media img{ box-shadow:0 0 120px oklch(0.62 0.19 36 / 0.25); }

/* ---------- services ---------- */
.services{
  background:var(--primary); color:#fff;
  padding:clamp(3.5rem, 9vh, 6rem) var(--pad);
}
.services h2{
  max-width:var(--max); margin-inline:auto;
  font-size:clamp(2.2rem, 5.5vw, 3.6rem);
  font-weight:900; font-stretch:118%;
}
.services ul{
  max-width:var(--max); margin:2rem auto 0; padding:0;
  list-style:none;
  display:flex; flex-wrap:wrap; gap:0.75rem 0.75rem;
}
.services li{
  border:2px solid #fff; border-radius:999px;
  padding:0.6rem 1.3rem;
  font-weight:700; font-size:clamp(1rem, 1.5vw, 1.2rem);
}

/* ---------- contact ---------- */
.contact{
  padding:clamp(5rem, 14vh, 9rem) var(--pad);
  text-align:center;
}
.contact h2{
  font-size:clamp(2.8rem, 8vw, 6rem);
  font-weight:900; font-stretch:122%;
  letter-spacing:-0.015em;
}
.contact .mail{
  display:inline-block; margin-top:1.75rem;
  font-size:clamp(1.4rem, 3.4vw, 2.4rem);
  font-weight:800; color:var(--primary-bright);
  text-decoration:none;
  border-bottom:4px solid var(--primary);
  padding-bottom:4px;
}
.contact .mail:hover{ color:var(--accent); border-color:var(--accent); }
.contact .loc{ margin-top:1.5rem; color:var(--muted); font-size:0.95rem; }

/* ---------- footer ---------- */
footer{
  display:flex; flex-wrap:wrap; gap:0.5rem 2rem;
  justify-content:space-between;
  padding:1.5rem var(--pad) 2.5rem;
  color:oklch(0.55 0.01 36); font-size:0.85rem;
}

/* ---------- motion ---------- */
.anim .reveal{
  opacity:0; transform:translateY(22px);
  transition:opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.anim .reveal.in{ opacity:1; transform:none; }
.anim .v-media.reveal{ transition-delay:0.12s; }
@media (prefers-reduced-motion: reduce){
  .anim .reveal{ opacity:1; transform:none; transition:none; }
}

/* ---------- responsive ---------- */
@media (max-width: 860px){
  .venture, .venture.flip{ grid-template-columns:1fr; gap:1.75rem; }
  .venture .v-copy, .venture.flip .v-copy{ order:1; justify-self:stretch; max-width:none; }
  .venture .v-media, .venture.flip .v-media{ order:2; justify-self:stretch; max-width:none; }
}
