:root{--navy:#0f2a4a;--blue:#1f4f8a;--sky:#2f6db3;--gold:#f2b632;--ink:#16202c;--muted:#5b6573;--line:#d8dee6;--bg:#f5f7fb;--red:#8b1a14}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,"Segoe UI",Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:var(--sky)}
img{max-width:100%}
header.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 24px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.brand img{display:block;height:52px;width:auto}
header.nav nav{display:flex;align-items:center;gap:6px}
header.nav nav a{padding:8px 12px;text-decoration:none;color:var(--ink);font-weight:500;border-radius:8px}
header.nav nav a:hover,header.nav nav a[aria-current]{background:#eef3fa;color:var(--blue)}
.menu-btn{display:none;background:none;border:1px solid var(--line);border-radius:8px;font-size:20px;padding:4px 10px;cursor:pointer}
.btn,header.nav nav a.btn{display:inline-block;background:var(--blue);color:#fff!important;padding:10px 18px;border-radius:10px;text-decoration:none;font-weight:600;border:none;cursor:pointer;font-size:15px}
.btn:hover{background:var(--navy)}
.btn.alt{background:#fff;color:var(--blue)!important;border:1.5px solid var(--blue)}
.btn.gold{background:var(--gold);color:#1b1300!important}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
section{padding:56px 0}
section.tint{background:var(--bg)}
h1,h2,h3{line-height:1.2;color:var(--navy)}
h2{font-size:32px;margin:0 0 10px}
.lead{font-size:18px;color:var(--muted);max-width:720px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:26px 0}
.card{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff;box-shadow:0 1px 2px #0000000a}
.card h3{margin:6px 0 6px;font-size:19px}
.card .ico{font-size:28px}
.muted{color:var(--muted)}
.badge{display:inline-block;font-size:12px;padding:3px 10px;border-radius:12px;background:#e6edf5;color:var(--navy);font-weight:600}
.badge.free{background:#e3f4e8;color:#1e7d3a}.badge.soon{background:#eee;color:#777}
table.t{border-collapse:collapse;width:100%}table.t td,table.t th{border-bottom:1px solid var(--line);padding:10px;text-align:left}
form.auth{max-width:400px}form.auth input{width:100%;padding:11px;border:1px solid var(--line);border-radius:8px;margin:6px 0 12px;font-size:15px}
.msg{padding:10px 14px;border-radius:8px;background:#eef3fa;margin:10px 0}.msg.err{background:#fbe4e2}
.prose{max-width:820px}.prose h2{font-size:22px;margin-top:28px}
/* footer (red) */
footer.site-foot{background:var(--red);color:#f6e7e5;margin-top:48px;font-family:Georgia,"Times New Roman",serif;font-size:15.5px}
.foot-inner{max-width:1160px;margin:0 auto;padding:30px 20px 26px;text-align:center;position:relative}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;margin-bottom:12px}
.foot-links a{color:#fff;font-weight:700;text-decoration:none}.foot-links a:hover{text-decoration:underline}
.foot-links span{color:#d79b95}
.site-foot p{margin:8px auto;max-width:1120px}
.foot-privacy{max-width:640px!important}
.foot-privacy .more{color:#fff;font-weight:700}
.foot-privacy .more-text{display:none}.foot-privacy.open .more-text{display:inline}
.foot-privacy a{color:#fff}
.foot-mail{position:absolute;right:20px;top:24px;width:32px;height:32px;border-radius:8px;background:#ffffff22;color:#fff;text-decoration:none;display:flex;align-items:center;justify-content:center}
@media(max-width:860px){
  .menu-btn{display:block}
  header.nav nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:10px 16px;border-bottom:1px solid var(--line)}
  header.nav.open nav{display:flex}
  .brand img{height:38px}
  h2{font-size:26px}
  .foot-mail{position:static;margin:0 auto 10px}
}
/* ---------- landing: hero carousel ---------- */
.hero{position:relative;overflow:hidden;color:#fff}
.slides{position:relative;height:560px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;display:flex;align-items:center;pointer-events:none}
.slide.on{opacity:1;pointer-events:auto}
.slide .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;width:100%}
.slide h1{font-size:50px;line-height:1.06;margin:12px 0 14px;color:#fff;font-family:Georgia,"Times New Roman",serif}
.slide p{font-size:19px;opacity:.95;max-width:560px;margin:0 0 22px}
.pill{display:inline-block;background:#ffffff26;border:1px solid #ffffff55;border-radius:20px;padding:5px 14px;font-size:14px;font-weight:600;backdrop-filter:blur(4px)}
.s1{background:linear-gradient(120deg,#1a0b5e 0%,#4b2bd6 40%,#c2185b 100%)}
.s2{background:linear-gradient(120deg,#004d40 0%,#00a884 45%,#00c6ff 100%)}
.s3{background:linear-gradient(120deg,#3a0ca3 0%,#9b2de0 45%,#ff4fa3 100%)}
.s4{background:linear-gradient(120deg,#0b1f4d 0%,#1e5eff 50%,#00d4ff 100%)}
.s5{background:linear-gradient(120deg,#b31217 0%,#ff6a00 50%,#ffc300 100%)}
.s6{background:linear-gradient(120deg,#5b0e2d 0%,#d81b60 45%,#ffb300 100%)}
.slide{background-size:180% 180%!important;animation:shift 14s ease infinite}
@keyframes shift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.slide::before,.slide::after{content:"";position:absolute;border-radius:50%;filter:blur(40px);opacity:.45;pointer-events:none}
.slide::before{width:380px;height:380px;background:#ffffff;top:-120px;right:8%;opacity:.14}
.slide::after{width:300px;height:300px;background:#ffd166;bottom:-120px;left:6%;opacity:.22}
.slide .wrap{position:relative;z-index:1}
.slide h1 .glow{background:linear-gradient(90deg,#fff,#ffe08a,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.art{background:#ffffff14;border:1px solid #ffffff33;border-radius:24px;padding:18px;box-shadow:0 20px 50px #0004;backdrop-filter:blur(6px)}
.art svg{display:block;width:100%;height:auto}
.art .mini-av{width:120px;border-radius:16px;overflow:hidden;float:left;margin-right:14px}
.bubble{background:#fff;color:#16202c;border-radius:14px 14px 14px 4px;padding:10px 14px;font-size:15px;margin:6px 0;box-shadow:0 4px 12px #0002}
.bubble.me{background:#f2b632;border-radius:14px 14px 4px 14px;margin-left:30px}
.hero-nav{position:absolute;bottom:18px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:3}
.hero-nav button{width:11px;height:11px;border-radius:6px;border:none;background:#ffffff77;cursor:pointer;padding:0;transition:width .3s}
.hero-nav button.on{width:30px;background:#fff}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;background:#ffffff33;border:none;color:#fff;width:42px;height:42px;border-radius:50%;font-size:22px;cursor:pointer}
.hero-arrow:hover{background:#ffffff55}.hero-arrow.prev{left:14px}.hero-arrow.next{right:14px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:-46px;position:relative;z-index:4}
.stat{background:#fff;border-radius:16px;padding:16px 18px;box-shadow:0 10px 30px #0f2a4a1f;display:flex;gap:12px;align-items:center}
.stat .i{font-size:26px;width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff}
.stat:nth-child(1) .i{background:linear-gradient(135deg,#4b2bd6,#c2185b)}.stat:nth-child(2) .i{background:linear-gradient(135deg,#00a884,#00c6ff)}.stat:nth-child(3) .i{background:linear-gradient(135deg,#ff6a00,#ffc300)}.stat:nth-child(4) .i{background:linear-gradient(135deg,#d81b60,#ffb300)}
.stat b{display:block;font-size:24px;color:var(--navy)}
.stat span{color:var(--muted);font-size:14px}
.ad{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.ad.rev .ad-art{order:-1}
.ad-art{border-radius:20px;padding:20px;background:var(--bg);border:1px solid var(--line)}
.checks{list-style:none;padding:0;margin:14px 0}.checks li{padding:6px 0 6px 30px;position:relative}.checks li::before{content:"✓";position:absolute;left:0;top:5px;width:22px;height:22px;border-radius:50%;background:#e3f4e8;color:#1e7d3a;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:13px}
.compare{border-collapse:separate;border-spacing:0;width:100%;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.compare th,.compare td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left}
.compare thead th{background:var(--navy);color:#fff}
.compare td:last-child{background:#f2f8ff;font-weight:600;color:var(--navy)}
.steps{counter-reset:s}.steps .card{position:relative;padding-top:30px}.steps .card::before{counter-increment:s;content:counter(s);position:absolute;top:-16px;left:20px;width:34px;height:34px;border-radius:50%;background:var(--gold);color:#1b1300;font-weight:800;display:flex;align-items:center;justify-content:center}
.price{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:820px;margin:26px auto 0}
.price .card{padding:26px}.price .card.best{border:2px solid var(--blue);position:relative}
.price .card.best::before{content:"Most popular";position:absolute;top:-13px;right:20px;background:var(--gold);color:#1b1300;font-size:12px;font-weight:700;padding:3px 10px;border-radius:10px}
.amt{font-size:42px;font-weight:800;color:var(--navy)}.amt small{font-size:16px;color:var(--muted);font-weight:500}
details.qa{border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:10px 0;background:#fff}
details.qa summary{cursor:pointer;font-weight:600;color:var(--navy)}
.cta{background:linear-gradient(120deg,#4b2bd6,#c2185b 55%,#ff6a00);color:#fff;border-radius:24px;padding:40px;text-align:center}
.cta h2{color:#fff}
@media(max-width:860px){
  .slides{height:640px}.slide .wrap{grid-template-columns:1fr}.slide h1{font-size:34px}.slide p{font-size:16px}
  .slide .art{display:none}
  .stats{grid-template-columns:1fr 1fr;margin-top:-30px}
  .ad{grid-template-columns:1fr}.ad.rev .ad-art{order:0}
  .hero-arrow{display:none}
}

/* colorful feature cards */
.fcards .card{border:none;color:#fff;box-shadow:0 12px 30px #0002;transition:transform .2s}
.fcards .card:hover{transform:translateY(-4px)}
.fcards .card h3{color:#fff}.fcards .card p{color:#ffffffe6}
.fcards .card:nth-child(6n+1){background:linear-gradient(135deg,#4b2bd6,#8e44ff)}
.fcards .card:nth-child(6n+2){background:linear-gradient(135deg,#00a884,#00c6ff)}
.fcards .card:nth-child(6n+3){background:linear-gradient(135deg,#ff6a00,#ffb300)}
.fcards .card:nth-child(6n+4){background:linear-gradient(135deg,#d81b60,#ff6f91)}
.fcards .card:nth-child(6n+5){background:linear-gradient(135deg,#1e5eff,#00d4ff)}
.fcards .card:nth-child(6n+6){background:linear-gradient(135deg,#9b2de0,#ff4fa3)}
.rainbow{background:linear-gradient(90deg,#4b2bd6,#c2185b,#ff6a00,#00a884,#1e5eff);height:5px;border-radius:5px;width:120px;margin:10px 0 18px}
section.glam{background:linear-gradient(180deg,#fff7fb 0%,#f3f0ff 50%,#eefcff 100%)}
/* photo hero + animations */
.slide{background:none!important;animation:none}
.slide .bgimg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.08);transition:transform 7s ease-out}
.slide.on .bgimg{transform:scale(1.18)}
.slide .overlay{position:absolute;inset:0;opacity:.86;background-size:180% 180%;animation:shift 14s ease infinite}
.s1 .overlay{background-image:linear-gradient(120deg,#1a0b5e 0%,#4b2bd6 45%,#c2185bcc 100%)}
.s2 .overlay{background-image:linear-gradient(120deg,#004d40 0%,#00a884 50%,#00c6ffbb 100%)}
.s3 .overlay{background-image:linear-gradient(120deg,#3a0ca3 0%,#9b2de0 50%,#ff4fa3bb 100%)}
.s4 .overlay{background-image:linear-gradient(120deg,#0b1f4d 0%,#1e5eff 55%,#00d4ffbb 100%)}
.s5 .overlay{background-image:linear-gradient(120deg,#b31217 0%,#ff6a00 55%,#ffc300bb 100%)}
.s6 .overlay{background-image:linear-gradient(120deg,#5b0e2d 0%,#d81b60 50%,#ffb300bb 100%)}
.slide::before,.slide::after{z-index:1}
.slide .txt{opacity:0;transform:translateY(24px);transition:all .9s .2s cubic-bezier(.2,.8,.2,1)}
.slide.on .txt{opacity:1;transform:none}
.slide .art{opacity:0;transform:translateX(40px) scale(.96);transition:all 1s .45s cubic-bezier(.2,.8,.2,1)}
.slide.on .art{opacity:1;transform:none}
.floaters{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.floaters span{position:absolute;font-size:30px;opacity:.35;animation:floatUp 16s linear infinite}
.floaters span:nth-child(1){left:6%;animation-delay:0s}.floaters span:nth-child(2){left:22%;animation-delay:3s;font-size:24px}
.floaters span:nth-child(3){left:44%;animation-delay:6s}.floaters span:nth-child(4){left:61%;animation-delay:9s;font-size:22px}
.floaters span:nth-child(5){left:78%;animation-delay:2s}.floaters span:nth-child(6){left:92%;animation-delay:11s;font-size:26px}
@keyframes floatUp{0%{transform:translateY(620px) rotate(0)}100%{transform:translateY(-120px) rotate(40deg)}}
.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.photos figure{margin:0;border-radius:20px;overflow:hidden;position:relative;box-shadow:0 14px 34px #0f2a4a2a;aspect-ratio:3/4;background:#ddd}
.photos img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.photos figure:hover img{transform:scale(1.07)}
.photos figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 14px;color:#fff;font-weight:700;background:linear-gradient(transparent,#000a)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.slide .bgimg,.floaters span,.slide .overlay{animation:none;transition:none}.reveal{opacity:1;transform:none}}
@media(max-width:860px){.photos{grid-template-columns:1fr 1fr}}
.slide .wrap{z-index:2}
.badge.pro{background:linear-gradient(90deg,#4b2bd6,#c2185b);color:#fff}
.exam-card.locked{background:linear-gradient(180deg,#fff,#f7f3ff)}

/* ================= v2: Times New Roman, big logo, colorful left menu, drawer, vibrant ================= */
:root{--v1:#6a1bff;--v2:#00a884;--v3:#ff6a00;--v4:#e0115f;--v5:#1e5eff;--sun:#ffd60a}
html{font-size:16px}
body{font-family:"Times New Roman",Times,serif;font-size:12pt;line-height:1.6;background:#fff}
h1,h2,h3,h4{font-family:"Times New Roman",Times,serif;font-weight:700;letter-spacing:-.01em}
h2{font-size:34px}
.lead{font-size:13.5pt}
button,input,select,textarea{font-family:inherit}
body.noscroll{overflow:hidden}
/* header */
header.nav{justify-content:flex-start;gap:18px;padding:10px 26px;min-height:104px;border-bottom:0;
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,var(--v1),var(--v4),var(--v3),var(--sun),var(--v2),var(--v5)) border-box;border-bottom:4px solid transparent;box-shadow:0 6px 24px #2a0e6e14}
.brand img{height:84px;width:auto}
.menu-btn{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border:none;border-radius:14px;font-size:26px;color:#fff;cursor:pointer;
  background:linear-gradient(135deg,var(--v1),var(--v4));box-shadow:0 6px 16px #6a1bff40;flex:0 0 auto}
.menu-btn:hover{filter:brightness(1.08)}
nav.mainnav{display:flex;align-items:center;gap:6px;margin-left:8px}
.mainnav .mi{position:relative}
.mainnav .mi>a.top{display:flex;align-items:center;gap:6px;padding:12px 16px;border-radius:12px;font-weight:800;font-size:19px;text-decoration:none;transition:background .15s,transform .15s}
.mainnav .mi>a.top .car{font-size:13px;opacity:.75}
.mainnav .c1>a.top{color:var(--v1)}.mainnav .c2>a.top{color:var(--v2)}.mainnav .c3>a.top{color:var(--v3)}.mainnav .c4>a.top{color:var(--v4)}
.mainnav .c1>a.top:hover,.mainnav .c1>a.top[aria-current]{background:#f1eaff}
.mainnav .c2>a.top:hover,.mainnav .c2>a.top[aria-current]{background:#e2f8f2}
.mainnav .c3>a.top:hover,.mainnav .c3>a.top[aria-current]{background:#fff0e3}
.mainnav .c4>a.top:hover,.mainnav .c4>a.top[aria-current]{background:#ffe7f0}
.mainnav .dd{position:absolute;top:100%;left:0;min-width:250px;padding:8px;margin-top:0;background:#fff;border-radius:0 14px 14px 14px;box-shadow:0 18px 40px #1b0b4a2e;
  opacity:0;visibility:hidden;transform:translateY(6px);transition:all .16s;z-index:30;border-top:4px solid currentColor}
.mainnav .c1 .dd{color:var(--v1)}.mainnav .c2 .dd{color:var(--v2)}.mainnav .c3 .dd{color:var(--v3)}.mainnav .c4 .dd{color:var(--v4)}
.mainnav .mi:hover .dd,.mainnav .mi:focus-within .dd,.mainnav .mi.open .dd{opacity:1;visibility:visible;transform:none}
.mainnav .dd a{display:block;padding:10px 14px;border-radius:10px;color:#1b1f2a;font-weight:700;font-size:16px;text-decoration:none}
.mainnav .dd a:hover{background:#f6f3ff;color:inherit}
.mainnav .c1 .dd a:hover{color:var(--v1)}.mainnav .c2 .dd a:hover{color:var(--v2)}.mainnav .c3 .dd a:hover{color:var(--v3)}.mainnav .c4 .dd a:hover{color:var(--v4)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.nav-right .signin{font-weight:800;font-size:18px;color:var(--v5);text-decoration:none;padding:10px 14px;border-radius:12px}
.nav-right .signin:hover{background:#e8efff}
a.signup{display:inline-block;background:var(--sun);color:#1b1300!important;font-weight:800;font-size:18px;padding:12px 24px;border-radius:14px;text-decoration:none;
  box-shadow:0 0 0 3px #fff3a6,0 8px 24px #ffd60a99,0 0 28px #ffe14d;transition:transform .15s,box-shadow .15s}
a.signup:hover{transform:translateY(-2px);box-shadow:0 0 0 3px #fff3a6,0 12px 30px #ffc400bb,0 0 40px #ffe14d}
/* drawer */
.drawer-back{position:fixed;inset:0;background:#12062e80;z-index:40;backdrop-filter:blur(2px)}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(340px,88vw);background:#fff;z-index:41;transform:translateX(-102%);transition:transform .25s ease;overflow:auto;
  box-shadow:12px 0 40px #1b0b4a40;border-right:5px solid transparent;border-image:linear-gradient(var(--v1),var(--v4),var(--v3),var(--sun),var(--v2)) 1}
.drawer.open{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #eee}
.drawer-head img{height:56px;width:auto;display:block}
.drawer-x{border:none;background:#f3effe;color:var(--v1);font-size:28px;width:44px;height:44px;border-radius:12px;cursor:pointer}
.drawer .dhome{display:block;padding:14px 20px;font-weight:800;font-size:18px;color:#1b1f2a;text-decoration:none}
.drawer details.dg{border-top:1px solid #f0f0f4}
.drawer details.dg summary{list-style:none;cursor:pointer;padding:14px 20px;font-weight:800;font-size:19px;display:flex;justify-content:space-between}
.drawer details.dg summary::-webkit-details-marker{display:none}
.drawer details.dg summary::after{content:"▸";transition:transform .2s}
.drawer details.dg[open] summary::after{transform:rotate(90deg)}
.drawer .c1 summary{color:var(--v1)}.drawer .c2 summary{color:var(--v2)}.drawer .c3 summary{color:var(--v3)}.drawer .c4 summary{color:var(--v4)}
.drawer details.dg a{display:block;padding:10px 20px 10px 36px;color:#1b1f2a;font-weight:700;text-decoration:none;border-left:4px solid transparent}
.drawer .c1 a:hover{border-color:var(--v1);background:#f6f1ff}.drawer .c2 a:hover{border-color:var(--v2);background:#ebfaf6}
.drawer .c3 a:hover{border-color:var(--v3);background:#fff4ea}.drawer .c4 a:hover{border-color:var(--v4);background:#fff0f5}
.drawer-foot{padding:18px 20px;display:grid;gap:12px;border-top:1px solid #eee}
.drawer-foot .signup{text-align:center}
.drawer-foot .dsign{text-align:center;font-weight:800;color:var(--v5)}
@media(max-width:1100px){nav.mainnav{display:none}.brand img{height:68px}header.nav{min-height:88px}}
@media(max-width:600px){.brand img{height:52px}header.nav{padding:8px 12px;gap:10px;min-height:74px}.nav-right .signin{display:none}a.signup{padding:10px 16px;font-size:16px}.menu-btn{width:46px;height:46px}}
/* override old mobile dropdown rules */
@media(max-width:860px){header.nav nav.mainnav{display:none!important}}
/* buttons more vibrant */
.btn,a.btn{background:linear-gradient(135deg,var(--v1),var(--v4));box-shadow:0 8px 20px #6a1bff33}
.btn:hover{background:linear-gradient(135deg,#5410d8,#c00d52)}
.btn.alt{background:#fff}
.btn.gold{background:var(--sun);box-shadow:0 0 22px #ffe14d99}
/* image cards */
.card .cimg{display:block;width:calc(100% + 44px);margin:-22px -22px 14px;height:170px;object-fit:cover;border-radius:16px 16px 0 0}
.fcards .card{padding:22px;overflow:hidden}
.fcards .card .cimg{border-bottom:4px solid #ffffff66}
.grid.fcards{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.teach .card{border:none;color:#fff;overflow:hidden;box-shadow:0 12px 30px #0002;transition:transform .2s}
.teach .card:hover{transform:translateY(-4px)}
.teach .card h3{color:#fff}.teach .card p.muted{color:#ffffffe8}
.teach .card:nth-child(7n+1){background:linear-gradient(135deg,#6a1bff,#b84dff)}
.teach .card:nth-child(7n+2){background:linear-gradient(135deg,#00a884,#00c6ff)}
.teach .card:nth-child(7n+3){background:linear-gradient(135deg,#ff6a00,#ffb300)}
.teach .card:nth-child(7n+4){background:linear-gradient(135deg,#e0115f,#ff6f91)}
.teach .card:nth-child(7n+5){background:linear-gradient(135deg,#1e5eff,#00d4ff)}
.teach .card:nth-child(7n+6){background:linear-gradient(135deg,#9b2de0,#ff4fa3)}
.teach .card:nth-child(7n+7){background:linear-gradient(135deg,#0f9d58,#a4e400)}
.teach .card .ico{display:none}
section.tint{background:linear-gradient(180deg,#f7f3ff,#eefbff)}
/* pricing: three plans */
.price.three{grid-template-columns:repeat(auto-fit,minmax(270px,1fr));max-width:1100px}
.price .card.plan{border:none;box-shadow:0 14px 34px #1b0b4a1f;display:flex;flex-direction:column}
.price .card.plan .btn,.price .card.plan button.btn{margin-top:auto;align-self:flex-start}
.price .card.plan.p1{border-top:6px solid var(--v2)}.price .card.plan.p2{border-top:6px solid var(--v1)}.price .card.plan.p3{border-top:6px solid var(--v4)}
.price .card.best::before{content:"Best value"}
.amt small{font-size:15px}
.plan .sub{color:var(--muted);font-weight:700;margin:-4px 0 8px}
.plan .checks li.no{color:#9a9fa8}.plan .checks li.no::before{content:"✕";background:#f1f1f3;color:#9a9fa8}
.mainnav .c3 .dd{min-width:440px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.mainnav .c3 .dd a:first-child,.mainnav .c3 .dd a:last-child{grid-column:1/-1}
/* v2 fixes */
html,body{overflow-x:clip}
header.nav .brand{flex:0 0 auto}
.mainnav .mi>a.top,.nav-right a{white-space:nowrap}
.card .cimg{max-width:none}
@media(max-width:1240px){header.nav nav.mainnav{display:none}}
@media(min-width:1241px) and (max-width:1420px){.mainnav .mi>a.top{font-size:17px;padding:10px 11px}.brand img{height:74px}}

/* v2 fix2: deep menu colors */
.mainnav .c1>a.top{color:#3d0a9e}.mainnav .c2>a.top{color:#00634d}.mainnav .c3>a.top{color:#b33600}.mainnav .c4>a.top{color:#9c0039}
.mainnav .c1 .dd{color:#3d0a9e}.mainnav .c2 .dd{color:#00634d}.mainnav .c3 .dd{color:#b33600}.mainnav .c4 .dd{color:#9c0039}
.mainnav .c1 .dd a:hover{color:#3d0a9e}.mainnav .c2 .dd a:hover{color:#00634d}.mainnav .c3 .dd a:hover{color:#b33600}.mainnav .c4 .dd a:hover{color:#9c0039}
.drawer .c1 summary{color:#3d0a9e}.drawer .c2 summary{color:#00634d}.drawer .c3 summary{color:#b33600}.drawer .c4 summary{color:#9c0039}
.nav-right .signin{color:#0b2f9e}

/* v2 fix3: logo fits small phones */
@media(max-width:600px){.brand img{height:44px}}
@media(max-width:420px){.brand img{height:30px}header.nav{gap:8px}a.signup{padding:8px 12px;font-size:15px}}

/* ================= Bigger header logo ================= */
.brand img{height:112px;width:auto}
header.nav{min-height:132px}
@media(min-width:1241px) and (max-width:1420px){.brand img{height:96px}header.nav{min-height:118px}}
@media(max-width:1100px){.brand img{height:86px}header.nav{min-height:104px}}
@media(max-width:600px){.brand img{height:60px}header.nav{min-height:82px}}
@media(max-width:420px){.brand img{height:44px}}
.drawer-head img{height:72px}

/* ================= CLIABoardTests: per-exam color schemes ================= */
/* The hub keeps the full multicolor palette. Exam pages (body[data-exam]) set --t1/--t2/--t3/--tdark/--tsoft from public/js/exams.js. */
:root{--t1:#6a1bff;--t2:#e0115f;--t3:#ff6a00;--tdark:#1a0b5e;--tsoft:#f6f3ff}
.brand img{height:96px}
header.nav{min-height:118px}
@media(min-width:1241px) and (max-width:1420px){.brand img{height:82px}header.nav{min-height:104px}}
@media(max-width:1100px){.brand img{height:76px}header.nav{min-height:96px}}
@media(max-width:600px){.brand img{height:50px}header.nav{min-height:74px}}
@media(max-width:420px){.brand img{height:36px}}
body[data-exam] header.nav{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,var(--t1),var(--t2),var(--sun),var(--t3),var(--t1)) border-box}
body[data-exam] .btn,body[data-exam] a.btn{background:linear-gradient(135deg,var(--t1),var(--t2));box-shadow:0 8px 20px color-mix(in srgb,var(--t1) 30%,transparent)}
body[data-exam] .btn:hover{filter:brightness(1.08)}
body[data-exam] .btn.alt{background:#fff;color:var(--t1)!important;border-color:var(--t1)}
body[data-exam] .btn.gold{background:var(--sun);color:#1b1300!important}
body[data-exam] .menu-btn{background:linear-gradient(135deg,var(--t1),var(--t2))}
body[data-exam] .mainnav .c1>a.top,body[data-exam] .mainnav .c1 .dd,body[data-exam] .drawer .c1 summary{color:var(--tdark)}
body[data-exam] .mainnav .c2>a.top,body[data-exam] .mainnav .c2 .dd,body[data-exam] .drawer .c2 summary{color:color-mix(in srgb,var(--t1) 80%,#000)}
body[data-exam] .mainnav .c3>a.top,body[data-exam] .mainnav .c3 .dd,body[data-exam] .drawer .c3 summary{color:color-mix(in srgb,var(--t2) 75%,#000)}
body[data-exam] .mainnav .mi>a.top:hover,body[data-exam] .mainnav .mi>a.top[aria-current]{background:var(--tsoft)}
body[data-exam] .rainbow{background:linear-gradient(90deg,var(--t1),var(--t2),var(--sun),var(--t3))}
body[data-exam] footer.site-foot{background:var(--tdark)}
body[data-exam] .foot-links span{color:color-mix(in srgb,var(--t3) 60%,#fff)}
body[data-exam] section.glam{background:linear-gradient(180deg,#fff 0%,var(--tsoft) 60%,#fff 100%)}
body[data-exam] section.tint{background:linear-gradient(180deg,var(--tsoft),#fff)}
body[data-exam] .cta{background:linear-gradient(120deg,var(--tdark),var(--t1) 50%,var(--t2))}
body[data-exam] .compare thead th{background:var(--tdark)}
body[data-exam] .compare td:last-child{background:var(--tsoft);color:var(--tdark)}
body[data-exam] h1:not(.slide h1),body[data-exam] h2:not(.cta h2),body[data-exam] h3:not(.fcards h3,.teach h3){color:var(--tdark)}
body[data-exam] .badge.pro{background:linear-gradient(90deg,var(--t1),var(--t2))}
body[data-exam] .stat b{color:var(--tdark)}
body[data-exam] .stat:nth-child(1) .i{background:linear-gradient(135deg,var(--t1),var(--t2))}
body[data-exam] .stat:nth-child(2) .i{background:linear-gradient(135deg,var(--t2),var(--t3))}
body[data-exam] .stat:nth-child(3) .i{background:linear-gradient(135deg,var(--tdark),var(--t1))}
body[data-exam] .stat:nth-child(4) .i{background:linear-gradient(135deg,var(--t3),#ffd60a)}
/* exam-colored hero overlays: six variations of the exam palette */
body[data-exam] .s1 .overlay{background-image:linear-gradient(120deg,var(--tdark) 0%,var(--t1) 50%,var(--t2) 100%)}
body[data-exam] .s2 .overlay{background-image:linear-gradient(120deg,var(--t1) 0%,var(--t2) 55%,var(--t3) 100%)}
body[data-exam] .s3 .overlay{background-image:linear-gradient(120deg,var(--tdark) 0%,var(--t2) 55%,#ffb300 100%)}
body[data-exam] .s4 .overlay{background-image:linear-gradient(120deg,#0b1020 0%,var(--tdark) 35%,var(--t1) 100%)}
body[data-exam] .s5 .overlay{background-image:linear-gradient(120deg,var(--t2) 0%,var(--t1) 55%,var(--tdark) 100%)}
body[data-exam] .s6 .overlay{background-image:linear-gradient(120deg,var(--tdark) 0%,var(--t3) 50%,#ffd60a 100%)}
body[data-exam] .fcards .card:nth-child(3n+1){background:linear-gradient(135deg,var(--tdark),var(--t1))}
body[data-exam] .fcards .card:nth-child(3n+2){background:linear-gradient(135deg,var(--t1),var(--t2))}
body[data-exam] .fcards .card:nth-child(3n+3){background:linear-gradient(135deg,var(--t2),var(--t3))}
/* animated decorative layer for slides without a photo */
.slide .pattern{position:absolute;inset:0;z-index:0;opacity:.18;background-image:radial-gradient(#fff 1.2px,transparent 1.4px),radial-gradient(#fff 1.2px,transparent 1.4px);background-size:34px 34px;background-position:0 0,17px 17px;animation:drift 30s linear infinite}
@keyframes drift{to{background-position:340px 170px,357px 187px}}
.slide .orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.35;z-index:0;animation:bob 9s ease-in-out infinite}
.slide .orb.o1{width:220px;height:220px;right:6%;top:12%;background:radial-gradient(circle at 30% 30%,#fff,transparent 70%)}
.slide .orb.o2{width:140px;height:140px;left:44%;bottom:10%;background:radial-gradient(circle at 30% 30%,#ffd60a,transparent 70%);animation-delay:-3s}
@keyframes bob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-22px) scale(1.06)}}
.art .draw{stroke-dasharray:900;stroke-dashoffset:900}
.slide.on .art .draw{animation:drawin 2.4s .8s ease forwards}
.slide.on .art .draw:nth-of-type(2){animation-delay:1.3s}.slide.on .art .draw:nth-of-type(3){animation-delay:1.8s}.slide.on .art .draw:nth-of-type(4){animation-delay:2.3s}
@keyframes drawin{to{stroke-dashoffset:0}}
.slide.on .bubble{animation:pop .5s both}
.slide.on .bubble:nth-child(2){animation-delay:.9s}.slide.on .bubble:nth-child(3){animation-delay:1.8s}.slide.on .bubble:nth-child(4){animation-delay:2.7s}.slide.on .bubble:nth-child(5){animation-delay:3.4s}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.wave rect{transform-origin:center;animation:eq 1.1s ease-in-out infinite}
.wave rect:nth-child(3n){animation-delay:-.3s}.wave rect:nth-child(3n+1){animation-delay:-.6s}
@keyframes eq{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.slide .pattern,.slide .orb,.wave rect,.slide.on .bubble,.slide.on .art .draw{animation:none}.art .draw{stroke-dashoffset:0}}
/* hub: exam cards */
.exams-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:26px 0}
.xcard{position:relative;border-radius:20px;padding:22px 22px 20px;color:#fff;text-decoration:none;overflow:hidden;box-shadow:0 14px 34px #0f1b3d26;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;min-height:240px}
.xcard:hover{transform:translateY(-5px);box-shadow:0 20px 44px #0f1b3d40}
.xcard .xname{font-family:Arial,Helvetica,sans-serif;font-size:34px;font-weight:900;letter-spacing:.5px;line-height:1}
.xcard .xfull{font-weight:700;opacity:.92;margin:4px 0 10px}
.xcard p{margin:0 0 14px;color:#ffffffe8;font-size:15px}
.xcard .xmeta{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px}
.xcard .xmeta span{background:#ffffff26;border:1px solid #ffffff4d;border-radius:20px;padding:2px 10px;font-size:13px;font-weight:700}
.xcard .xemoji{position:absolute;right:14px;top:10px;font-size:40px;opacity:.5}
.xcard .xgo{margin-top:12px;font-weight:800}
.sisters{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.sisters a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:12px;background:#fff;border:2px solid var(--line);text-decoration:none;font-weight:800;color:#1b1f2a}
.sisters a i{width:12px;height:12px;border-radius:50%;display:inline-block}
.sisters a:hover{border-color:currentColor}
.people{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.people figure{margin:0;border-radius:20px;overflow:hidden;position:relative;aspect-ratio:1;box-shadow:0 14px 34px #0f2a4a2a;background:#ddd}
.people img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.people figure:hover img{transform:scale(1.06)}
.people figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 12px 12px;color:#fff;font-weight:700;font-size:15px;background:linear-gradient(transparent,#000b)}
.imgnote{font-size:13px;color:var(--muted);margin-top:10px}
@media(max-width:860px){.people{grid-template-columns:1fr 1fr}}
.exam-switch{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.exam-switch a{padding:6px 12px;border-radius:20px;font-weight:800;font-size:14px;text-decoration:none;color:#fff}
.exam-switch a[aria-current]{outline:3px solid #ffd60a;outline-offset:2px}
.mainnav .cx .dd{min-width:300px}
.mainnav .cx>a.top,.drawer .cx summary{color:#0b2f9e}
.dd a .dot,.drawer a .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:middle}
.topicgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:18px}
.topicgrid .card h3{margin-top:0}
.topicgrid .card ul{margin:0;padding-left:0;list-style:none}
.topicgrid .card li{margin:4px 0}
.topicgrid .card li a{font-weight:700;text-decoration:none}
.topicgrid .card li a:hover{text-decoration:underline}
.art .bubble{overflow:hidden}
.art .mini-av{position:relative;z-index:1}
@media(min-width:1301px) and (max-width:1600px){.mainnav .mi>a.top{font-size:16px;padding:10px 8px}.mainnav .mi>a.top .car{display:none}.brand img{height:76px}header.nav{min-height:100px;gap:12px}.nav-right .signin{font-size:16px;padding:8px}a.signup{padding:10px 16px;font-size:16px}}
@media(max-width:1300px){header.nav nav.mainnav{display:none}}
/* responsive AVIF/WebP images (scripts/images.py): the <picture> wrapper does not change layout */
picture{display:contents}

/* raw SVG figures and SVG answer choices (DAT PAT, NMAT figures) */
.fg-raw svg{display:block;max-width:100%;width:300px;height:auto;max-height:300px;margin:6px auto;background:#fff}
.ctext svg{width:120px;height:120px;vertical-align:middle;background:#fff;border:1px solid #d9dee6;border-radius:6px}
.mainnav .dd{max-height:78vh;overflow-y:auto}.mainnav .c3 .dd a{font-size:15px;padding:8px 12px}
/* ================= v3: multicolor menus — every item gets its own vivid color ================= */
.mainnav .dd a,.drawer details.dg a{--mc:#2563eb;color:var(--mc)!important;font-weight:800;border-left:4px solid var(--mc);margin:2px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--mc) 8%,#fff),#fff 70%)}
.mainnav .dd a:hover,.drawer details.dg a:hover{background:color-mix(in srgb,var(--mc) 16%,#fff)!important;color:var(--mc)!important;transform:translateX(2px)}
.mainnav .dd a:nth-child(10n+1),.drawer details.dg a:nth-of-type(10n+1){--mc:#2563eb}
.mainnav .dd a:nth-child(10n+2),.drawer details.dg a:nth-of-type(10n+2){--mc:#e11d48}
.mainnav .dd a:nth-child(10n+3),.drawer details.dg a:nth-of-type(10n+3){--mc:#059669}
.mainnav .dd a:nth-child(10n+4),.drawer details.dg a:nth-of-type(10n+4){--mc:#7c3aed}
.mainnav .dd a:nth-child(10n+5),.drawer details.dg a:nth-of-type(10n+5){--mc:#ea580c}
.mainnav .dd a:nth-child(10n+6),.drawer details.dg a:nth-of-type(10n+6){--mc:#0891b2}
.mainnav .dd a:nth-child(10n+7),.drawer details.dg a:nth-of-type(10n+7){--mc:#db2777}
.mainnav .dd a:nth-child(10n+8),.drawer details.dg a:nth-of-type(10n+8){--mc:#16a34a}
.mainnav .dd a:nth-child(10n+9),.drawer details.dg a:nth-of-type(10n+9){--mc:#c2410c}
.mainnav .dd a:nth-child(10n+10),.drawer details.dg a:nth-of-type(10n+10){--mc:#4f46e5}
.drawer details.dg a{display:block;padding:10px 20px 10px 18px;text-decoration:none;font-size:16px}
.mainnav .mi>a.top{letter-spacing:.2px}

/* ================= NES-NYSTCE layer (header, menus, bright banners, exam explorer) ================= */
:root{--nn-blue:#1B4E9B;--nn-navy:#0D2244;--nn-teal:#0F7C8A;--nn-green:#138A4E;--nn-violet:#6A2FB8;--nn-coral:#D23A31;--nn-magenta:#B5257E;--nn-gold:#FFB627;--sun:#FFD60A}
/* white header with the multicolor rule underneath */
header.nav,body[data-exam] header.nav{min-height:96px;padding:8px 22px;gap:14px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#1B4E9B,#0F7C8A,#138A4E,#FFB627,#D23A31,#6A2FB8) border-box;border-bottom:4px solid transparent}
.brand.nn{display:flex;align-items:center;gap:12px;text-decoration:none;flex:0 0 auto}
.brand.nn img{height:60px!important;width:60px;display:block}
.nnw{display:flex;flex-direction:column;line-height:1}
.nnw b{font-family:Barlow,"Arial Narrow",Arial,sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;font-size:34px;letter-spacing:.5px;color:#0D2244}
.nnw b i{font-style:italic;color:#F0A21A}
.nnw small{font-family:Arial,Helvetica,sans-serif;font-weight:800;font-size:10.5px;letter-spacing:1px;color:#1B4E9B;margin-top:6px;white-space:nowrap}
.nnw em{font-family:Arial,Helvetica,sans-serif;font-style:normal;font-size:12.5px;color:#8a5a00;margin-top:3px;font-weight:700}
.menu-btn,body[data-exam] .menu-btn{background:linear-gradient(135deg,#1B4E9B,#0F7C8A)}
.mainnav .mi>a.top{font-family:Arial,Helvetica,sans-serif;font-size:17px;font-weight:800;padding:10px 12px;color:var(--mc)!important;position:relative}
.mainnav .mi>a.top::after{content:"";position:absolute;left:10px;right:10px;bottom:2px;height:3px;border-radius:3px;background:var(--mc);transform:scaleX(0);transition:transform .15s}
.mainnav .mi>a.top:hover,.mainnav .mi.open>a.top,.mainnav .mi:focus-within>a.top,.mainnav .mi>a.top[aria-current]{background:color-mix(in srgb,var(--mc) 12%,#fff)!important}
.mainnav .mi:hover>a.top::after,.mainnav .mi.open>a.top::after,.mainnav .mi:focus-within>a.top::after{transform:none}
.mainnav .mi:hover>a.top::before,.mainnav .mi.open>a.top::before{content:"";position:absolute;left:0;right:0;bottom:-20px;height:20px}
.mainnav .dd{border-top:4px solid var(--mc)!important;color:var(--mc)!important;font-family:Arial,Helvetica,sans-serif}
.mainnav .dd.wide{width:460px;max-height:70vh;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:2px 6px;align-content:start;padding:10px;border-radius:0 14px 14px 14px;box-shadow:0 22px 50px #0d22443a}
.mainnav .dd.wide>*{grid-column:auto}
.mainnav .dd.wide .full,.mainnav .dd.wide .gh,.mainnav .dd.wide .ddq{grid-column:1/-1}
.mainnav .dd a,.drawer details.dg a{font-family:Georgia,"Times New Roman",serif}
.dd .gh,.drawer .gh{display:flex;align-items:center;gap:6px;margin:10px 2px 2px;padding:4px 6px;font:800 12px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:var(--gc);border-bottom:2px solid color-mix(in srgb,var(--gc) 35%,#fff)}
.dd .gh svg,.drawer .gh svg{width:16px;height:16px;flex:0 0 auto}
.ddq{width:100%;padding:9px 12px;border:2px solid #d7dfee;border-radius:10px;font:15px Arial,Helvetica,sans-serif;margin:2px 0 6px;position:sticky;top:-10px;z-index:2;background:#fff}
.ddq:focus{outline:none;border-color:var(--mc)}
.dd a .live,.drawer a .live,.live-b{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:9px;background:#138A4E;color:#fff;font:800 10.5px/1.6 Arial,sans-serif;letter-spacing:.4px;vertical-align:1px}
.mainnav .dd.wide a{font-size:14px!important;padding:7px 10px!important;line-height:1.3}
.mainnav .dd a.full{--mc:#1B4E9B!important;font-family:Arial,Helvetica,sans-serif;font-weight:900}
.nav-right .signin{color:#1B4E9B!important;font-family:Arial,Helvetica,sans-serif}
a.signup{background:#FFD60A;font-family:Arial,Helvetica,sans-serif}
.drawer-head img{height:auto!important;width:min(250px,70vw)}
.drawer details.dg{border-left:6px solid var(--mc)}
.drawer details.dg summary{color:var(--mc)!important;font-family:Arial,Helvetica,sans-serif}
.drawer .ddq{position:static;margin:6px 16px;width:calc(100% - 32px)}
.drawer details.dg .acc{max-height:60vh;overflow:auto}
@media(max-width:1300px){header.nav nav.mainnav{display:none}}
@media(max-width:700px){.nnw small{display:none}.nnw b{font-size:26px}.brand.nn img{height:46px!important;width:46px}header.nav,body[data-exam] header.nav{min-height:70px;padding:8px 12px}}
@media(max-width:400px){.nnw b{font-size:21px}.brand.nn{gap:8px}.brand.nn img{height:38px!important;width:38px}.nnw em{display:none}}
/* footer: navy */
footer.site-foot,body[data-exam] footer.site-foot{background:#0D2244;font-family:Arial,Helvetica,sans-serif;font-size:15px}
.foot-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;margin-bottom:6px}
.foot-brand img{width:46px;height:auto}
.foot-brand .nnw b{color:#fff;font-size:28px}.foot-brand .nnw b i{color:#FFB627}.foot-brand .nnw em{color:#FFD879;font-weight:400}
.foot-disclaimer{max-width:900px!important;color:#cfd8ea;font-size:14px}
.foot-links span{color:#7f93bb!important}
/* bright, vibrant banners: light gradient wash over the photo, readable copy panel, shine on the headline */
.hero.bright .slide .overlay{opacity:1;animation:none;background-size:auto}
.hero.bright .slide .bgimg{transform:scale(1.04);transition:none}
.hero.bright .slide.on .bgimg{animation:kenburns 14s ease-out forwards}
@keyframes kenburns{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.16) translate(-1.5%,-1%)}}
.hero.bright .slide .txt{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);border-radius:22px;padding:22px 26px 24px;backdrop-filter:blur(3px) saturate(1.2);-webkit-backdrop-filter:blur(3px) saturate(1.2);text-shadow:0 2px 10px rgba(0,0,0,.42),0 1px 2px rgba(0,0,0,.5)}
.hero.bright .slide .txt .btn{text-shadow:none}
.hero.bright .slide h1{font-family:Georgia,"Times New Roman",serif;position:relative;overflow:hidden}
.hero.bright .slide h1 .glow{background:none;-webkit-background-clip:initial;background-clip:initial;color:#FFE27A;text-shadow:0 0 18px rgba(255,200,40,.75),0 2px 8px rgba(0,0,0,.45)}
.hero.bright .slide h1::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:shine 4.5s ease-in-out infinite;pointer-events:none}
@keyframes shine{0%,55%{left:-40%}85%,100%{left:120%}}
.hero.bright .pill{background:rgba(255,255,255,.9);color:#0D2244;text-shadow:none;font-weight:800;font-family:Arial,sans-serif}
.hero.bright .floaters span{opacity:.75;filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}
.hero.bright .art{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.6)}
.hero.bright .w1 .overlay{background-image:linear-gradient(115deg,rgba(27,78,155,.80) 0%,rgba(47,111,222,.58) 45%,rgba(120,200,255,.30) 100%)}
.hero.bright .w2 .overlay{background-image:linear-gradient(115deg,rgba(214,120,0,.80) 0%,rgba(255,170,20,.55) 50%,rgba(255,226,120,.28) 100%)}
.hero.bright .w3 .overlay{background-image:linear-gradient(115deg,rgba(0,120,135,.82) 0%,rgba(15,175,190,.55) 50%,rgba(130,240,235,.28) 100%)}
.hero.bright .w4 .overlay{background-image:linear-gradient(115deg,rgba(110,40,190,.80) 0%,rgba(190,60,190,.58) 50%,rgba(255,120,200,.30) 100%)}
.hero.bright .w5 .overlay{background-image:linear-gradient(115deg,rgba(225,70,70,.80) 0%,rgba(250,100,130,.58) 50%,rgba(255,180,200,.30) 100%)}
.hero.bright .w6 .overlay{background-image:linear-gradient(115deg,rgba(10,130,80,.82) 0%,rgba(60,175,90,.58) 50%,rgba(190,235,90,.30) 100%)}
/* board pages: same bright treatment in the board's own colors */
body[data-exam] .hero.bright .slide .overlay{background-image:linear-gradient(115deg,color-mix(in srgb,var(--t1) 82%,transparent) 0%,color-mix(in srgb,var(--t2) 55%,transparent) 55%,color-mix(in srgb,var(--t3) 30%,transparent) 100%)!important}
body[data-exam] .hero.bright .slide.s2 .overlay,body[data-exam] .hero.bright .slide.s5 .overlay{background-image:linear-gradient(115deg,color-mix(in srgb,var(--t2) 85%,#000 5%) 0%,color-mix(in srgb,var(--t1) 55%,transparent) 55%,color-mix(in srgb,var(--t3) 35%,transparent) 100%)!important}
body[data-exam] .hero.bright .slide.s4 .overlay{background-image:linear-gradient(115deg,color-mix(in srgb,var(--t1) 85%,#000 8%) 0%,color-mix(in srgb,var(--t3) 55%,transparent) 60%,color-mix(in srgb,var(--t2) 30%,transparent) 100%)!important}
.hero.bright .slide .pattern{opacity:.12}
@media (prefers-reduced-motion:reduce){.hero.bright .slide.on .bgimg,.hero.bright .slide h1::after{animation:none}}
/* feature cards: photo on top, a different vivid gradient panel under each */
.fcards .card:nth-child(6n+1),body[data-exam] .fcards .card:nth-child(6n+1){background:linear-gradient(135deg,#1B4E9B,#2F6FDE)}
.fcards .card:nth-child(6n+2),body[data-exam] .fcards .card:nth-child(6n+2){background:linear-gradient(135deg,#0F7C8A,#0FA3B1)}
.fcards .card:nth-child(6n+3),body[data-exam] .fcards .card:nth-child(6n+3){background:linear-gradient(135deg,#138A4E,#2FB36B)}
.fcards .card:nth-child(6n+4),body[data-exam] .fcards .card:nth-child(6n+4){background:linear-gradient(135deg,#C46A00,#E8A010)}
.fcards .card:nth-child(6n+5),body[data-exam] .fcards .card:nth-child(6n+5){background:linear-gradient(135deg,#D23A31,#EE6A5F)}
.fcards .card:nth-child(6n+6),body[data-exam] .fcards .card:nth-child(6n+6){background:linear-gradient(135deg,#6A2FB8,#B5257E)}
/* board cards (hub) */
.boards{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:26px 0}
.bcard{position:relative;display:block;border-radius:24px;overflow:hidden;color:#fff;text-decoration:none;min-height:300px;box-shadow:0 18px 40px #0d22442e;transition:transform .2s,box-shadow .2s}
.bcard:hover,.bcard:focus-visible{transform:translateY(-5px);box-shadow:0 24px 50px #0d224440}
.bcard .bimg{position:absolute;inset:0;background-size:cover;background-position:center}
.bcard .bwash{position:absolute;inset:0}
.bcard .bbody{position:relative;padding:28px;display:flex;flex-direction:column;height:100%;min-height:300px;text-shadow:0 2px 8px #0006}
.bcard .bname{font:900 52px/1 Arial,Helvetica,sans-serif;letter-spacing:1px}
.bcard .bfull{font-weight:800;font-size:18px;margin:6px 0 10px;font-family:Arial,sans-serif}
.bcard p{margin:0 0 14px;max-width:560px}
.bcard .bmeta{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
.bcard .bmeta span{background:#ffffff2e;border:1px solid #ffffff66;border-radius:20px;padding:3px 12px;font-weight:800;font-size:14px;font-family:Arial,sans-serif;text-shadow:none}
.bcard .bgo{margin-top:14px;font-weight:900;font-family:Arial,sans-serif;font-size:18px}
@media(max-width:860px){.boards{grid-template-columns:1fr}.bcard .bname{font-size:40px}}
/* live courses */
.lives{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:22px 0}
.lcard{border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 14px 34px #0d224420;display:flex;flex-direction:column}
.lcard img{width:100%;height:180px;object-fit:cover;display:block}
.lcard .lb{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.lcard .lcode{font:900 30px/1 Arial,sans-serif;color:var(--gc)}
.lcard h3{margin:0;font-size:21px}
.lcard .lact{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px}
/* ---------- exam explorer (exams.html, hub and board pages) ---------- */
.xp-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:18px 0 6px}
.xp-tools input{flex:1 1 280px;padding:13px 16px;border:2px solid #cfd8ea;border-radius:14px;font:16px Arial,Helvetica,sans-serif}
.xp-tools input:focus{outline:none;border-color:#1B4E9B;box-shadow:0 0 0 4px #1b4e9b22}
.xp-seg{display:inline-flex;border:2px solid #cfd8ea;border-radius:14px;overflow:hidden}
.xp-seg button{border:0;background:#fff;padding:11px 16px;font:800 15px Arial,sans-serif;color:#0D2244;cursor:pointer}
.xp-seg button+button{border-left:2px solid #cfd8ea}
.xp-seg button[aria-pressed="true"]{background:#0D2244;color:#fff}
.xp-seg button:focus-visible{outline:3px solid #FFB627;outline-offset:-3px}
.xp-count{font:700 14px Arial,sans-serif;color:var(--muted);margin:6px 0 0}
.xp-boxes{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin:18px 0 30px}
.xp-box{all:unset;box-sizing:border-box;cursor:pointer;border-radius:20px;padding:16px 16px 14px;color:#fff;background:linear-gradient(140deg,var(--gc),color-mix(in srgb,var(--gc) 62%,#fff 10%));box-shadow:0 10px 24px color-mix(in srgb,var(--gc) 30%,transparent);display:flex;flex-direction:column;gap:8px;min-height:138px;position:relative;overflow:hidden;transition:transform .16s,box-shadow .16s}
.xp-box::after{content:"";position:absolute;right:-30px;bottom:-30px;width:110px;height:110px;border-radius:50%;background:#ffffff1f}
.xp-box:hover,.xp-box:focus-visible{transform:translateY(-4px);box-shadow:0 16px 32px color-mix(in srgb,var(--gc) 40%,transparent)}
.xp-box:focus-visible{outline:3px solid #FFB627;outline-offset:3px}
.xp-box .xi{width:46px;height:46px;border-radius:14px;background:#ffffff2b;display:grid;place-items:center}
.xp-box .xi svg{width:28px;height:28px}
.xp-box b{font:800 16.5px/1.2 Arial,Helvetica,sans-serif}
.xp-box small{font:800 13px Arial,sans-serif;opacity:.95;margin-top:auto}
.xp-box[hidden],.xp-grp[hidden],.xp-card[hidden]{display:none}
.xp-grp{margin:0 0 28px;scroll-margin-top:120px}
.xp-band{display:flex;align-items:center;gap:12px;color:#fff;border-radius:16px;padding:12px 18px;background:linear-gradient(90deg,var(--gc),color-mix(in srgb,var(--gc) 70%,#fff))}
.xp-band svg{width:30px;height:30px;flex:0 0 auto}
.xp-band h3{color:#fff!important;margin:0;font:800 21px/1.2 Arial,Helvetica,sans-serif;flex:1}
.xp-band span{font:800 14px Arial,sans-serif;background:#ffffff2e;border-radius:12px;padding:3px 10px}
.xp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:12px}
.xp-card{display:flex;flex-direction:column;gap:6px;background:#fff;border:2px solid color-mix(in srgb,var(--gc) 22%,#fff);border-left:6px solid var(--gc);border-radius:14px;padding:12px 14px;text-decoration:none;color:#16202c;transition:transform .14s,box-shadow .14s}
a.xp-card:hover,a.xp-card:focus-visible{transform:translateY(-3px);box-shadow:0 10px 22px color-mix(in srgb,var(--gc) 25%,transparent)}
a.xp-card:focus-visible{outline:3px solid #FFB627;outline-offset:2px}
.xp-card .xc{font:900 26px/1 Arial,Helvetica,sans-serif;color:var(--gc)}
.xp-card .xn{font-weight:700;line-height:1.3;font-size:15.5px}
.xp-card .xb{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto}
.pb{font:800 11px/1.7 Arial,sans-serif;padding:0 8px;border-radius:8px;letter-spacing:.4px}
.pb.ny{background:#EEF3FB;color:#1B4E9B;border:1px solid #b9cdee}.pb.ne{background:#E6F6F8;color:#0B6470;border:1px solid #a9dde3}
.st{font:800 12px/1.7 Arial,sans-serif;padding:0 9px;border-radius:8px}
.st.on{background:#138A4E;color:#fff}.st.off{background:#eef0f4;color:#5b6573}
.xp-empty{padding:30px;text-align:center;color:var(--muted);font-weight:700}
@media(max-width:600px){.xp-boxes{grid-template-columns:1fr 1fr;gap:10px}.xp-box{min-height:122px;padding:12px}.xp-box b{font-size:14.5px}.xp-box .xi{width:38px;height:38px}.xp-box .xi svg{width:22px;height:22px}.xp-cards{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.xp-box,.xp-card,.bcard{transition:none}.xp-box:hover,.xp-card:hover,.bcard:hover{transform:none}}
@media(max-width:700px){.slide .bgimg[style*="--small"]{background-image:var(--small)!important}}
/* header fit: 7 colored menus */
@media(min-width:1241px) and (max-width:1600px){.mainnav .mi>a.top{font-size:15.5px;padding:9px 8px}.mainnav .mi>a.top .car{display:none}nav.mainnav{gap:0;margin-left:0}.nnw small{display:none}.nnw b{font-size:28px}.brand.nn img{height:50px!important;width:50px}.nav-right .signin{font-size:15.5px;padding:8px}a.signup{padding:9px 14px;font-size:15.5px}header.nav{gap:10px}}
@media(max-width:1240px){header.nav nav.mainnav{display:none!important}}
.hero.bright .slide h1::after{background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent)}
.drawer:not(.open){box-shadow:none}
.cta{background:linear-gradient(120deg,#0D2244,#1B4E9B 50%,#0F7C8A)}
.xp-grp{scroll-margin-top:110px}@media(max-width:700px){.xp-grp{scroll-margin-top:84px}}
/* light slides (gold, coral, lime): a slightly darker copy panel keeps white text ≥ 4.5:1 */
.hero.bright .w2 .txt,.hero.bright .w5 .txt,.hero.bright .w6 .txt,.hero.bright .w3 .txt{background:rgba(20,30,60,.32)}
.hero.bright .w2 h1 .glow{color:#FFF3B0}

/* ================= Header fit on smaller monitors (7 menus) ================= */
header.nav{flex-wrap:nowrap}
header.nav nav.mainnav{flex:1 1 auto;min-width:0;justify-content:center}
.nav-right{flex:0 0 auto}
@media(max-width:1320px){header.nav nav.mainnav{display:none!important}.menu-btn{display:flex}}
@media(min-width:1321px) and (max-width:1500px){
  header.nav{gap:10px;padding:8px 16px}
  .brand img{height:64px}
  .mainnav .mi>a.top{font-size:15px;padding:8px 7px;gap:3px}
  .mainnav .mi>a.top .car{display:none}
  .nav-right{gap:6px}.nav-right .signin{font-size:15px;padding:8px 8px}
  a.signup{font-size:15px;padding:9px 16px}
}
@media(min-width:1501px) and (max-width:1760px){
  header.nav{gap:12px;padding:10px 20px}
  .brand img{height:76px}
  .mainnav .mi>a.top{font-size:16px;padding:10px 9px;gap:4px}
  .nav-right .signin{font-size:16px;padding:9px 10px}
  a.signup{font-size:16px;padding:10px 18px}
}
/* keep the long uppercase tagline only on very wide screens; slogan stays */
@media(max-width:2100px){.brand.nn small{display:none}}
@media(min-width:1761px) and (max-width:1960px){
  header.nav{gap:14px}
  .mainnav .mi>a.top{font-size:17px;padding:10px 10px}
}
/* logo block never touches the menu */
header.nav .brand{margin-right:28px}
@media(max-width:2399px){.brand.nn small{display:none!important}}
/* explorer: country tabs, program and state pickers */
.xp-region{margin:14px 0 2px}
.xp-region button{font-size:16px;padding:12px 20px}
.xp-sel{padding:12px 14px;border:2px solid #cfd8ea;border-radius:14px;font:700 15px Arial,Helvetica,sans-serif;color:#0D2244;background:#fff;max-width:100%}
.xp-sel:focus{outline:none;border-color:#1B4E9B;box-shadow:0 0 0 4px #1b4e9b22}
.xp-sel[hidden]{display:none}
.xp-note{background:#FFF8E1;border:1px solid #f1d27a;border-radius:12px;padding:10px 14px;margin:10px 0 0;font-size:15px}
.xp-note[hidden]{display:none}
@media(max-width:600px){.xp-sel{flex:1 1 100%}}