:root{
  /* Official Kausala brand palette */
  --ink:#16233F;
  --paper:#FFF8EC;
  --paper-2:#EAF2FB;
  --navy:#1E3A8A;        /* Primary — Brand Blue */
  --navy-2:#152B69;
  --amber:#06B6D4;       /* Secondary — Cyan */
  --amber-deep:#058A9E;
  --sage:#F4C430;        /* Accent — Gold */
  --rust:#FF6B6B;        /* Accent — Coral */
  --teal:#1E3A8A;        /* 4th level reuses Brand Blue to stay on-palette */
  --brand:#1E3A8A;
  --brand-deep:#152B69;
  --line: rgba(22,35,63,0.14);
  --maxw: 1120px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink); font-family:'Quicksand', -apple-system, sans-serif; font-size:17px; font-weight:500; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3,.brand{font-family:'Baloo 2', sans-serif; color:var(--navy); letter-spacing:0;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
a{color:inherit;}
img,svg{display:block; max-width:100%;}
ul{list-style:none;}

/* NAV */
header{position:sticky; top:0; z-index:50; background:rgba(255,248,236,0.94); backdrop-filter:blur(8px); border-bottom:3px solid var(--ink); border-bottom-color:rgba(43,35,80,0.08);}
nav.wrap{display:flex; align-items:center; justify-content:space-between; height:80px; gap:18px;}
.brand-block{display:flex; flex-direction:column; line-height:1.15; flex-shrink:0;}
.brand{font-size:24px; font-weight:800; text-decoration:none; display:flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:0.2px;}
.logo-mark{flex-shrink:0;}
.tagline{font-size:12px; color:#6B5F99; font-weight:600; margin-left:22px; white-space:nowrap;}
.nav-links{display:flex; align-items:center; gap:26px; list-style:none; flex-wrap:wrap;}
.nav-links a{font-size:15px; font-weight:600; text-decoration:none; color:var(--ink); opacity:0.75;}
.nav-links a:hover, .nav-links a.active{opacity:1;}
.nav-links a.active{color:var(--brand);}
.nav-cta{background:var(--brand); color:#fff; padding:12px 24px; border-radius:999px; font-weight:700; font-size:15px; text-decoration:none; box-shadow:0 6px 0 var(--brand-deep); transition:transform .1s; flex-shrink:0; white-space:nowrap;}
.nav-cta:hover{transform:translateY(2px); box-shadow:0 4px 0 var(--brand-deep);}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;}
.burger span{width:24px; height:3px; border-radius:3px; background:var(--navy); display:block; transition:transform .2s, opacity .2s;}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* HERO */
.hero{padding:64px 0 92px; position:relative; overflow:hidden;}
.blob{position:absolute; border-radius:50%; opacity:0.35; z-index:0; filter:blur(1px);}
.blob1{width:190px; height:190px; background:var(--sage); top:-40px; right:8%;}
.blob2{width:120px; height:120px; background:var(--teal); bottom:20px; left:2%; opacity:.3;}
.blob3{width:60px; height:60px; background:var(--rust); top:38%; right:2%; opacity:.4;}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; position:relative; z-index:1;}
.hero h1{font-size:clamp(30px,4.4vw,54px); line-height:1.12; font-weight:800; max-width:14ch;}
.hero p.lede{margin-top:20px; font-size:18.5px; max-width:48ch; color:#4A3F7A; font-weight:500;}
.hero-actions{display:flex; gap:16px; margin-top:32px; flex-wrap:wrap;}
.btn-primary{background:var(--amber); color:#fff; padding:15px 28px; border-radius:999px; font-weight:700; text-decoration:none; font-size:16px; display:inline-block; cursor:pointer; box-shadow:0 6px 0 var(--amber-deep); border:none; transition:transform .1s;}
.btn-primary:hover{transform:translateY(2px); box-shadow:0 4px 0 var(--amber-deep);}
.btn-primary:disabled{opacity:0.6; cursor:not-allowed; transform:none;}
.btn-ghost{padding:15px 26px; border:3px solid var(--navy); border-radius:999px; text-decoration:none; font-weight:700; font-size:16px; color:var(--navy); display:inline-block;}
.btn-ghost:hover{background:var(--navy); color:#fff;}

/* PATH CARD (hero visual) */
.path-card{background:var(--navy); color:#fff; border-radius:32px; padding:26px 26px 12px; position:relative; box-shadow:0 14px 0 rgba(61,46,140,0.18), 0 20px 30px rgba(61,46,140,0.15);}
.path-row{display:grid; grid-template-columns:56px 1fr; gap:14px; padding:15px 0; border-bottom:2px dashed rgba(255,255,255,0.18); align-items:flex-start;}
.path-row:last-child{border-bottom:none;}
.path-lvl{font-family:'Baloo 2',sans-serif; font-size:24px; font-weight:800; opacity:.85; padding-top:2px;}
.path-block{border-left:5px solid var(--amber); padding-left:14px; border-radius:2px;}
.path-row.l2 .path-block{border-left-color:var(--sage);}
.path-row.l3 .path-block{border-left-color:var(--rust);}
.path-row.l4 .path-block{border-left-color:var(--teal);}
.path-title{font-family:'Baloo 2',sans-serif; font-weight:700; font-size:17px;}
.path-sub{font-size:14px; opacity:.75; margin-top:2px; font-weight:500;}

section{padding:88px 0; position:relative;}
section.alt{background:var(--paper-2); border-radius:48px; margin:0 16px;}
section.tight{padding:56px 0;}
.section-head{max-width:62ch; margin-bottom:44px;}
.section-head h2{font-size:clamp(26px,3.1vw,38px); font-weight:800; line-height:1.18;}
.section-head p{margin-top:14px; font-size:17.5px; color:#4A3F7A;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.eyebrow{display:inline-block; font-size:13px; font-weight:800; color:var(--brand); background:rgba(30,58,138,0.09); padding:6px 16px; border-radius:999px; margin-bottom:14px; letter-spacing:0.4px; text-transform:uppercase;}

/* PILLARS */
.pillars{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
.pillar{padding:26px 20px; border-radius:22px; background:#fff; box-shadow:0 4px 0 var(--line);}
.pillar:nth-child(1){box-shadow:0 4px 0 var(--amber);}
.pillar:nth-child(2){box-shadow:0 4px 0 var(--sage);}
.pillar:nth-child(3){box-shadow:0 4px 0 var(--rust);}
.pillar:nth-child(4){box-shadow:0 4px 0 var(--teal);}
.pillar:nth-child(5){box-shadow:0 4px 0 var(--brand);}
.pillar .num{font-family:'Baloo 2',sans-serif; font-size:14px; color:#9B8FC9; margin-bottom:10px; font-weight:700;}
.pillar h3{font-size:16.5px; line-height:1.25; margin-bottom:8px; font-weight:700;}
.pillar p{font-size:14px; color:#4A3F7A;}

/* JOURNEY (levels detail) */
.journey{display:flex; flex-direction:column; gap:18px;}
.lvl-row{display:grid; grid-template-columns:150px 1fr; gap:30px; padding:30px; align-items:start; background:#fff; border-radius:26px; box-shadow:0 3px 14px rgba(43,35,80,0.06);}
.lvl-row.r1{border-left:8px solid var(--amber);}
.lvl-row.r2{border-left:8px solid var(--sage);}
.lvl-row.r3{border-left:8px solid var(--rust);}
.lvl-row.r4{border-left:8px solid var(--teal);}
.lvl-tag{font-family:'Baloo 2',sans-serif;}
.lvl-tag .n{font-size:13.5px; color:#9B8FC9; font-weight:700;}
.lvl-tag .name{font-size:22px; font-weight:800; margin-top:2px;}
.lvl-tag .grade{font-size:13.5px; color:#6B5F99; margin-top:4px; font-weight:600;}
.lvl-body p{color:#4A3F7A; margin-bottom:10px;}
.lvl-body .q{font-family:'Baloo 2',sans-serif; font-weight:700; font-size:16px; color:var(--navy);}
.lvl-body ul{margin-top:10px; padding-left:4px; font-size:15px; color:#4A3F7A; display:grid; grid-template-columns:1fr 1fr; gap:5px 20px;}
.lvl-body ul li{position:relative; padding-left:16px;}
.lvl-body ul li::before{content:"•"; position:absolute; left:0; color:var(--brand);}

/* teaser strip on home */
.lvl-teaser-strip{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.lvl-teaser{padding:22px; border-radius:22px; background:#fff; box-shadow:0 3px 14px rgba(43,35,80,0.06);}
.lvl-teaser.t1{border-top:6px solid var(--amber);}
.lvl-teaser.t2{border-top:6px solid var(--sage);}
.lvl-teaser.t3{border-top:6px solid var(--rust);}
.lvl-teaser.t4{border-top:6px solid var(--teal);}
.lvl-teaser .n{font-size:13px; color:#9B8FC9; font-weight:700; font-family:'Baloo 2',sans-serif;}
.lvl-teaser h3{font-size:18px; margin:4px 0 6px;}
.lvl-teaser p{font-size:14px; color:#4A3F7A;}

/* SESSION BREAKDOWN */
.session-bar{display:flex; width:100%; height:52px; border-radius:26px; overflow:hidden; margin-top:26px; box-shadow:0 4px 14px rgba(43,35,80,0.1);}
.seg{display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; color:#fff; font-family:'Baloo 2',sans-serif;}
.seg.s1{background:#9B8FC9; flex:10;}
.seg.s2{background:var(--sage); flex:20; color:var(--ink);}
.seg.s3{background:var(--teal); flex:30;}
.seg.s4{background:var(--amber); flex:60;}
.seg.s5{background:var(--rust); flex:30;}
.seg.s6{background:var(--brand); flex:15;}
.session-legend{display:grid; grid-template-columns:repeat(3,1fr); gap:12px 20px; margin-top:20px; font-size:14.5px; font-weight:600;}
.session-legend div{display:flex; gap:8px; align-items:baseline;}
.session-legend .sw{width:12px; height:12px; border-radius:50%; flex-shrink:0; margin-top:4px; display:inline-block;}

/* PLANS */
.plans{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.plan{border-radius:26px; padding:30px 26px; background:#fff; box-shadow:0 4px 16px rgba(43,35,80,0.07);}
.plan.featured{background:var(--navy); color:#fff; box-shadow:0 8px 0 rgba(61,46,140,0.25);}
.plan.featured .pname, .plan.featured .pdesc{color:#fff;}
.plan.featured ul{color:rgba(255,255,255,0.85);}
.plan .pname{font-family:'Baloo 2',sans-serif; font-weight:800; font-size:20px;}
.plan .pprice{font-family:'Baloo 2',sans-serif; font-weight:700; font-size:22px; color:var(--navy); margin-top:6px;}
.plan .pprice .per{font-family:'Quicksand',sans-serif; font-size:12.5px; font-weight:600; color:#6B5F99;}
.plan.featured .pprice{color:#fff;}
.plan.featured .pprice .per{color:rgba(255,255,255,0.75);}
.plan .pdesc{font-size:14.5px; color:#4A3F7A; margin-top:4px; margin-bottom:16px; font-weight:600;}
.plan ul{padding-left:4px; font-size:14.5px; color:#4A3F7A;}
.plan li{margin-bottom:8px; position:relative; padding-left:18px;}
.plan li::before{content:"✓"; position:absolute; left:0; font-weight:800; color:var(--amber-deep);}
.plan.featured li::before{color:var(--sage);}
.kit-note{margin-top:26px; padding:18px 22px; border-radius:20px; background:rgba(255,111,89,0.1); font-size:14.5px; font-weight:600;}
.kit-price-table{margin-top:18px; display:grid; gap:10px;}
.kpt-row{display:grid; grid-template-columns:1fr 1fr; padding:14px 20px; border-radius:16px; background:#fff; font-size:14.5px;}
.kpt-row .lvl{font-weight:700; color:var(--navy);}
.kpt-row .est{color:#6B5F99; font-weight:600;}

/* ROADMAP */
.roadmap{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.rmap-card{border:3px dashed rgba(43,35,80,0.22); border-radius:24px; padding:24px; background:rgba(255,255,255,0.5);}
.rmap-card h3{font-size:17px; margin-bottom:8px; font-weight:700;}
.rmap-card p{font-size:14px; color:#4A3F7A;}
.soon{display:inline-block; font-size:12px; color:var(--rust); font-weight:800; margin-bottom:10px; background:rgba(255,111,89,0.14); padding:4px 12px; border-radius:999px;}

/* ABOUT */
.about-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start;}
.about-grid blockquote{font-family:'Baloo 2',sans-serif; font-size:25px; font-weight:700; color:var(--navy); line-height:1.4; border-left:5px solid var(--amber); padding-left:22px;}
.about-grid p{color:#4A3F7A; margin-top:16px; font-size:16px;}
.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:8px;}
.value-card{background:#fff; border-radius:22px; padding:26px 22px; box-shadow:0 4px 0 var(--line);}
.value-card h3{font-size:17px; margin-bottom:8px;}
.value-card p{font-size:14.5px; color:#4A3F7A;}

/* FAQ */
.faq{display:flex; flex-direction:column; gap:14px; max-width:78ch;}
.faq-item{background:#fff; border-radius:20px; box-shadow:0 3px 10px rgba(43,35,80,0.06); overflow:hidden;}
.faq-item summary{cursor:pointer; padding:20px 24px; font-weight:700; font-family:'Baloo 2',sans-serif; font-size:16px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:10px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-size:22px; color:var(--brand); flex-shrink:0;}
.faq-item[open] summary::after{content:"–";}
.faq-item .faq-a{padding:0 24px 22px; color:#4A3F7A; font-size:15px;}

/* CTA BANNER */
.cta-banner{background:var(--navy); border-radius:40px; padding:52px 40px; color:#fff; text-align:center; margin:0 16px;}
.cta-banner h2{color:#fff; font-size:clamp(24px,3vw,32px); margin-bottom:14px;}
.cta-banner p{color:rgba(255,255,255,0.8); max-width:56ch; margin:0 auto 26px;}

/* CONTACT */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
form{display:flex; flex-direction:column; gap:16px;}
label{font-size:14px; font-weight:700; color:var(--navy); margin-bottom:5px; display:block;}
input, select, textarea{width:100%; padding:13px 16px; border:2px solid var(--line); border-radius:16px; background:#fff; font-family:'Quicksand',sans-serif; font-weight:600; font-size:15px; color:var(--ink);}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--amber);}
.checks{display:flex; flex-wrap:wrap; gap:10px;}
.check-pill{border:2px solid var(--line); padding:9px 16px; border-radius:999px; font-size:14px; font-weight:600; display:flex; align-items:center; gap:7px; cursor:pointer; background:#fff;}
.check-pill input{width:auto;}
.contact-info .row{display:flex; gap:14px; padding:18px 0; border-bottom:2px dashed var(--line);}
.contact-info .row:first-child{padding-top:0;}
.contact-info .label{font-size:13px; color:#6B5F99; min-width:90px; padding-top:2px; font-weight:700;}
.contact-info .val{font-weight:600;}
.placeholder-flag{color:var(--rust); font-size:12.5px; font-weight:700;}
.form-status{font-size:14.5px; font-weight:700; padding:12px 16px; border-radius:14px; display:none;}
.form-status.show{display:block;}
.form-status.ok{background:rgba(30,58,138,0.09); color:var(--navy);}
.form-status.err{background:rgba(255,107,107,0.14); color:#B23A3A;}

/* PAGE HEADER (used on inner pages) */
.page-hero{padding:56px 0 40px;}
.page-hero .eyebrow{margin-bottom:12px;}
.page-hero h1{font-size:clamp(28px,4vw,44px); max-width:20ch;}
.page-hero p{margin-top:16px; font-size:17.5px; color:#4A3F7A; max-width:60ch;}
.breadcrumb{font-size:13.5px; color:#6B5F99; font-weight:600; margin-bottom:18px;}
.breadcrumb a{color:var(--brand);}

footer{border-top:3px dashed var(--line); padding:36px 0; font-size:14px; color:#6B5F99; font-weight:600;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}
footer .foot-links{display:flex; gap:18px; flex-wrap:wrap;}
footer .foot-links a{text-decoration:none;}
footer .foot-links a:hover{color:var(--brand);}
footer .foot-contact{display:flex; gap:16px; flex-wrap:wrap; margin-top:8px; font-size:13px;}
footer .foot-contact a{text-decoration:none;}
footer .foot-contact a:hover{color:var(--brand);}

/* =========================================================
   RESPONSIVE — mobile-first breakpoints layered on top
   ========================================================= */

/* Large desktop tune-down */
@media (max-width:1200px){
  .wrap{padding:0 24px;}
}

/* Tablets / small laptops */
@media (max-width:1024px){
  .pillars{grid-template-columns:repeat(3,1fr);}
  .plans, .roadmap, .values-grid{grid-template-columns:repeat(2,1fr);}
  .lvl-teaser-strip{grid-template-columns:repeat(2,1fr);}
  .hero-grid{gap:36px;}
}

/* Nav collapses to burger menu */
@media (max-width:860px){
  .tagline{display:none;}
  .nav-links{
    display:none; position:absolute; top:80px; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--paper); border-bottom:3px solid rgba(43,35,80,0.08);
    padding:8px 28px 18px; box-shadow:0 12px 20px rgba(43,35,80,0.08);
  }
  .nav-links.open{display:flex;}
  .nav-links li{width:100%;}
  .nav-links a{display:block; padding:12px 0; opacity:0.85; width:100%;}
  .burger{display:flex;}
  .hero-grid, .about-grid, .contact-grid{grid-template-columns:1fr;}
  .pillars{grid-template-columns:1fr 1fr;}
  .plans, .roadmap, .values-grid{grid-template-columns:1fr;}
  .lvl-teaser-strip{grid-template-columns:1fr 1fr;}
  .lvl-row{grid-template-columns:1fr;}
  .lvl-body ul{grid-template-columns:1fr;}
  .session-legend{grid-template-columns:1fr 1fr;}
  section.alt{margin:0 8px; border-radius:32px;}
  .cta-banner{margin:0 8px; padding:40px 26px;}
  section{padding:64px 0;}
}

/* Phones (large) */
@media (max-width:640px){
  .wrap{padding:0 18px;}
  .hero{padding:40px 0 56px;}
  .hero h1{max-width:none;}
  .hero-actions{flex-direction:column; align-items:stretch;}
  .hero-actions a{text-align:center;}
  .pillars{grid-template-columns:1fr 1fr;}
  .lvl-teaser-strip{grid-template-columns:1fr;}
  .path-card{padding:20px 18px 8px;}
  .session-legend{grid-template-columns:1fr;}
  .kpt-row{grid-template-columns:1fr; gap:4px;}
  footer .wrap{flex-direction:column; align-items:flex-start;}
  .plan.featured{order:-1;}
  nav.wrap{height:70px;}
  .brand{font-size:20px;}
  .brand img{width:26px; height:26px;}
}

/* Small phones */
@media (max-width:420px){
  .wrap{padding:0 14px;}
  .pillars{grid-template-columns:1fr;}
  section{padding:48px 0;}
  section.alt{border-radius:24px; margin:0 6px;}
  .cta-banner{margin:0 6px; padding:32px 18px; border-radius:28px;}
  .btn-primary, .btn-ghost{padding:14px 20px; font-size:15px;}
  .about-grid blockquote{font-size:21px;}
  .lvl-row{padding:22px;}
}

/* Very large screens: cap content growth and give more breathing room */
@media (min-width:1440px){
  :root{--maxw:1240px;}
  .hero h1{font-size:56px;}
}