/* VetriPath, combined design system (Cool blue primary + Amber accent + Sharp corners). Shared across pages. */
:root{
  --ink:#1D293D; --body:#364050; --muted:#6C727E; --line:#E6E8EE; --line2:#D6D9E0;
  --page:#F7F7FB; --card:#fff; --navy:#0B1120;
  --primary:#5B5BEF; --primary-d:#4848E0; --primary-sub:#EAEAFB; --primary-100:#DADAF9;
  --accent:#D97706; --accent-d:#B45309; --accent-bg:#FEF3C7; --accent-soft:#FFFAEC;
  --success:#15935E; --success-bg:#E4F4EC; --danger:#DC2626; --danger-bg:#FEE2E2; --warning:#B45309; --warning-bg:#FEF3C7;
  --r-btn:8px; --r-card:10px; --hl-bg:var(--primary-100);
  --gutter:24px;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;}
/* Offset anchor targets so the sticky header doesn't cover them on jump/scroll. */
[id]{scroll-margin-top:88px;}
.cdetail [id]{scroll-margin-top:140px;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{font-family:'Inter',system-ui,sans-serif;background:var(--page);color:var(--body);-webkit-font-smoothing:antialiased;line-height:1.6;}
/* Form controls don't inherit font-family by default — force Inter everywhere. */
input,button,select,textarea{font-family:inherit;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{color:var(--ink);letter-spacing:-0.025em;margin:0;line-height:1.12;}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15px;border-radius:var(--r-btn);padding:13px 22px;cursor:pointer;border:1.5px solid transparent;transition:.15s;white-space:nowrap;font-family:inherit;}
.btn-primary{background:var(--primary);color:#fff;}
.btn-primary:hover{background:var(--primary-d);}
.btn-outline{background:#fff;color:var(--ink);border-color:var(--line2);}
.btn-outline:hover{border-color:var(--primary);color:var(--primary);}
.btn-ghost:hover{background:var(--primary-sub);color:var(--primary-d);}
.btn-lg{padding:15px 28px;font-size:16px;}
.btn-sm{padding:9px 15px;font-size:13.5px;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.5;pointer-events:none;}

.center{text-align:center;margin-left:auto;margin-right:auto;}
.muted{color:var(--muted);}
.mono{font-family:var(--mono);}

.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;line-height:1.4;white-space:nowrap;}
.badge-accent{background:var(--accent-bg);color:var(--accent-d);}
.badge-neutral{background:var(--line);color:var(--body);}

.card{background:var(--card);border:1px solid var(--line2);border-radius:var(--r-card);}

/* user menu dropdown (navy header, native <details>) — Account v2 pill */
.usermenu{position:relative;}
.usermenu>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;padding:6px 14px 6px 6px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.08);font-size:13.5px;font-weight:600;color:#fff;}
.usermenu>summary::-webkit-details-marker{display:none;}
.usermenu>summary:hover{border-color:rgba(255,255,255,.4);}
.usermenu>summary i,.usermenu>summary svg{color:rgba(255,255,255,.6);}
.usermenu .uav{width:28px;height:28px;border-radius:50%;background:#EDEDFD;color:#4338CA;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:13px;flex:none;text-transform:uppercase;}
.usermenu .uname{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.usermenu .umenu{position:absolute;right:0;top:calc(100% + 10px);min-width:214px;background:#fff;border:1px solid #E3E4EA;border-radius:12px;box-shadow:0 18px 44px rgba(11,17,32,.28);padding:6px;z-index:40;}
.usermenu .umenu a,.usermenu .umenu button{display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;border-radius:8px;font-size:13.5px;font-weight:500;color:#45526B;background:none;border:none;cursor:pointer;text-align:left;}
.usermenu .umenu a:hover,.usermenu .umenu button:hover{background:#EDEDFD;color:#4338CA;}
.usermenu .umenu a svg,.usermenu .umenu button svg{width:16px;height:16px;color:#9AA0AE;}
.usermenu .umenu a:hover svg,.usermenu .umenu button:hover svg{color:#4338CA;}
.usermenu .umenu form{margin:4px 0 0;border-top:1px solid #ECEDF1;padding-top:4px;}

@media(min-width:880px){
  :root{--gutter:40px;}
}

/* ── Content pages (course catalogue + detail) ── */
/* 404 / empty / error states (per kit/page-states.html), scoped under .state */
.state{min-height:calc(100vh - 68px - 320px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:64px var(--gutter);position:relative;overflow:hidden;}
.state .orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;}
.state .o1{top:-120px;right:-60px;width:320px;height:320px;background:radial-gradient(circle,rgba(91,91,239,.14),transparent 70%);}
.state .badge404{font-size:clamp(88px,20vw,150px);font-weight:900;letter-spacing:-.06em;line-height:1;color:var(--primary);position:relative;}
.state .badge404 .mk{height:.62em;display:inline-block;vertical-align:-.06em;margin:0 .02em;}
.state .sicon{width:92px;height:92px;border-radius:22px;display:flex;align-items:center;justify-content:center;margin-bottom:26px;position:relative;}
.state .sicon.err{background:var(--danger-bg);color:var(--danger);}
.state .sicon.emp{background:var(--primary-sub);color:var(--primary-d);}
.state h1{font-size:clamp(26px,4.4vw,34px);font-weight:900;letter-spacing:-.03em;margin-top:24px;position:relative;}
.state p{color:var(--muted);font-size:16px;line-height:1.6;margin:14px 0 28px;max-width:440px;position:relative;}
.sbtns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;position:relative;}

/* Kicker family: shared uppercase-indigo label typography */
.kick2,.akick,.cc-h2,.winfo .sec,.prose h2{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#4338CA;}

/* ── Course Detail v2 (navy page head, sticky quick-nav, editorial prose) ── */
.cdetail .cd-inner{max-width:820px;padding-top:36px;padding-bottom:44px;}
.cdetail .cd-crumb{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:rgba(255,255,255,.6);flex-wrap:wrap;}
.cdetail .cd-crumb a{color:#A5A7F7;}
.cdetail .cd-crumb i{width:13px;height:13px;color:rgba(255,255,255,.4);}
.cdetail .pagehead h1{margin-top:16px;font-size:36px;}
.cdetail .cd-meta{display:flex;flex-wrap:wrap;gap:20px;margin-top:18px;font-size:13.5px;font-weight:500;color:rgba(255,255,255,.75);}
.cdetail .cd-meta span{display:inline-flex;align-items:center;gap:8px;}
.cdetail .cd-meta i{width:16px;height:16px;color:#A5A7F7;}
.cdetail .cnavbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid #ECEDF1;}
.cdetail .cnav{display:flex;gap:26px;font-size:13.5px;font-weight:500;overflow-x:auto;}
.cdetail .cnav a{padding:14px 0;color:#6C727E;white-space:nowrap;border-bottom:2px solid transparent;}
.cdetail .cnav a:hover{color:#1D293D;border-color:var(--primary);}
.cdetail .detail{padding-top:0;padding-bottom:64px;}
.cdetail [id]{scroll-margin-top:64px;}

/* Purchase card */
.cdetail .pcard{background:#fff;border:1px solid #D1D4DB;border-radius:14px;overflow:hidden;box-shadow:0 4px 8px -1px rgba(29,41,61,.07);}
.cdetail .pthumb{position:relative;aspect-ratio:16/9;background:#0B1120;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.cdetail .pthumb::before{content:"";position:absolute;top:-90px;right:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(100,104,240,.4),rgba(100,104,240,0) 68%);pointer-events:none;}
.cdetail .pthumb-img{width:100%;height:100%;object-fit:cover;display:block;}
.cdetail .pthumb .pv{position:relative;width:100%;height:100%;border:0;display:block;}
.cdetail .pthumb .play{position:relative;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--primary);display:flex;align-items:center;justify-content:center;}
.cdetail .pbody{padding:20px 22px;}
.cdetail .pprice{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.cdetail .pprice b{font-size:27px;font-weight:600;color:var(--ink);letter-spacing:-.02em;}
.cdetail .pprice s{color:#6C727E;font-size:14px;}
.cdetail .pprice .save{font-size:11.5px;font-weight:600;color:#4338CA;background:#EDEDFD;padding:3px 9px;border-radius:999px;}
.cdetail .psub{margin-top:4px;font-size:12px;color:#6C727E;}
.cdetail .pnote{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;color:#6C727E;font-weight:400;margin-top:11px;}
.cdetail .pnote a{color:#6C727E;}
.cdetail .pnote i{width:14px;height:14px;color:#15935E;}
.cdetail .incl{list-style:none;padding:14px 0 0;margin:16px 0 0;border-top:1px solid #ECEDF1;display:flex;flex-direction:column;gap:9px;}
.cdetail .incl li{display:flex;align-items:center;gap:10px;font-size:13px;color:#45526B;}
.cdetail .incl i{width:15px;height:15px;color:var(--primary);flex:none;}
.cdetail .pchips{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;}
.cdetail .pchips span{display:inline-flex;align-items:center;gap:6px;border:1px solid #E3E4EA;font-size:11px;font-weight:500;color:#45526B;padding:6px 10px;border-radius:999px;}
.cdetail .pchips i{width:12px;height:12px;color:var(--primary);}

/* Section headings (Course content / FAQ, matching prose kickers) */
.cdetail .cc-h2{border-top:1px solid #ECEDF1;padding-top:36px;margin:36px 0 0;}
.cdetail .cc-sum{font-size:24px;font-weight:600;letter-spacing:-.02em;color:var(--ink);margin:12px 0 0;}

/* Course content accordion */
.cdetail .acc{border:1px solid #E3E4EA;border-radius:12px;overflow:hidden;background:#fff;margin-top:10px;}
.cdetail .acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 20px;font-weight:600;color:var(--ink);font-size:14.5px;}
.cdetail .acc[open] summary{background:#F8F8F8;}
.cdetail .acc summary::-webkit-details-marker{display:none;}
.cdetail .acc summary .chev{margin-left:auto;color:#6C727E;transition:.2s;width:16px;height:16px;flex:none;}
.cdetail .acc[open] summary .chev{transform:rotate(180deg);}
.cdetail .acc .les{display:flex;align-items:center;gap:12px;padding:12px 20px;border-top:1px solid #ECEDF1;font-size:13.5px;color:#45526B;}
.cdetail .acc .les i.li{width:15px;height:15px;color:#9AA0AE;flex:none;}
.cdetail .acc .les .dur{margin-left:auto;font-family:var(--mono);font-size:12px;color:#9AA0AE;}

/* FAQ rows */
.cdetail .fq2{padding:16px 0;border-top:1px solid #ECEDF1;}
.cdetail .fq2:first-of-type{margin-top:14px;}
.cdetail .fq2 .q{font-size:14.5px;font-weight:600;color:var(--ink);}
.cdetail .fq2 .a{margin-top:6px;font-size:13.5px;line-height:1.65;color:#6C727E;}

.cdetail .only-desktop{display:none;}
@media(min-width:1024px){
  .cdetail .only-desktop{display:block;}
  .cdetail .only-mobile{display:none;}
  .cdetail .detail .grid{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:48px;align-items:start;}
  .cdetail .aside-inner{position:sticky;top:64px;padding-top:32px;}
}
@media(max-width:1023px){
  .cdetail .pagehead h1{font-size:28px;}
}

/* ── Markdown prose, styled to the Course Detail v2 sections ── */
.prose{color:#45526B;font-size:15px;line-height:1.75;}
.prose h1{font-size:22px;font-weight:600;color:var(--ink);margin:24px 0 10px;letter-spacing:-.02em;}
.prose h2{border-top:1px solid #ECEDF1;padding-top:36px;margin:36px 0 14px;}
.prose h2:first-child{border-top:none;padding-top:8px;margin-top:0;}
.prose h3{font-size:15.5px;font-weight:600;color:var(--ink);margin:24px 0 0;}
.prose p{margin:12px 0 0;}
.prose ul,.prose ol{margin:0 0 14px;padding-left:22px;}
.prose li{margin:6px 0;}
.prose li::marker{color:var(--primary);}
.prose a{color:var(--primary-d);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.prose strong{color:var(--ink);font-weight:600;}
.prose code{background:var(--primary-sub);color:var(--primary-d);padding:2px 6px;border-radius:6px;font-size:.9em;}
.prose blockquote{border-left:3px solid var(--line2);margin:14px 0;padding:2px 0 2px 16px;color:var(--muted);}

/* Tables (Dream Jobs pay-level tables): navy header row */
.prose table{width:100%;border-collapse:collapse;margin:10px 0 0;font-size:13px;}
.prose th{background:#0B1120;color:#fff;padding:9px 12px;font-weight:600;text-align:left;}
.prose td{padding:9px 12px;border-bottom:1px solid #ECEDF1;color:#45526B;vertical-align:top;}
.prose td:first-child{color:#6C727E;}
.prose td:nth-child(2){font-weight:600;color:var(--ink);}
@media(max-width:720px){
  .prose table{display:block;overflow-x:auto;}
}

/* Key highlights: 3 stat cards */
.prose #key-highlights + ul{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.prose #key-highlights + ul li{margin:0;border:1px solid #E3E4EA;border-radius:12px;padding:16px 20px;font-size:15px;font-weight:600;color:var(--ink);}
.prose #key-highlights + ul li strong{display:block;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6C727E;margin-bottom:3px;}

/* Who is this for: indigo left-border rows */
.prose #who-is-this-course-for + ul{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-direction:column;gap:12px;}
.prose #who-is-this-course-for + ul li{margin:0;background:#F8F8F8;border:1px solid #ECEDF1;border-left:3px solid var(--primary);border-radius:0 10px 10px 0;padding:16px 22px;font-size:14.5px;line-height:1.7;}

/* Why join: hairline check rows */
.prose #why-join-this-course + ul{list-style:none;padding:0;margin:16px 0 0;}
.prose #why-join-this-course + ul li{margin:0;position:relative;border-top:1px solid #ECEDF1;padding:14px 0 14px 32px;font-size:14.5px;line-height:1.7;}
.prose #why-join-this-course + ul li::before{content:"";position:absolute;left:0;top:18px;width:18px;height:18px;background:var(--primary);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") center/contain no-repeat;}

/* What you'll learn: 2-col checklist cards */
.prose #what-youll-learn + ul{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.prose #what-youll-learn + ul li{margin:0;position:relative;border:1px solid #E3E4EA;border-radius:12px;padding:15px 18px 15px 46px;font-size:13.5px;line-height:1.65;}
.prose #what-youll-learn + ul li:last-child:nth-child(odd){grid-column:1 / -1;}
.prose #what-youll-learn + ul li::before{content:"";position:absolute;left:18px;top:17px;width:16px;height:16px;background:var(--primary);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;}

/* This course includes: check list */
.prose #this-course-includes + ul{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:9px;}
.prose #this-course-includes + ul li{margin:0;font-size:13.5px;}

@media(max-width:860px){
  .prose #key-highlights + ul{grid-template-columns:1fr;}
  .prose #what-youll-learn + ul{grid-template-columns:1fr;}
}
.prose hr{border:none;border-top:1px solid var(--line);margin:24px 0;}

/* ── Account Page v2 (/me): navy head, side nav, section cards ── */
.acct2 .ahead{padding-top:40px;padding-bottom:44px;}
.acct2 .pagehead h1{margin-top:14px;font-size:34px;}
.acct2 .asub{margin-top:8px;font-size:14px;color:rgba(255,255,255,.66);}
.acct2 .abody{padding-top:48px;padding-bottom:64px;}
.acct2 .agrid{display:grid;grid-template-columns:1fr;gap:36px;align-items:start;}
@media(min-width:1024px){
  .acct2 .agrid{grid-template-columns:280px 1fr;gap:48px;}
  .acct2 .anav{position:sticky;top:24px;}
}
.acct2 .anav nav{display:flex;flex-direction:column;font-size:14px;font-weight:500;}
.acct2 .anav nav a,.acct2 .anav nav button{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:8px;color:#45526B;background:none;border:none;font:inherit;font-weight:500;cursor:pointer;text-align:left;width:100%;}
.acct2 .anav nav a:hover,.acct2 .anav nav button:hover{background:#F4F4F6;color:var(--ink);}
.acct2 .anav nav a.on{background:#EDEDFD;color:#4338CA;font-weight:600;}
.acct2 .anav nav svg{width:16px;height:16px;color:#9AA0AE;flex:none;}
.acct2 .anav nav a.on svg{color:#4338CA;}
.acct2 .anav .lo{margin-top:8px;border-top:1px solid #ECEDF1;padding-top:8px;}
.acct2 .ahelp{margin-top:18px;background:#F8F8F8;border:1px solid #ECEDF1;border-left:3px solid var(--primary);border-radius:0 10px 10px 0;padding:14px 18px;font-size:12.5px;line-height:1.65;color:#45526B;}
.acct2 .ahelp a{font-weight:600;color:#4338CA;}
.acct2 .acard{margin-top:14px;border:1px solid #E3E4EA;border-radius:14px;overflow:hidden;background:#fff;}
.acct2 .ahdr{display:flex;align-items:center;gap:18px;padding:22px 26px;background:#F8F8F8;border-bottom:1px solid #ECEDF1;}
.acct2 .av{width:56px;height:56px;border-radius:50%;background:#EDEDFD;color:#4338CA;font-size:22px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none;text-transform:uppercase;}
.acct2 .ahdr .nm{font-size:17px;font-weight:600;color:var(--ink);}
.acct2 .ahdr .em{font-size:13px;color:#6C727E;margin-top:2px;}
.acct2 .apad{padding:22px 26px;}
.acct2 .fgrid{display:grid;grid-template-columns:1fr;gap:18px 32px;}
@media(min-width:720px){.acct2 .fgrid{grid-template-columns:1fr 1fr;}}
.acct2 .fl{display:block;font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#6C727E;margin-bottom:6px;}
.acct2 .inp.ro{background:var(--page);}
.acct2 .inp.ro input{color:var(--muted);}
.acct2 .hint{font-size:12px;color:var(--muted);margin-top:6px;display:flex;align-items:center;gap:8px;}
/* Orders table */
.acct2 .ohead{display:flex;align-items:center;gap:14px;padding:12px 26px;background:#0B1120;font-size:12px;font-weight:600;}
.acct2 .ohead span{color:#fff;font-size:12px;font-weight:600;}
.acct2 .orow2{display:flex;align-items:center;gap:14px;padding:18px 26px;border-top:1px solid #ECEDF1;}
.acct2 .ohead + .orow2{border-top:none;}
.acct2 .oc-main{flex:1;min-width:0;}
.acct2 .oc-date{width:110px;font-size:13.5px;color:#45526B;flex:none;}
.acct2 .oc-amt{width:90px;font-size:14px;font-weight:600;color:var(--ink);flex:none;}
.acct2 .oc-st{width:90px;flex:none;}
.acct2 .oc-inv{width:110px;display:flex;justify-content:flex-end;flex:none;}
.acct2 .ot{font-weight:600;color:var(--ink);font-size:14.5px;}
.acct2 a.ot:hover{color:var(--primary);}
.acct2 .om{color:#6C727E;font-size:12px;margin-top:4px;}
.acct2 .ost{display:inline-flex;align-items:center;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;border:1px solid transparent;}
.acct2 .st-completed{background:#EAF7F1;border-color:#BFE7D4;color:#0F7A4D;}
.acct2 .st-pending{background:var(--accent-bg);color:var(--accent-d);}
.acct2 .st-failed,.acct2 .st-refunded{background:var(--danger-bg);color:var(--danger);}
.acct2 .ofoot{padding:13px 26px;border-top:1px solid #ECEDF1;background:#F8F8F8;display:flex;align-items:center;gap:8px;font-size:12.5px;color:#6C727E;}
.acct2 .ofoot svg{width:14px;height:14px;color:var(--primary);}
@media(max-width:860px){
  .acct2 .ohead{display:none;}
  .acct2 .orow2{flex-wrap:wrap;}
  .acct2 .oc-date,.acct2 .oc-amt,.acct2 .oc-st,.acct2 .oc-inv{width:auto;}
  .acct2 .oc-main{flex:1 1 100%;}
}
/* Preference rows + toggle */
.acct2 .prefrow{display:flex;align-items:center;gap:16px;cursor:pointer;}
.acct2 .prefrow .txt{flex:1;}
.acct2 .prefrow .t{display:block;font-size:14.5px;font-weight:600;color:var(--ink);}
.acct2 .prefrow .d{display:block;margin-top:3px;font-size:12.5px;color:#6C727E;}
.acct2 .swx{appearance:none;-webkit-appearance:none;width:44px;height:24px;border-radius:999px;background:#D1D4DB;position:relative;cursor:pointer;transition:.15s;flex:none;margin:0;}
.acct2 .swx::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.15s;}
.acct2 .swx:checked{background:var(--primary);}
.acct2 .swx:checked::after{left:23px;}

/* Purchase-card progress (owners): completed lessons out of total */
.pcard .cprog{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);}
.pcard .cbar{height:8px;border-radius:99px;background:var(--line);overflow:hidden;}
.pcard .cbar span{display:block;height:100%;background:var(--success);border-radius:99px;transition:width .3s;min-width:8px;}
.pcard .cpct{font-size:12.5px;color:var(--muted);margin-top:9px;font-weight:600;text-align:center;}

/* ══ Shared v2 design system (landing header/footer, editorial rail, cards) ══ */
.wrap2{max-width:1512px;margin:0 auto;padding-left:52px;padding-right:52px;}
.lv2-band{position:relative;background:#0B1120;color:#fff;z-index:30;}
/* Override vp.css's global light sticky header for the landing's navy nav */
.lv2-nav{position:relative;top:auto;z-index:auto;background:transparent;backdrop-filter:none;box-shadow:none;display:flex;align-items:center;justify-content:space-between;padding-top:20px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1);}
.lv2-nav .lg{height:32px;filter:brightness(0) invert(1);display:block;}
.lv2-nav .links{display:flex;align-items:center;gap:26px;font-size:14px;font-weight:500;color:rgba(255,255,255,.75);}
.lv2-nav .links a{color:rgba(255,255,255,.75);}
.lv2-nav .links a:hover{color:#fff;}
.lv2-nav .links a.on{color:#fff;font-weight:600;}
.lv2-nav .btn-cta{background:#6468F0;color:#fff !important;font-weight:600;padding:10px 19px;border-radius:8px;}
.lv2-nav .btn-cta:hover{background:#4F53E8;}

/* ── Header navigation ──
   One <details> renders two ways. On desktop the burger is hidden and the
   panel is forced open, so the links sit inline exactly as before. Below the
   breakpoint the burger appears and the panel becomes a drawer. Forcing the
   panel visible is why `display` is set explicitly here: a browser's default
   stylesheet hides a closed <details>'s content, and desktop must ignore that. */
.navmenu{position:relative;}
.navmenu>summary{display:none;list-style:none;cursor:pointer;}
.navmenu>summary::-webkit-details-marker{display:none;}
.navmenu>.links{display:flex;}
/* A closed <details> hides its content through the ::details-content
   pseudo-element, which `display` on the child cannot override: the panel keeps
   a computed display of flex while collapsing to zero width, so the nav's links
   overflow silently off the right of the screen. Desktop must therefore opt out
   of the hiding itself. Mobile still hides the panel, via display on .links
   below, so this is safe to apply at every width.
   Deleting this line makes the entire desktop nav vanish off-screen while every
   element still reports display:flex. Verify with getBoundingClientRect, never
   with getComputedStyle. */
.navmenu::details-content{content-visibility:visible;}

@media(max-width:900px){
  .navmenu>summary{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;}
  .navmenu>summary:hover{border-color:rgba(255,255,255,.45);}
  .navmenu>summary .close{display:none;}
  .navmenu[open]>summary .open{display:none;}
  .navmenu[open]>summary .close{display:inline-block;}

  .navmenu>.links{display:none;}
  .navmenu[open]>.links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;right:0;top:calc(100% + 14px);min-width:232px;background:#fff;border:1px solid #E3E4EA;border-radius:12px;box-shadow:0 18px 44px rgba(11,17,32,.28);padding:6px;z-index:40;}
  .navmenu[open]>.links a{padding:11px 13px;border-radius:8px;font-size:14.5px;font-weight:500;color:#45526B;}
  .navmenu[open]>.links a:hover{background:#EDEDFD;color:#4338CA;}
  .navmenu[open]>.links a.on{color:#4338CA;font-weight:600;}
  /* The call to action stays a button rather than becoming another list row. */
  .navmenu[open]>.links .btn-cta{margin:6px 3px 3px;padding:12px 19px;text-align:center;color:#fff !important;}
  /* Signed in, the account menu opens in place instead of floating off-screen. */
  .navmenu[open]>.links .usermenu{margin:4px 3px 3px;}
  .navmenu[open]>.links .usermenu>summary{border-color:#E3E4EA;background:#F8F8F8;color:var(--ink);}
  .navmenu[open]>.links .usermenu>summary i,.navmenu[open]>.links .usermenu>summary svg{color:var(--muted);}
  .navmenu[open]>.links .usermenu .umenu{position:static;box-shadow:none;border:none;padding:4px 0 0;min-width:0;}
}

/* ── Editorial rail sections ── */
.rail{display:grid;grid-template-columns:320px 1fr;gap:52px;padding-top:64px;padding-bottom:64px;}
.band-soft{background:#F8F8F8;border-top:1px solid #ECEDF1;}
.band-navy{background:#0B1120;color:#fff;}
.kick2.on-navy{color:#A5A7F7;}
.rail-label h2{margin:14px 0 0;font-size:29px;line-height:1.3;letter-spacing:-.02em;color:#1D293D;}
.rail-label h2.on-navy{color:#fff;}
.ta-line{margin-top:12px;font-family:'Noto Sans Tamil','Inter',sans-serif;font-size:15.5px;line-height:1.7;font-weight:500;color:#4338CA;}
.ta-line.on-navy-sub{color:rgba(255,255,255,.72);}
.rail-label p{margin:14px 0 0;font-size:14.5px;line-height:1.7;font-weight:400;color:#6C727E;}
.rail-link{display:inline-block;margin-top:14px;font-size:14.5px;font-weight:600;color:#4338CA !important;}
.rail-foot{margin-top:6px;font-size:12.5px;line-height:1.65;color:#9AA0AE;}


/* Featured course card */
.feat-card{background:#fff;border:1px solid #D1D4DB;border-radius:14px;overflow:hidden;display:grid;grid-template-columns:300px 1fr;transition:.15s;}
.feat-card:hover{border-color:#6468F0;}
.fthumb{position:relative;background:linear-gradient(135deg,#6468F0,#312D84);display:flex;align-items:center;justify-content:center;min-height:200px;}
.fthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ftag{position:absolute;top:12px;left:12px;background:#fff;color:#1D293D;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;z-index:1;}
.fbody{padding:24px 28px;}
.fprev{display:inline-flex;align-items:center;gap:6px;background:#EAF7F1;border:1px solid #BFE7D4;color:#0F7A4D;font-size:11.5px;font-weight:600;padding:5px 10px;border-radius:999px;}
.fprev svg{width:11px;height:11px;}
.fname{margin-top:10px;font-size:20px;font-weight:600;letter-spacing:-.015em;color:#1D293D;}
.fmeta{margin-top:6px;font-size:13.5px;font-weight:400;color:#45526B;}
.fprice{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap;}
.fprice b{font-size:25px;font-weight:600;letter-spacing:-.02em;color:#1D293D;}
.fprice s{font-size:14px;color:#6C727E;}
.fsave{background:#EDEDFD;color:#4338CA;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;}
.fenroll{margin-left:auto;background:#6468F0;color:#fff;font-size:14px;font-weight:600;padding:12px 22px;border-radius:8px;}
.soon-stack{display:flex;flex-direction:column;gap:14px;margin-top:14px;}
.feat-card.cs .fthumb{background:linear-gradient(135deg,#AEB3C2,#515862);}
.feat-card.cs .fthumb img{filter:grayscale(.65) brightness(.92);}
.fsoon{display:inline-flex;align-items:center;gap:6px;background:#F3F4F6;border:1px solid #E3E4EA;color:#6C727E;font-size:11.5px;font-weight:600;padding:5px 10px;border-radius:999px;}
.fsoon svg{width:11px;height:11px;}
.fmuted{font-size:13.5px;font-weight:500;color:#6C727E;}
.fenroll.outline{background:#fff;color:#1D293D;border:1px solid #D1D4DB;}
.fnote{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:12.5px;color:#6C727E;}
.fnote svg{width:14px;height:14px;color:#3E9B6F;flex:none;}
.feat-card.cs:hover .fenroll.outline{border-color:#6468F0;color:#4338CA;}


/* Footer */
.lv2-foot{background:#0B1120;color:#fff;border-top:1px solid rgba(255,255,255,.12);padding:44px 0 26px;}
.lv2-foot .grid{display:grid;grid-template-columns:1.3fr 1fr .8fr;gap:40px;}
.lv2-foot .lg{height:23px;filter:brightness(0) invert(1);}
.lv2-foot p{margin:13px 0 0;font-size:13.5px;line-height:1.7;font-weight:400;color:rgba(255,255,255,.6);max-width:330px;}
.lv2-foot p span[lang="ta"]{font-family:'Noto Sans Tamil','Inter',sans-serif;}
.lv2-foot .fh{font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);}
.lv2-foot .fitems{margin-top:13px;display:flex;flex-direction:column;gap:8px;font-size:13.5px;font-weight:400;color:rgba(255,255,255,.7);}
.lv2-foot .fitems a{color:rgba(255,255,255,.7) !important;}
.lv2-foot .fitems a:hover{color:#fff !important;}
.lv2-foot .fitems span{line-height:1.6;}
.lv2-foot .bar{margin-top:32px;border-top:1px solid rgba(255,255,255,.12);padding-top:17px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.5);flex-wrap:wrap;gap:8px;}
.lv2-foot .heart{color:#FF6B6B;}


.chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px;}
.chips span{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:rgba(255,255,255,.85);font-size:12.5px;font-weight:500;padding:7px 13px;border-radius:999px;}


/* Navy page head (inner pages) */
.pagehead{position:relative;background:#0B1120;color:#fff;overflow:hidden;}
.pagehead .orb2{position:absolute;top:-180px;right:-140px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(100,104,240,.34),rgba(100,104,240,0) 68%);pointer-events:none;}
.pagehead .inner{position:relative;padding-top:52px;padding-bottom:56px;max-width:760px;}
.pagehead .kick{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#A5A7F7;}
.pagehead h1{margin:16px 0 0;font-size:40px;line-height:1.18;font-weight:600;letter-spacing:-.03em;color:#fff;}
.pagehead .tam{margin-top:12px;font-family:'Noto Sans Tamil',Inter,sans-serif;font-size:18px;font-weight:500;color:rgba(255,255,255,.78);}
.pagehead .lead{margin:14px 0 0;font-size:15.5px;line-height:1.75;font-weight:400;color:rgba(255,255,255,.72);max-width:540px;}
@media(max-width:1024px){
  .wrap2{padding-left:24px;padding-right:24px;}
  .rail{grid-template-columns:1fr;gap:28px;}
  .lv2-foot .grid{grid-template-columns:1fr;gap:28px;}
  .feat-card{grid-template-columns:1fr;}
  .fthumb{min-height:180px;}
  .pagehead h1{font-size:32px;}
}
/* Support strip (shared: landing instructors + courses page) */
.support-strip{margin-top:16px;background:#F8F8F8;border:1px solid #ECEDF1;border-radius:12px;padding:16px 22px;display:flex;align-items:center;gap:26px;font-size:13.5px;font-weight:500;color:#45526B;flex-wrap:wrap;}
.support-strip span{display:inline-flex;align-items:center;gap:8px;}
.support-strip svg{width:15px;height:15px;color:#6468F0;}
.support-strip .when{margin-left:auto;font-size:12.5px;color:#6C727E;}



/* ── Legal Page v2 ── */
.legal2 .ltabs{display:flex;align-items:center;gap:10px;margin-top:22px;flex-wrap:wrap;}
.legal2 .ltabs a{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.06);color:rgba(255,255,255,.85);font-size:13px;font-weight:500;padding:9px 16px;border-radius:999px;}
.legal2 .ltabs a:hover{border-color:rgba(255,255,255,.5);color:#fff;}
.legal2 .ltabs a.on{background:#fff;border-color:#fff;color:#0B1120;font-weight:600;}
.legal2 .lupd{margin-left:14px;font-size:12.5px;color:rgba(255,255,255,.55);}
.legal2 .lbody{padding-top:56px;padding-bottom:64px;grid-template-columns:320px minmax(0,1fr);}
.legal2 .ltoc{position:sticky;top:24px;}
.legal2 .ltoc .items{margin-top:12px;display:flex;flex-direction:column;font-size:13.5px;font-weight:500;}
.legal2 .ltoc .items a{padding:10px 0;border-top:1px solid #ECEDF1;color:#6C727E;}
.legal2 .ltoc .items a:last-child{border-bottom:1px solid #ECEDF1;}
.legal2 .ltoc .items a:hover{color:#1D293D;}
.legal2 .lhelp{margin-top:20px;background:#F8F8F8;border:1px solid #ECEDF1;border-left:3px solid var(--primary);border-radius:0 10px 10px 0;padding:14px 18px;font-size:12.5px;line-height:1.65;color:#45526B;}
.legal2 .lhelp a{color:#4338CA;font-weight:600;}
.legal2 .lprose{max-width:720px;font-size:14.5px;}
.legal2 .lprose h2{font-size:20px;font-weight:600;letter-spacing:-.015em;text-transform:none;color:var(--ink);border-top:none;border-bottom:1px solid #ECEDF1;padding:28px 0 10px;margin:0 0 4px;}
.legal2 .lprose h2:first-child{padding-top:0;}
.legal2 .lprose p{margin:14px 0 0;line-height:1.8;}
.legal2 .lprose ul,.legal2 .lprose ol{margin:12px 0 0;padding-left:22px;}
.legal2 .lprose li{margin:7px 0;line-height:1.7;}
.legal2 [id]{scroll-margin-top:24px;}
@media(max-width:1024px){
  .legal2 .ltoc{position:static;}
}

/* ── Contact Page v2 ── */
.contact2 .hours{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:13px;color:rgba(255,255,255,.6);}
.contact2 .hours svg{width:15px;height:15px;color:#A5A7F7;}
.contact2 .cways{display:flex;flex-direction:column;gap:14px;}
.contact2 .cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.contact2 .cway{border:1px solid #E3E4EA;border-radius:12px;padding:22px;background:#fff;}
.contact2 .cway .ic{width:40px;height:40px;border-radius:10px;background:#EDEDFD;color:#4338CA;display:inline-flex;align-items:center;justify-content:center;}
.contact2 .cway .ic svg{width:19px;height:19px;}
.contact2 .cway .t{margin-top:12px;font-size:16px;font-weight:600;color:var(--ink);}
.contact2 .cway .v{display:block;margin-top:6px;font-size:14px;font-weight:600;color:#4338CA;}
.contact2 .cway .d{margin-top:6px;font-size:12.5px;line-height:1.6;color:#6C727E;}
.contact2 .cway .d.addr{font-size:13px;line-height:1.65;color:#45526B;}
.contact2 .cform{background:#fff;border:1px solid #E3E4EA;border-radius:14px;padding:28px 32px;max-width:640px;}
.contact2 .frow{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;}
.contact2 .csend{display:flex;align-items:center;gap:14px;margin-top:6px;flex-wrap:wrap;}
.contact2 .csend .alt{font-size:12.5px;color:#6C727E;}
.contact2 .csend .alt a{font-weight:600;color:#4338CA;}
@media(max-width:860px){
  .contact2 .cgrid{grid-template-columns:1fr;}
  .contact2 .frow{grid-template-columns:1fr;}
  .contact2 .cform{padding:22px 20px;}
}

/* Dropdown items must not inherit the navy nav's white link color */
.lv2-nav .links .umenu a{color:#45526B;}
.lv2-nav .links .umenu a:hover{background:#EDEDFD;color:#4338CA;}

/* Courses page: coming-soon slate cards (2-col grid) + Tamil title suffixes */
.fnta{font-family:'Noto Sans Tamil',Inter,sans-serif;font-weight:400;color:#6C727E;font-size:.85em;}
.soon2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.scard{display:block;background:#fff;border:1px solid #E3E4EA;border-radius:14px;overflow:hidden;transition:.15s;}
.scard:hover{border-color:#C9CBFA;box-shadow:0 8px 20px rgba(29,41,61,.08);}
.spanel{position:relative;background:#232B3E;min-height:150px;display:flex;align-items:center;justify-content:center;}
.slock{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;display:inline-flex;align-items:center;justify-content:center;}
.slock svg{width:18px;height:18px;}
.sbadge{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;}
.schip{position:absolute;right:12px;bottom:12px;background:rgba(11,17,32,.72);border:1px solid rgba(255,255,255,.16);color:#fff;font-family:'Noto Sans Tamil',Inter,sans-serif;font-size:11px;font-weight:600;padding:5px 10px;border-radius:6px;}
.sbody{padding:20px 24px;}
.st2{font-size:18px;font-weight:600;letter-spacing:-.015em;color:var(--ink);}
.sd{margin-top:5px;font-size:13.5px;font-weight:400;color:#45526B;}
.srow{display:flex;align-items:center;gap:12px;margin-top:14px;}
.srow .fenroll{margin-left:auto;}
.soon2 .support-strip{grid-column:1 / -1;}
.support-strip.on-card{background:#fff;}
@media(max-width:860px){
  .soon2{grid-template-columns:1fr;}
}

/* ── My Courses Page v2 (shares the .acct2 shell) ── */
.myc2 .mychead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;max-width:none;}
.myc2 .pagehead .tam{font-size:15.5px;}
.mystats{display:flex;gap:14px;font-size:12.5px;color:rgba(255,255,255,.72);flex-wrap:wrap;}
.mystats span{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);padding:10px 16px;border-radius:10px;display:flex;flex-direction:column;gap:2px;}
.mystats b{font-size:17px;font-weight:600;color:#fff;font-style:normal;}
.mystats b i{color:rgba(255,255,255,.5);font-style:normal;}
.myc-card{margin-top:14px;cursor:default;}
.myc-card:hover{border-color:#D1D4DB;box-shadow:none;}
.myc-card .fthumb .tprog{position:absolute;left:0;right:0;bottom:0;height:5px;background:rgba(255,255,255,.25);}
.myc-card .fthumb .tprog span{display:block;height:100%;background:#fff;}
.myc-card .myrow{display:flex;align-items:flex-start;gap:10px;}
.myc-card .myrow .fname{flex:1;margin-top:0;}
.myc-card .mychip{display:inline-flex;align-items:center;gap:5px;background:#EAF7F1;border:1px solid #BFE7D4;color:#0F7A4D;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;flex:none;}
.myc-card .mychip svg{width:10px;height:10px;}
.myc-card .mystat-row{display:flex;justify-content:space-between;margin-top:16px;font-size:12px;font-weight:600;color:#6C727E;}
.myc-card .mybar{margin-top:6px;height:6px;background:#E6E8EE;border-radius:999px;overflow:hidden;}
.myc-card .mybar span{display:block;height:100%;background:var(--primary);border-radius:999px;}
.myc-card .myacts{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap;}
.upnx{display:flex;align-items:center;gap:12px;padding:14px 20px;font-size:13.5px;color:#45526B;border-top:1px solid #ECEDF1;}
.upnx:first-child{border-top:none;}
.upnx.first{background:#EDEDFD;color:#3B3F98;font-weight:600;}
.upnx svg{width:14px;height:14px;flex:none;}
.upnx .d{margin-left:auto;font-size:12px;color:#9AA0AE;}
.upnx.first .d{color:#3B3F98;}
.upnx:hover{color:var(--primary);}
.mysoon{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.mysoon-card{border:1px solid #E3E4EA;border-radius:12px;padding:16px 20px;display:flex;align-items:center;gap:12px;background:#fff;}
.mysoon-card svg{width:16px;height:16px;color:#9AA0AE;flex:none;}
.mysoon-card .txt{flex:1;min-width:0;}
.mysoon-card .t{display:block;font-size:14.5px;font-weight:600;color:var(--ink);}
.mysoon-card .d{display:block;font-size:12px;color:#6C727E;margin-top:2px;}
.mysoon-card .nb{border:1px solid #D1D4DB;font-size:12.5px;font-weight:600;color:var(--ink);padding:8px 14px;border-radius:8px;flex:none;}
.mysoon-card:hover .nb{border-color:var(--primary);color:var(--primary);}
@media(max-width:860px){
  .mysoon{grid-template-columns:1fr;}
  .myc-card .myacts .btn{flex:1;}
}