@import url('https://fonts.googleapis.com/css2?family=Mali:wght@400;500;600;700&family=Itim&display=swap');

:root{--n:#24395f;--o:#ed6b2e;--y:#f4c64d;--bg:#f7fbff;--line:#dbe5f1;--sh:0 16px 36px #24395f25}*{box-sizing:border-box}body{margin:0;font-family:'Mali','Itim',Tahoma,sans-serif;background:linear-gradient(#fffaf1,#eef6fd);color:#293143}a{text-decoration:none;color:inherit}img{max-width:100%}header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:16px;padding:8px max(16px,calc((100vw - 1380px)/2));background:#24395ff7;color:#fff;min-height:70px;box-shadow:0 8px 22px #0002}.brand{display:flex;align-items:center;gap:10px;font-size:1.8rem}.brand span{display:grid}.brand b{color:#ffd965;font-size:1.05rem}.brand small{font-size:.75rem}header nav{margin-left:auto;display:flex;gap:2px}header nav a{padding:10px;border-radius:999px;font-weight:800}header nav a:hover,header nav a.active{background:#fff;color:var(--n)}#mb{display:none;margin-left:auto;padding:10px 14px;border:0;border-radius:14px;background:#fff;color:var(--n);font-weight:800}.hero img{display:block;width:100%;max-height:78vh;object-fit:contain;background:#eef6fd}.hm{max-width:1280px;margin:-14px auto 30px;display:flex;overflow-x:auto;background:#fff;border-radius:22px;box-shadow:var(--sh)}.hm a{min-width:150px;flex:1;padding:18px 10px;text-align:center;font-weight:900;border-right:1px solid var(--line)}.container{max-width:1220px;margin:auto;padding:40px 18px}.head h1{font-size:clamp(2rem,4vw,3.3rem);color:var(--n);margin:0 0 10px}.head p{color:#667085;line-height:1.9}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.g2{display:grid;grid-template-columns:1fr 1fr;gap:22px}.card,.event,.table{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh)}.card{padding:22px;line-height:1.9}.card h2,.card h3,.event h3{color:var(--n)}.photo{display:block;width:100%;border-radius:20px;box-shadow:var(--sh);cursor:zoom-in}.timeline{display:grid;gap:18px}.event{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:22px;padding:18px;align-items:center}.event:nth-child(even){grid-template-columns:1fr minmax(300px,420px)}.event:nth-child(even) img{order:2}.event p{line-height:1.95}.sect{color:var(--n);margin:38px 0 18px}.note{padding:20px;border-radius:20px;background:var(--n);color:#fff;line-height:1.9}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.gallery figure{margin:0;background:#fff;padding:12px;border-radius:18px;box-shadow:var(--sh)}.gallery figcaption{font-weight:800;color:var(--n);padding:8px}.table{overflow:auto}table{border-collapse:collapse;width:100%;min-width:650px}th,td{padding:14px;border-bottom:1px solid var(--line);text-align:left}th{background:#eaf2ff;color:var(--n)}.progress{height:13px;background:#e7edf5;border-radius:99px;overflow:hidden}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--o),var(--y))}.q{background:#fff;border-radius:20px;box-shadow:var(--sh);padding:20px;margin:16px 0}.level{background:var(--n);color:#fff;padding:14px 18px;border-radius:16px;margin-top:28px;font-weight:900}.opt{display:grid;grid-template-columns:24px 28px 1fr;gap:8px;padding:12px;border:2px solid #dbe4ef;border-radius:14px;margin:8px 0}.btn{padding:13px 22px;border-radius:14px;border:2px solid var(--n);font-weight:900;background:#fff;color:var(--n)}.primary{background:var(--o);border-color:var(--o);color:#fff}.result{display:none;background:#fff;border-radius:20px;box-shadow:var(--sh);padding:22px;margin-top:20px}.result.show{display:block}.score{font-size:3rem;font-weight:900;text-align:center;background:linear-gradient(135deg,var(--o),var(--y));color:#fff;padding:18px;border-radius:18px}.review{padding:12px;margin:8px 0;border-radius:12px}.ok{background:#e7f3e8}.bad{background:#fae8e4}footer{margin-top:45px;background:var(--n);color:#fff;text-align:center;padding:26px;display:grid;gap:5px}#lb{display:none;position:fixed;inset:0;z-index:100;background:#000d;align-items:center;justify-content:center;padding:25px}#lb.show{display:flex}#lb img{max-width:94vw;max-height:88vh}#lb button{position:absolute;top:20px;right:20px;font-size:1.5rem;border:0;border-radius:50%;width:45px;height:45px}@media(max-width:980px){#mb{display:block}header nav{display:none;position:absolute;left:12px;right:12px;top:75px;flex-direction:column;background:var(--n);padding:12px;border-radius:16px}header nav.open{display:flex}header nav a{background:#fff;color:var(--n)}.grid{grid-template-columns:repeat(2,1fr)}.g2,.event,.event:nth-child(even){grid-template-columns:1fr}.event:nth-child(even) img{order:0}.gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.container{padding:28px 13px}.grid,.gallery{grid-template-columns:1fr}.hero img{height:auto}.hm{margin:0 10px 24px}.hm a{min-width:130px;font-size:.9rem}.brand{font-size:1.5rem}}

h1,h2,h3,.brand,.top-nav,.hero-link,.section-title,.level-heading,.btn,.tag,
th,.score-display,.qcard b,.event h3,.gallery figcaption{
  font-family:'Itim','Mali',Tahoma,sans-serif;
  letter-spacing:.01em;
}
body,p,td,.option,.card{
  font-family:'Mali','Itim',Tahoma,sans-serif;
}

/* User cover — keep the original artwork intact on desktop and mobile */
.hero-user{
  width:100%;
  background:#344b75;
  overflow:hidden;
}
.hero-user picture,
.hero-user img{
  display:block;
  width:100%;
}
.hero-user img{
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center;
}

/* Make the cover visually balanced on wide desktop screens */
@media (min-width:1100px){
  .hero-user{
    display:flex;
    justify-content:center;
    align-items:center;
  }
  .hero-user picture{
    width:min(100%,1920px);
  }
}

/* Mobile: no crop, no stretch, and menu starts right after the cover */
@media (max-width:680px){
  .hero-user{
    min-height:0;
    padding:0;
  }
  .hero-user img{
    width:100%;
    height:auto !important;
    object-fit:contain !important;
  }
  .hm{
    margin-top:0 !important;
    border-radius:0 0 18px 18px;
  }
}
