:root {
  --bg: #060812;
  --bg-soft: #0b0f20;
  --panel: rgba(17, 23, 43, .72);
  --line: rgba(147, 164, 213, .18);
  --text: #f5f7ff;
  --muted: #9ba8c8;
  --cyan: #4cf3ff;
  --violet: #9d6cff;
  --lime: #c7ff5b;
  --pink: #ff5fd2;
  --display: "Chakra Petch", sans-serif;
  --body: "Inter", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--body); color: var(--text); background: var(--bg); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -3;
  background:
    radial-gradient(circle at 78% 16%, rgba(157,108,255,.16), transparent 28%),
    radial-gradient(circle at 13% 35%, rgba(76,243,255,.10), transparent 26%),
    linear-gradient(180deg, #070916 0%, #050710 100%);
}
.noise { position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); }
.progress-line { position: fixed; top: 0; left: 0; width: 0; height: 3px; background: linear-gradient(90deg,var(--cyan),var(--violet),var(--pink)); z-index: 200; box-shadow: 0 0 14px var(--cyan); }

.site-header { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; height: 82px; padding: 0 clamp(24px,5vw,76px); display: flex; align-items: center; justify-content: space-between; background: linear-gradient(180deg,rgba(6,8,18,.94),rgba(6,8,18,.58),transparent); backdrop-filter: blur(10px); }
.brand { display: inline-flex; align-items: center; gap: 11px; font: 700 15px/1 var(--display); letter-spacing: .12em; }
.brand-dot { color: var(--cyan); }
.brand-mark { width: 27px; height: 27px; display: grid; place-items: center; border: 2px solid var(--cyan); transform: rotate(45deg); box-shadow: 0 0 15px rgba(76,243,255,.35); }
.brand-mark span { width: 9px; height: 9px; background: var(--violet); }
.nav { display: flex; gap: 36px; font: 600 11px/1 var(--display); color: var(--muted); letter-spacing: .14em; }
.nav a { transition: .25s ease; }
.nav a:hover { color: var(--cyan); }
.nav-cta { min-height: 39px; display: flex; align-items: center; gap: 14px; padding: 0 16px; border: 1px solid var(--line); font: 700 11px/1 var(--display); letter-spacing: .12em; background: rgba(255,255,255,.025); }
.nav-cta span { color: var(--cyan); }

.hero { min-height: 100vh; position: relative; padding: 135px clamp(24px,7vw,108px) 80px; display: grid; grid-template-columns: minmax(0,1.08fr) minmax(360px,.72fr); gap: clamp(48px,7vw,110px); align-items: center; overflow: hidden; }
.hero-grid { position: absolute; inset: 0; z-index: -2; opacity: .35; background-image: linear-gradient(rgba(98,119,178,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(98,119,178,.12) 1px,transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom,black 45%,transparent 92%); transform: perspective(550px) rotateX(63deg) translateY(46%); transform-origin: bottom; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { display: flex; align-items: center; gap: 11px; margin-bottom: 25px; color: var(--cyan); font: 600 11px/1 var(--display); letter-spacing: .18em; }
.pulse { width: 8px; height: 8px; background: var(--lime); box-shadow: 0 0 0 0 rgba(199,255,91,.7); animation: pulse 1.8s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(199,255,91,0); } 100% { box-shadow: 0 0 0 0 rgba(199,255,91,0); } }
h1 { margin: 0; font-family: var(--display); font-size: clamp(49px,7vw,105px); line-height: .83; letter-spacing: -.05em; }
h1 span { display: block; }
h1 .outline { color: transparent; -webkit-text-stroke: 1.5px rgba(230,237,255,.82); text-shadow: 0 0 40px rgba(157,108,255,.12); }
h1 .solid { margin-top: 10px; background: linear-gradient(93deg,#fff 10%,#cfe8ff 45%,#8f74ff 88%); -webkit-background-clip: text; color: transparent; }
.hero-lead { max-width: 650px; margin: 30px 0 0; color: var(--muted); font-size: clamp(15px,1.35vw,19px); line-height: 1.7; }
.hero-actions { display: flex; gap: 15px; margin-top: 38px; flex-wrap: wrap; }
.btn { min-height: 52px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 38px; font: 700 11px/1 var(--display); letter-spacing: .13em; transition: transform .25s,box-shadow .25s,border-color .25s; }
.btn:hover { transform: translateY(-3px); }
.btn-primary { color: #070913; background: linear-gradient(105deg,var(--cyan),#91dfff); box-shadow: 8px 8px 0 rgba(157,108,255,.35); }
.btn-primary:hover { box-shadow: 12px 12px 0 rgba(157,108,255,.48); }
.btn-ghost { border: 1px solid var(--line); color: #d9e0f5; background: rgba(255,255,255,.025); }
.btn-ghost:hover { border-color: var(--violet); }
.quick-stats { display: flex; align-items: stretch; gap: 0; margin-top: 55px; border-top: 1px solid var(--line); width: min(660px,100%); }
.quick-stats div { padding: 21px 32px 0 0; margin-right: 32px; border-right: 1px solid var(--line); min-width: 120px; }
.quick-stats div:last-child { border-right: 0; }
.quick-stats strong { display: block; font: 700 25px/1 var(--display); color: #fff; }
.quick-stats span { display: block; margin-top: 7px; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .11em; }

.hero-visual { position: relative; max-width: 510px; justify-self: end; width: 100%; }
.visual-label { position: absolute; z-index: 3; top: -34px; left: 15px; font: 600 10px/1 var(--display); letter-spacing: .16em; color: var(--cyan); }
.portrait-frame { position: relative; aspect-ratio: .84; background: #12172b; clip-path: polygon(0 0,92% 0,100% 8%,100% 100%,8% 100%,0 92%); isolation: isolate; box-shadow: 0 40px 90px rgba(0,0,0,.48); }
.portrait-frame::before { content:""; position:absolute; inset:0; z-index: 4; border: 1px solid rgba(76,243,255,.45); clip-path: inherit; pointer-events:none; }
.portrait-frame img { width:100%; height:100%; object-fit:cover; object-position: 52% 50%; filter: contrast(1.05) saturate(.92); }
.portrait-gradient { position:absolute; inset:0; z-index:1; background: linear-gradient(180deg,transparent 45%,rgba(7,9,21,.15) 65%,rgba(6,8,18,.92) 100%),linear-gradient(90deg,rgba(76,243,255,.11),transparent 35%,rgba(157,108,255,.12)); }
.scanline { position:absolute; z-index:2; left:0; right:0; height:1px; top:10%; background:rgba(76,243,255,.75); box-shadow:0 0 12px var(--cyan); animation: scan 6s linear infinite; opacity:.6; }
@keyframes scan { to { top: 90%; } }
.corner { position:absolute; z-index:5; width:24px; height:24px; border-color:var(--cyan); border-style:solid; }
.c1{left:10px;top:10px;border-width:2px 0 0 2px}.c2{right:10px;top:10px;border-width:2px 2px 0 0}.c3{left:10px;bottom:10px;border-width:0 0 2px 2px}.c4{right:10px;bottom:10px;border-width:0 2px 2px 0}
.achievement-chip { position:absolute; z-index:6; padding:11px 13px; min-width:130px; background:rgba(7,10,24,.88); backdrop-filter:blur(10px); border-left:3px solid var(--cyan); box-shadow:0 12px 30px rgba(0,0,0,.32); }
.achievement-chip small { display:block; color:var(--muted); font:600 8px/1 var(--display); letter-spacing:.13em; }
.achievement-chip strong { display:block; margin-top:5px; font:700 13px/1 var(--display); }
.chip-a { right:-28px; top:20%; }.chip-b { left:-35px; bottom:15%; border-color:var(--violet); }
.level-card { position:relative; z-index:7; width:86%; margin:-32px auto 0; padding:18px 22px; background:rgba(11,15,32,.95); border:1px solid var(--line); box-shadow:0 20px 40px rgba(0,0,0,.32); }
.level-title,.level-meta { display:flex; align-items:center; justify-content:space-between; font:600 9px/1 var(--display); letter-spacing:.13em; color:var(--muted); }
.level-title b { font-size:17px;color:var(--cyan); }.level-bar { height:5px; background:#202741; margin:12px 0; overflow:hidden; }.level-bar span { display:block;width:84%;height:100%;background:linear-gradient(90deg,var(--cyan),var(--violet));box-shadow:0 0 8px var(--cyan); }
.orbit { position:absolute; border:1px solid rgba(157,108,255,.22); border-radius:50%; z-index:-1; }.orbit-a{width:520px;height:520px;right:-160px;top:10%;}.orbit-b{width:300px;height:300px;right:12%;top:24%;border-color:rgba(76,243,255,.16);}
.floating-shape { position:absolute; z-index:-1; transform:rotate(45deg); }.shape-1{width:24px;height:24px;border:2px solid var(--violet);left:48%;top:22%;animation:float 5s ease-in-out infinite;}.shape-2{width:13px;height:13px;background:var(--cyan);left:5%;top:34%;animation:float 4s ease-in-out infinite reverse;}.shape-3{width:32px;height:32px;border:1px solid var(--lime);right:7%;bottom:18%;animation:float 6s ease-in-out infinite;}
@keyframes float { 50% { transform:translateY(-18px) rotate(135deg); } }
.scroll-cue { position:absolute; left:clamp(24px,3vw,48px); bottom:33px; display:flex;align-items:center;gap:13px;transform:rotate(-90deg) translateX(100%);transform-origin:left bottom;color:#64708f;font:600 8px/1 var(--display);letter-spacing:.18em; }.scroll-cue i{display:block;width:45px;height:1px;background:#64708f;position:relative}.scroll-cue i::after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;background:var(--cyan);}

.section { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:125px 0; }
.section-heading { display:flex; align-items:flex-start; gap:21px; margin-bottom:52px; }
.section-no { width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);font:700 11px/1 var(--display);color:var(--cyan); }
.section-heading p { margin:2px 0 8px;color:var(--violet);font:600 10px/1 var(--display);letter-spacing:.17em; }
.section-heading h2 { margin:0;font:700 clamp(34px,5vw,67px)/.98 var(--display);letter-spacing:-.04em; }
.panel { background:linear-gradient(145deg,rgba(18,24,47,.82),rgba(10,14,29,.72));border:1px solid var(--line);position:relative;overflow:hidden; }
.panel::before { content:"";position:absolute;top:0;left:0;width:90px;height:2px;background:linear-gradient(90deg,var(--cyan),transparent); }
.profile-layout { display:grid;grid-template-columns:1.05fr .95fr;gap:22px; }
.profile-card,.mission-card { padding:34px;min-height:350px; }
.panel-kicker { color:var(--cyan);font:600 9px/1 var(--display);letter-spacing:.15em;margin-bottom:25px; }
dl { margin:0;display:grid;grid-template-columns:1fr 1fr;gap:25px 35px; }
dl div { border-bottom:1px solid var(--line);padding-bottom:15px; }
dt { color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.11em;margin-bottom:7px; } dd { margin:0;font:600 15px/1.4 var(--display); }.placeholder{color:#697590;font-weight:500;font-style:italic;}
.mission-card h3 { max-width:430px;margin:0 0 18px;font:700 clamp(31px,4vw,54px)/.98 var(--display);letter-spacing:-.04em; }.mission-card p{max-width:520px;color:var(--muted);line-height:1.75;margin:0;}.skill-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:27px}.skill-list span{border:1px solid var(--line);padding:9px 11px;color:#cbd4ed;font:600 9px/1 var(--display);letter-spacing:.1em}.mini-geometry{position:absolute;right:28px;bottom:23px;display:flex;align-items:flex-end;gap:5px;opacity:.55}.mini-geometry i{display:block;width:11px;background:var(--violet)}.mini-geometry i:nth-child(1){height:18px}.mini-geometry i:nth-child(2){height:31px;background:var(--cyan)}.mini-geometry i:nth-child(3){height:23px}.mini-geometry i:nth-child(4){height:42px;background:var(--lime)}

.achievements { width:min(1340px,calc(100% - 48px)); }
.achievement-summary { display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:35px; }.summary-card{padding:23px;border:1px solid var(--line);background:rgba(15,20,39,.65);display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:15px;align-items:center}.summary-icon{grid-row:1/3;width:42px;height:42px;display:grid;place-items:center;background:rgba(76,243,255,.08);color:var(--cyan);font-size:19px}.summary-card strong{font:700 24px/1 var(--display)}.summary-card small{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}
.filters { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:25px; }.filter{border:1px solid var(--line);background:transparent;color:var(--muted);padding:11px 14px;cursor:pointer;font:600 9px/1 var(--display);letter-spacing:.12em;transition:.2s}.filter span{margin-left:7px;color:#65708d}.filter:hover,.filter.active{background:var(--cyan);color:#07101a;border-color:var(--cyan)}.filter.active span{color:#29384a}
.achievement-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:13px; }.achievement-card{min-height:250px;padding:25px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line);background:linear-gradient(145deg,rgba(16,21,42,.86),rgba(9,12,26,.76));position:relative;overflow:hidden;transition:.3s}.achievement-card::after{content:"";position:absolute;width:90px;height:90px;border:1px solid rgba(157,108,255,.15);right:-35px;bottom:-35px;transform:rotate(45deg)}.achievement-card:hover{transform:translateY(-5px);border-color:rgba(76,243,255,.55);box-shadow:0 18px 45px rgba(0,0,0,.26)}.card-top{display:flex;justify-content:space-between;gap:15px}.award-type{font:600 8px/1 var(--display);letter-spacing:.12em;color:var(--cyan)}.award-year{font:700 12px/1 var(--display);color:#5e6b8a}.achievement-card h3{margin:30px 0 13px;font:700 19px/1.23 var(--display);letter-spacing:-.02em}.achievement-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}.card-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:27px;padding-top:16px;border-top:1px solid var(--line)}.category-pill{font:600 8px/1 var(--display);letter-spacing:.12em;color:#cbd4ed}.medal-symbol{font-size:18px;color:var(--violet)}.achievement-card.featured{grid-column:span 2;background:radial-gradient(circle at 85% 20%,rgba(157,108,255,.19),transparent 32%),linear-gradient(145deg,rgba(19,25,50,.95),rgba(9,13,28,.85))}.achievement-card.featured h3{font-size:clamp(23px,2.5vw,34px);max-width:580px}.achievement-card.hide{display:none}

.timeline { border-left:1px solid var(--line);margin-left:14px; }.year-row{display:grid;grid-template-columns:95px 1fr;position:relative;padding:0 0 44px 34px}.year-row::before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;background:var(--bg);border:2px solid var(--cyan);box-shadow:0 0 12px rgba(76,243,255,.45)}.year-row time{font:700 22px/1 var(--display);color:var(--cyan)}.year-row p{margin:0;color:var(--muted);line-height:1.7}.year-row strong{color:#fff;font-weight:600}.next-level{margin-top:45px;padding:35px;display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:center}.next-level span{font:600 9px/1 var(--display);letter-spacing:.14em;color:var(--lime)}.next-level h3{font:700 30px/1.1 var(--display);margin:8px 0 0}.next-level p{color:var(--muted);line-height:1.65;margin:0}.next-arrow{font:400 44px/1 var(--display);color:var(--cyan)}
footer { border-top:1px solid var(--line);padding:35px clamp(24px,5vw,76px);display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px;gap:20px; }footer p{margin:0}

@media (max-width: 980px){
  .nav{display:none}.hero{grid-template-columns:1fr;padding-top:130px}.hero-visual{justify-self:center;max-width:520px;margin-top:25px}.hero-copy{text-align:center}.eyebrow,.hero-actions{justify-content:center}.hero-lead,.quick-stats{margin-left:auto;margin-right:auto}.scroll-cue{display:none}.profile-layout{grid-template-columns:1fr}.achievement-grid{grid-template-columns:repeat(2,1fr)}.achievement-summary{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 650px){
  .site-header{height:70px;padding:0 18px}.nav-cta{display:none}.hero{padding:112px 20px 70px}.hero-actions{flex-direction:column}.btn{width:100%}.quick-stats{display:grid;grid-template-columns:repeat(3,1fr)}.quick-stats div{padding:18px 8px 0;margin:0;border-right:1px solid var(--line);min-width:0}.quick-stats strong{font-size:19px}.quick-stats span{font-size:8px}.chip-a{right:-8px}.chip-b{left:-8px}.section,.achievements{width:calc(100% - 34px);padding:85px 0}.section-heading{margin-bottom:35px}.profile-card,.mission-card{padding:24px}dl{grid-template-columns:1fr}.achievement-grid{grid-template-columns:1fr}.achievement-card.featured{grid-column:span 1}.achievement-summary{grid-template-columns:1fr 1fr}.summary-card{padding:16px}.year-row{grid-template-columns:65px 1fr;padding-left:25px}.next-level{grid-template-columns:1fr}.next-arrow{display:none}footer{flex-direction:column;text-align:center}.portrait-frame{aspect-ratio:.88}
}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* v2 — showcase typography and boot experience */
body.is-loading { overflow: hidden; }
.boot-screen {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  padding: 28px; background:
    linear-gradient(rgba(76,243,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76,243,255,.035) 1px, transparent 1px),
    radial-gradient(circle at 50% 42%, rgba(157,108,255,.2), transparent 34%), #050710;
  background-size: 42px 42px, 42px 42px, auto;
  transition: opacity .65s ease, visibility .65s ease;
}
.boot-screen::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(transparent 48%,rgba(76,243,255,.05) 50%,transparent 52%); background-size:100% 8px; }
.boot-screen.done { opacity:0; visibility:hidden; }
.boot-shell { width:min(720px,100%); position:relative; z-index:1; border:1px solid rgba(76,243,255,.24); background:rgba(6,8,18,.82); padding:clamp(28px,5vw,54px); box-shadow:0 0 70px rgba(76,243,255,.08), inset 0 0 40px rgba(157,108,255,.04); backdrop-filter:blur(18px); }
.boot-symbol { width:58px; height:58px; border:2px solid var(--cyan); transform:rotate(45deg); display:grid; place-items:center; box-shadow:0 0 25px rgba(76,243,255,.35); margin-bottom:34px; animation:bootSpin 2.3s linear infinite; }
.boot-symbol span { width:18px; height:18px; background:var(--violet); box-shadow:0 0 18px var(--violet); }
.boot-label { margin:0 0 12px; font:600 13px/1 var(--display); letter-spacing:.18em; color:var(--cyan); }
.boot-shell h2 { margin:0 0 38px; font:700 clamp(38px,7vw,72px)/.92 var(--display); letter-spacing:-.045em; }
.boot-task { display:flex; justify-content:space-between; gap:24px; margin:18px 0 9px; color:#d9e3ff; font:600 clamp(14px,2vw,18px)/1.3 var(--display); }
.boot-task b { color:var(--lime); }
.boot-bar { height:8px; border:1px solid rgba(147,164,213,.28); background:rgba(255,255,255,.025); overflow:hidden; }
.boot-bar i { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--cyan),var(--violet)); box-shadow:0 0 16px var(--cyan); transition:width .12s linear; }
.boot-welcome { opacity:0; margin:30px 0 0; font:700 17px/1 var(--display); letter-spacing:.16em; color:var(--lime); transition:opacity .3s ease; }
.boot-welcome.show { opacity:1; }
@keyframes bootSpin { to { transform:rotate(405deg); } }

.site-header { height:96px; }
.brand { font-size:18px; }
.brand-mark { width:32px; height:32px; }
.nav { gap:clamp(28px,4vw,58px); }
.nav a { font-size:17px; letter-spacing:.11em; }
.nav-cta { font-size:16px; padding:14px 20px; }

.hero { min-height:100svh; padding-top:clamp(130px,14vh,180px); padding-bottom:100px; }
.eyebrow { font-size:15px; letter-spacing:.14em; margin-bottom:26px; }
.hero h1 { font-size:clamp(68px,8.2vw,132px); line-height:.83; letter-spacing:-.065em; }
.hero-lead { max-width:760px; font-size:clamp(21px,2vw,30px); line-height:1.5; margin-top:30px; }
.hero-actions { margin-top:40px; }
.btn { min-height:58px; padding:0 27px; font-size:15px; }
.quick-stats { margin-top:52px; max-width:770px; }
.quick-stats div { min-width:170px; padding-right:30px; }
.quick-stats strong { font-size:clamp(38px,4vw,58px); }
.quick-stats span { font-size:13px; margin-top:7px; }
.visual-label { font-size:12px; }
.achievement-chip small { font-size:10px; }
.achievement-chip strong { font-size:15px; }
.level-title span,.level-meta { font-size:11px; }
.level-title b { font-size:30px; }

.section { width:min(1240px,calc(100% - 64px)); padding:130px 0; }
.section-heading { margin-bottom:62px; }
.section-no { font-size:22px; }
.section-heading p { font-size:14px; }
.section-heading h2 { font-size:clamp(48px,6vw,82px); }
.panel-kicker { font-size:12px; }
.profile-card,.mission-card { padding:clamp(32px,4vw,52px); }
dt { font-size:13px; }
dd { font-size:clamp(18px,1.8vw,24px); }
.mission-card h3 { font-size:clamp(34px,4vw,54px); }
.mission-card p { font-size:20px; line-height:1.7; }
.skill-list span { font-size:12px; padding:11px 14px; }

.achievement-summary { gap:18px; }
.summary-card { padding:28px 24px; }
.summary-card strong { font-size:clamp(42px,5vw,64px); }
.summary-card small { font-size:15px; }
.summary-icon { font-size:24px; }
.filters { gap:12px; margin:42px 0 32px; }
.filter { font-size:14px; padding:13px 18px; }
.achievement-grid { gap:22px; }
.achievement-card { min-height:310px; padding:32px; }
.card-top { margin-bottom:30px; }
.award-type,.award-year { font-size:12px; }
.achievement-card h3 { font-size:clamp(27px,2.2vw,34px); line-height:1.14; }
.achievement-card p { font-size:17px; line-height:1.65; }
.category-pill { font-size:11px; }
.medal-symbol { font-size:26px; }
.achievement-card.featured h3 { font-size:clamp(36px,3.4vw,54px); }

.timeline { margin-left:20px; }
.year-row { grid-template-columns:140px 1fr; padding:0 0 62px 42px; }
.year-row time { font-size:clamp(42px,5vw,66px); }
.year-row p { font-size:20px; line-height:1.75; max-width:900px; }
.next-level { padding:48px; }
.next-level span { font-size:12px; }
.next-level h3 { font-size:clamp(34px,4vw,52px); }
.next-level p { font-size:18px; }
footer { font-size:14px; padding-top:44px; padding-bottom:44px; }

@media (max-width:980px) {
  .hero h1 { font-size:clamp(64px,12vw,104px); }
  .hero-lead { font-size:24px; }
  .achievement-card { min-height:280px; }
}
@media (max-width:650px) {
  .site-header { height:76px; }
  .brand { font-size:15px; }
  .hero { padding-top:118px; }
  .hero h1 { font-size:clamp(49px,15vw,78px); }
  .eyebrow { font-size:11px; }
  .hero-lead { font-size:19px; }
  .quick-stats strong { font-size:29px; }
  .quick-stats span { font-size:9px; }
  .section { width:calc(100% - 36px); padding:92px 0; }
  .section-heading h2 { font-size:42px; }
  .mission-card p { font-size:17px; }
  .achievement-card { padding:26px; min-height:270px; }
  .achievement-card h3,.achievement-card.featured h3 { font-size:29px; }
  .achievement-card p { font-size:16px; }
  .year-row { grid-template-columns:1fr; gap:14px; padding-left:28px; }
  .year-row time { font-size:44px; }
  .year-row p { font-size:17px; }
  .boot-shell { padding:28px 22px; }
  .boot-shell h2 { font-size:40px; }
}

/* Dynamic PHP/MySQL edition */
.achievement-card{color:inherit;text-decoration:none;cursor:pointer}
.achievement-card:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
.detail-page{padding-top:120px}.detail-hero,.gallery-section{width:min(1220px,calc(100% - 48px));margin:0 auto;padding:70px 0}.detail-title{font:700 clamp(48px,7vw,104px)/.92 var(--display);letter-spacing:-.05em;margin:20px 0}.detail-meta{display:flex;flex-wrap:wrap;gap:12px}.detail-meta span{border:1px solid var(--line);padding:10px 13px;color:var(--muted);font:600 12px/1 var(--display);letter-spacing:.08em}.detail-description{font-size:20px;line-height:1.7;color:var(--muted);max-width:900px}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.gallery-item{margin:0;border:1px solid var(--line);background:var(--panel);overflow:hidden}.gallery-item img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;background:#080b16}.gallery-item figcaption{display:flex;justify-content:space-between;gap:20px;padding:17px 20px}.gallery-item figcaption span{color:var(--cyan);font:600 11px/1 var(--display);letter-spacing:.1em}.empty-gallery{padding:44px}.empty-gallery h3{font:700 34px/1.1 var(--display);margin:0 0 12px}.empty-gallery p{color:var(--muted)}
.timeline{margin-left:20px}.year-row{grid-template-columns:minmax(180px,220px) minmax(0,1fr);column-gap:clamp(34px,4vw,64px);align-items:start;padding:0 0 62px 42px}.year-row time{display:block;white-space:nowrap;line-height:1}.year-row p{min-width:0;margin-top:2px}
@media(max-width:650px){.gallery-grid{grid-template-columns:1fr}.detail-hero,.gallery-section{width:calc(100% - 34px)}.year-row{grid-template-columns:1fr;gap:14px;padding-left:28px}.year-row p{margin-top:0}}
.gallery-filters{margin-top:32px}.gallery-item figcaption a{display:inline-block;margin-top:9px;color:var(--cyan);font:600 10px/1.2 var(--display);letter-spacing:.08em}
