/* ==========================================================
   Maemove Pilates — brand stylesheet
   Palette + type drawn from maemove.com.au (Studio Ninety One design)
   Periwinkle #8AADDB · Cream #F8F7E1 · Rust #75382F
   ========================================================== */

/* Brand fonts: Komrile (headings) + Agenda (body), self-hosted. */
@font-face{
  font-family:'Komrile';
  src:url('assets/fonts/Komrile.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Agenda';
  src:url('assets/fonts/Agenda-Light.ttf') format('truetype');
  font-weight:300 600;
  font-style:normal;
  font-display:swap;
}

:root{
  --peri:#8AADDB;
  --peri-soft:#a3bfe4;
  --peri-deep:#7d9fd0;
  --cream:#F8F7E1;
  --rust:#75382F;
  --white:#ffffff;
  --ink:#565f7d;           /* body text on light */
  --ink-deep:#43486b;
  --serif:'Komrile', 'Cormorant Garamond', Georgia, serif;
  --sans:'Agenda', 'Barlow', 'Helvetica Neue', Arial, sans-serif;
  --max:1200px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  font-weight:300;
  font-size:18px;
  line-height:1.65;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ---------- type ---------- */
h1,h2,h3,.serif{
  font-family:var(--serif);
  font-weight:400;
  line-height:1.12;
  letter-spacing:.01em;
}
h1{font-size:clamp(2.7rem,5.4vw,4.3rem)}
h2{font-size:clamp(2.1rem,4vw,3.2rem)}
h3{font-size:clamp(1.4rem,2.2vw,1.9rem)}
.kicker{
  font-family:var(--sans);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.38em;
  text-transform:uppercase;
  display:block;
  margin-bottom:1.2rem;
}
.italic{font-style:italic}
.serif-num{font-family:var(--serif);font-size:1.6rem;line-height:1}

/* section colour recipes */
.on-peri{background:var(--peri);color:var(--cream)}
.on-peri h1,.on-peri h2,.on-peri h3{color:var(--cream)}
.on-cream{background:var(--cream);color:var(--ink)}
.on-cream h1,.on-cream h2,.on-cream h3{color:var(--peri)}
.on-rust{background:var(--rust);color:var(--cream)}
.on-rust h1,.on-rust h2,.on-rust h3{color:var(--cream)}
.on-white{background:var(--white);color:var(--ink)}
.on-white h2,.on-white h3{color:var(--peri)}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--sans);
  font-weight:400;
  font-size:.95rem;
  padding:.8rem 2.2rem;
  border-radius:40px;
  border:1px solid var(--cream);
  color:var(--cream);
  background:transparent;
  cursor:pointer;
  transition:all .25s ease;
  text-align:center;
}
.btn:hover{background:var(--cream);color:var(--peri)}
.btn-solid{background:var(--cream);color:var(--peri);border-color:var(--cream)}
.btn-solid:hover{background:transparent;color:var(--cream)}
.on-rust .btn-solid{color:var(--rust)}
.on-rust .btn-solid:hover{color:var(--cream)}
.btn-peri{border-color:var(--peri);color:var(--peri)}
.btn-peri:hover{background:var(--peri);color:var(--cream)}
.btn-peri-solid{background:var(--peri);color:var(--cream);border-color:var(--peri)}
.btn-peri-solid:hover{background:transparent;color:var(--peri)}
.text-link{
  border-bottom:1px solid currentColor;
  padding-bottom:2px;
  transition:opacity .2s;
}
.text-link:hover{opacity:.7}

/* ---------- header ---------- */
header{
  background:var(--peri);
  color:var(--cream);
  position:relative;
  z-index:50;
}
.header-inner{
  max-width:1400px;
  margin:0 auto;
  padding:1.1rem 2rem;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:1rem;
}
nav.main-nav{display:flex;gap:1.6rem;font-size:.95rem;font-weight:300}
nav.main-nav a{opacity:.92;transition:opacity .2s}
nav.main-nav a:hover,nav.main-nav a.active{opacity:1;border-bottom:1px solid var(--cream)}
.logo-mark{height:52px;width:auto;justify-self:center}
.logo-cream{filter:brightness(0) invert(97%) sepia(9%) saturate(629%) hue-rotate(15deg) brightness(103%)}
.header-cta{justify-self:end}
.nav-toggle{display:none;background:none;border:none;color:var(--cream);font-size:1.6rem;cursor:pointer}

/* ---------- hero variants ---------- */
.hero-split{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 90px)}
.hero-split .hero-copy{
  background:var(--peri);color:var(--cream);
  display:flex;flex-direction:column;justify-content:center;
  padding:5rem 4rem 5rem clamp(2rem,7vw,7rem);
}
.hero-split .hero-copy h1{color:var(--cream);margin-bottom:1.6rem}
.hero-split .hero-copy p{max-width:34rem;margin-bottom:2.2rem}
.hero-img{background:var(--peri-soft);min-height:420px}
.hero-img img{width:100%;height:100%;object-fit:cover}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}

.hero-center{
  text-align:center;
  padding:6rem 2rem 5.5rem;
}
.hero-center h1{max-width:17em;margin:0 auto 1.4rem}
.hero-center p{max-width:36rem;margin:0 auto}

/* ---------- layout helpers ---------- */
section{padding:5.5rem 2rem}
.wrap{max-width:var(--max);margin:0 auto}
.narrow{max-width:46rem;margin:0 auto}
.center{text-align:center}
.section-title{margin-bottom:3rem}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}

/* starburst accent (from maemove.com.au testimonials) */
.starburst{width:34px;height:34px;margin-bottom:1.4rem}
.center .starburst{margin-left:auto;margin-right:auto}

/* ---------- cards ---------- */
.card{
  background:var(--white);
  border-radius:4px;
  padding:2.2rem 1.9rem;
}
.card .num{
  font-family:var(--serif);
  font-size:1.5rem;
  color:var(--rust);
  display:block;
  margin-bottom:.9rem;
}
.card h3{margin-bottom:.7rem;font-size:1.35rem}
.card p{font-size:.98rem}

.card-peri{background:var(--peri);color:var(--cream);border-radius:4px;padding:2.4rem 2rem;display:flex;flex-direction:column}
.card-peri h3{color:var(--cream)}
.card-peri .price{font-family:var(--serif);font-size:2.6rem;margin:.6rem 0 .2rem}
.card-peri .btn{margin-top:auto;align-self:flex-start}

/* ---------- split band (Wix classes-page style) ---------- */
.band{display:grid;grid-template-columns:1fr 1fr;min-height:460px}
.band > div{padding:4.5rem clamp(2rem,6vw,6rem);display:flex;flex-direction:column;justify-content:center}
.band .band-img{padding:0;min-height:320px;background:var(--peri-soft);position:relative;overflow:hidden}
.band .band-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band h2{margin-bottom:.4rem}
.band .meta{font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;opacity:.85;margin-bottom:1.4rem}
.band p{max-width:32rem;margin-bottom:1rem}
.band .btn{align-self:flex-start;margin-top:1.2rem}

/* ---------- accordion (Wix pricing-page style) ---------- */
.accordion{border-top:1px solid currentColor}
.acc-item{border-bottom:1px solid currentColor}
.acc-q{
  width:100%;background:none;border:none;color:inherit;
  font-family:var(--serif);font-size:1.45rem;text-align:left;
  padding:1.2rem .2rem;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
}
.acc-q .acc-icon{font-family:var(--sans);font-weight:300;font-size:1.4rem;line-height:1}
.acc-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.acc-a p{padding:0 .2rem 1.4rem;max-width:44rem;font-size:1rem}

/* ---------- stations ---------- */
.stations{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin-top:3rem}
.station{border-top:1px solid rgba(248,247,225,.5);padding-top:1.6rem}
.station .st-label{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;opacity:.8;display:block;margin-bottom:.7rem}
.station h3{font-size:1.7rem;margin-bottom:.4rem}
.station p{font-size:.92rem;opacity:.9}

/* ---------- timeline / steps ---------- */
.steps{counter-reset:step;max-width:44rem;margin:3rem auto 0}
.step{display:grid;grid-template-columns:70px 1fr;gap:1.6rem;padding:1.6rem 0;border-bottom:1px solid rgba(117,56,47,.18)}
.step:last-child{border-bottom:none}
.step .step-num{font-family:var(--serif);font-size:1.9rem;color:var(--rust)}
.step h3{font-size:1.3rem;color:var(--peri);margin-bottom:.3rem}
.step p{font-size:1rem}

/* ---------- testimonials ---------- */
.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;margin-top:3rem}
.testimonial p.quote{font-size:1.02rem;margin-bottom:1.6rem}
.testimonial .name{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--peri)}

/* ---------- gallery strip ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.gallery img{width:100%;height:380px;object-fit:cover}

/* ---------- forms ---------- */
.field{margin-bottom:1.4rem}
.field label{
  display:block;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;
  margin-bottom:.5rem;font-weight:500;
}
.field input,.field select,.field textarea{
  width:100%;padding:.85rem 1rem;
  font-family:var(--sans);font-size:1rem;font-weight:300;color:var(--ink-deep);
  background:var(--white);
  border:1px solid rgba(86,95,125,.25);
  border-radius:4px;outline:none;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--peri)}
.form-note{font-size:.85rem;opacity:.8;margin-top:1rem}
.form-err{color:var(--rust);font-size:.9rem;margin-top:.8rem;display:none}

/* ---------- quiz ---------- */
.quiz-shell{max-width:660px;margin:0 auto;min-height:430px}
.progress-track{height:3px;background:rgba(138,173,219,.3);border-radius:2px;margin-bottom:2.6rem;position:relative}
.progress-fill{position:absolute;left:0;top:-3px;height:9px;border-radius:5px;background:var(--rust);width:34px;transition:left .3s ease}
.quiz-kicker{font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--peri);font-weight:500;display:block;margin-bottom:1rem}
.quiz-q{color:var(--peri);margin-bottom:2rem}
.quiz-answer{
  display:block;width:100%;text-align:left;
  font-family:var(--sans);font-weight:300;font-size:1.05rem;color:var(--ink);
  background:var(--white);border:1px solid transparent;border-radius:6px;
  padding:1.15rem 1.4rem;margin-bottom:1rem;cursor:pointer;
  transition:border-color .2s, background .2s;
}
.quiz-answer:hover{border-color:var(--peri)}
.quiz-answer.picked{background:#eef3fb;border-color:var(--peri)}
.result-block{background:var(--white);border-radius:6px;padding:1.8rem 1.9rem;margin-bottom:1.2rem}
.result-block h3{font-size:1.05rem;font-family:var(--sans);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--rust);margin-bottom:.7rem}
.result-block p{font-size:1rem}

/* ---------- footer ---------- */
footer{background:var(--peri);color:var(--cream);padding:4.5rem 2rem 2.5rem}
.footer-grid{
  max-width:var(--max);margin:0 auto;
  display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:3rem;
}
.footer-logo{height:64px;width:auto;margin-bottom:1.4rem}
.footer-col h4{
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  font-weight:500;margin-bottom:1.2rem;opacity:.85;
}
.footer-col a{display:block;margin-bottom:.6rem;font-size:.98rem;opacity:.92}
.footer-col a:hover{opacity:1;text-decoration:underline}
.footer-col p{font-size:.98rem;margin-bottom:.6rem}
.footer-bottom{
  max-width:var(--max);margin:3rem auto 0;padding-top:1.6rem;
  border-top:1px solid rgba(248,247,225,.35);
  display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  font-size:.9rem;
}
.footer-bottom .sign-off{font-family:var(--serif);font-style:italic;font-size:1.15rem}

/* ---------- CTA bands ---------- */
.cta-band{text-align:center;padding:6rem 2rem}
.cta-band h2{max-width:18em;margin:0 auto 1.2rem}
.cta-band p{max-width:34rem;margin:0 auto 2.2rem}

/* ---------- momence iframe ---------- */
.momence-frame{width:100%;height:1150px;border:none;background:var(--white)}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .hero-split,.band,.grid-2{grid-template-columns:1fr}
  .grid-3,.grid-4,.stations,.testimonials,.gallery{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .band .band-img{order:-1}
  .hero-split .hero-copy{padding:4rem 2rem}
}
@media (max-width:640px){
  .grid-3,.grid-4,.stations,.testimonials,.gallery{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .header-inner{grid-template-columns:auto auto;justify-content:space-between}
  nav.main-nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--peri);flex-direction:column;padding:1.4rem 2rem;gap:1rem;
    border-top:1px solid rgba(248,247,225,.3);
  }
  nav.main-nav.open{display:flex}
  .nav-toggle{display:block;justify-self:start}
  .header-cta{display:none}
  .gallery img{height:260px}
  section{padding:3.5rem 1.4rem}
}
