/* Typography, lighter slate/ivory palette, and progressive motion. */
@font-face{font-family:Sora;src:url('assets/fonts/sora-variable.ttf') format('truetype');font-weight:100 800;font-style:normal;font-display:swap}
:root{--bg:#26343d;--panel:#334853;--text:#f7f4ec;--muted:#d5dde1;--line:#667b86;--accent:#ffd28e;color-scheme:dark}
body{font-family:Sora,system-ui,sans-serif;font-weight:500;font-synthesis:none;background:var(--bg);color:var(--text)}
button,input,summary{font-family:inherit}
::selection{background:#ffd28e;color:#26343d}
.progress{height:2px;background:var(--accent)}
.topbar{border-color:#617580}
.monogram{font-weight:750;color:#fff5e6}
.monogram span,.fullstop{color:#ffd28e}
.top-contact{font-size:16px;font-weight:600;color:#fff5e6}
.top-contact span{color:#ffd28e}
.top-label,.section-label,.index,.visual-label,.feature-bottom,.tile-overline,.tile-demo,.tile-year,.project-eyebrow,.discipline>span:first-child{font-family:Sora,system-ui,sans-serif;font-size:14px;line-height:1.6;font-weight:600;letter-spacing:0;color:#dbe1e5}
.intro{padding-top:72px;padding-bottom:48px}
.intro h1{font-size:clamp(52px,7.4vw,96px);font-weight:700;letter-spacing:-.04em;line-height:1.07}
.intro-heading{align-items:end;gap:35px}
.intro-heading>p{font-size:clamp(20px,1.7vw,28px);font-weight:600;color:#e2e8eb;line-height:1.4;letter-spacing:-.4px}
.intro-meta,.intro-meta a{font-family:inherit;font-size:16px;font-weight:550;line-height:1.7;color:#d5dde1}
.intro-meta a{color:#fff3df}
.intro-meta a span{color:#ffd28e;transition:transform .25s}
.intro-meta a:hover span{transform:translateY(4px)}
.secondary-projects{margin-top:100px}
.gestartes-tile .tile-visual{background:#334b59;border:1px solid #78919e;border-radius:18px;box-shadow:0 24px 55px -35px #000000;transform:perspective(1400px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .24s ease-out,border-color .3s}
.tile-overline,.tile-demo{color:#e0e7eb}
.gestartes-tile .tile-caption h2,.discipline h3{font-weight:650;color:#fff7eb}
.gestartes-tile .tile-caption p{font-size:17px;font-weight:500;line-height:1.8;color:#dce3e7}
.project-source a{color:#ffdb9f;font-weight:600}
.tile-year{color:#e0e7eb}
.image-corner{opacity:1;translate:none;background:#26343dd9;border-color:#b7cbd5;color:#fff2dc}
.woobify-showcase{border-top-color:#6b808a}
.project-eyebrow{font-size:14px;color:#dce3e7}
.woobify-copy h2{font-weight:700;letter-spacing:-.04em;color:#fff7eb}
.woobify-lead{font-weight:600;color:#f1f1eb}
.woobify-summary{font-size:17px;line-height:1.85;color:#dce3e7;font-weight:500}
.woobify-stack{font-size:15px;font-weight:600;line-height:1.9;color:#d5e0e6}
.woobify-explore{font-size:16px;font-weight:650;color:#ffdb9f;border-bottom-color:#e2bc80}
.woobify-details{border-top-color:#71848e}
.woobify-details summary{font-size:15px;font-weight:600;color:#f0e7d7;line-height:1.6}
.woobify-details summary:after{color:#ffdb9f}
.woobify-details p{font-size:16px;line-height:1.8;color:#dce3e7}
.woobify-details strong{font-weight:650;color:#fff7eb}
.woobify-screen{border-color:#9eafb859;box-shadow:0 30px 55px -23px #00000066}
.woobify-scene{transform:perspective(1400px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease-out;transform-style:preserve-3d}
.woobify-visual-foot{font-size:14px;font-weight:550;color:#d4dfe4}
.about>.section-label,.footer-main .section-label{font-size:14px;font-weight:650;color:#ffdb9f}
.discipline{border-color:#6b808b;transition:background-color .25s}
.discipline:last-child{border-color:#6b808b}
.discipline>span:first-child{color:#ffdb9f}
.discipline>span:last-child{font-size:16px;font-weight:550;line-height:1.8;color:#dae3e7}
.discipline:hover{background:#ffffff05}
.email-link{font-weight:650;color:#fff4e2}
.email-link>span{color:#ffd28e}
.linkedin{font-size:16px;font-weight:600;color:#fff1d7}
.footer-bottom,.footer-bottom a{font-size:14px;font-weight:550;line-height:1.8;color:#d5dde1}
.footer-bottom{border-top-color:#6b808b}
.lightbox{background:#26343d;color:#fff6e8;border-color:#92a7b3;border-radius:15px;padding:24px}
.lightbox-top h2{font-size:16px;font-weight:600;line-height:1.6}
.close{font-size:15px;font-weight:600;color:#fff1da}
.lightbox-caption{font-size:15px;font-weight:500;line-height:1.7;color:#d5e0e6}
.lightbox-navigation{color:#d5dde1;font-size:15px;border-top-color:#6b808b}
.lightbox-navigation button{font-size:15px;font-weight:600;padding:12px 16px;background:#f1eadf;border-color:#f1eadf;color:#26343d;border-radius:7px}
/* The conceptual project is a light editorial surface, not a product screen. */
.crm-case{--crm-text:#263b48;--crm-muted:#435a68;--crm-line:#a4afb3;--crm-node:#fffcf5;color-scheme:light;max-width:1500px;padding:clamp(35px,4vw,65px);border-radius:26px;background:#eeeae1;box-shadow:0 30px 70px -50px #000000;font-weight:500}
.crm-case :focus-visible{outline-color:#244c62}
.crm-intro h2{font-weight:650;font-size:clamp(35px,3.4vw,54px)}
.crm-category{font-size:16px;font-weight:600;color:#4d606c}
.crm-summary{color:#263b48;font-weight:550}
.crm-description{color:#425967;font-weight:500}
.crm-section-heading h3{font-weight:650;letter-spacing:-.7px}
.crm-map-area{border-color:#b0b9bb;background:#fffcf5;box-shadow:0 8px 20px -14px #56697733;transition:transform .25s,box-shadow .25s,border-color .25s}
.crm-map-area:hover{transform:translateY(-4px);border-color:#52758a;box-shadow:0 15px 28px -20px #263b4866}
.crm-map-area h4{font-weight:650}
.crm-map-area p{color:#425967;font-weight:500}
.crm-map-core{background:#2b4759;color:#fff7e8;box-shadow:0 10px 22px -12px #1c3a4b66}
.crm-map-core span{font-weight:700}
.crm-map-links{stroke:#607e8e;stroke-width:2}
.crm-transversal{color:#304b5d;border-color:#a2afb6;font-weight:550}
/* Motion starts only when the supported browser features are available. */
.motion-ready .animated-block{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}
.motion-ready .animated-block.in-view{opacity:1;transform:none}
.motion-ready .crm-map.in-view .crm-map-area{animation:project-rise .6s both}
.motion-ready .crm-map.in-view .crm-area-operations{animation-delay:.08s}
.motion-ready .crm-map.in-view .crm-area-documents{animation-delay:.16s}
.motion-ready .crm-map.in-view .crm-area-finance{animation-delay:.24s}
.motion-ready .crm-map.in-view .crm-map-links path{stroke-dasharray:1;animation:connect-map .9s .15s both}
.motion-ready .lightbox[open]{animation:modal-arrive .25s ease-out both}
@keyframes project-rise{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
@keyframes connect-map{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes modal-arrive{from{opacity:.3;scale:.97}to{opacity:1;scale:1}}
@media(max-width:1100px){.intro-heading{display:block}.intro-heading>p{margin-top:28px;font-size:23px}.intro-heading>p br{display:none}.intro-meta,.intro-meta a{font-size:15px}.gestartes-tile .tile-caption p{font-size:16px}.woobify-copy h2{font-size:72px}.project-eyebrow{font-size:13px}.crm-intro h2{font-size:44px}.crm-case{padding:40px}}
@media(max-width:760px){
 .topbar{height:85px}.top-label{font-size:12px}.top-contact{font-size:14px;gap:12px}.monogram{font-size:27px}
 .intro{padding-top:55px;padding-bottom:45px}.intro h1{font-size:clamp(32px,8.6vw,62px);line-height:1.12;letter-spacing:-.04em}.intro-heading>p{font-size:21px;line-height:1.5}
 .intro-meta{align-items:start;gap:22px;margin-top:32px}.intro-meta,.intro-meta a{font-size:14px}.intro-meta>span{max-width:190px}.intro-meta a{max-width:120px;gap:8px}
 .secondary-projects{margin-top:70px}.tile-overline,.tile-overline>span:last-child{font-size:12px}.tile-demo{font-size:12px}.gestartes-tile .tile-caption h2{font-size:32px}.gestartes-tile .tile-caption p{font-size:16px}.tile-year{font-size:13px}
 .project-eyebrow{font-size:12px}.woobify-copy h2{font-size:60px}.woobify-lead{font-size:22px}.woobify-summary{font-size:17px}.woobify-stack{font-size:15px}.woobify-explore{font-size:16px}.woobify-details summary{font-size:15px}.woobify-details p{font-size:16px}.woobify-visual-foot{font-size:13px}
 .discipline{grid-template-columns:28px minmax(0,1fr);gap:12px}.discipline h3{font-size:21px}.discipline>span:first-child{font-size:14px}.discipline>span:last-child{font-size:15px}.about>.section-label,.footer-main .section-label{font-size:13px}
 .email-link{font-size:clamp(30px,9vw,44px);gap:18px}.linkedin{font-size:14px;gap:14px}.footer-bottom,.footer-bottom a{font-size:13px}.footer-bottom{gap:13px}.footer-bottom>span:nth-child(2){max-width:85px}
 .lightbox{padding:18px 14px}.lightbox-top{gap:20px}.lightbox-top h2{font-size:14px}.close{font-size:14px;gap:12px}.lightbox-caption{font-size:14px}.lightbox-navigation,.lightbox-navigation button{font-size:14px}
 .crm-case{width:calc(100% - 24px);padding:32px 14px;border-radius:19px}.crm-intro h2{font-size:clamp(31px,7.8vw,43px)}.crm-category{font-size:15px}.crm-intro-copy{min-width:0}.crm-map-area{padding:22px 20px}.crm-map-area h4{font-size:21px}.crm-map-area p{font-size:17px}
}
@media(max-width:360px){.top-label{display:none}.intro-meta{display:block}.intro-meta a{max-width:none;justify-content:space-between;margin-top:22px}.footer-main{display:block}.linkedin{display:inline-flex;margin-top:30px}.footer-bottom{flex-wrap:wrap}.footer-bottom>span:nth-child(2){max-width:none}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .motion-ready .animated-block,.motion-ready .crm-map.in-view .crm-map-area{opacity:1;transform:none;translate:none;animation:none;transition:none}
 .motion-ready .crm-map.in-view .crm-map-links path{stroke-dasharray:none;stroke-dashoffset:0;animation:none}
 .motion-ready .lightbox[open]{animation:none;translate:none;scale:1}
 .gestartes-tile .tile-visual,.woobify-scene{transform:none;transition:none}
 .crm-case *,a,button,.discipline,.woobify-screen{animation:none!important;transition:none!important}
}

/* A clear introduction to the author's project selection. */
.projects-heading{width:90%;max-width:1440px;margin:0 auto;padding:36px 0 52px;text-align:center;scroll-margin-top:30px}
.projects-heading h2{font-size:clamp(36px,5.2vw,72px);font-weight:650;line-height:1.13;letter-spacing:-.04em;color:#fff7eb;text-wrap:balance}
.projects-heading p{max-width:48ch;margin:22px auto 0;font-size:18px;font-weight:500;line-height:1.7;color:#d5dde1;text-wrap:balance}
@media(max-width:760px){.projects-heading{width:calc(100% - 44px);padding:32px 0 42px}.projects-heading h2{font-size:clamp(36px,8.6vw,56px)}.projects-heading p{margin-top:18px;font-size:16px;line-height:1.7}}

/* Consistent links and quieter editorial rhythm. */
:root{--link-line:#89999e;--ease-out:cubic-bezier(.16,1,.3,1)}
html{scrollbar-color:#8a9ba3 var(--bg);scrollbar-width:thin}
a{text-underline-offset:.22em;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.link-arrow,.doc-icon{width:20px;height:20px;flex:none;vertical-align:middle}
.link-arrow{transition:transform .25s var(--ease-out)}
a:hover>.link-arrow,a:focus-visible>.link-arrow{transform:translate(2px,-2px)}
.top-contact,.email-link{display:inline-flex;align-items:center}
.email-link>.link-arrow{width:clamp(28px,3.5vw,50px);height:clamp(28px,3.5vw,50px);color:var(--accent)}
.profile-links,.footer-profiles{display:flex;align-items:center;flex-wrap:wrap;gap:12px 28px}
.profile-link{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding:6px 0;border-bottom:1px solid var(--link-line);color:var(--text);font-size:15px;font-weight:600;transition:color .2s,border-color .2s}
.profile-link:hover{color:var(--accent);border-color:var(--accent)}
.profile-link .link-arrow{color:var(--accent);width:17px;height:17px}
.intro-meta{gap:24px;flex-wrap:wrap;margin-top:32px}
.intro-meta .profile-link{max-width:none;margin:0}
.project-category{font-size:15px;line-height:1.6;color:var(--muted);margin:-8px 0 24px}
.project-docs{display:flex;align-items:center;gap:16px;width:fit-content;max-width:100%;margin-top:26px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--text)}
.project-docs>span{font-size:16px;line-height:1.55;font-weight:600}
.project-docs small{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-top:4px}
.project-docs>.link-arrow{margin-left:20px;color:var(--accent)}
.project-docs:hover{color:var(--accent);border-color:var(--accent)}
.project-docs .doc-icon{color:var(--accent);width:24px;height:24px}
.gest-header h2,.woobify-copy h2,.projects-heading h2,.intro h1{letter-spacing:-.04em;text-wrap:balance}
.gest-header .gest-role{max-width:37ch;font-size:15px;line-height:1.8}
.gest-capture{box-shadow:none}
.gest-shots button{min-height:88px}
.footer-main{align-items:end;gap:40px}
.footer-profiles{padding-bottom:8px}
/* A failed animation must never conceal the portfolio. */
.motion-ready .animated-block{opacity:1;transform:none}
@media(max-width:760px){
 .intro{padding-top:48px;padding-bottom:30px}
 .intro-meta{display:block;margin-top:24px}
 .profile-links{margin-top:18px;gap:24px}
 .intro-meta .profile-link{font-size:14px}
 .projects-heading{padding:28px 0 36px}
 .project-docs{width:100%;margin-top:20px}
 .project-docs>.link-arrow{margin-left:auto}
 .footer-main{display:block}
 .footer-profiles{margin-top:28px;padding-bottom:0;gap:28px}
 .gest-shots button{min-height:88px}
 .gest-shots small{font-size:13px}
 .project-category{font-size:14px;margin:0 0 20px}
}
@media(prefers-reduced-motion:reduce){.link-arrow{transition:none}a:hover>.link-arrow,a:focus-visible>.link-arrow{transform:none}}

.motion .reveal{opacity:1;transform:none}
