:root{--bg:#f6fbff;--ink:#12263a;--muted:#4a5f73;--p:#0b6e99;--p2:#0a5273;--acc:#f59e0b;--wa:#15803d;--wa2:#116a32;--card:#fff;--line:#d9e7f2;--soft:#eaf5fc}
*{box-sizing:border-box}
html{scroll-behavior:smooth;font-size:112.5%}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.65;color:var(--ink);background:var(--bg)}
a{color:var(--p)}
.wrap{max-width:1050px;margin:0 auto;padding:0 20px}
.center{text-align:center}
.hidden{display:none!important}
.small{font-size:.85rem;color:var(--muted)}
.top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 18px;padding-top:10px;padding-bottom:10px}
.logo{font-weight:800;font-size:1.4rem;text-decoration:none;color:var(--p2)}
nav{display:flex;flex-wrap:wrap;gap:4px 14px}
nav a{text-decoration:none;color:var(--ink);font-weight:600;padding:4px 8px;border-radius:10px}
nav a:hover,nav a.on{background:var(--soft);color:var(--p2)}
.hero{position:relative;overflow:hidden;text-align:center;padding:64px 0 56px;background:linear-gradient(135deg,#0b6e99,#0a8f7a);color:#fff}
.hero h1{font-size:2.5rem;line-height:1.2;margin:14px 0}
.hero h1 span{color:#ffe08a}
.small-hero{padding:40px 0}
.small-hero h1{font-size:2.1rem}
.lead{font-size:1.3rem;margin:8px 0}
.lead2{font-size:1.15rem;color:var(--muted);margin:6px 0 20px}
.hero .lead{color:#eaf9ff}
.flags{font-size:1.15rem;font-weight:700}
.pill{display:inline-block;background:rgba(255,255,255,.18);padding:6px 16px;border-radius:99px;font-weight:700;font-size:1.05rem}
.float{position:absolute;font-size:2.2rem;opacity:.25;animation:fl 6s ease-in-out infinite}
.f1{top:12%;left:6%}.f2{top:60%;left:10%;animation-delay:1s}.f3{top:18%;right:8%;animation-delay:2s}.f4{top:65%;right:7%;animation-delay:.5s}.f5{top:6%;left:46%;animation-delay:3s}.f6{bottom:6%;left:48%;animation-delay:1.5s}
@keyframes fl{50%{transform:translateY(-14px) rotate(8deg)}}
.cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:24px 0 6px}
.btn{display:inline-block;border:0;cursor:pointer;font:inherit;font-size:1.15rem;font-weight:800;text-decoration:none;color:#fff;background:var(--wa);padding:15px 28px;border-radius:99px;box-shadow:0 6px 16px rgba(0,0,0,.18);transition:transform .15s,background .15s}
.btn:hover{background:var(--wa2);transform:translateY(-2px)}
.btn.alt{background:#fff;color:var(--p2);border:2px solid var(--p)}
.btn.alt:hover{background:var(--soft)}
.hero .btn.alt{border-color:#fff}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:-28px;position:relative;z-index:2}
.stats div{background:#fff;border-radius:18px;padding:16px 8px;text-align:center;box-shadow:0 6px 18px rgba(11,110,153,.15)}
.stats b{display:block;font-size:1.5rem;color:var(--p2)}
.stats span{color:var(--muted);font-size:1rem}
.sec{padding-top:48px;padding-bottom:48px}
h2{font-size:1.9rem;text-align:center;margin:0 0 26px;color:var(--p2)}
.band{background:var(--soft)}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 4px 14px rgba(11,110,153,.08)}
.card h3{margin:0 0 8px;font-size:1.3rem}
.card p{margin:6px 0}
.lvl-title{font-weight:800;color:var(--muted);margin-top:14px!important}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{background:var(--soft);color:var(--p2);font-weight:700;padding:6px 14px;border-radius:99px}
.feat{text-align:center}
.ico{font-size:2.6rem}
.steps .num{width:46px;height:46px;border-radius:50%;background:var(--acc);color:#fff;font-weight:800;font-size:1.4rem;display:flex;align-items:center;justify-content:center;margin:0 auto 8px}
.steps .card{text-align:center}
.resume{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}
.resume figure{margin:0;text-align:center}
.resume img{max-width:100%;border-radius:16px;border:1px solid var(--line);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.resume figcaption{margin-top:8px;color:var(--muted);font-weight:600}
.resume-txt p{font-size:1.25rem;font-weight:700;margin:10px 0}
.quizband{background:linear-gradient(135deg,#fff3d6,#ffe6a8)}
.prog{background:#fff;border:1px solid var(--line);border-radius:16px;margin:12px 0;padding:6px 18px}
.prog summary{cursor:pointer;font-weight:800;font-size:1.2rem;padding:12px 0;color:var(--p2)}
.prog p{margin:10px 0}
.final{background:linear-gradient(135deg,#0b6e99,#0a8f7a);color:#fff;padding:54px 0}
.final h2{color:#fff;margin-bottom:8px}
.final .lead{color:#eaf9ff}
.final .btn.alt{border-color:#fff}
.contactcard{max-width:520px;margin:0 auto;padding:30px}
.contactcard hr{border:0;border-top:1px solid var(--line);margin:26px 0}
.big-emoji{font-size:2.6rem;margin:0!important}
.mail{font-size:1.25rem;font-weight:800;word-break:break-all}
.legal{max-width:800px}
.legal h2{text-align:left;font-size:1.35rem;margin:28px 0 8px}
.legal p{margin:8px 0}
mark{background:#fff0b3;padding:1px 6px;border-radius:6px}
footer{background:#0f2a3d;color:#cfe3f1;text-align:center;padding:30px 0}
footer a{color:#fff}
footer p{margin:6px 0}
.flogo{font-size:1.3rem;font-weight:800;color:#fff}
.flinks{line-height:2}
.fab{position:fixed;right:16px;bottom:16px;z-index:30;width:62px;height:62px;border-radius:50%;background:var(--wa);color:#fff;font-size:1.9rem;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.3)}
/* quiz */
.q{background:#fff;border:2px solid var(--line);border-radius:18px;padding:18px 20px;margin:16px 0}
.q.ok{border-color:#16a34a;background:#f0fdf4}
.q.ko{border-color:#dc2626;background:#fef2f2}
.q h3{margin:0 0 10px;font-size:1.2rem}
.q h3 small{display:block;color:var(--muted);font-size:.85rem;font-weight:600}
.opt{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:8px 0;border:2px solid var(--line);border-radius:14px;cursor:pointer;font-size:1.1rem;background:#fff}
.opt:hover{background:var(--soft)}
.opt input{width:22px;height:22px;flex:none}
.opt.good{border-color:#16a34a;background:#dcfce7}
.opt.bad{border-color:#dc2626;background:#fee2e2}
.fb{margin-top:10px;font-weight:700}
.result{background:#fff;border:3px solid var(--acc);border-radius:20px;padding:22px;margin:22px 0;text-align:center;font-size:1.25rem}
.result b{font-size:2rem;color:var(--p2)}
@media(max-width:760px){
 html{font-size:106.25%}
 .hero h1{font-size:1.9rem}
 .grid2,.grid3,.resume{grid-template-columns:1fr}
 .stats{grid-template-columns:1fr;margin-top:-20px}
 .float{display:none}
}
@media(prefers-reduced-motion:reduce){.float{animation:none}html{scroll-behavior:auto}}