:root{
    --navy:#132A4C;
    --navy-2:#1F3D66;
    --paper:#F3EEE0;
    --paper-2:#EAE3CE;
    --gold:#A97620;
    --gold-deep:#8A5F17;
    --green:#3B6B4E;
    --ink:#152238;
    --ink-soft:#4A5568;
    --line:#CBBFA0;
    --white:#FFFDF8;
    --radius:2px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:'IBM Plex Sans', sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.55;
  }
  h1,h2,h3,.serif{
    font-family:'Fraunces', serif;
    font-weight:600;
    color:var(--navy);
    letter-spacing:-0.01em;
    margin:0;
  }
  a{color:inherit;}
  .wrap{max-width:1120px; margin:0 auto; padding:0 28px;}
  img{max-width:100%; display:block;}

  /* ---------- NAV ---------- */
  header.site{
    position:sticky; top:0; z-index:40;
    background:rgba(255,253,248,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
  }
  .nav{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1120px; margin:0 auto;}
  .brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
  .brand-mark{
    width:34px; height:34px; border:1.5px solid var(--navy); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces',serif; font-weight:600; font-size:15px; color:var(--navy);
    flex-shrink:0;
  }
  .brand-text{font-family:'Fraunces',serif; font-weight:600; font-size:17px; color:var(--navy); line-height:1.15;}
  .brand-text small{display:block; font-family:'IBM Plex Sans',sans-serif; font-weight:500; font-size:11px; color:var(--ink-soft); letter-spacing:.03em;}
  nav.links{display:flex; gap:28px; align-items:center;}
  nav.links a{font-size:14.5px; text-decoration:none; color:var(--ink); font-weight:500; padding:4px 0; border-bottom:1px solid transparent;}
  nav.links a:hover{border-bottom-color:var(--gold);}
  .btn{
    display:inline-block; font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:14.5px;
    padding:11px 22px; border-radius:var(--radius); text-decoration:none; border:1.5px solid var(--navy);
    transition:background .15s ease, color .15s ease;
  }
  .btn-primary{background:var(--navy); color:var(--white);}
  .btn-primary:hover{background:var(--navy-2);}
  .btn-ghost{background:transparent; color:var(--navy);}
  .btn-ghost:hover{background:var(--navy); color:var(--white);}
  .btn-gold{border-color:var(--gold-deep); background:var(--gold); color:var(--white);}
  .btn-gold:hover{background:var(--gold-deep);}
  .nav-toggle{display:none;}

  /* ---------- HERO ---------- */
  .hero{background:var(--paper); border-bottom:1px solid var(--line); padding:64px 0 0;}
  .hero-inner{display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:center; padding-bottom:56px;}
  .stamp{
    display:inline-flex; align-items:center; gap:8px;
    border:1.5px solid var(--green); color:var(--green);
    padding:6px 14px; font-size:12.5px; font-weight:600; letter-spacing:.04em;
    border-radius:20px; margin-bottom:22px; transform:rotate(-1.2deg);
  }
  .stamp::before{content:"✓"; font-weight:700;}
  h1.headline{font-size:clamp(34px,4.4vw,54px); line-height:1.08; max-width:14ch;}
  .hero p.lede{font-size:18px; color:var(--ink-soft); max-width:46ch; margin:22px 0 30px;}
  .hero-cta{display:flex; gap:14px; flex-wrap:wrap;}

  .passbook{
    background:var(--white); border:1px solid var(--line); border-radius:4px;
    box-shadow:6px 6px 0 var(--navy); padding:26px 26px 10px; transform:rotate(1deg);
  }
  .passbook-head{
    display:flex; justify-content:space-between; align-items:baseline;
    border-bottom:2px solid var(--ink); padding-bottom:10px; margin-bottom:6px;
  }
  .passbook-head span{font-size:11px; letter-spacing:.08em; color:var(--ink-soft); font-weight:600;}
  .passbook-title{font-family:'Fraunces',serif; font-size:15px; font-weight:600; color:var(--navy);}
  .entry{display:flex; justify-content:space-between; align-items:baseline; padding:13px 0; border-bottom:1px dotted var(--line);}
  .entry:last-child{border-bottom:none;}
  .entry .label{font-size:14px; color:var(--ink-soft);}
  .entry .value{font-family:'Fraunces',serif; font-size:20px; font-weight:600; color:var(--navy); white-space:nowrap;}

  /* ---------- SECTION SHELL ---------- */
  section{padding:84px 0;}
  .section-head{max-width:640px; margin-bottom:48px;}
  .kicker{font-size:13.5px; font-weight:600; color:var(--gold-deep); margin-bottom:10px; display:block;}
  h2.title{font-size:clamp(28px,3.4vw,38px); line-height:1.15;}
  .section-head p{color:var(--ink-soft); font-size:16.5px; margin-top:14px; max-width:56ch;}

  /* ---------- STATS / LEDGER ---------- */
  .ledger-block{background:var(--navy); color:var(--white); border-radius:4px; padding:44px 40px;}
  .ledger-block .section-head p{color:#C6D1E4;}
  .ledger-block .kicker{color:#E7C784;}
  .ledger-block h2.title{color:var(--white);}
  .stat-rows{border-top:1px solid rgba(255,255,255,0.25);}
  .stat-row{
    display:grid; grid-template-columns:110px 1fr; gap:28px; align-items:baseline;
    padding:22px 0; border-bottom:1px solid rgba(255,255,255,0.25);
  }
  .stat-row .num{font-family:'Fraunces',serif; font-size:40px; font-weight:600; color:#E7C784;}
  .stat-row .desc{font-size:15.5px; color:#DCE4F0;}
  .ledger-note{font-size:12.5px; color:#9FB0CC; margin-top:20px;}

  /* ---------- PROGRAMMES ---------- */
  .prog-list{display:flex; flex-direction:column; border-top:1px solid var(--line);}
  .prog-row{
    display:grid; grid-template-columns:230px 1fr 200px; gap:32px;
    padding:34px 0; border-bottom:1px solid var(--line); align-items:start;
  }
  .prog-audience{font-size:12.5px; font-weight:600; letter-spacing:.03em; color:var(--gold-deep); margin-bottom:8px;}
  .prog-row h3{font-size:22px; margin-bottom:8px;}
  .prog-row p{color:var(--ink-soft); font-size:15px; margin:0;}
  .prog-meta{display:flex; flex-direction:column; gap:8px; text-align:right;}
  .prog-meta .m{font-size:13.5px; color:var(--ink-soft);}
  .prog-meta .m b{color:var(--ink); font-weight:600;}
  .who-for{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px;}
  .who-tag{font-size:12px; color:var(--ink-soft); border:1px solid var(--line); padding:4px 11px; border-radius:12px;}

  /* ---------- COMMITMENT CARD ---------- */
  .commitment-card{
    background:var(--navy); color:var(--white); border-radius:4px;
    padding:38px 40px; margin-top:44px;
    display:grid; grid-template-columns:1.3fr 1fr; gap:40px; align-items:center;
  }
  .commitment-card .kicker{color:#E7C784;}
  .commitment-card h3{color:var(--white); font-size:23px; margin-bottom:16px;}
  .commitment-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
  .commitment-list li{display:flex; gap:10px; font-size:14.5px; color:#DCE4F0;}
  .commitment-list li::before{content:"✓"; color:#E7C784; font-weight:700; flex-shrink:0;}
  .commitment-badges{display:flex; flex-direction:column; gap:12px;}
  .commitment-badges .pill{
    border:1px solid rgba(255,255,255,0.35); border-radius:20px; padding:12px 18px;
    font-size:13.5px; font-weight:600; text-align:center; color:var(--white);
  }

  /* ---------- SKILLS GRID ---------- */
  .skills-wrap{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
  .topic-grid{display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line);}
  .topic{border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:24px;}
  .topic h4{font-family:'Fraunces',serif; font-size:16.5px; color:var(--navy); margin-bottom:8px; font-weight:600;}
  .topic p{font-size:13.5px; color:var(--ink-soft); margin:0;}
  .chip-col h3{font-size:19px; margin-bottom:16px;}
  .chips{display:flex; flex-wrap:wrap; gap:10px;}
  .chip{
    border:1px solid var(--navy); color:var(--navy); font-size:13.5px; font-weight:600;
    padding:8px 15px; border-radius:20px;
  }
  .chip-col p.small{font-size:13.5px; color:var(--ink-soft); margin-top:16px;}

  /* ---------- HOW IT WORKS ---------- */
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative;}
  .step{padding:0 24px 0 0; position:relative;}
  .step-num{
    font-family:'Fraunces',serif; font-size:15px; font-weight:600; color:var(--gold-deep);
    border-bottom:2px solid var(--gold); display:inline-block; padding-bottom:4px; margin-bottom:16px;
  }
  .step h3{font-size:19px; margin-bottom:10px;}
  .step p{color:var(--ink-soft); font-size:14.5px; margin:0;}
  .step::after{
    content:"→"; position:absolute; right:-6px; top:0; font-size:22px; color:var(--line); display:block;
  }
  .step:last-child::after{content:"";}

  /* ---------- ABOUT ---------- */
  .about-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
  .about-card{background:var(--paper); border:1px solid var(--line); padding:28px; border-radius:2px;}
  .about-card h3{font-size:17px; margin-bottom:10px;}
  .about-card p{font-size:14.5px; color:var(--ink-soft); margin:0;}
  .offices{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px;}
  .office-tag{font-size:12.5px; border:1px solid var(--line); padding:6px 12px; border-radius:16px; color:var(--ink-soft);}

  /* ---------- TEAM ---------- */
  .team-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
  .person{border-top:3px solid var(--navy); padding-top:18px;}
  .person h3{font-size:19px; margin-bottom:2px;}
  .person .role{font-size:13.5px; color:var(--gold-deep); font-weight:600; margin-bottom:12px; font-style:italic; font-family:'Fraunces',serif;}
  .person p.bio{font-size:14.5px; color:var(--ink-soft); margin:0;}

  /* ---------- CONTACT ---------- */
  .contact-section{background:var(--navy); color:var(--white);}
  .contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
  .contact-section .kicker{color:#E7C784;}
  .contact-section h2.title{color:var(--white);}
  .contact-section p.lede{color:#C6D1E4; font-size:16px; max-width:44ch;}
  .field{margin-bottom:16px;}
  .field label{display:block; font-size:13px; color:#C6D1E4; margin-bottom:6px; font-weight:500;}
  .field input, .field select, .field textarea{
    width:100%; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.3);
    color:var(--white); padding:11px 12px; font-family:'IBM Plex Sans',sans-serif; font-size:14.5px; border-radius:2px;
  }
  .field textarea{resize:vertical; min-height:80px;}
  .field input::placeholder, .field textarea::placeholder{color:#8FA0BE;}
  .two-col-fields{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  .contact-direct{border-top:1px solid rgba(255,255,255,0.25); padding-top:22px; margin-top:26px;}
  .contact-direct .row{display:flex; justify-content:space-between; font-size:14.5px; padding:10px 0; border-bottom:1px dotted rgba(255,255,255,0.25);}
  .contact-direct .row span:first-child{color:#9FB0CC;}
  .contact-direct .row a{color:var(--white); text-decoration:none; font-weight:600;}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink); color:#B7C0D1; font-size:13px;}
  .footer-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; align-items:center; padding:22px 0; border-top:1px solid #2A3348;}
  .footer-inner a{color:#B7C0D1;}
  .disclaimer{font-size:12.5px; color:#8A94A8; border-top:1px solid #2A3348; padding-top:22px; margin:0;}

  /* ---------- ICON BADGES ---------- */
  .icon-badge{
    width:44px; height:44px; border-radius:50%; border:1.5px solid var(--navy);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    color:var(--navy); background:var(--white);
  }
  .icon-badge svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
  .icon-badge.on-dark{background:transparent; border-color:#E7C784; color:#E7C784;}
  .icon-badge.filled{background:var(--navy); border-color:var(--navy); color:var(--white);}
  .prog-icon-row{display:flex; align-items:center; gap:16px; margin-bottom:2px;}
  .illus-tile{
    width:72px; height:72px; border-radius:14px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--paper); border:1px solid var(--line);
  }
  .illus-tile svg{width:54px; height:54px;}
  .topic .icon-badge{width:38px; height:38px; margin-bottom:14px;}
  .topic .icon-badge svg{width:19px; height:19px;}

  /* ---------- DONUT CHARTS ---------- */
  .donut-row{display:flex; gap:32px; flex-wrap:wrap; margin-top:8px;}
  .donut-item{display:flex; align-items:center; gap:20px; flex:1 1 260px;}
  .donut-wrap{position:relative; width:104px; height:104px; flex-shrink:0;}
  .donut-wrap svg{width:100%; height:100%; transform:rotate(-90deg);}
  .donut-wrap circle{fill:none; stroke-width:11;}
  .donut-track{stroke:rgba(255,255,255,0.16);}
  .donut-fill{stroke:#E7C784; stroke-linecap:round; transition:stroke-dashoffset 1s ease;}
  .donut-label{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces',serif; font-size:22px; font-weight:600; color:var(--white);
  }
  .donut-desc{font-size:14.5px; color:#DCE4F0; max-width:26ch;}

  /* ---------- BUDGET DONUT (light bg) ---------- */
  .budget-figure{display:flex; align-items:center; gap:28px; flex-wrap:wrap;}
  .budget-donut{position:relative; width:150px; height:150px; flex-shrink:0;}
  .budget-donut svg{width:100%; height:100%; transform:rotate(-90deg);}
  .budget-donut circle{fill:none; stroke-width:20;}
  .budget-center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;}
  .budget-center .amt{font-family:'Fraunces',serif; font-size:19px; font-weight:600; color:var(--navy);}
  .budget-center .sub{font-size:10.5px; color:var(--ink-soft);}
  .budget-legend{display:flex; flex-direction:column; gap:10px; flex:1 1 220px;}
  .legend-item{display:flex; align-items:center; gap:10px; font-size:14px;}
  .legend-swatch{width:13px; height:13px; border-radius:3px; flex-shrink:0;}
  .legend-item b{color:var(--navy);}

  /* ---------- BAR CHARTS ---------- */
  .bar-chart{display:flex; flex-direction:column; gap:14px; margin-top:6px;}
  .bar-row{display:grid; grid-template-columns:130px 1fr 70px; align-items:center; gap:14px;}
  .bar-row .bl{font-size:13.5px; color:var(--ink-soft);}
  .bar-track{background:var(--paper-2); border-radius:20px; height:14px; overflow:hidden;}
  .bar-fill{height:100%; border-radius:20px; background:linear-gradient(90deg, var(--gold-deep), var(--gold));}
  .bar-row .bv{font-family:'Fraunces',serif; font-size:14px; font-weight:600; color:var(--navy); text-align:right;}

  /* ---------- COMPARISON (Ramesh vs Suresh) ---------- */
  .compare-wrap{display:grid; grid-template-columns:1fr 1fr; gap:28px;}
  .compare-card{border:1px solid var(--line); border-radius:3px; padding:22px; background:var(--white);}
  .compare-card.bad{border-top:4px solid #A14A3A;}
  .compare-card.good{border-top:4px solid var(--green);}
  .compare-head{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
  .compare-head .icon-badge{width:38px; height:38px;}
  .compare-head h4{font-family:'Fraunces',serif; font-size:17px; color:var(--navy); font-weight:600;}
  .compare-head span{display:block; font-size:12.5px; color:var(--ink-soft);}
  .grow-chart{display:flex; align-items:flex-end; gap:8px; height:90px; margin:16px 0 10px;}
  .grow-bar{flex:1; border-radius:3px 3px 0 0;}
  .bad .grow-bar{background:#E4CFC9;}
  .good .grow-bar{background:linear-gradient(180deg, var(--green), #6FA083);}
  .compare-figure{font-family:'Fraunces',serif; font-size:26px; font-weight:600; color:var(--navy);}
  .compare-card p{font-size:13.5px; color:var(--ink-soft); margin:6px 0 0;}

  /* ---------- GAUGE (debt trap) ---------- */
  .gauge-wrap{display:flex; align-items:center; gap:26px; flex-wrap:wrap;}
  .gauge{position:relative; width:220px; height:120px; flex-shrink:0;}
  .gauge svg{width:100%; height:100%;}
  .gauge-figure{position:absolute; bottom:0; left:0; right:0; text-align:center; font-family:'Fraunces',serif; font-size:26px; font-weight:600; color:var(--navy);}
  .gauge-figure small{display:block; font-family:'IBM Plex Sans',sans-serif; font-size:11.5px; font-weight:500; color:var(--ink-soft);}

  /* ---------- TIMELINE (how it works) ---------- */
  .timeline{position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:8px;}
  .timeline-line{position:absolute; top:22px; left:44px; right:44px; height:2px; background:var(--line); z-index:0;}
  .timeline .step{position:relative; z-index:1; padding-right:24px;}
  .timeline .icon-badge{margin-bottom:16px; background:var(--white);}

  @media (max-width:860px){
    .compare-wrap{grid-template-columns:1fr;}
    .donut-item{flex:1 1 100%;}
    .bar-row{grid-template-columns:100px 1fr 56px; gap:10px;}
    .timeline-line{display:none;}
    nav.links{display:none;}
    .hero-inner{grid-template-columns:1fr; gap:36px;}
    .passbook{transform:none; max-width:420px;}
    .skills-wrap, .about-grid, .team-grid, .contact-grid{grid-template-columns:1fr; gap:32px;}
    .topic-grid{grid-template-columns:1fr;}
    .prog-row{grid-template-columns:1fr; gap:10px;}
    .prog-meta{text-align:left; flex-direction:row; flex-wrap:wrap; gap:16px;}
    .commitment-card{grid-template-columns:1fr; padding:30px 26px;}
    .steps{grid-template-columns:1fr; gap:28px;}
    .step::after{display:none;}
    .two-col-fields{grid-template-columns:1fr;}
    .stat-row{grid-template-columns:70px 1fr;}
    section{padding:56px 0;}
  }

  /* ---------- MULTI-PAGE NAV ---------- */
  nav.links a.active{color:var(--gold-deep); border-bottom-color:var(--gold-deep);}
  .menu-btn{
    display:none; background:none; border:1.5px solid var(--navy); border-radius:4px;
    width:40px; height:40px; align-items:center; justify-content:center; cursor:pointer;
  }
  .menu-btn svg{width:20px; height:20px;}
  .mobile-panel{display:none; flex-direction:column; gap:2px; padding:10px 28px 20px; border-top:1px solid var(--line); background:var(--white);}
  .mobile-panel a{padding:12px 0; font-size:15px; font-weight:500; text-decoration:none; color:var(--ink); border-bottom:1px solid var(--line);}
  .mobile-panel a:last-child{border-bottom:none;}
  .mobile-panel.open{display:flex;}

  /* ---------- BREADCRUMB / PAGE TAG ---------- */
  .page-tag{
    display:inline-block; font-size:12.5px; font-weight:600; color:var(--gold-deep);
    background:rgba(169,118,32,0.1); padding:6px 13px; border-radius:14px; margin-bottom:18px;
  }
  .hero .badge-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px;}
  .hero .badge-row span{
    font-size:13px; font-weight:600; color:var(--navy); background:var(--white);
    border:1px solid var(--line); padding:8px 15px; border-radius:16px;
  }

  /* ---------- QUOTE BLOCK ---------- */
  .quote-block{
    border-left:3px solid var(--gold); padding:4px 0 4px 22px; margin:24px 0;
    font-family:'Fraunces',serif; font-size:19px; font-style:italic; color:var(--navy); max-width:52ch;
  }

  /* ---------- TWO COL FEATURE LIST (corporates) ---------- */
  .feature-list{display:flex; flex-direction:column; border-top:1px solid var(--line);}
  .feature-row{display:grid; grid-template-columns:220px 1fr; gap:28px; padding:26px 0; border-bottom:1px solid var(--line);}
  .feature-row h4{font-family:'Fraunces',serif; font-size:17px; color:var(--navy); font-weight:600;}
  .feature-row p{font-size:14.5px; color:var(--ink-soft); margin:6px 0 0;}

  /* ---------- LOGO / ASSOCIATION STRIP ---------- */
  .assoc-strip{
    display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:18px;
  }
  .assoc-chip{
    font-size:13px; font-weight:600; color:var(--navy); border:1px solid var(--line);
    background:var(--white); padding:8px 14px; border-radius:4px;
  }

  /* ---------- NEXT STEPS CALLOUT ---------- */
  .callout{
    background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--gold-deep);
    padding:26px 28px; border-radius:2px; margin-top:20px;
  }
  .callout h4{font-size:16px; color:var(--navy); margin-bottom:8px;}
  .callout p{font-size:14.5px; color:var(--ink-soft); margin:0;}

  /* ---------- SALARY BREAKDOWN (teacher page) ---------- */
  .salary-total{font-family:'Fraunces',serif; font-size:30px; color:var(--navy); margin-bottom:22px;}
  .salary-list{display:flex; flex-direction:column; gap:12px;}
  .salary-row{display:grid; grid-template-columns:170px 1fr 90px; align-items:center; gap:14px;}
  .salary-row .sl{font-size:13.5px; color:var(--ink-soft);}
  .salary-track{background:var(--paper-2); border-radius:20px; height:12px; overflow:hidden;}
  .salary-fill{height:100%; border-radius:20px; background:var(--navy-2);}
  .salary-fill.highlight{background:linear-gradient(90deg, var(--gold-deep), var(--gold));}
  .salary-row .sv{font-family:'Fraunces',serif; font-size:13.5px; font-weight:600; color:var(--navy); text-align:right;}
  .lesson-box{
    background:var(--navy); color:var(--white); border-radius:4px; padding:24px 28px; margin-top:26px;
  }
  .lesson-box .kicker{color:#E7C784;}
  .lesson-box h4{color:var(--white); font-family:'Fraunces',serif; font-size:18px; margin-bottom:10px;}
  .lesson-flow{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:14px; color:#DCE4F0;}
  .lesson-flow b{color:#E7C784;}

  /* ---------- GOALS CFY (teacher page) ---------- */
  .cfy-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  .cfy-card{border:1px solid var(--line); border-radius:3px; padding:24px; text-align:center;}
  .cfy-letter{
    width:48px; height:48px; border-radius:50%; background:var(--paper); border:1.5px solid var(--navy);
    display:flex; align-items:center; justify-content:center; margin:0 auto 14px;
    font-family:'Fraunces',serif; font-weight:600; font-size:20px; color:var(--navy);
  }
  .cfy-card h4{font-size:16px; margin-bottom:8px;}
  .cfy-card p{font-size:13.5px; color:var(--ink-soft); margin:0;}

  /* ---------- GROWTH STEPS (savings vs investment) ---------- */
  .growth-steps{display:flex; align-items:flex-end; gap:14px; height:110px; margin:26px 0 8px;}
  .growth-step{flex:1; display:flex; flex-direction:column; align-items:center; gap:8px;}
  .growth-bar-el{width:100%; background:linear-gradient(180deg, var(--green), #6FA083); border-radius:3px 3px 0 0;}
  .growth-step .yl{font-size:12.5px; color:var(--ink-soft);}

  /* ---------- PROTECTION CHECKLIST ---------- */
  .protect-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  .protect-item{display:flex; gap:12px; align-items:flex-start; border:1px solid var(--line); padding:16px 18px; border-radius:3px;}
  .protect-item .icon-badge{width:34px; height:34px; flex-shrink:0;}
  .protect-item .icon-badge svg{width:17px; height:17px;}
  .protect-item p{font-size:14px; color:var(--ink-soft); margin:0;}

  /* ---------- MISTAKES LIST ---------- */
  .mistake-list{display:flex; flex-direction:column; border-top:1px solid var(--line);}
  .mistake-row{display:grid; grid-template-columns:36px 1fr; gap:18px; padding:20px 0; border-bottom:1px solid var(--line);}
  .mistake-row .mx{font-family:'Fraunces',serif; color:#A14A3A; font-size:20px; font-weight:600;}
  .mistake-row h4{font-size:15.5px; margin-bottom:4px;}
  .mistake-row p{font-size:13.5px; color:var(--ink-soft); margin:0; font-style:italic;}

  /* ---------- WORKSHEET ---------- */
  .worksheet{background:var(--paper); border:1px solid var(--line); border-radius:4px; padding:32px;}
  .worksheet ol{margin:0; padding-left:22px; display:flex; flex-direction:column; gap:16px;}
  .worksheet li{font-size:14.5px; color:var(--ink);}
  .worksheet li span{display:block; height:1px; border-bottom:1px dotted var(--line); margin-top:8px; max-width:280px;}

  /* ---------- FOOTER (expanded) ---------- */
  .footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding:48px 0 32px;}
  .footer-col h5{color:var(--white); font-size:13.5px; font-weight:600; margin-bottom:16px; letter-spacing:.02em;}
  .footer-col p{font-size:13.5px; color:#9FAAC2; max-width:34ch;}
  .footer-col a{display:block; font-size:13.5px; color:#B7C0D1; text-decoration:none; margin-bottom:10px;}
  .footer-col a:hover{color:var(--white);}
  .footer-brand{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
  .footer-brand .brand-mark{border-color:#E7C784; color:#E7C784;}
  .footer-brand span{font-family:'Fraunces',serif; font-weight:600; color:var(--white); font-size:16px;}

  /* ---------- HOME PROGRAMME CARDS (summary, link out) ---------- */
  .home-prog-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
  .home-prog-card{
    border:1px solid var(--line); border-radius:4px; padding:26px; display:flex; flex-direction:column; gap:14px;
    text-decoration:none; color:var(--ink); transition:border-color .15s ease, box-shadow .15s ease;
  }
  .home-prog-card:hover{border-color:var(--navy); box-shadow:4px 4px 0 var(--paper-2);}
  .home-prog-card h3{font-size:19px;}
  .home-prog-card p{font-size:14px; color:var(--ink-soft); margin:0; flex-grow:1;}
  .home-prog-card .go{font-size:13.5px; font-weight:600; color:var(--gold-deep);}

  @media (max-width:860px){
    nav.links{display:none;}
    .menu-btn{display:flex;}
    .cfy-grid{grid-template-columns:1fr;}
    .protect-grid{grid-template-columns:1fr;}
    .feature-row{grid-template-columns:1fr; gap:6px;}
    .footer-grid{grid-template-columns:1fr; gap:28px;}
    .home-prog-grid{grid-template-columns:1fr;}
    .salary-row{grid-template-columns:110px 1fr 70px; gap:10px;}
  }