/* V10 refined metallic AI hero + shared panels, from V9 */
:root {--v10-glint:rgba(231,241,250,.75)}
body[data-theme="light"] {--v10-glint:rgba(165,178,192,.7)}
/* Each clickable certificate gets the same gentle graphite illumination as experience, work and story. */
.cert-card,.cert-card-link{
 position:relative;overflow:hidden;
 background:radial-gradient(ellipse at 22% 1%,var(--surface-shine),transparent 75%),
 linear-gradient(115deg,color-mix(in srgb,var(--panel) 97%,var(--bg)),color-mix(in srgb,var(--panel) 82%,var(--bg)) 65%,var(--surface-depth))!important;
 border:1px solid var(--border)!important;
 box-shadow:inset 0 1px 0 rgba(225,235,245,.055),0 12px 35px rgba(0,0,0,.045)!important;
 transition:border-color .22s ease,box-shadow .22s ease,background .22s ease!important;
}
.cert-card-link:hover,.cert-card-link:focus-visible{
 border-color:color-mix(in srgb,var(--accent) 50%,var(--border))!important;
 box-shadow:inset 0 1px 0 rgba(225,235,245,.095),0 13px 30px rgba(0,0,0,.12)!important;
 transform:none!important;
}
/* Full story is read in a calm panel with illumination coming from the right edge. */
.story-full:not([hidden]){
 max-width:1150px!important;width:100%;margin-top:12px!important;
 background:radial-gradient(ellipse at 100% 18%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 64%),
 linear-gradient(270deg,color-mix(in srgb,var(--panel) 91%,var(--bg)),color-mix(in srgb,var(--panel) 78%,var(--bg)))!important;
 border:1px solid var(--border)!important;border-left:1px solid var(--border)!important;
 border-right:2px solid color-mix(in srgb,var(--accent) 54%,var(--border))!important;
 border-radius:15px 0 0 15px!important;
 padding:23px 30px!important;
 box-shadow:inset -1px 0 0 rgba(237,243,249,.07),0 9px 25px rgba(0,0,0,.05);
}
.story-full p{line-height:1.76!important;font-size:14px!important}
/* Gentle, physical float in place: small rise, rotation and depth change rather than bobbing. */
.neural-float{animation:brainLevitateV10 9.5s cubic-bezier(.45,0,.55,1) infinite!important;will-change:transform}
.neural-shadow{animation:brainShadowV10 9.5s ease-in-out infinite!important}
.neural-hero{filter:saturate(.26) contrast(1.025)!important}
.neural-brain-image{filter:drop-shadow(0 14px 19px rgba(163,174,189,.16))!important}
.neural-glow{background:radial-gradient(ellipse at 52% 48%,rgba(183,191,202,.12),transparent 70%)!important;filter:blur(27px)!important}
body[data-theme="light"] .neural-hero{filter:saturate(.12) contrast(1.04)!important}
body[data-theme="light"] .neural-brain-image{filter:drop-shadow(0 13px 18px rgba(85,100,120,.16))!important}
/* Low-key neuron highlights are part of the image, never a bright electric overlay. */
.brain-glints{position:absolute;inset:0;pointer-events:none;z-index:3;mix-blend-mode:screen;opacity:.85}
.brain-glint{position:absolute;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle,#fff 0%,#e4ecf5 28%,rgba(214,230,245,.16) 55%,transparent 75%);box-shadow:0 0 5px 1px rgba(235,244,253,.24),0 0 16px rgba(186,207,225,.12);animation:neuronGlowV10 5.9s ease-in-out infinite}
.brain-glint-a{left:34%;top:33%;animation-delay:-1.1s}
.brain-glint-b{left:61%;top:26%;width:7px;height:7px;animation-delay:-3.7s}
.brain-glint-c{left:76%;top:46%;width:6px;height:6px;animation-delay:-2.8s}
.brain-glint-d{left:48%;top:57%;width:8px;height:8px;animation-delay:-4.5s}
body[data-theme="light"] .brain-glints{opacity:.55;mix-blend-mode:multiply}
@keyframes brainLevitateV10{0%,100%{transform:translate3d(0,2px,0) rotate(-.35deg) scale(1)}50%{transform:translate3d(0,-5px,0) rotate(.45deg) scale(1.008)}}
@keyframes brainShadowV10{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.24;transform:scale(.97)}}
@keyframes neuronGlowV10{0%,16%,70%,100%{opacity:.14;transform:scale(.85)}26%,33%{opacity:.78;transform:scale(1.3)}46%{opacity:.32;transform:scale(.97)}}
@media(max-width:690px){
 .story-full:not([hidden]){padding:17px 18px!important;margin-top:10px!important;border-radius:12px 0 0 12px!important}
 .story-full p{font-size:12.5px!important;line-height:1.74!important}
 .brain-glint{transform:scale(.7);box-shadow:0 0 6px rgba(255,255,255,.2)}
 .neural-hero{filter:saturate(.20) contrast(1.025)!important}
}
@media(prefers-reduced-motion:reduce){.neural-float,.neural-shadow,.brain-glint{animation:none!important}}
