:root{
    --green:#134E4A;
    --green-dark:#0c3532;
    --green-tint: rgba(19,78,74,0.07);
    --gold:#C9A24B;
    --gold-soft: rgba(201,162,75,0.18);
    --cream:#FBF6EA;
    --cream-2:#F3ECDA;
    --coral:#EF8B5C;
    --coral-dark:#dd7442;
    --ink:#1d2a28;
    --ink-dim: rgba(29,42,40,0.62);
    --white:#ffffff;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Open Sans', sans-serif;
    background:var(--cream);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{ font-family:'Lora', serif; color:var(--green); line-height:1.15; }
  a{ text-decoration:none; color:inherit; }
  img{ max-width:100%; display:block; }
  .container{ max-width:1180px; margin:0 auto; padding:0 24px; }
  .eyebrow{
    font-size:12px; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--gold); font-weight:700; margin-bottom:12px; display:block;
  }
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:14px 28px; border-radius:8px; font-weight:600; font-size:15px;
    cursor:pointer; border:none; transition:transform .2s ease, box-shadow .2s ease;
  }
  .btn:hover{ transform:translateY(-2px); }
  .btn-coral{ background:var(--coral); color:#fff; box-shadow:0 8px 20px rgba(239,139,92,0.35); }
  .btn-coral:hover{ background:var(--coral-dark); }
  .btn-outline{ background:transparent; border:1.5px solid var(--green); color:var(--green); }
  .btn-outline:hover{ background:var(--green); color:#fff; }
  section{ padding:88px 0; }
  .section-head{ text-align:center; max-width:640px; margin:0 auto 52px; }
  .section-head p{ color:var(--ink-dim); margin-top:14px; font-size:16px; line-height:1.7; }

  /* ---------- Top bar ---------- */
  .topbar{
    background:var(--green-dark); color:rgba(255,255,255,0.85);
    font-size:13px;
  }
  .topbar .container{ display:flex; justify-content:space-between; align-items:center; padding:8px 24px; flex-wrap:wrap; gap:6px;}
  .topbar a{ color:#fff; opacity:0.9; }
  .topbar .contacts{ display:flex; gap:22px; flex-wrap:wrap; }
  .topbar .contacts span{ display:inline-flex; align-items:center; gap:6px; }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:100;
    background:rgba(251,246,234,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(19,78,74,0.08);
  }
  nav.container{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; }
  .logo{ display:flex; align-items:center; gap:10px; font-family:'Lora',serif; font-weight:700; font-size:21px; color:var(--green); }
  .logo .mark{
    width:34px; height:34px; position:relative;
    display:flex; align-items:center; justify-content:center;
  }
  .nav-links{ display:flex; gap:30px; font-weight:600; font-size:14.5px; }
  .nav-links a{ color:var(--ink); position:relative; padding:6px 0; }
  .nav-links a::after{
    content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold);
    transition:width .25s ease;
  }
  .nav-links a:hover::after{ width:100%; }
  .nav-cta-wrap{ display:flex; align-items:center; gap:18px; }
  .burger{ display:none; }

  /* ---------- Hero ---------- */
  .hero{
    padding:90px 0 70px;
    background:
      radial-gradient(ellipse at 80% 20%, rgba(201,162,75,0.14), transparent 55%),
      var(--cream);
    overflow:hidden;
  }
  .hero .container{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:50px; align-items:center; }
  .hero h1{ font-size:clamp(2.1rem, 3.6vw, 3.4rem); margin-bottom:20px; }
  .hero h1 em{ font-style:italic; color:var(--coral); }
  .hero p.lead{ font-size:17px; color:var(--ink-dim); line-height:1.75; max-width:46ch; margin-bottom:32px; }
  .hero-ctas{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
  .no-cc{ font-size:13px; color:var(--ink-dim); margin-top:14px; }
  .no-cc::before{ content:'✓ '; color:var(--green); font-weight:700; }

  .hero-stats{ display:flex; gap:34px; margin-top:44px; flex-wrap:wrap; }
  .hero-stats .stat b{ font-family:'Lora',serif; font-size:1.6rem; color:var(--green); display:block; }
  .hero-stats .stat span{ font-size:12.5px; color:var(--ink-dim); text-transform:uppercase; letter-spacing:0.06em; }

  /* ---- 3D rotating star ornament ---- */
  .ornament-stage{
    position:relative; height:auto;  display:flex; align-items:center; justify-content:center;
    perspective:1300px;
  }
  .ornament{
    position:relative; width:280px; height:280px; transform-style:preserve-3d;transform-origin: center center;
    animation:spin-center 20s linear infinite;
  }
  /* @keyframes spin3d{ from{ transform:rotateY(0deg) rotateX(14deg);} to{ transform:rotateY(360deg) rotateX(14deg);} } */
  @keyframes spin-center {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}
  .star-layer{
    position:absolute; inset:0; margin:auto;
    width:220px; height:220px;
    background:linear-gradient(135deg, var(--gold), #a9853a);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    opacity:0.92;
    box-shadow:0 0 40px rgba(201,162,75,0.35);
  }
  .star-layer.l2{ transform: translateZ(26px) rotate(22.5deg) scale(0.86); opacity:0.85; filter:brightness(1.12); }
  .star-layer.l3{ transform: translateZ(52px) rotate(45deg) scale(0.72); opacity:0.8; filter:brightness(1.24); }
  .star-layer.l4{ transform: translateZ(-26px) rotate(-22.5deg) scale(0.86); opacity:0.55; filter:brightness(0.8); }
  .orb-ring{
    position:absolute; inset:0; margin:auto; width:340px; height:340px; border-radius:50%;
    border:1px dashed rgba(19,78,74,0.25);
    transform: rotateX(75deg);
  }
  .orb-dot{
    position:absolute; width:10px; height:10px; border-radius:50%; background:var(--coral);
    top:-5px; left:50%; margin-left:-5px;
    box-shadow:0 0 12px rgba(239,139,92,0.7);
  }

  /* ---------- Trust strip ---------- */
  .trust{
    background:var(--green); color:#fff; padding:26px 0;
  }
  .trust .container{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px; }
  .trust .item{ display:flex; align-items:center; gap:10px; font-size:13.5px; font-weight:600; opacity:0.94; }
  .trust .item .dot{ width:7px; height:7px; border-radius:50%; background:var(--gold); }

  /* ---------- Courses ---------- */
  .courses-grid{
    display:grid; grid-template-columns:repeat(5, 1fr); gap:22px;
  }
  .course-card{
    background:#fff; border-radius:16px; padding:30px 24px; text-align:left;
    box-shadow:0 10px 30px rgba(19,78,74,0.07);
    transform-style:preserve-3d; transition:box-shadow .3s ease;
    border:1px solid rgba(19,78,74,0.06);
    cursor:default;
  }
  .course-card:hover{ box-shadow:0 24px 44px rgba(19,78,74,0.16); }
  .course-icon{
    width:52px; height:52px; border-radius:12px; background:var(--green-tint);
    display:flex; align-items:center; justify-content:center; margin-bottom:20px;
    font-size:22px; color:var(--green);
  }
  .course-card h3{ font-size:17px; margin-bottom:10px; }
  .course-card p{ font-size:13.6px; color:var(--ink-dim); line-height:1.6; }
  .course-tier{ font-size:11px; color:var(--gold); font-weight:700; text-transform:uppercase; letter-spacing:0.08em; margin-top:14px; display:block; }

  /* ---------- Why 1:1 ---------- */
  .why{ background:var(--cream-2); }
  .why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
  .why-item{ text-align:center; padding:10px; }
  .why-item .n{ font-family:'Lora',serif; font-size:2rem; color:var(--gold); margin-bottom:10px; }
  .why-item h4{ font-size:15.5px; margin-bottom:8px; }
  .why-item p{ font-size:13.5px; color:var(--ink-dim); line-height:1.6; }

  /* ---------- Teachers ---------- */
  .teachers-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
  .teacher-panel{
    background:#fff; border-radius:16px; padding:34px; border:1px solid rgba(19,78,74,0.06);
    box-shadow:0 10px 30px rgba(19,78,74,0.06);
  }
  .teacher-panel h3{ font-size:19px; margin-bottom:6px; }
  .teacher-panel .tag{ font-size:12.5px; color:var(--gold); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
  .teacher-panel ul{ margin-top:18px; padding-left:20px; color:var(--ink-dim); font-size:13.8px; line-height:2; }
  .avatar-row{ display:flex; gap:12px; margin-top:22px; }
  .avatar{
    width:52px; height:52px; border-radius:50%;
    background:linear-gradient(135deg, var(--green), var(--gold));
    display:flex; align-items:center; justify-content:center; color:#fff; font-family:'Lora',serif; font-weight:700;
  }

  /* ---------- Pricing ---------- */
  .pricing{ background:var(--green); color:#fff; }
  .pricing .section-head h2{ color:#fff; }
  .pricing .section-head p{ color:rgba(255,255,255,0.75); }
  .currency-toggle{
    display:flex; justify-content:center; margin-bottom:44px;
  }
  .toggle-track{
    display:flex; background:rgba(255,255,255,0.12); border-radius:999px; padding:4px; gap:4px;
  }
  .toggle-btn{
    padding:10px 26px; border-radius:999px; font-weight:700; font-size:13.5px; cursor:pointer;
    background:transparent; color:rgba(255,255,255,0.7); border:none; transition:.25s;
  }
  .toggle-btn.active{ background:var(--gold); color:var(--green-dark); }
  .price-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; perspective:1400px; }
  .price-card{ position:relative; height:300px; }
  .price-flip{
    position:relative; width:100%; height:100%; transform-style:preserve-3d;
    transition:transform .7s cubic-bezier(.4,.2,.2,1);
  }
  .price-card.flipped .price-flip{ transform:rotateY(180deg); }
  .price-face{
    position:absolute; inset:0; backface-visibility:hidden;
    background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15);
    border-radius:16px; padding:28px 22px; display:flex; flex-direction:column;
  }
  .price-face.back{ transform:rotateY(180deg); }
  .price-face .freq{ font-size:14px; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.05em; }
  .price-face .amount{ font-family:'Lora',serif; font-size:2.2rem; margin:14px 0 4px; }
  .price-face .amount span{ font-size:14px; font-weight:400; opacity:.7; }
  .price-face .sibling{ font-size:12.5px; color:rgba(255,255,255,0.65); margin-bottom:14px; }
  .price-face .profile{ font-size:12.8px; color:rgba(255,255,255,0.8); line-height:1.6; margin-top:auto; padding-top:14px; border-top:1px dashed rgba(255,255,255,0.2); }
  .sibling-note{ text-align:center; margin-top:30px; font-size:13.5px; color:rgba(255,255,255,0.75); }
  .sibling-note b{ color:var(--gold); }

  /* ---------- Testimonials ---------- */
  .testimonials-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .t-card{
    background:#fff; border-radius:16px; padding:28px; border:1px solid rgba(19,78,74,0.06);
    box-shadow:0 10px 24px rgba(19,78,74,0.05);
  }
  .t-card .stars{ color:var(--gold); letter-spacing:2px; margin-bottom:14px; font-size:14px; }
  .t-card p{ font-size:14.5px; color:var(--ink-dim); line-height:1.7; margin-bottom:18px; }
  .t-card .who{ display:flex; align-items:center; gap:12px; }
  .t-card .who .avatar{ width:40px; height:40px; font-size:13px; }
  .t-card .who b{ display:block; font-size:13.5px; color:var(--ink); }
  .t-card .who span{ font-size:12px; color:var(--ink-dim); }

  /* ---------- FAQ ---------- */
  .faq{ max-width:760px; margin:0 auto; }
  .faq-item{ border-bottom:1px solid rgba(19,78,74,0.14); }
  .faq-q{
    padding:22px 4px; display:flex; justify-content:space-between; align-items:center; cursor:pointer;
    font-weight:600; font-size:15.5px; color:var(--green);
  }
  .faq-q .plus{ font-size:20px; color:var(--gold); transition:transform .3s ease; }
  .faq-item.open .faq-q .plus{ transform:rotate(45deg); }
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; font-size:14.5px; color:var(--ink-dim); line-height:1.7; }
  .faq-a div{ padding:0 4px 22px; }

  /* ---------- Free trial form ---------- */
  .trial{ background:var(--cream-2); }
  .trial-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
  .trial-form{
    background:#fff; border-radius:18px; padding:34px; box-shadow:0 20px 50px rgba(19,78,74,0.1);
  }
  .field{ margin-bottom:18px; }
  .field label{ display:block; font-size:13px; font-weight:700; margin-bottom:7px; color:var(--green); }
  .field input, .field select{
    width:100%; padding:12px 14px; border-radius:8px; border:1.5px solid rgba(19,78,74,0.16);
    font-family:'Open Sans',sans-serif; font-size:14px; background:var(--cream);
  }
  .field input:focus, .field select:focus{ outline:none; border-color:var(--gold); }

  /* ---------- Contact / Footer ---------- */
  footer{ background:var(--green-dark); color:rgba(255,255,255,0.8); padding-top:64px; }
  .footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; padding-bottom:44px; }
  footer h4{ color:#fff; font-size:15px; margin-bottom:18px; }
  footer .logo{ color:#fff; margin-bottom:14px; }
  footer p{ font-size:13.5px; line-height:1.8; color:rgba(255,255,255,0.65); }
  footer ul{ list-style:none; }
  footer ul li{ margin-bottom:11px; font-size:13.8px; }
  footer ul li a:hover{ color:var(--gold); }
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,0.12); padding:22px 0; text-align:center; font-size:12.5px; color:rgba(255,255,255,0.5);
  }

  /* ---------- WhatsApp float ---------- */
  .wa-float{
    position:fixed; bottom:26px; right:26px; z-index:200;
    width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
    display:flex; align-items:center; justify-content:center; font-size:26px;
    box-shadow:0 10px 24px rgba(37,211,102,0.5); cursor:pointer;
    animation:pulse 2.4s ease-in-out infinite;
  }
  @keyframes pulse{ 0%,100%{ box-shadow:0 10px 24px rgba(37,211,102,0.5);} 50%{ box-shadow:0 10px 24px rgba(37,211,102,0.85), 0 0 0 10px rgba(37,211,102,0.12);} }

  @media (max-width:980px){
    .hero .container{ grid-template-columns:1fr; }
    .ornament-stage{ height:300px; }
    .courses-grid{ grid-template-columns:repeat(2,1fr); }
    .why-grid{ grid-template-columns:repeat(2,1fr); }
    .teachers-grid{ grid-template-columns:1fr; }
    .price-grid{ grid-template-columns:repeat(2,1fr); }
    .testimonials-grid{ grid-template-columns:1fr; }
    .trial-wrap{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr 1fr; }
    .nav-links{ display:none; }
  }
  @media (max-width:560px){
    .courses-grid{ grid-template-columns:1fr; }
    .why-grid{ grid-template-columns:1fr; }
    .price-grid{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr; }
    .topbar .contacts{ display:none; }
  }
  @media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }