:root {
  --purple-950: #24104f;
  --purple-900: #351274;
  --purple-800: #4a1d96;
  --purple-700: #6429c7;
  --purple-600: #7c3aed;
  --purple-500: #8b5cf6;
  --purple-400: #a78bfa;
  --purple-300: #c4b5fd;
  --purple-200: #ddd6fe;
  --purple-100: #ede9fe;
  --purple-50: #f7f5ff;
  --ink: #231b35;
  --muted: #716a7d;
  --surface: #ffffff;
  --surface-soft: #fbfaff;
  --line: #ebe7f3;
  --success: #15966a;
  --warning: #d78312;
  --danger: #d44963;
  --shadow-sm: 0 8px 30px rgba(65, 32, 116, .08);
  --shadow-lg: 0 28px 80px rgba(67, 32, 125, .16);
  --radius-sm: 14px;
  --radius: 22px;
  --radius-lg: 34px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top:96px; max-width:100%; overflow-x:hidden; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--surface-soft);
  font-family: 'Plus Jakarta Sans', sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  max-width:100%; overflow-x:hidden;
}
.public-body { padding-top:78px; }
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(circle at 20% 10%, rgba(139, 92, 246, .05) 0, transparent 28%), radial-gradient(circle at 85% 55%, rgba(196, 181, 253, .12) 0, transparent 28%);
  z-index: -1;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section { padding: 92px 0; }
.section-sm { padding: 64px 0; }
.surface-section { background: #fff; }
.has-ambient { position:relative; overflow:hidden; isolation:isolate; }
.has-ambient > .container { position:relative; z-index:2; }
.ambient-shapes { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.ambient-shape { position:absolute; display:block; opacity:.18; filter:blur(.2px); will-change:transform; }
.ambient-circle { width:170px;height:170px;border-radius:50%;background:linear-gradient(145deg,rgba(124,58,237,.7),rgba(255,255,255,.8));left:-52px;top:15%;animation:ambient-float-a 12s ease-in-out infinite; }
.ambient-square { width:92px;height:92px;border-radius:25px;background:linear-gradient(135deg,rgba(167,139,250,.9),rgba(255,255,255,.55));right:7%;top:12%;transform:rotate(24deg);animation:ambient-float-b 15s ease-in-out infinite; }
.ambient-triangle { width:130px;height:120px;background:linear-gradient(155deg,rgba(100,41,199,.75),rgba(255,255,255,.6));clip-path:polygon(50% 0,100% 100%,0 100%);right:-28px;bottom:8%;animation:ambient-float-c 17s ease-in-out infinite; }
.ambient-ring { width:220px;height:220px;border:24px solid rgba(196,181,253,.42);border-radius:50%;left:35%;bottom:-145px;animation:ambient-float-b 19s ease-in-out infinite reverse; }
.ambient-dot { width:28px;height:28px;border-radius:9px;background:linear-gradient(145deg,var(--purple-500),#fff);left:16%;top:14%;animation:ambient-float-c 10s ease-in-out infinite reverse; }
.ambient-right .ambient-circle { left:auto;right:-65px;top:20%; }
.ambient-right .ambient-square { right:auto;left:7%;top:16%; }
.ambient-right .ambient-triangle { right:auto;left:-32px;bottom:10%; }
.ambient-center .ambient-circle { left:8%;top:8%;width:115px;height:115px; }
.ambient-center .ambient-square { right:12%;top:20%;width:70px;height:70px; }
.ambient-center .ambient-ring { left:50%;transform:translateX(-50%); }
.ambient-sparse .ambient-square,.ambient-sparse .ambient-dot { display:none; }
@keyframes ambient-float-a { 0%,100%{transform:translate3d(0,0,0) rotate(0)} 45%{transform:translate3d(24px,-22px,0) rotate(10deg)} 70%{transform:translate3d(8px,12px,0) rotate(-5deg)} }
@keyframes ambient-float-b { 0%,100%{transform:translate3d(0,0,0) rotate(24deg)} 50%{transform:translate3d(-22px,28px,0) rotate(42deg)} }
@keyframes ambient-float-c { 0%,100%{transform:translate3d(0,0,0) rotate(-4deg)} 35%{transform:translate3d(18px,15px,0) rotate(7deg)} 70%{transform:translate3d(-8px,-20px,0) rotate(-10deg)} }
.section-kicker {
  display: inline-flex; align-items: center; gap: 8px; color: var(--purple-700); font-size: .78rem;
  font-weight: 800; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 14px;
}
.section-kicker::before { content: ''; width: 24px; height: 2px; background: var(--purple-500); border-radius: 99px; }
.section-title { margin: 0; font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.15; letter-spacing: -.045em; }
.section-lead { color: var(--muted); font-size: 1.05rem; max-width: 680px; margin: 18px 0 0; }
.text-gradient { background: linear-gradient(110deg, var(--purple-800), var(--purple-500)); -webkit-background-clip: text; color: transparent; }

.site-header {
  position: fixed; inset:0 0 auto; width:100%; z-index: 60; background: rgba(255,255,255,.88); backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(235,231,243,.9); transition:background .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.site-header.scrolled { background:rgba(255,255,255,.95); border-color:rgba(221,214,254,.85); box-shadow:0 12px 35px rgba(48,20,91,.11); }
.navbar { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 800; font-size: 1.08rem; }
.brand-mark { width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, var(--purple-800), var(--purple-500)); box-shadow: 0 9px 22px rgba(100,41,199,.28); }
.brand small { display: block; color: var(--muted); font-size: .65rem; font-weight: 600; letter-spacing: .02em; }
.nav-links { display: flex; align-items: center; gap: 6px; }
.nav-link { padding: 10px 14px; color: #5f576c; font-size: .9rem; font-weight: 650; border-radius: 11px; transition: .2s ease; }
.nav-link:hover, .nav-link.active { color: var(--purple-700); background: var(--purple-50); }
.nav-actions { display: flex; gap: 10px; }
.mobile-toggle { display: none; flex:none; border: 0; background: var(--purple-50); color: var(--purple-800); width: 42px; height: 42px; border-radius: 12px; }

.btn { border: 0; border-radius: 13px; padding: 12px 18px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-weight: 750; cursor: pointer; transition: .22s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(135deg, var(--purple-800), var(--purple-600)); box-shadow: 0 12px 26px rgba(100,41,199,.24); }
.btn-primary:hover { box-shadow: 0 16px 34px rgba(100,41,199,.32); }
.btn-soft { color: var(--purple-800); background: var(--purple-100); }
.btn-outline { color: var(--purple-800); background: transparent; border: 1px solid var(--purple-200); }
.btn-white { color: var(--purple-800); background: #fff; }
.btn-danger-soft { color: #b52e4d; background: #fff0f3; }
.btn-sm { padding: 9px 12px; border-radius: 10px; font-size: .82rem; }
.btn-icon { width: 42px; height: 42px; padding: 0; }

.hero { padding: 70px 0 50px; overflow: hidden; position: relative; }
.hero::after { content: ''; position: absolute; width: 420px; height: 420px; border: 1px solid var(--purple-200); border-radius: 50%; left: -260px; top: 40px; opacity: .7; }
.hero-grid { display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: 42px; }
.hero-copy { position: relative; z-index: 2; }
.hero-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: #fff; border: 1px solid var(--purple-100); border-radius: 999px; color: var(--purple-700); font-size: .78rem; font-weight: 750; box-shadow: var(--shadow-sm); }
.hero h1 { font-size: clamp(2.7rem, 5vw, 5rem); line-height: 1.03; letter-spacing: -.065em; margin: 23px 0 20px; }
.hero p { max-width: 610px; font-size: 1.07rem; color: var(--muted); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 30px; color: #625a6d; font-size: .82rem; }
.hero-trust span { display: inline-flex; gap: 7px; align-items: center; }
.hero-trust i { color: var(--success); }
.hero-visual { min-height: 540px; position: relative; display: flex; align-items: center; }
.hero-visual img { width: 100%; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); object-fit: cover; min-height: 500px; }
.float-card { position: absolute; z-index: 3; padding: 13px 16px; border-radius: 15px; background: rgba(255,255,255,.9); backdrop-filter: blur(12px); box-shadow: var(--shadow-sm); font-size: .78rem; font-weight: 700; animation: float 5s ease-in-out infinite; }
.float-card.one { left: -25px; bottom: 55px; }
.float-card.two { right: -18px; top: 52px; animation-delay: -2s; }
@keyframes float { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-11px) } }

.metrics-showcase { position:relative; padding:40px 0 64px; overflow:hidden; }
.metrics-glow { position:absolute; width:280px; height:280px; border-radius:50%; filter:blur(12px); opacity:.22; pointer-events:none; animation:metrics-drift 10s ease-in-out infinite; }
.metrics-glow.one { left:5%; top:5px; background:radial-gradient(circle,#8b5cf6,transparent 68%); }
.metrics-glow.two { right:5%; bottom:-100px; background:radial-gradient(circle,#c4b5fd,transparent 68%); animation-delay:-5s; }
.stats-strip { position:relative; color:white; border:1px solid rgba(255,255,255,.13); border-radius:25px; overflow:hidden; background:radial-gradient(circle at 92% -30%,rgba(167,139,250,.35),transparent 37%),linear-gradient(125deg,#25104d,#3f147c 58%,#5220a0); box-shadow:0 28px 65px rgba(54,22,105,.2); isolation:isolate; }
.stats-strip::before { content:''; position:absolute; width:290px; height:290px; border:1px solid rgba(255,255,255,.1); border-radius:50%; right:-80px; top:-205px; box-shadow:0 0 0 34px rgba(255,255,255,.035),0 0 0 70px rgba(255,255,255,.025); z-index:-1; }
.stats-strip::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.075) 48%,transparent 64%); transform:translateX(-120%); animation:stat-shimmer 8s ease-in-out infinite; pointer-events:none; }
.stats-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 26px; border-bottom:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.65); font-size:.76rem; }
.stats-intro span { display:inline-flex; align-items:center; gap:8px; color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stat-item { position:relative; display:flex; align-items:center; gap:14px; padding:25px 26px; border-right:1px solid rgba(255,255,255,.12); transition:background .25s ease,transform .25s ease; overflow:hidden; }
.stat-item:last-child { border-right:0; }
.stat-item:hover { background:rgba(255,255,255,.075); transform:translateY(-3px); }
.stat-icon { width:43px; height:43px; border-radius:14px; display:grid; place-items:center; flex:none; color:#ede9fe; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12); box-shadow:inset 0 1px 0 rgba(255,255,255,.14); }
.stat-value { font-size:1.7rem; line-height:1; font-weight:850; letter-spacing:-.04em; }
.stat-value sup { margin-left:2px; color:#c4b5fd; font-size:.8rem; vertical-align:top; }
.stat-label { margin-top:6px; color:rgba(255,255,255,.66); font-size:.75rem; }
.stat-spark { position:absolute; right:15px; bottom:12px; width:30px; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.42)); transform:rotate(-35deg); opacity:0; transition:.25s ease; }
.stat-item:hover .stat-spark { opacity:1; transform:rotate(-35deg) translateX(-5px); }
@keyframes metrics-drift { 0%,100% { transform:translate3d(0,0,0) scale(1) } 50% { transform:translate3d(22px,-14px,0) scale(1.12) } }
@keyframes stat-shimmer { 0%,68% { transform:translateX(-120%) } 88%,100% { transform:translateX(120%) } }

.grid-2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.grid-3 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.grid-4 { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.feature-card { padding: 28px; position: relative; overflow: hidden; transition: .25s ease; }
.feature-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: var(--purple-200); }
.icon-box { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: var(--purple-700); background: var(--purple-100); margin-bottom: 22px; }
.feature-card h3 { margin: 0 0 10px; font-size: 1.08rem; }
.feature-card p { color: var(--muted); font-size: .9rem; margin: 0; }
.link-arrow { display: inline-flex; align-items: center; gap: 6px; color: var(--purple-700); font-weight: 750; font-size: .85rem; margin-top: 20px; }

.split-card { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; }
.split-card .content { padding: 48px; }
.split-card .visual { min-height: 400px; background: linear-gradient(145deg, var(--purple-100), #fff); display: grid; place-items: center; position: relative; overflow: hidden; }
.brain-orbit { width: 240px; height: 240px; border-radius: 50%; background: linear-gradient(150deg, var(--purple-800), var(--purple-500)); color: white; display: grid; place-items: center; box-shadow: 0 30px 60px rgba(100,41,199,.28); }
.brain-orbit::before, .brain-orbit::after { content:''; position:absolute; width:310px; height:310px; border:1px dashed var(--purple-300); border-radius:50%; animation: spin 18s linear infinite; }
.brain-orbit::after { width:360px; height:360px; animation-direction:reverse; animation-duration:24s; }
@keyframes spin { to { transform: rotate(360deg); } }

#tentang { position:relative; overflow:hidden; }
.definition-aura { position:absolute; border-radius:50%; filter:blur(4px); pointer-events:none; opacity:.65; }
.definition-aura-one { width:220px; height:220px; left:-90px; top:4%; background:radial-gradient(circle,rgba(139,92,246,.18),transparent 70%); animation:metrics-drift 12s ease-in-out infinite; }
.definition-aura-two { width:280px; height:280px; right:-100px; bottom:-40px; background:radial-gradient(circle,rgba(196,181,253,.25),transparent 70%); animation:metrics-drift 15s ease-in-out infinite reverse; }
.definition-card { position:relative; border-color:rgba(109,40,217,.12); box-shadow:0 26px 70px rgba(46,19,88,.1); }
.definition-card::before { content:''; position:absolute; left:0; top:0; width:5px; height:100%; background:linear-gradient(180deg,var(--purple-500),transparent 84%); z-index:2; }
.definition-card .content { position:relative; z-index:2; background:linear-gradient(145deg,#fff,rgba(255,255,255,.9)); }
.balance-points { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 4px; }
.balance-points span { display:inline-flex; align-items:center; gap:7px; padding:8px 11px; color:var(--purple-800); background:var(--purple-50); border:1px solid var(--purple-100); border-radius:999px; font-size:.72rem; font-weight:750; transition:.2s ease; }
.balance-points span:hover { transform:translateY(-2px); color:#fff; background:var(--purple-700); border-color:var(--purple-700); }
.wellbeing-visual { min-height:480px !important; background:radial-gradient(circle at 50% 47%,rgba(255,255,255,.94) 0 14%,transparent 38%),linear-gradient(145deg,#eee9ff,#faf8ff 55%,#e8deff) !important; isolation:isolate; }
.wellbeing-grid { position:absolute; inset:0; opacity:.42; background-image:linear-gradient(rgba(109,40,217,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(109,40,217,.055) 1px,transparent 1px); background-size:36px 36px; mask-image:radial-gradient(circle,#000,transparent 74%); }
.wellbeing-orbit { position:absolute; border:1px dashed rgba(109,40,217,.35); border-radius:50%; animation:wellbeing-spin 18s linear infinite; }
.orbit-outer { width:330px; height:330px; box-shadow:0 0 0 26px rgba(124,58,237,.025); }
.orbit-inner { width:245px; height:245px; border-style:solid; border-color:rgba(139,92,246,.22); animation-direction:reverse; animation-duration:13s; }
.orbit-node { position:absolute; width:13px; height:13px; border-radius:50%; background:#8b5cf6; border:3px solid #f5f1ff; box-shadow:0 0 0 6px rgba(139,92,246,.13),0 5px 16px rgba(76,29,149,.35); }
.node-one { left:27px; top:48px; }
.node-two { right:-7px; top:50%; }
.node-three { left:50%; bottom:-7px; }
.wellbeing-core { position:relative; z-index:2; width:178px; height:178px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:white; background:linear-gradient(145deg,#4c1d95,#7c3aed 68%,#8b5cf6); border:1px solid rgba(255,255,255,.28); box-shadow:0 28px 60px rgba(76,29,149,.3),inset 0 1px 0 rgba(255,255,255,.3); animation:core-breathe 5s ease-in-out infinite; }
.wellbeing-core::after { content:''; position:absolute; inset:12px; border:1px solid rgba(255,255,255,.14); border-radius:50%; }
.wellbeing-core span { font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.wellbeing-tag { position:absolute; z-index:3; display:flex; align-items:center; gap:7px; padding:10px 13px; color:#4c1d95; background:rgba(255,255,255,.82); border:1px solid rgba(124,58,237,.12); border-radius:12px; box-shadow:0 12px 32px rgba(63,20,124,.13); backdrop-filter:blur(10px); font-size:.7rem; font-weight:780; animation:tag-float 5s ease-in-out infinite; }
.tag-mind { left:7%; top:17%; }
.tag-emotion { right:6%; top:27%; animation-delay:-1.8s; }
.tag-social { left:12%; bottom:14%; animation-delay:-3.2s; }
@keyframes wellbeing-spin { to { transform:rotate(360deg) } }
@keyframes core-breathe { 0%,100% { transform:scale(1); box-shadow:0 28px 60px rgba(76,29,149,.3),inset 0 1px 0 rgba(255,255,255,.3) } 50% { transform:scale(1.035); box-shadow:0 34px 70px rgba(76,29,149,.38),0 0 0 12px rgba(139,92,246,.055),inset 0 1px 0 rgba(255,255,255,.3) } }
@keyframes tag-float { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-8px) } }

/* Education experience */
.education-hero { min-height:620px; padding:70px 0 74px; text-align:left; display:flex; align-items:center; background:radial-gradient(circle at 74% 40%,rgba(196,181,253,.33),transparent 27%),linear-gradient(180deg,#faf8ff,#f5f1ff 72%,#fff); }
.education-hero::before,.education-hero::after { display:none; }
.edu-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:70px; position:relative; z-index:2; }
.edu-hero-copy .breadcrumbs { justify-content:flex-start; }
.edu-hero-copy h1 { max-width:650px; margin:18px 0; font-size:clamp(3rem,5vw,5rem); line-height:1.02; letter-spacing:-.06em; }
.edu-hero-copy p { margin:0; max-width:610px; font-size:1.02rem; }
.edu-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px; margin-top:28px; }
.edu-hero-actions > span { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.78rem; font-weight:700; }
.edu-hero-shape { position:absolute; pointer-events:none; opacity:.45; animation:tag-float 7s ease-in-out infinite; }
.edu-hero-shape.shape-a { width:120px; height:120px; left:5%; top:12%; border:1px solid var(--purple-200); border-radius:28px; transform:rotate(24deg); }
.edu-hero-shape.shape-b { width:85px; height:85px; right:5%; bottom:8%; background:linear-gradient(145deg,rgba(124,58,237,.2),rgba(255,255,255,.7)); clip-path:polygon(50% 0,100% 100%,0 100%); animation-delay:-2s; }
.edu-hero-shape.shape-c { width:22px; height:22px; left:47%; bottom:14%; border-radius:50%; background:#a78bfa; box-shadow:0 0 0 18px rgba(167,139,250,.1); animation-delay:-4s; }
.edu-mind-map { width:min(480px,100%); aspect-ratio:1; margin:auto; position:relative; display:grid; place-items:center; }
.edu-mind-map::before { content:''; position:absolute; inset:12%; border-radius:42% 58% 52% 48%; background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(221,214,254,.72)); box-shadow:0 35px 80px rgba(76,29,149,.16); animation:mind-morph 9s ease-in-out infinite; }
.mind-map-ring { position:absolute; border-radius:50%; border:1px dashed rgba(109,40,217,.28); animation:wellbeing-spin 22s linear infinite; }
.ring-one { width:71%; height:71%; }.ring-two { width:52%; height:52%; animation-direction:reverse; animation-duration:15s; }
.mind-map-core { position:relative; z-index:2; width:150px; height:150px; border-radius:45% 55% 48% 52%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#fff; text-align:center; background:linear-gradient(145deg,#4c1d95,#7c3aed); box-shadow:0 25px 55px rgba(76,29,149,.3); animation:mind-morph 7s ease-in-out infinite reverse; }
.mind-map-core strong { font-size:.78rem; line-height:1.25; letter-spacing:.04em; }
.mind-node { position:absolute; z-index:3; display:flex; align-items:center; gap:8px; padding:11px 14px; border-radius:13px; color:var(--purple-900); background:rgba(255,255,255,.88); border:1px solid var(--purple-100); box-shadow:0 13px 35px rgba(63,20,124,.13); backdrop-filter:blur(10px); font-size:.73rem; font-weight:800; animation:tag-float 5s ease-in-out infinite; }
.mind-node-a { left:0; top:27%; }.mind-node-b { right:0; top:17%; animation-delay:-1s; }.mind-node-c { right:3%; bottom:19%; animation-delay:-2.5s; }.mind-node-d { left:2%; bottom:17%; animation-delay:-3.8s; }
@keyframes mind-morph { 0%,100% { border-radius:42% 58% 52% 48% / 52% 44% 56% 48% } 50% { border-radius:57% 43% 39% 61% / 45% 58% 42% 55% } }

.edu-quick-nav { position:relative; z-index:15; margin-top:-31px; }
.edu-quick-track { display:grid; grid-template-columns:repeat(6,1fr); padding:9px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.9); box-shadow:0 20px 50px rgba(55,25,101,.12); backdrop-filter:blur(14px); }
.edu-quick-track a { display:flex; align-items:center; justify-content:center; gap:9px; min-height:58px; padding:8px 11px; color:#4d4458; border-right:1px solid var(--line); border-radius:13px; font-size:.73rem; font-weight:750; transition:.2s ease; }
.edu-quick-track a:last-child { border-right:0; }
.edu-quick-track a:hover { color:#fff; background:var(--purple-700); transform:translateY(-3px); box-shadow:0 10px 22px rgba(109,40,217,.2); }
.edu-quick-track small { display:block; color:var(--purple-500); font-size:.56rem; letter-spacing:.1em; }
.edu-quick-track a:hover small { color:#ddd6fe; }

.edu-story-section { position:relative; overflow:hidden; }
.edu-story-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; align-items:start; }
.edu-sticky-heading { position:sticky; top:115px; }
.story-illustration { height:245px; margin-top:34px; position:relative; display:grid; place-items:center; overflow:hidden; border-radius:28px; background:linear-gradient(145deg,#ede9fe,#faf8ff); }
.story-illustration::before,.story-illustration::after { content:''; position:absolute; width:170px; height:170px; border:1px dashed rgba(109,40,217,.25); border-radius:50%; animation:wellbeing-spin 15s linear infinite; }
.story-illustration::after { width:205px; height:205px; animation-direction:reverse; }
.story-face { position:relative; z-index:2; width:110px; height:110px; border-radius:48% 52% 45% 55%; background:linear-gradient(145deg,#5b21b6,#8b5cf6); box-shadow:0 20px 38px rgba(91,33,182,.25); animation:mind-morph 7s ease-in-out infinite; }
.story-face::before,.story-face::after { content:''; position:absolute; top:38px; width:8px; height:8px; border-radius:50%; background:#fff; }.story-face::before { left:30px; }.story-face::after { right:30px; }
.story-face span { position:absolute; width:30px; height:15px; left:40px; bottom:26px; border-bottom:3px solid #fff; border-radius:50%; }
.story-illustration small { position:absolute; bottom:17px; color:var(--purple-700); font-size:.66rem; font-weight:800; }
.story-path { position:relative; display:grid; }
.story-path::before { content:''; position:absolute; width:2px; left:28px; top:34px; bottom:34px; background:linear-gradient(var(--purple-300),rgba(196,181,253,.12)); }
.story-step { display:grid; grid-template-columns:58px 1fr; gap:24px; padding:0 0 38px; position:relative; }
.story-marker { position:relative; z-index:2; width:58px; height:58px; padding:6px; border-radius:50%; background:#fff; border:1px solid var(--purple-100); box-shadow:0 8px 20px rgba(76,29,149,.1); }
.story-marker span { width:100%; height:100%; display:grid; place-items:center; border-radius:50%; color:#fff; background:linear-gradient(145deg,var(--purple-800),var(--purple-500)); font-size:.7rem; font-weight:850; }
.story-step > div:last-child { padding:3px 0 30px; border-bottom:1px solid var(--line); }
.story-label { color:var(--purple-700); font-size:.67rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.story-step p { margin:9px 0 0; color:#5e5668; font-size:.93rem; line-height:1.85; }

.factor-lab { position:relative; overflow:hidden; }
.factor-orb { position:absolute; border-radius:50%; filter:blur(2px); pointer-events:none; animation:metrics-drift 12s ease-in-out infinite; }
.factor-orb-one { width:240px; height:240px; left:-100px; bottom:10%; background:radial-gradient(circle,rgba(139,92,246,.18),transparent 70%); }
.factor-orb-two { width:180px; height:180px; right:-60px; top:5%; border:35px solid rgba(196,181,253,.13); }
.section-heading-row { display:flex; justify-content:space-between; align-items:flex-end; gap:35px; }
.section-heading-row > div:first-child { max-width:760px; }
.factor-equation { display:flex; align-items:center; gap:7px; white-space:nowrap; padding:12px 15px; border:1px solid var(--purple-100); border-radius:14px; background:#fff; box-shadow:var(--shadow-sm); }
.factor-equation span { padding:5px 8px; color:var(--purple-800); background:var(--purple-50); border-radius:7px; font-size:.62rem; font-weight:800; }.factor-equation b { color:var(--purple-400); }
.factor-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:34px 0 16px; }
.factor-tab { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; padding:17px; text-align:left; color:#4b4355; background:#fff; border:1px solid var(--line); border-radius:17px; cursor:pointer; transition:.25s ease; }
.factor-tab > svg:first-child { width:42px; height:42px; padding:10px; color:var(--purple-700); background:var(--purple-50); border-radius:12px; }
.factor-tab small { display:block; margin-bottom:2px; color:var(--muted); font-size:.59rem; }.factor-tab span { font-size:.8rem; font-weight:800; }
.factor-tab.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#32106e,#6d28d9); transform:translateY(-3px); box-shadow:0 14px 32px rgba(76,29,149,.23); }
.factor-tab.active > svg:first-child { color:#fff; background:rgba(255,255,255,.14); }.factor-tab.active small { color:#cfc3e8; }
.factor-stage { border:1px solid var(--line); border-radius:25px; overflow:hidden; background:#fff; box-shadow:0 20px 55px rgba(56,26,104,.1); }
.factor-panel { display:none; grid-template-columns:.72fr 1.28fr; min-height:480px; }.factor-panel.active { display:grid; animation:factor-enter .38s ease both; }
@keyframes factor-enter { from { opacity:0; transform:translateY(8px) } }
.factor-panel-intro { display:flex; flex-direction:column; justify-content:center; gap:28px; padding:45px; color:#fff; background:radial-gradient(circle at 80% 10%,rgba(255,255,255,.14),transparent 28%),linear-gradient(145deg,#281052,#5520a5); }
.factor-panel-intro h3 { margin:7px 0 10px; font-size:1.65rem; }.factor-panel-intro p { margin:0; color:rgba(255,255,255,.7); font-size:.87rem; }.factor-panel-intro > div:last-child > span { color:#c4b5fd; font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.factor-big-icon { position:relative; width:105px; height:105px; display:grid; place-items:center; color:#fff; border-radius:32px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.14); }
.factor-ripple { position:absolute; inset:-14px; border:1px solid rgba(255,255,255,.18); border-radius:39px; animation:core-breathe 4s ease-in-out infinite; }
.factor-accordion { padding:24px 32px; align-self:center; }
.factor-item { border-bottom:1px solid var(--line); }.factor-item:last-child { border:0; }
.factor-toggle { width:100%; display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; padding:16px 0; border:0; background:transparent; text-align:left; cursor:pointer; color:#241938; }
.factor-toggle > span { color:var(--purple-500); font-size:.63rem; font-weight:850; }.factor-toggle strong { font-size:.84rem; }.factor-toggle > svg { color:var(--purple-600); transition:.25s; }
.factor-answer { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }.factor-answer > p { overflow:hidden; margin:0; color:var(--muted); font-size:.79rem; line-height:1.7; }
.factor-item.open .factor-answer { grid-template-rows:1fr; }.factor-item.open .factor-answer > p { padding:0 35px 18px 44px; }.factor-item.open .factor-toggle > svg { transform:rotate(45deg); }

.disorder-explorer { overflow:hidden; }
.carousel-controls { display:flex; gap:8px; flex:none; }
.carousel-controls button { width:44px; height:44px; display:grid; place-items:center; color:var(--purple-800); background:#fff; border:1px solid var(--purple-200); border-radius:13px; cursor:pointer; transition:.2s; }.carousel-controls button:hover { color:#fff; background:var(--purple-700); transform:translateY(-2px); }
.disorder-slider,.care-slider { display:flex; gap:18px; overflow-x:auto; padding:8px 2px 25px; scroll-snap-type:x mandatory; scrollbar-width:none; }.disorder-slider::-webkit-scrollbar,.care-slider::-webkit-scrollbar { display:none; }
.disorder-slide { position:relative; flex:0 0 330px; min-height:360px; padding:27px; display:flex; flex-direction:column; scroll-snap-align:start; overflow:hidden; color:#fff; border-radius:23px; background:linear-gradient(145deg,#26104d,#4c1d95 70%,#6d28d9); box-shadow:0 18px 38px rgba(48,20,91,.16); transition:.3s ease; }
.disorder-slide:nth-child(3n+2) { background:linear-gradient(145deg,#4c1d95,#7c3aed); }.disorder-slide:nth-child(3n+3) { background:linear-gradient(145deg,#351267,#5b21b6 55%,#8b5cf6); }
.disorder-slide::after { content:''; position:absolute; width:180px; height:180px; border-radius:50%; right:-90px; top:-80px; border:1px solid rgba(255,255,255,.13); box-shadow:0 0 0 25px rgba(255,255,255,.035); }
.disorder-slide:hover { transform:translateY(-7px) rotate(.5deg); box-shadow:0 28px 55px rgba(48,20,91,.25); }
.disorder-number { position:absolute; right:21px; top:18px; color:rgba(255,255,255,.15); font-size:2.6rem; font-weight:900; }
.disorder-icon { width:56px; height:56px; display:grid; place-items:center; margin-bottom:30px; color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.15); border-radius:17px; }
.disorder-group { color:#c4b5fd; font-size:.61rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.disorder-slide h3 { margin:8px 0 10px; font-size:1.13rem; }.disorder-slide p { margin:0 0 20px; color:rgba(255,255,255,.68); font-size:.8rem; }.disorder-slide a { display:flex; align-items:center; gap:7px; margin-top:auto; color:#fff; font-size:.76rem; font-weight:800; }
.disorder-slide.hidden { display:none; }
.slider-status { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:4px; }.slider-progress { flex:1; height:3px; overflow:hidden; background:var(--purple-100); border-radius:10px; }.slider-progress span { display:block; width:18%; height:100%; background:linear-gradient(90deg,var(--purple-800),var(--purple-400)); border-radius:10px; transition:width .2s; }.slider-status small { color:var(--muted); font-size:.68rem; white-space:nowrap; }

.myth-experience { position:relative; overflow:hidden; }
.myth-layout { display:grid; grid-template-columns:.75fr 1.25fr; align-items:start; gap:70px; position:relative; z-index:2; }
.myth-intro { position:sticky; top:115px; }.myth-visual { height:220px; position:relative; display:grid; place-items:center; margin-top:30px; color:#fff; border-radius:27px; background:linear-gradient(145deg,#4c1d95,#7c3aed); overflow:hidden; box-shadow:0 22px 45px rgba(76,29,149,.2); }
.myth-visual::before { content:'?'; position:absolute; right:-12px; bottom:-80px; color:rgba(255,255,255,.09); font-size:16rem; font-weight:900; }
.myth-bubble { position:absolute; padding:8px 11px; color:var(--purple-800); background:#fff; border-radius:10px; font-size:.64rem; font-weight:800; box-shadow:var(--shadow-sm); animation:tag-float 5s ease-in-out infinite; }.bubble-one { left:10%; top:16%; }.bubble-two { right:8%; bottom:14%; animation-delay:-2.4s; }
.myth-stack { display:grid; gap:11px; }
.myth-row { overflow:hidden; border:1px solid var(--line); border-radius:17px; background:#fff; transition:.25s; }.myth-row.open { border-color:var(--purple-200); box-shadow:0 14px 32px rgba(56,26,104,.09); }
.myth-question { width:100%; padding:18px; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:13px; color:#241938; background:transparent; border:0; text-align:left; cursor:pointer; }
.myth-index { color:var(--purple-500); font-size:.65rem; font-weight:900; }.myth-question small { display:block; margin-bottom:3px; color:#c03a5a; font-size:.58rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.myth-question strong { display:block; font-size:.82rem; }.myth-question > svg { color:var(--purple-500); transition:.25s; }
.myth-reveal { max-height:0; overflow:hidden; padding:0 18px 0 69px; background:linear-gradient(90deg,#f6f2ff,#fff); opacity:0; transition:max-height .35s ease,padding .3s ease,opacity .25s ease; }.myth-reveal span { display:flex; align-items:center; gap:7px; color:#087a54; font-size:.64rem; font-weight:900; text-transform:uppercase; }.myth-reveal p { margin:7px 0 0; color:#5c5366; font-size:.79rem; }
.myth-row.open .myth-reveal { max-height:230px; padding-top:15px; padding-bottom:18px; opacity:1; }.myth-row.open .myth-question > svg { transform:rotate(180deg); }

.warning-zone { background:#20103f; color:#fff; overflow:hidden; }
.warning-shell { display:grid; grid-template-columns:.82fr 1.18fr; min-height:600px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:28px; background:radial-gradient(circle at 10% 15%,rgba(139,92,246,.28),transparent 31%),#2b1157; box-shadow:0 28px 65px rgba(13,4,30,.3); }
.warning-copy { position:relative; padding:48px; overflow:hidden; }.warning-copy .section-title { color:#fff; }.warning-copy > p { color:rgba(255,255,255,.65); font-size:.86rem; }.section-kicker.light { color:#ddd6fe; }.section-kicker.light::before { background:#c4b5fd; }
.warning-radar { width:150px; height:150px; position:relative; display:grid; place-items:center; margin:30px 0; color:#fff; }.warning-radar span { position:absolute; inset:0; border:1px solid rgba(255,255,255,.14); border-radius:50%; animation:warning-wave 3.5s ease-out infinite; }.warning-radar span:nth-child(2) { animation-delay:1.15s; }.warning-radar span:nth-child(3) { animation-delay:2.3s; }
@keyframes warning-wave { 0% { transform:scale(.28); opacity:0 } 25% { opacity:1 } 100% { transform:scale(1); opacity:0 } }
.warning-note { display:flex; gap:12px; padding:16px; margin-bottom:20px; border:1px solid rgba(255,255,255,.1); border-radius:15px; background:rgba(255,255,255,.07); }.warning-note > svg { flex:none; color:#c4b5fd; }.warning-note strong { font-size:.78rem; }.warning-note p { margin:5px 0 0; color:rgba(255,255,255,.6); font-size:.68rem; line-height:1.6; }
.signal-board { display:grid; grid-template-columns:1fr 1fr; padding:26px; gap:14px; background:#f9f7fd; color:#261c31; }
.signal-column { padding:23px; border:1px solid #e9e4f1; border-radius:19px; background:#fff; }.signal-title { display:flex; align-items:center; gap:12px; padding-bottom:17px; margin-bottom:7px; border-bottom:1px solid var(--line); }.signal-title > span { width:43px; height:43px; display:grid; place-items:center; color:var(--purple-700); background:var(--purple-100); border-radius:13px; }.signal-title small { color:var(--purple-500); font-size:.58rem; font-weight:850; text-transform:uppercase; }.signal-title h3 { margin:1px 0 0; font-size:.96rem; }
.signal-item { display:flex; align-items:flex-start; gap:9px; padding:12px 0; color:#5c5366; border-bottom:1px dashed #e8e2f0; font-size:.72rem; line-height:1.5; }.signal-item:last-child { border:0; }.signal-item svg { flex:none; margin-top:2px; color:var(--purple-500); }

.selfcare-challenge { position:relative; overflow:hidden; }
.selfcare-blob { position:absolute; width:430px; height:430px; right:-180px; top:-120px; border-radius:46% 54% 42% 58%; background:linear-gradient(145deg,rgba(221,214,254,.42),rgba(255,255,255,0)); animation:mind-morph 10s ease-in-out infinite; }
.care-score { width:105px; height:105px; flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; border-radius:50%; background:linear-gradient(145deg,var(--purple-800),var(--purple-500)); box-shadow:0 15px 36px rgba(91,33,182,.25); }.care-score span { font-size:2rem; line-height:1; font-weight:900; }.care-score small { margin-top:5px; color:rgba(255,255,255,.7); font-size:.58rem; }
.care-slider { margin-top:33px; }
.care-slide { flex:0 0 305px; min-height:330px; padding:25px; display:flex; flex-direction:column; scroll-snap-align:start; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow-sm); transition:.28s ease; }.care-slide:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }.care-slide.selected { border-color:var(--purple-400); background:linear-gradient(145deg,#fff,#f4efff); box-shadow:0 17px 40px rgba(91,33,182,.14); }
.care-top { display:flex; justify-content:space-between; align-items:start; }.care-icon { width:54px; height:54px; display:grid; place-items:center; color:var(--purple-700); background:var(--purple-100); border-radius:17px; }.care-number { color:#e0d9ea; font-size:1.85rem; font-weight:900; }.care-slide h3 { margin:26px 0 9px; font-size:1.05rem; }.care-slide p { margin:0 0 22px; color:var(--muted); font-size:.8rem; }.care-toggle { display:flex; justify-content:center; align-items:center; gap:7px; width:100%; padding:10px; margin-top:auto; color:var(--purple-700); background:var(--purple-50); border:1px solid var(--purple-100); border-radius:11px; font-size:.72rem; font-weight:800; cursor:pointer; transition:.2s; }.care-toggle:hover,.care-slide.selected .care-toggle { color:#fff; background:var(--purple-700); border-color:var(--purple-700); }
.care-footer { display:flex; justify-content:space-between; align-items:center; gap:25px; margin-top:7px; }.care-footer p { display:flex; align-items:center; gap:8px; margin:0; color:var(--muted); font-size:.7rem; }

.pill-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 28px 0; }
.pill-tab { border: 1px solid var(--purple-200); background: #fff; color: var(--purple-800); padding: 9px 15px; border-radius: 999px; font-weight: 700; font-size: .82rem; cursor: pointer; }
.pill-tab.active { color: #fff; background: var(--purple-700); border-color: var(--purple-700); }
.filterable.hidden { display: none; }

.myth-card { padding: 24px; }
.myth-label, .fact-label { display: inline-flex; padding: 5px 9px; border-radius: 8px; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.myth-label { background: #fff0f3; color: var(--danger); }
.fact-label { background: #e9fbf4; color: var(--success); margin-top: 18px; }
.myth-card p { margin: 8px 0 0; font-size: .9rem; }
.alert-panel { background: linear-gradient(135deg, #3a176f, #6f37c5); color: #fff; padding: 42px; border-radius: var(--radius-lg); position: relative; overflow: hidden; }
.alert-panel::after { content:''; position:absolute; width:240px; height:240px; background:rgba(255,255,255,.07); border-radius:50%; right:-80px; top:-100px; }
.alert-panel p { color: rgba(255,255,255,.75); }

.page-hero { padding: 72px 0 52px; background: linear-gradient(180deg, var(--purple-50), transparent); text-align: center; position:relative; overflow:hidden; isolation:isolate; }
.page-hero > .container { position:relative;z-index:2; }
.page-hero::before { content:'';position:absolute;width:155px;height:155px;border-radius:50%;left:7%;top:-65px;background:linear-gradient(145deg,rgba(124,58,237,.28),rgba(255,255,255,.75));animation:ambient-float-a 14s ease-in-out infinite; }
.page-hero::after { content:'';position:absolute;width:115px;height:105px;right:8%;bottom:-34px;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(150deg,rgba(167,139,250,.32),rgba(255,255,255,.7));animation:ambient-float-c 16s ease-in-out infinite reverse; }
.page-hero p { max-width: 730px; margin: 18px auto 0; color: var(--muted); }
.breadcrumbs { display: flex; justify-content: center; gap: 8px; color: var(--muted); font-size: .8rem; margin-bottom: 18px; }
.article-shell { max-width: 840px; margin: 0 auto; }
.article-card { padding: clamp(26px, 5vw, 58px); }
.article-card p { color: #5f5869; }
.article-card .alert-panel h3 { color:#fff; }
.article-card .alert-panel p { color:rgba(255,255,255,.88); }

.questionnaire-shell { max-width: 900px; margin: 0 auto; }
.questionnaire-intro { padding: 28px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; margin-bottom: 24px; }
.questionnaire-intro .icon-box { margin: 0; }
.progress-wrap { position: sticky; top: 78px; z-index: 20; background: rgba(251,250,255,.92); backdrop-filter: blur(12px); padding: 16px 0; }
.progress-meta { display: flex; justify-content: space-between; font-size: .78rem; color: var(--muted); margin-bottom: 8px; }
.progress-track { height: 8px; background: var(--purple-100); border-radius: 99px; overflow: hidden; }
.progress-bar { height: 100%; width: 0; background: linear-gradient(90deg, var(--purple-700), var(--purple-400)); border-radius: inherit; transition: width .3s ease; }
.wizard-steps { display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:14px; }
.wizard-step { border:1px solid var(--line);background:rgba(255,255,255,.96);border-radius:12px;padding:9px 8px;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);cursor:pointer;transition:.2s ease; }
.wizard-step span { width:27px;height:27px;border-radius:9px;display:grid;place-items:center;background:var(--purple-50);color:var(--purple-700);font-size:.73rem;font-weight:800;transition:.2s ease; }
.wizard-step small { font-size:.66rem;font-weight:700;white-space:nowrap; }
.wizard-step:hover { border-color:var(--purple-300);transform:translateY(-1px); }
.wizard-step.active { color:var(--purple-800);border-color:var(--purple-300);background:var(--purple-50);box-shadow:0 7px 18px rgba(100,41,199,.1); }
.wizard-step.active span { color:#fff;background:var(--purple-700); }
.wizard-step.complete span { color:#fff;background:var(--success); }
.wizard-step.complete:not(.active) { color:var(--success);border-color:#bcebd9;background:#f3fcf8; }
.identity-card { padding: 28px; margin: 26px 0; }
.form-grid { display: grid; grid-template-columns: 1.5fr .55fr .8fr; gap: 16px; }
.field label { display: block; font-size: .77rem; font-weight: 750; margin-bottom: 7px; color: #5d5369; }
.input, .select { width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; background: #fff; color: var(--ink); outline: none; transition: .2s; }
.input:focus, .select:focus { border-color: var(--purple-400); box-shadow: 0 0 0 4px rgba(139,92,246,.1); }
.question-group { margin: 24px 0 38px; }
.group-heading { display: flex; gap: 12px; align-items: center; margin: 0 0 14px; }
.group-heading span { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items:center; color:white; background:var(--purple-700); font-weight:800; }
.question-card { padding: 24px; margin-bottom: 12px; transition: .2s; }
.question-card.answered { border-color: var(--purple-300); background: #fdfcff; }
.question-card.invalid { border-color:#ed7890;background:#fff9fa;animation:question-shake .32s ease; }
.question-error { display:none;color:var(--danger);margin:12px 0 0 48px;font-weight:650; }
.question-card.invalid .question-error { display:block; }
@keyframes question-shake { 0%,100%{transform:translateX(0)} 30%{transform:translateX(-6px)} 65%{transform:translateX(5px)} }
.question-head { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: start; margin-bottom: 18px; }
.question-no { width: 34px; height: 34px; border-radius: 10px; color: var(--purple-700); background: var(--purple-100); display:grid; place-items:center; font-size:.78rem; font-weight:800; }
.question-text { margin: 2px 0 0; font-weight: 650; font-size: .95rem; }
.answer-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.answer-option input { position: absolute; opacity: 0; pointer-events: none; }
.answer-option span { min-height: 48px; border: 1px solid var(--line); border-radius: 12px; display:flex; align-items:center; justify-content:center; text-align:center; padding:9px; color:var(--muted); font-size:.8rem; font-weight:700; cursor:pointer; transition:.2s; }
.answer-option input:checked + span { color: #fff; border-color: var(--purple-700); background: var(--purple-700); box-shadow: 0 10px 22px rgba(100,41,199,.2); }
.submit-panel { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 20px; background: rgba(255,255,255,.96); border: 1px solid var(--purple-100); border-radius: 18px; box-shadow: var(--shadow-lg); }
.submit-panel small { color: var(--muted); }
.wizard-navigation { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:17px 20px;margin-top:22px;position:sticky;bottom:14px;z-index:18;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);box-shadow:var(--shadow-lg); }
.wizard-position { text-align:center; }
.wizard-position strong { display:block;font-size:.83rem; }
.wizard-position small { display:block;color:var(--muted);font-size:.68rem;margin-top:2px; }
.wizard-page[hidden],#identityPanel[hidden],.wizard-navigation [hidden] { display:none !important; }

.result-hero { text-align:center; padding: 48px; }
.result-ring { width: 150px; height: 150px; margin: 0 auto 22px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--purple-600) var(--score), var(--purple-100) 0); position:relative; }
.result-ring::after { content:''; position:absolute; inset:12px; background:#fff; border-radius:50%; }
.result-ring strong { position:relative; z-index:1; font-size:2rem; }
.status-badge { display:inline-flex; align-items:center; gap:7px; padding:7px 11px; border-radius:999px; font-size:.74rem; font-weight:800; }
.status-stable { color:#087a54; background:#e6f8f1; }
.status-monitor { color:#a26008; background:#fff5db; }
.status-special { color:#b52e4d; background:#fff0f3; }
.score-card { padding: 22px; overflow:hidden; }
.score-top { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.score-value { min-width:156px;text-align:right; }
.score-value > strong { font-size:1.4rem; }
.score-value > small { color:var(--muted); }
.score-value .status-badge { margin-top:5px;justify-content:center; }
.mini-track { height:7px; background:var(--purple-100); border-radius:99px; overflow:hidden; margin-top:14px; }
.mini-track i { display:block; height:100%; background:var(--purple-600); border-radius:inherit; }
.score-details { margin:18px -22px -22px; border-top:1px solid var(--line); background:#fbf9ff; }
.score-details summary { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;color:var(--purple-800);font-size:.78rem;font-weight:800;cursor:pointer;list-style:none;transition:.2s ease; }
.score-details summary::-webkit-details-marker { display:none; }
.score-details summary:hover { background:var(--purple-50); }
.score-details summary > span { display:flex;align-items:center;gap:8px; }
.score-details .details-chevron { transition:transform .25s ease; }
.score-details[open] .details-chevron { transform:rotate(180deg); }
.score-explanation { padding:0 22px 22px;animation:score-details-in .25s ease; }
.score-explanation-intro { margin:0 0 13px;color:var(--muted);font-size:.76rem; }
.score-level-list { display:grid;gap:9px; }
.score-level-item { padding:13px;border:1px solid var(--line);border-radius:13px;background:#fff; }
.score-level-item.current { border-color:var(--purple-300);box-shadow:0 0 0 3px rgba(124,58,237,.07); }
.score-level-item.current::before { content:'Hasil saat ini';display:block;margin-bottom:8px;color:var(--purple-700);font-size:.65rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase; }
.score-level-item p { margin:9px 0 0;color:#5f566b;font-size:.76rem;line-height:1.65; }
@keyframes score-details-in { from { opacity:0;transform:translateY(-5px); } to { opacity:1;transform:none; } }

.wa-card { display:grid; grid-template-columns: 1.1fr .9fr; border-radius:var(--radius-lg); overflow:hidden; background:linear-gradient(135deg,var(--purple-950),var(--purple-700)); color:#fff; }
.wa-card > div { padding:48px; }
.wa-card p { color:rgba(255,255,255,.72); }
.service-hours { display:inline-flex; gap:9px; align-items:center; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.1); padding:9px 12px; border-radius:11px; font-size:.82rem; margin:10px 0 22px; }
.wa-visual { display:grid; place-items:center; background:rgba(255,255,255,.07); }
.wa-phone { width:210px; height:310px; background:#fff; border:8px solid rgba(255,255,255,.35); border-radius:32px; color:var(--ink); padding:22px 16px; transform:rotate(4deg); box-shadow:0 35px 80px rgba(22,7,47,.35); }
.chat-bubble-demo { background:var(--purple-100); border-radius:15px 15px 15px 3px; padding:13px; font-size:.74rem; margin-top:42px; }

.site-footer { position:relative; overflow:hidden; background:radial-gradient(circle at 88% 32%,rgba(124,58,237,.2),transparent 25%),#1f0d43; color: #fff; padding: 64px 0 24px; }
.site-footer::before { content:'';position:absolute;width:270px;height:270px;left:-150px;bottom:30px;border:1px solid rgba(255,255,255,.06);border-radius:50%;box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 86px rgba(255,255,255,.018);pointer-events:none; }
.site-footer > .container { position:relative;z-index:2; }
.footer-grid { display:grid; grid-template-columns:1.5fr .7fr .7fr 1fr; gap:42px; }
.footer-brand p, .footer-col a, .footer-bottom { color:rgba(255,255,255,.62); font-size:.83rem; }
.footer-col h4 { margin:0 0 16px; font-size:.9rem; }
.footer-col a { display:block; padding:5px 0; }
.footer-col a:hover { color:#fff; }
.footer-showcase { display:grid;grid-template-columns:1.4fr .6fr;gap:18px;margin-top:42px;padding-top:30px;border-top:1px solid rgba(255,255,255,.1); }
.footer-gallery,.footer-visitors { padding:22px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(255,255,255,.055);backdrop-filter:blur(8px); }
.footer-section-head { display:flex;align-items:center;gap:11px;margin-bottom:17px; }.footer-section-head > span { width:39px;height:39px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:12px; }.footer-section-head small { display:block;color:#a994d5;font-size:.58rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase; }.footer-section-head h4 { margin:2px 0 0;font-size:.84rem; }
.footer-gallery-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }.footer-gallery-grid a { height:112px;overflow:hidden;border-radius:13px;background:#fff; }.footer-gallery-grid img { width:100%;height:100%;display:block;object-fit:cover;transition:transform .35s ease,filter .35s ease; }.footer-gallery-grid a:first-child img { object-fit:contain;padding:8px; }.footer-gallery-grid a:hover img { transform:scale(1.06);filter:saturate(1.12); }
.visitor-assets { min-height:112px;display:flex;align-items:center;gap:14px; }.visitor-assets a { display:flex;align-items:center;justify-content:center;min-width:0;background:#fff;border-radius:13px;overflow:hidden; }.flag-counter { padding:8px; }.flag-counter img { display:block;max-width:100%;height:auto; }.tracer-logo { flex:1;align-self:stretch;padding:10px; }.tracer-logo img { width:100%;height:70px;object-fit:contain; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); margin-top:42px; padding-top:20px; display:flex; justify-content:space-between; }

.modal-backdrop { display:none; position:fixed; inset:0; z-index:100; background:rgba(28,13,56,.6); backdrop-filter:blur(8px); align-items:center; justify-content:center; padding:20px; }
.modal-backdrop.open { display:flex; }
.modal-card { width:min(460px,100%); padding:32px; background:#fff; border-radius:24px; box-shadow:var(--shadow-lg); animation:pop .2s ease; }
@keyframes pop { from { opacity:0; transform:scale(.96) translateY(10px) } }
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:22px; }
.modal-close { width:38px;height:38px;border:0;border-radius:11px;background:var(--purple-50);color:var(--purple-800);cursor:pointer; }
.form-stack { display:grid; gap:14px; }
.form-error { color:var(--danger); background:#fff0f3; border-radius:11px; padding:10px 12px; font-size:.8rem; }

.chat-launcher { position:fixed; right:24px; bottom:24px; z-index:70; width:60px;height:60px;border:0;border-radius:20px;color:#fff;background:linear-gradient(145deg,var(--purple-800),var(--purple-500));box-shadow:0 16px 36px rgba(76,29,149,.36);cursor:pointer;transition:.25s ease; }
.chat-launcher:hover { transform:translateY(-4px) rotate(-3deg);box-shadow:0 21px 42px rgba(76,29,149,.43); }
.chat-launcher-dot { position:absolute;right:7px;top:7px;width:10px;height:10px;border:2px solid var(--purple-700);border-radius:50%;background:#51d39a;box-shadow:0 0 0 4px rgba(81,211,154,.16); }
.chat-panel { display:none; position:fixed; right:24px; bottom:96px; z-index:70; width:min(410px,calc(100% - 30px)); height:min(650px,calc(100vh - 125px)); background:#fff; border:1px solid var(--purple-100); border-radius:25px; box-shadow:0 28px 80px rgba(39,16,75,.28); overflow:hidden; }
.chat-panel.open { display:flex;flex-direction:column;animation:chat-open .25s cubic-bezier(.2,.8,.2,1); }
@keyframes chat-open { from { opacity:0;transform:translateY(16px) scale(.97) } }
.chat-head { min-height:82px;padding:17px 18px;color:#fff;background:radial-gradient(circle at 88% -20%,rgba(255,255,255,.22),transparent 39%),linear-gradient(135deg,var(--purple-900),var(--purple-600));display:flex;gap:12px;align-items:center;flex:none; }
.chat-head > div { min-width:0; }.chat-head strong { display:block;font-size:.92rem; }.chat-head small { display:flex;align-items:center;gap:6px;margin-top:3px;color:rgba(255,255,255,.7);font-size:.66rem; }
.chat-avatar { width:43px;height:43px;border-radius:14px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;flex:none; }
.chat-online-dot { width:7px;height:7px;border-radius:50%;background:#65e0aa;box-shadow:0 0 0 3px rgba(101,224,170,.13); }
.chat-close { width:36px;height:36px;margin-left:auto;display:grid;place-items:center;flex:none;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:11px;cursor:pointer;transition:.2s; }.chat-close:hover { background:rgba(255,255,255,.2);transform:rotate(6deg); }
.chat-conversation { flex:1;min-height:0;padding:18px;overflow-y:auto;overscroll-behavior:contain;background:linear-gradient(180deg,#fcfbff,#f8f5fd);scrollbar-width:thin;scrollbar-color:var(--purple-200) transparent; }
.chat-row { display:flex;align-items:flex-end;gap:8px;margin-bottom:13px;animation:chat-message-in .22s ease both; }.chat-row.user { justify-content:flex-end; }
@keyframes chat-message-in { from { opacity:0;transform:translateY(7px) } }
.chat-mini-avatar { width:27px;height:27px;display:grid;place-items:center;flex:none;color:var(--purple-700);background:var(--purple-100);border-radius:9px; }
.chat-message { max-width:84%;padding:11px 13px;background:#fff;border:1px solid #ebe6f3;border-radius:15px 15px 15px 4px;box-shadow:0 6px 16px rgba(49,22,91,.06);font-size:.76rem;line-height:1.65;color:#554b62;white-space:pre-wrap;overflow-wrap:anywhere; }
.chat-row.user .chat-message { color:#fff;background:linear-gradient(135deg,var(--purple-800),var(--purple-600));border:0;border-radius:15px 15px 4px 15px;box-shadow:0 8px 18px rgba(91,33,182,.18); }
.chat-message.error { color:#a42645;background:#fff1f4;border-color:#ffd9e2; }.chat-message.crisis { color:#713818;background:#fff8e8;border-color:#f3dba9; }
.chat-suggestions { display:flex;flex-wrap:wrap;gap:7px;margin:4px 0 4px 35px; }.chat-suggestions button { padding:8px 10px;color:var(--purple-700);background:#fff;border:1px solid var(--purple-100);border-radius:999px;font-size:.64rem;font-weight:750;cursor:pointer;transition:.2s; }.chat-suggestions button:hover { color:#fff;background:var(--purple-700);border-color:var(--purple-700);transform:translateY(-2px); }
.chat-typing { display:flex;gap:4px;width:52px;padding-block:14px; }.chat-typing i { width:6px;height:6px;border-radius:50%;background:var(--purple-400);animation:chat-dot 1s ease-in-out infinite; }.chat-typing i:nth-child(2) { animation-delay:.14s; }.chat-typing i:nth-child(3) { animation-delay:.28s; }
@keyframes chat-dot { 0%,60%,100% { transform:translateY(0);opacity:.45 } 30% { transform:translateY(-5px);opacity:1 } }
.chat-support-links { display:flex;gap:8px;padding:10px 17px 0;background:#fff;flex:none; }.chat-support-links a { display:flex;align-items:center;gap:5px;padding:6px 9px;color:var(--purple-700);background:var(--purple-50);border-radius:8px;font-size:.62rem;font-weight:750; }
.chat-form { display:grid;grid-template-columns:1fr 43px;align-items:end;gap:9px;padding:11px 16px 8px;background:#fff;flex:none; }.chat-form textarea { width:100%;max-height:105px;resize:none;padding:11px 13px;color:#332a3e;background:#faf9fd;border:1px solid var(--purple-100);border-radius:13px;outline:none;font:inherit;font-size:.75rem;line-height:1.45;transition:.2s; }.chat-form textarea:focus { border-color:var(--purple-400);box-shadow:0 0 0 3px rgba(139,92,246,.1);background:#fff; }.chat-form textarea::placeholder { color:#9a92a4; }
.chat-form button { width:43px;height:43px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--purple-800),var(--purple-500));border:0;border-radius:13px;cursor:pointer;box-shadow:0 8px 18px rgba(91,33,182,.2);transition:.2s; }.chat-form button:hover { transform:translateY(-2px); }.chat-form button:disabled { opacity:.5;cursor:wait;transform:none; }
.chat-disclaimer { margin:0;padding:0 16px 11px;text-align:center;color:#9890a1;background:#fff;font-size:.55rem;flex:none; }

.reveal { opacity:1; transform:none; animation:rise-in .65s cubic-bezier(.2,.7,.2,1) both; }
.reveal.visible { opacity:1; transform:none; }
@keyframes rise-in { from { opacity:0; transform:translateY(20px) } to { opacity:1; transform:none } }
@media (prefers-reduced-motion: reduce) { .reveal, .float-card, .brain-orbit::before, .brain-orbit::after, .ambient-shape, .metrics-glow, .stats-strip::after, .definition-aura, .wellbeing-orbit, .wellbeing-core, .wellbeing-tag, .edu-hero-shape, .edu-mind-map::before, .mind-map-ring, .mind-map-core, .mind-node, .story-illustration::before, .story-illustration::after, .story-face, .factor-orb, .factor-ripple, .myth-bubble, .warning-radar span, .selfcare-blob, .chat-panel, .chat-row, .chat-typing i { animation:none !important; } }

/* Admin workspace */
.admin-body { background:#f7f5fb; }
.admin-shell { min-height:100vh; display:grid; grid-template-columns:264px minmax(0,1fr); }
.admin-sidebar { position:fixed; inset:0 auto 0 0; width:264px; padding:24px 18px; background:linear-gradient(180deg,#24104f,#32106e); color:white; z-index:60; display:flex; flex-direction:column; }
.admin-sidebar .brand { padding:0 8px 22px; border-bottom:1px solid rgba(255,255,255,.1); }
.admin-sidebar .brand-mark { background:rgba(255,255,255,.14); box-shadow:none; }
.admin-nav-label { padding:26px 12px 9px; color:rgba(255,255,255,.4); text-transform:uppercase; letter-spacing:.12em; font-size:.64rem; font-weight:800; }
.admin-nav { display:grid; gap:5px; }
.admin-nav a { display:flex; align-items:center; gap:12px; padding:12px 13px; border-radius:12px; color:rgba(255,255,255,.68); font-size:.86rem; font-weight:650; transition:.2s; }
.admin-nav a:hover, .admin-nav a.active { color:white; background:rgba(255,255,255,.12); }
.admin-sidebar-bottom { margin-top:auto; }
.admin-main { grid-column:2; min-width:0; }
.admin-topbar { height:78px; padding:0 30px; display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,.88); backdrop-filter:blur(16px); border-bottom:1px solid var(--line); position:sticky;top:0;z-index:40; }
.admin-topbar h1 { font-size:1.08rem;margin:0; }
.admin-topbar p { margin:2px 0 0;color:var(--muted);font-size:.72rem; }
.admin-avatar { width:40px;height:40px;border-radius:13px;background:var(--purple-100);color:var(--purple-700);display:grid;place-items:center; }
.admin-menu-toggle { display:none;border:0;background:var(--purple-50);color:var(--purple-800);width:40px;height:40px;border-radius:11px; }
.admin-content { padding:30px; max-width:1600px; margin:0 auto; }
.admin-heading { display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:24px; }
.admin-heading h2 { margin:0;font-size:1.65rem;letter-spacing:-.035em; }
.admin-heading p { margin:5px 0 0;color:var(--muted);font-size:.83rem; }
.metric-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px; }
.metric-card { padding:20px;background:#fff;border:1px solid var(--line);border-radius:18px;display:flex;align-items:center;gap:15px;box-shadow:var(--shadow-sm); }
.metric-icon { width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--purple-100);color:var(--purple-700);flex:none; }
.metric-card strong { display:block;font-size:1.48rem;line-height:1.1; }
.metric-card small { color:var(--muted);font-size:.7rem; }
.admin-grid { display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;margin-bottom:18px; }
.span-4 { grid-column:span 4; }.span-5 { grid-column:span 5; }.span-6 { grid-column:span 6; }.span-7 { grid-column:span 7; }.span-8 { grid-column:span 8; }.span-12 { grid-column:span 12; }
.chart-card { background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);min-width:0; }
.chart-head { display:flex;justify-content:space-between;gap:12px;align-items:start;margin-bottom:12px; }
.chart-head h3 { margin:0;font-size:.94rem; }
.chart-head p { margin:4px 0 0;color:var(--muted);font-size:.7rem; }
.chart-tag { color:var(--purple-700);background:var(--purple-50);border-radius:8px;padding:5px 8px;font-size:.64rem;font-weight:800; }
.data-card { background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden; }
.data-card-head { padding:20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px; }
.data-card-head h3 { margin:0;font-size:1rem; }
.table-wrap { overflow:auto; }
.data-table { width:100%;border-collapse:collapse;white-space:nowrap; }
.data-table th { padding:12px 16px;background:#faf9fd;color:#7a7284;font-size:.66rem;text-align:left;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line); }
.data-table td { padding:13px 16px;border-bottom:1px solid #f0edf5;font-size:.78rem;vertical-align:middle; }
.data-table tr:hover td { background:#fdfcff; }
.person-cell { display:flex;align-items:center;gap:10px; }
.person-avatar { width:34px;height:34px;border-radius:11px;background:var(--purple-100);color:var(--purple-700);display:grid;place-items:center;font-weight:800;font-size:.72rem; }
.table-actions { display:flex;gap:6px; }
.filter-panel { padding:20px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);margin-bottom:18px; }
.filter-grid { display:grid;grid-template-columns:2fr repeat(3,1fr);gap:12px;align-items:end; }
.filter-grid.advanced { grid-template-columns:repeat(5,1fr);margin-top:12px; }
.pagination-shell { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;color:var(--muted);font-size:.75rem; }
.pagination-links { display:flex;gap:5px; }
.pagination-links a,.pagination-links span { min-width:34px;height:34px;padding:0 9px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:white; }
.pagination-links .active { color:#fff;background:var(--purple-700);border-color:var(--purple-700); }
.empty-state { padding:52px;text-align:center;color:var(--muted); }
.flash-success { padding:12px 15px;margin-bottom:16px;border-radius:12px;color:#087a54;background:#e6f8f1;font-size:.82rem; }
.admin-modal { display:none;position:fixed;inset:0;z-index:90;background:rgba(26,11,52,.6);backdrop-filter:blur(7px);align-items:center;justify-content:center;padding:20px; }
.admin-modal.open { display:flex; }
.admin-modal-card { width:min(570px,100%);max-height:90vh;overflow:auto;background:white;border-radius:22px;padding:28px;box-shadow:var(--shadow-lg); }
.admin-form-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.detail-grid { display:grid;grid-template-columns:320px 1fr;gap:18px; }
.profile-card { padding:28px;text-align:center; }
.profile-avatar { width:82px;height:82px;margin:0 auto 16px;border-radius:24px;background:linear-gradient(145deg,var(--purple-800),var(--purple-500));color:#fff;display:grid;place-items:center;font-size:1.7rem;font-weight:800; }

@media (max-width:1100px) {
  .metric-grid { grid-template-columns:repeat(2,1fr); }
  .span-4,.span-5,.span-6,.span-7,.span-8 { grid-column:span 12; }
  .filter-grid,.filter-grid.advanced { grid-template-columns:repeat(2,1fr); }
  .detail-grid { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .admin-shell { display:block; }
  .admin-sidebar { transform:translateX(-100%);transition:.25s;box-shadow:var(--shadow-lg); }
  .admin-sidebar.open { transform:none; }
  .admin-main { margin-left:0; }
  .admin-menu-toggle { display:grid;place-items:center; }
  .admin-topbar,.admin-content { padding-left:16px;padding-right:16px; }
  .metric-grid,.filter-grid,.filter-grid.advanced,.admin-form-grid { grid-template-columns:1fr; }
  .admin-heading { align-items:flex-start;flex-direction:column; }
}

@media (max-width: 980px) {
  .nav-links { display:none; position:absolute; top:78px; left:20px; right:20px; padding:14px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-lg); flex-direction:column; align-items:stretch; }
  .nav-links.open { display:flex; }
  .nav-link { display:block; }
  .nav-actions .btn-outline { display:none; }
  .mobile-toggle { display:grid; place-items:center; }
  .hero-grid, .split-card, .wa-card { grid-template-columns:1fr; }
  .hero-copy { text-align:center; }
  .hero p { margin-inline:auto; }
  .hero-actions, .hero-trust { justify-content:center; }
  .hero-visual { min-height:auto; }
  .hero-visual img { min-height:360px; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .stat-item:nth-child(2) { border-right:0; }
  .stat-item:nth-child(-n+2) { border-bottom:1px solid rgba(255,255,255,.12); }
  .grid-4 { grid-template-columns:repeat(2,1fr); }
  .grid-3 { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:repeat(2,1fr); }
  .footer-showcase { grid-template-columns:1fr; }
  .education-hero { min-height:auto; }
  .edu-hero-grid { grid-template-columns:1fr; gap:30px; text-align:center; }
  .edu-hero-copy .breadcrumbs,.edu-hero-actions { justify-content:center; }
  .edu-hero-copy h1,.edu-hero-copy p { margin-inline:auto; }
  .edu-mind-map { width:min(420px,90%); }
  .edu-quick-track { grid-template-columns:repeat(3,1fr); }
  .edu-quick-track a:nth-child(3) { border-right:0; }
  .edu-quick-track a:nth-child(-n+3) { border-bottom:1px solid var(--line); }
  .edu-story-grid,.myth-layout { grid-template-columns:1fr; gap:45px; }
  .edu-sticky-heading,.myth-intro { position:relative; top:auto; }
  .story-illustration { max-width:470px; }
  .section-heading-row { align-items:flex-start; }
  .factor-equation { display:none; }
  .factor-panel { grid-template-columns:1fr; }
  .factor-panel-intro { min-height:260px; flex-direction:row; align-items:center; }
  .warning-shell { grid-template-columns:1fr; }
  .signal-board { min-height:480px; }
}
@media (max-width: 640px) {
  .container { width:min(calc(100% - 26px),1180px); }
  .section { padding:66px 0; }
  .hero { padding-top:46px; }
  .hero h1 { font-size:2.72rem; }
  .hero-actions { flex-direction:column; }
  .hero-actions .btn { width:100%; }
  .hero-trust { flex-direction:column;align-items:center; }
  .hero-badge,.section-kicker { max-width:100%;white-space:normal;line-height:1.4; }
  .page-hero .section-title { overflow-wrap:anywhere; }
  .ambient-shape { opacity:.12;transform:scale(.7); }
  .ambient-ring { display:none; }
  .hero-visual img { min-height:300px; }
  .float-card { display:none; }
  .grid-2, .grid-3, .grid-4, .form-grid { grid-template-columns:1fr; }
  .metrics-showcase { padding:26px 0 46px; }
  .stats-intro { align-items:flex-start; flex-direction:column; padding:17px 19px; }
  .stats-intro small { line-height:1.55; }
  .stats-grid { grid-template-columns:1fr; }
  .stat-item { padding:20px; border-right:0; border-bottom:1px solid rgba(255,255,255,.12); }
  .stat-item:last-child { border-bottom:0; }
  .wellbeing-visual { min-height:410px !important; }
  .orbit-outer { width:285px; height:285px; }
  .orbit-inner { width:210px; height:210px; }
  .wellbeing-core { width:150px; height:150px; }
  .wellbeing-core svg { width:50px; height:50px; }
  .wellbeing-tag { padding:8px 10px; font-size:.64rem; }
  .tag-mind { left:4%; top:13%; }
  .tag-emotion { right:3%; top:28%; }
  .tag-social { left:6%; bottom:11%; }
  .split-card .content, .wa-card > div { padding:30px; }
  .answer-options { grid-template-columns:1fr; }
  .score-top { align-items:flex-start;flex-direction:column; }
  .score-value { min-width:0;width:100%;text-align:left; }
  .score-details summary { padding-inline:18px; }
  .score-explanation { padding-inline:18px; }
  .wizard-steps { display:flex;overflow-x:auto;padding:2px 0 7px;scrollbar-width:none; }
  .wizard-steps::-webkit-scrollbar { display:none; }
  .wizard-step { min-width:102px;flex:none; }
  .wizard-step small { display:none; }
  .wizard-navigation { grid-template-columns:1fr 1fr;bottom:8px;padding:12px;gap:8px; }
  .wizard-position { grid-column:1/-1;grid-row:1; }
  .wizard-navigation .btn { grid-row:2;width:100%;padding-inline:10px; }
  .question-error { margin-left:0; }
  .questionnaire-intro { grid-template-columns:1fr; }
  .submit-panel { align-items:stretch; flex-direction:column; }
  .submit-panel .btn { width:100%; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-showcase { margin-top:30px;padding-top:24px; }.footer-gallery,.footer-visitors { padding:17px; }.footer-gallery-grid { grid-template-columns:1fr 1fr; }.footer-gallery-grid a { height:105px; }.footer-gallery-grid a:first-child { grid-column:1/-1; }.visitor-assets { align-items:stretch;flex-direction:column; }.tracer-logo img { height:64px; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .nav-actions .btn-primary { display:none; }
  .chat-launcher { right:14px;bottom:14px;width:55px;height:55px; }
  .chat-panel { position:fixed;inset:10px 10px 78px;width:auto;height:auto;max-height:none;border-radius:22px; }
  .chat-head { min-height:75px;padding:14px; }.chat-conversation { padding:14px; }.chat-message { max-width:88%; }.chat-suggestions { margin-left:0; }.chat-form { padding-inline:12px; }.chat-support-links { padding-inline:13px; }
  .education-hero { padding:48px 0 64px; }
  .edu-hero-copy h1 { font-size:2.8rem; }
  .edu-hero-actions { flex-direction:column; }
  .edu-mind-map { width:100%; transform:scale(.9); margin-block:-20px; }
  .mind-map-core { width:125px; height:125px; }.mind-node { padding:8px 10px; font-size:.63rem; }.mind-node-a { left:-2%; }.mind-node-b { right:-2%; }
  .edu-quick-nav { margin-top:-25px; }
  .edu-quick-track { display:flex; overflow-x:auto; padding:7px; scrollbar-width:none; }.edu-quick-track::-webkit-scrollbar { display:none; }.edu-quick-track a { flex:0 0 118px; border-right:1px solid var(--line) !important; border-bottom:0 !important; }
  .edu-story-grid { gap:35px; }.story-illustration { height:210px; }.story-step { grid-template-columns:48px 1fr; gap:15px; }.story-path::before { left:23px; }.story-marker { width:48px; height:48px; }.story-step p { font-size:.83rem; }
  .section-heading-row { flex-direction:column; gap:20px; }
  .factor-tabs { display:flex; overflow-x:auto; padding:3px 1px 12px; scrollbar-width:none; }.factor-tabs::-webkit-scrollbar { display:none; }.factor-tab { flex:0 0 235px; }
  .factor-panel-intro { padding:30px; align-items:flex-start; flex-direction:column; }.factor-big-icon { width:82px; height:82px; }.factor-accordion { padding:16px 22px; }.factor-item.open .factor-answer > p { padding-left:34px; }
  .carousel-controls button { width:40px; height:40px; }.disorder-slide { flex-basis:84vw; min-height:345px; }.slider-status { align-items:flex-start; flex-direction:column; }.slider-progress { width:100%; }.slider-status small { white-space:normal; }
  .myth-layout { gap:35px; }.myth-visual { height:190px; }.myth-question { grid-template-columns:28px 1fr auto; padding:15px; }.myth-reveal { padding-left:57px; }
  .warning-copy { padding:30px; }.warning-radar { width:125px; height:125px; }.signal-board { grid-template-columns:1fr; padding:14px; }.signal-column { padding:20px; }
  .care-score { width:90px; height:90px; }.care-score span { font-size:1.65rem; }.care-slide { flex-basis:82vw; }.care-footer { align-items:flex-start; flex-direction:column; }
}

/* Global page transition */
.page-loader {
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,rgba(126,73,236,.13),transparent 34%),
    linear-gradient(145deg,#fff 0%,#faf8ff 48%,#f2ecff 100%);
  opacity:1;
  visibility:visible;
  transition:opacity .6s cubic-bezier(.22,1,.36,1),visibility .6s;
}
.page-loader.is-hidden { opacity:0;visibility:hidden;pointer-events:none; }
.page-loader.is-leaving { transition-duration:.22s; }
.page-loader__glow { position:absolute;border-radius:999px;filter:blur(2px);opacity:.58;animation:loader-drift 5.5s ease-in-out infinite alternate; }
.page-loader__glow--one { width:310px;height:310px;left:-105px;top:-115px;background:linear-gradient(135deg,rgba(108,42,215,.2),rgba(255,255,255,.15)); }
.page-loader__glow--two { width:250px;height:250px;right:-70px;bottom:-95px;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(145,92,241,.22));animation-delay:-2.4s; }
.page-loader__content { position:relative;z-index:1;display:flex;align-items:center;flex-direction:column;text-align:center;padding:28px; }
.page-loader__orbit { position:relative;width:150px;height:150px;display:grid;place-items:center;margin-bottom:22px; }
.page-loader__ring { position:absolute;border-radius:50%;border:1px solid rgba(103,39,211,.2); }
.page-loader__ring--outer { inset:0;border-top-color:#7334dc;border-right-color:rgba(115,52,220,.55);animation:loader-spin 2.7s linear infinite; }
.page-loader__ring--inner { inset:17px;border-style:dashed;border-left-color:#9b6cf0;animation:loader-spin 4.2s linear infinite reverse; }
.page-loader__mark { width:84px;height:84px;display:grid;place-items:center;color:#fff;border-radius:29px;background:linear-gradient(145deg,#44168f,#7b35df 60%,#9c62f4);box-shadow:0 20px 45px rgba(70,24,145,.28),inset 0 1px 0 rgba(255,255,255,.3);animation:loader-breathe 1.8s ease-in-out infinite; }
.page-loader__mark svg { width:49px;height:49px;filter:drop-shadow(0 4px 8px rgba(38,10,83,.18)); }
.page-loader__spark { position:absolute;width:10px;height:10px;border-radius:50%;background:#874ce8;box-shadow:0 0 0 6px rgba(135,76,232,.1); }
.page-loader__spark--one { top:15px;right:22px;animation:loader-spark 1.7s ease-in-out infinite; }
.page-loader__spark--two { left:17px;bottom:28px;width:7px;height:7px;background:#c3a5f8;animation:loader-spark 1.7s .65s ease-in-out infinite; }
.page-loader__brand { color:#25143f;font-size:1.42rem;font-weight:800;letter-spacing:-.04em; }
.page-loader__brand span { color:#6d2fd2; }
.page-loader__content p { margin:7px 0 17px;color:#746a83;font-size:.78rem;font-weight:500;letter-spacing:.01em; }
.page-loader__progress { width:170px;height:4px;overflow:hidden;border-radius:999px;background:#e8ddf9; }
.page-loader__progress span { display:block;width:46%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4b159b,#8e4deb);animation:loader-progress 1.25s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes loader-spin { to { transform:rotate(360deg); } }
@keyframes loader-breathe { 50% { transform:translateY(-4px) scale(1.025);box-shadow:0 25px 52px rgba(70,24,145,.34),inset 0 1px 0 rgba(255,255,255,.3); } }
@keyframes loader-spark { 50% { transform:scale(.55);opacity:.42; } }
@keyframes loader-progress { from { transform:translateX(-110%); } to { transform:translateX(250%); } }
@keyframes loader-drift { to { transform:translate3d(28px,18px,0) scale(1.08); } }
@media (max-width:640px) {
  .page-loader__orbit { width:132px;height:132px; }
  .page-loader__mark { width:74px;height:74px;border-radius:25px; }
  .page-loader__mark svg { width:43px;height:43px; }
}
@media (prefers-reduced-motion:reduce) {
  .page-loader__glow,.page-loader__ring,.page-loader__mark,.page-loader__spark,.page-loader__progress span { animation:none !important; }
  .page-loader { transition-duration:.15s; }
  .page-loader__progress span { width:100%;opacity:.65; }
}
