.topic-page{background:var(--bg);color:var(--text);min-height:100vh}
.topic-main{padding-top:68px}
.topic-hero{position:relative;min-height:68svh;display:grid;place-items:center;padding:7rem 32px 5rem;text-align:center;overflow:hidden;border-bottom:1px solid var(--line)}
.topic-hero::before{content:"";position:absolute;inset:12% 18%;pointer-events:none;background:radial-gradient(circle,rgba(142,131,168,.09),transparent 68%);filter:blur(26px)}
.topic-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:96px 96px;mask-image:radial-gradient(circle at 50% 50%,#000,transparent 72%)}
.topic-hero-inner{position:relative;z-index:1;width:min(920px,100%);margin:0 auto}
.eyebrow{margin:0;font:500 .64rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.16em;color:#747980}
.topic-hero h1{margin:.9rem auto 1.15rem;font-size:clamp(4rem,9.5vw,8.2rem);line-height:.84;letter-spacing:-.07em;font-weight:700;text-wrap:balance;max-width:12ch}
.topic-hero h1 em{font-family:"Instrument Serif",serif;font-weight:400;color:#948aa9}
.topic-hero p{max-width:650px;margin:0 auto;color:#969ba3;font-size:1.02rem;line-height:1.65}
.topic-actions{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;margin-top:1.7rem}
.topic-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 1rem;border-radius:999px;border:1px solid var(--line-strong);font-weight:650;transition:transform .25s var(--ease),border-color .25s ease,background .25s ease}
.topic-actions a.primary{background:var(--text);color:#101216;border-color:var(--text)}.topic-actions a:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.25)}
.topic-section{padding:7.5rem 0;border-top:1px solid var(--line)}
.topic-shell{width:min(1080px,calc(100vw - 48px));margin:0 auto}
.topic-center{text-align:center;max-width:820px;margin:0 auto 3.4rem}
.topic-center h2{margin:.8rem 0 0;font-size:clamp(2.9rem,6vw,5.4rem);line-height:.9;letter-spacing:-.06em}
.topic-center p{max-width:620px;margin:1rem auto 0;color:#8f949c;line-height:1.65}
.metric-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric{padding:1.8rem 1.2rem;border-right:1px solid var(--line)}.metric:last-child{border-right:0}.metric strong{display:block;font-size:clamp(2.8rem,6vw,5.4rem);letter-spacing:-.065em;line-height:.9}.metric span{display:block;margin-top:.6rem;color:#7d828a;font-size:.82rem;line-height:1.5}
.story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.story-card{padding:1.7rem 1.2rem 1.7rem 0;border-bottom:1px solid var(--line);background:transparent}.story-card:nth-child(odd){border-right:1px solid var(--line);padding-right:2rem}.story-card:nth-child(even){padding-left:2rem}.story-card .mini{font:500 .61rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.12em;color:#686d74}.story-card h3{margin:.6rem 0 .6rem;font-size:1.45rem;letter-spacing:-.03em}.story-card p{margin:0;color:#898e96;line-height:1.6}.story-card a{display:inline-flex;margin-top:1rem;border-bottom:1px solid #5b6067;font-weight:650}
.pr-list{display:grid;gap:0;border-top:1px solid var(--line)}.pr-item{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1.1rem 0;border-bottom:1px solid var(--line);transition:padding .28s var(--ease),color .2s ease}.pr-item:hover{padding-left:.4rem}.pr-item .repo{font:500 .62rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:#6d7279}.pr-item strong{font-size:.98rem;font-weight:620}.pr-item a{color:#aaa4b7;font-size:.86rem}
.feature-visual{margin:2.6rem auto 0;max-width:900px;position:relative;perspective:1300px;transform-style:preserve-3d}.feature-visual img{width:100%;object-fit:contain;filter:drop-shadow(0 28px 28px rgba(0,0,0,.42)) saturate(.8) brightness(.88)}
.robot-inspector{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:1rem;align-items:stretch;max-width:1050px}
.robot-inspector-plane{position:relative;min-height:520px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#0e1114,#0a0d10);display:grid;place-items:center;overflow:hidden;transform-style:preserve-3d;will-change:transform;transition:transform .28s var(--ease),border-color .25s ease}
.robot-inspector-plane::before{content:"";position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle,rgba(145,134,171,.085),transparent 68%);filter:blur(18px)}
.robot-inspector-plane::after{content:"";position:absolute;left:8%;right:8%;bottom:6%;height:24%;border-radius:50%;border:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.015);transform:rotateX(70deg) translateZ(-24px);box-shadow:0 26px 50px rgba(0,0,0,.22)}
.robot-inspector-plane>img{position:relative;z-index:2;width:min(92%,720px);filter:drop-shadow(0 30px 28px rgba(0,0,0,.42)) saturate(.82) brightness(.88);transform:translateZ(34px);pointer-events:none}
.inspector-hotspot{--hx:50%;--hy:50%;position:absolute;left:var(--hx);top:var(--hy);z-index:5;width:28px;height:28px;border-radius:50%;border:1px solid rgba(241,238,232,.55);background:rgba(10,12,15,.68);backdrop-filter:blur(8px);transform:translate(-50%,-50%) translateZ(72px);box-shadow:0 12px 30px rgba(0,0,0,.24);transition:transform .35s var(--ease),background .2s ease,border-color .2s ease}
.inspector-hotspot span::before,.inspector-hotspot span::after{content:"";position:absolute;left:50%;top:50%;background:#e3dfd8;transform:translate(-50%,-50%)}.inspector-hotspot span::before{width:8px;height:1px}.inspector-hotspot span::after{width:1px;height:8px}
.inspector-hotspot:hover,.inspector-hotspot:focus-visible,.inspector-hotspot.is-active{transform:translate(-50%,-50%) translateZ(92px) scale(1.12);background:#ece8e1;border-color:#ece8e1}.inspector-hotspot:hover span::before,.inspector-hotspot:hover span::after,.inspector-hotspot:focus-visible span::before,.inspector-hotspot:focus-visible span::after,.inspector-hotspot.is-active span::before,.inspector-hotspot.is-active span::after{background:#101216}.inspector-hotspot:focus-visible{outline:2px solid #9287a9;outline-offset:4px}
.robot-inspector-copy{border:1px solid var(--line);border-radius:24px;background:#0c0f12;padding:1.2rem;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;transform:translateZ(16px)}
.robot-inspector-copy>span{font:500 .58rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.12em;color:#696e75}.robot-inspector-copy h3{margin:.6rem 0 .7rem;font-size:1.55rem;letter-spacing:-.035em}.robot-inspector-copy p{margin:0;color:#898e96;line-height:1.6;font-size:.9rem}


/* Equal Horizons topic page */
.eh-page{background:#11161a;color:#eef0ec}.eh-page .topic-hero::before{background:radial-gradient(circle,rgba(119,101,189,.11),transparent 68%)}.eh-page .topic-hero h1 em{color:#d7c987}
.eh-band{background:linear-gradient(135deg,#c4deec,#e9ebdf 58%,#e8dfc5);color:#162029;border-radius:24px;padding:2.2rem;display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 55px rgba(0,0,0,.16);transform-style:preserve-3d;will-change:transform;transition:transform .3s var(--ease),box-shadow .3s ease}.eh-band>*{transform:translateZ(16px)}
.eh-band h2{margin:0;font-size:clamp(2.8rem,6vw,5.2rem);line-height:.9;letter-spacing:-.06em}.eh-band p{color:#43505a;line-height:1.6}.eh-process{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin-top:1.2rem}.eh-process div{background:rgba(255,255,255,.32);border:1px solid rgba(41,76,98,.11);padding:1rem;border-radius:14px}.eh-process strong{display:block}.eh-process span{display:block;color:#5f6a73;font-size:.82rem;margin-top:.35rem}

/* Project / certificates / about */
.project-page-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;perspective:1400px}.project-page-card{padding-bottom:1.4rem;border-bottom:1px solid var(--line);transform-style:preserve-3d;will-change:transform;transition:transform .32s var(--ease)}.project-page-card img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px;background:#111418;border:1px solid var(--line);filter:saturate(.88) brightness(.92);transition:transform .35s var(--ease),filter .25s ease}.project-page-card:hover img{transform:translateY(-3px);filter:none}.project-page-card h3{margin:1rem 0 .4rem;font-size:1.5rem}.project-page-card p{margin:0;color:#898e96}.project-page-card a{display:inline-flex;margin-top:.9rem;border-bottom:1px solid #5b6067;font-weight:650}
.certificate-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;perspective:1400px}.certificate-card{padding-bottom:1.2rem;border-bottom:1px solid var(--line);transform-style:preserve-3d;will-change:transform;transition:transform .32s var(--ease)}.certificate-card img{width:100%;aspect-ratio:4/3;object-fit:contain;border-radius:14px;background:#0f1215;border:1px solid var(--line);filter:saturate(.75) brightness(.9);transition:filter .3s ease,transform .35s var(--ease)}.certificate-card:hover img{filter:none;transform:translateY(-3px)}.certificate-card h3{margin:.9rem 0 .3rem}.certificate-card p{margin:0;color:#898e96}
.about-grid{display:grid;grid-template-columns:minmax(240px,.7fr) 1.3fr;gap:clamp(2rem,6vw,5rem);align-items:center;perspective:1200px}.about-portrait{border-radius:50%;overflow:hidden;border:1px solid var(--line);background:#17191e;max-width:360px;transform-style:preserve-3d;will-change:transform;transition:transform .3s var(--ease)}.about-portrait img{width:100%;aspect-ratio:1;object-fit:cover;filter:saturate(.85) brightness(.9)}.about-copy h2{margin:.75rem 0 0;font-size:clamp(3rem,6vw,5.8rem);line-height:.9;letter-spacing:-.06em}.about-copy p{color:#969ba3;font-size:1.03rem;line-height:1.65}
.topic-footer{padding:1.6rem 24px 2rem;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:1rem;color:#61666d;font-size:.78rem}

/* page entrance */
.topic-hero-inner>*{animation:topicIn .72s var(--ease) both}.topic-hero-inner>.eyebrow{animation-delay:.05s}.topic-hero-inner>h1{animation-delay:.12s}.topic-hero-inner>p{animation-delay:.19s}.topic-hero-inner>.topic-actions{animation-delay:.26s}.feature-visual{animation:topicIn .9s var(--ease) .3s both}
@keyframes topicIn{from{opacity:0;transform:perspective(1100px) translateY(22px) rotateX(2deg) scale(.994)}to{opacity:1;transform:perspective(1100px) translateY(0) rotateX(0) scale(1)}}

@media(max-width:760px){.topic-main{padding-top:62px}.topic-hero{min-height:auto;padding:5.5rem 20px 4rem}.topic-hero h1{font-size:clamp(3.8rem,18vw,6rem)}.topic-section{padding:5.5rem 0}.topic-shell{width:calc(100vw - 32px)}.metric-row,.story-grid,.project-page-grid,.certificate-grid,.about-grid,.eh-band,.robot-inspector{grid-template-columns:1fr}.metric{border-right:0;border-bottom:1px solid var(--line)}.metric:last-child{border-bottom:0}.story-card:nth-child(odd){border-right:0;padding-right:0}.story-card:nth-child(even){padding-left:0}.pr-item{grid-template-columns:1fr;gap:.35rem}.eh-process{grid-template-columns:1fr 1fr}.robot-inspector-plane{min-height:390px}.robot-inspector-copy{min-height:150px}.topic-footer{flex-direction:column}}
@media(max-width:480px){.eh-process{grid-template-columns:1fr}.topic-actions a{width:100%}}

/* V17: dedicated robotics page is now a clean single visual, no side detail card. */
.robot-inspector-clean{display:block;max-width:1050px}
.robot-inspector-clean .robot-inspector-plane{width:100%;min-height:560px}
@media(max-width:760px){.robot-inspector-clean .robot-inspector-plane{min-height:390px}}

/* V18 competition award timeline */
.competition-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.award-timeline{border-top:1px solid var(--line)}
.award-event{display:grid;grid-template-columns:76px minmax(0,1fr) 28px;gap:1.25rem;align-items:center;padding:1.25rem 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .28s var(--ease),background .2s ease}
.award-event:hover{padding-left:.65rem;padding-right:.65rem;background:rgba(255,255,255,.018)}
.award-year{font:500 .62rem/1 "JetBrains Mono",monospace;letter-spacing:.1em;color:#676d75}
.award-event small{display:block;margin-bottom:.35rem;color:#696f77;font:500 .62rem/1.35 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em}
.award-event h3{margin:0;font-size:1.35rem;letter-spacing:-.035em}.award-event p{margin:.35rem 0 0;color:#858b93;font-size:.9rem;line-height:1.5;max-width:56ch}.award-event>b{justify-self:end;color:#8d9299;font-size:1rem;font-weight:500}
.recognition-crosslink{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:center;margin-top:2rem;padding:1.1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-decoration:none}.recognition-crosslink span{color:#6e747c;font:500 .62rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em}.recognition-crosslink strong{font-size:1rem;letter-spacing:-.02em}.recognition-crosslink b{font-size:.9rem}
@media(max-width:760px){.award-event{grid-template-columns:52px minmax(0,1fr) 20px;gap:.75rem}.award-event h3{font-size:1.15rem}.award-event p{font-size:.84rem}.recognition-crosslink{grid-template-columns:1fr;gap:.55rem}}

/* V20 — Pedro Pathing narrative page */
.pedro-topic-hero{min-height:76svh}.pedro-topic-hero .topic-hero-inner{max-width:980px}.pedro-topic-hero h1{max-width:none}.pedro-topic-hero p strong{color:#dfdbe3;font-weight:600}
.metric-row-four{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-row-four .metric:nth-child(4){border-right:0}.metric-row-four .metric strong{font-size:clamp(2.35rem,5vw,4.7rem)}
.pedro-showcase{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:clamp(2rem,5vw,5rem);align-items:center}.pedro-showcase-visual{position:relative;min-height:580px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,#0e1114,#090b0e 65%);overflow:hidden;perspective:1200px;transform-style:preserve-3d;box-shadow:0 35px 75px rgba(0,0,0,.2)}.pedro-showcase-grid{position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,#000,transparent 95%)}.pedro-showcase-path{position:absolute;inset:4%;width:92%;height:92%;transform:translateZ(7px)}.pedro-showcase-path path:last-of-type{animation:topicPedroDash 9s linear infinite}@keyframes topicPedroDash{to{stroke-dashoffset:-112}}.pedro-showcase-robot{position:absolute;z-index:2;width:min(72%,600px);right:-5%;bottom:1%;filter:drop-shadow(0 30px 30px rgba(0,0,0,.5)) saturate(.82) brightness(.86);transform:translateZ(36px) rotate(-2deg)}.pedro-showcase-logo{position:absolute;z-index:3;left:7%;top:7%;width:132px;height:132px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.09);background:rgba(9,11,14,.78);backdrop-filter:blur(14px);transform:translateZ(60px)}.pedro-showcase-logo img{width:82px;filter:grayscale(.12) brightness(.9)}
.pedro-showcase-copy h2{margin:.85rem 0 1rem;font-size:clamp(3rem,6vw,5.5rem);line-height:.88;letter-spacing:-.06em}.pedro-showcase-copy>p{color:#91969e;line-height:1.68}.pedro-ecosystem-links{margin-top:1.7rem;border-top:1px solid var(--line)}.pedro-ecosystem-links a{display:flex;justify-content:space-between;gap:1.5rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line);transition:padding .28s var(--ease),color .2s ease}.pedro-ecosystem-links a:hover{padding-left:.35rem;color:#fff}.pedro-ecosystem-links span{font-weight:650}.pedro-ecosystem-links small{color:#767b83;text-align:right}
.contribution-feature{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);gap:1rem;margin-bottom:3rem}.contribution-spotlight{padding:2rem;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#0e1114,#0a0c0f)}.contribution-spotlight .mini{font:500 .58rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.1em;color:#747980}.contribution-spotlight h3{margin:.8rem 0 .8rem;font-size:clamp(2rem,4vw,3.4rem);line-height:.96;letter-spacing:-.05em}.contribution-spotlight p{color:#898e96;line-height:1.65}.contribution-spotlight a{display:inline-flex;margin-top:1rem;border-bottom:1px solid #696e75;font-weight:650}.contribution-stack{display:grid;gap:.7rem;perspective:1000px}.contribution-stack div{padding:1.2rem 1.25rem;border:1px solid var(--line);border-radius:18px;background:#0c0f12;transform-style:preserve-3d;transition:transform .3s var(--ease),border-color .2s ease}.contribution-stack div:nth-child(1){transform:rotate(1deg)}.contribution-stack div:nth-child(2){transform:translateX(8px) rotate(-1deg)}.contribution-stack div:nth-child(3){transform:translateX(-5px) rotate(.7deg)}.contribution-stack div:hover{transform:translateY(-4px) rotate(0deg);border-color:rgba(255,255,255,.16)}.contribution-stack span{display:block;font:500 .57rem/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:#676c73}.contribution-stack strong{display:block;margin-top:.55rem;font-size:1rem}
.pedro-close-section{padding-top:5rem}.pedro-close-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}.pedro-close-grid>div{padding:2rem 2rem 1rem 0;border-bottom:1px solid var(--line)}.pedro-close-grid>div:first-child{border-right:1px solid var(--line)}.pedro-close-grid>div:last-child{padding-left:2rem}.pedro-close-grid h3{margin:.7rem 0;font-size:clamp(2rem,4vw,3.6rem);line-height:.96;letter-spacing:-.05em}.pedro-close-grid p:last-child{color:#898e96;line-height:1.65}
@media(max-width:900px){.metric-row-four{grid-template-columns:repeat(2,1fr)}.metric-row-four .metric:nth-child(2){border-right:0}.metric-row-four .metric:nth-child(-n+2){border-bottom:1px solid var(--line)}.pedro-showcase{grid-template-columns:1fr}.pedro-showcase-copy{max-width:720px}.contribution-feature{grid-template-columns:1fr}}
@media(max-width:640px){.metric-row-four{grid-template-columns:1fr}.metric-row-four .metric{border-right:0;border-bottom:1px solid var(--line)!important}.pedro-showcase-visual{min-height:430px;border-radius:20px}.pedro-showcase-logo{width:92px;height:92px;left:5%;top:5%}.pedro-showcase-logo img{width:56px}.pedro-showcase-robot{width:86%;right:-12%}.pedro-ecosystem-links a{align-items:flex-start;flex-direction:column;gap:.35rem}.pedro-ecosystem-links small{text-align:left}.pedro-close-grid{grid-template-columns:1fr}.pedro-close-grid>div:first-child{border-right:0}.pedro-close-grid>div:last-child{padding-left:0}.pr-item{grid-template-columns:1fr auto}.pr-item .repo{grid-column:1/-1}.pr-item a{align-self:center}}
@media(prefers-reduced-motion:reduce){.pedro-showcase-path path:last-of-type{animation:none}}