@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Baskerville:wght@400;700&display=swap');

:root {
  --navy: #18385f;
  --navy-dark: #102b49;
  --blue: #2d5c8f;
  --ink: #24374b;
  --muted: #63758a;
  --pale: #eef4fa;
  --line: #d8e1eb;
  --white: #fff;
  --shadow: 0 18px 50px rgba(24, 56, 95, .12);
  --radius: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-family: "DM Sans", Arial, sans-serif;
  line-height: 1.6;
}
a { color: inherit; }
.container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid #e8edf3;
  backdrop-filter: blur(12px);
}
.nav-wrap { min-height: 76px; display: flex; align-items: center; gap: 24px; }
.logo, .footer-logo {
  text-decoration: none;
  color: var(--navy);
  font-family: "Libre Baskerville", Georgia, serif;
  font-size: 27px;
  letter-spacing: .02em;
}
.logo span, .footer-logo span { color: #6b7e92; }
.tagline {
  border-left: 1px solid var(--line);
  padding-left: 20px;
  color: var(--blue);
  font-weight: 600;
  font-style: italic;
}
.nav { margin-left: auto; display: flex; gap: 27px; }
.nav a { text-decoration: none; font-size: 14px; font-weight: 600; color: #44586f; padding: 28px 0 25px; border-bottom: 2px solid transparent; }
.nav a:hover, .nav a.active { color: var(--navy); border-bottom-color: var(--navy); }
.menu-toggle { display:none; border:0; background:none; font-size:26px; color:var(--navy); cursor:pointer; }

.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #f8fbfe 0%, #eef4fa 53%, #dfeaf4 100%);
  border-bottom: 1px solid #dbe5ef;
}
.hero-grid {
  min-height: 575px;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: 25px;
}
.hero-copy { position:relative; z-index:2; padding: 62px 0; }
.eyebrow { margin: 0 0 9px; color: var(--blue); font-size: 13px; letter-spacing: .12em; font-weight: 700; }
h1, h2, h3 { font-family: "Libre Baskerville", Georgia, serif; color: var(--navy); }
h1 { margin: 0; font-size: clamp(38px, 4.2vw, 59px); line-height: 1.13; letter-spacing: -.03em; }
h1 em { font-style: normal; }
.hero-subtitle { font-family:"Libre Baskerville", Georgia, serif; font-size: 22px; margin: 13px 0; color: var(--ink); }
.hero-text { max-width: 610px; color: #50657a; font-size: 17px; margin: 0 0 27px; }
.hero-meta { display:flex; flex-wrap:wrap; gap:0; margin-bottom: 28px; }
.meta-item { display:flex; gap:10px; align-items:center; padding: 5px 22px 5px 0; margin-right:20px; border-right:1px solid #cad6e1; }
.meta-item:last-child { border:0; }
.meta-icon { font-size:25px; color:var(--navy); width:30px; text-align:center; }
.meta-item strong, .meta-item small { display:block; }
.meta-item strong { font-size:13px; color:var(--navy); }
.meta-item small { font-size:12px; color:var(--muted); }
.hero-cta { display:flex; align-items:center; gap:22px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:18px;
  border:0; border-radius:10px; padding:15px 23px; font:700 15px "DM Sans", sans-serif;
  text-decoration:none; cursor:pointer; transition:.2s ease;
}
.btn-primary { background:var(--navy); color:#fff; box-shadow:0 8px 20px rgba(24,56,95,.2); }
.btn-primary:hover { transform:translateY(-2px); background:var(--navy-dark); }
.btn span { font-size:20px; line-height:0; }
.price { color:var(--navy); font-size:14px; }
.price strong { font-size:21px; }

.hero-photo-wrap { position:relative; align-self:stretch; min-height:575px; display:flex; align-items:end; justify-content:center; }
.photo-card {
  width:min(500px, 100%);
  position:relative;
  z-index:2;
  margin-top:40px;
  align-self:end;
  border-radius: 210px 210px 0 0;
  overflow:hidden;
  box-shadow: -18px 20px 55px rgba(27,56,84,.18);
  background:#dfe9f1;
}
.teacher-photo { width:100%; aspect-ratio:1/1.05; object-fit:cover; object-position:center 26%; display:block; }
.photo-caption { position:absolute; left:0; right:0; bottom:0; padding:35px 25px 20px; color:#fff; background:linear-gradient(transparent,rgba(16,43,73,.88)); }
.photo-caption strong, .photo-caption span { display:block; }
.photo-caption strong { font-size:17px; }
.photo-caption span { font-size:12px; opacity:.9; }
.chalkboard {
  position:absolute; right:-20px; top:75px; width:205px; height:130px; border-radius:8px;
  background:#183f4b; color:#dce8e4; padding:20px; transform:rotate(5deg);
  box-shadow:var(--shadow); font:italic 18px Georgia, serif;
}
.chalkboard span { display:block; margin-bottom:15px; }
.hero-bg-math { position:absolute; inset:0; opacity:.06; pointer-events:none; font:italic 100px Georgia, serif; color:var(--navy); }
.hero-bg-math span { position:absolute; }
.hero-bg-math span:nth-child(1){right:3%;top:12%}
.hero-bg-math span:nth-child(2){left:4%;bottom:5%}
.hero-bg-math span:nth-child(3){right:30%;bottom:7%}

.info-section { padding:68px 0 42px; }
.three-cols { display:grid; grid-template-columns:1fr 1.1fr .95fr; gap:0; }
.info-card { padding:0 34px; border-right:1px solid var(--line); }
.info-card:first-child { padding-left:0; }
.info-card:last-child { border-right:0; padding-right:0; }
.section-icon { color:var(--navy); font-size:26px; margin-bottom:4px; }
.info-card h2, .panel-title h2 { font-size:20px; margin:0 0 17px; }
.info-card h3 { font-size:20px; margin:0 0 10px; }
.info-card p { color:var(--muted); font-size:14px; margin:0 0 12px; }
.target-box { background:#edf4fa; border:1px solid #e1ebf4; border-radius:10px; padding:14px 16px; margin:0 0 11px; }
.target-box h3 { font-family:"DM Sans",sans-serif; font-size:16px; margin:0 0 7px; }
.target-box ul { padding:0 0 0 18px; margin:0; color:#53677b; font-size:12.5px; }
.target-box li { margin:3px 0; }
.method { display:flex; gap:14px; align-items:flex-start; padding:13px 0; border-bottom:1px solid #e5ebf1; }
.method > span { color:var(--navy); font-size:23px; width:25px; text-align:center; }
.method strong, .method small { display:block; }
.method strong { color:var(--navy); font-size:14px; }
.method small { color:var(--muted); font-size:12px; }
.price-method { border:0; }
.price-method b { color:var(--navy); font-size:15px; }

.quote-strip { background:#f1f6fb; border-top:1px solid #e1eaf2; border-bottom:1px solid #e1eaf2; }
.quote-inner { min-height:165px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.quote-inner blockquote { margin:0; font-family:"Libre Baskerville",Georgia,serif; font-size:24px; color:var(--navy); font-style:italic; }
.quote-math { font:italic 28px Georgia,serif; color:#6c87a2; }
.geometry { font:38px Georgia,serif; color:#8ba2b7; }

.action-section { padding:62px 0 75px; background:#fff; }
.action-grid { display:grid; grid-template-columns:1.2fr .9fr; gap:28px; }
.form-panel, .faq-panel { background:#eef5fb; border:1px solid #e0eaf3; border-radius:14px; padding:28px; }
.panel-title { display:flex; gap:13px; align-items:flex-start; }
.panel-title .section-icon { margin-top:0; }
.panel-title h2 { margin-bottom:3px; }
.panel-intro { color:var(--muted); font-size:13px; margin:0 0 18px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
form label { display:block; color:#435a72; font-size:12px; font-weight:700; margin-bottom:12px; }
input, textarea {
  width:100%; margin-top:5px; border:1px solid #d4e0eb; border-radius:7px; background:#fff;
  padding:11px 12px; font:14px "DM Sans",sans-serif; color:var(--ink); outline:none;
}
input:focus, textarea:focus { border-color:#6687a7; box-shadow:0 0 0 3px rgba(45,92,143,.1); }
textarea { resize:vertical; }
.submit-btn { width:100%; margin-top:3px; }
.form-note, .form-status { color:#718296; font-size:11px; margin:8px 0 0; }
.form-status { color:var(--navy); font-weight:700; min-height:17px; }

.faq { border-bottom:1px solid #d9e4ee; }
.faq button {
  width:100%; border:0; background:transparent; padding:15px 0; display:flex; justify-content:space-between;
  gap:15px; text-align:left; color:#38536f; font:600 13px "DM Sans",sans-serif; cursor:pointer;
}
.faq button span { font-size:19px; color:#617c98; }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .25s ease; color:#65788c; font-size:12px; padding-right:25px; }
.faq.open .faq-answer { max-height:180px; padding-bottom:14px; }
.faq.open button span { transform:rotate(45deg); display:inline-block; }

.footer { background:var(--navy-dark); color:#dbe5ef; padding:28px 0; }
.footer-inner { display:flex; align-items:center; gap:30px; }
.footer-logo { color:#fff; font-size:22px; }
.footer p { margin:5px 0 0; font-size:12px; color:#aebfd0; }
.footer-contact { margin-left:auto; display:flex; gap:25px; }
.footer-contact a { color:#fff; text-decoration:none; font-size:13px; }
.back-top { color:#c7d6e4; text-decoration:none; font-size:12px; border-left:1px solid #44607c; padding-left:25px; }

@media (max-width: 980px) {
  .nav { gap:15px; }
  .tagline { display:none; }
  .hero-grid { grid-template-columns:1fr .72fr; }
  .hero-photo-wrap { min-height:500px; }
  .photo-card { width:100%; }
  .three-cols { grid-template-columns:1fr; gap:35px; }
  .info-card, .info-card:first-child, .info-card:last-child { padding:0; border:0; border-bottom:1px solid var(--line); padding-bottom:30px; }
  .info-card:last-child { border:0; padding-bottom:0; }
}

@media (max-width: 760px) {
  .container { width:min(100% - 30px, 600px); }
  .site-header { position:relative; }
  .nav-wrap { min-height:64px; }
  .menu-toggle { display:block; margin-left:auto; }
  .nav {
    display:none; position:absolute; top:64px; left:0; right:0; background:#fff; padding:10px 20px 18px;
    flex-direction:column; gap:0; border-bottom:1px solid var(--line); box-shadow:0 12px 25px rgba(0,0,0,.08);
  }
  .nav.open { display:flex; }
  .nav a { padding:10px 0; border:0; }
  .hero-grid { grid-template-columns:1fr; min-height:0; }
  .hero-copy { padding:45px 0 15px; }
  h1 { font-size:39px; }
  .hero-subtitle { font-size:18px; }
  .hero-text { font-size:15px; }
  .hero-meta { flex-direction:column; gap:4px; }
  .meta-item { border:0; padding:3px 0; margin:0; }
  .hero-cta { flex-wrap:wrap; }
  .hero-photo-wrap { min-height:390px; }
  .photo-card { width:min(430px,100%); border-radius:150px 150px 0 0; }
  .chalkboard { display:none; }
  .quote-inner { min-height:140px; justify-content:center; text-align:center; }
  .quote-math, .geometry { display:none; }
  .quote-inner blockquote { font-size:19px; }
  .action-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
  .footer-inner { flex-direction:column; align-items:flex-start; }
  .footer-contact { margin:0; flex-direction:column; gap:5px; }
  .back-top { border:0; padding:0; }
}

@media (max-width: 420px) {
  .logo { font-size:23px; }
  h1 { font-size:34px; }
  .hero-copy { padding-top:32px; }
  .form-panel, .faq-panel { padding:20px; }
}


/* Hidden anti-spam field */
.hp-field { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.form-status.success { color: #176b43; }
.form-status.error { color: #a33a3a; }
button:disabled { opacity:.65; cursor:wait; }