:root {
  --primary: #005152;
  --primary-deep: #003d3e;
  --secondary: #f6b818;
  --secondary-bright: #ffcc33;
  --orange: var(--primary);
  --orange-deep: var(--primary-deep);
  --yellow: var(--secondary);
  --yellow-bright: var(--secondary-bright);
  --cream: #f7f4e6;
  --cream-2: #efe9d0;
  --sage: var(--primary);
  --sage-deep: var(--primary-deep);
  --pink: var(--secondary);
  --ink: #111;
  --muted: #3d3d3d;
  --white: #fff;
  --shop-y: #f6b818;
  --shop-p: #5aa8a9;
  --shop-g: #ffd56a;
  --shadow: 4px 4px 0 #000;
  --shadow-sm: 3px 3px 0 #000;
  --display: "Anton", Impact, sans-serif;
  --sans: "Gantari", system-ui, sans-serif;
  --hindi: "Tiro Telugu", serif;
  --header-h: 68px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --title-size: 48px;
  --section-y: 100px;
  --edge-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 16' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 0h56v5C49 5 49 16 42 16S35 5 28 5 21 16 14 16 7 5 0 5V0z'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: auto; }
body {
  font-family: var(--sans);
  color: var(--ink);
  background: var(--cream);
  line-height: 1.5;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
button, a { font-family: inherit; }
button { cursor: pointer; }
a { color: inherit; }

.skip-link {
  position: absolute;
  left: -999px;
  top: 0;
  background: #000;
  color: #fff;
  padding: .5rem 1rem;
  z-index: 9999;
}
.skip-link:focus { left: 1rem; top: 1rem; }

.wrap {
  width: min(1180px, calc(100% - 2.5rem));
  margin-inline: auto;
}
.display {
  font-family: var(--display);
  font-weight: 400;
  letter-spacing: .02em;
  text-transform: uppercase;
  line-height: .9;
  margin: 0;
}
h1, h2 {
  font-size: var(--title-size);
}
h1.display,
h2.display {
  font-size: var(--title-size);
}
.hindi {
  font-family: var(--hindi);
  font-style: italic;
  font-weight: 400;
  line-height: 1.45;
  overflow-wrap: break-word;
}
.eyebrow {
  font-family: var(--display);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .95rem;
  margin: 0 0 .4rem;
}
.muted { color: var(--muted); }
.tiny { font-size: .8rem; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.section-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 2.5rem;
}
.section-head .display { font-size: var(--title-size); }
.section-head .hindi {
  display: block;
  font-size: clamp(1.05rem, 2.4vw, 1.25rem);
  margin: .45rem 0 1rem;
  color: var(--muted);
  line-height: 1.5;
}
.section-head p { margin: 0 auto; max-width: 42rem; }

.display .word,
.display .char,
h1 .word,
h2 .word,
h3 .word {
  display: inline-block;
  vertical-align: top;
}

.scallop-bottom,
.scallop-top {
  position: relative;
}
.scallop-bottom::after,
.scallop-top::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 16px;
  pointer-events: none;
  z-index: 2;
  background-color: var(--scallop, var(--cream));
  -webkit-mask-image: var(--edge-wave);
  mask-image: var(--edge-wave);
  -webkit-mask-size: 56px 16px;
  mask-size: 56px 16px;
  -webkit-mask-repeat: repeat-x;
  mask-repeat: repeat-x;
  -webkit-mask-position: top;
  mask-position: top;
}
.scallop-bottom::after { bottom: -16px; }
.scallop-top::before {
  top: -16px;
  transform: scaleY(-1);
  transform-origin: center top;
}

.btn-solid,
.btn-ghost {
  border: 3px solid #000;
  box-shadow: var(--shadow-sm);
  background: var(--yellow);
  color: #000;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: .7rem 1.1rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn-ghost { background: var(--white); }
.btn-solid:hover,
.btn-ghost:hover {
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 #000;
}

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }

@media (max-width: 720px) {
  :root {
    --title-size: 28px;
    --section-y: 70px;
  }
  .wrap { width: min(1180px, calc(100% - 1.25rem)); }
}