:root{
--bg:#F1F4F8;
--surface:#FFFFFF;
--surface-2:#E3E8EF;
--ink:#132233;
--ink-muted:#586479;
--border:#D6DCE6;
--accent:#0F6A84;
--accent-strong:#0B2E4A;
--accent-ink:#FFFFFF;
--gold:#E0A800;
--gold-soft:#FFF4CC;
--good:#2F7A54;
--good-soft:#DFF0E7;
--warn:#B2621B;
--warn-soft:#F6E4CF;
--bad:#B23A3A;
--bad-soft:#F8DEDE;
--green:#0F6A84;
--shadow: 0 1px 2px rgba(20,32,51,0.06), 0 8px 24px -12px rgba(20,32,51,0.18);
--radius: 14px;
color-scheme: light;
}
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]){
--bg:#0E141E; --surface:#161F2C; --surface-2:#1E2A3A; --ink:#E8ECF3; --ink-muted:#96A3B8;
--border:#2A3850; --accent:#3FB6D3; --accent-strong:#9BDDEE; --accent-ink:#0B1420;
--gold:#E6B94F; --gold-soft:#3A2E1C; --good:#57B888; --good-soft:#173226;
--warn:#E29A54; --warn-soft:#3A2A16; --bad:#E27272; --bad-soft:#3A1E1E;
--shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 28px -14px rgba(0,0,0,0.55);
color-scheme: dark;
}
}
:root[data-theme="dark"]{
--bg:#0E141E; --surface:#161F2C; --surface-2:#1E2A3A; --ink:#E8ECF3; --ink-muted:#96A3B8;
--border:#2A3850; --accent:#3FB6D3; --accent-strong:#9BDDEE; --accent-ink:#0B1420;
--gold:#E6B94F; --gold-soft:#3A2E1C; --good:#57B888; --good-soft:#173226;
--warn:#E29A54; --warn-soft:#3A2A16; --bad:#E27272; --bad-soft:#3A1E1E;
--shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 28px -14px rgba(0,0,0,0.55);
color-scheme: dark;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
background:var(--bg); color:var(--ink);
font-family:"Work Sans", system-ui, sans-serif;
font-size:12pt;
line-height:1.5;
}
h1,h2,h3,h4{font-family:"Fraunces", Georgia, serif; font-weight:600; text-wrap:balance; margin:0 0 .35em 0; color:var(--ink);}
a{color:inherit;}
.mono{font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums;}
.muted{color:var(--ink-muted);}
.eyebrow{text-transform:uppercase; letter-spacing:.09em; font-size:.72rem; font-weight:600; color:var(--ink-muted);}
.eyebrow-link{text-decoration:none; display:inline-block;}
.eyebrow-link:hover, .eyebrow-link:focus-visible{color:var(--accent-strong, var(--ink-muted)); text-decoration:underline;}
button{font-family:inherit; font-size:12pt; cursor:pointer;}
input,select,textarea{font-family:inherit; font-size:1rem;}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

.shell{max-width:1180px; margin:0 auto; padding-inline:20px;}
/* Three-row header: brand bar, board menus (one per certifying board), then section links. */
.topbar{position:sticky; top:0; z-index:20; background:#0B2E4A; border-bottom:1px solid rgba(0,0,0,.15); box-shadow:var(--shadow);}
.topbar-main{display:flex; align-items:center; justify-content:space-between; gap:18px; padding-block:14px; flex-wrap:wrap;}
.brand{display:flex; align-items:center; gap:12px; font-family:"Fraunces",serif; font-weight:800; font-size:1.9rem; text-decoration:none; white-space:nowrap; color:#fff;}
.brand-stack{display:flex; flex-direction:column; gap:2px; min-width:0;}
.brand-name{display:flex; align-items:baseline; gap:.30em; line-height:1.02;}
.brand-amp{color:#FFD23F; margin:0 .06em;}
.brand-disclaimer{font-family:"Work Sans",system-ui,sans-serif; font-weight:400; font-size:.60rem; letter-spacing:.005em; color:#FFD23F; white-space:normal;}
@media (max-width:900px){ .brand-disclaimer{font-size:.55rem; line-height:1.25;} }
.brand-c1{color:#fff;}
.brand-c2{color:#FFD23F;}
.brand-c3{color:#5FD4EA;}
@media (max-width:640px){ .brand{font-size:1.15rem;} .brand-name{gap:.24em;} }

/* ---- Board menus: each board is its own distinctive top-level menu ---- */
.topbar-boards{background:rgba(255,255,255,.06); border-top:1px solid rgba(255,255,255,.08);}
.board-menus{display:flex; flex-wrap:wrap; gap:6px; padding-block:8px;}
.board-menu{position:relative;}
.board-menu-btn{display:inline-flex; align-items:center; gap:7px; padding:7px 14px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); color:#fff; text-decoration:none; font-weight:700; font-size:.92rem; letter-spacing:.02em; transition:background .15s ease, border-color .15s ease;}
.board-dot{width:10px; height:10px; border-radius:50%; background:var(--board); box-shadow:0 0 0 2px rgba(255,255,255,.25);}
.board-caret{font-size:.7rem; opacity:.7;}
.board-menu:hover .board-menu-btn, .board-menu.open .board-menu-btn, .board-menu:focus-within .board-menu-btn{background:var(--board); border-color:var(--board);}
.board-menu.active .board-menu-btn{background:var(--board); border-color:#fff;}
.board-dropdown{display:none; position:absolute; left:0; top:calc(100% + 6px); min-width:320px; max-width:420px; background:var(--surface); color:var(--ink); border-radius:14px; border-top:5px solid var(--board); box-shadow:0 18px 40px -12px rgba(0,0,0,.45); padding:8px; z-index:40;}
.board-dropdown::before{content:""; position:absolute; left:0; right:0; top:-12px; height:12px;}
.board-menu:hover .board-dropdown, .board-menu.open .board-dropdown, .board-menu:focus-within .board-dropdown{display:block;}
.board-dropdown a{display:block; padding:8px 12px; border-radius:9px; text-decoration:none; font-size:.92rem; color:var(--ink);}
.board-dropdown a:hover{background:var(--surface-2);}
.board-dd-head{border-bottom:1px solid var(--border); border-radius:9px 9px 0 0 !important; margin-bottom:4px;}
.board-dd-head b{display:block; color:var(--board); font-family:"Fraunces",serif; font-size:1rem;}
.board-dd-head span{display:block; font-size:.78rem; color:var(--ink-muted);}
.board-dropdown em.soon{font-style:normal; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-muted); background:var(--surface-2); padding:1px 6px; border-radius:999px; margin-left:4px;}
@media (max-width:640px){ .board-dropdown{position:fixed; left:12px; right:12px; top:auto; min-width:0; max-width:none;} .board-menu-btn{padding:6px 11px; font-size:.85rem;} }
.board-badge{display:inline-block; padding:2px 9px; border-radius:999px; background:var(--board); color:#fff; font-size:.7rem; font-weight:800; letter-spacing:.06em; text-decoration:none; margin-right:6px;}
.board-tiles{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px,1fr)); gap:12px; margin-bottom:30px;}
.board-tile{display:flex; gap:12px; align-items:center; padding:14px; border-radius:16px; background:var(--surface); border:1px solid var(--border); border-left:6px solid var(--board); box-shadow:var(--shadow); text-decoration:none; color:var(--ink); transition:transform .15s ease;}
.board-tile:hover{transform:translateY(-2px);}
.board-tile img{flex:none; border-radius:12px;}
.board-tile-text{display:flex; flex-direction:column; min-width:0;}
.board-tile-text b{font-family:"Fraunces",serif; font-size:1.15rem; color:var(--board);}
.board-tile-text span{font-size:.82rem; line-height:1.3;}
.board-tile-text em{font-style:normal; font-size:.75rem; color:var(--ink-muted); margin-top:3px;}
.board-hero{background:linear-gradient(135deg, #0B2E4A 0%, var(--board) 120%); color:#fff; margin-top:-28px; margin-bottom:10px;}
.board-hero-inner{display:flex; gap:24px; align-items:center; padding-block:36px; flex-wrap:wrap;}
.board-hero h1{color:#fff; font-size:clamp(1.6rem,3vw,2.4rem);}
.board-hero p{max-width:70ch; margin:0 0 14px 0; color:rgba(255,255,255,.92);}
.board-hero .eyebrow{color:#FFD23F;}
.board-hero-icon{flex:none; border-radius:20px; background:rgba(255,255,255,.1); padding:6px;}
.board-stats{display:flex; gap:10px; flex-wrap:wrap;}
.board-stats span{background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:5px 12px; font-size:.85rem;}
.board-stats b{font-family:"IBM Plex Mono",monospace;}
.board-certs{display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:12px;}
.board-cert{background:var(--surface); border:1px solid var(--border); border-top:4px solid var(--board); border-radius:14px; padding:14px 16px;}
.board-cert h3{font-size:1.02rem;}
.board-cert p{font-size:.88rem; margin:0 0 8px 0;}
.board-cert ul{margin:0; padding-left:18px; font-size:.9rem;}
.course-row{border-left:4px solid var(--board, transparent); padding-left:14px !important;}
.course-card{border-top:4px solid var(--board, var(--border));}
.chip-group-label{display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; background:var(--board, var(--surface-2)); color:#fff; font-weight:800; font-size:.75rem; letter-spacing:.05em; margin-right:4px;}
.fmt-board{margin-top:28px; padding-left:10px; border-left:5px solid var(--board);}
.fmt-board a{color:var(--board); text-decoration:none;}
.est{font-size:.68rem; font-weight:700; color:#B45309; background:#FEF3C7; border-radius:6px; padding:0 4px; margin-left:2px;}
.footer-boards{display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin:0 0 14px 0; font-weight:700;}
.footer-boards a{color:#fff; text-decoration:none; border-bottom:2px solid var(--board);}
.footer-boards .sep{color:rgba(255,255,255,.35);}

.topbar-subnav{background:rgba(0,0,0,.18);}
.topbar-subnav-inner{display:flex;}
.nav{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; width:100%; column-gap:10px;}
.nav-left{display:flex; flex-wrap:wrap; gap:2px; justify-self:start;}
.nav-center{justify-self:center; display:flex; align-items:center;}
.nav-right{display:flex; flex-wrap:wrap; gap:2px; justify-self:end;}
.nav a, .nav-left button, .nav-right button{padding:12px 19px; border-radius:0; border:none; border-bottom:2px solid transparent; background:transparent; color:rgba(255,255,255,.75); text-decoration:none; font-weight:600; font-size:1rem;}
.nav a:hover, .nav-left button:hover, .nav-right button:hover{color:#fff;}
.nav a.active, .nav-left button.active, .nav-right button.active{color:#fff; border-bottom-color:var(--gold);}
@media (max-width:640px){
.nav{display:flex; flex-wrap:wrap; gap:2px;}
.nav-left, .nav-right{justify-self:auto;}
.nav-center{order:99; width:100%; justify-content:center; padding:6px 0;}
.nav a{padding:10px 12px; font-size:.9rem;}
}
.topbar-search{position:relative; display:flex; align-items:center; flex:1 1 320px; max-width:420px; margin:0 8px;}
.topbar-search-icon{position:absolute; left:14px; top:50%; transform:translateY(-50%); color:#586479; display:flex; pointer-events:none;}
.topbar-search input{width:100%; padding:9px 42px 9px 38px; border-radius:999px; border:none; background:rgba(255,255,255,.94); color:#132233; font-size:.9rem;}
.topbar-search input::placeholder{color:#586479;}
.topbar-search-btn{position:absolute; right:4px; top:50%; transform:translateY(-50%); width:28px; height:28px; border-radius:50%; border:none; background:var(--gold); color:#241a0c; display:flex; align-items:center; justify-content:center; cursor:pointer;}
.pill-courses{display:inline-flex; align-items:center; gap:6px; border-radius:999px;}
a.courses-cta{
flex:0 0 auto;
background:var(--gold); border:1px solid var(--gold); color:#241a0c;
font-size:1.05rem; font-weight:800; padding:13px 26px;
box-shadow:0 4px 14px rgba(168,118,58,.4);
transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
white-space:nowrap;
}
a.courses-cta:hover, a.courses-cta:focus-visible{filter:brightness(1.1); box-shadow:0 6px 18px rgba(168,118,58,.55); transform:translateY(-1px);}
.courses-cta svg{width:17px; height:17px;}
@media (max-width:900px){ a.courses-cta{padding:10px 18px; font-size:.95rem;} }
.who{display:flex; align-items:center; gap:10px; margin-left:auto;}
.who input{width:120px; padding:7px 10px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink);}
.account-actions{display:flex; align-items:center; gap:8px;}
.account-chip{display:flex; align-items:center; gap:10px; padding:6px 6px 6px 14px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22);}
.account-name{color:#fff; font-size:.85rem; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.topbar-main .btn.ghost{color:#fff; border-color:rgba(255,255,255,.4);}
.topbar-main .btn.ghost:hover{background:rgba(255,255,255,.12);}
.topbar-main .btn.primary{background:var(--gold); border-color:var(--gold); color:#241a0c;}
.topbar-main .btn.primary.signup-cta{background:#FFC72C; border-color:#FFC72C; color:#241a0c; box-shadow:0 3px 10px rgba(255,199,44,.45);}
.topbar-main .btn.primary.signup-cta:hover, .topbar-main .btn.primary.signup-cta:focus-visible{background:#FFD75E; border-color:#FFD75E;}

main{padding-block:28px 64px;}

.hero{position:relative; overflow:hidden; background:linear-gradient(135deg, #0B2E4A 0%, #0F6A84 55%, #5B2A86 100%); color:#fff; border-radius:20px; padding:34px 32px; margin-bottom:22px; display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between;}
.hero::before{content:""; position:absolute; top:-60px; right:-60px; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle, rgba(224,168,0,.35), transparent 70%); pointer-events:none;}
.hero::after{content:""; position:absolute; bottom:-90px; left:-40px; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle, rgba(95,212,234,.25), transparent 70%); pointer-events:none;}
.hero > *{position:relative; z-index:1;}
.hero-content{flex:1 1 auto; max-width:none; width:100%;}
.hero-content p{max-width:none;}
.hero-badge-row{display:flex; align-items:center; gap:9px; margin-bottom:8px;}
.hero-bounce-badge{flex:none; animation:heroBadgeBounce 2.4s ease-in-out infinite;}
@keyframes heroBadgeBounce{0%,100%{transform:translateY(0) rotate(-4deg);} 50%{transform:translateY(-6px) rotate(4deg);}}
@media (prefers-reduced-motion: reduce){ .hero-bounce-badge{animation:none;} }
.hero-rotator{position:relative; height:1.3em; overflow:hidden; flex:1;}
.hero-rotator span{position:absolute; left:0; top:0; width:100%; color:#FFD23F; font-weight:700; font-size:.86rem; text-transform:uppercase; letter-spacing:.08em; opacity:0;}
@media (prefers-reduced-motion: no-preference){
.hero-rotator span{animation:heroRotate 20s cubic-bezier(.65,0,.35,1) infinite;}
.hero-rotator span:nth-child(1){animation-delay:0s;}
.hero-rotator span:nth-child(2){animation-delay:5s;}
.hero-rotator span:nth-child(3){animation-delay:10s;}
.hero-rotator span:nth-child(4){animation-delay:15s;}
@keyframes heroRotate{
0%{opacity:0; transform:translateY(8px);}
6%,20%{opacity:1; transform:translateY(0);}
26%,100%{opacity:0; transform:translateY(-8px);}
}
}
@media (prefers-reduced-motion: reduce){
.hero-rotator span:first-child{opacity:1;}
}
.hero h1{color:#fff; font-size:clamp(1.3rem, 2.1vw, 1.85rem); max-width:32ch;}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.hero-headline-rotator{position:relative; min-height:1.35em; max-width:100%; width:100%; margin-bottom:10px; font-family:"Fraunces", Georgia, serif; font-size:clamp(2.1rem, 4vw, 3.4rem);}
.hero-headline-rotator span{position:absolute; left:0; top:0; width:100%; white-space:nowrap; font-weight:800; line-height:1.22; opacity:0;
background-repeat:no-repeat; -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero-headline-rotator span:nth-child(1){background-image:linear-gradient(90deg,#fff 0%,#FFD23F 50%,#5FD4EA 100%);}
.hero-headline-rotator span:nth-child(2){background-image:linear-gradient(90deg,#FFD23F 0%,#fff 45%,#8FE0C4 100%);}
.hero-headline-rotator span:nth-child(3){background-image:linear-gradient(90deg,#5FD4EA 0%,#fff 45%,#FFD23F 100%);}
.hero-headline-rotator span:nth-child(4){background-image:linear-gradient(90deg,#fff 0%,#8FE0C4 50%,#FFD23F 100%);}
.hero-headline-rotator span:nth-child(5){background-image:linear-gradient(90deg,#FFD23F 0%,#C9A7F0 50%,#fff 100%);}
.hero-headline-rotator span:nth-child(6){background-image:linear-gradient(90deg,#8FE0C4 0%,#FFD23F 50%,#5FD4EA 100%);}
@media (prefers-reduced-motion: no-preference){
.hero-headline-rotator span{
animation-name: heroHeadlineRotate;
animation-duration: 25s;
animation-timing-function: cubic-bezier(.65,0,.35,1);
animation-iteration-count: infinite;
}
.hero-headline-rotator span:nth-child(1){animation-delay:0s;}
.hero-headline-rotator span:nth-child(2){animation-delay:5s;}
.hero-headline-rotator span:nth-child(3){animation-delay:10s;}
.hero-headline-rotator span:nth-child(4){animation-delay:15s;}
.hero-headline-rotator span:nth-child(5){animation-delay:20s;}
@keyframes heroHeadlineRotate{
0%{opacity:0; transform:translateY(10px) scale(.985);}
5%,16%{opacity:1; transform:translateY(0) scale(1);}
21%,100%{opacity:0; transform:translateY(-10px) scale(.985);}
}
}
@media (prefers-reduced-motion: reduce){
.hero-headline-rotator span:first-child{opacity:1;}
}
@media (max-width:640px){
.hero-headline-rotator{min-height:1.3em;}
.hero{padding:24px 16px;}
}
#browse-courses{scroll-margin-top:200px;}
.featured-section{margin-bottom:32px;}
.featured-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:16px;}
.featured-head h2{margin-bottom:.2em;}
.featured-head p{margin:0;}
.see-all-link{color:var(--accent); font-weight:700; text-decoration:none; white-space:nowrap;}
.see-all-link:hover{text-decoration:underline;}
.featured-grid{margin-bottom:4px;}

/* Course list (main browse area) */
.course-list{display:flex; flex-direction:column; gap:0;}
.course-row{display:flex; gap:20px; align-items:center; padding:20px 4px; border-bottom:1px solid var(--border);}
.course-row:first-child{border-top:1px solid var(--border);}
.course-row-media{flex:0 0 180px; width:180px; height:auto; aspect-ratio:16/9; align-self:center; border-radius:12px; overflow:hidden; background:var(--surface-2);}
.course-row-media img{width:100%; height:100%; object-fit:cover; display:block;}
.row-media-fallback{width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--accent-strong), var(--accent)); color:rgba(255,255,255,.85); text-align:center; padding:8px; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;}
.course-row-body{flex:1; min-width:0;}
.course-row-body h3{margin:.15em 0;}
.course-title-link{color:inherit; text-decoration:none;}
.course-title-link:hover, .course-title-link:focus-visible{text-decoration:underline; color:var(--accent, inherit);}
.course-row-body p{margin:0; max-width:60ch;}
.course-row-action{flex:0 0 auto;}
.btn.pill{border-radius:999px;}
@media (max-width:640px){
.course-row{flex-wrap:wrap;}
.course-row-media{flex:0 0 100%; width:100%; height:auto; aspect-ratio:16/9;}
}

/* Pagination */
.pagination{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:22px;}
.page-btns{display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.page-btn{min-width:34px; height:34px; padding:0 10px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-weight:700; cursor:pointer;}
.page-btn.active{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
.page-btn:disabled{opacity:.4; cursor:not-allowed;}
.page-ellipsis{color:var(--ink-muted); padding:0 2px;}

/* Footer */
.site-footer{background:#0B2E4A; color:rgba(255,255,255,.82); margin-top:48px;}
.footer-inner{padding-block:28px; text-align:center;}
.footer-top{display:flex; justify-content:center; align-items:center; gap:14px; margin-bottom:16px; position:relative;}
.footer-links{display:flex; justify-content:center; flex-wrap:wrap; gap:10px; font-weight:600;}
.footer-links a{color:#fff; text-decoration:none;}
.footer-links a:hover{text-decoration:underline;}
.footer-links .sep{color:rgba(255,255,255,.4);}
.footer-icon-btn{position:absolute; right:0; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:8px; background:rgba(255,255,255,.12); color:#fff; display:flex; align-items:center; justify-content:center; text-decoration:none; font-size:.95rem;}
.footer-icon-btn:hover{background:rgba(255,255,255,.22);}
@media (max-width:560px){ .footer-top{flex-direction:column;} .footer-icon-btn{position:static; transform:none; margin-top:4px;} }
.footer-copy{margin:0 0 10px 0; font-size:.85rem;}
.footer-copy a{color:#fff;}
.footer-pwa{margin:0 0 14px 0; font-size:.82rem; color:rgba(255,255,255,.85);}
.footer-note-details{max-width:640px; margin:0 auto; font-size:.78rem; line-height:1.6; color:rgba(255,255,255,.7);}
.footer-note-details summary{list-style:none; cursor:pointer;}
.footer-note-details summary::-webkit-details-marker{display:none;}
.footer-more-link{color:#fff; text-decoration:underline; font-weight:600;}
.footer-note-details[open] .footer-more-link{display:none;}
.hero p{color:#fff; max-width:none; margin:0; font-weight:600; font-size:12pt; line-height:1.55;}
.hero-stats{display:flex; gap:22px; flex-wrap:wrap;}
.hero-stat b{display:block; font-family:"Fraunces",serif; font-size:1.7rem;}
.hero-stat span{font-size:.78rem; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.75);}

.search-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:18px; align-items:center;}
.search-row input[type="search"]{flex:1 1 240px; padding:11px 14px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--ink);}
.chips{display:flex; gap:8px; flex-wrap:wrap;}
.chip{padding:7px 13px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink-muted); font-weight:600; font-size:.85rem;}
.chip.active{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}

.grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px,1fr)); gap:16px;}
.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); display:flex; flex-direction:column; gap:10px; overflow:hidden;}
.card > .card-body{padding:18px; display:flex; flex-direction:column; gap:10px; flex:1;}
.card:not(.has-media) > .card-body{padding:18px;}
.cat-tag{align-self:flex-start; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:4px 9px; border-radius:999px; background:var(--surface-2); color:var(--ink-muted);}
.card-media{position:relative; aspect-ratio:16/9; background:var(--surface-2); overflow:hidden;}
.card-media img{width:100%; height:100%; object-fit:cover; display:block;}
.card-media .media-scrim{position:absolute; left:0; right:0; bottom:0; padding:8px 12px; background:linear-gradient(to top, rgba(10,14,22,.82), rgba(10,14,22,0)); }
.card-media .media-scrim span, .card-media .media-scrim a{color:#fff; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;}
.card-media .media-scrim a{text-decoration:none;}
.card-media .media-scrim a:hover, .card-media .media-scrim a:focus-visible{text-decoration:underline; color:var(--gold, #fff);}
.course-card h3{font-size:1.05rem;}
.course-card .meta{display:flex; justify-content:space-between; align-items:center; margin-top:auto; font-size:.85rem;}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 16px; border-radius:11px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-weight:600; text-decoration:none;}
.btn.primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
.btn.gold{background:var(--gold); border-color:var(--gold); color:#241a0c;}
.btn.ghost{background:transparent;}
.btn.danger{background:var(--bad-soft); border-color:var(--bad); color:var(--bad);}
.btn.small{padding:6px 11px; font-size:.85rem; border-radius:9px;}
.btn:disabled{opacity:.5; cursor:not-allowed;}
.icon-btn{border:1px solid var(--border); background:var(--surface); border-radius:999px; width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; color:var(--ink-muted);}
.icon-btn.fav-on{color:var(--bad); border-color:var(--bad);}

.empty{border:1px dashed var(--border); border-radius:var(--radius); padding:34px; text-align:center; color:var(--ink-muted);}

.course-head{display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; align-items:flex-start; margin-bottom:20px;}
.course-head .titles{display:flex; flex-direction:column; gap:6px;}
.course-head .actions{display:flex; gap:10px; flex-wrap:wrap;}
.cert-links{display:flex; flex-wrap:wrap; align-items:center; gap:4px;}
.cert-sep{color:var(--ink-muted);}

.stat-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin-bottom:22px;}
.stat-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px; position:relative; overflow:hidden;}
.stat-tile .seal-mark{position:absolute; right:-14px; top:-14px; opacity:.12;}
.stat-tile b{display:block; font-family:"IBM Plex Mono",monospace; font-size:1.6rem;}
.stat-tile span{font-size:.76rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-muted);}

.panels{display:grid; grid-template-columns:1.3fr 1fr; gap:18px;}
@media (max-width:780px){ .panels{grid-template-columns:1fr;} }
.panel{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px;}
.panel h3{font-size:1rem; display:flex; justify-content:space-between; align-items:center;}

/* ---- Course dashboard hub ---- */
.dash-head{display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px 20px; margin-bottom:16px;}
.dash-tagline{margin:0; max-width:56ch; color:var(--ink-muted);}
.dash-head-actions{display:flex; gap:10px; flex-wrap:wrap;}
.dash-cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:26px;}
.dash-cta-row .btn{flex:1 1 260px; padding:16px 20px; font-size:1.02rem; border-radius:var(--radius); box-shadow:var(--shadow);}
.dash-cta-primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
.dash-cta-dark{background:#0B2E4A; border-color:#0B2E4A; color:#fff;}
.dash-cta-dark .pill{margin-left:8px;}
.dash-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; margin-bottom:28px;}
.dash-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px; display:flex; flex-direction:column; gap:14px; justify-content:space-between;}
.dash-card-top{display:flex; gap:12px; align-items:flex-start;}
.dash-card-icon{flex:none; width:38px; height:38px; border-radius:10px; background:var(--gold-soft); color:var(--gold); display:flex; align-items:center; justify-content:center; font-size:1.05rem;}
.dash-card-top h3{margin:0 0 3px 0; font-size:1rem;}
.dash-card-top p{margin:0; font-size:.86rem; line-height:1.35;}
.dash-card-action{margin-top:auto;}

.ready-banner{display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:20px 24px; margin-bottom:28px;}
.ready-banner-actions{display:flex; gap:10px; flex-wrap:wrap;}

/* ---- Pricing (membership) ---- */
.pricing-intro{text-align:center; max-width:640px; margin:6px auto 24px auto;}
.pricing-intro h2{margin-bottom:6px;}
.pricing-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; margin-bottom:30px;}
@media (max-width:860px){ .pricing-grid{grid-template-columns:1fr;} }
.price-card{position:relative; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:26px 22px; display:flex; flex-direction:column; gap:10px;}
.price-card.featured{background:#0B2E4A; border-color:#0B2E4A; color:#fff; transform:scale(1.02);}
.price-card.featured h3, .price-card.featured .price-amount{color:#fff;}
.price-card.featured .muted{color:rgba(255,255,255,.72);}
.price-card.featured .price-was{color:rgba(255,255,255,.55);}
.price-badge{position:absolute; top:-13px; left:20px; background:var(--gold); color:#241a0c; font-weight:700; font-size:.76rem; padding:4px 10px; border-radius:999px;}
.price-amount{font-family:"Fraunces",serif; font-size:2rem; font-weight:700;}
.price-was{font-size:1rem; font-weight:500; text-decoration:line-through; opacity:.6;}
.price-card h3{margin:0;}
.price-features{list-style:none; margin:6px 0 14px 0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.9rem;}
.price-cta{margin-top:auto; width:100%; text-align:center;}

/* ---- Cart ---- */
.nav-cart{position:relative;}
.cart-badge{display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--gold); color:#241a0c; font-size:.72rem; font-weight:800; margin-left:2px; vertical-align:2px;}
.cart-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:14px 0; border-bottom:1px solid var(--border);}
.cart-row-body{flex:1 1 220px; display:flex; flex-direction:column; gap:2px;}
.cart-row-body h3{margin:0; font-size:1rem;}
.cart-row-price{flex:0 0 auto; font-size:1.05rem;}
.cart-total{display:flex; justify-content:flex-end; gap:8px; padding-top:12px; font-size:1.05rem;}

/* ---- Per-course FAQ ---- */
.faq-intro{text-align:center; margin-bottom:30px;}
.faq-block{display:flex; align-items:center; gap:40px; margin-bottom:56px; flex-wrap:wrap;}
.faq-block.reverse{flex-direction:row-reverse;}
.faq-block-text{flex:1 1 320px; min-width:260px;}
.faq-block-text h3{margin-bottom:10px;}
.faq-block-text p{margin-bottom:16px;}
.faq-block-visual{flex:1 1 280px; min-width:220px; aspect-ratio:16/10; border-radius:var(--radius); background:linear-gradient(135deg, #0B2E4A 0%, #0F6A84 55%, #5B2A86 100%); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow);}
.faq-visual-icon{font-size:3.4rem;}
@media (max-width:640px){ .faq-block, .faq-block.reverse{flex-direction:column;} }

.cep-toast{position:fixed; left:50%; bottom:26px; transform:translate(-50%,16px); background:#0B2E4A; color:#fff; padding:12px 20px; border-radius:999px; box-shadow:var(--shadow); font-size:.88rem; max-width:90vw; text-align:center; opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease; z-index:60;}
.cep-toast.show{opacity:1; transform:translate(-50%,0);}

/* ---- Course quick-nav menu bar ---- */
.course-menu-bar{position:relative; display:flex; align-items:center; gap:22px; border-bottom:1px solid var(--border); margin-bottom:20px; padding-bottom:0;}
.course-menu-dropdown{position:relative; margin-bottom:-1px;}
.course-menu-dropdown summary{list-style:none; cursor:pointer; font-weight:700; color:var(--accent); display:flex; align-items:center; gap:4px; padding:8px 2px 12px 2px; user-select:none;}
.course-menu-dropdown summary::-webkit-details-marker{display:none;}
.course-menu-dropdown[open] summary{color:var(--accent-strong);}
.course-menu-panel{position:absolute; top:100%; left:0; margin-top:4px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:8px; display:flex; flex-direction:column; min-width:230px; z-index:15;}
.course-menu-panel a, .course-menu-panel button{display:block; text-align:left; width:100%; background:none; border:none; padding:9px 10px; border-radius:8px; color:var(--ink); font-size:.92rem; text-decoration:none; cursor:pointer; font-family:inherit;}
.course-menu-panel a:hover, .course-menu-panel button:hover{background:var(--surface-2);}
.course-menu-tab{font-weight:700; color:var(--ink-muted); text-decoration:none; padding:8px 2px 12px 2px; border-bottom:2px solid transparent; margin-bottom:-1px;}
.course-menu-tab.active{color:var(--accent); border-bottom-color:var(--accent);}

table{width:100%; border-collapse:collapse; font-size:.88rem;}
th,td{text-align:left; padding:8px 6px; border-bottom:1px solid var(--border);}
th{color:var(--ink-muted); font-weight:600; font-size:.75rem; text-transform:uppercase; letter-spacing:.04em;}
.table-wrap{overflow-x:auto;}
.pill{padding:2px 9px; border-radius:999px; font-size:.76rem; font-weight:700;}
.pill.good{background:var(--good-soft); color:var(--good);}
.pill.warn{background:var(--warn-soft); color:var(--warn);}
.pill.bad{background:var(--bad-soft); color:var(--bad);}
.pill.sample{background:var(--gold-soft); color:#7A5B00;}

.quiz-wrap{max-width:720px; margin:0 auto;}
.quiz-progress{height:6px; background:var(--surface-2); border-radius:999px; overflow:hidden; margin-bottom:18px;}
.quiz-progress > i{display:block; height:100%; background:var(--accent);}
.question-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:24px; box-shadow:var(--shadow);}
.qnum{font-family:"IBM Plex Mono",monospace; color:var(--ink-muted); font-size:.85rem;}
.qtext{font-size:1.15rem; margin:8px 0 20px 0; font-weight:600; white-space:pre-line;}
.choice{display:flex; gap:12px; align-items:flex-start; width:100%; text-align:left; padding:13px 14px; border-radius:11px; border:1px solid var(--border); background:var(--surface); margin-bottom:10px; color:var(--ink);}
.choice .letter{flex:0 0 auto; width:26px; height:26px; border-radius:50%; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:700; color:var(--ink-muted);}
.choice:hover{border-color:var(--accent);}
.choice.selected{border-color:var(--accent); background:color-mix(in srgb, var(--accent) 10%, var(--surface));}
.choice.correct{border-color:var(--good); background:var(--good-soft);}
.choice.incorrect{border-color:var(--bad); background:var(--bad-soft);}
.choice.correct .letter{background:var(--good); color:#fff; border-color:var(--good);}
.choice.incorrect .letter{background:var(--bad); color:#fff; border-color:var(--bad);}
.explain{margin-top:14px; padding:12px 14px; border-radius:10px; background:var(--surface-2); font-size:12pt;}
.quiz-actions{display:flex; justify-content:space-between; margin-top:18px; gap:8px; flex-wrap:wrap;}

/* Question Bank: read-only choices that only light up once the answer is revealed */
.bank-choice{cursor:default; margin-bottom:8px; padding:10px 12px;}
.bank-choice:hover{border-color:var(--border);}
.bank-q.revealed .bank-choice.is-correct{border-color:var(--good); background:var(--good-soft);}
.bank-q.revealed .bank-choice.is-correct .letter{background:var(--good); color:#fff; border-color:var(--good);}
.bank-answer{margin-top:4px;}
.bank-answer > summary{list-style:none;}
.bank-answer > summary::-webkit-details-marker{display:none;}
.bank-answer > summary::marker{content:"";}

.result-hero{text-align:center; padding:30px 20px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--border); margin-bottom:22px;}
.result-score{font-family:"Fraunces",serif; font-size:3rem; margin:6px 0;}

.form-grid{display:grid; gap:12px;}
.form-grid label{display:flex; flex-direction:column; gap:5px; font-size:.85rem; font-weight:600; color:var(--ink-muted);}
.form-grid input, .form-grid textarea, .form-grid select{padding:10px 12px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-weight:400;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
@media (max-width:560px){ .row2{grid-template-columns:1fr;} }

.banner{padding:12px 16px; border-radius:11px; font-size:.9rem; margin-bottom:16px; display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.banner.info{background:var(--surface-2); color:var(--ink-muted); border:1px solid var(--border);}
.banner.sample{background:var(--gold-soft); color:#7A5B00; border:1px solid var(--gold);}
.banner.warn{background:var(--warn-soft); color:var(--warn); border:1px solid var(--warn);}
.banner.success{background:var(--good-soft); color:var(--good); border:1px solid var(--good);}
.banner.error{background:var(--bad-soft); color:var(--bad); border:1px solid var(--bad);}

.admin-list-row{display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid var(--border); gap:12px; flex-wrap:wrap;}
.modal-backdrop{position:fixed; inset:0; background:rgba(10,14,22,.5); display:flex; align-items:center; justify-content:center; padding:20px; z-index:50;}
.modal{background:var(--surface); border-radius:var(--radius); padding:24px; max-width:420px; width:100%; box-shadow:var(--shadow); max-height:85vh; overflow-y:auto;}

.sparkline-wrap svg text{fill:var(--ink-muted); font-size:10px; font-family:"IBM Plex Mono",monospace;}
.sparkline-wrap svg .gridline{stroke:var(--border);}
.sparkline-wrap svg .line{stroke:var(--accent); fill:none;}
.sparkline-wrap svg .area{fill:color-mix(in srgb, var(--accent) 14%, transparent);}
.sparkline-wrap svg .dot{fill:var(--accent); stroke:var(--surface); stroke-width:2;}

/* Three-option pricing (single test / 1-year / monthly) */
.pricing-grid-3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
@media (min-width: 900px) { .pricing-grid-3 { grid-template-columns: repeat(3, 1fr); } }

/* ---------- CLIABoardTests additions ---------- */
.hero{border-bottom:6px solid transparent; border-image:linear-gradient(90deg,#0F6A84 0 25%,#E0A800 25% 50%,#5B2A86 50% 75%,#C2410C 75% 100%) 1;}
#catalog-chips{flex-direction:column; gap:10px;}
#catalog-chips .chip-row{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
#catalog-chips .chip-group-label{min-width:64px; justify-content:center; margin:0 4px 0 0;}
.chip-group-label{font-family:"IBM Plex Mono",monospace; font-size:.75rem; letter-spacing:.08em; color:#fff; align-self:center;}
.cert-info{background:var(--surface); border:1px solid var(--border); border-left:6px solid var(--gold); border-radius:var(--radius); padding:16px 20px; margin:0 0 20px; box-shadow:var(--shadow);}
.cert-info h2{margin:.2em 0 .4em;}
.cert-info p{margin:0;}
.pill.soon{background:var(--gold-soft); color:#7A5B00; border:1px solid #E9C95A; white-space:nowrap;}
.explain-extra{margin-top:8px; font-size:.95em;}
.explain-extra .xk{display:inline-block; font-family:"IBM Plex Mono",monospace; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; background:var(--gold-soft); color:#6B5000; border-radius:6px; padding:1px 7px; margin-right:6px;}
.explain-tags{margin-top:10px; display:flex; flex-wrap:wrap; gap:6px;}
.review-explain{margin-top:8px;} .review-explain summary{cursor:pointer; color:var(--accent); font-weight:600;}
.dtable td{vertical-align:middle;} .dbar{height:10px; background:var(--border); border-radius:6px; overflow:hidden;}
.dbar i{display:block; height:100%; background:var(--good);} .dbar i.warn{background:var(--warn);} .dbar i.bad{background:var(--bad);}
.start-card h2{margin-top:.3em;}
.start-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin:14px 0 16px;}
.start-facts div{background:color-mix(in srgb, var(--accent) 7%, var(--surface)); border:1px solid var(--border); border-radius:12px; padding:12px; text-align:center;}
.start-facts b{display:block; font-size:1.5rem; color:var(--accent);} .start-facts span{font-size:.85rem; color:var(--ink-muted);}
.start-modes{display:flex; gap:10px; flex-wrap:wrap; margin:16px 0 8px;}
.small-note{font-size:.88rem;}
.exam-bar{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px;}
.exam-clock{font-size:1.35rem; font-weight:600; background:#0B2E4A; color:#fff; border-radius:10px; padding:4px 12px;}
.exam-clock.low{background:var(--bad);}
.flag-btn.on{border-color:#E08A00; color:#B36B00;}
.qnav{margin-top:16px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:12px 14px;}
.qnav-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(38px,1fr)); gap:6px; margin-top:8px;}
.qnav-btn{border:1px solid var(--border); background:var(--surface); color:var(--ink); border-radius:8px; padding:6px 0; font-family:"IBM Plex Mono",monospace; font-size:.85rem;}
.qnav-btn.done{background:var(--good-soft); border-color:var(--good);}
.qnav-btn.flag{box-shadow:inset 0 -3px 0 #E08A00;}
.qnav-btn.cur{outline:2px solid var(--accent); outline-offset:1px;}
.confirm-bar{margin-top:12px;}

/* Owner standard (same as ABBtests): ALL body text is Times New Roman, 12 pt. Headings, logo, board menus and numeric labels keep their own faces. */
body, p, li, td, th, label, blockquote, summary, details, .muted, .small-note, .qtext, .choice, .explain, .explain-extra,
.banner, .dash-tagline, .course-row p, .card-body p, .faq-block-text p, .price-card li, .footer-copy, .footer-links a,
.nav a, .course-menu-panel a, .course-menu-panel button, input, select, textarea, button, .btn {
font-family:"Times New Roman", Times, serif !important;
font-size:12pt !important;
}

/* Examination formats table */
.table-wrap{overflow-x:auto; margin:16px 0 8px;}
.fmt-table{width:100%; border-collapse:collapse; font-size:.95rem; background:var(--surface);}
.fmt-table th, .fmt-table td{border:1px solid var(--border); padding:9px 11px; text-align:left; vertical-align:top;}
.fmt-table thead th{background:#0B2E4A; color:#fff; font-weight:700; white-space:nowrap;}
.fmt-table tbody tr:nth-child(even){background:rgba(0,0,0,.03);}
.fmt-table td.mono{white-space:nowrap;}
.brand-logo{filter:drop-shadow(0 3px 8px rgba(0,0,0,.35)); transition:transform .25s ease;}
.brand:hover .brand-logo{transform:rotate(-8deg) scale(1.05);}
@media (max-width:640px){ .brand-logo{width:54px; height:54px;} }

/* ---------- Animated board banners ---------- */
.board-banner{position:relative; overflow:hidden; color:#fff; isolation:isolate;}
.board-page .board-banner{margin-top:-28px; margin-bottom:10px;}
.bb-bg{position:absolute; inset:0; z-index:-2;
background:
 radial-gradient(1200px 400px at 85% -20%, color-mix(in srgb, var(--board) 70%, #fff) 0%, transparent 60%),
 radial-gradient(800px 380px at 0% 120%, color-mix(in srgb, var(--board) 55%, #000) 0%, transparent 70%),
 linear-gradient(115deg, #0B2E4A 0%, var(--board) 45%, #0B2E4A 70%, color-mix(in srgb, var(--board) 80%, #fff) 100%);
background-size:100% 100%, 100% 100%, 260% 260%;
animation:bbShift 14s ease-in-out infinite alternate;}
@keyframes bbShift{0%{background-position:0 0,0 0,0% 50%;} 100%{background-position:0 0,0 0,100% 50%;}}
.bb-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(105deg, transparent 35%, rgba(255,255,255,.16) 50%, transparent 65%); background-size:250% 100%; animation:bbSheen 7s ease-in-out infinite;}
@keyframes bbSheen{0%{background-position:150% 0;} 60%,100%{background-position:-60% 0;}}
.bb-floaters{position:absolute; inset:0; z-index:-1; pointer-events:none;}
.bb-floaters svg{position:absolute; opacity:.16; animation:bbFloat 9s ease-in-out infinite;}
@keyframes bbFloat{0%,100%{transform:translateY(0) rotate(0deg);} 50%{transform:translateY(-18px) rotate(12deg);}}
.bb-inner{display:flex; gap:28px; align-items:center; padding-block:40px 64px; flex-wrap:wrap;}
.bb-icon{position:relative; flex:none; width:112px; height:112px; display:flex; align-items:center; justify-content:center;}
.bb-icon img{position:relative; z-index:1; border-radius:22px; box-shadow:0 12px 30px rgba(0,0,0,.35); animation:bbBob 4s ease-in-out infinite;}
.bb-ring{position:absolute; inset:0; border-radius:28px; border:3px solid rgba(255,255,255,.55); animation:bbPulse 2.6s ease-out infinite;}
@keyframes bbPulse{0%{transform:scale(.85); opacity:.9;} 100%{transform:scale(1.35); opacity:0;}}
@keyframes bbBob{0%,100%{transform:translateY(0);} 50%{transform:translateY(-6px);}}
.bb-text{flex:1 1 420px; min-width:0;}
.board-banner .eyebrow{color:#FFD23F; letter-spacing:.14em;}
.bb-title{color:#fff; font-size:clamp(1.7rem,3.4vw,2.7rem); font-weight:800; margin:.15em 0 .2em; text-shadow:0 2px 14px rgba(0,0,0,.25);
background:linear-gradient(90deg,#fff 0%,#fff 40%,#FFE27A 50%,#fff 60%,#fff 100%); background-size:250% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:bbTitle 6s linear infinite;}
@keyframes bbTitle{0%{background-position:100% 0;} 100%{background-position:-150% 0;}}
.bb-tagline{margin:0 0 10px; font-weight:700; color:rgba(255,255,255,.95);}
.bb-about{max-width:75ch; margin:0 0 14px; color:rgba(255,255,255,.92);}
.board-banner .board-stats span{backdrop-filter:blur(4px); animation:bbIn .6s ease both;}
.board-banner .board-stats span:nth-child(2){animation-delay:.1s;} .board-banner .board-stats span:nth-child(3){animation-delay:.2s;} .board-banner .board-stats span:nth-child(4){animation-delay:.3s;}
@keyframes bbIn{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
.bb-wave{position:absolute; left:0; right:0; bottom:-1px; width:100%; height:46px; fill:var(--bg); animation:bbWave 10s ease-in-out infinite alternate;}
@keyframes bbWave{0%{transform:translateX(0) scaleY(1);} 100%{transform:translateX(-2%) scaleY(1.25);}}
.bb-cta{margin-top:14px; background:#fff; color:#0B2E4A; border-color:#fff; font-weight:800; border-radius:999px; box-shadow:0 6px 18px rgba(0,0,0,.25);}
.bb-cta:hover{transform:translateY(-1px); filter:brightness(1.05);}
/* home carousel */
.board-carousel{position:relative; border-radius:20px; overflow:hidden; margin-bottom:22px; min-height:290px; box-shadow:var(--shadow);}
.bc-slide{position:absolute; inset:0; opacity:0; transform:scale(1.02); transition:opacity .8s ease, transform .8s ease; pointer-events:none;}
.bc-slide.active{position:relative; opacity:1; transform:none; pointer-events:auto;}
.board-banner.compact .bb-inner{padding:30px 32px 54px;}
.board-banner.compact .bb-icon{width:96px; height:96px;}
.board-banner.compact .bb-icon img{width:80px; height:80px;}
.bc-dots{position:absolute; left:0; right:0; bottom:14px; display:flex; justify-content:center; gap:8px; z-index:3;}
.bc-dot{width:12px; height:12px; border-radius:999px; border:2px solid #fff; background:transparent; padding:0; cursor:pointer; transition:width .3s ease, background .3s ease;}
.bc-dot.active{width:34px; background:var(--board);}
.board-carousel .bb-wave{display:none;}
@media (max-width:640px){ .bb-inner{padding-block:28px 52px;} .board-banner.compact .bb-inner{padding:22px 18px 50px;} .bb-icon{width:84px; height:84px;} .bb-icon img{width:72px; height:72px;} .board-carousel{min-height:380px;} }
@media (prefers-reduced-motion: reduce){ .bb-bg,.bb-bg::after,.bb-floaters svg,.bb-ring,.bb-icon img,.bb-title,.bb-wave,.board-banner .board-stats span{animation:none !important;} .bb-title{color:#fff; background:none;} }
/* Home: the hero is the first slide of the rotating banner */
.bc-intro .hero{margin:0; border-radius:0; min-height:290px;}
.board-carousel .bc-slide.active .hero-content{animation:bbIn .6s ease both;}
.bc-arrow{position:absolute; top:50%; transform:translateY(-50%); z-index:4; width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.5); background:rgba(0,0,0,.25); color:#fff; font-size:1.4rem; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:.75; transition:opacity .2s ease, background .2s ease;}
.bc-arrow:hover{opacity:1; background:rgba(0,0,0,.45);}
.bc-arrow.prev{left:10px;} .bc-arrow.next{right:10px;}
.bc-dot{position:relative; overflow:hidden;}
.bc-dot i{position:absolute; left:0; top:0; bottom:0; width:0; background:rgba(255,255,255,.85);}
.bc-dot.active{background:color-mix(in srgb, var(--board) 60%, transparent);}
.bc-dot.active i{animation:bcProgress 5s linear forwards;}
@keyframes bcProgress{from{width:0;} to{width:100%;}}
.board-carousel:hover .bc-dot.active i{animation-play-state:paused;}
.board-carousel .bb-inner{padding-left:58px; padding-right:58px;}
.bc-intro .hero{padding-left:58px; padding-right:58px;}
@media (max-width:640px){ .board-carousel .bb-inner, .bc-intro .hero{padding-left:44px; padding-right:44px;} .bc-arrow{width:30px; height:30px; font-size:1.1rem;} .bc-intro .hero{min-height:380px;} }
.board-carousel .board-banner.compact .bb-inner{padding-left:66px; padding-right:66px;} @media (max-width:640px){ .board-carousel .board-banner.compact .bb-inner{padding-left:44px; padding-right:44px;} }
/* ---------- Content protection ---------- */
body.protected .question-card, body.protected .quiz-wrap, body.protected #bank-root{-webkit-user-select:none; user-select:none; -webkit-touch-callout:none;}
body.protected .question-card{background-image:var(--wm); background-repeat:repeat;}
@media print{ body.protected main{display:none !important;} body.protected::after{content:"Printing CLIABoardTests practice questions is not permitted."; display:block; padding:40px; font:16pt Arial;} }