/* Silver / lime refinements: restrained navigation and light as interaction. */
:root{--fresh-green:#58f844;--silver:#909095}
body{--signal:var(--fresh-green)}body.surface-dark{--signal:var(--lime)}
.site-header{width:min(450px,calc(100% - 40px));height:52px;top:30px;padding:0 16px;display:flex;gap:20px;border-radius:9px;background:#171719f5;box-shadow:0 8px 25px #0000000a;transition:width .65s cubic-bezier(.22,1,.36,1),box-shadow .6s}
.site-header.scrolled{width:min(350px,calc(100% - 40px));box-shadow:0 12px 32px #00000012}
.site-header .brand{font-size:20px;font-weight:550;letter-spacing:-.05em;line-height:1;padding:12px 0;flex:1}
.site-header .menu-toggle{border:0;border-radius:0;display:flex;align-items:center;gap:15px;padding:14px 0 14px 14px;box-shadow:none!important;background:transparent;color:#ececee}
.site-header .menu-toggle .menu-label{font-size:10px;text-transform:uppercase;line-height:1;color:inherit}
.site-header .menu-toggle .menu-dots{display:grid;grid-template-columns:repeat(3,3px);gap:4px;width:17px;height:17px;transition:rotate .5s ease}
.menu-dots i{width:3px;height:3px;background:var(--fresh-green);border-radius:50%;transition:opacity .4s,box-shadow .4s}
.menu-toggle:hover .menu-dots i{box-shadow:0 0 8px #58f844cc}
.menu-open .menu-dots{rotate:45deg}.menu-open .menu-dots i:nth-child(2),.menu-open .menu-dots i:nth-child(4),.menu-open .menu-dots i:nth-child(6),.menu-open .menu-dots i:nth-child(8){opacity:0}
.site-header nav{display:block;position:absolute;left:calc(50% + 50vw - 190px);top:0;width:160px;opacity:1;translate:0 0;transition:opacity .4s,translate .5s;pointer-events:auto}
.site-header nav .header-resume{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-radius:8px;background:#fff;color:#171719;font-size:11px;transition:box-shadow .5s}
.header-resume span{font-size:21px}.site-header nav a:after{display:none}
.site-header.scrolled nav,.menu-open .site-header nav{opacity:0;translate:0 -12px;pointer-events:none}
.hero h1 .impact-highlight{position:relative;display:inline;padding:0 .07em;background:var(--lime);color:#171719;border-radius:0;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero h1 .impact-highlight:after{display:none}
.hero-copy .title-line{padding-bottom:.1em;overflow:visible}
.intro h2{opacity:1}.intro .intro-layout{z-index:4}

/* Glows belong to shaped controls. Text links keep a quiet underline. */
.button:before,.gallery-open:before,.closing-arrow:before,.gallery-controls button:before,.filters button:before,.motion-toggle:before,.back-top:before{display:none}
.button,.button.lime,.surface-dark .button:not(.lime),.closing-arrow{background:var(--action-gradient);color:#171719;border-color:transparent;transition:box-shadow .65s ease,background-position .65s ease,filter .65s ease}
.button:hover,.button.lime:hover,.surface-dark .button:not(.lime):hover,.button:focus-visible,.closing-link:hover .closing-arrow{background:var(--action-gradient);color:#171719;border-color:transparent;background-position:80% 20%;box-shadow:0 0 18px #b8ff0059,0 12px 50px #9bff0052,0 24px 90px #b5ff0030;filter:brightness(1.06)}
.header-resume:hover,.gallery-controls button:hover,.filters button:hover,.motion-toggle:hover,.back-top:hover{box-shadow:0 0 18px #b8ff0040,0 12px 48px #aaff0045,0 22px 75px #c4ff0026;border-color:#a9d45c80}
.gallery-controls button:hover,.filters button:hover,.back-top:hover{background:var(--action-gradient);color:#171719}
.filters button:hover sup{color:#171719}
button.text-link:hover,.text-link:hover,.text-link:focus-visible,.print-button:hover,.menu-toggle:hover,.site-header .brand:hover,.mobile-menu a:hover,.site-footer a:not(.back-top):hover,.closing-bottom a:hover{box-shadow:none}
a:not(.button):not(.header-resume):not(.gallery-open):not(.back-top):hover{outline:none}
:focus:not(:focus-visible){outline:none}
.text-link{transition:border-color .5s,text-shadow .5s}
.text-link:hover{border-bottom-color:var(--signal);text-shadow:0 8px 20px #58f84430}
.print-button{box-shadow:none!important}
.gallery-open,.gallery-open:hover,.gallery-open:focus-visible{background:rgb(125 125 130 / .20);background-image:none;border:1px solid #ffffff35;color:#fff;backdrop-filter:blur(3px);box-shadow:0 8px 24px #00000014;transition:background .5s,box-shadow .6s,scale .4s}
.gallery-open span,.gallery-open:hover span{color:#fff}.gallery-open:hover{background:rgb(160 160 165 / .30);box-shadow:0 8px 40px #ffffff20;scale:1.04}
.intent-options input:checked+span,.intent-options label:hover>span{transform:none;translate:none;rotate:none}
.intent-options label>span{transition:background .55s,border-color .55s,box-shadow .6s}
.intent-options label:hover>span{box-shadow:0 8px 32px #58f84426}
.intent-options input:checked+span{background:var(--lime);border-color:#67e74d;box-shadow:0 8px 35px #58f84425}
.capability-cards article{transition:box-shadow .7s,border-color .7s,background .7s}
.capability-cards article:hover{translate:none;border-color:#c9ff7699;box-shadow:inset 0 0 22px #d6ff8820,0 0 24px #b8ff0033,0 16px 60px #9bff0028}
.availability i,.surface-dark .availability i{background:var(--signal);box-shadow:0 0 12px color-mix(in srgb,var(--signal) 65%,transparent)}
.availability i:after{border-color:var(--signal)}
@keyframes availability-beat{0%,40%,100%{transform:scale(1);box-shadow:0 0 9px color-mix(in srgb,var(--signal) 50%,transparent)}10%{transform:scale(1.3);box-shadow:0 0 22px color-mix(in srgb,var(--signal) 85%,transparent)}20%{transform:scale(1)}29%{transform:scale(1.22);box-shadow:0 0 18px color-mix(in srgb,var(--signal) 70%,transparent)}}

/* The same experience timeline and self-assessed language bars as the blue edition. */
.career-timeline{position:relative;--timeline:0%}
.career-timeline:before,.career-timeline:after{content:'';position:absolute;left:169px;top:40px;width:2px;bottom:40px;border-radius:2px;background:var(--line);pointer-events:none}
.career-timeline:after{bottom:auto;height:var(--timeline);max-height:calc(100% - 80px);background:var(--signal);box-shadow:0 0 15px #58f84455}
.career-entry:before{display:none}.career-marker i{background:#96969b;box-shadow:none;transition:background .6s,box-shadow .6s}
.career-marker>span{display:block;position:sticky;top:140px;transition:color .5s}
.career-active .career-marker i{background:var(--fresh-green);box-shadow:0 0 16px #58f84477}
.career-card{transition:border-color .65s,box-shadow .65s}
.career-active .career-card{border-color:#7cba6066;box-shadow:0 16px 50px #00000005}
.career-active .career-marker{color:var(--foreground,#171719)}
.employer-logo img,.surface-dark .employer-logo img{filter:grayscale(1) brightness(0) invert(.48)}
.education-icon{width:42px;height:42px;display:block;margin-bottom:28px;filter:brightness(0) invert(.65)}
.education-grid{gap:6%}.education-grid article{border-top:1px solid var(--line);padding-top:28px}
.languages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;padding-top:38px;margin-top:70px;position:relative;z-index:4}
.language-native{display:block;font-size:25px!important;color:var(--silver)!important;margin:0 0 25px!important;line-height:1.4}
.language-heading{display:flex;justify-content:space-between;align-items:baseline;gap:15px}.languages h3{font-size:21px;margin:0;letter-spacing:-.04em}.languages p{font-size:12px;color:var(--mute);margin:0}
.language-meter{height:7px;margin-top:22px;background:#ffffff18;border-radius:8px;overflow:hidden}
.language-meter>span{display:block;width:var(--level);height:100%;background:var(--lime);margin:0;border-radius:inherit;transform-origin:left}
.motion-paused .language-meter>span,.no-motion .language-meter>span{transform:scaleX(1)!important}.motion-paused .career-timeline,.no-motion .career-timeline{--timeline:100%!important}
.site-footer{color:#f3f3f4;border-color:#ffffff24}
.surface-dark .closing-link,.surface-dark .closing-bottom{color:#f3f3f4}
.surface-dark input:not([type=radio]),.surface-dark textarea,.surface-dark select{color:var(--foreground);border-color:var(--line)}
.surface-dark select option{background:#171719;color:#f3f3f4}.surface-dark .draft-result{background:#262629;color:#f3f3f4}
@media(max-width:1000px){.site-header nav{display:none}}
@media(max-width:760px){
 .site-header{top:18px;height:52px;width:calc(100% - 40px);padding:0 17px}.site-header.scrolled{width:min(310px,calc(100% - 40px))}.site-header .brand{font-size:19px}
 .site-header .menu-toggle{padding:14px 0 14px 14px}.hero h1{font-size:clamp(47px,10.8vw,75px)}
 .career-timeline:before,.career-timeline:after{left:3px;top:15px}.career-timeline:after{max-height:calc(100% - 55px)}.career-marker>span{position:static}
 .languages{grid-template-columns:1fr;gap:35px}.language-native{font-size:21px!important;margin-bottom:12px!important}.language-heading{justify-content:flex-start}.language-heading p{margin-left:auto}
 .education-grid article+article{padding-top:28px}.education-icon{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){.language-meter>span{transform:none!important}.career-timeline{--timeline:100%!important}}
@media print{.education-icon{filter:none}.career-timeline:after{height:100%;background:#777;box-shadow:none}.language-meter>span{background:#777;transform:none!important}.career-card{box-shadow:none}.languages{grid-template-columns:repeat(3,1fr)}.employer-logo img{filter:grayscale(1) brightness(0)!important}}

/* Solid accents on charcoal; gradients are reserved for the controls. */
body[data-page="cv"].surface-dark .capability-cards article{background:#ffffff08}
body[data-page="cv"].surface-dark .career-card{background:#ffffff06}
body[data-page="contact"]{--surface:#171719;--foreground:#f3f3f4;--mute:#bdbdc4;--line:#ffffff24;color:var(--foreground)}
body[data-page="contact"] .intent-options input:checked+span{color:#171719;background:var(--lime);border-color:var(--lime)}
body[data-page="contact"] .intent-options input:checked+span small,body[data-page="contact"] .intent-options input:checked+span i{color:#333b20}
/* The render loop already eases opacity; a CSS transition would delay the fade twice. */
#cube-stage{transition:none}

/* Identity, full project compositions, and neutral résumé cards. */
.hero-copy>.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:8px;line-height:1.8}
.name-highlight{display:inline-block;background:var(--lime);color:#171719;padding:2px 8px;font-size:13px;font-weight:600;letter-spacing:.025em}
.site-header{transition:width .65s cubic-bezier(.22,1,.36,1),box-shadow .6s,background .6s,backdrop-filter .6s}
.site-header.scrolled{background:rgb(23 23 25 / .73);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);border-color:#ffffff24}
.personal-intro{display:grid;grid-template-columns:1fr 2.5fr;gap:7%;padding-top:110px;padding-bottom:135px;position:relative;z-index:4}
.personal-intro-label{padding-top:10px}.personal-intro-label>p+p{margin-top:42px;font-size:14px;line-height:1.8}.personal-intro-label span{color:var(--mute);font-size:11px}
.personal-intro h2{font-size:clamp(38px,4.6vw,72px);line-height:1.13;letter-spacing:-.055em;max-width:900px}
.personal-intro h2 em{color:var(--mute)}.personal-intro-lead{font-size:clamp(18px,1.65vw,25px);line-height:1.55;max-width:700px;margin:30px 0}
.personal-intro-details{display:grid;grid-template-columns:1fr 1fr;gap:35px;font-size:13px;color:var(--mute);line-height:1.8;max-width:820px}
.personal-intro-links{display:flex;gap:35px;flex-wrap:wrap;margin-top:36px}
.work-editorial .project-image{aspect-ratio:1942/809;height:auto}
.work-editorial .project-image img,.work-editorial .project-card:hover .project-image img{object-fit:contain;transform:none;scale:1}
body[data-page="cv"] .career-card{background:rgb(255 255 255 / .17);color:var(--foreground);border-color:rgb(255 255 255 / .65);backdrop-filter:blur(24px) saturate(115%);-webkit-backdrop-filter:blur(24px) saturate(115%);box-shadow:inset 0 1px 0 #ffffffa0,inset 0 -1px 0 #ffffff35,0 18px 55px #17171909}
body[data-page="cv"].surface-dark .career-card{background:rgb(255 255 255 / .055);border-color:#ffffff24;box-shadow:inset 0 1px 0 #ffffff20,0 18px 55px #00000016}
body[data-page="cv"] .career-card p{color:var(--mute)}
body[data-page="cv"] .career-card .eyebrow{color:var(--foreground)}
body[data-page="cv"] .employer-logo img{filter:grayscale(1) brightness(0) invert(.43)}
body[data-page="cv"].surface-dark .employer-logo img{filter:grayscale(1) brightness(0) invert(.65)}
.contact-aside>a{font-size:clamp(17px,1.55vw,23px);letter-spacing:-.035em;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:760px){
 .personal-intro{grid-template-columns:1fr;gap:30px;padding-top:65px;padding-bottom:80px}
 .personal-intro-label{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:0}.personal-intro-label>p+p{margin:0;text-align:right;font-size:12px}
 .personal-intro h2{font-size:clamp(36px,8vw,56px)}.personal-intro-details{grid-template-columns:1fr;gap:18px}
 .personal-intro-lead{margin:22px 0}.personal-intro-links{gap:24px}.hero-copy>.eyebrow{gap:5px}
 .contact-aside>a{font-size:clamp(16px,4.4vw,21px)}
}
@media print{body[data-page="cv"] .career-card{background:white!important;color:black!important}body[data-page="cv"] .career-card p{color:#333!important}body[data-page="cv"] .employer-logo img{filter:grayscale(1) brightness(0)!important}}

/* The supplied portrait keeps its original likeness; neutral rim light meets a lime halo. */
.personal-intro{grid-template-columns:minmax(0,1fr) minmax(0,1.85fr);gap:7%;align-items:center}
.personal-intro-label{position:relative;align-self:stretch}
.personal-intro-label>p+p{margin-top:20px}
.intro-portrait{position:relative;margin-top:30px;isolation:isolate;overflow:hidden;border-radius:20px;background:#171719;aspect-ratio:2/2.7;border:1px solid #ffffff24}
.intro-portrait:before{content:'';position:absolute;inset:10% -25% -10%;background:radial-gradient(ellipse at 50% 45%,#c4ff0030,transparent 65%);z-index:-1}
.intro-portrait img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:grayscale(1) brightness(1.55);transform-origin:center bottom;mask-image:linear-gradient(#000 82%,transparent);-webkit-mask-image:linear-gradient(#000 82%,transparent)}
.intro-portrait:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 #ffffff20}
.intro-word{display:inline-block;will-change:transform,opacity}
.personal-intro h2{font-size:clamp(38px,4.25vw,68px)}
@media(max-width:760px){
 .personal-intro{grid-template-columns:1fr;gap:34px}
 .personal-intro-label{display:grid;grid-template-columns:1fr 1fr;gap:22px 15px}
 .personal-intro-label>p+p{margin:0}
 .intro-portrait{grid-column:1/-1;margin:0;width:min(100%,360px);justify-self:center;aspect-ratio:1/1.08}
 .intro-portrait img{object-fit:cover;object-position:center 20%;mask-image:linear-gradient(#000 78%,transparent);-webkit-mask-image:linear-gradient(#000 78%,transparent)}
 .personal-intro h2{font-size:clamp(36px,8vw,56px)}
 .process-steps{position:relative;z-index:4}
 .process-steps article{opacity:1}
 .process-steps article p{color:var(--foreground)}
}
@media(prefers-reduced-motion:reduce){.intro-word{transform:none!important;opacity:1!important}}
@media print{.intro-portrait{display:none}.career-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}

/* Open portrait, a single scroll-lit statement, and borderless frosted surfaces. */
.intro-portrait{background:transparent;border:0;border-radius:0;overflow:clip}
.intro-portrait:before{inset:15% -8% 4%;background:radial-gradient(ellipse,#c4ff0026,transparent 68%)}
.intro-portrait:after{display:none}
.personal-intro{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr);gap:6%;align-items:center}
.personal-intro h2{font-size:clamp(38px,4vw,66px);line-height:1.18;letter-spacing:-.055em;font-weight:500}
.personal-intro-label{align-self:start}
.personal-intro .intro-word{will-change:opacity}
.personal-intro-links{margin-top:40px}
body[data-page="cv"] .career-card,body[data-page="cv"].surface-dark .career-card,body[data-page="cv"] .career-active .career-card{border:0;box-shadow:none;background:rgb(255 255 255 / .09);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px)}
body[data-page="cv"].surface-dark .career-card{background:rgb(255 255 255 / .035)}
.gallery-scene{user-select:none;-webkit-user-select:none;touch-action:pan-y pinch-zoom}
.gallery-scene img{-webkit-user-drag:none}
.gallery-fallback{pointer-events:none}
@media(max-width:760px){
 .personal-intro{grid-template-columns:1fr;gap:28px}
 .personal-intro h2{font-size:clamp(34px,8.3vw,48px);line-height:1.2}
 .intro-portrait{aspect-ratio:1/1.13;width:min(100%,350px)}
}

/* Fade the complete portrait container, including transformed image edges. */
.intro-portrait{mask-image:linear-gradient(to bottom,#000 0%,#000 60%,#000c 72%,#0005 86%,transparent 98%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 60%,#000c 72%,#0005 86%,transparent 98%)}
.intro-portrait img{mask-image:linear-gradient(to bottom,#000 58%,#000c 72%,#0005 86%,transparent 98%);-webkit-mask-image:linear-gradient(to bottom,#000 58%,#000c 72%,#0005 86%,transparent 98%)}
/* Keep focus clearly visible using the field's own underline. */
#contact-form input:not([type=radio]),#contact-form textarea,#contact-form select{transition:border-color .25s,box-shadow .25s;background-clip:padding-box}
#contact-form input:not([type=radio]):focus,#contact-form textarea:focus,#contact-form select:focus{outline:none;border-bottom-color:var(--lime);box-shadow:0 1px 0 var(--lime)}
.motion-word-clip{display:inline-block;overflow:clip;vertical-align:bottom;padding-bottom:.12em;margin-bottom:-.12em}
.motion-word{display:inline-block;will-change:transform,opacity}
@media(prefers-reduced-motion:reduce){.motion-word{transform:none!important;opacity:1!important}#contact-form input,#contact-form textarea,#contact-form select{transition:none}}
@media print{.motion-word{transform:none!important;opacity:1!important}}

.contact-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.contact-security{margin:25px 0;max-width:100%;min-height:0}.contact-security[hidden]{display:none}
.contact-send-status{font-size:13px;line-height:1.7;max-width:580px;margin-top:22px;color:#d5d5d8}.contact-send-status:empty{display:none}.contact-send-status.sent{color:var(--lime)}
#contact-form button[disabled]{opacity:.65;cursor:wait;transform:none}
