:root{
  --glass-white:rgba(255,255,255,0.36);
  --glass-strong:rgba(255,255,255,0.56);
  --glass-line:rgba(255,255,255,0.62);
  --glass-shadow:0 24px 70px rgba(92,58,30,0.12);
  --glass-blur:blur(24px) saturate(165%);
  --glass-blur-soft:blur(18px) saturate(145%);
  --ink-strong:#4b2c12;
  --ink-soft:#7c6755;
  --accent-coral:#ff6b8a;
  --accent-caramel:#cf8a42;
}

body.liquid-glass{
  background:
    radial-gradient(circle at 12% 18%, rgba(168,215,255,0.26) 0%, transparent 20%),
    radial-gradient(circle at 86% 12%, rgba(255,170,193,0.28) 0%, transparent 24%),
    radial-gradient(circle at 52% 42%, rgba(255,255,255,0.5) 0%, transparent 34%),
    linear-gradient(180deg, #fffaf4 0%, #fff3e7 44%, #fff1f5 100%);
  color:var(--ink-strong);
}

body.liquid-glass::before,
body.liquid-glass::after{
  content:"";
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:0;
  border-radius:999px;
  filter:blur(10px);
}

body.liquid-glass::before{
  top:14vh;
  left:-8vw;
  width:28vw;
  height:28vw;
  background:radial-gradient(circle, rgba(185,225,255,0.42) 0%, rgba(185,225,255,0) 72%);
}

body.liquid-glass::after{
  right:-10vw;
  bottom:8vh;
  width:30vw;
  height:30vw;
  background:radial-gradient(circle, rgba(255,182,199,0.34) 0%, rgba(255,182,199,0) 76%);
}

body.liquid-glass > *{
  position:relative;
  z-index:1;
}

body.liquid-glass nav{
  top:16px;
  left:16px;
  right:16px;
  width:auto;
  max-width:none;
  padding:14px 22px;
  border:1px solid rgba(255,255,255,0.62);
  border-bottom-color:rgba(255,255,255,0.48);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.2) 100%);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  box-shadow:0 18px 42px rgba(92,58,30,0.1);
}

body.guide-page nav{
  margin:16px 16px 0;
}

body.home-page nav{
  margin:0;
}

body.liquid-glass.is-scrolled nav{
  background:linear-gradient(180deg, rgba(255,255,255,0.62) 0%, rgba(255,255,255,0.28) 100%);
  box-shadow:0 22px 50px rgba(92,58,30,0.14);
}

body.liquid-glass .nav-logo,
body.liquid-glass .footer-logo{
  letter-spacing:-0.03em;
}

body.liquid-glass .nav-links a{
  position:relative;
}

body.liquid-glass .nav-links a:not(.btn-nav)::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-6px;
  height:2px;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .24s ease;
  background:linear-gradient(90deg, rgba(255,107,138,0), rgba(255,107,138,0.7), rgba(255,107,138,0));
}

body.liquid-glass .nav-links a:not(.btn-nav):hover::after{
  transform:scaleX(1);
}

body.liquid-glass .btn-nav,
body.liquid-glass .btn-primary,
body.liquid-glass .btn-white{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.34);
}

body.liquid-glass .btn-nav::before,
body.liquid-glass .btn-primary::before,
body.liquid-glass .btn-white::before{
  content:"";
  position:absolute;
  inset:1px 1px auto 1px;
  height:48%;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,0.48), rgba(255,255,255,0));
  pointer-events:none;
}

body.liquid-glass .btn-secondary{
  background:rgba(255,255,255,0.4);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
  border:1px solid rgba(255,255,255,0.72);
  box-shadow:0 14px 34px rgba(92,58,30,0.08);
}

body.liquid-glass .btn-secondary:hover{
  background:rgba(255,255,255,0.56);
  color:var(--brown);
}

body.home-page .hero{
  min-height:100svh;
  padding:144px 48px 88px;
  background:
    radial-gradient(circle at 18% 22%, rgba(177,220,255,0.26) 0%, transparent 18%),
    radial-gradient(circle at 77% 16%, rgba(255,193,208,0.32) 0%, transparent 22%),
    linear-gradient(160deg, #fffaf4 0%, #fff2e6 48%, #ffeff4 100%);
}

body.home-page .hero::before{
  content:"";
  position:absolute;
  inset:76px auto auto 52%;
  width:520px;
  height:520px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.12) 42%, rgba(255,255,255,0) 72%);
  filter:blur(6px);
  pointer-events:none;
}

body.home-page .hero::after{
  background:linear-gradient(180deg, rgba(255,255,255,0.88) 0%, rgba(255,255,255,0.56) 100%);
  height:92px;
}

body.home-page .hero-inner{
  max-width:1240px;
  gap:58px;
  align-items:center;
}

body.home-page .hero-text .tag{
  background:rgba(255,255,255,0.44);
  border:1px solid rgba(255,255,255,0.78);
  box-shadow:0 12px 26px rgba(92,58,30,0.06);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.home-page .hero-text h1{
  max-width:760px;
  letter-spacing:-0.045em;
  text-wrap:balance;
}

body.home-page .hero-text p{
  max-width:560px;
  font-size:1.08rem;
  color:#6d5a4a;
}

body.home-page .hero-stats{
  gap:14px;
}

body.home-page .hero-stats .stat{
  min-width:0;
  padding:14px 16px;
  border-radius:22px;
  background:rgba(255,255,255,0.34);
  border:1px solid rgba(255,255,255,0.68);
  box-shadow:0 16px 30px rgba(92,58,30,0.05);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.home-page .hero-mascot-wrap{
  min-height:530px;
}

body.home-page .hero-mascot-wrap::before{
  content:"";
  position:absolute;
  inset:36px 38px 22px 38px;
  border-radius:42px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.46) 0%, rgba(255,255,255,0.12) 100%);
  border:1px solid rgba(255,255,255,0.72);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  box-shadow:var(--glass-shadow);
}

body.home-page .hero-mascot-wrap::after{
  content:"";
  position:absolute;
  inset:12% 16% auto auto;
  width:164px;
  height:164px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,0.76) 0%, rgba(255,255,255,0) 72%);
  pointer-events:none;
}

body.home-page .hero-video-card{
  width:min(100%, 440px);
  padding:22px;
  border-radius:42px;
  background:transparent;
  border:none;
  box-shadow:none;
}

body.home-page .hero-video-card::before{
  content:"";
  position:absolute;
  inset:6px 18px auto 18px;
  height:72px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,0.52), rgba(255,255,255,0));
  opacity:0.8;
  pointer-events:none;
}

body.home-page .hero-video-badge{
  top:0;
  left:50%;
  transform:translate(-50%, -50%);
  background:rgba(76,48,23,0.78);
  border:1px solid rgba(255,255,255,0.2);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.home-page .hero-video{
  border-radius:30px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.52),
    0 20px 40px rgba(92,58,30,0.12);
}

body.home-page .hero-video-note{
  margin-top:18px;
  color:#5f4430;
  letter-spacing:0.01em;
}

body.home-page .sweet-deco{
  opacity:0.58;
  filter:drop-shadow(0 12px 18px rgba(255,255,255,0.54));
}

body.liquid-glass .state-picker{
  background:rgba(255,255,255,0.52);
  border:1px solid rgba(255,255,255,0.84);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.liquid-glass .trust{
  background:rgba(255,255,255,0.28);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
  border-top:1px solid rgba(255,255,255,0.75);
  border-bottom:1px solid rgba(255,255,255,0.75);
}

body.liquid-glass section.padded,
body.liquid-glass .section{
  position:relative;
}

body.liquid-glass .section-title,
body.liquid-glass .section-head h2,
body.liquid-glass .content-head h2{
  letter-spacing:-0.04em;
  text-wrap:balance;
}

body.liquid-glass .section-tag,
body.liquid-glass .card-badge,
body.liquid-glass .compare-badge,
body.liquid-glass .ctag,
body.liquid-glass .eyebrow{
  background:rgba(255,255,255,0.4);
  border:1px solid rgba(255,255,255,0.72);
  box-shadow:0 8px 20px rgba(92,58,30,0.05);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.liquid-glass .cta-shell .section-tag{
  background:#7B4A23 !important;
  color:#FFF8F0 !important;
  border:1px solid rgba(255,248,240,0.72) !important;
  box-shadow:0 10px 22px rgba(92,58,30,0.22) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

body.home-page .how,
body.liquid-glass .section.soft,
body.liquid-glass .compare,
body.liquid-glass .testimonials{
  background:transparent;
}

body.home-page .steps-list{
  gap:24px;
  padding-left:14px;
  border-left:1px solid rgba(255,255,255,0.72);
}

body.home-page .step-row{
  gap:18px;
}

body.home-page .step-bubble{
  min-width:48px;
  height:48px;
  background:rgba(255,255,255,0.44);
  border:1px solid rgba(255,255,255,0.78);
  color:var(--accent-coral);
  box-shadow:0 12px 26px rgba(92,58,30,0.06);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
}

body.home-page .how-mascot-wrap,
body.home-page .meet-img-wrap,
body.liquid-glass .hero-panel,
body.liquid-glass .media-card,
body.liquid-glass .card,
body.liquid-glass .source-box,
body.liquid-glass .updated-note,
body.home-page .course-card,
body.home-page .compare-card,
body.home-page .t-card,
body.home-page .cta-inner,
body.liquid-glass .cta-shell,
body.liquid-glass .quick-link,
body.liquid-glass .compare-note-top{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.22) 100%);
  border:1px solid rgba(255,255,255,0.78);
  box-shadow:var(--glass-shadow);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
}

body.liquid-glass .hero-panel::before,
body.liquid-glass .media-card::before,
body.liquid-glass .card::before,
body.liquid-glass .source-box::before,
body.home-page .course-card::before,
body.home-page .compare-card::before,
body.home-page .t-card::before,
body.home-page .cta-inner::before,
body.liquid-glass .cta-shell::before{
  content:"";
  position:absolute;
  inset:1px 1px auto 1px;
  height:42%;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,0.44), rgba(255,255,255,0));
  pointer-events:none;
}

body.home-page .courses-grid,
body.home-page .compare-grid,
body.home-page .t-grid,
body.liquid-glass .path-grid,
body.liquid-glass .detail-grid,
body.liquid-glass .official-grid,
body.liquid-glass .faq-grid,
body.liquid-glass .state-grid{
  gap:24px;
}

body.home-page .course-card,
body.home-page .compare-card,
body.home-page .t-card,
body.liquid-glass .card,
body.liquid-glass .source-box{
  overflow:hidden;
}

body.home-page .course-card:hover,
body.home-page .compare-card:hover,
body.home-page .t-card:hover,
body.liquid-glass .card:hover,
body.liquid-glass .quick-link:hover,
body.liquid-glass .source-list a:hover{
  transform:translateY(-6px);
}

body.home-page .course-card{
  border-color:rgba(255,255,255,0.76);
}

body.home-page .course-card.featured,
body.home-page .compare-card.featured{
  border-color:rgba(255,255,255,0.92);
  box-shadow:0 30px 80px rgba(255,107,138,0.12);
}

body.home-page .course-thumb{
  height:210px;
}

body.home-page .course-thumb-overlay{
  background:linear-gradient(to bottom, rgba(255,255,255,0) 22%, rgba(81,49,22,0.52) 100%);
}

body.home-page .course-body,
body.home-page .compare-card,
body.home-page .t-card,
body.liquid-glass .card,
body.liquid-glass .source-box{
  color:var(--ink-strong);
}

body.home-page .course-body p,
body.home-page .compare-list li,
body.home-page .t-text,
body.liquid-glass .card p,
body.liquid-glass .source-box p,
body.liquid-glass .updated-note,
body.liquid-glass .hero-copy p,
body.liquid-glass .quick-link span{
  color:var(--ink-soft);
}

body.home-page .course-foot{
  border-top:1px solid rgba(255,255,255,0.78);
}

body.home-page .meet{
  background:transparent;
}

body.home-page .meet-inner{
  gap:64px;
}

body.home-page .meet-img-wrap{
  min-height:420px;
}

body.home-page .cta-banner{
  background:
    radial-gradient(circle at top left, rgba(255,255,255,0.32) 0%, transparent 28%),
    linear-gradient(135deg, #b87437 0%, #d98958 38%, #f56b8a 100%);
}

body.home-page .cta-inner,
body.liquid-glass .cta-shell{
  border-color:rgba(255,255,255,0.52);
}

body.liquid-glass .quick-link,
body.liquid-glass .pill-link,
body.liquid-glass .source-list a,
body.liquid-glass .snack-pill{
  background:rgba(255,255,255,0.36);
  border:1px solid rgba(255,255,255,0.74);
  backdrop-filter:var(--glass-blur-soft);
  -webkit-backdrop-filter:var(--glass-blur-soft);
  box-shadow:0 14px 28px rgba(92,58,30,0.06);
}

body.liquid-glass .source-list a{
  transition:transform .24s ease, box-shadow .24s ease, background .24s ease;
}

body.guide-page .page-hero{
  padding:124px 48px 64px;
  background:
    radial-gradient(circle at 78% 18%, rgba(255,190,202,0.24) 0%, transparent 22%),
    radial-gradient(circle at 14% 22%, rgba(173,219,255,0.18) 0%, transparent 18%),
    linear-gradient(160deg, #fff8f1 0%, #fff0de 48%, #ffeff4 100%);
}

body.guide-page .page-hero::before{
  display:none;
}

body.guide-page .hero-grid{
  gap:36px;
}

body.guide-page .hero-panel{
  padding:26px;
}

body.guide-page .hero-panel::after{
  background:rgba(76,48,23,0.82);
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 14px 32px rgba(92,58,30,0.14);
}

body.guide-page .media-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.38) 0%, rgba(255,255,255,0.2) 100%);
}

body.guide-page .media-card img,
body.guide-page .media-card video{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.52);
}

body.guide-page .updated-note{
  box-shadow:0 18px 38px rgba(92,58,30,0.08);
}

body.guide-page .cta-band{
  background:
    radial-gradient(circle at top left, rgba(255,255,255,0.28) 0%, transparent 28%),
    linear-gradient(135deg, #b87437 0%, #d98958 42%, #f56b8a 100%);
}

body.liquid-glass footer{
  background:
    linear-gradient(180deg, rgba(38,18,2,0.92) 0%, rgba(32,14,0,0.98) 100%);
}

body.liquid-glass [data-reveal]{
  opacity:0;
  transform:translateY(26px) scale(0.985);
  transition:opacity .7s ease, transform .7s ease;
}

body.liquid-glass [data-reveal].is-visible{
  opacity:1;
  transform:none;
}

body.liquid-glass .mobile-menu-toggle{
  display:none;
}

body.liquid-glass .mobile-drawer{
  display:none;
}

@keyframes glassFloat{
  0%,100%{transform:translate3d(0,0,0);}
  50%{transform:translate3d(0,-10px,0);}
}

body.home-page .hero-video-card,
body.home-page .hero-stats .stat,
body.liquid-glass .media-card,
body.liquid-glass .card-badge,
body.liquid-glass .snack-pill{
  animation:glassFloat 7s ease-in-out infinite;
}

body.home-page .hero-stats .stat:nth-child(2),
body.liquid-glass .snack-pill:nth-child(2){
  animation-delay:1.3s;
}

body.liquid-glass .media-card{
  animation-delay:0.8s;
}

@media (max-width:980px){
  body.liquid-glass nav{
    padding:14px 16px;
  }

  body.guide-page nav{
    margin:12px 12px 0;
  }

  body.home-page .hero,
  body.guide-page .page-hero{
    padding-left:20px;
    padding-right:20px;
  }

  body.home-page .hero{
    padding-top:118px;
    min-height:auto;
  }

  body.home-page .hero-inner,
  body.guide-page .hero-grid{
    gap:28px;
  }

  body.home-page .hero-mascot-wrap{
    min-height:420px;
  }

  body.home-page .hero-mascot-wrap::before{
    inset:14px 10px 10px 10px;
    border-radius:30px;
  }

  body.home-page .hero-text h1{
    font-size:clamp(2.8rem, 11vw, 4rem);
  }

  body.liquid-glass .mobile-menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,0.72);
    background:rgba(255,255,255,0.42);
    color:var(--ink-strong);
    font-size:1.15rem;
    font-weight:900;
    backdrop-filter:var(--glass-blur-soft);
    -webkit-backdrop-filter:var(--glass-blur-soft);
    box-shadow:0 16px 28px rgba(92,58,30,0.08);
  }

  body.liquid-glass .mobile-drawer{
    display:block;
    position:fixed;
    top:84px;
    left:16px;
    right:16px;
    z-index:220;
    padding:18px;
    border-radius:24px;
    border:1px solid rgba(255,255,255,0.76);
    background:linear-gradient(180deg, rgba(255,255,255,0.56) 0%, rgba(255,255,255,0.28) 100%);
    backdrop-filter:var(--glass-blur);
    -webkit-backdrop-filter:var(--glass-blur);
    box-shadow:0 24px 48px rgba(92,58,30,0.12);
    opacity:0;
    pointer-events:none;
    transform:translateY(-12px) scale(0.98);
    transition:opacity .26s ease, transform .26s ease;
  }

  body.liquid-glass.menu-open .mobile-drawer{
    opacity:1;
    pointer-events:auto;
    transform:none;
  }

  body.liquid-glass .mobile-drawer nav,
  body.liquid-glass .mobile-drawer .nav-links{
    position:static;
    inset:auto;
  }

  body.liquid-glass .mobile-drawer-links{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  body.liquid-glass .mobile-drawer-links a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:12px 14px;
    border-radius:18px;
    background:rgba(255,255,255,0.4);
    border:1px solid rgba(255,255,255,0.76);
    color:var(--ink-strong);
    font-weight:800;
    text-decoration:none;
  }

  body.liquid-glass .mobile-drawer-links a:last-child{
    background:linear-gradient(135deg, var(--accent-coral), #ff4068);
    color:#fff;
  }

  body.liquid-glass footer{
    padding-left:20px;
    padding-right:20px;
  }
}