/* =========================
   TYPOGRAPHY OVERRIDES (CLEAN)
   - deduplicated
   - scoped where needed
========================= */

/* ===== Heading scale ===== */
:root{
  --h1-size: clamp(2.6rem, 2.0rem + 2.2vw, 3.6rem);
  --h2-size: clamp(2.0rem, 1.6rem + 1.0vw, 2.5rem);
  --h3-size: clamp(1.5rem, 1.3rem + 0.5vw, 1.8rem);
  --h4-size: 1.25rem;
  --h5-size: 1rem;
  --h6-size: 0.9rem;

  --h1-track: 0.02em;
  --h2-track: 0.02em;
  --h3-track: 0.01em;
  --h4-track: 0.01em;
  --h5-track: 0.005em;
  --h6-track: 0.005em;

  --h1-weight: 700;
  --h2-weight: 700;
  --h3-weight: 700;
  --h4-weight: 600;
  --h5-weight: 600;
  --h6-weight: 600;

  --fade-ms: 500ms;
  --ls-nav: 0.02em;
}

/* Headings */
h1{ font-size: var(--h1-size); letter-spacing: var(--h1-track); font-weight: var(--h1-weight); line-height:1.2; }
h2{ font-size: var(--h2-size); letter-spacing: var(--h2-track); font-weight: var(--h2-weight); line-height:1.25; }
h3{ font-size: var(--h3-size); letter-spacing: var(--h3-track); font-weight: var(--h3-weight); line-height:1.3; }
h4{ font-size: var(--h4-size); letter-spacing: var(--h4-track); font-weight: var(--h4-weight); line-height:1.35; }
h5{ font-size: var(--h5-size); letter-spacing: var(--h5-track); font-weight: var(--h5-weight); line-height:1.4; }
h6{ font-size: var(--h6-size); letter-spacing: var(--h6-track); font-weight: var(--h6-weight); line-height:1.45; }

/* Scoped tweaks */
.hero h1{ font-size: clamp(2.8rem, 2.1rem + 2.6vw, 4rem); letter-spacing:.03em; font-weight:300; }
.section-heading{ letter-spacing:.015em; font-weight:700; }

/* Nav / buttons tone */
.navbar .nav-link, .btn, .section-heading{
  font-weight:300;
  text-transform:none;
  text-align:center;
}

/* ===== Logo fade ===== */
.logo{
  display:block;
  width: clamp(180px, 60vw, 360px);
  max-width: 100vw;
  height:auto;
  padding-bottom: clamp(16px, 8vw, 56px);
}
.logo--onload{
  opacity:0;
  animation: fade-in var(--fade-ms) ease-out both;
  animation-delay:120ms;
}
@keyframes fade-in{ from{opacity:0;} to{opacity:1;} }
@media (prefers-reduced-motion: reduce){
  .logo--onload{ animation:none; opacity:1; }
}

/* ===== Nav tracking ===== */
@media (min-width:768px){
  :root{ --ls-nav: 0.03em; }
}
.nav{
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  font-weight:500;
}
.nav a{ text-decoration:none; padding:.5rem .75rem; }

/* ===== Discover button (clean) ===== */
.btn-discover{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.6rem 1rem; border-radius:.75rem;
  background: transparent; border: none; box-shadow:none;
  color:#fff; font-weight:300;
}
.btn-discover::before,
.btn-discover::after{
  content:"▾";
  display:inline-block;
  animation:nudge-down var(--interval,6s) ease-out infinite;
}
.btn-discover::before{ animation-delay: calc(var(--interval,6s)*-0.33); }
.btn-discover::after { animation-delay: calc(var(--interval,6s)*-0.66); }

@keyframes nudge-down{
  0%{transform:translateY(0);}
  4%{transform:translateY(4px);}
  8%{transform:translateY(0);}
  100%{transform:translateY(0);}
}
@media (prefers-reduced-motion: reduce){
  .btn-discover::before, .btn-discover::after{ animation:none; }
}

/* Links reset */
a.btn-discover,
a.btn-discover:link,
a.btn-discover:visited,
a.btn-discover:hover,
a.btn-discover:focus{ text-decoration:none; }

/* ===== Back to top (single arrow) ===== */
.nav-backtotop{
  display:inline-flex; align-items:center; justify-content:center;
  width:1.75rem; line-height:1; text-decoration:none;
  --interval:6s; font-weight:600;
}
.nav-backtotop::before{
  content:"↑";
  animation:nudge-up var(--interval,6s) ease-out infinite;
}
.nav-backtotop::after{ content:none; }

@keyframes nudge-up{
  0%{transform:translateY(0);}
  4%{transform:translateY(-4px);}
  8%{transform:translateY(0);}
  100%{transform:translateY(0);}
}
@media (prefers-reduced-motion: reduce){
  .nav-backtotop::before{ animation:none; }
}

/* ===== Global guards ===== */
html{ scroll-behavior:smooth; }
html, body{ max-width:100%; overflow-x:clip; }
@supports not (overflow-x: clip){
  html, body{ overflow-x:hidden; }
}
img, svg, canvas, video{ max-width:100%; height:auto; }

/* ===== Hero text ===== */
.hero h1{
  max-width:900px;
  margin:.5rem auto 0;
  font-size: clamp(1.9rem, 1.1rem + 4vw, 2.8rem);
  line-height:1.2;
}
.hero-motto{
  margin:2rem auto 0;
  font-size: clamp(1.9rem, 1.1rem + 4vw, 2.8rem);
  line-height:1.2;
  font-weight:300;
  color:#fff;
}
.hero-motto span{ display:block; white-space:nowrap; }

/* ===== Section title ===== */
.section-title{
  font-size: clamp(1.7rem, 2.3rem, 2.3rem);
  font-weight:200;
  /*letter-spacing:.08em;
   text-transform:uppercase; */
  text-align:center;
  color: var(--light);
  margin-bottom:2rem;
}
