@font-face {
  font-family: "Baloo Bhai 2";
  src: url("../fonts/baloo-bhai-2.ttf") format("truetype");
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: "Gluten";
  src: url("../fonts/gluten.ttf") format("truetype");
  font-weight: 100 900;
  font-style: oblique -12deg 0deg;
  font-display: swap;
}

:root {
  --red: #ed1c24;
  --red-deep: #9f090d;
  --ink: #171717;
  --muted: #626262;
  --paper: #ffffff;
  --cream: #fbf7f2;
  --green: #42a447;
  --blue: #2278c9;
  --orange: #f79416;
  --purple: #a02d92;
  --shadow: 0 24px 60px rgba(82, 25, 17, .13);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Baloo Bhai 2", sans-serif;
  font-size: 17px;
  line-height: 1.5;
}
a { color: inherit; }
img { display: block; max-width: 100%; }

.site-header {
  position: fixed;
  z-index: 30;
  inset: 0 0 auto;
  min-height: 78px;
  display: flex;
  align-items: center;
  gap: 2.4rem;
  padding: .7rem clamp(1.2rem, 5vw, 5rem);
  color: white;
  background: rgba(172, 7, 12, .95);
  border-bottom: 1px solid rgba(255,255,255,.17);
  backdrop-filter: blur(14px);
}

.brand { display: inline-block; text-decoration: none; }
.brand img, img.brand { object-fit: contain; }
.brand--small img, img.brand--small { width: 112px; height: auto; }
.site-header nav { display: flex; gap: 1.7rem; margin-left: auto; }
.site-header nav a {
  text-decoration: none;
  font-weight: 700;
  font-size: .92rem;
  letter-spacing: .02em;
}

.button {
  display: inline-flex;
  min-height: 3.25rem;
  padding: .8rem 1.45rem;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  color: white;
  background: var(--red);
  font: 700 1rem/1 "Baloo Bhai 2", sans-serif;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(237,28,36,.25); }
.button--small { min-height: 2.6rem; padding: .55rem 1.2rem; background: white; color: var(--red); }

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  align-content: center;
  padding: 10rem clamp(1.25rem, 8vw, 9rem) 4rem;
  color: white;
  background:
    linear-gradient(90deg, rgba(104,0,5,.28) 0%, rgba(104,0,5,.10) 46%, rgba(104,0,5,0) 72%),
    url("../img/background-slider.webp") center center / cover no-repeat;
}
.hero::after { content: none; }
.hero__glow {
  display: none;
}
.hero__content, .hero__meta { position: relative; z-index: 2; }
.brand--hero { width: clamp(260px, 47vw, 650px); height: auto; }
.hero h1 {
  max-width: 800px;
  margin: 1.6rem 0 1rem;
  font-size: clamp(2.2rem, 4.2vw, 4.7rem);
  line-height: 1.04;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
.hero h1 span { font-weight: 400; }
.hero__content > p { max-width: 630px; font-size: 1.15rem; color: rgba(255,255,255,.88); }
.hero__actions { display: flex; align-items: center; gap: 1.5rem; margin-top: 2rem; }
.button--light { background: white; color: var(--red); }
.text-link { display: inline-flex; gap: .5rem; align-items: center; font-weight: 700; text-underline-offset: .25rem; }
.text-link--light { color: white; }
.hero__meta { display: flex; gap: clamp(1.5rem, 5vw, 5rem); margin-top: 4.2rem; }
.hero__meta div { display: grid; gap: .05rem; }
.hero__meta span { font-size: .72rem; letter-spacing: .13em; text-transform: uppercase; color: rgba(255,255,255,.68); }
.hero__meta strong { font-size: .96rem; }

.section { position: relative; overflow: hidden; padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 7vw, 8rem); }
.eyebrow {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-bottom: .9rem;
  color: var(--red);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.eyebrow::before {
  content: "";
  width: .36rem;
  height: .36rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 -.55rem 0 var(--red), 0 .55rem 0 var(--red);
}
.eyebrow--light { color: white; }
.eyebrow--light::before { background: white; box-shadow: 0 -.55rem 0 white, 0 .55rem 0 white; }
.section-heading h2, .passport h2, .location h2, .registration h2 {
  margin: 0;
  font-size: clamp(2.5rem, 5.2vw, 5.6rem);
  line-height: 1;
  letter-spacing: -.04em;
}
.section-heading--center { max-width: 900px; margin: 0 auto 4rem; text-align: left; }

.intro {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 4rem;
  background: white;
}
.intro, .themes, .committee, .passport, .location { isolation: isolate; }
.intro::before, .themes::before, .committee::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 620px;
  aspect-ratio: 1;
  right: -240px;
  top: -180px;
  border-radius: 50%;
  border: 1px solid rgba(237,28,36,.07);
  box-shadow: 0 0 0 35px rgba(237,28,36,.025), 0 0 0 70px rgba(237,28,36,.018);
}
.intro > *, .themes > *, .committee > * { position: relative; z-index: 1; }
.intro__copy { max-width: 740px; }
.lead { margin-top: 0; font-size: clamp(1.45rem, 2.2vw, 2.15rem); line-height: 1.25; font-weight: 700; }
.intro__copy p:last-child { color: var(--muted); }

.stats { grid-column: 1 / -1; display: flex; justify-content: center; align-items: center; margin-top: 3rem; }
.stats article {
  position: relative;
  width: clamp(165px, 18vw, 250px);
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: clamp(-26px, -2vw, -12px);
  padding: 1.6rem;
  color: white;
  text-align: center;
  background: var(--orange);
  border: 9px solid white;
  border-radius: 53% 47% 58% 42% / 48% 58% 42% 52%;
}
.stats article:nth-child(2) { background: #606060; transform: rotate(4deg); border-radius: 45% 55% 46% 54% / 56% 43% 57% 44%; }
.stats article:nth-child(3) { background: var(--purple); transform: rotate(-3deg); }
.stats article:nth-child(4) { background: var(--green); transform: rotate(3deg); border-radius: 59% 41% 47% 53% / 44% 57% 43% 56%; }
.stats strong { font: 700 clamp(3.2rem, 6vw, 6rem)/.8 "Baloo Bhai 2", sans-serif; }
.stats span { max-width: 130px; font-size: .94rem; font-weight: 700; line-height: 1.15; }

.themes { background: #fff; }
.theme-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.5rem, 3vw, 3.5rem); }
.theme {
  min-height: 360px;
  padding: 2rem 0 0;
  color: var(--ink);
  background: transparent;
  border-top: 2px solid currentColor;
}
.theme > span { display: block; margin-bottom: 1rem; font-weight: 800; font-size: .8rem; color: var(--muted); }
.theme h3 {
  margin: 0 0 1.2rem;
  font: 540 clamp(2.8rem, 4.4vw, 5.3rem)/.85 "Gluten", cursive;
  letter-spacing: -.04em;
  transform: rotate(-4deg);
  transform-origin: left center;
}
.theme p { margin: 0; color: var(--muted); }
.theme--red { color: var(--red); }
.theme--green { color: var(--green); }
.theme--blue { color: var(--blue); }
.theme--orange { color: var(--orange); }
.theme p, .theme > span { color: var(--ink); }

.committee { color: var(--ink); background: white; }
.committee .section-heading { margin-bottom: 4rem; }
.people-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem 5rem; }
.person {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 1.6rem;
  align-items: center;
  padding: 0 0 2.5rem;
  border-bottom: 1px solid #ece6e1;
}
.person img {
  width: 170px;
  height: 188px;
  object-fit: cover;
  object-position: center top;
  background: white;
  border-radius: 48% 52% 46% 54% / 55% 48% 52% 45%;
  box-shadow: inset 0 0 0 1px rgba(30,22,20,.05);
}
.person span { color: var(--ink); font-size: .74rem; text-transform: uppercase; }
.person h3 { margin: 0 0 .5rem; color: var(--red); font-size: 1.55rem; line-height: 1; text-transform: uppercase; }
.person p { margin: 0; color: var(--muted); font-size: .95rem; }

.passport {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 1fr);
  align-items: center;
  gap: clamp(2.5rem, 5vw, 5rem);
  background: white;
}
.passport__visual {
  min-width: 0;
  display: grid;
  place-items: center;
}
.passport-composition {
  width: min(92%, 680px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 25px 24px rgba(96,20,14,.12));
}
.passport__copy { min-width: 0; }
.passport__copy p { color: var(--muted); font-size: 1.1rem; }
blockquote {
  position: relative;
  margin: 2rem 0 0;
  padding: 1.1rem 1.4rem 1.1rem 2rem;
  font-size: 1.3rem;
  font-weight: 700;
  background: var(--cream);
  border-radius: 60% 40% 55% 45% / 45% 57% 43% 55%;
}
blockquote::before { content: "“"; position: absolute; left: .6rem; top: -.15rem; color: var(--red); font-size: 3rem; }

.location { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(3rem, 7vw, 7rem); align-items: center; }
.location::before {
  content: "";
  position: absolute;
  width: 230px;
  aspect-ratio: 1;
  left: 2%;
  bottom: 8%;
  background: var(--red);
  border-radius: 62% 38% 44% 56% / 46% 62% 38% 54%;
}
.location__image { position: relative; z-index: 2; }
.location__image::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 170px;
  aspect-ratio: 1;
  right: -35px;
  top: -35px;
  background: var(--orange);
  border-radius: 43% 57% 52% 48% / 59% 41% 59% 41%;
}
.location__image img {
  width: 100%;
  height: 590px;
  object-fit: cover;
  border-radius: 51% 49% 44% 56% / 43% 58% 42% 57%;
}
.location__copy { position: relative; z-index: 2; }
.location__copy p { color: var(--muted); font-size: 1.1rem; }
.location address { margin: 2rem 0; font-style: normal; font-weight: 700; }

.registration {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: clamp(3rem, 8vw, 8rem);
  padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 7vw, 8rem);
  color: white;
  background: linear-gradient(140deg, var(--red-deep), var(--red));
}
.registration::before {
  content: "";
  position: absolute;
  width: 640px;
  aspect-ratio: 1;
  left: -290px;
  bottom: -290px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(255,255,255,.035), 0 0 0 76px rgba(255,255,255,.025);
}
.registration > * { position: relative; z-index: 1; }
.registration__intro p { color: rgba(255,255,255,.86); font-size: 1.1rem; }
.registration__intro ul { padding-left: 1.25rem; margin-top: 2rem; }
.registration__intro li { margin: .6rem 0; }
.signup-form {
  display: grid;
  gap: 1.15rem;
  width: 100%;
  max-width: 820px;
  justify-self: end;
  padding: clamp(2rem, 4.5vw, 3.6rem);
  color: var(--ink);
  background: white;
  border-radius: 58% 42% 3rem 3rem / 7% 7% 3rem 3rem;
  box-shadow: var(--shadow);
}
.form-title { margin-bottom:.35rem; padding-bottom:1.25rem; border-bottom:1px solid #eee7e2; }
.form-title span { color:var(--red); font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.form-title h3 { margin:.15rem 0 .3rem; font-size:clamp(1.8rem,3vw,2.6rem); line-height:1; }
.form-title p { margin:0; color:var(--muted); font-size:.95rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.signup-form label { display: grid; gap: .35rem; font-size: .9rem; font-weight: 700; }
.signup-form label > span { color: var(--muted); font-weight: 400; }
input, select {
  width: 100%;
  min-height: 56px;
  padding: .85rem 1rem;
  border: 1px solid #ded8d4;
  border-radius: .6rem;
  outline: none;
  background: white;
  font: 400 1rem "Baloo Bhai 2", sans-serif;
}
input:focus, select:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(237,28,36,.1); }
.check { grid-template-columns: auto 1fr !important; align-items: start; }
.check input { width: 1.1rem; height: 1.1rem; margin-top: .24rem; }
.check a { color: var(--red); }
.check em { font-weight: 400; }
.button--submit { width: 100%; }
.form-status { min-height: 1.2rem; margin: 0; text-align: center; font-size: .9rem; }
.form-status.error { color: #a00000; }
.honeypot { position: absolute; left: -9999px; }

.social-callout {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  align-items:center;
  gap:clamp(3rem,7vw,7rem);
  color:white;
  background:linear-gradient(125deg,var(--red-deep),var(--red));
}
.social-callout::after { content:""; position:absolute; width:420px; aspect-ratio:1; right:-170px; top:-210px; border:1px solid rgba(255,255,255,.17); border-radius:50%; box-shadow:0 0 0 34px rgba(255,255,255,.035),0 0 0 68px rgba(255,255,255,.025); }
.social-callout>* { position:relative; z-index:1; }
.social-callout h2 { margin:0; font-size:clamp(2.5rem,4.8vw,5rem); line-height:1; letter-spacing:-.04em; }
.social-callout__intro p { max-width:650px; color:rgba(255,255,255,.86); font-size:1.08rem; }
.social-callout__actions { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.social-card { min-height:240px; display:flex; flex-direction:column; justify-content:space-between; padding:1.6rem; color:white; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); border-radius:2rem; text-decoration:none; backdrop-filter:blur(8px); transition:transform .2s ease,background .2s ease; }
.social-card:hover { transform:translateY(-4px); background:rgba(255,255,255,.18); }
.social-card span { font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.social-card strong { font-size:1.7rem; line-height:1; }
.social-card i { font-style:normal; font-weight:700; }
.social-card--light { color:var(--red-deep); background:white; }
.social-card--light:hover { background:#fff8f5; }
.social-card--facebook { background:#1877f2; border-color:rgba(255,255,255,.3); }
.social-card--facebook:hover { background:#0f67dc; }
.gallery-socials { display:flex; flex-wrap:wrap; gap:.7rem; }
.button--outline { color:var(--red); background:white; box-shadow:inset 0 0 0 1px rgba(237,28,36,.24); }

.gallery-page { min-height:100vh; padding:9rem 1.25rem 5rem; color:white; background:linear-gradient(145deg,var(--red-deep),var(--red)); }
.gallery-shell { width:min(1120px,100%); margin:auto; }
.gallery-hero { display:grid; grid-template-columns:1fr .8fr; gap:clamp(2rem,7vw,7rem); align-items:end; }
.gallery-hero h1 { margin:.4rem 0 1.2rem; font-size:clamp(3.4rem,8vw,8rem); line-height:.86; letter-spacing:-.055em; }
.gallery-hero p { max-width:650px; color:rgba(255,255,255,.85); font-size:1.15rem; }
.gallery-notice { padding:2rem; color:var(--ink); background:white; border-radius:2rem; box-shadow:var(--shadow); }
.gallery-notice span { color:var(--red); font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.gallery-notice h2 { margin:.4rem 0 .7rem; font-size:2rem; line-height:1; }
.gallery-notice p { margin:0 0 1.2rem; color:var(--muted); }
.gallery-preview { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:4rem; }
.gallery-preview div { min-height:220px; display:grid; place-items:center; padding:1.5rem; text-align:center; color:rgba(255,255,255,.75); border:1px solid rgba(255,255,255,.22); border-radius:2rem; background:rgba(255,255,255,.07); }

footer {
  display: grid;
  grid-template-columns: .8fr 1.2fr 1.5fr 1fr;
  gap: 2rem;
  align-items: center;
  padding: 2.5rem clamp(1.25rem, 7vw, 8rem);
  color: white;
  background: var(--red-deep);
  font-size: .9rem;
}
footer a { color: white; }
.therapeia-link { display:inline-block; text-decoration:none; }
.therapeia-link span { color:rgba(255,255,255,.72); font-size:.8rem; }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

.success-page { min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: linear-gradient(145deg, var(--red-deep), var(--red)); }
.success-card { max-width: 680px; padding: 4rem; text-align: center; background: white; border-radius: 50% 50% 2rem 2rem / 10% 10% 2rem 2rem; }
.success-card .brand { width: 150px; margin: 0 auto; padding: .7rem; background: var(--red); border-radius: 1rem; }
.success-icon { display: grid; place-items: center; width: 70px; aspect-ratio: 1; margin: 2rem auto; border-radius: 50%; color: var(--green); background: #eaf7ec; font-size: 2rem; }
.success-card h1 { font-size: clamp(2.4rem, 6vw, 4rem); line-height: 1; }
.legal { max-width: 850px; margin: 0 auto; padding: 5rem 1.5rem; }
.brand--red { padding: .6rem .8rem; background: var(--red); border-radius: .8rem; }
.legal h1 { font-size: clamp(2.4rem, 5vw, 4.5rem); line-height: 1; }
.legal h2 { margin-top: 2.5rem; }
.legal p { color: var(--muted); }

@media (max-width: 1050px) {
  .site-header nav { display: none; }
  .site-header .button { margin-left: auto; }
  .intro, .passport, .location, .registration, .social-callout { grid-template-columns: 1fr; }
  .theme-grid { grid-template-columns: 1fr 1fr; }
  .people-grid { gap: 3rem 2rem; }
  .stats { flex-wrap: wrap; }
  .passport { gap: 2rem; }
  .passport__visual { max-width: 780px; width: 100%; margin: auto; }
  .location__image img { height: 480px; }
  .signup-form { justify-self:stretch; max-width:none; }
  .gallery-hero { grid-template-columns:1fr; }
  footer { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 700px) {
  body { font-size: 16px; }
  .site-header { min-height: 68px; padding: .6rem 1rem; }
  .brand--small img, img.brand--small { width: 90px; }
  .hero { min-height: 900px; padding: 8rem 1.25rem 2.5rem; }
  .brand--hero { width: min(85vw, 390px); }
  .hero h1 { font-size: 2.4rem; }
  .hero__actions, .hero__meta { align-items: flex-start; flex-direction: column; }
  .hero__meta { gap: 1rem; margin-top: 3rem; }
  .section { padding: 4.5rem 1.25rem; }
  .intro, .themes, .committee, .passport, .location { gap: 2.5rem; }
  .section-heading--center { text-align: left; }
  .stats { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; margin-top: 0; }
  .stats article { width: 100%; margin: 0; border-width: 5px; }
  .theme-grid, .people-grid { grid-template-columns: 1fr; }
  .theme-grid { gap: 0; }
  .theme { min-height: 0; padding: 1.5rem 0 2.75rem; }
  .committee .section-heading { margin-bottom: 2.5rem; }
  .people-grid { gap: 2rem; }
  .person { grid-template-columns: 115px 1fr; gap: 1rem; }
  .person img { width: 115px; height: 132px; }
  .person h3 { font-size: 1.25rem; }
  .person p { font-size: .84rem; }
  .passport { min-height: auto; }
  .passport__visual { min-height: 0; }
  .passport-composition { width: calc(100% + 1rem); max-width: none; }
  .location__image img { height: 330px; }
  .registration { padding: 4.5rem 1.25rem; }
  .signup-form { border-radius: 2rem; }
  .social-callout__actions,.gallery-preview { grid-template-columns:1fr; }
  .social-card { min-height:190px; }
  .gallery-page { padding-top:7.5rem; }
  .gallery-preview div { min-height:150px; }
  .form-row { grid-template-columns: 1fr; }
  footer { grid-template-columns: 1fr; }
  .success-card { padding: 2.5rem 1.5rem; border-radius: 2rem; }
}

@media (max-width: 460px) {
  .person { grid-template-columns: 92px minmax(0, 1fr); align-items: start; }
  .person img { width: 92px; height: 112px; }
  .person h3 { overflow-wrap: anywhere; }
  .stats strong { font-size: clamp(2.5rem, 15vw, 4rem); }
  .stats span { font-size: .82rem; }
  .passport-composition { width: calc(100% + 2rem); margin-inline: -1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
}
