/* ===== HERO / LANDING (enhanced blue, centered) ===== */
.hero.hero--blue {
  position: relative;
  isolation: isolate;
  padding: 84px 0 108px;
  color: #fff;
  background: linear-gradient(180deg, var(--accent) 0%, #09618a 100%);
  overflow: hidden;
}

/* subtle grid texture that fades toward the edges */
.hero.hero--blue::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(to right, rgba(255,255,255,0.04) 0 1px, transparent 1px 80px),
    repeating-linear-gradient(to bottom, rgba(255,255,255,0.04) 0 1px, transparent 1px 80px);
  mask-image: radial-gradient(1000px 600px at 50% 40%, #000 35%, transparent 85%);
  mix-blend-mode: soft-light;
  z-index: 0;
}

/* Container: single column, centered; 1200px max width */
.hero-container {
  position: relative; z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  text-align: center;
}

/* one column: make the left block the centered stack */
.hero-center {
  width: 100%;
  max-width: 900px; /* keeps lines a comfy width on large screens */
  margin: 0 auto;
}

/* Title + subtitle */
.hero-title {
  font-family: "Poltawski Nowy", serif;
  /* fix clamp to scale nicely across sizes */
  font-size: clamp(2.2rem, 6vw, 3.4rem);
  line-height: 1.1;
  color: #fff;
  margin-bottom: 30px;
}
.hero-title span { color: rgb(193, 226, 246); }

.hero-subtitle {
  color: rgba(255,255,255,0.92);
  font-size: 1.06rem;
  max-width: 60ch;
  margin: 0 auto 34px auto;
}

/* level tags (on dark) */
.level-tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* center in single-column layout */
  gap: 10px 12px;
  margin-bottom: 35px;
}
.level-tags.on-dark li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.28);
  color: #ffffff;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.95rem;
}
.level-tags.on-dark li i { color: #ffffff; }
.level-tags.on-dark li.muted { opacity: 0.75; }

/* CTAs */
.hero-ctas {
  margin-bottom: 35px;
  display: flex;
  gap: 15px;
  justify-content: center; /* center the buttons row */
}
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; border-radius: 10px; padding: 9px 18px;
  font-weight: 700; letter-spacing: 0.2px;
  transition: transform 0.15s ease, box-shadow 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.btn-on-dark.btn-primary {
  background: #ffffff; color: var(--accent-dark);
  box-shadow: 0 10px 24px rgba(0,0,0,0.18);
}
.btn-on-dark.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(0,0,0,0.24);
}
.btn-outline-light {
  border: 1.5px solid rgba(255,255,255,0.8);
  color: #fff; background: transparent;
}
.btn-outline-light:hover {
  background: rgba(255,255,255,0.12);
  transform: translateY(-1px);
}

/* trust row */
.trust-row {
  display: flex; flex-wrap: wrap; gap: 10px 18px; list-style: none;
  margin: 12px 0 35px; font-weight: 600;
  justify-content: center; /* center it */
}
.trust-row.on-dark li {
  display: inline-flex; align-items: center; gap: 8px;
  color: rgba(255,255,255,0.95);
}
.trust-row.on-dark i { color: #ffffff; }

/* note */
.hero-note {
  display: inline-flex; align-items: center; gap: 8px;
  border-radius: 999px; padding: 8px 12px; font-size: 0.92rem;
}
.hero-note--on-dark {
  background: rgba(255,255,255,0.12);
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.28);
}
.hero-note--on-dark .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #53ffa6;
  box-shadow: 0 0 0 4px rgba(83,255,166,0.18);
}

/* keep the right side hidden; no columns needed */
.hero-right { display: none !important; }

/* Responsive tweaks */
@media (max-width: 560px) {
  .hero-ctas { flex-direction: column; align-items: stretch; }
  .btn { width: 100%; }
}










  /* ===== TRUST / WHY CHOOSE ME ===== */
.trust {
    background: #ffffff;
    padding: 64px 0 72px;
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .trust-head {
    text-align: center;
    margin-bottom: 28px;
  }
  
  .trust-head h2 {
    font-size: clamp(2rem, 2.4vw, 2rem);
    color: #0e1a24;
    margin-bottom: 8px;
  }
  
  .trust-head p {
    color: #47525a;
    max-width: 70ch;
    margin: 0 auto;
    font-size: 1.02rem;
  }
  
  .trust-grid {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
  }
  
  .trust-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 14px;
    padding: 20px 18px;
    box-shadow: 0 8px 24px rgba(2, 24, 38, 0.06);
    transition: transform 0.18s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  }
  
  .trust-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(2, 24, 38, 0.10);
    border-color: rgba(0,0,0,0.08);
  }
  
  .trust-icon {
    width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    margin-bottom: 12px;
    background: rgba(5, 75, 113, 0.08); /* uses --accent but inline for contrast */
    border: 1px solid rgba(5, 75, 113, 0.20);
  }
  
  .trust-icon i {
    color: var(--accent); /* #054b71 from your root */
    font-size: 1.15rem;
  }
  
  .trust-card h3 {
    font-size: 1.05rem;
    color: #0e1a24;
    margin-bottom: 6px;
  }
  
  .trust-card p {
    color: #4a555d;
    font-size: 0.98rem;
  }
  
  /* CTA row under cards */
  .trust-cta {
    margin-top: 28px;
    display: flex;
    gap: 12px;
    justify-content: center;
  }
  
  .btn-ghost {
    background: rgba(5, 75, 113, 0.06);
    color: #0a3d5a;
    border: 1px solid rgba(5, 75, 113, 0.18);
  }
  .btn-ghost:hover {
    background: rgba(5, 75, 113, 0.10);
    color: #082f45;
  }
  
  /* Responsive */
  @media (max-width: 1100px) {
    .trust-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 560px) {
    .trust-grid { grid-template-columns: 1fr; }
    .trust { padding: 54px 0 64px; }
    .trust-cta { flex-direction: column; align-items: stretch; }
    .trust-cta .btn { width: 100%; }
  }
  






/* ===== ABOUT (centered, no photo, subtle premium bg) ===== */
.about {
  position: relative;
  isolation: isolate;
  padding: 80px 0 88px;
  border-top: 1px solid rgba(0,0,0,0.04);
  max-width: 1600px;
  margin: 0 auto;

  /* layered light background: soft vignette + whisper grid */
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(9,97,138,0.06), transparent 65%),
    radial-gradient(1200px 700px at 50% 120%, rgba(9,97,138,0.05), transparent 60%),
    linear-gradient(#ffffff, #ffffff);
}
.about::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    repeating-linear-gradient(to right, rgba(14,26,36,0.03) 0 1px, transparent 1px 80px),
    repeating-linear-gradient(to bottom, rgba(14,26,36,0.03) 0 1px, transparent 1px 80px);
  mask-image: radial-gradient(900px 540px at 50% 40%, #000 40%, transparent 85%);
}

/* container: one centered column within 1200px */
.about-container {
  position: relative; z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  text-align: center;
}

/* content column width for comfy reading */
.about-left {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

/* Title with accent underline */
.about-left h2 {
  font-size: clamp(2rem, 2.8vw, 2.2rem);
  color: #0e1a24;
  margin-bottom: 18px;
  position: relative;
  display: inline-block;
}
.about-left h2::after {
  content: "";
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: -10px;
  width: 72px; height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent), #0a5f86);
  opacity: 0.9;
}

/* Intro paragraph */
.about-intro {
  font-size: 1.06rem;
  color: #3b464e;
  margin: 26px auto 22px auto;
  max-width: 70ch;
}

/* Facts: make them feel like tidy pills/cards */
.about-facts {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
  margin: 0 auto;
  padding: 0;
  max-width: 900px;
}
.about-facts li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(9,97,138,0.06);
  border: 1px solid rgba(9,97,138,0.12);
  color: #37424a;
  font-size: 0.98rem;
  font-weight: 600;
}
.about-facts i {
  color: var(--accent);
  font-size: 1rem;
}

.about-experience i {
  color: var(--accent);
  font-size: 1rem;
}

.about-experience {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(9,97,138,0.06);
  border: 1px solid rgba(9,97,138,0.12);
  color: #37424a;
  font-size: 0.98rem;
  font-weight: 600;
  margin: 10px 0 20px 0;
}

/* CTA */
.about-cta {
  display: flex;
  justify-content: center;
}
.about-cta .btn-primary {
  background: var(--accent);
  color: #fff;
  padding: 12px 20px;
  font-size: 0.95rem;
  border-radius: 10px;
  box-shadow: 0 8px 20px rgba(9,97,138,0.18);
  transition: transform 0.15s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}
.about-cta .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(9,97,138,0.24);
}

/* hide the right column/photo entirely */
.about-right { display: none !important; }

/* Responsive */
@media (max-width: 800px) {
  .about-facts {
    grid-template-columns: 1fr; /* stack pills on small screens */
  }
}







/* ===== SERVICES OVERVIEW (ALT STYLE - INVERTED BLUE) ===== */
.services-alt {
    background: var(--accent); /* brand blue background */
    padding: 68px 0 78px;
    border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }

  .container-services {
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .services-alt-head {
    text-align: center;
    margin-bottom: 28px;
  }
  .services-alt-head h2 {
    font-size: clamp(2rem, 2.4vw, 2rem);
    color: #fff;
    margin-bottom: 8px;
  }
  .services-alt-head p {
    color: rgba(255,255,255,0.9);
    max-width: 70ch;
    margin: 0 auto;
    font-size: 1.02rem;
  }
  
  /* Horizontal rows */
  .service-row {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    align-items: start;
    gap: 18px;
    padding: 18px 18px 18px 14px;
    background: rgb(237, 237, 237);
    border: 1px solid rgba(255,255,255,0.2);
    border-left: 6px solid #d9f2ff; /* lighter accent rail */
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    margin: 0 20px;
    margin-bottom: 16px;
  }
  
  .service-row__icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    display: grid; place-items: center;
    background: rgb(255, 255, 255);
    border: 1px solid rgba(34, 34, 34, 0.716);
    margin-left: 4px;
  }
  .service-row__icon i {
    color: #000000;
    font-size: 1.15rem;
  }
  
  .service-row__content h3 {
    font-size: 1.12rem;
    color: #000000;
    margin-bottom: 6px;
  }
  .service-row__content p {
    color: rgba(0, 0, 0, 0.9);
    font-size: 0.98rem;
    margin-bottom: 8px;
  }
  
  .service-points {
    list-style: none;
    display: grid;
    gap: 6px;
    color: rgba(0, 0, 0, 0.92);
    font-size: 0.95rem;
  }
  .service-points li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .service-points i { color: #000000; }
  
  .service-row__tag .tag {
    display: inline-block;
    white-space: nowrap;
    background: rgba(255,255,255,0.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 999px;
    padding: 6px 10px;
    font-weight: 700;
    font-size: 0.88rem;
  }
  
  /* Future services strip */
  .service-future-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: center;
    margin: 18px 0 6px;
  }
  .future-label {
    color: rgba(255,255,255,0.8);
    display: inline-flex;
    gap: 8px;
    align-items: center;
    font-weight: 600;
  }
  .future-label i { color: rgba(255,255,255,0.8); }
  .chip {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 999px;
    padding: 6px 10px;
    color: #fff;
    font-weight: 600;
  }
  
  /* CTA */
  .services-alt-cta {
    text-align: center;
    margin-top: 26px;
    padding: 0 20px;
  }
  
  /* Responsive */
  @media (max-width: 860px) {
    .service-row { grid-template-columns: 56px 1fr; }
    .service-row__tag { display: none; }
  }
  @media (max-width: 560px) {
    .services-alt { padding: 58px 0 68px; }
  }
  







  /* ===== HOW IT WORKS ===== */
.how {
    background: #f9fafc;
    padding: 70px 0 80px;
    border-top: 1px solid rgba(0,0,0,0.04);
    border-bottom: 1px solid rgba(0,0,0,0.04);
  }

  .container-how {
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .how-head {
    text-align: center;
    margin-bottom: 40px;
  }
  .how-head h2 {
    font-size: clamp(2rem, 2.4vw, 2rem);
    color: #0e1a24;
    margin-bottom: 10px;
  }
  .how-head p {

    color: #47525a;
    font-size: 1.02rem;
  }
  
  /* steps row */
  .how-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    position: relative;
  }
  
  /* connecting line (desktop only) */
  .how-steps::before {
    content: "";
    position: absolute;
    top: 42px;
    left: 8%;
    right: 8%;
    height: 3px;
    background: rgba(5, 75, 113, 0.2);
    z-index: 0;
  }
  @media (max-width: 768px) {
    .how-steps::before { display: none; }
  }
  
  .how-step {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 14px;
    padding: 30px 20px 24px;
    text-align: center;
    position: relative;
    z-index: 1;
    box-shadow: 0 8px 22px rgba(0,0,0,0.05);
    transition: transform 0.18s ease, box-shadow 0.22s ease;
    margin: 0 20px;
  }
  .how-step:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
  }
  
  .how-icon {
    width: 56px; height: 56px;
    margin: 0 auto 10px;
    border-radius: 14px;
    display: grid; place-items: center;
    background: rgba(5, 75, 113, 0.08);
    border: 1px solid rgba(5, 75, 113, 0.20);
  }
  .how-icon i {
    color: var(--accent);
    font-size: 1.25rem;
  }
  
  /* Step numbers (overlay) */
  .how-number {
 
    font-weight: 800;
    font-size: 2rem;
    color: var(--accent);
    margin-bottom: 8px;
  }
  
  .how-step h3 {

    font-size: 1.1rem;
    margin-bottom: 6px;
    color: #0e1a24;
  }
  .how-step p {

    color: #4a555d;
    font-size: 0.95rem;
  }
  
  /* CTA */
  .how-cta {
    margin-top: 34px;
    text-align: center;
    padding: 0 20px;
  }

  
  /* responsive */
  @media (max-width: 992px) {
    .how-steps { grid-template-columns: 1fr; gap: 20px; }
  }
  







  /* ===== PRICING ===== */
.pricing {
  background: #ffffff;
  padding: 70px 0 88px;
  border-top: 1px solid rgba(0,0,0,0.04);
  max-width: 1200px;
  margin: 0 auto;
}
.pricing-head {
  text-align: center;
  margin-bottom: 32px;
}
.pricing-head h2 {

  font-size: clamp(1.6rem, 2.4vw, 2rem);
  color: #0e1a24;
  margin-bottom: 8px;
}
.pricing-head p {
  color: #47525a;
  font-size: 1.02rem;
  max-width: 70ch;
  margin: 0 auto;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

/* card base */
.price-card {
  position: relative;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.06);
  padding: 20px 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform .18s ease, box-shadow .22s ease, border-color .22s ease;
}
.price-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(0,0,0,0.09);
  border-color: rgba(0,0,0,0.08);
}

/* featured (GCSE) */
.price-card.featured {
  border: 1.5px solid rgba(5, 75, 113, 0.35);
  box-shadow: 0 16px 42px rgba(5, 75, 113, 0.18);
}
.price-badge {
  position: absolute;
  top: -12px; left: 20px;
  background: var(--accent);
  color: #fff;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 800;
  box-shadow: 0 10px 22px rgba(5,75,113,.22);
}

/* header */
.price-header {
  display: flex; align-items: center; justify-content: space-between;
}
.price-header h3 {
  font-family: "Manrope", sans-serif;
  font-size: 1.1rem; color: #0e1a24;
}
.pill {
  display: inline-block;
  background: rgba(5, 75, 113, 0.08);
  color: #0a3d5a;
  border: 1px solid rgba(5, 75, 113, 0.18);
  padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: 0.85rem;
}

/* pricing */
.price-main {
  border-top: 1px dashed rgba(0,0,0,0.08);
  padding-top: 12px;
}
.price-figure {
  display: flex; align-items: baseline; gap: 4px;
  color: #0e1a24;
}
.price-figure .currency { font-weight: 800; font-size: 1.2rem; }
.price-figure .amount { font-weight: 900; font-size: 2.2rem; font-family: "Manrope", sans-serif; }
.price-figure .per { font-weight: 700; color: #47525a; }

.bundle { color: #32414a; margin-top: 4px; }
.meta { color: #6a7780; font-size: .92rem; }

/* bullets */
.price-points {
  list-style: none; display: grid; gap: 6px; color: #3a4650; font-size: .96rem;
}
.price-points i { color: var(--accent); }

/* buttons */
.btn-block { width: 100%; text-align: center; }
.btn-disabled {
  background: #ecf1f5; color: #7c8a96; border: 1px solid #d9e2ea; cursor: not-allowed;
}

/* locked style */
.price-card.locked {
  position: relative;
  opacity: 0.8;
  filter: grayscale(0.2);
}
.lock-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.78);
  border-radius: 16px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px;
  text-align: center;
  color: #0e1a24;
  pointer-events: none;
}
.lock-overlay i { color: #9aa9b6; font-size: 1.2rem; }
.locked-note {
  margin-top: 6px;
  color: #6a7780;
  font-size: 0.9rem;
  text-align: center;
}

/* responsive */
@media (max-width: 992px) {
  .pricing-grid { grid-template-columns: 1fr; }
  .price-badge { left: 50%; transform: translateX(-50%); }
}


/* ===== PRICING TOGGLE ===== */
.price-toggle {
  display: inline-flex;
  gap: 6px;
  background: #eff4f8;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  padding: 6px;
  margin: 0 auto 22px;
  justify-content: center;
}
.toggle-btn {
  appearance: none;
  background: transparent;
  border: 0;
  padding: 10px 14px;
  border-radius: 10px;
  font-weight: 800;
  color: #0a3d5a;
  cursor: pointer;
}
.toggle-btn.active {
  background: #fff;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(0,0,0,0.06);
  background-color: #deeffbc7;
}

/* subtle save note */
.save-note { color: #0a3d5a; font-weight: 700; margin-left: 4px; }





  /* ===== TESTIMONIALS ===== */
.testimonials {
    background: #ffffff;
    padding: 72px 0 80px;
    border-top: 1px solid rgba(0,0,0,0.04);
  }

  .container-testimonials {
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .testimonials-head {
    text-align: center;
    margin-bottom: 36px;
  }
  .testimonials-head h2 {
    font-size: clamp(2rem, 2.4vw, 2rem);
    color: #0e1a24;
    margin-bottom: 8px;
  }
  .testimonials-head p {
    color: #47525a;
    font-size: 1.02rem;
  }
  
  /* testimonials grid */
  .testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
  }
  
  .testimonial-card {
    background: #f9fafc;
    border-radius: 14px;
    padding: 24px 20px;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 6px 20px rgba(0,0,0,0.05);
    text-align: center;
    transition: transform 0.18s ease, box-shadow 0.22s ease;
  }
  .testimonial-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.08);
  }
  
  .stars {
    margin-bottom: 12px;
  }
  .stars i {
    color: #fbbf24; /* star yellow */
    font-size: 1rem;
    margin-right: 2px;
  }
  
  .testimonial-text {

    font-size: 0.96rem;
    color: #37424a;
    margin-bottom: 14px;
    font-style: italic;
  }
  
  .testimonial-card h4 {
 
    font-size: 0.9rem;
    color: #0e1a24;
    font-weight: 700;
  }
  
  /* Responsive */
  @media (max-width: 992px) {
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 560px) {
    .testimonials-grid { grid-template-columns: 1fr; }
  }
  







  /* ===== FOOTER ===== */
.footer {
    background: #0a3d5a;
    color: #fff;
    padding-top: 50px;
    font-size: 0.95rem;

  }
  
  .footer-container {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 28px;
    padding-bottom: 32px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    max-width: 1200px;
  }
  
  .footer-brand h3 {

    font-size: 1.3rem;
    margin-bottom: 8px;
    color: #fff;
  }
  .footer-brand p {
    color: rgba(255,255,255,0.85);
    max-width: 40ch;
  }
  
  .footer-links h4,
  .footer-contact h4 {

    font-size: 1rem;
    margin-bottom: 10px;
    color: #fff;
  }
  .footer-links ul,
  .footer-contact ul {
    list-style: none;
    display: grid;
    gap: 6px;
  }
  
  .footer-links a,
  .footer-contact a {
    text-decoration: none;
    color: rgba(255,255,255,0.85);
    transition: color 0.25s ease;
  }
  .footer-links a:hover,
  .footer-contact a:hover {
    color: #fff;
  }
  
  .footer-contact li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,0.85);
  }
  .footer-contact i {
    color: #d9f2ff;
  }
  
  .footer-bottom {
    background: #072f45;
    padding: 14px 0;
    text-align: center;
    font-size: 0.85rem;
    color: rgba(255,255,255,0.8);
  }
  
  /* Responsive */
  @media (max-width: 860px) {
    .footer-container {
      grid-template-columns: 1fr 1fr;
    }
  }
  @media (max-width: 560px) {
    .footer-container {
      grid-template-columns: 1fr;
      text-align: center;
    }
    .footer-contact li { justify-content: center; }
  }
  










/* ===== MODAL (FULLSCREEN) ===== */
.modal-overlay-placement {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(2px);
  z-index: 9998;
}
.modal-placement {
  position: fixed; inset: 0;
  background: #fff;
  z-index: 9999;
  display: grid;
  grid-template-rows: auto auto 1fr;
  padding: 16px 0 24px;
  overflow-y: auto;
  scroll-behavior: smooth;
}

.modal-header-placement {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid #eee;
}
.modal-header-placement h2 { font-size: 1.5rem; color: #0e1a24; }
.close-btn-placement { background: transparent; border: 0; font-size: 28px; line-height: 1; cursor: pointer; color: #333; }

.modal-progress-placement { height: 6px; background: #f1f5f9; border-bottom: 1px solid #eee; }
.modal-progress-placement .bar-placement { height: 100%; width: 0%; background: var(--accent); transition: width .25s ease; }

.modal-form-placement {
  max-width: 1060px; margin: 0 auto; padding: 20px;
  display: flex; flex-direction: column; justify-content: center; gap: 14px; margin-top: -50px;
}

.step-placement { animation: fadeIn .18s ease; box-sizing: border-box;}
@keyframes fadeIn { from {opacity:0; transform: translateY(6px);} to {opacity:1; transform:none;} }

.label-placement { display:block; font-weight:700; font-family:"Manrope",sans-serif; color:#0e1a24; margin-bottom:8px; margin-top: 30px;}
.input-placement, .select-placement {
  width: 500px; padding: 12px 14px; border-radius: 10px; border: 1px solid #c8d2de; font-size: 1rem; outline: none; box-sizing: border-box;
}
.input-placement:focus, .select-placement:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(5,75,113,.12); }

.actions-row-placement { display:flex; gap:10px; justify-content:flex-end; margin-top: 12px; }
.btn-placement, .btn-secondary-placement {
  border-radius: 10px; padding: 12px 18px; font-weight:700; cursor:pointer; border:1px solid transparent;
}
.btn-placement { background: var(--accent); color:#fff; }
.btn-placement:hover { background:#043d5b; }
.btn-secondary-placement { background:#f1f5f9; color:#0e1a24; border-color:#e5eaf0; }
.btn-secondary-placement:hover { background:#e7edf5; }

.calendar-head-placement { display:flex; align-items:center; justify-content: space-between; gap: 12px; margin-top: 6px; margin-bottom: 8px; }
.calendar-head-placement .input-placement { max-width: 230px; }

.week-grid-placement {
  display: grid; grid-template-columns: repeat(7, 1fr);
  gap: 12px; margin-top: 8px;
}
.week-col-placement { background:#fff; border:1px solid #e8edf3; border-radius: 12px; padding: 10px; }
.week-col-title-placement { font-weight: 800; font-family:"Manrope",sans-serif; margin-bottom: 8px; color:#0e1a24; }

.slot-btn-placement {
  width: 100%; margin-bottom: 8px; padding: 10px 12px; border-radius: 10px;
  font-weight: 700; font-size: .95rem; border: 1px solid transparent; cursor: pointer;
  transition: transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

/* Respect [hidden] so modal stays closed until JS opens it */
.modal-placement[hidden], .modal-overlay-placement[hidden] { display: none !important; }

/* statuses */
.slot-btn-placement.available { background:#f2fbff; color:#0a3d5a; border-color:#bfe5f7; }
.slot-btn-placement.available:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(5,75,113,.15); }
.slot-btn-placement.booked { background:#054c73b3; color:#b1c5d3; border-color:#d5dde6; cursor:not-allowed; text-decoration: line-through; }
.slot-btn-placement.unavailable { background:#fff5f5; color:#9b2c2c; border-color:#f5c2c2; cursor:not-allowed; }

.slot-btn-placement.selected { outline: 3px solid rgba(5, 75, 113, 0.835); background:#e7f6ff; }

.legend-placement { display:flex; gap:16px; margin: 10px 0 2px; color:#47525a; font-size:.92rem; }
.legend-placement .dot-placement { display:inline-block; width:10px; height:10px; border-radius:999px; margin-right:6px; vertical-align:middle; }
.legend-placement .available { background:#ffffff; border: 1px solid #1aa0e6;}
.legend-placement .booked { background:#7a8a98; }
.legend-placement .unavailable { background:#e06a6a; }

@media (max-width: 760px) { .calendar-head-placement { flex-direction: column; align-items: start; } .week-grid-placement { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 480px) { 
  .week-grid-placement { grid-template-columns: 1fr; } 
  .input-placement, .select-placement { width: 360px;} 
  .modal-header-placement { padding: 40px 20px 20px 20px;}
}

@media (max-width: 380px) {.input-placement, .select-placement {width: 280px;} 
 .modal-header-placement { padding: 10px 20px}
}










/* =====  KS3 Subscription Modal (namespaced) ===== */
.modal-overlay-subks3 { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(2px); z-index: 9998; }
.modal-subks3 { position: fixed; inset: 0; background: #fff; z-index: 9999; display: grid; grid-template-rows: auto auto 1fr; padding: 16px 0 24px; overflow-y: auto;
  scroll-behavior: smooth;}
.modal-header-subks3 { display:flex; align-items:center; justify-content:space-between; padding:0 20px; border-bottom:1px solid #eee; }
.modal-header-subks3 h2 { font-size:1.5rem; color:#0e1a24; }
.close-btn-subks3 { background:transparent; border:0; font-size:28px; line-height:1; cursor:pointer; color:#333; }

.modal-progress-subks3 { height:6px; background:#f1f5f9; border-bottom:1px solid #eee; }
.modal-progress-subks3 .bar-subks3 { height:100%; width:0%; background: var(--accent); transition: width .25s ease; }

.modal-form-subks3 { max-width:1060px; margin:0 auto; padding:20px; display:flex; flex-direction:column; justify-content:center; gap:14px; margin-top:-50px; }
.step-subks3 { animation: fadeInSub .18s ease; }
@keyframes fadeInSub { from {opacity:0; transform: translateY(6px);} to {opacity:1; transform:none;} }

.label-subks3 { display:block; font-weight:700; font-family:"Manrope",sans-serif; color:#0e1a24; margin-bottom:8px; margin-top: 30px;}
.input-subks3, .select-subks3 { width:500px; padding:12px 14px; border-radius:10px; border:1px solid #c8d2de; font-size:1rem; outline:none; }
.input-subks3:focus, .select-subks3:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(5,75,113,.12); }

.actions-row-subks3 { display:flex; gap:10px; justify-content:flex-end; margin-top:12px; }
.btn-subks3, .btn-secondary-subks3 { border-radius:10px; padding:12px 18px; font-weight:700; cursor:pointer; border:1px solid transparent; }
.btn-subks3 { background: var(--accent); color:#fff; }
.btn-subks3:hover { background:#043d5b; }
.btn-secondary-subks3 { background:#f1f5f9; color:#0e1a24; border-color:#e5eaf0; }
.btn-secondary-subks3:hover { background:#e7edf5; }

.calendar-head-subks3 { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px; margin-bottom:8px; }
.week-grid-subks3 { display:grid; grid-template-columns: repeat(7, 1fr); gap:12px; margin-top:8px; }
.week-col-subks3 { background:#fff; border:1px solid #e8edf3; border-radius:12px; padding:10px; }
.week-col-title-subks3 { font-weight:800; font-family:"Manrope",sans-serif; margin-bottom:8px; color:#0e1a24; }

.slot-btn-subks3 { width:100%; margin-bottom:8px; padding:10px 12px; border-radius:10px; font-weight:700; font-size:.95rem; border:1px solid transparent; cursor:pointer; transition: transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease; }
.modal-subks3[hidden], .modal-overlay-subks3[hidden] { display:none !important; }

.slot-btn-subks3.available {  background:#f2fbff; color:#0a3d5a; border-color:#bfe5f7; }
.slot-btn-subks3.available:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(5,75,113,.15); }
.slot-btn-subks3.trial { background:#fff9f0; color:#7a4b00; border-color:#f3d3a6; }
.slot-btn-subks3.taken { background:#054c73b3; color:#b1c5d3; border-color:#d5dde6; cursor:not-allowed; text-decoration: line-through; }
.slot-btn-subks3.selected { outline: 3px solid rgba(5, 75, 113, 0.835); background:#e7f6ff;}

.legend-subks3 { display:flex; gap:16px; margin:10px 0 2px; color:#47525a; font-size:.92rem; }
.legend-subks3 .dot-subks3 { display:inline-block; width:10px; height:10px; border-radius:999px; margin-right:6px; vertical-align:middle; }
.legend-subks3 .available { background:#ffffff; border: 1px solid #1aa0e6;}
.legend-subks3 .trial { background:#ffffff; border: 1px solid #f3a043;}
.legend-subks3 .taken { background:#7a8a98; }

@media (max-width:760px){ .calendar-head-subks3{flex-direction:column; align-items:start;} .week-grid-subks3{grid-template-columns: repeat(2,1fr);} }
@media (max-width:420px){ .week-grid-subks3{grid-template-columns:1fr;}
  .input-subks3, .select-subks3 { width: 360px;} 
  .modal-header-subks3  { padding: 40px 20px 20px 20px;}
 }

@media (max-width: 380px) {.input-subks3, .select-subks3 {width: 280px;} 
 .modal-header-subks3  { padding: 10px 20px}
}






/* ===== GCSE Subscription Modal (namespaced) ===== */
.modal-overlay-subgcse { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(2px); z-index: 9998; }
.modal-subgcse { position: fixed; inset: 0; background: #fff; z-index: 9999; display: grid; grid-template-rows: auto auto 1fr; padding: 16px 0 24px;   overflow-y: auto;
  scroll-behavior: smooth;}
.modal-header-subgcse { display:flex; align-items:center; justify-content:space-between; padding:0 20px; border-bottom:1px solid #eee; }
.modal-header-subgcse h2 { font-size:1.5rem; color:#0e1a24; }
.close-btn-subgcse { background:transparent; border:0; font-size:28px; line-height:1; cursor:pointer; color:#333; }

.modal-progress-subgcse { height:6px; background:#f1f5f9; border-bottom:1px solid #eee; }
.modal-progress-subgcse .bar-subgcse { height:100%; width:0%; background: var(--accent); transition: width .25s ease; }

.modal-form-subgcse { max-width:1060px; margin:0 auto; padding:20px; display:flex; flex-direction:column; justify-content:center; gap:14px; margin-top:-50px; }
.step-subgcse { animation: fadeInGcse .18s ease; }
@keyframes fadeInGcse { from {opacity:0; transform: translateY(6px);} to {opacity:1; transform:none;} }

.label-subgcse { display:block; font-weight:700; font-family:"Manrope",sans-serif; color:#0e1a24; margin-bottom:8px; margin-top: 30px; }
.input-subgcse, .select-subgcse { width:500px; padding:12px 14px; border-radius:10px; border:1px solid #c8d2de; font-size:1rem; outline:none; }
.input-subgcse:focus, .select-subgcse:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(5,75,113,.12); }

.actions-row-subgcse { display:flex; gap:10px; justify-content:flex-end; margin-top:12px; }
.btn-subgcse, .btn-secondary-subgcse { border-radius:10px; padding:12px 18px; font-weight:700; cursor:pointer; border:1px solid transparent; }
.btn-subgcse { background: var(--accent); color:#fff; }
.btn-subgcse:hover { background:#043d5b; }
.btn-secondary-subgcse { background:#f1f5f9; color:#0e1a24; border-color:#e5eaf0; }
.btn-secondary-subgcse:hover { background:#e7edf5; }

.calendar-head-subgcse { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px; margin-bottom:8px; }
.week-grid-subgcse { display:grid; grid-template-columns: repeat(7, 1fr); gap:12px; margin-top:8px; }
.week-col-subgcse { background:#fff; border:1px solid #e8edf3; border-radius:12px; padding:10px; }
.week-col-title-subgcse { font-weight:800; font-family:"Manrope",sans-serif; margin-bottom:8px; color:#0e1a24; }

.slot-btn-subgcse { width:100%; margin-bottom:8px; padding:10px 12px; border-radius:10px; font-weight:700; font-size:.95rem; border:1px solid transparent; cursor:pointer; transition: transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease; }
.modal-subgcse[hidden], .modal-overlay-subgcse[hidden] { display:none !important; }

.slot-btn-subgcse.available {  background:#f2fbff; color:#0a3d5a; border-color:#bfe5f7; }
.slot-btn-subgcse.available:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(5,75,113,.15); }
.slot-btn-subgcse.trial { background:#fff9f0; color:#7a4b00; border-color:#f3d3a6; }
.slot-btn-subgcse.taken { background:#054c73b3; color:#b1c5d3; border-color:#d5dde6; cursor:not-allowed; text-decoration: line-through; }
.slot-btn-subgcse.selected { outline: 3px solid rgba(5, 75, 113, 0.835); background:#e7f6ff; }

.legend-subgcse { display:flex; gap:16px; margin:10px 0 2px; color:#47525a; font-size:.92rem; }
.legend-subgcse .dot-subgcse { display:inline-block; width:10px; height:10px; border-radius:999px; margin-right:6px; vertical-align:middle; }
.legend-subgcse .available { background:#ffffff; border: 1px solid #1aa0e6;}
.legend-subgcse .trial { background:#ffffff; border: 1px solid #f3a043;}
.legend-subgcse .taken { background:#7a8a98; }

@media (max-width:760px){
  .calendar-head-subgcse{flex-direction:column; align-items:start;}
  .week-grid-subgcse{grid-template-columns: repeat(2,1fr);}
}

@media (max-width:420px){ .week-grid-subks3{grid-template-columns:1fr;}
.week-grid-subgcse{grid-template-columns:1fr;}
  .input-subgcse, .select-subgcse { width: 360px;} 
  .modal-header-subgcse  { padding: 40px 20px 20px 20px;}
 }

@media (max-width: 380px) {.input-subgcse, .select-subgcse {width: 280px;} 
 .modal-header-subgcse  { padding: 10px 20px}
}