/* ===== Tokens ===== */
:root{
  --ink:#14213D;
  --paddle:#E4572E;
  --green:#1F7A4C;
  --cream:#F7F4EE;
  --cream-2:#EFEAE0;
  --gray-700:#454540;
  --gray-400:#8B8B85;
  --radius:10px;
  --display: "Anton", sans-serif;
  --body: "Work Sans", sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;letter-spacing:0.5px;line-height:1.05;}
h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1rem;}
h3{font-size:1.3rem;margin-bottom:0.5rem;}
.center{text-align:center;}
.eyebrow{
  font-family:var(--body);
  font-weight:700;
  font-size:0.75rem;
  letter-spacing:0.18em;
  color:var(--paddle);
  margin-bottom:0.6rem;
}

/* ===== Buttons ===== */
.btn{
  display:inline-block;
  padding:0.9rem 1.8rem;
  border-radius:999px;
  font-family:var(--body);
  font-weight:600;
  font-size:0.95rem;
  transition:transform 0.15s ease, box-shadow 0.15s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--paddle);color:var(--cream);box-shadow:0 6px 18px rgba(228,87,46,0.3);}
.btn-primary:hover{box-shadow:0 10px 24px rgba(228,87,46,0.4);}
.btn-ghost{border:2px solid var(--ink);color:var(--ink);}
.btn-small{padding:0.6rem 1.3rem;font-size:0.85rem;}

/* ===== Nav ===== */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(247,244,238,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--cream-2);
}
.nav-inner{
  max-width:1180px;margin:0 auto;padding:0.9rem 1.5rem;
  display:flex;align-items:center;gap:1.5rem;
}
.nav-mark{
  display:flex;align-items:center;gap:0.5rem;
  font-family:var(--display);
  font-size:1.05rem;
  letter-spacing:0.03em;
  margin-right:auto;
}
.nav-links{display:flex;gap:1.8rem;font-weight:600;font-size:0.92rem;}
.nav-links a{position:relative;padding:0.3rem 0;}
.nav-links a:hover{color:var(--paddle);}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px;}
.nav-toggle span{width:22px;height:2px;background:var(--ink);display:block;}

/* ===== Hero ===== */
.hero{
  position:relative;
  overflow:hidden;
  background:var(--ink);
  color:var(--cream);
  padding:6.5rem 1.5rem 5rem;
  text-align:center;
}
.trajectory{position:absolute;inset:0;width:100%;height:100%;opacity:0.7;}
#ball{offset-path:path("M -50 260 Q 250 20 550 220 T 1250 140");animation:flyBall 6s linear infinite;}
@keyframes flyBall{
  0%{offset-distance:0%;}
  100%{offset-distance:100%;}
}
.hero-inner{position:relative;max-width:760px;margin:0 auto;}
.hero h1{
  font-size:clamp(2.6rem,7vw,4.6rem);
  margin:0.8rem 0 1.2rem;
}
.hero-sub{
  font-size:1.1rem;
  color:var(--cream-2);
  max-width:520px;
  margin:0 auto 2.2rem;
}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.hero .btn-ghost{border-color:var(--cream);color:var(--cream);}

/* ===== Scoreboard ===== */
.scoreboard{
  background:var(--paddle);
  color:var(--cream);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:1.5rem 2.2rem;
  padding:1.6rem 1.5rem;
}
.score-item{display:flex;flex-direction:column;align-items:center;}
.score-num{font-family:var(--display);font-size:1.7rem;}
.score-label{font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;opacity:0.9;}
.score-div{opacity:0.5;}

/* ===== Sections ===== */
.section{padding:5.5rem 1.5rem;}
.section-alt{background:var(--cream-2);}
.section-inner{max-width:1180px;margin:0 auto;}

.net-divider{
  height:1px;
  max-width:1180px;
  margin:0 auto;
  border-top:2px dashed var(--gray-400);
  opacity:0.5;
}

/* ===== About ===== */
.about-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:3rem;align-items:center;}
.about-photo img{
  width:100%;aspect-ratio:4/5;object-fit:cover;
  border-radius:var(--radius);
  background:var(--cream-2);
  border:1px dashed var(--gray-400);
}
.photo-note{font-size:0.78rem;color:var(--gray-400);margin-top:0.5rem;font-style:italic;}
.about-copy h2{margin-bottom:1rem;}
.about-copy p{color:var(--gray-700);margin-bottom:1.2rem;}
.about-list li{
  padding:0.7rem 0;
  border-top:1px solid var(--cream-2);
  color:var(--gray-700);
  font-weight:500;
}
.about-list li:last-child{border-bottom:1px solid var(--cream-2);}

/* ===== Programs ===== */
.programs-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1.5rem;
  margin-top:2.5rem;
}
.program-card{
  background:var(--cream);
  border-radius:var(--radius);
  padding:1.8rem;
  border:1px solid var(--cream-2);
}
.program-tag{
  font-family:var(--display);
  color:var(--paddle);
  font-size:0.9rem;
  display:block;
  margin-bottom:0.6rem;
}
.program-card p{color:var(--gray-700);font-size:0.95rem;}

/* ===== Gallery ===== */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin-top:2rem;
}
.gallery-item{
  aspect-ratio:1/1;
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--cream-2);
  border:1px dashed var(--gray-400);
}
.gallery-item img{width:100%;height:100%;object-fit:cover;}

/* ===== Reviews ===== */
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:1.5rem;
  margin-top:2.5rem;
}
.review-card{
  background:var(--cream);
  border-radius:var(--radius);
  padding:1.8rem;
  border:1px solid var(--cream-2);
}
.stars{color:var(--paddle);letter-spacing:2px;margin-bottom:0.8rem;}
.review-card p{color:var(--gray-700);margin-bottom:1rem;font-style:italic;}
.reviewer{font-weight:600;font-size:0.9rem;}
.reviews-cta{text-align:center;margin-top:2.5rem;}

/* ===== Contact ===== */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;}
.contact-copy p{color:var(--gray-700);margin-bottom:1.5rem;}
.contact-details li{padding:0.5rem 0;color:var(--gray-700);}
.contact-form{
  display:flex;flex-direction:column;gap:1rem;
  background:var(--cream-2);
  padding:1.8rem;
  border-radius:var(--radius);
}
.contact-form label{
  display:flex;flex-direction:column;gap:0.4rem;
  font-size:0.85rem;font-weight:600;color:var(--gray-700);
}
.contact-form input,
.contact-form textarea{
  font-family:var(--body);
  font-size:0.95rem;
  padding:0.7rem 0.9rem;
  border-radius:8px;
  border:1px solid var(--gray-400);
  background:var(--cream);
  color:var(--ink);
  resize:vertical;
}
.contact-form input:focus,
.contact-form textarea:focus{outline:2px solid var(--paddle);outline-offset:1px;}
.contact-form .btn{align-self:flex-start;}
.form-note{font-size:0.75rem;color:var(--gray-400);font-style:italic;}

/* ===== Footer ===== */
.footer{background:var(--ink);color:var(--cream-2);padding:2rem 1.5rem;}
.footer-inner{
  max-width:1180px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:1rem;
  font-size:0.85rem;
}
.footer-links{display:flex;gap:1.3rem;}
.footer-links a:hover{color:var(--paddle);}

/* ===== Responsive ===== */
@media (max-width:840px){
  .about-grid,.contact-grid{grid-template-columns:1fr;}
  .nav-links{
    position:absolute;top:100%;left:0;right:0;
    background:var(--cream);
    flex-direction:column;
    padding:1rem 1.5rem;
    gap:1rem;
    border-bottom:1px solid var(--cream-2);
    display:none;
  }
  .nav-links.open{display:flex;}
  .nav-toggle{display:flex;}
  .nav-cta{display:none;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:520px){
  .gallery-grid{grid-template-columns:1fr;}
}

@media (prefers-reduced-motion: reduce){
  #ball{animation:none;offset-distance:35%;}
}
