:root{--ink:#0e1b2b;--navy:#14304f;--navy2:#1d4268;--gold:#f0bd45;--teal:#2f7f73;--mist:#eef3f7;--paper:#fbfcfd;--line:#dbe4ec;--muted:#51647a;--r:14px}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font-family:"Source Sans 3",system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.6;font-size:17px}
h1,h2,h3{font-family:"Bricolage Grotesque",Georgia,serif;line-height:1.1;letter-spacing:-.02em}
a{color:inherit}img,svg{max-width:100%}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.wrap{width:min(1160px,92%);margin:auto}
.btn{display:inline-block;padding:.85rem 1.5rem;border-radius:10px;font-weight:700;text-decoration:none;border:2px solid transparent;cursor:pointer;font:inherit;font-weight:700;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.gold{background:var(--gold);color:var(--ink)}.gold:hover{background:#f5c95f}
.ghost{border-color:rgba(255,255,255,.4);color:#fff}.ghost:hover{background:rgba(255,255,255,.1)}
.dark{background:var(--navy);color:#fff}
/* nav */
header{position:sticky;top:0;z-index:50;background:rgba(20,48,79,.97);backdrop-filter:blur(8px)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-family:"Bricolage Grotesque";font-weight:800;font-size:1.5rem;color:#fff;text-decoration:none}.logo b{color:var(--gold)}
nav ul{display:flex;gap:1.6rem;list-style:none;padding:0}nav a{color:#cfdbe8;text-decoration:none;font-weight:600;font-size:.97rem}nav a:hover{color:#fff}
.menu{display:none;background:none;border:0;color:#fff;font-size:1.7rem;cursor:pointer}
/* hero */
.hero{background:linear-gradient(160deg,var(--navy) 0%,#0f2740 70%);color:#fff;padding:5rem 0 6rem;overflow:hidden;position:relative}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--gold)}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.hero h1{font-size:clamp(2.4rem,5.2vw,4rem);font-weight:800}
.hero p.lead{font-size:1.2rem;color:#c8d7e6;margin:1.3rem 0 2rem;max-width:34rem}
.cta{display:flex;gap:.9rem;flex-wrap:wrap}
.proof{margin-top:2rem;display:flex;gap:.6rem;flex-wrap:wrap}
.proof span{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);padding:.3rem .85rem;border-radius:99px;font-size:.88rem;color:#dbe7f2}
/* hero mock */
.mock{position:relative;background:#fff;color:var(--ink);border-radius:18px;padding:1.2rem;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.mock .top{display:flex;justify-content:space-between;font-size:.82rem;color:var(--muted);margin-bottom:.8rem}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.kpi{border-left:4px solid var(--c);background:var(--b);padding:.6rem .7rem;border-radius:8px}
.kpi small{display:block;color:var(--c);font-weight:700;font-size:.74rem}.kpi strong{font-family:"Bricolage Grotesque";font-size:1.35rem}
.bars{display:flex;align-items:flex-end;gap:.5rem;height:96px;margin:1rem 0 .3rem}
.bars i{flex:1;background:var(--teal);border-radius:5px 5px 0 0;height:var(--h)}.bars i:nth-child(odd){background:var(--navy2)}
.mock .cap{font-size:.78rem;color:var(--muted)}
.toast{position:absolute;right:-18px;bottom:-26px;width:250px;background:var(--ink);color:#fff;border-radius:14px;padding:.85rem 1rem;box-shadow:0 18px 40px rgba(0,0,0,.4);font-size:.88rem;opacity:0;transform:translateY(14px);animation:toast 7s 1.2s infinite}
.toast b{color:var(--gold)}.toast small{display:block;color:#9fb3c8}
@keyframes toast{0%,6%{opacity:0;transform:translateY(14px)}12%,70%{opacity:1;transform:none}80%,100%{opacity:0;transform:translateY(-6px)}}
/* sections */
section{padding:5.5rem 0}.alt{background:var(--mist)}
.head{max-width:40rem;margin-bottom:3rem}.head h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin-bottom:.8rem}.head p{color:var(--muted);font-size:1.12rem}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:1.1rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem}
.card h3{font-size:1.3rem;margin:.9rem 0 .5rem}.card p{color:var(--muted)}
.ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:1.4rem;background:var(--mist)}
.b2{grid-column:span 2}.b3{grid-column:span 3}.b4{grid-column:span 4}
.feat{background:var(--navy);color:#fff;border:0}.feat p{color:#c3d3e3}.feat .ic{background:rgba(255,255,255,.12)}
.card ul{margin:.8rem 0 0 1.1rem;color:var(--muted)}
/* timetable */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.tt{display:grid;grid-template-columns:70px repeat(5,1fr);gap:4px;font-size:.78rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:.8rem}
.tt div{padding:.5rem .3rem;border-radius:6px;text-align:center;background:var(--mist);font-weight:600}
.tt .h{background:var(--navy);color:#fff}.tt .m{background:#e0f0ec;color:#1d5a50}.tt .a{background:#fdf1d0;color:#7a5a00}.tt .b{background:#e3e8ee;color:var(--muted);grid-column:1/-1}
.checks{list-style:none;padding:0;display:grid;gap:.7rem;margin-top:1.4rem}.checks li{padding-left:1.9rem;position:relative}.checks li:before{content:"✓";position:absolute;left:0;color:var(--teal);font-weight:800}
/* roles */
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.tab{border:1px solid var(--line);background:#fff;padding:.6rem 1.2rem;border-radius:99px;font:inherit;font-weight:700;cursor:pointer;color:var(--muted)}
.tab[aria-selected=true]{background:var(--navy);color:#fff;border-color:var(--navy)}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:2rem;display:none;grid-template-columns:1fr 1fr;gap:2rem}.panel.on{display:grid}
.panel h3{font-size:1.5rem;margin-bottom:.6rem}.panel ul{margin-left:1.1rem;display:grid;gap:.4rem}
/* compare */
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.tbl th,.tbl td{padding:.9rem 1rem;text-align:center;border-bottom:1px solid var(--line)}.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl thead th{background:var(--navy);color:#fff}.tbl thead th:nth-child(2){background:var(--gold);color:var(--ink)}
.y{color:var(--teal);font-weight:800}.n{color:#b3bfcb}
.scroll{overflow-x:auto}
/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;counter-reset:s}
.step{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem}
.step:before{content:counter(s);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--gold);font-weight:800;margin-bottom:.9rem}
.step h3{font-size:1.2rem;margin-bottom:.4rem}.step p{color:var(--muted)}
/* faq */
details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:1.1rem 1.3rem;margin-bottom:.7rem}
summary{font-weight:700;cursor:pointer}details p{margin-top:.7rem;color:var(--muted)}
/* contact */
.contact{background:var(--navy);color:#fff}.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.contact h2{font-size:clamp(1.9rem,3.6vw,2.7rem);margin-bottom:1rem}.contact p{color:#c3d3e3}
form{background:#fff;color:var(--ink);border-radius:var(--r);padding:1.6rem;display:grid;gap:.9rem}
label{font-weight:600;font-size:.92rem;display:grid;gap:.3rem}
input,select,textarea{font:inherit;padding:.7rem .8rem;border:1px solid #c5d2de;border-radius:9px;width:100%}
.msg{font-size:.9rem;color:var(--teal);min-height:1.2em}
footer{background:#0b1a2b;color:#9fb3c8;padding:2.2rem 0;font-size:.92rem}footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem}
@media(max-width:900px){
 .hero .wrap,.split,.contact .wrap,.panel{grid-template-columns:1fr}.bento{grid-template-columns:1fr 1fr}.b2,.b3,.b4{grid-column:span 2}.steps{grid-template-columns:1fr}
 .toast{right:8px}.menu{display:block}nav ul{display:none;position:absolute;top:68px;left:0;right:0;background:var(--navy);flex-direction:column;padding:1rem 4%}nav ul.open{display:flex}section{padding:4rem 0}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}.toast{opacity:1;transform:none}}
.login{border:2px solid rgba(255,255,255,.45);color:#fff!important;padding:.4rem 1.1rem}.login:hover{background:rgba(255,255,255,.12)}
.portals{background:var(--gold);padding:2.6rem 0}.portals h2{font-size:1.6rem;margin-bottom:1.2rem}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.pgrid a{background:#fff;border-radius:var(--r);padding:1rem 1.2rem;text-decoration:none;display:grid;gap:.15rem;transition:transform .15s}.pgrid a:hover{transform:translateY(-3px)}
.pgrid span{font-size:1.6rem}.pgrid small{color:var(--muted)}
.sub{font-size:1.5rem;margin:3rem 0 1.2rem}
.mods{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.mods div{border-top:3px solid var(--gold);background:#fff;border-radius:0 0 10px 10px;padding:1rem;border:1px solid var(--line);border-top:3px solid var(--gold)}
.mods p{color:var(--muted);font-size:.93rem;margin-top:.3rem}
.adv{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem 2rem}
.adv div{border-left:4px solid var(--teal);padding-left:1.1rem}.adv h3{font-size:1.25rem;margin-bottom:.4rem}.adv p{color:var(--muted)}
.app{background:linear-gradient(160deg,var(--navy),#0f2740);color:#fff}.app h2{font-size:clamp(1.9rem,3.6vw,2.7rem);margin-bottom:.8rem}.app p{color:#c8d7e6}.app .checks li:before{color:var(--gold)}
.phone{width:250px;margin:auto;background:#fff;color:var(--ink);border-radius:34px;border:8px solid #0b1a2b;padding:1rem;display:grid;gap:.6rem;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.pbar{width:60px;height:5px;background:#cbd5df;border-radius:9px;margin:0 auto}.phone b{font-family:"Bricolage Grotesque";font-size:1.2rem}
.pc{background:var(--mist);border-radius:12px;padding:.7rem;font-size:.85rem}.pc.g{background:#e0f0ec}.pc.o{background:#fdf1d0}.pc strong{font-size:1.2rem}
@media(max-width:900px){.pgrid,.mods{grid-template-columns:1fr 1fr}.adv{grid-template-columns:1fr}.nav .login{display:none}}