@font-face{ font-family:"Thmanyah Sans"; src:url("fonts/thmanyahsans-Light.woff2") format("woff2"); font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Sans"; src:url("fonts/thmanyahsans-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Sans"; src:url("fonts/thmanyahsans-Medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Sans"; src:url("fonts/thmanyahsans-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Sans"; src:url("fonts/thmanyahsans-Black.woff2") format("woff2"); font-weight:900; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Serif Display"; src:url("fonts/thmanyahserifdisplay-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:"Thmanyah Serif Display"; src:url("fonts/thmanyahserifdisplay-Black.woff2") format("woff2"); font-weight:900; font-style:normal; font-display:swap; }

:root{
  --bg:#FBF7EF; --bg-soft:#F3EEE1; --surface:#FFFFFF; --surface-2:#F6F1E6;
  --ink:#1C2333; --ink-muted:#5B6478; --ink-faint:#8A93A6;
  --border: rgba(28,35,51,.12); --border-strong: rgba(28,35,51,.22);
  --gold:#B87527; --gold-strong:#9C611E; --gold-soft: rgba(184,117,39,.12);
  --teal:#0E7B6C; --teal-strong:#0A5F53; --teal-soft: rgba(14,123,108,.10);
  --violet:#565FAE; --violet-soft: rgba(86,95,174,.12);
  --good:#227A4C; --good-soft: rgba(34,122,76,.12);
  --warn:#9C5E14; --warn-soft: rgba(156,94,20,.12);
  --bad:#A3352C; --bad-soft: rgba(163,53,44,.12);
  --btn-gold-bg:#B87527; --btn-gold-ink:#FFF8EC;
  --btn-teal-bg:#0E7B6C; --btn-teal-ink:#F4FBF9;
  --shadow: 0 12px 32px -16px rgba(28,35,51,.30);
  --shadow-lg: 0 22px 55px -20px rgba(28,35,51,.35);
  --radius-s:8px; --radius-m:14px; --radius-l:22px;
  --font-d:"Thmanyah Serif Display","Thmanyah Sans","Segoe UI","Tahoma","Arial",sans-serif;
  --font-b:"Thmanyah Sans","Segoe UI","Tahoma","Arial",sans-serif;
  --font-m: ui-monospace,"Cascadia Mono","Consolas",monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0A101E; --bg-soft:#0E1626; --surface:#121C31; --surface-2:#0E1626;
    --ink:#F1EEE4; --ink-muted:#9BA5BA; --ink-faint:#6B7690;
    --border: rgba(241,238,228,.10); --border-strong: rgba(241,238,228,.18);
    --gold:#E3A857; --gold-strong:#F0BE7C; --gold-soft: rgba(227,168,87,.14);
    --teal:#37B7A4; --teal-strong:#5FCBBA; --teal-soft: rgba(55,183,164,.14);
    --violet:#8D96DA; --violet-soft: rgba(141,150,218,.16);
    --good:#4FBE7E; --good-soft: rgba(79,190,126,.14);
    --warn:#D69A44; --warn-soft: rgba(214,154,68,.14);
    --bad:#E17469; --bad-soft: rgba(225,116,105,.14);
    --btn-gold-bg:#E3A857; --btn-gold-ink:#12213A;
    --btn-teal-bg:#37B7A4; --btn-teal-ink:#08201C;
    --shadow: 0 16px 40px -16px rgba(0,0,0,.55); --shadow-lg: 0 26px 65px -20px rgba(0,0,0,.6);
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0A101E; --bg-soft:#0E1626; --surface:#121C31; --surface-2:#0E1626;
  --ink:#F1EEE4; --ink-muted:#9BA5BA; --ink-faint:#6B7690;
  --border: rgba(241,238,228,.10); --border-strong: rgba(241,238,228,.18);
  --gold:#E3A857; --gold-strong:#F0BE7C; --gold-soft: rgba(227,168,87,.14);
  --teal:#37B7A4; --teal-strong:#5FCBBA; --teal-soft: rgba(55,183,164,.14);
  --violet:#8D96DA; --violet-soft: rgba(141,150,218,.16);
  --good:#4FBE7E; --good-soft: rgba(79,190,126,.14);
  --warn:#D69A44; --warn-soft: rgba(214,154,68,.14);
  --bad:#E17469; --bad-soft: rgba(225,116,105,.14);
  --btn-gold-bg:#E3A857; --btn-gold-ink:#12213A;
  --btn-teal-bg:#37B7A4; --btn-teal-ink:#08201C;
  --shadow: 0 16px 40px -16px rgba(0,0,0,.55); --shadow-lg: 0 26px 65px -20px rgba(0,0,0,.6);
  color-scheme: dark;
}
:root[data-theme="light"]{
  --bg:#FBF7EF; --bg-soft:#F3EEE1; --surface:#FFFFFF; --surface-2:#F6F1E6;
  --ink:#1C2333; --ink-muted:#5B6478; --ink-faint:#8A93A6;
  --border: rgba(28,35,51,.12); --border-strong: rgba(28,35,51,.22);
  --gold:#B87527; --gold-strong:#9C611E; --gold-soft: rgba(184,117,39,.12);
  --teal:#0E7B6C; --teal-strong:#0A5F53; --teal-soft: rgba(14,123,108,.10);
  --violet:#565FAE; --violet-soft: rgba(86,95,174,.12);
  --good:#227A4C; --good-soft: rgba(34,122,76,.12);
  --warn:#9C5E14; --warn-soft: rgba(156,94,20,.12);
  --bad:#A3352C; --bad-soft: rgba(163,53,44,.12);
  --btn-gold-bg:#B87527; --btn-gold-ink:#FFF8EC;
  --btn-teal-bg:#0E7B6C; --btn-teal-ink:#F4FBF9;
  --shadow: 0 12px 32px -16px rgba(28,35,51,.30); --shadow-lg: 0 22px 55px -20px rgba(28,35,51,.35);
  color-scheme: light;
}

*{box-sizing:border-box; min-width:0;}
html,body{margin:0;padding:0; max-width:100%;}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%; font-size:15px;}
body{
  background:var(--bg); color:var(--ink); font-family:var(--font-b); line-height:1.7;
  -webkit-font-smoothing:antialiased; overflow-x:hidden; max-width:100vw;
}
img,svg,canvas,video{max-width:100%; display:block;}
h1,h2,h3,h4,p,a,span,button,input,select,textarea,label{overflow-wrap:break-word; word-break:break-word;}
button, a, input, select{ -webkit-tap-highlight-color: transparent; }
input, select, textarea, button{ font-size:16px; } /* prevents iOS auto-zoom on focus */
h1,h2,h3,h4{font-family:var(--font-d); text-wrap:balance; margin:0; font-weight:700;}
p{margin:0;} ul{margin:0;padding:0;list-style:none;} button{font-family:inherit;cursor:pointer;} a{color:inherit;}
::selection{background:var(--gold-soft);}
:focus-visible{outline:2px solid var(--teal); outline-offset:3px; border-radius:4px;}
.num{font-family:var(--font-m); font-variant-numeric:tabular-nums; direction:ltr; unicode-bidi:isolate;}

/* bilingual helpers */
.en{direction:ltr; unicode-bidi:isolate; color:var(--ink-muted); font-weight:500;}
.en-line{direction:ltr; unicode-bidi:isolate; color:var(--ink-muted); font-size:.86em; margin-top:.3em; display:block;}
.en-inline{direction:ltr; unicode-bidi:isolate; color:var(--ink-faint); font-size:.82em; font-weight:600;}
.bi-sep{color:var(--ink-faint); margin:0 .35em; font-weight:400;}
.bi-stack{display:flex; flex-direction:column; gap:.15rem;}

.wrap{max-width:1180px; margin-inline:auto; padding-inline:clamp(1rem,4vw,2.5rem);}
.eyebrow{font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--teal); font-weight:700; font-family:var(--font-m);}
.section{padding-block:clamp(3rem,7vw,5.5rem);}
.section-head{max-width:680px; display:flex; flex-direction:column; gap:.5rem; margin-bottom:2.4rem;}
.section-head h2{font-size:clamp(1.5rem,2.6vw,2.05rem);}
.section-head p{color:var(--ink-muted); font-size:1rem;}

.topnav{position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--border);}
.topnav .wrap{position:relative; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:.85rem;}
.brand{display:flex; align-items:center; gap:.6rem; font-family:var(--font-d); font-weight:700; font-size:1.05rem; min-width:0; text-decoration:none;}
.brand .mark{display:inline-flex; width:1.55em; height:1.55em; flex:none;}
.brand .mark svg{width:100%; height:100%; display:block;}
.nav-actions{display:flex; align-items:center; gap:.5rem; flex:none;}
.navlinks{display:flex; gap:1.3rem; font-size:.85rem; color:var(--ink-muted);}
.navlinks a{text-decoration:none; transition:color .15s; display:flex; flex-direction:column; line-height:1.3;}
.navlinks a .en-inline{font-size:.72rem;}
.navlinks a:hover{color:var(--ink);}
.navlinks a.active{color:var(--gold-strong,var(--gold));}
.theme-toggle, .nav-toggle{width:40px;height:40px;border-radius:50%; border:1px solid var(--border-strong); background:var(--surface);
  display:grid; place-items:center; font-size:1.05rem; transition: transform .2s; flex:none;}
.theme-toggle:hover, .nav-toggle:hover{transform:translateY(-1px);}
.nav-toggle{display:none;}
@media (max-width:820px){
  .nav-toggle{display:grid;}
  .navlinks{
    display:none; position:absolute; inset-inline:0; top:calc(100% + 1px);
    flex-direction:column; gap:0; background:var(--surface); border:1px solid var(--border);
    border-top:none; border-radius:0 0 var(--radius-m) var(--radius-m); box-shadow:var(--shadow-lg); padding:.4rem;
  }
  .navlinks.open{display:flex;}
  .navlinks a{flex-direction:row; align-items:center; justify-content:space-between; padding:.9rem 1rem; border-radius:var(--radius-s); gap:1rem;}
  .navlinks a:hover{background:var(--surface-2);}
  .navlinks a .en-inline{font-size:.78rem;}
}

.mobile-quicknav{display:none;}
@media (max-width:820px){
  .mobile-quicknav{display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; padding:0 clamp(1rem,4vw,2.5rem) .9rem;}
  .mobile-quicknav a{display:flex; align-items:center; justify-content:center; text-align:center; padding:.75rem .5rem; border-radius:999px;
    border:1px solid var(--border-strong); font-size:.76rem; font-weight:700; color:var(--ink); text-decoration:none; line-height:1.25;}
  .mobile-quicknav a:hover, .mobile-quicknav a.active{border-color:var(--teal); color:var(--teal);}
}

.btn{display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 1.5rem; border-radius:999px; border:1px solid transparent;
  font-weight:700; font-size:.95rem; transition:transform .15s, box-shadow .15s, filter .15s; flex-direction:column; line-height:1.25; text-decoration:none;}
.btn .en-inline{font-weight:600;}
.btn:hover{transform:translateY(-2px);} .btn:active{transform:translateY(0);}
.btn-gold{background:var(--btn-gold-bg); color:var(--btn-gold-ink); box-shadow:var(--shadow);}
.btn-gold .en-inline{color:color-mix(in srgb, var(--btn-gold-ink) 75%, transparent);}
.btn-teal{background:var(--btn-teal-bg); color:var(--btn-teal-ink); box-shadow:var(--shadow);}
.btn-teal .en-inline{color:color-mix(in srgb, var(--btn-teal-ink) 75%, transparent);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--border-strong);}
.btn-ghost:hover{border-color:var(--teal); color:var(--teal);}
.btn-sm{padding:.55rem 1.05rem; font-size:.85rem;}
.btn-row{flex-direction:row;}

.hero{position:relative; padding-block:clamp(3.5rem,9vw,6.5rem) clamp(2.5rem,6vw,4rem); overflow:hidden;}
#heroCanvas{position:absolute; inset:0; width:100%; height:100%; opacity:.55; pointer-events:none;}
.hero .wrap{position:relative; z-index:2;} .hero-inner{max-width:800px;}
.hero-kicker{font-family:var(--font-b); color:var(--ink); font-weight:600; font-size:.8rem;}
.hero h1{font-size:clamp(2.1rem,5vw,3.4rem); line-height:1.16; letter-spacing:-.01em;}
.hero h1 em{font-style:normal; color:var(--gold);}
.hero h1 .en-line{font-size:.42em; font-weight:700; margin-top:.5rem;}
.hero .lede{margin-top:1.1rem; font-size:1.08rem; color:var(--ink-muted); max-width:62ch;}
.hero .lede .en-line{font-size:.92em;}
.hero-ctas{display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2.1rem;}
.trust-strip{margin-top:2.6rem; display:flex; align-items:center; gap:.7rem; font-size:.78rem; color:var(--ink-faint); flex-wrap:wrap;}
.trust-strip .dot{width:5px;height:5px;border-radius:50%;background:var(--ink-faint);}
.trust-strip .en-inline{font-size:.85em;}

/* generic page header used on non-home pages */
.page-hero{padding-block:clamp(2.4rem,6vw,3.6rem) 0;}
.page-hero .eyebrow{display:block; margin-bottom:.5rem;}
.page-hero h1{font-size:clamp(1.8rem,4vw,2.6rem);}
.page-hero h1 .en-line{font-size:.5em; margin-top:.4rem;}
.page-hero p{color:var(--ink-muted); margin-top:.8rem; max-width:70ch;}
.page-hero p .en-line{font-size:.92em;}

.choice-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; margin-top:1rem;}
@media (max-width:720px){ .choice-grid{grid-template-columns:1fr;} }
#catPickerGrid{grid-template-columns:repeat(3,1fr);}
@media (max-width:900px){ #catPickerGrid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ #catPickerGrid{grid-template-columns:1fr;} }
.choice-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.6rem;
  text-align:start; display:flex; flex-direction:column; gap:.55rem; transition:border-color .18s, transform .18s, box-shadow .18s;}
.choice-card:hover{border-color:var(--teal); transform:translateY(-3px); box-shadow:var(--shadow);}
.choice-card .ico{font-size:1.8rem;} .choice-card h3{font-size:1.1rem;}
.choice-card p{color:var(--ink-muted); font-size:.88rem;}
.choice-card .go{font-size:.85rem; color:var(--teal); font-weight:700; margin-top:.3rem;}

.quiz-shell{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:clamp(1.4rem,4vw,2.4rem); box-shadow:var(--shadow);}
.quiz-progress{display:flex; gap:.4rem; margin-bottom:1.6rem;}
.quiz-progress i{flex:1; height:4px; border-radius:3px; background:var(--border-strong); overflow:hidden;}
.quiz-progress i.done{background:var(--teal);}
.quiz-q{font-size:.75rem; letter-spacing:.08em; color:var(--teal); font-weight:700; text-transform:uppercase; font-family:var(--font-m);}
.quiz-title{font-size:clamp(1.15rem,2.6vw,1.5rem); margin-top:.5rem;}
.quiz-title .en-line{font-size:.58em;}
.quiz-opts{display:grid; gap:.7rem; margin-top:1.5rem;}
.quiz-opt{display:flex; align-items:center; gap:.9rem; text-align:start; background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--radius-m); padding:.9rem 1.15rem; font-size:.96rem; transition:border-color .15s, background .15s;}
.quiz-opt:hover{border-color:var(--teal); background:var(--teal-soft);}
.quiz-opt .bullet{width:26px;height:26px;border-radius:50%;border:2px solid var(--border-strong); flex:none;
  display:grid; place-items:center; font-size:.7rem; color:var(--ink-faint);}
.quiz-opt .txt{display:flex; flex-direction:column; gap:.1rem;}
.quiz-opt .en-inline{font-size:.78rem;}
.quiz-nav{display:flex; justify-content:space-between; align-items:center; margin-top:1.8rem;}
.quiz-back{font-size:.85rem; color:var(--ink-muted); background:none; border:none; display:flex; align-items:center; gap:.3rem;}
.quiz-back:hover{color:var(--ink);}

.bar-row{display:grid; grid-template-columns: 190px 1fr 60px; align-items:center; gap:.9rem; padding-block:.5rem;}
@media (max-width:600px){ .bar-row{grid-template-columns: 120px 1fr 46px; gap:.5rem;} }
.bar-row .lbl{font-size:.86rem; display:flex; flex-direction:column; font-weight:600;}
.bar-row .lbl .en-inline{font-size:.72rem; font-weight:500;}
.bar-track{height:12px; border-radius:8px; background:var(--surface-2); overflow:hidden; border:1px solid var(--border);}
.bar-fill{height:100%; border-radius:8px; transition:width .9s cubic-bezier(.16,1,.3,1);}
.bar-row .pct{font-size:.82rem; color:var(--ink-muted); text-align:end;}

.top-picks{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2rem;}
@media (max-width:820px) and (min-width:561px){ .top-picks{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .top-picks{grid-template-columns:1fr;} }
.pick-card{border:1.5px solid var(--gold); background:var(--gold-soft); border-radius:var(--radius-l); padding:1.4rem;
  display:flex; flex-direction:column; gap:.4rem; text-align:start; transition:transform .15s;}
.pick-card:hover{transform:translateY(-3px);}
.pick-card .rank{font-family:var(--font-m); font-size:.72rem; color:var(--gold-strong,var(--gold)); font-weight:700;}
.pick-card h4{font-size:1.02rem;} .pick-card .en-inline{font-size:.78rem;}
.pick-card .match{font-size:.8rem; color:var(--ink-muted); margin-top:.2rem;}

.roadmap-head{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.4rem;}
.roadmap-head .cat-title{display:flex; align-items:center; gap:.7rem;}
.roadmap-head .cat-title .ico{font-size:1.8rem;} .roadmap-head h2{font-size:1.35rem;}
.roadmap-head h2 .en-line{font-size:.55em;}
.change-path{font-size:.8rem; color:var(--teal); background:none; border:1px solid var(--border-strong); border-radius:999px; padding:.4rem .9rem; text-decoration:none;}

.budget-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.4rem 1.6rem; margin-bottom:2.2rem; display:flex; flex-direction:column; gap:.9rem;}
.budget-top{display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:.5rem;}
.budget-top .field-label .en-inline{display:block;}
.budget-top .amt{font-family:var(--font-m); font-size:1.6rem; font-weight:700;}
.budget-seg{display:flex; height:14px; border-radius:8px; overflow:hidden; border:1px solid var(--border);}
.budget-seg span{height:100%;}
.budget-legend{display:flex; gap:1.2rem; flex-wrap:wrap; font-size:.8rem; color:var(--ink-muted);}
.budget-legend .k{display:flex; align-items:center; gap:.4rem;}
.budget-legend .sw{width:10px;height:10px;border-radius:3px;}
.budget-note{font-size:.78rem; color:var(--ink-faint);} .budget-note .en-line{font-size:.95em;}

.trail{position:relative; display:flex; flex-direction:column; gap:0;}
.stage{position:relative; padding-inline-start:2.6rem; padding-bottom:2.6rem;}
.stage:last-child{padding-bottom:0;}
.stage::before{content:""; position:absolute; inset-inline-start:11px; top:34px; bottom:-6px; width:2px;
  background:linear-gradient(var(--stage-color,var(--teal)), var(--border-strong));}
.stage:last-child::before{display:none;}
.stage-node{position:absolute; inset-inline-start:0; top:0; width:24px; height:24px; border-radius:50%; background:var(--stage-color);
  box-shadow:0 0 0 4px var(--bg), 0 0 0 5px var(--stage-color); display:grid; place-items:center; color:#fff; font-size:.68rem; font-weight:800; font-family:var(--font-m);}
.stage-head{display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; margin-bottom:.3rem;}
.stage-head h3{font-size:1.1rem;} .stage-head .en-inline{font-size:.8rem;}
.stage-head .tag{font-size:.68rem; font-family:var(--font-m); text-transform:uppercase; letter-spacing:.05em; color:var(--stage-color);
  background:color-mix(in srgb, var(--stage-color) 14%, transparent); padding:.2rem .55rem; border-radius:999px;}
.stage-desc{font-size:.86rem; color:var(--ink-muted); margin-bottom:1.1rem; max-width:62ch;}
.stage-desc .en-line{font-size:.9em;}

.cert-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem;}
@media (max-width:420px){ .cert-grid{grid-template-columns:1fr;} }
.cert-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); padding:1.1rem 1.2rem;
  display:flex; flex-direction:column; gap:.6rem; transition:border-color .15s, transform .15s;}
.cert-card:hover{border-color:var(--stage-color,var(--teal)); transform:translateY(-2px);}
.cert-card .top-row{display:flex; justify-content:space-between; gap:.6rem; align-items:flex-start;}
.cert-card h4{font-size:.96rem; line-height:1.4;}
.cert-card .en-inline.title{display:block; font-size:.78rem; margin-top:.15rem; font-weight:700;}
.cert-card .provider{font-size:.74rem; color:var(--ink-faint); font-family:var(--font-m); margin-top:.25rem;}
.cert-card .desc{font-size:.83rem; color:var(--ink-muted);}
.cert-card .desc .en-line{font-size:.94em;}
.price-pill{flex:none; font-family:var(--font-m); font-size:.76rem; font-weight:700; background:var(--teal-soft); color:var(--teal);
  padding:.28rem .55rem; border-radius:8px; white-space:nowrap; text-align:center;}
.price-pill small{display:block; font-size:.62rem; font-weight:500; opacity:.75;}
.cert-card .recommended{font-size:.7rem; font-weight:700; color:var(--gold); display:flex; align-items:center; gap:.3rem;}
.skill-chips{display:flex; flex-wrap:wrap; gap:.35rem;}
.skill-chip{font-size:.68rem; font-family:var(--font-m); background:var(--surface-2); border:1px solid var(--border);
  color:var(--ink-muted); padding:.18rem .5rem; border-radius:999px; direction:ltr; unicode-bidi:isolate;}
.cert-foot{display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-top:.2rem; border-top:1px dashed var(--border); padding-top:.6rem;}
.cert-link{font-size:.76rem; font-weight:700; color:var(--stage-color,var(--teal)); text-decoration:none; display:flex; align-items:center; gap:.3rem;}
.cert-link:hover{text-decoration:underline;}
.cert-nolink{font-size:.72rem; color:var(--ink-faint);}

.roadmap-actions{display:flex; gap:1rem; flex-wrap:wrap; margin-top:2.4rem;}

/* courses */
.course-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.1rem;}
@media (max-width:420px){ .course-grid{grid-template-columns:1fr;} }
.course-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.3rem;
  display:flex; flex-direction:column; gap:.6rem; transition:transform .15s, border-color .15s;}
.course-card:hover{transform:translateY(-3px); border-color:var(--violet);}
.course-top{display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem;}
.course-provider{font-size:.72rem; font-family:var(--font-m); color:var(--violet); background:var(--violet-soft); padding:.2rem .55rem; border-radius:999px; width:fit-content;}
.free-badge{font-size:.68rem; font-weight:700; padding:.2rem .5rem; border-radius:999px; white-space:nowrap;}
.free-badge.free{background:var(--good-soft); color:var(--good);}
.free-badge.paid{background:var(--warn-soft); color:var(--warn);}
.course-card h4{font-size:1.02rem;} .course-card .en-inline.title{display:block; font-size:.8rem; font-weight:700; margin-top:.1rem;}
.course-card .desc{font-size:.85rem; color:var(--ink-muted);} .course-card .desc .en-line{font-size:.92em;}

/* CV coach */
.cv-shell{display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; align-items:start;}
@media (max-width:900px){ .cv-shell{grid-template-columns:1fr;} }
.cv-input{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.4rem; display:flex; flex-direction:column; gap:1rem;}
.field-label{font-size:.8rem; color:var(--ink-muted); font-weight:700;}
.field-label .en-inline{display:block; font-weight:600;}
.cv-input select{padding:.6rem .8rem; border-radius:var(--radius-s); border:1px solid var(--border-strong); background:var(--surface-2); color:var(--ink); font-size:.88rem; width:100%;}
.file-drop{border:2px dashed var(--border-strong); border-radius:var(--radius-m); padding:1.6rem 1rem; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:.5rem; cursor:pointer; transition:border-color .15s, background .15s; background:var(--surface-2);}
.file-drop:hover, .file-drop.drag{border-color:var(--teal); background:var(--teal-soft);}
.file-drop .ico{font-size:1.8rem;}
.file-drop .fname{font-size:.82rem; color:var(--teal); font-weight:700; word-break:break-all;}
.file-drop input{display:none;}
.file-formats{font-size:.74rem; color:var(--ink-faint); text-align:center;}

.cv-report{display:flex; flex-direction:column; gap:1.2rem;}
.ats-verdict{display:flex; align-items:flex-start; gap:.9rem; border-radius:var(--radius-l); padding:1.1rem 1.3rem; margin-bottom:1rem; border:1px solid transparent;}
.ats-verdict .ats-ic{font-size:1.5rem; line-height:1; flex:none;}
.ats-verdict h4{font-size:1rem; margin-bottom:.25rem;}
.ats-verdict p{font-size:.82rem; color:var(--ink-muted);}
.ats-verdict.ats-good{background:var(--good-soft); border-color:var(--good);}
.ats-verdict.ats-warn{background:var(--warn-soft); border-color:var(--warn);}
.ats-verdict.ats-bad{background:var(--bad-soft); border-color:var(--bad);}
.score-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.5rem; display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap;}
.score-tile .num-big{font-family:var(--font-m); font-size:3rem; font-weight:800; line-height:1;}
.score-tile .score-meta{min-width:200px;}
@media (max-width:460px){ .score-tile{padding:1.2rem; gap:1rem;} .score-tile .num-big{font-size:2.4rem;} }
.score-tile .score-meta{flex:1; display:flex; flex-direction:column; gap:.5rem;}
.score-track{height:10px; border-radius:6px; background:var(--surface-2); overflow:hidden; border:1px solid var(--border);}
.score-fill{height:100%; border-radius:6px; transition:width .8s cubic-bezier(.16,1,.3,1);}
.score-tag{font-size:.85rem; font-weight:700;} .score-tag .en-inline{font-size:.75rem; margin-inline-start:.4rem;}

.check-list{display:flex; flex-direction:column; gap:.6rem;}
.check-item{display:flex; gap:.8rem; align-items:flex-start; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); padding:.9rem 1.05rem;}
.check-ic{flex:none; width:24px;height:24px;border-radius:50%; display:grid; place-items:center; font-size:.75rem; font-weight:800; color:#fff; margin-top:.1rem;}
.check-item h5{font-size:.9rem; margin-bottom:.2rem;} .check-item h5 .en-inline{font-size:.75rem; margin-inline-start:.4rem; font-weight:600;}
.check-item p{font-size:.82rem; color:var(--ink-muted);} .check-item p .en-line{font-size:.92em;}
.cv-empty{color:var(--ink-faint); font-size:.9rem; text-align:center; padding:3rem 1rem; border:1px dashed var(--border-strong); border-radius:var(--radius-l);}
.cv-empty .en-line{font-size:.9em; margin-top:.4rem;}

.catalog-controls{display:flex; gap:.8rem; flex-wrap:wrap; margin-bottom:1.6rem;}
.catalog-controls input, .catalog-controls select{padding:.7rem 1rem; border-radius:999px; border:1px solid var(--border-strong); background:var(--surface); color:var(--ink); font-size:.88rem;}
.catalog-controls input{flex:1; min-width:0; width:100%;}
@media (max-width:600px){
  .catalog-controls{flex-direction:column;}
  .catalog-controls input, .catalog-controls select, .cv-input select{font-size:16px;}
}
.catalog-count{font-size:.8rem; color:var(--ink-faint); margin-bottom:1rem;}
#catalogGrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem;}
@media (max-width:420px){ #catalogGrid{grid-template-columns:1fr;} }
.cat-chip{font-size:.7rem; font-family:var(--font-m); color:var(--violet); background:var(--violet-soft); padding:.2rem .5rem; border-radius:999px; width:fit-content;}

/* admin dashboard */
.admin-shell{max-width:480px; margin:0 auto;}
.admin-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.6rem; display:flex; flex-direction:column; gap:1rem;}
.admin-card label{font-size:.82rem; font-weight:700; color:var(--ink-muted); display:flex; flex-direction:column; gap:.35rem;}
.admin-card input{padding:.7rem .9rem; border-radius:var(--radius-s); border:1px solid var(--border-strong); background:var(--surface-2); color:var(--ink); font-size:16px;}
.admin-error{font-size:.82rem; color:var(--bad); min-height:1.2em;}
.stat-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1rem; margin-bottom:2rem;}
.stat-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.2rem 1.4rem;}
.stat-tile .num{display:block; font-size:2rem; font-weight:800; color:var(--teal);}
.stat-tile .lbl{font-size:.8rem; color:var(--ink-muted);}
.daybar-row{display:flex; align-items:flex-end; gap:.5rem; height:140px; padding:0 .2rem;}
.daybar{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:.35rem; height:100%;}
.daybar .col{width:100%; max-width:26px; border-radius:4px 4px 0 0; background:var(--teal); min-height:2px; transition:height .5s cubic-bezier(.16,1,.3,1);}
.daybar.top .col{background:var(--gold);}
.daybar .d-label{font-size:.62rem; color:var(--ink-faint); font-family:var(--font-m); writing-mode:horizontal-tb;}
.admin-table{width:100%; border-collapse:collapse; font-size:.8rem;}
.admin-table th{text-align:start; color:var(--ink-faint); font-weight:700; padding:.5rem .6rem; border-bottom:1px solid var(--border); font-size:.72rem; text-transform:uppercase; font-family:var(--font-m);}
.admin-table td{padding:.55rem .6rem; border-bottom:1px solid var(--border); color:var(--ink-muted);}
.table-scroll{overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-m);}
.admin-note{font-size:.78rem; color:var(--ink-faint);}

.about-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.4rem 1.6rem; margin-bottom:1.2rem;}
.about-card summary{font-size:1.02rem; font-weight:700; cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:.6rem;}
.about-card summary::-webkit-details-marker{display:none;}
.about-card summary::after{content:"+"; font-size:1.3rem; line-height:1; color:var(--ink-faint); transition:transform .2s;}
.about-card[open] summary::after{transform:rotate(45deg);}
.about-card[open] summary{margin-bottom:.6rem;}
.about-card p{font-size:.85rem; color:var(--ink-muted);}
.contact-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.1rem 1.4rem; margin-bottom:1.2rem; width:fit-content; max-width:100%;}
.contact-card h3{font-size:1.02rem; font-weight:700; margin-bottom:.8rem; white-space:nowrap;}
.contact-row{display:flex; flex-direction:column; gap:.7rem; width:fit-content;}
.contact-icon{width:44px; height:44px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--border-strong);
  background:var(--surface); color:var(--ink); text-decoration:none; transition:transform .15s, border-color .15s, color .15s;}
.contact-icon svg{width:20px; height:20px;}
.contact-icon:hover{transform:translateY(-2px); border-color:var(--teal); color:var(--teal);}
.contact-icon.linkedin-icon{background:#0A66C2; border-color:#0A66C2;}
.contact-icon.linkedin-icon svg{width:22px; height:22px;}
.contact-icon.linkedin-icon:hover{background:#004182; border-color:#004182;}

.terms-box{border:1px solid var(--border); border-radius:var(--radius-m); padding:1rem 1.1rem; background:var(--surface-2); display:flex; flex-direction:column; gap:.6rem;}
.terms-box h3{font-size:.95rem;}
.terms-box ul{list-style:disc; padding-inline-start:1.3rem; display:flex; flex-direction:column; gap:.35rem; font-size:.82rem; color:var(--ink-muted);}
.terms-box label{display:flex; align-items:flex-start; gap:.55rem; cursor:pointer; font-size:.85rem; font-weight:700; margin-top:.2rem;}
.terms-box input[type="checkbox"]{width:18px; height:18px; margin-top:.15rem; accent-color:var(--teal); flex:none;}
.file-drop.disabled{opacity:.45; pointer-events:none;}
.btn:disabled{opacity:.5; cursor:not-allowed; filter:grayscale(.35);}
.btn:disabled:hover{transform:none;}

footer{border-top:1px solid var(--border); padding-block:2.4rem; margin-top:2rem;}
footer .wrap{display:flex; flex-direction:column; gap:1rem;}
footer p{font-size:.78rem; color:var(--ink-faint); max-width:85ch;}
footer p.en-line{font-size:.95em;}
footer .brand{font-size:.95rem;}
footer .trust-strip{margin-top:0;}
.footer-credit{margin-top:.6rem; padding-top:1.1rem; border-top:1px solid var(--border); text-align:center; display:flex; flex-direction:column; gap:.3rem;}
.footer-credit p{font-size:.72rem; color:var(--ink-faint); margin:0; max-width:none;}

.hidden{display:none !important;}
.reveal{opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease;}
.reveal.show{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  .btn:hover, .choice-card:hover, .cert-card:hover, .pick-card:hover, .course-card:hover{transform:none;}
}
