:root{
    --bg:#FAFAF7;
    --bg-2:#F2F1EB;
    --card:#FFFFFF;
    --teal:#0F766E;
    --teal-dark:#134E4A;
    --teal-light:#CCFBF1;
    --teal-soft:#E6F7F4;
    --accent:#F59E0B;
    --ink:#111827;
    --ink-2:#374151;
    --ink-3:#6B7280;
    --line:#E5E7EB;
    --line-2:#F3F4F6;
    --green:#10B981;
    --yellow:#FCD34D;
    --gray-bg:#F9FAFB;
  }

  *{margin:0; padding:0; box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Plus Jakarta Sans', sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.6;
    font-size:16px;
    -webkit-font-smoothing:antialiased;
  }

  .container{
    max-width:1200px;
    margin:0 auto;
    padding:0 24px;
  }

  /* ============ NAV ============ */
  nav{
    background:rgba(250,250,247,.85);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
    padding:16px 0;
    position:sticky;
    top:0;
    z-index:100;
  }
  .nav-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
  }
  .logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:700;
    font-size:20px;
    color:var(--ink);
    text-decoration:none;
    letter-spacing:-.02em;
  }
  .logo-icon{
    width:36px;
    height:36px;
    background:linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:18px;
    box-shadow:0 4px 12px rgba(15,118,110,.25);
  }
  .logo-text span{color:var(--teal);}
  .nav-links{
    display:flex;
    gap:32px;
    list-style:none;
    align-items:center;
  }
  .nav-links a{
    color:var(--ink-2);
    text-decoration:none;
    font-size:14px;
    font-weight:500;
    transition:color .2s;
  }
  .nav-links a:hover{color:var(--teal);}
  .nav-cta{
    background:var(--teal);
    color:#fff!important;
    padding:10px 20px;
    border-radius:10px;
    font-weight:600!important;
  }
  .nav-cta:hover{background:var(--teal-dark); color:#fff!important;}

  /* ============ HERO ============ */
  .hero{
    padding:60px 0 40px;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:'';
    position:absolute;
    top:-200px;
    right:-200px;
    width:600px;
    height:600px;
    background:radial-gradient(circle, var(--teal-soft) 0%, transparent 70%);
    z-index:0;
  }
  .hero-inner{
    position:relative;
    z-index:2;
    text-align:center;
  }
  .hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#fff;
    border:1px solid var(--line);
    padding:8px 16px;
    border-radius:100px;
    font-size:13px;
    font-weight:500;
    color:var(--ink-2);
    margin-bottom:24px;
    box-shadow:0 2px 8px rgba(0,0,0,.04);
  }
  .hero-badge .live-dot{
    width:8px;
    height:8px;
    background:var(--green);
    border-radius:50%;
    box-shadow:0 0 0 4px rgba(16,185,129,.2);
    animation:pulse 2s infinite;
  }
  @keyframes pulse{
    0%,100%{box-shadow:0 0 0 4px rgba(16,185,129,.2);}
    50%{box-shadow:0 0 0 8px rgba(16,185,129,.1);}
  }

  h1{
    font-family:'Lora', serif;
    font-weight:600;
    font-size:clamp(36px, 5vw, 60px);
    line-height:1.1;
    letter-spacing:-.02em;
    max-width:900px;
    margin:0 auto 20px;
    color:var(--ink);
  }
  h1 .italic{
    font-style:italic;
    color:var(--teal);
    font-weight:500;
  }
  .hero-sub{
    font-size:18px;
    color:var(--ink-2);
    max-width:680px;
    margin:0 auto 40px;
    line-height:1.6;
  }

  /* ============ TOOL CARD ============ */
  .tool-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:0 20px 60px rgba(15,118,110,.08), 0 4px 12px rgba(0,0,0,.04);
    overflow:hidden;
    max-width:980px;
    margin:0 auto;
  }

  .tool-steps{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
    padding:16px;
    background:var(--gray-bg);
    border-bottom:1px solid var(--line);
  }
  .tool-step{
    padding:12px 20px;
    border-radius:100px;
    font-size:13px;
    font-weight:600;
    color:var(--ink-3);
    text-align:center;
    background:transparent;
    border:1px solid transparent;
    transition:all .25s;
  }
  .tool-step.active{
    background:var(--teal-soft);
    color:var(--teal-dark);
    border-color:var(--teal-light);
  }

  .tool-body{
    padding:32px;
  }

  .tool-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr 1.3fr auto;
    gap:16px;
    align-items:end;
  }

  .tool-field label{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--ink-2);
    margin-bottom:8px;
    font-weight:700;
  }
  .tool-field input, .tool-field select{
    width:100%;
    padding:14px 16px;
    border:1.5px solid var(--line);
    border-radius:12px;
    font-family:inherit;
    font-size:15px;
    color:var(--ink);
    background:#fff;
    outline:none;
    transition:all .2s;
  }
  .tool-field input::placeholder{color:var(--ink-3);}
  .tool-field input:focus{
    border-color:var(--teal);
    box-shadow:0 0 0 4px var(--teal-soft);
  }

  .btn-check{
    background:var(--teal);
    color:#fff;
    border:none;
    padding:14px 28px;
    font-family:inherit;
    font-size:15px;
    font-weight:600;
    border-radius:12px;
    cursor:pointer;
    transition:all .2s;
    white-space:nowrap;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 4px 12px rgba(15,118,110,.25);
  }
  .btn-check:hover{
    background:var(--teal-dark);
    transform:translateY(-1px);
    box-shadow:0 6px 16px rgba(15,118,110,.3);
  }

  .trust-strip{
    display:flex;
    justify-content:center;
    gap:24px;
    flex-wrap:wrap;
    margin-top:24px;
    font-size:13px;
    color:var(--ink-2);
  }
  .trust-strip span{
    display:inline-flex;
    align-items:center;
    gap:6px;
  }
  .trust-strip .check{
    color:var(--green);
    font-weight:700;
  }

  /* ============ LIVE FEED ============ */
  .live-feed{
    max-width:980px;
    margin:32px auto 0;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:18px 24px;
    display:flex;
    align-items:center;
    gap:16px;
    overflow:hidden;
  }
  .live-feed-label{
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--teal);
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
  }
  .live-feed-label::before{
    content:'';
    width:6px;
    height:6px;
    background:var(--green);
    border-radius:50%;
    box-shadow:0 0 0 3px rgba(16,185,129,.2);
    animation:pulse 2s infinite;
  }
  .feed-items{
    flex:1;
    overflow:hidden;
    height:24px;
    position:relative;
  }
  .feed-item{
    position:absolute;
    width:100%;
    font-size:14px;
    color:var(--ink-2);
    opacity:0;
    transform:translateY(20px);
    transition:all .5s;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .feed-item.show{opacity:1; transform:translateY(0);}
  .feed-item strong{color:var(--ink); font-weight:600;}

  /* ============ STATS ============ */
  .stats{
    max-width:980px;
    margin:60px auto 0;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
  }
  .stat{
    text-align:center;
    padding:24px 16px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
  }
  .stat-num{
    font-family:'Lora', serif;
    font-size:36px;
    font-weight:700;
    color:var(--teal);
    line-height:1;
    margin-bottom:6px;
  }
  .stat-label{
    font-size:13px;
    color:var(--ink-3);
    font-weight:500;
  }

  /* ============ SECTION COMMON ============ */
  section{
    padding:80px 0;
    position:relative;
  }
  .section-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--teal-soft);
    color:var(--teal-dark);
    padding:6px 14px;
    border-radius:100px;
    font-size:12px;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:16px;
  }
  h2{
    font-family:'Lora', serif;
    font-weight:600;
    font-size:clamp(28px, 4vw, 44px);
    line-height:1.15;
    letter-spacing:-.02em;
    margin-bottom:16px;
    max-width:720px;
    color:var(--ink);
  }
  h2 .italic{font-style:italic; color:var(--teal); font-weight:500;}
  .section-sub{
    font-size:17px;
    color:var(--ink-2);
    max-width:640px;
    line-height:1.6;
    margin-bottom:48px;
  }
  .section-center{text-align:center;}
  .section-center h2, .section-center .section-sub{margin-left:auto; margin-right:auto;}

  /* ============ WHAT IS ============ */
  .what-is{
    background:#fff;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .what-is-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:center;
  }
  .what-is-text p{
    color:var(--ink-2);
    font-size:16px;
    margin-bottom:16px;
    line-height:1.7;
  }
  .what-is-text p:last-child{margin-bottom:0;}
  .what-is-text strong{color:var(--ink); font-weight:600;}

  .what-is-visual{
    background:var(--gray-bg);
    border:1px solid var(--line);
    border-radius:16px;
    padding:32px;
  }
  .what-is-visual h4{
    font-size:14px;
    font-weight:600;
    color:var(--ink-2);
    margin-bottom:16px;
    text-transform:uppercase;
    letter-spacing:.06em;
  }
  .timeline{position:relative; padding-left:24px;}
  .timeline::before{
    content:'';
    position:absolute;
    left:8px;
    top:8px;
    bottom:8px;
    width:2px;
    background:var(--line);
  }
  .timeline-item{
    position:relative;
    padding-bottom:20px;
  }
  .timeline-item:last-child{padding-bottom:0;}
  .timeline-item::before{
    content:'';
    position:absolute;
    left:-22px;
    top:6px;
    width:10px;
    height:10px;
    background:var(--teal);
    border:2px solid #fff;
    border-radius:50%;
    box-shadow:0 0 0 2px var(--teal);
  }
  .timeline-item strong{
    display:block;
    font-size:14px;
    color:var(--ink);
    font-weight:600;
    margin-bottom:4px;
  }
  .timeline-item span{
    font-size:13px;
    color:var(--ink-3);
  }

  /* ============ FEATURES ============ */
  .features-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  .feature-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:28px;
    transition:all .25s;
  }
  .feature-card:hover{
    border-color:var(--teal-light);
    box-shadow:0 8px 24px rgba(15,118,110,.08);
    transform:translateY(-2px);
  }
  .feature-icon{
    width:48px;
    height:48px;
    background:var(--teal-soft);
    color:var(--teal);
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:16px;
  }
  .feature-card h3{
    font-family:'Lora', serif;
    font-size:20px;
    font-weight:600;
    margin-bottom:8px;
    color:var(--ink);
  }
  .feature-card p{
    font-size:14px;
    color:var(--ink-2);
    line-height:1.6;
  }

  /* ============ HOW IT WORKS ============ */
  .how-it-works{background:var(--bg-2);}
  .steps-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    margin-top:16px;
  }
  .step-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:28px 24px;
    position:relative;
  }
  .step-num{
    display:inline-block;
    background:var(--teal);
    color:#fff;
    font-size:13px;
    font-weight:700;
    padding:4px 10px;
    border-radius:100px;
    margin-bottom:14px;
    letter-spacing:.04em;
  }
  .step-card h3{
    font-family:'Lora', serif;
    font-size:18px;
    font-weight:600;
    margin-bottom:8px;
    color:var(--ink);
  }
  .step-card p{
    font-size:14px;
    color:var(--ink-2);
    line-height:1.6;
  }

  /* ============ SAMPLE OUTPUT ============ */
  .sample-output{
    background:linear-gradient(135deg, #fff 0%, var(--teal-soft) 100%);
  }
  .sample-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 20px 50px rgba(15,118,110,.1);
    margin-top:24px;
  }
  .sample-header{
    background:var(--teal-dark);
    color:#fff;
    padding:16px 24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:14px;
  }
  .sample-header strong{font-weight:600;}
  .sample-header .pill{
    background:rgba(255,255,255,.15);
    padding:4px 12px;
    border-radius:100px;
    font-size:12px;
  }
  .sample-info{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-bottom:1px solid var(--line);
  }
  .sample-info-cell{
    padding:16px 20px;
    border-right:1px solid var(--line);
  }
  .sample-info-cell:last-child{border-right:none;}
  .sample-info-cell label{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--ink-3);
    margin-bottom:4px;
    font-weight:600;
  }
  .sample-info-cell .val{
    font-size:14px;
    font-weight:600;
    color:var(--ink);
  }

  .sample-classes{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    padding:20px;
    gap:12px;
    background:var(--gray-bg);
    border-bottom:1px solid var(--line);
  }
  .class-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    padding:16px 14px;
    text-align:center;
  }
  .class-card.has-vacant{
    border-color:var(--teal-light);
    background:var(--teal-soft);
  }
  .class-card h5{
    font-size:12px;
    color:var(--ink-3);
    margin-bottom:6px;
    font-weight:600;
  }
  .class-card .num{
    font-family:'Lora', serif;
    font-size:28px;
    font-weight:700;
    color:var(--teal);
    line-height:1;
    margin-bottom:4px;
  }
  .class-card .label{
    font-size:11px;
    color:var(--ink-3);
  }

  .berth-map{
    padding:24px;
  }
  .berth-map h4{
    font-size:14px;
    font-weight:600;
    margin-bottom:14px;
    color:var(--ink);
  }
  .coach-row{
    display:flex;
    gap:6px;
    overflow-x:auto;
    margin-bottom:16px;
    padding-bottom:8px;
  }
  .coach{
    flex:0 0 auto;
    background:var(--teal);
    color:#fff;
    padding:10px 14px;
    border-radius:8px;
    font-size:12px;
    font-weight:600;
    text-align:center;
    min-width:54px;
  }
  .coach.engine{background:var(--accent);}
  .coach.selected{background:var(--teal-dark); box-shadow:0 0 0 2px var(--teal-light);}
  .coach small{display:block; font-size:10px; opacity:.85; font-weight:500;}

  .berth-grid{
    display:grid;
    grid-template-columns:repeat(8, 1fr);
    gap:6px;
    margin-top:12px;
  }
  .berth{
    padding:8px 4px;
    border-radius:6px;
    font-size:11px;
    text-align:center;
    font-weight:600;
  }
  .berth.occupied{background:var(--line-2); color:var(--ink-3);}
  .berth.partial{background:var(--yellow); color:#78350F;}
  .berth.vacant{background:var(--green); color:#fff;}

  .berth-legend{
    display:flex;
    gap:20px;
    margin-top:16px;
    font-size:12px;
    color:var(--ink-2);
    flex-wrap:wrap;
  }
  .berth-legend span{display:inline-flex; align-items:center; gap:6px;}
  .berth-legend .dot{width:12px; height:12px; border-radius:3px;}

  /* ============ COMPARISON ============ */
  .comparison{background:#fff;}
  .compare-table{
    background:var(--gray-bg);
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
  }
  .compare-header{
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr;
    background:var(--ink);
    color:#fff;
  }
  .compare-header div{
    padding:18px 20px;
    font-weight:600;
    font-size:14px;
  }
  .compare-header div:nth-child(3){
    background:var(--teal);
  }
  .compare-row{
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr;
    border-top:1px solid var(--line);
    background:#fff;
  }
  .compare-row > div{
    padding:16px 20px;
    font-size:14px;
    border-right:1px solid var(--line);
  }
  .compare-row > div:last-child{border-right:none;}
  .compare-row .feature{font-weight:500; color:var(--ink);}
  .compare-row .old{color:var(--ink-3);}
  .compare-row .old::before{
    content:'\00d7';
    color:#DC2626;
    margin-right:8px;
    font-weight:700;
  }
  .compare-row .new{color:var(--ink-2); background:var(--teal-soft);}
  .compare-row .new::before{
    content:'\2713';
    color:var(--teal);
    margin-right:8px;
    font-weight:700;
  }

  /* ============ GAP SEATS ============ */
  .gap-seats-section{
    background:var(--ink);
    color:#fff;
  }
  .gap-seats-section h2{color:#fff;}
  .gap-seats-section h2 .italic{color:var(--accent);}
  .gap-seats-section .section-sub{color:rgba(255,255,255,.7);}
  .gap-seats-section .section-tag{
    background:rgba(245,158,11,.15);
    color:var(--accent);
  }

  .route-visual{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.1);
    border-radius:16px;
    padding:32px;
    margin-top:24px;
  }
  .route-stations{
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    padding:0 30px;
    margin-bottom:32px;
  }
  .route-stations::before{
    content:'';
    position:absolute;
    top:50%;
    left:60px;
    right:60px;
    height:2px;
    background:repeating-linear-gradient(to right, var(--accent) 0 8px, transparent 8px 14px);
    transform:translateY(-50%);
  }
  .route-station{
    background:#1F2937;
    border:2px solid var(--accent);
    width:80px;
    height:80px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    z-index:2;
    position:relative;
    font-size:11px;
    font-weight:600;
  }
  .route-station small{
    font-size:10px;
    opacity:.7;
    font-weight:400;
    margin-top:2px;
  }
  .gap-example-table{
    margin-top:32px;
    background:rgba(255,255,255,.03);
    border-radius:12px;
    overflow:hidden;
  }
  .gap-example-row{
    display:grid;
    grid-template-columns:1fr 1fr 1.2fr 2fr;
    padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-size:14px;
  }
  .gap-example-row:last-child{border-bottom:none;}
  .gap-example-row.header{
    background:rgba(255,255,255,.06);
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:600;
    color:rgba(255,255,255,.7);
  }
  .gap-example-row .vacant-tag{
    color:var(--accent);
    font-weight:600;
  }

  .gap-tip{
    margin-top:24px;
    padding:20px;
    background:rgba(245,158,11,.1);
    border-left:3px solid var(--accent);
    border-radius:8px;
    font-size:14px;
    line-height:1.6;
    color:rgba(255,255,255,.85);
  }
  .gap-tip strong{color:var(--accent);}

  /* ============ WHO USES ============ */
  .who-uses-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
  }
  .user-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:24px;
  }
  .user-emoji{
    font-size:32px;
    margin-bottom:12px;
  }
  .user-card h3{
    font-family:'Lora', serif;
    font-size:18px;
    font-weight:600;
    margin-bottom:8px;
  }
  .user-card p{
    font-size:14px;
    color:var(--ink-2);
    line-height:1.6;
  }

  /* ============ TRANSPARENCY ============ */
  .transparency{background:var(--bg-2);}
  .transparency-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
  }
  .trans-card{
    background:#fff;
    border-radius:14px;
    padding:32px;
    border:1px solid var(--line);
  }
  .trans-card h4{
    font-family:'Lora', serif;
    font-size:20px;
    font-weight:600;
    margin-bottom:20px;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .trans-card.do h4{color:var(--teal);}
  .trans-card.dont h4{color:#DC2626;}
  .trans-list{list-style:none;}
  .trans-list li{
    padding:10px 0;
    font-size:14px;
    color:var(--ink-2);
    display:flex;
    align-items:flex-start;
    gap:10px;
    line-height:1.5;
    border-bottom:1px solid var(--line-2);
  }
  .trans-list li:last-child{border-bottom:none;}
  .trans-list li::before{
    flex-shrink:0;
    font-weight:700;
    font-size:14px;
    margin-top:1px;
  }
  .trans-card.do .trans-list li::before{content:'\2713'; color:var(--teal);}
  .trans-card.dont .trans-list li::before{content:'\00d7'; color:#DC2626;}

  /* ============ TESTIMONIALS ============ */
  .testimonials-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
  }
  .testimonial{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:28px;
  }
  .testimonial-stars{
    color:var(--accent);
    font-size:16px;
    margin-bottom:12px;
  }
  .testimonial-quote{
    font-family:'Lora', serif;
    font-size:17px;
    font-weight:500;
    color:var(--ink);
    line-height:1.5;
    margin-bottom:16px;
    font-style:italic;
  }
  .testimonial-author{
    display:flex;
    align-items:center;
    gap:12px;
    padding-top:16px;
    border-top:1px solid var(--line-2);
  }
  .testimonial-avatar{
    width:44px;
    height:44px;
    background:linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    font-size:16px;
  }
  .testimonial-author-info{
    display:flex;
    flex-direction:column;
  }
  .testimonial-author-info strong{
    font-size:14px;
    color:var(--ink);
    font-weight:600;
  }
  .testimonial-author-info small{
    font-size:12px;
    color:var(--ink-3);
  }

  /* ============ FAQ ============ */
  .faq-section{background:#fff;}
  .faq-list{max-width:840px; margin:0 auto;}
  details{
    background:var(--gray-bg);
    border:1px solid var(--line);
    border-radius:12px;
    padding:20px 24px;
    margin-bottom:12px;
    cursor:pointer;
    transition:all .2s;
  }
  details[open]{
    background:#fff;
    border-color:var(--teal-light);
    box-shadow:0 4px 12px rgba(15,118,110,.06);
  }
  details summary{
    list-style:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-weight:600;
    font-size:16px;
    color:var(--ink);
    gap:16px;
  }
  details summary::-webkit-details-marker{display:none;}
  details summary::after{
    content:'+';
    font-size:24px;
    font-weight:300;
    color:var(--teal);
    flex-shrink:0;
    transition:transform .25s;
  }
  details[open] summary::after{transform:rotate(45deg);}
  details p{
    margin-top:14px;
    font-size:14.5px;
    color:var(--ink-2);
    line-height:1.7;
  }

  /* ============ CTA SECTION ============ */
  .cta-section{
    background:linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
    color:#fff;
    text-align:center;
    position:relative;
    overflow:hidden;
  }
  .cta-section::before, .cta-section::after{
    content:'';
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.05);
  }
  .cta-section::before{
    width:400px; height:400px;
    top:-150px; left:-150px;
  }
  .cta-section::after{
    width:300px; height:300px;
    bottom:-100px; right:-100px;
  }
  .cta-section h2{color:#fff; position:relative; z-index:2;}
  .cta-section h2 .italic{color:var(--accent);}
  .cta-section .section-sub{color:rgba(255,255,255,.85); position:relative; z-index:2;}
  .btn-cta{
    background:#fff;
    color:var(--teal-dark);
    padding:16px 36px;
    border-radius:12px;
    font-weight:600;
    text-decoration:none;
    font-size:16px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    transition:all .25s;
    position:relative;
    z-index:2;
    box-shadow:0 8px 24px rgba(0,0,0,.15);
  }
  .btn-cta:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 32px rgba(0,0,0,.2);
  }

  /* ============ FOOTER ============ */
  footer{
    background:var(--ink);
    color:rgba(255,255,255,.7);
    padding:60px 0 24px;
  }
  .footer-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:48px;
    margin-bottom:40px;
  }
  .footer-brand{min-width:220px;}
  .footer-brand .logo{color:#fff;}
  .footer-brand p{
    font-size:14px;
    margin-top:12px;
    max-width:320px;
    line-height:1.6;
  }
  footer h5{
    color:#fff;
    font-size:14px;
    font-weight:600;
    margin-bottom:16px;
  }
  footer a{
    display:block;
    color:rgba(255,255,255,.6);
    text-decoration:none;
    font-size:13px;
    padding:6px 0;
    transition:color .2s;
  }
  footer a:hover{color:#fff;}
  .footer-links{
    list-style:none;
    margin:0;
    padding:0;
  }
  .footer-links li{
    margin:0;
    padding:0;
  }

  .footer-disclaimer{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px;
    padding:16px 20px;
    font-size:12px;
    line-height:1.6;
    margin-bottom:24px;
    color:rgba(255,255,255,.55);
  }
  .footer-disclaimer strong{color:rgba(255,255,255,.8);}

  .footer-bottom{
    padding-top:24px;
    border-top:1px solid rgba(255,255,255,.08);
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:12px;
    flex-wrap:wrap;
    gap:12px;
  }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 900px){
    .nav-links li:not(:last-child){display:none;}
    .tool-grid{grid-template-columns:1fr 1fr; gap:14px;}
    .tool-grid .btn-check{grid-column:1 / -1;}
    .stats{grid-template-columns:repeat(2,1fr);}
    section{padding:60px 0;}
    .what-is-grid{grid-template-columns:1fr; gap:32px;}
    .features-grid{grid-template-columns:1fr;}
    .steps-grid{grid-template-columns:1fr 1fr;}
    .sample-info{grid-template-columns:1fr 1fr;}
    .sample-classes{grid-template-columns:repeat(2,1fr);}
    .berth-grid{grid-template-columns:repeat(4,1fr);}
    .compare-header, .compare-row{grid-template-columns:1fr;}
    .compare-row > div{border-right:none; border-bottom:1px solid var(--line);}
    .who-uses-grid{grid-template-columns:1fr;}
    .transparency-grid{grid-template-columns:1fr;}
    .testimonials-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .route-station{width:64px; height:64px; font-size:10px;}
    .gap-example-row{grid-template-columns:1fr 1fr; font-size:12px;}
  }
  @media (max-width: 560px){
    .container{padding:0 16px;}
    .tool-grid{grid-template-columns:1fr;}
    .tool-steps{grid-template-columns:1fr;}
    .stats{grid-template-columns:1fr 1fr;}
    .sample-info{grid-template-columns:1fr;}
    .sample-classes{grid-template-columns:1fr 1fr;}
    .footer-grid{grid-template-columns:1fr;}
    .footer-bottom{flex-direction:column; text-align:center;}
    h1{font-size:32px;}
    h2{font-size:26px;}
  }

  /* Scroll reveal */
  .reveal{opacity:0; transform:translateY(20px); transition:opacity .7s, transform .7s;}
  .reveal.visible{opacity:1; transform:translateY(0);}

  /* Gutenberg block compatibility */
  html{
    scroll-padding-top:110px;
  }
  body.admin-bar nav{
    top:32px;
  }
  body.admin-bar .hero,
  body.admin-bar section[id]{
    scroll-margin-top:120px;
  }
  @media (max-width:782px){
    body.admin-bar nav{top:46px;}
  }
  .wp-site-blocks,
  .entry-content,
  .content-area,
  .site-main{
    overflow:visible;
  }
  .cv-main > .wp-block-group:first-child,
  .entry-content > .wp-block-group:first-child{
    margin-top:0;
  }
  .hero-badge p,
  .tool-step,
  .trust-strip p,
  .live-feed p,
  .stats p,
  .sample-header p,
  .class-card p,
  .cta-section p{
    margin:0;
  }
  .sample-header,
  .sample-header p,
  .sample-header strong,
  .sample-header .pill{
    color:#fff!important;
  }
  .sample-info-cell p{
    margin:0;
  }
  .sample-info-cell label,
  .sample-info-cell .val{
    display:block;
  }
  .sample-info-cell label{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--ink-3);
    margin-bottom:4px;
    font-weight:600;
  }
  .sample-info-cell .val{
    color:var(--ink);
    font-size:14px;
    font-weight:600;
  }
  .wp-block-columns{
    margin-bottom:0;
  }
  .wp-block-column{
    min-width:0;
  }
  .hero .wp-block-columns,
  .what-is .wp-block-columns,
  .how-it-works .wp-block-columns,
  .sample-output .wp-block-columns,
  .gap-seats-section .wp-block-columns,
  .transparency .wp-block-columns{
    gap:inherit;
  }
  .features-grid,
  .steps-grid,
  .who-uses-grid,
  .testimonials-grid,
  .transparency-grid,
  .sample-classes,
  .sample-info{
    align-items:stretch!important;
  }
  .compare-table table,
  .gap-example-table table{
    width:100%;
    border-collapse:collapse;
  }
  .compare-table th,
  .compare-table td{
    padding:16px 20px;
    border:1px solid var(--line);
    text-align:left;
    font-size:14px;
  }
  .compare-table th{
    background:var(--ink);
    color:#fff;
  }
  .compare-table th:last-child,
  .compare-table td:last-child{
    background:var(--teal-soft);
    color:var(--teal-dark);
    font-weight:600;
  }
  .compare-table tbody td:nth-child(2)::before{
    content:'×';
    color:#dc2626;
    margin-right:8px;
    font-weight:800;
  }
  .compare-table tbody td:nth-child(3)::before{
    content:'\2713';
    color:var(--teal);
    margin-right:8px;
    font-weight:800;
  }
  .coach-map-title{
    margin:24px 24px 14px!important;
    font-family:'Plus Jakarta Sans', sans-serif!important;
    font-size:16px!important;
    font-weight:800!important;
  }
  .coach-row{
    display:flex!important;
    gap:8px!important;
    overflow-x:auto;
    padding:0 24px 8px!important;
    margin:0 0 14px!important;
  }
  .coach-row .coach{
    flex:0 0 auto;
    min-width:58px;
    padding:10px 12px;
    border-radius:8px;
    background:var(--teal);
    color:#fff!important;
    text-align:center;
    font-size:12px;
    font-weight:800;
    line-height:1.2;
  }
  .coach-row .engine{
    background:var(--accent)!important;
  }
  .coach-row .selected{
    background:var(--teal-dark)!important;
    box-shadow:0 0 0 2px var(--teal-light);
  }
  .coach-row small{
    color:rgba(255,255,255,.85);
    font-weight:600;
  }
  .berth-grid{
    display:grid!important;
    grid-template-columns:repeat(8,1fr);
    gap:7px;
    padding:0 24px!important;
    margin:0!important;
  }
  .berth-grid .berth{
    margin:0!important;
    min-height:38px;
    display:grid;
    place-items:center;
    border-radius:7px;
    font-size:12px;
    font-weight:800;
  }
  .berth-grid .occupied{
    background:#f3f4f6;
    color:var(--ink-3);
  }
  .berth-grid .partial{
    background:var(--yellow);
    color:#78350f;
  }
  .berth-grid .vacant{
    background:var(--green);
    color:#fff;
  }
  .berth-legend{
    display:flex!important;
    gap:18px!important;
    padding:16px 24px 24px!important;
    margin:0!important;
    color:var(--ink-2);
    font-size:12px;
  }
  .berth-legend p{
    margin:0!important;
  }
  .berth-legend .dot{
    display:inline-block;
    width:13px;
    height:13px;
    margin-right:6px;
    border-radius:3px;
    vertical-align:-2px;
  }
  .occupied-dot{background:#f3f4f6;}
  .partial-dot{background:var(--yellow);}
  .vacant-dot{background:var(--green);}
  .gap-example-table th,
  .gap-example-table td{
    padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,.08);
    text-align:left;
  }
  .gap-example-table th{
    color:rgba(255,255,255,.7);
    background:rgba(255,255,255,.06);
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
  }
  .gap-example-table td:last-child{
    color:var(--accent);
    font-weight:600;
  }
  .gap-seats-section,
  .gap-seats-section p,
  .gap-seats-section h2,
  .gap-seats-section h3,
  .gap-seats-section h4,
  .gap-seats-section li{
    color:#fff;
  }
  .gap-seats-section .italic,
  .gap-seats-section .gap-tip strong{
    color:var(--accent)!important;
  }
  .gap-tip,
  .gap-tip p{
    color:rgba(255,255,255,.85)!important;
  }
  .route-station p{
    margin:0;
    color:#fff!important;
    font-size:11px;
    line-height:1.25;
  }
  .route-station small{
    display:block;
    color:rgba(255,255,255,.7);
  }
  .faq-section .wp-block-details{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    margin:0 auto 12px;
    max-width:840px;
    padding:0;
  }
  .faq-section .wp-block-details summary{
    padding:20px 24px;
    cursor:pointer;
    font-weight:600;
    color:var(--ink);
    list-style:none;
  }
  .faq-section .wp-block-details p{
    padding:0 24px 20px;
    margin:0;
    color:var(--ink-2);
  }
  .cta-section .wp-block-buttons{
    display:flex;
    justify-content:center;
    position:relative;
    z-index:2;
  }
  .cta-section .wp-block-button.btn-cta{
    display:inline-flex;
    background:transparent;
  }
  .cta-section .wp-block-button.btn-cta .wp-block-button__link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:54px;
    padding:0 28px;
    border-radius:12px;
    background:#fff!important;
    color:var(--teal-dark)!important;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
    box-shadow:0 8px 24px rgba(0,0,0,.18);
  }
  .cta-section .wp-block-button.btn-cta .wp-block-button__link:hover{
    transform:translateY(-2px);
  }
  .cta-section .section-center{
    position:relative;
    z-index:2;
    max-width:760px;
    margin:0 auto;
  }
  .cta-section .section-sub{
    color:rgba(255,255,255,.85)!important;
  }