*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul[role=list],ol[role=list]{list-style:none;margin:0;padding:0}
body{min-height:100vh;text-rendering:optimizeLegibility}
img,picture,video,canvas,svg{display:block;max-width:100%}
img{height:auto}
input,button,textarea,select{font:inherit}
button{border:0}
a{text-decoration-thickness:.08em;text-underline-offset:.18em}
table{border-collapse:collapse;border-spacing:0}
:root{color-scheme:light;--brand-carbon:#0a0c0f;--brand-graphite:#13171c;--brand-steel:#39414b;--brand-silver:#d6dadf;--brand-paper:#f7f8fa;--brand-gold:#b89552;--brand-blue:#5c7fa3;--brand-red:#c94d4d;--bg:var(--brand-paper);--surface:#fff;--surface-2:#eef1f4;--surface-3:#e1e5e9;--text:var(--brand-carbon);--muted:#5e6670;--line:#c9ced4;--accent:var(--brand-gold);--accent-strong:#7a5b26;--accent-soft:#f0e6d2;--accent-contrast:var(--brand-carbon);--secondary:#476b8d;--header:rgba(247,248,250,.94);--shadow:0 12px 34px rgba(10,12,15,.09);--radius-sm:.625rem;--radius-md:.875rem;--radius-lg:1.125rem;--radius-xl:1.5rem;--content:77.5rem;--reading:46rem;--space-1:.35rem;--space-2:.65rem;--space-3:1rem;--space-4:1.5rem;--space-5:2.25rem;--space-6:3.25rem;--space-7:4.75rem;--step--1:clamp(.84rem,.8rem + .12vw,.92rem);--step-0:clamp(1rem,.96rem + .18vw,1.08rem);--step-1:clamp(1.18rem,1.06rem + .45vw,1.42rem);--step-2:clamp(1.48rem,1.2rem + 1vw,2rem);--step-3:clamp(2rem,1.5rem + 1.8vw,3rem);--step-4:clamp(2.55rem,1.7rem + 3vw,4.2rem);--transition:180ms cubic-bezier(.2,.7,.2,1)}
:root[data-theme=dark]{color-scheme:dark;--bg:var(--brand-carbon);--surface:var(--brand-graphite);--surface-2:#191e24;--surface-3:#232a32;--text:var(--brand-paper);--muted:#a7aeb7;--line:var(--brand-steel);--accent:var(--brand-gold);--accent-strong:#d1b06f;--accent-soft:#352c1e;--accent-contrast:var(--brand-carbon);--secondary:#86a4c1;--header:rgba(10,12,15,.94);--shadow:0 16px 42px rgba(0,0,0,.28)}
html{font-size:100%;scroll-padding-top:6rem}
body{background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:var(--step-0);line-height:1.68}
body.nav-open{overflow:hidden}
h1,h2,h3,h4{font-family:"Segoe UI Variable Display","Aptos Display",ui-sans-serif,system-ui,sans-serif;line-height:1.12;letter-spacing:-.025em;text-wrap:balance}
h1{font-size:var(--step-4);font-weight:760}
h2{font-size:var(--step-3);font-weight:730}
h3{font-size:var(--step-2);font-weight:700}
h4{font-size:var(--step-1)}
p,li,dd{max-width:72ch}
p+p{margin-top:1rem}
a{color:var(--accent-strong)}
a:hover{color:var(--secondary)}
strong{font-weight:720}
small{font-size:var(--step--1)}
::selection{background:var(--accent);color:var(--accent-contrast)}
.container{width:min(calc(100% - 2rem),var(--content));margin-inline:auto}
.reading{max-width:var(--reading)}
.section{padding-block:var(--space-7)}
.section--compact{padding-block:var(--space-6)}
.section--surface{background:var(--surface)}
.section--tint{background:var(--surface-2)}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;margin-bottom:.8rem;color:var(--accent-strong);font-size:.78rem;font-weight:780;letter-spacing:.12em;text-transform:uppercase}
.eyebrow::before{content:"";width:1.55rem;height:2px;background:currentColor}
.lead{font-size:clamp(1.1rem,1rem + .45vw,1.35rem);line-height:1.55;color:var(--muted);max-width:62ch}
.muted{color:var(--muted)}
.kicker{font-size:var(--step-1);color:var(--muted);max-width:60ch}
.flow>*+*{margin-top:1.2rem}
.stack>*+*{margin-top:var(--space-4)}
.cluster{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.grid{display:grid;gap:var(--space-5)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.page-shell{min-height:100vh;display:flex;flex-direction:column}
.site-main{flex:1}
.page-intro{padding-block:clamp(3rem,6vw,5.5rem);border-bottom:1px solid var(--line)}
.page-intro__grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(17rem,.6fr);gap:var(--space-6);align-items:end}
.page-intro__meta{border-left:3px solid var(--accent);padding-left:1.2rem;color:var(--muted)}
.skip-link{position:fixed;z-index:1000;top:.5rem;left:.5rem;transform:translateY(-150%);background:var(--text);color:var(--bg);padding:.7rem 1rem;border-radius:var(--radius-sm);font-weight:700}
.skip-link:focus{transform:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.no-js-only{display:block}
.has-js .no-js-only{display:none}
.divider{height:1px;background:var(--line);margin-block:var(--space-5)}
.list-clean{list-style:none;padding:0;margin:0}
.list-check{list-style:none;padding:0;margin:0}
.list-check li{position:relative;padding-left:1.55rem;margin-top:.62rem}
.list-check li::before{content:"";position:absolute;left:0;top:.63em;width:.62rem;height:.34rem;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.hero-grid>*,.page-intro__grid>*,.featured-project>*,.goal-panel>*,.about-split>*,.projects-feature>*,.case-hero>*,.case-layout>*,.knowledge-section>*,.cv-head>*,.cv-grid>*,.contact-layout>*,.legal-layout>*{min-width:0}
h1,h2,h3,h4{overflow-wrap:normal;word-break:normal;hyphens:auto}
p,li,dd,label{overflow-wrap:break-word}
a,button{overflow-wrap:normal}
code,.breakable-url{overflow-wrap:anywhere;word-break:break-word}
.site-header{position:sticky;top:0;z-index:100;background:var(--header);backdrop-filter:blur(16px);border-bottom:1px solid color-mix(in srgb,var(--line) 78%,transparent)}
.header-inner{min-height:4.75rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:inline-flex;align-items:center;gap:.8rem;color:var(--text);text-decoration:none;font-weight:760}
.brand-logo{flex:0 0 auto;width:2.35rem;height:2.35rem;border-radius:.7rem}
.brand-copy{display:grid;line-height:1.05}
.brand-copy small{font-weight:620;color:var(--muted);margin-top:.2rem}
.nav-shell{display:flex;align-items:center;gap:.8rem}
.site-nav-nojs{display:none}
.site-nav ul{display:flex;align-items:center;gap:.18rem;list-style:none;padding:0;margin:0}
.site-nav a{display:block;padding:.56rem .68rem;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent;font-size:.94rem;font-weight:660}
.site-nav a:hover{color:var(--text)}
.site-nav a[aria-current=page]{color:var(--text);border-color:var(--accent)}
.icon-button,.nav-toggle{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);cursor:pointer;transition:background var(--transition),border-color var(--transition),transform var(--transition)}
.icon-button:hover,.nav-toggle:hover{background:var(--surface-2);border-color:var(--accent)}
.icon-button:active,.nav-toggle:active{transform:translateY(1px)}
.nav-toggle{display:none;position:relative}
.nav-toggle span,.nav-toggle::before,.nav-toggle::after{content:"";position:absolute;width:1.15rem;height:2px;background:currentColor;transition:transform var(--transition),opacity var(--transition)}
.nav-toggle::before{transform:translateY(-.36rem)}
.nav-toggle::after{transform:translateY(.36rem)}
.nav-toggle[aria-expanded=true] span{opacity:0}
.nav-toggle[aria-expanded=true]::before{transform:rotate(45deg)}
.nav-toggle[aria-expanded=true]::after{transform:rotate(-45deg)}
.theme-icon{width:1.15rem;height:1.15rem}
.theme-icon--sun{display:none}
:root[data-theme=dark] .theme-icon--sun{display:block}
:root[data-theme=dark] .theme-icon--moon{display:none}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:2.85rem;padding:.68rem 1rem;border:1px solid transparent;border-radius:var(--radius-sm);font-weight:720;text-decoration:none;cursor:pointer;transition:background var(--transition),color var(--transition),border-color var(--transition),transform var(--transition)}
.button:hover{transform:translateY(-1px)}
.button--primary{background:var(--accent);color:var(--accent-contrast)}
.button--primary:hover{background:color-mix(in srgb,var(--accent) 82%,var(--text));color:var(--accent-contrast)}
.button--secondary{background:var(--surface);color:var(--text);border-color:var(--line)}
.button--secondary:hover{border-color:var(--accent);color:var(--accent-strong)}
.button--quiet{background:transparent;color:var(--text);border-color:var(--line)}
.text-link{display:inline-flex;align-items:center;gap:.45rem;font-weight:730}
.text-link::after{content:"→";transition:transform var(--transition)}
.text-link:hover::after{transform:translateX(.2rem)}
.tag-list{display:flex;flex-wrap:wrap;gap:.45rem;list-style:none;margin:0;padding:0}
.tag{display:inline-flex;align-items:center;min-height:1.85rem;padding:.26rem .58rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.78rem;font-weight:680}
.status{display:inline-flex;align-items:center;gap:.45rem;font-size:.8rem;font-weight:720;color:var(--muted)}
.status::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.site-footer{border-top:1px solid var(--line);background:var(--surface);padding-block:var(--space-6) var(--space-4)}
.footer-shell{position:relative}
.footer-grid{display:grid;grid-template-columns:minmax(16rem,1.4fr) repeat(3,minmax(9.5rem,.7fr));gap:var(--space-5);align-items:start}
.footer-intro{min-width:0}
.footer-identity{display:inline-flex;gap:.85rem;align-items:center;color:var(--text);text-decoration:none}
.footer-identity:hover strong{color:var(--accent-strong)}
.footer-brand-logo{flex:0 0 auto;width:3.25rem;height:3.25rem;border-radius:var(--radius-md)}
.footer-identity__copy{display:grid;gap:.18rem;min-width:0}
.footer-identity__copy strong{font-size:1rem;transition:color var(--transition)}
.footer-identity__copy small{color:var(--muted);font-size:.78rem;line-height:1.45}
.footer-statement{max-width:37rem;margin:1.15rem 0 0;color:var(--muted);font-size:.9rem;line-height:1.7}
.footer-title{margin-bottom:.75rem;font-size:1rem}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li + li{margin-top:.5rem}
.footer-links a{color:var(--muted);text-decoration:none;text-underline-offset:.2em}
.footer-links a:hover{color:var(--text);text-decoration:underline}
.footer-rights{display:flex;gap:1.25rem 2rem;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:var(--space-5);padding-top:var(--space-4)}
.footer-rights__copy{display:grid;gap:.2rem;color:var(--muted);font-size:.8rem;line-height:1.55}
.footer-rights__copy p{margin:0}
.footer-work-meta{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;justify-content:flex-end}
.footer-work-status,.footer-work-id{min-height:2.75rem;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.72rem;font-weight:680}
.footer-work-status{display:inline-flex;gap:.45rem;align-items:center;padding:.62rem .85rem}
.footer-work-status>span{width:.48rem;height:.48rem;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.footer-work-id{display:inline-flex;gap:.55rem;align-items:center;max-width:100%;padding:.48rem .7rem .48rem .82rem;cursor:pointer;transition:border-color var(--transition),background var(--transition),color var(--transition)}
.footer-work-id:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}
.footer-work-id.is-copied{border-color:var(--accent);color:var(--accent-strong)}
.footer-work-id__label{color:var(--muted);white-space:nowrap}
.footer-work-id code{max-width:19rem;overflow-wrap:anywhere;color:var(--text);font:inherit;font-weight:760;letter-spacing:.02em}
.footer-work-id svg{flex:0 0 auto;width:1rem;height:1rem;fill:currentColor}
.footer-copy-feedback{min-height:1.25rem;margin:.35rem 0 0;color:var(--accent-strong);font-size:.76rem;font-weight:700}
.breadcrumb{padding-block:1rem;border-bottom:1px solid var(--line)}
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;list-style:none;padding:0;margin:0;font-size:.86rem}
.breadcrumb li+li::before{content:"/";margin-right:.45rem;color:var(--muted)}
.breadcrumb a{color:var(--muted)}
.back-to-top{position:fixed;right:1rem;bottom:1rem;z-index:80;width:2.85rem;height:2.85rem;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--surface);color:var(--text);box-shadow:var(--shadow);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(.5rem);transition:opacity var(--transition),visibility var(--transition),transform var(--transition)}
.back-to-top.is-visible{opacity:1;visibility:visible;transform:none}
.info-band{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--surface)}
.info-band>div{padding:1.1rem}
.info-band>div+div{border-left:1px solid var(--line)}
.info-band dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:760}
.info-band dd{margin-top:.25rem;font-weight:700}
.notice{padding:1rem 1.1rem;border-left:4px solid var(--accent);background:var(--accent-soft);color:var(--text)}
.notice--error{border-color:#b84a44;background:color-mix(in srgb,#b84a44 12%,var(--surface))}
.form-status{display:none;margin-bottom:1rem}
.form-status.is-visible{display:block}
.field{display:grid;gap:.42rem}
.field label{font-weight:710}
.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);padding:.76rem .82rem}
.field textarea{min-height:10rem;resize:vertical}
.field input[aria-invalid=true],.field textarea[aria-invalid=true]{border-color:#b84a44}
.field-error{min-height:1.25rem;color:#a63530;font-size:.84rem}
.check-field{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start}
.check-field input{margin-top:.35rem;width:1.1rem;height:1.1rem}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.form-grid .field--full{grid-column:1/-1}
.honeypot{position:absolute;overflow:hidden;clip:rect(0 0 0 0);height:1px;width:1px;margin:-1px;padding:0;border:0}
.table-wrap{overflow-x:auto;border:1px solid var(--line)}
.data-table{width:100%;min-width:44rem;background:var(--surface)}
.data-table th,.data-table td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
.data-table th{background:var(--surface-2);font-size:.84rem;letter-spacing:.03em}
.data-table tr:last-child td{border-bottom:0}
.mt-08{margin-top:.8rem}
.mt-09{margin-top:.9rem}
.mt-1{margin-top:1rem}
.mt-12{margin-top:1.2rem}
.mt-14{margin-top:1.4rem}
.mt-15{margin-top:1.5rem}
.mt-2{margin-top:2rem}
.mt-25{margin-top:2.5rem}
.mx-auto{margin-inline:auto}
.justify-center{justify-content:center}
.info-band--single{grid-template-columns:1fr}
.release-blocker{margin-bottom:var(--space-5);padding:clamp(1.2rem,3vw,1.8rem);border:2px solid #b06b23;background:color-mix(in srgb,#b06b23 10%,var(--surface))}
.release-blocker code{display:inline-block;max-width:100%;padding:.18rem .35rem;border:1px solid var(--line);background:var(--surface);color:var(--text);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.88rem}
.form-deployment-note{margin-bottom:1rem;padding:.8rem 1rem;border-left:3px solid var(--secondary);background:var(--surface-2);font-size:.9rem}
.personal-social{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-6);align-items:start}
.swatch--black{--swatch:#050505}
.swatch--graphite{--swatch:#121212}
.swatch--gold{--swatch:#c8a45d}
.swatch--red{--swatch:#8c1d18}
.swatch--silver{--swatch:#bfc3c7}
.hero{padding-block:clamp(2.4rem,5vw,5rem);border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.hero h1{max-width:13ch}
.hero .lead{margin-top:1.2rem}
.hero-actions{margin-top:1.7rem}
.hero-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.hero-facts strong{display:block;font-size:.92rem}
.hero-facts span{display:block;color:var(--muted);font-size:.82rem;margin-top:.18rem}
.carousel{position:relative}
.carousel-frame{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius-lg);background:var(--brand-graphite);border:1px solid var(--line);box-shadow:var(--shadow);touch-action:pan-y}
.carousel-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .55s ease}
.carousel-slide:first-child{opacity:1;visibility:visible}
.has-js .carousel-slide.is-active{opacity:1;visibility:visible;z-index:2}
.carousel-slide img,.carousel-slide video{width:100%;height:100%;object-fit:cover}
.carousel-slide video{background:var(--brand-graphite)}
.carousel-control{display:none;position:absolute;top:50%;z-index:5;transform:translateY(-50%);width:2.25rem;height:2.25rem;border-radius:.42rem;background:rgba(10,12,15,.66);color:#fff;cursor:pointer}
.has-js .carousel-control{display:grid;place-items:center}
.carousel-control::before{content:"";position:absolute;inset:-.3rem}
.carousel-control--prev{left:.7rem}
.carousel-control--next{right:.7rem}
.carousel-control svg{width:1rem;height:1rem}
.carousel-control:hover{background:rgba(10,12,15,.88)}
.carousel-meta{display:grid;grid-template-columns:1fr auto;align-items:start;gap:1rem;padding-top:.75rem}
.carousel-caption{color:var(--muted);font-size:.86rem}
.carousel-dots{display:none;align-items:center;gap:.18rem}
.has-js .carousel-dots{display:flex}
.carousel-dot{position:relative;width:1.95rem;height:1.95rem;background:transparent;cursor:pointer}
.carousel-dot::before{content:"";position:absolute;inset:-.35rem}
.carousel-dot::after{content:"";position:absolute;inset:50% auto auto 50%;width:.38rem;height:.38rem;border-radius:50%;background:var(--line);transform:translate(-50%,-50%)}
.carousel-dot[aria-current=true]::after{width:.5rem;height:.5rem;background:var(--accent)}
.practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.practice-item{padding:1.4rem 1.4rem 1.4rem 0}
.practice-item+.practice-item{padding-left:1.4rem;border-left:1px solid var(--line)}
.practice-index{display:block;color:var(--accent-strong);font-size:.75rem;font-weight:800;letter-spacing:.12em}
.practice-item h3{font-size:1.2rem;margin-top:.65rem}
.practice-item p{margin-top:.6rem;color:var(--muted);font-size:.94rem}
.featured-project{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--space-5);align-items:stretch}
.featured-project__media{min-height:27rem}
.featured-project__media img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--line)}
.featured-project__content{display:flex;flex-direction:column;justify-content:center;padding:1rem 0}
.project-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);margin-top:var(--space-5)}
.project-card{border-top:4px solid var(--accent);padding:1.25rem 0}
.project-card:nth-child(even){border-color:var(--secondary)}
.project-card p{color:var(--muted);margin-top:.7rem}
.project-card .tag-list{margin-top:1rem}
.project-card .text-link{margin-top:1.1rem}
.goal-panel{display:grid;grid-template-columns:.7fr 1.3fr;gap:var(--space-6);align-items:start}
.goal-list{counter-reset:goals;list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.goal-list li{counter-increment:goals;display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.goal-list li::before{content:"0" counter(goals);font-size:.82rem;color:var(--accent-strong);font-weight:780}
.cta-band{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);padding:clamp(1.5rem,4vw,2.5rem);background:var(--surface-2);border:1px solid var(--line)}
.about-split{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:var(--space-7)}
.profile-panel{position:sticky;top:7rem;align-self:start;border-top:4px solid var(--accent);padding-top:1.2rem}
.principles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.principle{background:var(--surface);padding:1.2rem}
.principle h3{font-size:1.08rem}
.principle p{font-size:.92rem;color:var(--muted);margin-top:.45rem}
.projects-feature{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(19rem,.88fr);gap:clamp(1.5rem,4vw,3.25rem);align-items:center;padding-bottom:var(--space-6);border-bottom:1px solid var(--line)}
.projects-feature>div:first-child{min-width:0}
.projects-feature picture{display:grid;place-items:center;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--brand-graphite);border:1px solid var(--line);border-radius:var(--radius-md)}
.projects-feature img{width:100%;height:100%;object-fit:contain;padding:clamp(.45rem,1.4vw,1rem)}
.project-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.project-row{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid var(--line);background:var(--surface);transition:border-color .18s ease,transform .18s ease}
.project-row:hover{border-color:color-mix(in srgb,var(--accent) 46%,var(--line));transform:translateY(-2px)}
.project-row>picture{display:grid;place-items:center;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--brand-graphite);border-bottom:1px solid var(--line);align-self:start}
.project-row>picture img{display:block;width:100%;height:100%;object-fit:contain;padding:clamp(.45rem,1.2vw,.9rem);border-radius:0}
.project-row>div:last-child{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:1.25rem 1.25rem 1.35rem}
.project-row h3{font-size:1.3rem;margin-top:.42rem}
.project-row p{color:var(--muted);font-size:.92rem;margin-top:.5rem}
.project-row .tag-list{margin-top:auto!important;padding-top:.95rem}
.project-row:nth-child(3),.project-row--process{grid-column:1/-1;display:grid;grid-template-columns:minmax(20rem,.9fr) minmax(0,1.1fr);align-items:stretch}
.project-row:nth-child(3)>picture{height:100%;min-height:20rem;aspect-ratio:auto;border-right:1px solid var(--line);border-bottom:0}
.project-row--process .process-preview{width:100%;height:100%;min-height:20rem;aspect-ratio:auto;border:0;border-right:1px solid var(--line);border-radius:0}
.project-filter-panel{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:var(--space-4);padding-bottom:1rem;border-bottom:1px solid var(--line)}
.project-filters{display:none;flex-wrap:wrap;gap:.5rem}
.has-js .project-filters{display:flex}
.project-filter-status{display:none;margin:0;color:var(--muted);font-size:.86rem;font-weight:680;white-space:nowrap}
.has-js .project-filter-status{display:block}
.filter-button{min-height:2.75rem;padding:.52rem .8rem;background:var(--surface);border:1px solid var(--line);color:var(--muted);border-radius:var(--radius-sm);cursor:pointer;font-weight:680;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.filter-button:hover{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));color:var(--text)}
.filter-button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}
.project-row[hidden],.project-row.is-filtered-out{display:none!important}
.case-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(20rem,.75fr);gap:var(--space-6);align-items:center}
.case-hero>div:last-child{min-width:0}
.case-hero picture{display:grid;place-items:center;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--brand-graphite);border:1px solid var(--line);border-radius:var(--radius-md)}
.case-hero img{width:100%;height:100%;object-fit:contain;padding:clamp(.45rem,1.2vw,.9rem);border:0;border-radius:0}
.case-layout{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:var(--space-6)}
.case-nav{position:sticky;top:7rem;align-self:start}
.case-nav ol{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.case-nav a{display:block;padding:.55rem 0;border-bottom:1px solid var(--line);color:var(--muted);text-decoration:none;font-size:.86rem}
.case-nav a:hover{color:var(--accent-strong)}
.case-section{scroll-margin-top:7rem;padding-bottom:var(--space-5);border-bottom:1px solid var(--line)}
.case-section+.case-section{padding-top:var(--space-5)}
.case-section h2{font-size:clamp(1.5rem,1.2rem + .8vw,2.15rem)}
.case-section p,.case-section li{color:var(--muted)}
.architecture{display:flex;align-items:stretch;gap:.65rem;overflow-x:auto;padding:1rem 0}
.arch-node{min-width:9rem;display:grid;place-items:center;text-align:center;padding:1rem;border:1px solid var(--line);background:var(--surface);font-size:.86rem;font-weight:720}
.arch-arrow{display:grid;place-items:center;color:var(--accent);font-size:1.25rem}
.tech-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1rem}
.tech-specs div{background:var(--surface);padding:1rem}
.tech-specs dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.tech-specs dd{font-weight:710;margin-top:.28rem}
.timeline{position:relative;margin-left:.7rem;padding-left:2.2rem;border-left:1px solid var(--line)}
.timeline-item{position:relative;padding-bottom:var(--space-5)}
.timeline-item::before{content:"";position:absolute;left:-2.65rem;top:.28rem;width:.85rem;height:.85rem;border-radius:50%;background:var(--surface);border:3px solid var(--accent)}
.timeline-label{font-size:.78rem;font-weight:780;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong)}
.timeline-item h2{font-size:1.5rem;margin-top:.4rem}
.timeline-item p{color:var(--muted);margin-top:.65rem}
.experience-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.2rem}
.experience-facts div{padding:.85rem;border-left:2px solid var(--line)}
.knowledge-section{display:grid;grid-template-columns:minmax(13rem,.45fr) minmax(0,1.55fr);gap:var(--space-5);padding-block:var(--space-5);border-bottom:1px solid var(--line)}
.knowledge-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.knowledge-item{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;padding:.75rem 0;border-bottom:1px solid var(--line)}
.knowledge-item strong{font-size:.95rem}
.level{font-size:.76rem;color:var(--muted);white-space:nowrap}
.cv-sheet{background:var(--surface);border:1px solid var(--line);padding:clamp(1.3rem,4vw,3rem);box-shadow:var(--shadow)}
.cv-head{display:grid;grid-template-columns:minmax(0,1fr) 6.5rem minmax(13rem,.58fr);gap:var(--space-4);align-items:center;padding-bottom:var(--space-5);border-bottom:2px solid var(--text)}
.cv-title{font-size:clamp(2rem,4vw,3.5rem)}
.cv-contact{justify-self:end;text-align:right;color:var(--muted)}
.cv-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:var(--space-6);padding-top:var(--space-5)}
.cv-section+.cv-section{margin-top:var(--space-5)}
.cv-section h2{font-size:1rem;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--line);padding-bottom:.45rem;margin-bottom:.8rem}
.cv-entry{display:grid;grid-template-columns:9rem 1fr;gap:1rem;padding:.65rem 0}
.cv-entry dt{color:var(--muted);font-size:.86rem}
.contact-layout{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:var(--space-6)}
.contact-aside{border-top:4px solid var(--accent);padding-top:1rem}
.contact-method{padding:1rem 0;border-bottom:1px solid var(--line)}
.legal-layout{display:grid;grid-template-columns:minmax(12rem,.4fr) minmax(0,1.6fr);gap:var(--space-6)}
.legal-nav{position:sticky;top:7rem;align-self:start}
.legal-content section+section{margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--line)}
.error-page{min-height:70vh;display:grid;place-items:center;text-align:center}
.error-code{font-size:clamp(5rem,18vw,12rem);line-height:.8;color:var(--surface-3);font-weight:800;letter-spacing:-.08em}
.error-content{margin-top:-1rem}
.reveal,.has-js .reveal,.has-js .reveal.is-visible{opacity:1;transform:none}
.contact-aside>h2{font-size:var(--step-2)}
.profile-link{margin-top:1.15rem;font-size:.92rem}
.profile-link a{text-underline-offset:.2em}
.personal-note__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.5rem,5vw,5rem);align-items:start}
.personal-note__grid p{max-width:62ch}
.verified-practice-section{border-bottom:1px solid var(--line)}
.verified-practice-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-5);align-items:end;margin-bottom:var(--space-4)}
.verified-practice-head p{max-width:64ch;color:var(--muted)}
.verified-practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.verified-practice-grid article{padding:1.35rem 1.35rem 1.35rem 0}
.verified-practice-grid article+article{padding-left:1.35rem;border-left:1px solid var(--line)}
.verified-practice-grid h3{font-size:1.15rem;margin-top:.55rem}
.verified-practice-grid p{color:var(--muted);font-size:.92rem;margin-top:.55rem}
.verified-practice-link{margin-top:1.2rem}
.profile-facts{display:grid;gap:.75rem;margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.profile-facts div{display:grid;grid-template-columns:5rem 1fr;gap:.75rem}
.profile-facts dt{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;font-weight:760}
.profile-facts dd{font-size:.92rem;font-weight:650}
.about-copy section+section{padding-top:var(--space-5);border-top:1px solid var(--line)}
.experience-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr);gap:var(--space-6);align-items:start}
.experience-company{font-weight:720;color:var(--text)!important;margin-top:.25rem!important}
.experience-detail-list{margin-top:.8rem;padding-left:1.15rem;color:var(--muted)}
.experience-detail-list li+li{margin-top:.45rem}
.experience-aside{position:sticky;top:7rem;display:grid;gap:1.5rem}
.experience-aside picture,.experience-aside img{display:block;width:100%}
.experience-aside img{aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line);border-radius:var(--radius-md)}
.process-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:.6rem;margin-top:1.1rem}
.process-flow div{min-width:0;padding:.8rem;border:1px solid var(--line);background:var(--surface)}
.process-flow span{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}
.process-flow strong{display:block;font-size:.88rem;margin-top:.2rem}
.process-flow b{color:var(--accent);font-weight:800}
.cv-actions{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}
.process-preview{position:relative;width:100%;aspect-ratio:16/10;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-2);overflow:hidden}
.process-preview span{position:absolute;height:.62rem;border:1px solid var(--accent);border-radius:999px;background:var(--surface)}
.process-preview span:nth-child(1){top:23%;left:18%;right:18%}
.process-preview span:nth-child(2){top:45%;left:28%;right:10%}
.process-preview span:nth-child(3){top:67%;left:10%;right:28%}
.process-preview i,.process-preview b{position:absolute;display:block;background:var(--accent)}
.process-preview i{width:2px;top:29%;bottom:18%;left:50%}
.process-preview b{width:.68rem;height:.68rem;border-radius:50%;left:calc(50% - .34rem);bottom:10%}
.work-system{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:2rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.work-system article{position:relative;padding:1.25rem 1.05rem 1.35rem 0;min-width:0}
.work-system article+article{padding-left:1.05rem;border-left:1px solid var(--line)}
.work-system span{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:1.5rem;padding:0 .45rem;border:1px solid color-mix(in srgb,var(--accent) 46%,var(--line));color:var(--accent-strong);font-size:.7rem;font-weight:800;letter-spacing:.08em}
.work-system h3{font-size:1rem;margin-top:.7rem}
.work-system p{margin-top:.45rem;color:var(--muted);font-size:.86rem;line-height:1.55}
.work-system--compact{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1.3rem}
.work-system--compact article:nth-child(odd){padding-left:0;border-left:0}
.work-system--compact article:nth-child(n+3){border-top:1px solid var(--line)}
.work-system--compact article:last-child{grid-column:1/-1;padding-left:0;border-left:0}
.documentation-standard .section-heading{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--space-5);align-items:end}
.documentation-standard .section-heading p{max-width:62ch;color:var(--muted)}
.knowledge-section--curriculum{background:var(--surface-2);padding:var(--space-4);border:1px solid var(--line)}
.knowledge-note{max-width:34ch;color:var(--muted);font-size:.9rem;margin-top:.8rem}
.knowledge-section--curriculum h2{font-size:clamp(1.55rem,2.7vw,2.35rem);overflow-wrap:normal;word-break:normal;hyphens:auto}
.project-disclaimer{margin-top:1.25rem;padding:1rem 1.1rem;border-left:3px solid var(--accent);background:var(--surface);color:var(--muted)}
.project-disclaimer strong{color:var(--text)}
.project-goals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:1.25rem;background:var(--line);border:1px solid var(--line)}
.project-goals article{display:grid;gap:.35rem;padding:1rem;background:var(--surface)}
.project-goals span{color:var(--muted);font-size:.9rem}
.design-system-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin-top:1.25rem;background:var(--line);border:1px solid var(--line)}
.design-system-strip div{display:grid;gap:.35rem;padding:.75rem;background:var(--surface)}
.design-system-strip span{display:block;height:2.5rem;background:var(--swatch);border:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
.design-system-strip strong{font-size:.86rem}
.design-system-strip small{color:var(--muted)}
.feature-list{display:grid;gap:.65rem;margin-top:1rem;padding:0;list-style:none}
.feature-list li{padding:.8rem 0;border-bottom:1px solid var(--line)}
.feature-list strong{color:var(--text)}
.role-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.25rem}
.role-split article{padding:1.1rem;border:1px solid var(--line);background:var(--surface)}
.role-split h3{font-size:1.05rem}
.role-split ul{margin-top:.65rem;padding-left:1.2rem;color:var(--muted)}
.project-flow{display:flex;align-items:center;gap:.55rem;overflow-x:auto;padding:1rem 0;margin-top:.75rem}
.project-flow span{min-width:10rem;padding:.8rem;border:1px solid var(--line);background:var(--surface);text-align:center;font-size:.85rem;font-weight:700}
.project-flow i{color:var(--accent);font-style:normal}
.quality-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:1.25rem;background:var(--line);border:1px solid var(--line)}
.quality-facts div{display:grid;gap:.35rem;padding:1.1rem;background:var(--surface)}
.quality-facts strong{font-size:clamp(1.4rem,2.2vw,2rem);color:var(--accent-strong)}
.quality-facts span{color:var(--muted);font-size:.85rem}
.concrete-project-callout{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;margin-top:1.25rem;padding:1rem;border:1px solid var(--line);background:var(--surface)}
.concrete-project-callout h3{margin-top:.35rem;font-size:1.2rem}
.concrete-project-callout p{margin-top:.4rem}
.project-external-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.25rem}
.project-live-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
.project-live-panel{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);gap:clamp(1.5rem,5vw,4rem);align-items:start}
.project-live-copy h2{margin-top:.7rem;max-width:19ch}
.project-live-copy p{max-width:68ch;margin-top:.85rem}
.project-live-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.project-live-facts div{min-width:0;padding:1rem;background:var(--surface)}
.project-live-facts dt{font-size:.72rem;font-weight:780;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.project-live-facts dd{margin-top:.3rem;font-weight:720;overflow-wrap:anywhere}
.project-card-actions{display:flex;flex-wrap:wrap;gap:.8rem 1.2rem;align-items:center;margin-top:1rem}
.text-link--external::after{content:"↗"}
.text-link--external:hover::after{transform:translate(.12rem,-.12rem)}
.legal-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:1.2rem;border:1px solid var(--line);background:var(--line)}
.legal-project-grid article{padding:1rem;background:var(--surface)}
.legal-project-grid h3{font-size:1rem}
.legal-project-grid p{margin-top:.45rem;font-size:.9rem}
.project-legal-links{display:flex;flex-wrap:wrap;gap:.8rem 1.3rem;margin-top:1.2rem}
.profile-photo{position:relative;width:min(100%,19rem);margin:0 0 1.5rem;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.profile-photo picture{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--surface-2)}
.profile-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.profile-photo figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;padding:.8rem .9rem;border-top:1px solid var(--line);background:var(--surface)}
.profile-photo figcaption span{font-size:.92rem;font-weight:760;color:var(--text)}
.profile-photo figcaption small{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cv-portrait{display:block;width:6rem;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--line);background:var(--surface-2);justify-self:center}
.cv-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.evidence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:1.25rem;border:1px solid var(--line);background:var(--line)}
.evidence-grid article{display:grid;gap:.35rem;padding:1rem;background:var(--surface)}
.evidence-grid strong{font-size:.92rem}
.evidence-grid span{color:var(--muted);font-size:.86rem}
.formula-panel{display:grid;gap:.55rem;margin-top:1.25rem;padding:1rem 1.1rem;border:1px solid var(--line);background:var(--surface-2)}
.formula-panel span{font-size:.75rem;font-weight:780;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.formula-panel code{display:block;font-size:clamp(1rem,2vw,1.25rem);color:var(--accent-strong);overflow-wrap:anywhere}
.code-sample{margin-top:1.25rem;border:1px solid var(--line);background:var(--brand-carbon);color:var(--brand-paper);overflow:hidden}
.code-sample__head{display:flex;justify-content:space-between;gap:1rem;padding:.65rem .85rem;border-bottom:1px solid var(--brand-steel);color:#a7aeb7;font-size:.78rem}
.code-sample pre{margin:0;padding:1rem;overflow:auto;tab-size:4;font:500 .86rem/1.65 ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace}
.code-sample code{color:inherit;white-space:pre}
.curriculum-detail-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:1.5rem;border:1px solid var(--line);background:var(--line)}
.curriculum-detail-grid>article{padding:1.2rem;background:var(--surface)}
.curriculum-detail-grid h3{font-size:1.25rem;margin-bottom:.8rem}
.skill-detail-list{display:grid;gap:0;margin-bottom:1rem}
.skill-detail-list div{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-bottom:1px solid var(--line)}
.skill-detail-list dt{font-weight:680}
.skill-detail-list dd{color:var(--muted);font-size:.86rem;text-align:right}
.school-project-links{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(15rem,.9fr);gap:var(--space-4);align-items:center;margin-top:1.25rem;padding:1.1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.school-project-links h3{font-size:1.2rem;margin-top:.35rem}
.school-project-links>div:last-child{display:flex;flex-wrap:wrap;gap:.8rem 1.3rem;justify-content:flex-end}
.case-hero h1{overflow-wrap:normal;word-break:normal;hyphens:auto}
.school-achievement-note,.performance-note,.cv-proof-note{max-width:75ch}
.performance-note{margin-top:1rem;padding:.85rem 1rem;border-left:3px solid var(--accent);background:var(--surface-2);color:var(--muted)}
.project-row--process>picture{height:100%;min-height:20rem;aspect-ratio:auto;border-right:1px solid var(--line);border-bottom:0}
@media (max-width:760px){.project-row--process>picture{min-height:0;aspect-ratio:16/10;border-right:0;border-bottom:1px solid var(--line)}
}
.case-layout>*{min-width:0}
.case-section{min-width:0}
.architecture{max-width:100%;min-width:0}
.section-heading{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-5);align-items:end;margin-bottom:var(--space-5)}
.section-heading .lead{justify-self:end}
.core-skills{border-bottom:1px solid var(--line);background:var(--surface)}
.core-skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);background:var(--line);gap:1px}
.core-skill{display:grid;grid-template-columns:auto 1fr;gap:.55rem 1rem;min-height:8.5rem;padding:1.15rem;background:var(--surface);color:var(--text);text-decoration:none;transition:background-color var(--transition),color var(--transition)}
.core-skill:hover{background:var(--surface-2);color:var(--text)}
.core-skill__index{grid-row:1 / span 2;color:var(--accent-strong);font-size:.75rem;font-weight:800;letter-spacing:.12em}
.core-skill strong{align-self:end;font-size:1rem}
.core-skill>span:last-child{color:var(--muted);font-size:.82rem}
.knowledge-section{scroll-margin-top:6.5rem}
.knowledge-section>div:first-child{min-width:15.5rem}
.knowledge-section h2{max-width:20ch;overflow-wrap:normal;word-break:normal;hyphens:auto}
.carousel-accessibility-controls{display:flex;justify-content:flex-end;align-items:center;min-width:max-content}
.carousel-autoplay-toggle{display:inline-flex;align-items:center;gap:.45rem;min-height:2.75rem;padding:.42rem .7rem;border:1px solid transparent;border-radius:var(--radius-sm);background:transparent;color:var(--muted);cursor:pointer;font-size:.78rem;font-weight:700}
.carousel-autoplay-toggle:hover,.carousel-autoplay-toggle:focus-visible{border-color:var(--line);background:var(--surface-2);color:var(--text)}
.carousel-autoplay-toggle__icon{display:inline-grid;place-items:center;width:1.25rem;height:1.25rem;font-size:.72rem;line-height:1}
.carousel-autoplay-toggle[aria-pressed="true"] .carousel-autoplay-toggle__icon::before{content:"▶"}
.carousel-autoplay-toggle[aria-pressed="true"] .carousel-autoplay-toggle__icon{font-size:0}
.project-row>picture,.projects-feature picture,.case-hero picture{background:radial-gradient(circle at 50% 45%,rgba(184,149,82,.10),transparent 56%),var(--brand-carbon)}
.project-row>picture img,.projects-feature img,.case-hero img{padding:0;object-fit:cover}
.project-row>div:last-child{gap:.25rem}
.project-row .tag-list{margin-top:.8rem !important;padding-top:0}
.project-card-link{margin-top:auto;align-self:stretch}
.project-summary{min-height:3.1em}
.project-legal-notice{border-bottom:1px solid var(--line)}
.practice-item h2{margin-top:.65rem;font-size:1.2rem;line-height:1.25}
.brand-system-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:1.25rem;border:1px solid var(--line);background:var(--line)}
.brand-system-summary>div{display:grid;gap:.35rem;min-width:0;padding:1rem;background:var(--surface)}
.brand-system-summary strong{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong)}
.brand-system-summary span{color:var(--muted);font-size:.88rem;line-height:1.55}
.brand-system-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(17rem,.78fr);gap:1rem 1.5rem;margin-top:1.4rem;padding:clamp(1.1rem,3vw,1.65rem);border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--surface)}
.brand-system-panel h3{margin-top:.45rem;font-size:1.28rem}
.brand-system-panel p{margin-top:.55rem;color:var(--muted)}
.brand-system-panel>.button{grid-column:1 / -1;justify-self:start}
.brand-system-facts{display:grid;gap:.65rem;margin:0}
.brand-system-facts>div{display:grid;grid-template-columns:minmax(7rem,.42fr) minmax(0,1fr);gap:.75rem;padding-bottom:.65rem;border-bottom:1px solid var(--line)}
.brand-system-facts dt{color:var(--muted);font-size:.8rem;font-weight:700}
.brand-system-facts dd{margin:0;font-size:.88rem}
.knowledge-disclosure{display:grid;grid-template-columns:minmax(15.5rem,.45fr) minmax(0,1.55fr);gap:var(--space-5);padding-block:var(--space-5);border-bottom:1px solid var(--line);scroll-margin-top:6.5rem}
.knowledge-disclosure__summary{position:relative;display:grid;align-content:start;gap:.55rem;min-width:0;list-style:none;cursor:pointer}
.knowledge-disclosure__summary::-webkit-details-marker{display:none}
.knowledge-disclosure__summary::before{content:"Bereich";color:var(--accent-strong);font-size:.74rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.knowledge-disclosure__summary h2{max-width:20ch;margin:0;overflow-wrap:normal;word-break:normal;hyphens:auto}
.knowledge-disclosure__body{min-width:0}
.knowledge-disclosure__indicator{display:none}
.footer-grid--compact{grid-template-columns:minmax(18rem,1.5fr) minmax(10rem,.7fr) minmax(13rem,.8fr)}
.footer-grid--compact .footer-intro{max-width:38rem}
.footer-work-meta{flex-wrap:nowrap}
.footer-work-id__label{font-weight:760}
@media (max-width:1080px){.site-nav a{padding:.5rem .48rem;font-size:.88rem}
.hero-grid,.case-hero{grid-template-columns:1fr}
.hero h1{max-width:17ch}
.hero-grid{gap:2.2rem}
.featured-project{grid-template-columns:1fr}
.featured-project__media{min-height:auto}
.featured-project__media img{aspect-ratio:16 / 10}
.page-intro__grid{grid-template-columns:1fr}
.page-intro__meta{max-width:42rem}
.about-split,.case-layout,.contact-layout,.legal-layout{grid-template-columns:1fr}
.profile-panel,.case-nav,.legal-nav{position:static}
.case-nav ol{display:grid;grid-template-columns:repeat(2,1fr)}
.case-nav a{padding-right:1rem}
.knowledge-section{grid-template-columns:1fr}
.cv-grid{grid-template-columns:1fr}
.experience-layout{grid-template-columns:1fr}
.experience-aside{position:static;grid-template-columns:minmax(15rem,.7fr) minmax(0,1.3fr);align-items:start}
}
@media (max-width:1080px){.project-list{grid-template-columns:1fr}
.project-row,.project-row:nth-child(3),.project-row--process{grid-column:auto;display:grid;grid-template-columns:minmax(16rem,.82fr) minmax(0,1.18fr);align-items:stretch}
.project-row>picture,.project-row:nth-child(3)>picture{height:100%;min-height:17rem;aspect-ratio:auto;border-right:1px solid var(--line);border-bottom:0}
.project-row--process .process-preview{min-height:17rem}
}
@media (max-width:860px){.project-filter-panel{align-items:flex-start;flex-direction:column;gap:.65rem}
.project-filter-status{white-space:normal}
.project-row,.project-row:nth-child(3),.project-row--process{display:flex;flex-direction:column}
.project-row>picture,.project-row:nth-child(3)>picture{width:100%;height:auto;min-height:0;aspect-ratio:16 / 10;border-right:0;border-bottom:1px solid var(--line)}
.project-row--process .process-preview{width:100%;height:auto;min-height:0;aspect-ratio:16 / 10;border-right:0;border-bottom:1px solid var(--line)}
.site-nav-nojs{display:block;order:3;width:100%;padding:.5rem 0 .75rem}
.site-nav-nojs ul{display:flex;flex-wrap:wrap;gap:.25rem;margin:0;padding:0;list-style:none}
.site-nav-nojs a{display:block;padding:.55rem .65rem;color:var(--text);text-decoration:none;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface)}
.has-js .nav-toggle{display:grid}
html:not(.has-js) .header-inner{align-items:flex-start;flex-wrap:wrap;padding-block:.6rem}
html:not(.has-js) .site-nav{order:3;width:100%}
html:not(.has-js) .site-nav ul{flex-wrap:wrap;align-items:flex-start}
html:not(.has-js) .site-nav a{padding:.45rem .55rem}
.has-js .site-nav{position:fixed;inset:4.75rem 0 auto;max-height:calc(100dvh - 4.75rem);overflow:auto;padding:1rem;background:var(--bg);border-bottom:1px solid var(--line);transform:translateY(-120%);visibility:hidden;transition:transform 220ms ease,visibility 220ms ease}
.has-js .site-nav.is-open{transform:none;visibility:visible}
.has-js .site-nav ul{display:grid;width:min(100%,42rem);margin-inline:auto;gap:.2rem}
.has-js .site-nav a{padding:.82rem;border:1px solid transparent;border-bottom:1px solid var(--line);font-size:1rem}
.has-js .site-nav a[aria-current="page"]{border-left:4px solid var(--accent);border-bottom-color:var(--line);background:var(--surface)}
.hero-facts,.practice-grid,.info-band{grid-template-columns:1fr}
.practice-grid{border:0}
.practice-item,.practice-item + .practice-item{padding:1rem 0;border-left:0;border-bottom:1px solid var(--line)}
.info-band>div + div{border-top:1px solid var(--line);border-left:0}
.grid--3{grid-template-columns:repeat(2,1fr)}
.goal-panel{grid-template-columns:1fr}
.project-pair,.projects-feature{grid-template-columns:1fr}
.experience-facts{grid-template-columns:1fr 1fr}
.cv-head{grid-template-columns:1fr}
.cv-contact{justify-self:start;text-align:left}
.carousel-frame{aspect-ratio:4 / 3}
.verified-practice-head,.verified-practice-grid,.process-flow,.experience-aside,.personal-note__grid{grid-template-columns:1fr}
.personal-note__grid{gap:1rem}
.verified-practice-grid article,.verified-practice-grid article + article{padding:1rem 0;border-left:0;border-bottom:1px solid var(--line)}
.verified-practice-grid article:last-child{border-bottom:0}
.process-flow b{justify-self:center;transform:rotate(90deg)}
}
@media (max-width:620px){.container{width:min(calc(100% - 1.25rem),var(--content))}
.section{padding-block:3.5rem}
.section--compact{padding-block:2.5rem}
.header-inner{min-height:4.25rem}
.has-js .site-nav{inset:4.25rem 0 auto;max-height:calc(100dvh - 4.25rem)}
.brand-copy small{display:none}
.hero{padding-block:2.2rem}
.hero-actions{display:grid}
.hero-actions .button{width:100%}
.hero-facts{grid-template-columns:1fr 1fr}
.hero-facts>div:last-child{grid-column:1 / -1}
.grid--2,.grid--3,.principles,.knowledge-list,.form-grid,.tech-specs{grid-template-columns:1fr}
.featured-project__content{padding:0}
.project-row h3{font-size:1.15rem}
.cta-band{flex-direction:column;align-items:flex-start}
.case-nav ol{grid-template-columns:1fr}
.architecture{align-items:center}
.arch-node{min-width:8rem}
.experience-facts,.knowledge-item,.cv-entry{grid-template-columns:1fr}
.knowledge-item,.cv-entry{gap:.2rem}
.level{white-space:normal}
.cv-sheet{padding:1rem}
.contact-layout{gap:2rem}
.carousel-control{width:2rem;height:2rem}
.carousel-control--prev{left:.45rem}
.carousel-control--next{right:.45rem}
.carousel-meta{grid-template-columns:1fr}
.carousel-dots{justify-content:center}
.page-intro{padding-block:2.7rem}
.error-code{font-size:6rem}
.cv-actions{display:grid}
.cv-actions .button{width:100%}
.profile-facts div{grid-template-columns:1fr;gap:.15rem}
}
@media (max-width:360px){.hero-facts{grid-template-columns:1fr}
.hero-facts>div:last-child{grid-column:auto}
.icon-button,.nav-toggle{width:2.55rem;height:2.55rem}
.brand{gap:.55rem}
.brand-logo{width:1.75rem;height:1.75rem}
.carousel-control{top:auto;bottom:.45rem;transform:none}
.carousel-caption{font-size:.8rem}
}
@media (max-width:760px){.brand-system-summary{grid-template-columns:1fr}
.brand-system-panel{grid-template-columns:1fr}
.brand-system-panel>.button{width:100%}
}
@media (max-width:430px){.brand-system-facts>div{grid-template-columns:1fr;gap:.2rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
.has-js .reveal{opacity:1;transform:none}
.carousel-slide{transition:none}
}
@media (max-width:1080px){.work-system{grid-template-columns:repeat(3,minmax(0,1fr))}
.work-system article:nth-child(4){padding-left:0;border-left:0}
.work-system article:nth-child(n+4){border-top:1px solid var(--line)}
.work-system article:nth-child(5){grid-column:span 2}
.documentation-standard .section-heading{grid-template-columns:1fr}
}
@media (max-width:720px){.work-system,.work-system--compact{grid-template-columns:minmax(0,1fr)}
.work-system article,.work-system article+article,.work-system article:nth-child(5),.work-system--compact article,.work-system--compact article:nth-child(odd),.work-system--compact article:last-child{grid-column:auto;padding:1rem 0;border-left:0;border-top:1px solid var(--line);min-width:0}
.work-system article:first-child,.work-system--compact article:first-child{border-top:0}
.knowledge-section--curriculum{padding:1.15rem}
}
@media (max-width:900px){.design-system-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
.quality-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:680px){.project-goals,.role-split,.design-system-strip,.quality-facts{grid-template-columns:1fr}
.concrete-project-callout{align-items:flex-start;flex-direction:column}
.concrete-project-callout .button{width:100%}
}
@media (max-width:820px){.project-live-panel{grid-template-columns:1fr}
.project-live-facts{max-width:none}
}
@media (max-width:560px){.project-external-actions{display:grid;grid-template-columns:1fr}
.project-external-actions .button{width:100%}
.project-live-facts,.legal-project-grid{grid-template-columns:1fr}
.project-card-actions{align-items:flex-start;flex-direction:column;gap:.65rem}
}
@media (max-width:860px){.cv-portrait{justify-self:start;width:5.5rem}
.profile-photo{width:min(100%,18rem)}
}
@media (max-width:620px){.profile-photo{width:min(100%,16rem)}
.profile-photo figcaption{align-items:flex-start;flex-direction:column;gap:.2rem}
}
@media(max-width:760px){.evidence-grid,.curriculum-detail-grid{grid-template-columns:1fr}
.school-project-links{grid-template-columns:1fr}
.school-project-links>div:last-child{justify-content:flex-start}
.skill-detail-list div{display:grid;gap:.15rem}
.skill-detail-list dd{text-align:left}
}
@media (max-width:760px){.architecture{flex-direction:column;overflow:visible;align-items:stretch}
.arch-node{min-width:0;width:100%}
.arch-arrow{transform:rotate(90deg);align-self:center}
}
@media (max-width:760px){.case-hero h1{overflow-wrap:anywhere;word-break:normal;hyphens:auto}
}
@media (max-width:960px){.core-skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.section-heading{grid-template-columns:1fr}
.section-heading .lead{justify-self:start}
.personal-social{grid-template-columns:1fr;gap:var(--space-4)}
}
@media (max-width:620px){.core-skills-grid{grid-template-columns:1fr}
.core-skill{min-height:auto}
.knowledge-section>div:first-child{min-width:0}
.knowledge-section h2{max-width:none}
.carousel-meta{grid-template-columns:1fr;gap:.35rem}
.carousel-accessibility-controls{justify-content:flex-start}
.project-filter-panel{align-items:flex-start;flex-direction:column}
.project-filters{width:100%;flex-wrap:nowrap;overflow-x:auto;padding-bottom:.35rem;scroll-snap-type:x proximity}
.filter-button{flex:0 0 auto;scroll-snap-align:start;min-height:2.75rem}
.project-row>picture,.project-row:nth-child(3)>picture,.project-row--process>picture,.project-row--process .process-preview{aspect-ratio:16 / 7;min-height:0}
.project-row>div:last-child{padding:1rem}
.project-summary{display:-webkit-box;min-height:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}
.project-row .tag-list{max-height:2.15rem;overflow:hidden}
.project-card-link{width:100%;margin-top:.85rem}
}
@media (max-width:390px){.project-row>picture,.project-row:nth-child(3)>picture,.project-row--process>picture,.project-row--process .process-preview{aspect-ratio:16 / 6.5}
}
@media (max-width:360px){h1{font-size:clamp(2rem,10vw,2.25rem)}
h2{font-size:clamp(1.45rem,7.5vw,1.7rem)}
.knowledge-section h2,.knowledge-section--curriculum h2{font-size:clamp(1.42rem,7.2vw,1.62rem)}
}
@media (min-width:721px){.knowledge-disclosure__summary{cursor:default;pointer-events:none}
}
@media (max-width:900px){.footer-grid--compact{grid-template-columns:minmax(0,1.35fr) minmax(10rem,.65fr)}
.footer-grid--compact>div:last-child{grid-column:2}
}
@media (max-width:720px){.knowledge-disclosure{display:block;padding-block:0}
.knowledge-disclosure__summary{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.45rem 1rem;min-height:4.75rem;padding:1rem 0}
.knowledge-disclosure__summary::before{grid-column:1}
.knowledge-disclosure__summary h2{grid-column:1;max-width:none;font-size:clamp(1.35rem,6vw,1.65rem)}
.knowledge-disclosure__indicator{grid-column:2;grid-row:1 / span 2;display:block;width:.8rem;height:.8rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;color:var(--accent-strong);transform:rotate(45deg) translateY(-.12rem);transition:transform var(--transition)}
.knowledge-disclosure[open] .knowledge-disclosure__indicator{transform:rotate(225deg) translate(-.08rem,-.05rem)}
.knowledge-disclosure__body{padding-bottom:var(--space-4)}
.footer-grid--compact{grid-template-columns:1fr 1fr}
.footer-grid--compact>.footer-intro{grid-column:1 / -1}
.footer-grid--compact>div:last-child{grid-column:auto}
.footer-rights{flex-direction:column;align-items:flex-start}
.footer-work-meta{width:100%;flex-wrap:wrap;justify-content:flex-start}
}
@media (max-width:480px){.footer-grid--compact{grid-template-columns:1fr}
.footer-grid--compact>.footer-intro,.footer-grid--compact>div:last-child{grid-column:1}
.footer-work-id{width:100%;border-radius:var(--radius-sm);justify-content:flex-start}
}
/* Portfolio release 3.0: internship documentation */
.site-nav a.nav-featured{color:var(--text);background:var(--accent-soft);border-radius:999px;padding-inline:.78rem}
.site-nav a.nav-featured:hover{background:color-mix(in srgb,var(--accent-soft) 72%,var(--surface));color:var(--accent-strong)}
.site-nav a.nav-featured[aria-current=page]{border-color:var(--accent)}
.internship-hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(3.6rem,8vw,7.4rem);border-bottom:1px solid var(--line);background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 92%,var(--accent-soft)),var(--bg) 55%,color-mix(in srgb,var(--surface-2) 86%,var(--secondary)))}
.internship-hero::before,.internship-hero::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(.2px);pointer-events:none}
.internship-hero::before{width:34rem;height:34rem;right:-15rem;top:-20rem;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 22%,transparent),transparent 68%)}
.internship-hero::after{width:28rem;height:28rem;left:-18rem;bottom:-21rem;background:radial-gradient(circle,color-mix(in srgb,var(--secondary) 18%,transparent),transparent 70%)}
.internship-hero__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(19rem,.8fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.internship-hero__copy h1{max-width:12ch;font-size:clamp(2.8rem,5.8vw,5.8rem);letter-spacing:-.055em;line-height:.98}
.internship-hero__copy .lead{margin-top:1.45rem;max-width:59ch}
.internship-document-id{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin-top:1.45rem;color:var(--muted);font-size:.8rem}
.internship-document-id span{font-weight:760;letter-spacing:.08em;text-transform:uppercase}
.internship-document-id code{padding:.25rem .48rem;border:1px solid var(--line);border-radius:.4rem;background:var(--surface);color:var(--text);font-size:.78rem}
.internship-hero__panel{position:relative;padding:clamp(1.4rem,3vw,2rem);border:1px solid color-mix(in srgb,var(--line) 72%,var(--accent));border-radius:var(--radius-xl);background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.status--complete{display:inline-flex;align-items:center;gap:.5rem;background:#e4f3e9;color:#1b6334;border-color:#8dc7a0}
:root[data-theme=dark] .status--complete{background:#142c1d;color:#9ad7ae;border-color:#315d40}
.status--complete::before{content:"";width:.48rem;height:.48rem;border-radius:50%;background:currentColor;box-shadow:0 0 0 .22rem color-mix(in srgb,currentColor 16%,transparent)}
.internship-facts{display:grid;margin-top:1.25rem}
.internship-facts div{display:grid;grid-template-columns:7.1rem 1fr;gap:1rem;padding:.78rem 0;border-top:1px solid var(--line)}
.internship-facts div:first-child{border-top:0}
.internship-facts dt{color:var(--muted);font-size:.76rem;font-weight:760;letter-spacing:.075em;text-transform:uppercase}
.internship-facts dd{margin:0;font-weight:700;line-height:1.45}
.internship-jump{padding-block:1.2rem;background:var(--surface);border-bottom:1px solid var(--line)}
.internship-jump ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem;margin:0;padding:0;list-style:none}
.internship-jump a{display:flex;align-items:center;gap:.58rem;min-height:2.8rem;padding:.55rem .68rem;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--muted);text-decoration:none;font-size:.9rem;font-weight:680}
.internship-jump a:hover{border-color:var(--line);background:var(--surface-2);color:var(--text)}
.internship-jump a span{color:var(--accent-strong);font-size:.72rem;font-weight:800;letter-spacing:.08em}
.internship-heading{align-items:end}
.internship-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:2.5rem}
.internship-kpis article{display:flex;flex-direction:column;min-height:12rem;padding:1.45rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(145deg,var(--surface),var(--surface-2));box-shadow:0 8px 26px rgba(10,12,15,.055)}
.internship-kpis strong{color:var(--accent-strong);font-size:clamp(2.5rem,4vw,4.2rem);font-weight:790;letter-spacing:-.06em;line-height:1}
.internship-kpis span{margin-top:auto;font-size:1.05rem;font-weight:740}
.internship-kpis small{margin-top:.22rem;color:var(--muted);line-height:1.45}
.practice-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem}
.practice-principles article{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:1.3rem;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.practice-principles article>span{display:grid;place-items:center;align-self:start;width:2.35rem;height:2.35rem;border-radius:50%;background:var(--accent-soft);color:var(--accent-strong);font-size:.76rem;font-weight:800}
.practice-principles h3{font-size:1.08rem;letter-spacing:-.01em}
.practice-principles p{margin-top:.35rem;color:var(--muted);font-size:.92rem;line-height:1.58}
.internship-weeks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:2.5rem}
.week-card{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:26rem;padding:clamp(1.4rem,3vw,2rem);border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);box-shadow:0 12px 32px rgba(10,12,15,.06)}
.week-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(var(--accent),var(--secondary))}
.week-card__head{display:flex;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line);color:var(--muted);font-size:.78rem;font-weight:700}
.week-card__head span{color:var(--accent-strong);letter-spacing:.09em;text-transform:uppercase}
.week-card h3{margin-top:1.35rem;font-size:clamp(1.55rem,2.2vw,2.15rem)}
.week-card>p{margin-top:.9rem;color:var(--muted)}
.week-card .tag-list{margin-top:1.2rem}
.week-card .week-card__result{margin-top:auto;padding-top:1.15rem;color:var(--text);font-size:.93rem}
.competency-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2.4rem}
.competency-grid article{min-height:14rem;padding:1.45rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition)}
.competency-grid article:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 65%,var(--line));box-shadow:var(--shadow)}
.competency-index{display:block;color:var(--accent-strong);font-size:.74rem;font-weight:780;letter-spacing:.08em;text-transform:uppercase}
.competency-grid h3{margin-top:.85rem;font-size:1.35rem}
.competency-grid p{margin-top:.75rem;color:var(--muted)}
.final-day-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(19rem,.75fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.final-day-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin-top:2rem}
.final-day-list article{padding:1.1rem 1.15rem;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.final-day-list strong{display:block;color:var(--accent-strong);font-size:.78rem;letter-spacing:.055em;text-transform:uppercase}
.final-day-list p{margin-top:.42rem;color:var(--muted);font-size:.92rem;line-height:1.55}
.reflection-card{position:sticky;top:7rem;padding:clamp(1.5rem,3vw,2rem);border:1px solid color-mix(in srgb,var(--line) 62%,var(--accent));border-radius:var(--radius-xl);background:linear-gradient(145deg,var(--brand-graphite),#0d1721);color:var(--brand-paper);box-shadow:0 18px 45px rgba(10,12,15,.2)}
.reflection-card>span{color:#d4b872;font-size:.76rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.reflection-card blockquote{margin:1.1rem 0 1.5rem;padding-left:1rem;border-left:3px solid var(--brand-gold);font-size:1.08rem;line-height:1.66}
.reflection-card dl{margin:0}
.reflection-card dl div{padding:.8rem 0;border-top:1px solid rgba(255,255,255,.15)}
.reflection-card dt{color:#aeb8c2;font-size:.72rem;font-weight:760;letter-spacing:.07em;text-transform:uppercase}
.reflection-card dd{margin:.2rem 0 0;font-weight:700}
.document-downloads{display:grid;gap:1.25rem;margin-top:2.5rem}
.document-card{display:grid;grid-template-columns:minmax(11rem,.34fr) minmax(0,1fr);overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);box-shadow:0 12px 34px rgba(10,12,15,.07)}
.document-card__preview{display:grid;place-items:center;min-height:25rem;padding:1.4rem;background:linear-gradient(145deg,#d8e1e9,#f1f4f7);text-decoration:none}
:root[data-theme=dark] .document-card__preview{background:linear-gradient(145deg,#202b35,#10171e)}
.document-card__preview img{width:min(100%,17.5rem);border:1px solid rgba(10,12,15,.15);box-shadow:0 15px 35px rgba(10,12,15,.22);transition:transform var(--transition),box-shadow var(--transition)}
.document-card__preview:hover img{transform:translateY(-4px) rotate(-.25deg);box-shadow:0 22px 42px rgba(10,12,15,.28)}
.document-card__content{display:flex;flex-direction:column;padding:clamp(1.5rem,4vw,2.7rem)}
.document-type{color:var(--accent-strong);font-size:.76rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.document-card h3{margin-top:.6rem;font-size:clamp(1.8rem,3vw,2.7rem)}
.document-card__content>p{margin-top:.85rem;color:var(--muted)}
.document-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:1.5rem 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.document-meta div{min-width:0;padding:.9rem;border-left:1px solid var(--line)}
.document-meta div:first-child{border-left:0;padding-left:0}
.document-meta dt{color:var(--muted);font-size:.7rem;font-weight:760;letter-spacing:.07em;text-transform:uppercase}
.document-meta dd{margin:.24rem 0 0;overflow-wrap:anywhere;font-size:.86rem;font-weight:700;line-height:1.45}
.document-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:auto;padding-top:1.6rem}
.privacy-callout{display:flex;justify-content:space-between;align-items:center;gap:2rem;margin-top:1.25rem;padding:1.25rem 1.4rem;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--radius-md);background:var(--surface-2)}
.privacy-callout strong{display:block}
.privacy-callout p{margin-top:.3rem;color:var(--muted);font-size:.92rem}
.privacy-callout .text-link{flex:0 0 auto}
@media (max-width:1080px){.internship-hero__grid,.final-day-grid{grid-template-columns:1fr}.internship-hero__copy h1{max-width:14ch}.internship-hero__panel{max-width:44rem}.reflection-card{position:static}.internship-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.competency-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.site-nav a.nav-featured{border-radius:var(--radius-sm);background:var(--accent-soft)}.internship-jump ul{display:flex;overflow-x:auto;padding-bottom:.3rem;scroll-snap-type:x proximity}.internship-jump li{flex:0 0 auto;scroll-snap-align:start}.internship-jump a{border-color:var(--line);background:var(--surface-2)}.document-card{grid-template-columns:minmax(9rem,.38fr) minmax(0,1fr)}.document-card__preview{min-height:22rem}}
@media (max-width:720px){.internship-hero{padding-block:3.4rem}.internship-hero__copy h1{font-size:clamp(2.65rem,13vw,4rem)}.internship-facts div{grid-template-columns:1fr;gap:.22rem}.practice-principles,.internship-weeks,.competency-grid,.final-day-list{grid-template-columns:1fr}.week-card{min-height:0}.document-card{grid-template-columns:1fr}.document-card__preview{min-height:0;max-height:30rem}.document-card__preview img{width:min(76%,16rem)}.document-meta{grid-template-columns:1fr}.document-meta div,.document-meta div:first-child{padding:.72rem 0;border-left:0;border-top:1px solid var(--line)}.document-meta div:first-child{border-top:0}.privacy-callout{align-items:flex-start;flex-direction:column;gap:1rem}}
@media (max-width:520px){.internship-kpis{grid-template-columns:1fr}.internship-kpis article{min-height:9.5rem}.internship-hero__panel{padding:1.15rem}.document-actions{align-items:stretch;flex-direction:column}.document-actions .button,.document-actions .text-link{width:100%;text-align:center}.week-card__head{align-items:flex-start;flex-direction:column;gap:.3rem}}
@media (prefers-reduced-motion:reduce){.competency-grid article,.document-card__preview img{transition:none}.competency-grid article:hover,.document-card__preview:hover img{transform:none}}
/* ==========================================================
JULIAN KRAUSS · CORPORATE DESIGN V2 · RELEASE 4.0
Obsidian / Precision / Holographic material system
========================================================== */
:root{
--brand-carbon:#07090d;
--brand-graphite:#0e131a;
--brand-steel:#2a3442;
--brand-silver:#cbd4df;
--brand-paper:#f4f7fa;
--brand-gold:#d2ae67;
--brand-blue:#59cfff;
--holo-cyan:#5ef0ff;
--holo-blue:#5aa7ff;
--holo-violet:#8f7cff;
--holo-magenta:#d99cff;
--holo-gold:#efc56c;
--holo-gradient:linear-gradient(118deg,var(--holo-cyan) 0%,var(--holo-blue) 28%,var(--holo-violet) 53%,var(--holo-magenta) 73%,var(--holo-gold) 100%);
--holo-soft:linear-gradient(118deg,rgba(94,240,255,.13),rgba(143,124,255,.10) 52%,rgba(239,197,108,.10));
--pointer-x:50vw;
--pointer-y:25vh;
--radius-sm:.72rem;
--radius-md:1rem;
--radius-lg:1.28rem;
--radius-xl:1.8rem;
--transition:190ms cubic-bezier(.2,.72,.2,1);
--shadow:0 18px 46px rgba(18,27,39,.10);
--accent:#28728b;
--accent-strong:#1f6075;
--secondary:#6258a2;
}
:root[data-theme=dark]{
--bg:#07090d;
--surface:#0e131a;
--surface-2:#121923;
--surface-3:#192330;
--text:#f4f7fa;
--muted:#9eabba;
--line:#263343;
--accent:#6de7f5;
--accent-strong:#8cf2fa;
--accent-soft:#102c33;
--accent-contrast:#061015;
--secondary:#a596ff;
--header:rgba(7,9,13,.78);
--shadow:0 24px 70px rgba(0,0,0,.34);
}
html{background:var(--bg)}
body{
position:relative;
background:
radial-gradient(760px circle at var(--pointer-x) var(--pointer-y),color-mix(in srgb,var(--holo-blue) 6%,transparent),transparent 60%),
var(--bg);
letter-spacing:-.004em;
}
body::before{
content:"";
position:fixed;
inset:0;
z-index:0;
pointer-events:none;
opacity:.5;
background-image:
linear-gradient(color-mix(in srgb,var(--line) 22%,transparent) 1px,transparent 1px),
linear-gradient(90deg,color-mix(in srgb,var(--line) 22%,transparent) 1px,transparent 1px);
background-size:48px 48px;
mask-image:radial-gradient(circle at 50% 15%,black 0,transparent 68%);
}
.page-shell>.site-main,.page-shell>.site-footer{position:relative;z-index:1}
/* Header and fixed utilities must keep their own positioning. A global direct-child
position override previously broke sticky/fixed behavior on mobile. */
.page-shell>.site-header{z-index:100}
.page-shell>.skip-link{z-index:1000}
.page-shell>.back-to-top{z-index:80}
.site-main{overflow:clip}
h1,h2,h3,h4{letter-spacing:-.038em}
h1{font-weight:790}
h2{font-weight:760}
.eyebrow{letter-spacing:.145em}
.eyebrow::before{width:1.85rem;background:var(--holo-gradient);height:2px;border-radius:999px}
.site-header{
border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);
box-shadow:0 1px 0 rgba(255,255,255,.02),0 12px 40px rgba(0,0,0,.04);
backdrop-filter:blur(22px) saturate(145%);
}
:root:not([data-theme=dark]) .site-header{--header:rgba(244,247,250,.82)}
.header-inner{min-height:5rem}
.brand{position:relative;gap:.72rem}
.brand-logo,.footer-brand-logo{
border-radius:.78rem;
box-shadow:0 0 0 1px color-mix(in srgb,var(--line) 70%,transparent),0 8px 22px rgba(0,0,0,.12);
}
.brand-copy span{font-size:.98rem;letter-spacing:-.015em}
.brand-copy small{font-size:.67rem;letter-spacing:.055em;text-transform:uppercase}
.site-nav ul{gap:.12rem}
.site-nav a{border:0;border-radius:.7rem;padding:.58rem .7rem;transition:background var(--transition),color var(--transition)}
.site-nav a:hover{background:color-mix(in srgb,var(--surface-2) 74%,transparent)}
.site-nav a[aria-current=page]{background:color-mix(in srgb,var(--surface-3) 72%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line) 70%,transparent)}
.site-nav .nav-featured{position:relative}
.site-nav .nav-featured::after{content:"";position:absolute;left:.65rem;right:.65rem;bottom:.24rem;height:1px;background:var(--holo-gradient);opacity:.9}
.command-trigger{
display:inline-flex;align-items:center;gap:.42rem;min-height:2.65rem;padding:.45rem .62rem;border:1px solid var(--line);border-radius:.72rem;background:color-mix(in srgb,var(--surface) 82%,transparent);color:var(--muted);cursor:pointer;transition:border-color var(--transition),color var(--transition),background var(--transition)
}
.command-trigger:hover{color:var(--text);border-color:color-mix(in srgb,var(--holo-blue) 50%,var(--line));background:var(--surface-2)}
.command-trigger>span{font-size:1.1rem;line-height:1}
.command-trigger kbd{font:600 .65rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;padding:.25rem .32rem;border-radius:.35rem;background:var(--surface-3);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.button{min-height:2.95rem;border-radius:.78rem;position:relative;overflow:hidden}
.button--primary{
color:var(--text);
border:1px solid transparent;
background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--holo-gradient) border-box;
box-shadow:0 10px 30px color-mix(in srgb,var(--holo-blue) 10%,transparent)
}
.button--primary::before{content:"";position:absolute;inset:0;background:var(--holo-soft);opacity:.45;transition:opacity var(--transition)}
.button--primary>*{position:relative}
.button--primary:hover{background:linear-gradient(var(--surface-2),var(--surface-2)) padding-box,var(--holo-gradient) border-box;color:var(--text);box-shadow:0 14px 38px color-mix(in srgb,var(--holo-violet) 15%,transparent)}
.button--primary:hover::before{opacity:.8}
.button--secondary{background:color-mix(in srgb,var(--surface) 84%,transparent);box-shadow:inset 0 0 0 1px rgba(255,255,255,.015)}
.hero{position:relative;isolation:isolate;padding-block:clamp(4rem,8vw,7.2rem)}
.hero::before{
content:"";position:absolute;z-index:-1;width:min(56rem,82vw);height:min(56rem,82vw);right:-16rem;top:-22rem;border-radius:50%;
background:conic-gradient(from 90deg,rgba(94,240,255,.12),rgba(143,124,255,.09),rgba(239,197,108,.08),rgba(94,240,255,.12));filter:blur(56px);opacity:.7
}
.hero-grid{gap:clamp(2.5rem,5vw,5rem);align-items:center}
.hero h1{font-size:clamp(3rem,5.8vw,5.85rem);line-height:.98;max-width:10.8ch;position:relative}
.hero h1::after{content:"";display:block;width:clamp(5rem,16vw,10rem);height:3px;margin-top:1.25rem;background:var(--holo-gradient);border-radius:999px;box-shadow:0 0 24px color-mix(in srgb,var(--holo-cyan) 24%,transparent)}
.hero .lead{max-width:60ch;margin-top:1.45rem}
.hero-actions{margin-top:1.8rem}
.hero-facts{margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid color-mix(in srgb,var(--line) 72%,transparent)}
.hero-facts>div{position:relative}
.hero-facts strong{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hero-facts span{font-weight:690;color:var(--text)}
.system-signature{
display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;margin-top:1.55rem;width:min(100%,39rem);padding:.72rem .82rem;border:1px solid var(--line);border-radius:.88rem;background:color-mix(in srgb,var(--surface) 78%,transparent);backdrop-filter:blur(12px)
}
.system-signature__node{width:.65rem;height:.65rem;border-radius:50%;background:var(--holo-cyan);box-shadow:0 0 0 4px color-mix(in srgb,var(--holo-cyan) 12%,transparent),0 0 20px color-mix(in srgb,var(--holo-cyan) 55%,transparent)}
.system-signature__copy{display:grid;gap:.13rem}
.system-signature__copy strong{font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}
.system-signature__copy small{color:var(--muted)}
.system-signature code{font:600 .67rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted)}
.carousel{position:relative;border:1px solid transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--holo-gradient) border-box;box-shadow:0 26px 80px rgba(0,0,0,.18),0 0 60px color-mix(in srgb,var(--holo-blue) 7%,transparent)}
.carousel::before{content:"";position:absolute;inset:1px;z-index:3;pointer-events:none;border-radius:inherit;background:linear-gradient(122deg,rgba(255,255,255,.12),transparent 20%,transparent 72%,rgba(255,255,255,.05));mix-blend-mode:screen}
.carousel-frame{background:#080b10}
.carousel-slide img,.carousel-slide video{filter:saturate(.92) contrast(1.02)}
.carousel-caption{font-weight:680}
.carousel-dot[aria-current=true]{background:var(--holo-cyan);box-shadow:0 0 14px color-mix(in srgb,var(--holo-cyan) 50%,transparent)}
.section{position:relative}
.section--surface{background:color-mix(in srgb,var(--surface) 96%,transparent)}
.section--tint{background:color-mix(in srgb,var(--surface-2) 96%,transparent)}
.section-heading{gap:var(--space-5)}
.card,.project-card,.week-card,.competency-grid article,.document-card,.verified-practice-card,.final-day-list article,.reflection-card,.practice-principles article,.internship-hero__panel{
border-color:color-mix(in srgb,var(--line) 82%,transparent);
box-shadow:0 16px 45px rgba(0,0,0,.055)
}
.material-card{position:relative;isolation:isolate;overflow:hidden}
.material-card::after{
content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:0;transition:opacity 240ms ease;
background:radial-gradient(360px circle at var(--card-x,50%) var(--card-y,50%),color-mix(in srgb,var(--holo-blue) 11%,transparent),transparent 68%)
}
.material-card:hover::after{opacity:1}
.project-card:hover,.week-card:hover,.document-card:hover,.competency-grid article:hover,.practice-day-card:hover{border-color:color-mix(in srgb,var(--holo-blue) 38%,var(--line));box-shadow:0 20px 54px rgba(0,0,0,.09)}
.tag{border-radius:999px;background:color-mix(in srgb,var(--surface-2) 86%,transparent);border-color:color-mix(in srgb,var(--line) 85%,transparent);font-size:.76rem;letter-spacing:.015em}
.internship-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 98%,transparent),var(--bg))}
.internship-hero::after{content:"";position:absolute;width:55rem;height:32rem;right:-18rem;top:-14rem;background:var(--holo-gradient);filter:blur(100px);opacity:.065;pointer-events:none}
.internship-hero h1{max-width:13ch;font-size:clamp(2.8rem,5vw,5rem)}
.internship-document-id code{color:var(--accent-strong)}
.status--complete{border-color:color-mix(in srgb,var(--holo-cyan) 34%,var(--line));background:color-mix(in srgb,var(--holo-cyan) 8%,var(--surface));color:var(--text)}
.status--complete::before{background:var(--holo-cyan);box-shadow:0 0 12px color-mix(in srgb,var(--holo-cyan) 50%,transparent)}
.internship-jump{position:sticky;top:5rem;z-index:20;padding-block:.72rem;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(18px);border-block:1px solid color-mix(in srgb,var(--line) 72%,transparent)}
.internship-jump ul{gap:.45rem;overflow:auto;padding-block:.2rem;scrollbar-width:thin}
.internship-jump a{white-space:nowrap;border-radius:.72rem;border:1px solid transparent;transition:background var(--transition),border-color var(--transition),color var(--transition)}
.internship-jump a.is-current{color:var(--text);background:var(--surface);border-color:var(--line)}
.internship-kpis article strong{font-variant-numeric:tabular-nums;background:var(--holo-gradient);background-clip:text;-webkit-background-clip:text;color:transparent}
.week-card__head span,.competency-index,.document-type{color:var(--accent-strong)}
.reflection-card blockquote{border-left-color:var(--holo-violet)}
.practice-explorer-shell{position:relative}
.practice-explorer-shell::before{content:"";position:absolute;inset:6rem auto auto -10rem;width:30rem;height:30rem;border-radius:50%;background:var(--holo-gradient);filter:blur(120px);opacity:.045;pointer-events:none}
.practice-explorer{margin-top:2.2rem}
.practice-explorer__controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,26rem);gap:1rem;align-items:start}
.practice-filterbar{display:flex;flex-wrap:wrap;gap:.5rem}
.practice-filterbar button{min-height:2.55rem;padding:.5rem .78rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);cursor:pointer;font-size:.85rem;font-weight:680;transition:all var(--transition)}
.practice-filterbar button:hover{border-color:color-mix(in srgb,var(--holo-blue) 45%,var(--line));color:var(--text)}
.practice-filterbar button[aria-pressed=true]{color:var(--text);border-color:transparent;background:linear-gradient(var(--surface-2),var(--surface-2)) padding-box,var(--holo-gradient) border-box;box-shadow:0 8px 24px color-mix(in srgb,var(--holo-blue) 8%,transparent)}
.practice-search input{width:100%;min-height:2.65rem;border:1px solid var(--line);border-radius:.82rem;background:var(--surface);color:var(--text);padding:.62rem .85rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
.practice-search input::placeholder{color:var(--muted)}
.practice-explorer__meta{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line);font:620 .75rem/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);text-transform:uppercase;letter-spacing:.055em}
.practice-day-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.1rem}
.practice-day-card{min-height:100%;padding:1.15rem;border:1px solid var(--line);border-radius:1.08rem;background:color-mix(in srgb,var(--surface) 95%,transparent);transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition)}
.practice-day-card:hover{transform:translateY(-2px)}
.practice-day-card__head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.85rem}
.practice-day-card__number{display:grid;place-items:center;width:2.25rem;height:2.25rem;border:1px solid transparent;border-radius:.65rem;background:linear-gradient(var(--surface-2),var(--surface-2)) padding-box,var(--holo-gradient) border-box;font:750 .74rem/1 ui-monospace,SFMono-Regular,Consolas,monospace}
.practice-day-card time{font:620 .72rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted)}
.practice-day-card h3{font-size:1.18rem;line-height:1.18}
.practice-day-card p{margin-top:.62rem;color:var(--muted);font-size:.94rem;line-height:1.6}
.practice-tool-list{display:flex;flex-wrap:wrap;gap:.38rem;list-style:none;margin:.9rem 0 0;padding:0}
.practice-tool-list li{max-width:none;padding:.25rem .48rem;border-radius:.45rem;background:var(--surface-2);border:1px solid color-mix(in srgb,var(--line) 82%,transparent);font:620 .69rem/1.25 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--text)}
.practice-day-card__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:.8rem;margin-top:1rem;padding-top:.75rem;border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);color:var(--muted);font-size:.7rem}
.practice-day-card__foot small{text-align:right;font-size:.67rem}
.practice-empty{grid-column:1/-1;padding:2rem;border:1px dashed var(--line);border-radius:1rem;color:var(--muted);text-align:center;max-width:none}
.command-palette{width:min(42rem,calc(100% - 2rem));padding:0;border:1px solid var(--line);border-radius:1.25rem;background:color-mix(in srgb,var(--surface) 96%,transparent);color:var(--text);box-shadow:0 34px 110px rgba(0,0,0,.38);backdrop-filter:blur(28px) saturate(140%)}
.command-palette::backdrop{background:rgba(3,5,8,.58);backdrop-filter:blur(6px)}
.command-palette__shell{padding:.9rem}
.command-palette__top{display:grid;grid-template-columns:auto 1fr auto;gap:.65rem;align-items:center;padding:.2rem .1rem .75rem}
.command-palette__mark{display:grid;place-items:center;width:2rem;height:2rem;border:1px solid transparent;border-radius:.55rem;background:linear-gradient(var(--surface-2),var(--surface-2)) padding-box,var(--holo-gradient) border-box;font:800 .7rem/1 ui-monospace,SFMono-Regular,Consolas,monospace}
.command-palette__top label{font-weight:720}
.command-palette__close{padding:.35rem .45rem;border:1px solid var(--line);border-radius:.45rem;background:var(--surface-2);color:var(--muted);cursor:pointer;font:650 .67rem/1 ui-monospace,SFMono-Regular,Consolas,monospace}
.command-palette__input{width:100%;min-height:3.15rem;padding:.75rem .9rem;border:1px solid var(--line);border-radius:.82rem;background:var(--bg);color:var(--text);font-size:1rem}
.command-palette__results{display:grid;gap:.28rem;margin-top:.65rem;max-height:22rem;overflow:auto}
.command-result{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.75rem .82rem;border-radius:.72rem;color:var(--text);text-decoration:none}
.command-result:hover,.command-result.is-active{background:var(--surface-2);color:var(--text)}
.command-result small{color:var(--muted);font:600 .66rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;text-transform:uppercase;letter-spacing:.04em}
.command-palette__hint{margin-top:.65rem;padding:.45rem .2rem .1rem;color:var(--muted);font-size:.72rem}
.command-empty{padding:1rem;color:var(--muted)}
.brand-scroll-progress{position:fixed;z-index:9999;top:0;left:0;width:100%;height:2px;transform:scaleX(0);transform-origin:left center;background:var(--holo-gradient);box-shadow:0 0 16px color-mix(in srgb,var(--holo-cyan) 35%,transparent);pointer-events:none}
.site-footer{position:relative;border-top-color:color-mix(in srgb,var(--line) 80%,transparent);background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--bg) 92%,black 8%))}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--holo-gradient);opacity:.42}
.footer-work-status>span{background:var(--holo-cyan);box-shadow:0 0 12px color-mix(in srgb,var(--holo-cyan) 52%,transparent)}
@media (max-width:1050px){
.command-trigger kbd{display:none}
.practice-explorer__controls{grid-template-columns:1fr}
}
@media (max-width:860px){
.command-trigger{display:none}
.internship-jump{top:4.75rem}
.practice-day-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
body::before{background-size:36px 36px}
.hero{padding-top:3.2rem}
.hero h1{font-size:clamp(2.65rem,13vw,4rem)}
.system-signature{grid-template-columns:auto 1fr}.system-signature code{display:none}
.practice-explorer__meta{display:grid}
.practice-day-card__foot{display:grid}.practice-day-card__foot small{text-align:left}
.command-palette__top label{font-size:.9rem}
.command-result{align-items:flex-start}.command-result small{text-align:right}
}
@media (prefers-reduced-motion:reduce){
body{background:var(--bg)}
.hero::before,.internship-hero::after,.practice-explorer-shell::before{display:none}
.practice-day-card:hover{transform:none}
.brand-scroll-progress{box-shadow:none}
}
@media print{
body::before,.brand-scroll-progress,.command-trigger,.command-palette,.practice-explorer__controls{display:none!important}
.practice-day-grid{display:block}.practice-day-card{break-inside:avoid;margin-bottom:.8rem}
}
/* ================================================================
RESPONSIVE HARDENING · RELEASE 4.4
Mobile-first refinement for phones, tablets, laptops and wide UI.
================================================================ */
:root{
--page-gutter:clamp(.75rem,2.6vw,2rem);
--header-height:5rem;
--touch-target:2.75rem;
}
html{
-webkit-text-size-adjust:100%;
text-size-adjust:100%;
overflow-x:clip;
}
body{
min-width:0;
overflow-x:clip;
}
.container{
width:min(calc(100% - (var(--page-gutter) * 2)),var(--content));
}
.site-header{
padding-top:env(safe-area-inset-top,0px);
}
.header-inner{
min-width:0;
}
.brand{
min-width:0;
}
.brand-copy{
min-width:0;
}
.brand-copy span,.brand-copy small{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.nav-shell{
flex:0 0 auto;
}
.button,.icon-button,.nav-toggle,.filter-button,.carousel-autoplay-toggle,.practice-filterbar button,.command-trigger,.command-palette__close{
min-height:var(--touch-target);
}
.icon-button,.nav-toggle{
min-width:var(--touch-target);
}
.site-nav a,.site-nav-nojs a,.case-nav a,.legal-nav a,.footer-links a{
min-height:var(--touch-target);
display:flex;
align-items:center;
}
:is(.hero-grid,.page-intro__grid,.featured-project,.goal-panel,.about-split,.projects-feature,.case-hero,.case-layout,.knowledge-section,.knowledge-disclosure,.cv-head,.cv-grid,.contact-layout,.legal-layout,.section-heading,.personal-social,.verified-practice-head,.verified-practice-grid,.experience-layout,.project-live-panel,.school-project-links,.brand-system-panel,.internship-hero__grid,.final-day-grid,.document-card,.practice-explorer__controls,.project-list,.core-skills-grid,.evidence-grid,.curriculum-detail-grid,.project-goals,.design-system-strip,.quality-facts,.role-split,.legal-project-grid) > *{
min-width:0;
}
:is(img,video,iframe,svg,canvas){
max-inline-size:100%;
}
iframe{
border:0;
}
.table-wrap{
max-width:100%;
overscroll-behavior-inline:contain;
-webkit-overflow-scrolling:touch;
}
.code-sample pre,.architecture,.project-flow,.project-filters,.internship-jump ul{
overscroll-behavior-inline:contain;
-webkit-overflow-scrolling:touch;
}
.back-to-top{
right:max(1rem,env(safe-area-inset-right,0px));
bottom:max(1rem,env(safe-area-inset-bottom,0px));
}
.command-palette{
max-height:min(88dvh,48rem);
margin-block:max(.5rem,env(safe-area-inset-top,0px)) max(.5rem,env(safe-area-inset-bottom,0px));
overflow:hidden;
}
.command-palette__shell{
display:flex;
flex-direction:column;
max-height:min(88dvh,48rem);
}
.command-palette__results{
min-height:0;
max-height:none;
flex:1 1 auto;
overscroll-behavior:contain;
}
.field input,.field textarea,.field select{
min-height:3rem;
font-size:max(1rem,var(--step-0));
}
.field textarea{
min-height:11rem;
}
.check-field{
min-height:var(--touch-target);
padding:.35rem 0;
}
.check-field input{
width:1.25rem;
height:1.25rem;
margin-top:.22rem;
}
.contact-form-shell,.contact-aside{
min-width:0;
}
.project-filters,.internship-jump ul{
scrollbar-width:thin;
}
.project-filters > *,.internship-jump li{
scroll-snap-align:start;
}
.carousel-frame{
min-height:0;
}
.footer-work-id{
min-width:0;
}
.footer-work-id code{
min-width:0;
}
/* Navigation switches before the desktop header becomes crowded. */
@media (max-width:1040px){
.command-trigger{display:none}
.has-js .nav-toggle{display:grid}
.has-js .site-nav{
position:fixed;
z-index:10;
inset:calc(var(--header-height) + env(safe-area-inset-top,0px)) 0 auto;
max-height:calc(100dvh - var(--header-height) - env(safe-area-inset-top,0px));
overflow:auto;
overscroll-behavior:contain;
padding:clamp(.7rem,2vw,1rem) max(var(--page-gutter),env(safe-area-inset-right,0px)) max(1rem,env(safe-area-inset-bottom,0px)) max(var(--page-gutter),env(safe-area-inset-left,0px));
background:color-mix(in srgb,var(--bg) 96%,transparent);
border-bottom:1px solid var(--line);
box-shadow:0 24px 60px rgba(0,0,0,.16);
backdrop-filter:blur(24px) saturate(145%);
transform:translateY(-112%);
visibility:hidden;
opacity:0;
transition:transform 220ms ease,visibility 220ms ease,opacity 160ms ease;
}
.has-js .site-nav.is-open{
transform:none;
visibility:visible;
opacity:1;
}
.has-js .site-nav ul{
display:grid;
width:min(100%,46rem);
margin-inline:auto;
gap:.25rem;
}
.has-js .site-nav a{
min-height:3.15rem;
padding:.72rem .9rem;
border:1px solid transparent;
border-bottom-color:var(--line);
border-radius:.72rem;
font-size:1rem;
}
.has-js .site-nav a[aria-current="page"]{
border-left:4px solid var(--accent);
border-bottom-color:var(--line);
background:var(--surface);
}
html:not(.has-js) .header-inner{
align-items:flex-start;
flex-wrap:wrap;
padding-block:.6rem;
}
html:not(.has-js) .site-nav{
order:3;
width:100%;
}
html:not(.has-js) .site-nav ul{
flex-wrap:wrap;
align-items:flex-start;
}
.site-nav-nojs{
order:3;
width:100%;
}
.footer-grid--compact{
grid-template-columns:minmax(0,1.35fr) minmax(11rem,.65fr);
}
.footer-grid--compact>.footer-intro{
grid-column:1 / -1;
}
.footer-grid--compact>div:last-child{
grid-column:auto;
}
}
/* Tablet landscape / compact laptop */
@media (max-width:900px){
:root{--page-gutter:clamp(.85rem,2.8vw,1.5rem)}
.page-intro{padding-block:clamp(2.8rem,7vw,4.2rem)}
.section{padding-block:clamp(3.5rem,8vw,4.75rem)}
.section--compact{padding-block:clamp(2.5rem,6vw,3.5rem)}
.page-intro__grid,.section-heading{
grid-template-columns:1fr;
gap:1.25rem;
}
.section-heading .lead{
justify-self:start;
}
.page-intro__meta{
max-width:65ch;
}
.design-system-strip{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.quality-facts,.evidence-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.footer-rights{
align-items:flex-start;
flex-direction:column;
}
.footer-work-meta{
justify-content:flex-start;
width:100%;
}
}
/* Tablet portrait and large phones */
@media (max-width:760px){
.grid--2,.grid--3,.principles,.knowledge-list,.form-grid,.tech-specs,.project-goals,.role-split,.design-system-strip,.quality-facts,.evidence-grid,.curriculum-detail-grid,.legal-project-grid{
grid-template-columns:minmax(0,1fr);
}
.hero-grid,.case-hero,.projects-feature,.featured-project,.goal-panel,.personal-social,.project-live-panel,.school-project-links,.brand-system-panel,.document-card,.internship-hero__grid,.final-day-grid{
grid-template-columns:minmax(0,1fr);
}
.hero-grid{gap:2rem}
.case-hero picture,.projects-feature picture,.project-row>picture,.project-row:nth-child(3)>picture,.project-row--process>picture,.project-row--process .process-preview{
aspect-ratio:16/10;
width:100%;
height:auto;
min-height:0;
border-right:0;
border-bottom:1px solid var(--line);
}
.project-row,.project-row:nth-child(3),.project-row--process{
display:flex;
flex-direction:column;
}
.project-row>div:last-child{
padding:1.1rem;
}
.project-summary{min-height:0}
.case-nav ol{
display:flex;
overflow-x:auto;
scroll-snap-type:x proximity;
gap:.35rem;
padding-bottom:.35rem;
border-top:0;
}
.case-nav li{flex:0 0 auto;scroll-snap-align:start}
.case-nav a{
min-height:2.75rem;
padding:.55rem .75rem;
border:1px solid var(--line);
border-radius:999px;
background:var(--surface);
white-space:nowrap;
}
.architecture{
flex-direction:column;
overflow:visible;
align-items:stretch;
}
.arch-node{width:100%;min-width:0}
.arch-arrow{transform:rotate(90deg);align-self:center}
.cv-head{
grid-template-columns:1fr;
align-items:start;
}
.cv-portrait{justify-self:start}
.cv-contact{justify-self:start;text-align:left}
.contact-layout,.legal-layout,.about-split,.cv-grid,.experience-layout,.knowledge-section,.knowledge-disclosure{
grid-template-columns:minmax(0,1fr);
}
.profile-panel,.case-nav,.legal-nav,.experience-aside{position:static}
.knowledge-section>div:first-child{min-width:0}
.contact-layout{gap:2.25rem}
.contact-aside{border-top-width:3px}
.form-grid{gap:.9rem}
.footer-grid--compact{grid-template-columns:1fr 1fr}
.footer-grid--compact>.footer-intro{grid-column:1 / -1}
.hero-actions,.cv-actions,.document-actions,.project-external-actions{
display:grid;
grid-template-columns:1fr;
align-items:stretch;
}
.hero-actions .button,.cv-actions .button,.document-actions .button,.project-external-actions .button,.contact-form-shell .button[type="submit"]{
width:100%;
}
.carousel-frame{aspect-ratio:4/3}
.carousel-meta{grid-template-columns:1fr;gap:.55rem}
.carousel-dots{justify-content:center}
.practice-explorer__meta{display:grid;gap:.35rem}
.practice-day-card__foot{display:grid;gap:.3rem}
.practice-day-card__foot small{text-align:left}
}
/* Phone */
@media (max-width:620px){
:root{
--page-gutter:clamp(.7rem,3.8vw,1rem);
--header-height:4.35rem;
}
html{scroll-padding-top:5.15rem}
.header-inner{min-height:var(--header-height)}
.brand-logo{width:2rem;height:2rem}
.brand-copy span{font-size:.92rem}
.brand-copy small{display:none}
.nav-shell{gap:.45rem}
.icon-button,.nav-toggle{width:2.65rem;height:2.65rem}
.has-js .site-nav{
inset:calc(var(--header-height) + env(safe-area-inset-top,0px)) 0 auto;
max-height:calc(100dvh - var(--header-height) - env(safe-area-inset-top,0px));
}
.breadcrumb{padding-block:.72rem}
.breadcrumb ol{font-size:.8rem;gap:.32rem}
.page-intro{padding-block:2.55rem}
.page-intro__meta{padding-left:.9rem}
.section{padding-block:3.25rem}
.section--compact{padding-block:2.35rem}
h1{font-size:clamp(2.25rem,11vw,3.35rem);line-height:1.01}
h2{font-size:clamp(1.72rem,8vw,2.25rem)}
h3{font-size:clamp(1.2rem,5.8vw,1.55rem)}
.hero{padding-block:3rem}
.hero h1{font-size:clamp(2.55rem,12.5vw,3.75rem);max-width:12ch}
.hero h1::after{margin-top:1rem}
.hero .lead{margin-top:1.15rem}
.hero-facts{grid-template-columns:1fr;gap:.8rem}
.hero-facts>div:last-child{grid-column:auto}
.system-signature{grid-template-columns:auto minmax(0,1fr);gap:.65rem;padding:.7rem}
.system-signature code{display:none}
.carousel{border-radius:var(--radius-md)}
.carousel-frame{aspect-ratio:4/3;border-radius:calc(var(--radius-md) - 2px)}
.carousel-control{width:2.4rem;height:2.4rem}
.carousel-control--prev{left:.5rem}.carousel-control--next{right:.5rem}
.carousel-dot{width:2.1rem;height:2.1rem}
.project-filter-panel{align-items:stretch;gap:.7rem}
.project-filters{
width:calc(100% + var(--page-gutter));
margin-right:calc(var(--page-gutter) * -1);
flex-wrap:nowrap;
overflow-x:auto;
padding:0 var(--page-gutter) .45rem 0;
scroll-snap-type:x proximity;
}
.filter-button{flex:0 0 auto;white-space:nowrap;scroll-snap-align:start}
.project-filter-status{white-space:normal}
.project-row>div:last-child{padding:1rem}
.project-card-actions{align-items:stretch;flex-direction:column}
.project-card-actions .button,.project-card-actions .text-link{width:100%}
.case-section{scroll-margin-top:5.25rem}
.timeline{margin-left:.25rem;padding-left:1.6rem}
.timeline-item::before{left:-2.03rem}
.cv-sheet{padding:1rem;border-inline:0}
.cv-entry{grid-template-columns:1fr;gap:.2rem}
.profile-photo{width:min(100%,17rem)}
.profile-photo figcaption{align-items:flex-start;flex-direction:column;gap:.15rem}
.skill-detail-list div{display:grid;gap:.15rem}
.skill-detail-list dd{text-align:left}
.practice-filterbar{
flex-wrap:nowrap;
overflow-x:auto;
padding-bottom:.4rem;
scroll-snap-type:x proximity;
}
.practice-filterbar button{flex:0 0 auto;scroll-snap-align:start;white-space:nowrap}
.practice-day-card{padding:1rem}
.practice-day-card__head{align-items:flex-start}
.internship-jump{top:calc(var(--header-height) + env(safe-area-inset-top,0px))}
.internship-jump ul{
margin-inline:calc(var(--page-gutter) * -1);
padding-inline:var(--page-gutter);
}
.internship-kpis{grid-template-columns:1fr}
.week-card{border-radius:var(--radius-lg)}
.document-card__preview{max-height:26rem}
.document-card__preview img{width:min(78%,15rem)}
.form-deployment-note{padding:.75rem .85rem}
.field input,.field textarea,.field select{padding:.78rem .8rem}
.footer-grid--compact{grid-template-columns:1fr}
.footer-grid--compact>.footer-intro,.footer-grid--compact>div:last-child{grid-column:1}
.footer-rights{gap:1rem}
.footer-work-meta{display:grid;grid-template-columns:1fr;width:100%}
.footer-work-status,.footer-work-id{width:100%;border-radius:var(--radius-sm);justify-content:flex-start}
.footer-work-id__label{flex:0 0 auto}
.footer-work-id code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.back-to-top{width:2.75rem;height:2.75rem}
.command-palette{width:calc(100% - 1rem);border-radius:.95rem}
.command-palette__shell{padding:.65rem}
.command-palette__top{grid-template-columns:auto minmax(0,1fr) auto;gap:.45rem}
.command-palette__top label{font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.command-result{align-items:flex-start;gap:.6rem}
.command-result small{text-align:right;max-width:7rem}
body::before{background-size:34px 34px;opacity:.34}
}
/* Very narrow phones */
@media (max-width:420px){
:root{--page-gutter:.72rem}
.brand{gap:.55rem}
.brand-logo{width:1.85rem;height:1.85rem}
.brand-copy span{font-size:.88rem}
.icon-button,.nav-toggle{width:2.55rem;height:2.55rem;min-width:2.55rem}
.eyebrow{font-size:.7rem;letter-spacing:.105em}
.hero h1{font-size:clamp(2.35rem,12.8vw,3.15rem)}
.lead{font-size:1.05rem}
.carousel-frame{aspect-ratio:1/1}
.project-row>picture,.project-row:nth-child(3)>picture,.project-row--process>picture,.project-row--process .process-preview,.case-hero picture,.projects-feature picture{
aspect-ratio:16/10;
}
.tag{font-size:.72rem}
.info-band>div{padding:.9rem}
.practice-day-card__head{display:grid;grid-template-columns:auto 1fr}
.practice-day-card time{text-align:right}
.check-field{gap:.6rem}
.footer-identity{align-items:flex-start}
.footer-brand-logo{width:2.75rem;height:2.75rem}
.footer-identity__copy small{font-size:.72rem}
.command-palette__mark{display:none}
.command-palette__top{grid-template-columns:minmax(0,1fr) auto}
}
/* Short landscape screens: make the open navigation usable without cramping. */
@media (max-width:1040px) and (max-height:560px) and (orientation:landscape){
.has-js .site-nav ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem .55rem}
.has-js .site-nav a{min-height:2.7rem;padding:.5rem .75rem}
}
/* Hover effects should not simulate movement on touch-only devices. */
@media (hover:none){
.button:hover,.project-row:hover,.practice-day-card:hover,.competency-grid article:hover,.document-card:hover{transform:none}
.material-card::after{display:none}
}
/* Wide screens: keep reading rhythm controlled instead of stretching content. */
@media (min-width:1500px){
:root{--content:80rem}
.hero-grid{gap:min(6vw,6rem)}
.page-intro__grid{gap:min(5vw,5rem)}
}
/* Progressive enhancement and small responsive corrections. */
.check-field input{min-height:1.25rem}
@media (max-width:1040px){
.internship-jump{top:calc(var(--header-height) + env(safe-area-inset-top,0px))}
html:not(.has-js) .site-nav{display:none}
html:not(.has-js) .nav-toggle{display:none}
html:not(.has-js) .site-nav-nojs{
display:block;
order:3;
width:100%;
padding:.5rem 0 .75rem;
}
html:not(.has-js) .site-nav-nojs ul{
display:flex;
flex-wrap:wrap;
gap:.3rem;
margin:0;
padding:0;
list-style:none;
}
html:not(.has-js) .site-nav-nojs a{
min-height:2.75rem;
padding:.55rem .7rem;
color:var(--text);
text-decoration:none;
border:1px solid var(--line);
border-radius:var(--radius-sm);
background:var(--surface);
}
}
/* ================================================================
CORPORATE SYSTEM REFINEMENT · RELEASE 4.5
Ziel: Die Website stärker an das präzisere Dokument- und PDF-System
anbinden. Ruhiger, hochwertiger, klarer und professioneller.
================================================================ */
:root{
--brand-carbon:#0b1730;
--brand-graphite:#102846;
--brand-steel:#49657f;
--brand-silver:#d7e1eb;
--brand-paper:#edf3f9;
--bg:#edf3f9;
--surface:#ffffff;
--surface-2:#f4f8fc;
--surface-3:#e8eef6;
--text:#0d1b2a;
--muted:#5d6d82;
--line:#d7e1eb;
--accent:#206efd;
--accent-strong:#1658d4;
--accent-soft:#e8f1ff;
--accent-contrast:#ffffff;
--secondary:#19a9ff;
--header:rgba(248,251,255,.82);
--shadow:0 18px 48px rgba(11,23,48,.08);
--card-shadow:0 18px 46px rgba(11,23,48,.08),8px 8px 0 rgba(27,75,132,.06);
--card-shadow-hover:0 26px 62px rgba(11,23,48,.12),8px 8px 0 rgba(27,75,132,.10);
--holo-cyan:#19a9ff;
--holo-blue:#206efd;
--holo-violet:#4c8dff;
--holo-magenta:#7db7ff;
--holo-gold:#b9d6ff;
--holo-gradient:linear-gradient(118deg,var(--holo-blue) 0%,var(--holo-cyan) 38%,#60b5ff 72%,#a1d0ff 100%);
--holo-soft:linear-gradient(118deg,rgba(32,110,253,.14),rgba(25,169,255,.10) 52%,rgba(160,208,255,.11));
}
:root[data-theme=dark]{
--bg:#081321;
--surface:#0d1c2e;
--surface-2:#10243b;
--surface-3:#16304c;
--text:#eef4fb;
--muted:#9db0c4;
--line:#20354d;
--accent:#51a3ff;
--accent-strong:#8ec7ff;
--accent-soft:#0f2440;
--accent-contrast:#06101b;
--secondary:#19a9ff;
--header:rgba(6,17,29,.84);
--shadow:0 24px 70px rgba(0,0,0,.34);
--card-shadow:0 22px 58px rgba(0,0,0,.25),8px 8px 0 rgba(10,31,53,.36);
--card-shadow-hover:0 28px 78px rgba(0,0,0,.34),8px 8px 0 rgba(10,31,53,.42);
--holo-violet:#7aa9ff;
--holo-magenta:#8fc5ff;
--holo-gold:#dbe8ff;
}
html{background:var(--bg)}
body{
background:
radial-gradient(900px circle at 10% -8%,rgba(32,110,253,.10),transparent 40%),
radial-gradient(760px circle at 90% -15%,rgba(25,169,255,.08),transparent 36%),
var(--bg);
}
body::before{
opacity:.38;
background-image:
linear-gradient(color-mix(in srgb,var(--line) 18%,transparent) 1px,transparent 1px),
linear-gradient(90deg,color-mix(in srgb,var(--line) 18%,transparent) 1px,transparent 1px);
background-size:44px 44px;
}
.site-header{
background:rgba(7,22,43,.88);
border-bottom:1px solid rgba(255,255,255,.10);
box-shadow:0 10px 34px rgba(5,15,30,.24);
backdrop-filter:blur(18px) saturate(150%);
}
.site-header .brand,
.site-header .site-nav a,
.site-header .site-nav-nojs a,
.site-header .icon-button,
.site-header .nav-toggle{color:#eef6ff}
.site-header .brand-copy small,
.site-header .site-nav a:not([aria-current=page]),
.site-header .site-nav-nojs a:not([aria-current=page]){color:rgba(231,240,250,.72)}
.site-header .site-nav a:hover,
.site-header .site-nav a[aria-current=page],
.site-header .site-nav-nojs a:hover{color:#fff}
.site-header .site-nav a[aria-current=page]{border-color:var(--holo-cyan)}
.site-header .icon-button,
.site-header .nav-toggle{
background:rgba(255,255,255,.045);
border-color:rgba(255,255,255,.12);
}
.site-header .icon-button:hover,
.site-header .nav-toggle:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.site-header .nav-featured{
border-radius:.8rem;
background:rgba(32,110,253,.10);
}
.brand-logo,.footer-brand-logo{
border-radius:.9rem;
box-shadow:0 10px 22px rgba(0,0,0,.14);
}
.hero,
.page-intro,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child{
position:relative;
isolation:isolate;
overflow:hidden;
background:linear-gradient(135deg,#06162d 0%,#0a2444 56%,#071a31 100%);
border-bottom:1px solid rgba(255,255,255,.08);
}
.hero::before,
.page-intro::before,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child::before{
content:"";
position:absolute;
inset:auto auto auto 65%;
width:40rem;
height:40rem;
transform:translate(-20%,-48%);
border-radius:50%;
background:radial-gradient(circle at 50% 50%,rgba(25,169,255,.18),rgba(32,110,253,.10) 42%,transparent 72%);
filter:blur(24px);
pointer-events:none;
}
.hero::after,
.page-intro::after,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child::after{
content:"";
position:absolute;
left:-5%;
right:-5%;
bottom:0;
height:9rem;
opacity:.35;
pointer-events:none;
background:
repeating-linear-gradient(173deg,transparent 0 8px,rgba(80,150,255,.16) 8px 9px,transparent 9px 15px);
transform:skewY(-4deg) translateY(35%);
}
.hero .eyebrow,
.page-intro .eyebrow,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .eyebrow{color:#d7ebff}
.hero h1,
.page-intro h1,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child h1,
.page-intro h2{color:#fff}
.hero .lead,
.page-intro .lead,
.page-intro__meta,
.hero-facts span,
.hero-facts strong,
.system-signature__copy small,
.system-signature code,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .lead,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .status,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .info-band dt,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .info-band dd{color:rgba(231,240,250,.82)}
.page-intro__meta,
.system-signature,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .info-band{
border-color:rgba(255,255,255,.12);
background:rgba(255,255,255,.06);
box-shadow:0 18px 40px rgba(0,0,0,.14);
}
.page-intro__meta{
border-left:0;
padding:1rem 1.1rem;
border-radius:1rem;
}
.hero-facts{gap:1rem}
.hero-facts>div{
padding:1rem 1rem 1.05rem;
border:1px solid rgba(255,255,255,.10);
border-radius:1rem;
background:rgba(255,255,255,.03);
}
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .case-hero{
gap:clamp(1.5rem,4vw,3rem);
align-items:center;
}
body[data-page^="projekt"] .site-main > .section.section--compact:first-child picture,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child img{
border-radius:1.4rem;
}
.button--primary{
background:linear-gradient(180deg,#2c7dff,#165fe0);
color:#fff;
border:1px solid rgba(255,255,255,.16);
box-shadow:0 14px 34px rgba(32,110,253,.28);
}
.button--primary::before{display:none}
.button--primary:hover{
background:linear-gradient(180deg,#3a87ff,#1257d8);
color:#fff;
box-shadow:0 18px 38px rgba(32,110,253,.34);
}
.button--secondary,
.button--quiet{
background:rgba(255,255,255,.82);
border-color:var(--line);
}
:root[data-theme=dark] .button--secondary,
:root[data-theme=dark] .button--quiet{background:rgba(255,255,255,.03)}
.carousel{
border-radius:1.6rem;
background:linear-gradient(180deg,#0a1830,#102442);
box-shadow:0 30px 70px rgba(10,20,40,.28);
}
.carousel::before{opacity:.38}
.carousel-frame{border-radius:1.45rem;background:#08111f}
.practice-grid,
.verified-practice-grid{
gap:1.25rem;
border:0;
}
.practice-item,
.verified-practice-grid article,
.project-card,
.project-row,
.contact-aside,
.contact-form-shell,
.legal-nav,
.legal-content,
.case-nav,
.profile-panel,
.principle,
.goal-panel,
.cta-band,
.featured-project,
.projects-feature,
.knowledge-section--curriculum,
.knowledge-disclosure,
.info-band,
.practice-day-card,
.document-card,
.week-card,
.competency-grid article,
.reflection-card,
.final-day-list article,
.practice-principles article,
.internship-hero__panel,
.verified-practice-card,
.cv-panel,
.project-live-panel{
background:linear-gradient(180deg,var(--surface),var(--surface-2));
border:1px solid var(--line);
border-radius:1.4rem;
box-shadow:var(--card-shadow);
}
.practice-item,
.verified-practice-grid article{
padding:1.45rem;
}
.practice-item+.practice-item,
.verified-practice-grid article+article{
padding-left:1.45rem;
border-left:1px solid var(--line);
}
.practice-item h2,
.verified-practice-grid h3,
.project-card h3,
.project-row h3{letter-spacing:-.03em}
.project-card,
.project-row,
.document-card,
.practice-day-card,
.week-card,
.competency-grid article,
.reflection-card,
.final-day-list article,
.practice-principles article,
.verified-practice-card{transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition)}
.project-card:hover,
.project-row:hover,
.document-card:hover,
.practice-day-card:hover,
.week-card:hover,
.competency-grid article:hover,
.reflection-card:hover,
.final-day-list article:hover,
.practice-principles article:hover,
.verified-practice-card:hover{
border-color:color-mix(in srgb,var(--accent) 46%,var(--line));
box-shadow:var(--card-shadow-hover);
transform:translateY(-2px);
}
.featured-project,
.goal-panel,
.cta-band,
.projects-feature,
.contact-layout,
.legal-layout,
.about-split,
.personal-social,
.cv-grid,
.case-layout,
.knowledge-section{gap:1.5rem}
.featured-project,
.goal-panel,
.cta-band,
.projects-feature{padding:clamp(1.25rem,2vw,1.7rem)}
.featured-project__media img,
.project-row>picture,
.projects-feature picture{
border-radius:1.25rem;
}
.project-row>picture,
.projects-feature picture,
.carousel-frame{
background:linear-gradient(180deg,#09172c,#112a4d);
}
.case-nav,
.legal-nav,
.profile-panel,
.contact-aside{padding:1.35rem}
.contact-form-shell{padding:clamp(1.2rem,2vw,1.6rem)}
.contact-method+.contact-method{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.info-band{overflow:hidden}
.info-band>div{padding:1.15rem}
.info-band dt{font-size:.75rem;letter-spacing:.09em}
.info-band dd{font-size:1rem}
.practice-index,
.document-type,
.competency-index{
display:inline-flex;
align-items:center;
gap:.25rem;
min-height:1.9rem;
padding:.28rem .62rem;
border-radius:.58rem;
background:linear-gradient(180deg,#2876ff,#1760e3);
color:#fff;
box-shadow:0 10px 20px rgba(32,110,253,.22);
}
.status{
min-height:1.95rem;
padding:.25rem .68rem;
border-radius:999px;
background:var(--accent-soft);
color:var(--accent-strong);
border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
}
.status::before{background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)}
.tag{
background:#eff5ff;
color:#18385f;
border-color:#d8e6ff;
}
:root[data-theme=dark] .tag{background:#102744;color:#d9ebff;border-color:#204369}
.field input,
.field textarea,
.field select{
border-radius:.9rem;
background:var(--surface);
border-color:var(--line);
box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.field input:focus,
.field textarea:focus,
.field select:focus{border-color:var(--accent)}
.notice{border-radius:1rem}
.form-deployment-note{padding:1rem 1.05rem;border-radius:.95rem;border-left:0;background:var(--surface-2)}
.case-nav ol,
.legal-nav ul{border-top:0}
.case-nav a,
.legal-nav a,
.footer-links a{
border-radius:.78rem;
padding:.58rem .75rem;
}
.case-nav a:hover,
.legal-nav a:hover,
.footer-links a:hover{
background:var(--surface-2);
}
.project-row:nth-child(3),
.project-row--process{
border-radius:1.45rem;
}
.project-row:nth-child(3)>picture,
.project-row--process .process-preview{
border-top-left-radius:1.45rem;
border-bottom-left-radius:1.45rem;
}
.school-project-links,
.verified-practice-head,
.personal-note__grid{align-items:start}
.site-footer{
background:linear-gradient(180deg,#081728,#06111d);
border-top:0;
}
.site-footer::before{opacity:.7}
.site-footer,
.site-footer a,
.site-footer .footer-title,
.site-footer strong,
.site-footer code{color:#eef4fb}
.site-footer .footer-statement,
.site-footer .footer-links a,
.site-footer .footer-rights__copy,
.site-footer .footer-identity__copy small,
.site-footer .footer-work-id__label{color:rgba(231,240,250,.72)}
.site-footer .footer-links a:hover,
.site-footer .footer-identity:hover strong{color:#fff}
.footer-work-status,
.footer-work-id{
background:rgba(255,255,255,.06);
border-color:rgba(255,255,255,.12);
}
.footer-work-id:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18)}
.footer-copy-feedback{color:rgba(231,240,250,.82)}
@media (max-width:1040px){
.has-js .site-nav{
background:rgba(7,22,43,.98);
border-bottom-color:rgba(255,255,255,.10);
}
}
@media (max-width:900px){
.practice-grid,
.verified-practice-grid,
.project-pair,
.project-list{grid-template-columns:1fr}
.featured-project,
.projects-feature,
.goal-panel{padding:1.2rem}
}
@media (max-width:700px){
.hero,
.page-intro,
body[data-page^="projekt"] .site-main > .section.section--compact:first-child{padding-block:3rem}
.page-intro__meta,
.system-signature{padding:.9rem}
.practice-item,
.verified-practice-grid article,
.contact-aside,
.contact-form-shell,
.case-nav,
.legal-nav{padding:1rem}
}
/* ================================================================
SECOND ROUND · CORPORATE SYSTEM 4.6
Präzisere Informationsarchitektur, nummerierte Module und
Systemtechnik-Lernfelder aus dem schulischen Fragenkatalog.
================================================================ */
:root{
--module-blue:#1e72f4;
--module-cyan:#21acf4;
--navy-950:#06152a;
--navy-900:#0a203b;
--navy-800:#12365d;
--ice-50:#f6f9fc;
--ice-100:#edf3f9;
--ice-200:#dce7f2;
--success:#22c55e;
}
.section-heading{
display:grid;
grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
gap:clamp(1.5rem,4vw,4rem);
align-items:end;
margin-bottom:2rem;
}
.section-heading>p{justify-self:end}
.section-heading h2{max-width:19ch}
.core-skills{
background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 65%,var(--surface)));
}
.core-skills-grid{
gap:1rem;
border:0;
background:transparent;
}
.core-skill{
min-height:9rem;
border:1px solid var(--line);
border-radius:1.25rem;
background:linear-gradient(180deg,var(--surface),var(--surface-2));
box-shadow:var(--card-shadow);
overflow:hidden;
position:relative;
}
.core-skill::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
height:3px;
background:linear-gradient(90deg,var(--module-blue),var(--module-cyan));
opacity:.72;
}
.core-skill:hover{background:var(--surface);transform:translateY(-2px);box-shadow:var(--card-shadow-hover)}
.core-skill__index{
display:grid;
place-items:center;
width:2.1rem;
height:2.1rem;
border-radius:.58rem;
color:#fff;
background:linear-gradient(180deg,#2a84ff,#1664dc);
box-shadow:0 8px 18px rgba(32,110,253,.22);
letter-spacing:0;
}
.system-foundation-teaser{
background:linear-gradient(180deg,#f7faff,#edf4fb);
}
:root[data-theme=dark] .system-foundation-teaser{background:linear-gradient(180deg,#0a1727,#0c1d31)}
.system-foundation-teaser__head{margin-bottom:1.65rem}
.system-foundation-teaser__grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:1rem;
}
.system-foundation-teaser__grid article{
min-width:0;
padding:1.3rem;
border:1px solid var(--line);
border-radius:1.25rem;
background:linear-gradient(180deg,var(--surface),var(--surface-2));
box-shadow:var(--card-shadow);
}
.system-foundation-teaser__grid h3{font-size:1.12rem;margin-top:.7rem}
.system-foundation-teaser__grid p{font-size:.9rem;color:var(--muted);margin-top:.55rem}
.foundation-section{
position:relative;
overflow:hidden;
border-block:1px solid var(--line);
background:linear-gradient(180deg,var(--ice-50),#eef5fc);
}
:root[data-theme=dark] .foundation-section{background:linear-gradient(180deg,#081626,#0b1d31)}
.foundation-section::before{
content:"";
position:absolute;
width:34rem;
height:34rem;
right:-12rem;
top:-12rem;
border-radius:50%;
background:radial-gradient(circle,rgba(32,110,253,.12),transparent 68%);
pointer-events:none;
}
.foundation-intro{
display:grid;
grid-template-columns:minmax(0,1.25fr) minmax(16rem,.75fr);
gap:clamp(1.5rem,4vw,4rem);
align-items:end;
}
.foundation-intro h2{max-width:18ch}
.foundation-source-note{
display:grid;
grid-template-columns:auto 1fr;
gap:1rem;
align-items:center;
padding:1.15rem;
border:1px solid var(--line);
border-radius:1.25rem;
background:linear-gradient(180deg,var(--surface),var(--surface-2));
box-shadow:var(--card-shadow);
}
.foundation-source-note__index{
display:grid;
place-items:center;
width:4rem;
aspect-ratio:1;
border-radius:1rem;
background:linear-gradient(145deg,#2783ff,#0f5ed5);
color:#fff;
font:800 1.25rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;
box-shadow:0 12px 26px rgba(32,110,253,.24);
}
.foundation-source-note strong{display:block}
.foundation-source-note span:last-child{display:block;margin-top:.25rem;color:var(--muted);font-size:.84rem;line-height:1.45}
.foundation-controls{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(17rem,25rem);
gap:1rem;
align-items:center;
margin-top:2rem;
padding-top:1.25rem;
border-top:1px solid var(--line);
}
.foundation-filterbar{
display:flex;
flex-wrap:wrap;
gap:.5rem;
}
.foundation-filterbar button{
min-height:2.65rem;
padding:.5rem .78rem;
border:1px solid var(--line);
border-radius:.72rem;
background:var(--surface);
color:var(--muted);
cursor:pointer;
font-size:.82rem;
font-weight:720;
transition:all var(--transition);
}
.foundation-filterbar button:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.foundation-filterbar button[aria-pressed="true"]{
color:#fff;
background:linear-gradient(180deg,#2b7ff8,#1763dc);
border-color:#1763dc;
box-shadow:0 9px 20px rgba(32,110,253,.20);
}
.foundation-search input{
width:100%;
min-height:2.8rem;
padding:.65rem .85rem;
border:1px solid var(--line);
border-radius:.82rem;
background:var(--surface);
color:var(--text);
}
.foundation-search input:focus{border-color:var(--accent);outline:3px solid color-mix(in srgb,var(--accent) 22%,transparent);outline-offset:2px}
.foundation-count{
max-width:none;
margin-top:.85rem;
color:var(--muted);
font:650 .73rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;
text-transform:uppercase;
letter-spacing:.06em;
}
.foundation-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1rem;
margin-top:1rem;
}
.foundation-card{
display:grid;
grid-template-columns:auto minmax(0,1fr);
gap:1rem;
align-items:start;
min-height:100%;
padding:1.2rem;
border:1px solid var(--line);
border-radius:1.3rem;
background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 72%,var(--surface)));
box-shadow:var(--card-shadow);
transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}
.foundation-card:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:var(--card-shadow-hover);transform:translateY(-2px)}
.foundation-card[hidden]{display:none!important}
.foundation-card__number{
display:grid;
place-items:center;
width:2.35rem;
height:2.35rem;
border-radius:.65rem;
background:linear-gradient(180deg,#2b83ff,#1762d9);
color:#fff;
font:800 .72rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;
box-shadow:0 8px 18px rgba(32,110,253,.22);
}
.foundation-card__group{
display:block;
color:var(--accent-strong);
font-size:.7rem;
font-weight:800;
letter-spacing:.09em;
text-transform:uppercase;
}
.foundation-card h3{font-size:1.12rem;margin-top:.28rem}
.foundation-card p{margin-top:.58rem;color:var(--muted);font-size:.9rem;line-height:1.62;max-width:none}
.foundation-card p strong{color:var(--text)}
.foundation-card code{
padding:.1rem .28rem;
border-radius:.36rem;
background:var(--surface-3);
color:var(--text);
font-size:.82em;
}
.foundation-disclaimer{
margin-top:1rem;
padding:1rem 1.1rem;
border:1px solid var(--line);
border-radius:1rem;
background:color-mix(in srgb,var(--surface) 82%,transparent);
color:var(--muted);
font-size:.88rem;
}
.foundation-disclaimer strong{color:var(--text)}
/* Numbered module language inspired by the document system. */
.page-intro__meta::before{
content:"STATUS";
display:block;
margin-bottom:.45rem;
color:#8ec7ff;
font:800 .65rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;
letter-spacing:.12em;
}
.project-card,.practice-item,.verified-practice-grid article,.foundation-card,.core-skill{
overflow:hidden;
}
.project-card::before,.practice-item::before,.verified-practice-grid article::before{
content:"";
display:block;
width:2.6rem;
height:3px;
margin-bottom:.85rem;
border-radius:999px;
background:linear-gradient(90deg,var(--module-blue),var(--module-cyan));
}
@media (max-width:1050px){
.system-foundation-teaser__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
.section-heading,.foundation-intro,.foundation-controls{grid-template-columns:1fr}
.section-heading>p{justify-self:start}
.foundation-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
.system-foundation-teaser__grid{grid-template-columns:1fr}
.foundation-filterbar{
flex-wrap:nowrap;
overflow-x:auto;
padding-bottom:.3rem;
scroll-snap-type:x proximity;
}
.foundation-filterbar button{flex:0 0 auto;scroll-snap-align:start}
.foundation-source-note{grid-template-columns:auto minmax(0,1fr)}
.foundation-source-note__index{width:3.3rem}
.foundation-card{grid-template-columns:1fr}
.foundation-card__number{width:2.15rem;height:2.15rem}
}
@media (prefers-reduced-motion:reduce){
.core-skill:hover,.foundation-card:hover,.project-card:hover,.project-row:hover{transform:none}
}
/* ================================================================
RELEASE 4.6.4 FINAL · PUBLICATION POLISH
Transparenz, Projektstatus und finale visuelle Feinarbeit.
================================================================ */
.project-publication-strip{
display:grid;
grid-template-columns:minmax(0,1.1fr) minmax(24rem,.9fr);
gap:1.25rem;
align-items:center;
padding:1.1rem 1.2rem;
border:1px solid var(--line);
border-radius:1.15rem;
background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 96%,var(--accent) 4%),var(--surface));
box-shadow:0 14px 38px rgba(7,25,47,.06)
}
.project-publication-strip__lead{display:grid;gap:.55rem;min-width:0}
.project-publication-strip__lead p{max-width:72ch;color:var(--muted);font-size:.92rem}
.project-publication-strip__lead strong{color:var(--text)}
.project-publication-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:0}
.project-publication-facts>div{min-width:0;padding:.72rem .8rem;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);border-radius:.8rem;background:color-mix(in srgb,var(--surface-2) 84%,transparent)}
.project-publication-facts dt{font-size:.66rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.project-publication-facts dd{margin-top:.2rem;font-size:.82rem;font-weight:720;color:var(--text);overflow-wrap:anywhere}
.publication-standard{
display:grid;
grid-template-columns:auto minmax(0,1fr);
gap:.8rem;
align-items:start;
margin-top:1.3rem;
padding:1rem 1.05rem;
border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
border-radius:1rem;
background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface));
}
.publication-standard__mark{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.62rem;background:var(--accent);color:var(--accent-contrast);font-weight:850;line-height:1}
.publication-standard p{margin:0;color:var(--muted);font-size:.9rem}
.publication-standard strong{color:var(--text)}
.project-rights-caption{margin-top:.8rem;color:var(--muted);font-size:.78rem;max-width:78ch}
.project-live-panel{border-radius:1.25rem;padding:clamp(1.1rem,2.4vw,1.6rem);border:1px solid var(--line);background:var(--surface);box-shadow:0 16px 42px rgba(7,25,47,.06)}
.project-live-facts{border-radius:.95rem;overflow:hidden}
.project-live-copy .status{margin-bottom:.1rem}
.legal-project-grid{border-radius:1rem;overflow:hidden}
.legal-project-grid article{min-height:100%}
.project-legal-links a{font-size:.9rem}
@media (max-width:900px){
.project-publication-strip{grid-template-columns:1fr}
}
@media (max-width:560px){
.project-publication-facts{grid-template-columns:1fr}
.project-publication-strip{padding:.95rem}
.publication-standard{grid-template-columns:1fr}
}
/* ================================================================
HTML · CSS · JAVASCRIPT INTEGRATION AUDIT · RELEASE 4.6.7
Final cascade corrections after cross-layer contract validation.
================================================================ */
/* JS state is progressive enhancement only; never hard-code .has-js in HTML. */
.carousel-dot[aria-current="true"]{background:transparent;box-shadow:none}
.carousel-dot[aria-current="true"]::after{background:var(--holo-cyan);box-shadow:0 0 14px color-mix(in srgb,var(--holo-cyan) 50%,transparent)}
/* Native hidden semantics must always win for JS-driven filters. */
[hidden]{display:none!important}
/* Disabled form controls expose their state visually as well as semantically. */
.button:disabled,button:disabled{cursor:not-allowed;opacity:.62;transform:none!important}
/* RELEASE 4.6.7 · Mobile navigation stacking hardening */
@media (max-width:1040px){
.site-header{position:sticky;top:0;z-index:100}
.has-js .site-nav{z-index:10}
.has-js .nav-toggle,.icon-button{position:relative;z-index:11}
}
/* Mobile navigation visual contract: dedicated dark menu colors, independent
from the light-theme surface tokens used by the desktop navigation. */
@media (max-width:1040px){
.has-js .site-nav{
background:#07162b;
border-bottom-color:rgba(255,255,255,.11);
box-shadow:0 26px 62px rgba(2,9,19,.34);
}
.site-header .has-js .site-nav a,
.site-header .site-nav a{
color:rgba(238,246,255,.82);
background:transparent;
border-color:transparent;
border-bottom-color:rgba(255,255,255,.10);
box-shadow:none;
}
.site-header .site-nav a:hover,
.site-header .site-nav a:focus-visible{
color:#fff;
background:rgba(255,255,255,.065);
}
.site-header .site-nav a[aria-current="page"]{
color:#fff;
background:linear-gradient(180deg,#2c7dff,#1760e3);
border-left-color:transparent;
border-bottom-color:transparent;
box-shadow:0 12px 28px rgba(32,110,253,.25);
}
.site-header .site-nav a.nav-featured{
color:#eef6ff;
background:rgba(32,110,253,.16);
border-color:rgba(100,174,255,.18);
border-bottom-color:rgba(100,174,255,.18);
}
.site-header .site-nav a.nav-featured:hover,
.site-header .site-nav a.nav-featured:focus-visible{
color:#fff;
background:rgba(32,110,253,.24);
}
.site-header .site-nav a.nav-featured[aria-current="page"]{
color:#fff;
background:linear-gradient(180deg,#2c7dff,#1760e3);
border-color:transparent;
}
.site-nav .nav-featured::after{opacity:.55}
}
/* ================================================================
DEEP RELEASE AUDIT · RELEASE 4.6.7
Progressive-enhancement, no-JS and cross-layer hardening.
================================================================ */
/* If the core site script cannot run, controls that require JavaScript must
not look interactive. The static content remains fully readable. */
html:not(.has-js) [data-theme-toggle]{display:none!important}
/* Systemtechnik controls are exposed only after foundations.js has mounted. */
.foundation-controls,.foundation-count{display:none}
[data-foundation-explorer].is-foundation-enhanced .foundation-controls{display:grid}
[data-foundation-explorer].is-foundation-enhanced .foundation-count{display:block}
/* Project filters are exposed only after projects.js has mounted them. */
.has-js .project-filters,.has-js .project-filter-status{display:none}
.project-filter-panel.is-project-filters-enhanced .project-filters{display:flex}
.project-filter-panel.is-project-filters-enhanced .project-filter-status{display:block}
/* Carousel controls follow the carousel script, not merely the core JS flag. */
.has-js .carousel-control,.has-js .carousel-dots,.carousel-accessibility-controls{display:none}
.carousel.is-carousel-enhanced .carousel-control{display:grid;place-items:center}
.carousel.is-carousel-enhanced .carousel-dots{display:flex}
.carousel.is-carousel-enhanced .carousel-accessibility-controls{display:flex}
/* No-JS mobile navigation uses the same dark visual contract as the enhanced
menu, avoiding light surfaces with light text. */
@media (max-width:1040px){
html:not(.has-js) .site-nav-nojs{
padding:.65rem;
border:1px solid rgba(255,255,255,.10);
border-radius:1rem;
background:#07162b;
}
html:not(.has-js) .site-nav-nojs a,
.site-header html:not(.has-js) .site-nav-nojs a{
color:rgba(238,246,255,.84);
background:rgba(255,255,255,.045);
border-color:rgba(255,255,255,.10);
}
html:not(.has-js) .site-nav-nojs a:hover,
html:not(.has-js) .site-nav-nojs a:focus-visible{
color:#fff;
background:rgba(255,255,255,.09);
}
}
/* Static fallback copy in dynamic mounts should look intentional. */
.practice-explorer-fallback{
max-width:62ch;
padding:1rem 1.1rem;
border:1px solid var(--line);
border-radius:1rem;
background:var(--surface-2);
}
/* ================================================================
TYPE & EDGE RHYTHM · RELEASE 4.6.8
Consistent page gutters, readable line length and safe-area spacing.
================================================================ */
:root{
--page-gutter:clamp(1.5rem,3vw,2.25rem);
--reading:44rem;
}
.container{
width:min(
calc(
100% - max(var(--page-gutter),env(safe-area-inset-left,0px))
- max(var(--page-gutter),env(safe-area-inset-right,0px))
),
var(--content)
);
margin-inline:auto;
}
p,li,dd{max-width:68ch}
.lead{max-width:60ch}
.page-intro__meta{line-height:1.62}
@media (max-width:900px){
:root{--page-gutter:clamp(1.25rem,3.5vw,1.75rem)}
}
@media (max-width:620px){
:root{--page-gutter:clamp(1rem,4.6vw,1.25rem)}
.page-intro__meta{padding-inline:1rem}
.hero-facts>div{padding-inline:1rem}
.practice-item,.verified-practice-grid article{padding-inline:1rem}
.contact-aside,.contact-form-shell,.case-nav,.legal-nav{padding-inline:1rem}
}
@media (max-width:420px){
.page-intro__meta{padding-inline:.95rem}
}
@media (max-width:360px){
:root{--page-gutter:1rem}
}
/* ================================================================
MOBILE NAVIGATION REDESIGN · RELEASE 4.6.9
Dedicated off-canvas navigation with stable viewport anchoring,
backdrop separation and restrained active-state hierarchy.
================================================================ */
@media (max-width:1180px){
:root{
--header-height:4.75rem;
--mobile-nav-width:min(92vw,27rem);
}
/* Keep the fixed drawer anchored to the viewport. A filtered ancestor can
otherwise become a containing block for fixed descendants. */
.site-header{
position:sticky;
top:0;
z-index:100;
min-height:var(--header-height);
padding-top:env(safe-area-inset-top,0px);
border-bottom:0;
background:rgba(7,22,43,.98);
-webkit-backdrop-filter:none;
backdrop-filter:none;
box-shadow:0 1px 0 rgba(255,255,255,.10),0 10px 30px rgba(2,9,19,.16);
}
.header-inner{min-height:var(--header-height)}
/* Modal-like visual backdrop. It remains below the sticky header/drawer so
the close control is always reachable. */
body::after{
content:"";
position:fixed;
inset:0;
z-index:80;
pointer-events:none;
visibility:hidden;
opacity:0;
background:rgba(2,8,17,.62);
-webkit-backdrop-filter:blur(3px);
backdrop-filter:blur(3px);
transition:opacity 180ms ease,visibility 180ms ease;
}
body.nav-open::after{
pointer-events:auto;
visibility:visible;
opacity:1;
}
body.nav-open{overflow:hidden;overscroll-behavior:none}
.has-js .nav-toggle{display:grid;z-index:103}
.has-js .site-nav{
position:fixed;
z-index:102;
top:calc(var(--header-height) + env(safe-area-inset-top,0px));
right:0;
bottom:0;
left:auto;
inset-block-end:0;
width:var(--mobile-nav-width);
height:auto;
max-height:none;
padding:1rem max(1rem,env(safe-area-inset-right,0px)) max(1.15rem,env(safe-area-inset-bottom,0px)) 1rem;
overflow-x:hidden;
overflow-y:auto;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
background:linear-gradient(180deg,#07162b 0%,#081a32 100%);
border:0;
border-left:1px solid rgba(255,255,255,.10);
border-radius:0 0 0 1.35rem;
box-shadow:-28px 32px 78px rgba(0,0,0,.34);
transform:translate3d(104%,0,0);
visibility:hidden;
opacity:0;
transition-property:transform,opacity,visibility;
transition-duration:240ms,170ms,0s;
transition-timing-function:cubic-bezier(.2,.75,.2,1),ease,linear;
transition-delay:0s,0s,240ms;
will-change:transform;
}
.has-js .site-nav.is-open{
transform:translate3d(0,0,0);
visibility:visible;
opacity:1;
transition-delay:0s,0s,0s;
}
.has-js .site-nav ul{
display:grid;
width:100%;
margin:0;
gap:.28rem;
}
.has-js .site-nav ul::before{
content:"Navigation";
display:block;
padding:.2rem .72rem .58rem;
color:rgba(214,230,246,.58);
font:750 .68rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
letter-spacing:.12em;
text-transform:uppercase;
}
.site-header .site-nav a,
.site-header .has-js .site-nav a{
position:relative;
display:flex;
align-items:center;
min-height:3.15rem;
padding:.72rem .82rem;
border:1px solid transparent;
border-radius:.82rem;
background:transparent;
color:rgba(238,246,255,.78);
font-size:.98rem;
font-weight:680;
line-height:1.2;
text-decoration:none;
box-shadow:none;
transition:background 150ms ease,color 150ms ease,border-color 150ms ease,transform 150ms ease;
}
.site-header .site-nav a:hover,
.site-header .site-nav a:focus-visible{
color:#fff;
background:rgba(255,255,255,.065);
border-color:rgba(255,255,255,.08);
}
.site-header .site-nav a[aria-current="page"]{
color:#fff;
background:rgba(32,110,253,.15);
border-color:rgba(88,158,255,.20);
box-shadow:inset 3px 0 0 #4ea4ff;
}
.site-header .site-nav a.nav-featured{
color:#eaf4ff;
background:rgba(32,110,253,.08);
border-color:rgba(88,158,255,.12);
}
.site-header .site-nav a.nav-featured:hover,
.site-header .site-nav a.nav-featured:focus-visible{
color:#fff;
background:rgba(32,110,253,.14);
border-color:rgba(88,158,255,.22);
}
.site-header .site-nav a.nav-featured[aria-current="page"]{
color:#fff;
background:rgba(32,110,253,.15);
border-color:rgba(88,158,255,.20);
box-shadow:inset 3px 0 0 #4ea4ff;
}
.site-nav .nav-featured::after{display:none}
/* The toggle is intentionally quieter than the active nav item. */
.nav-toggle[aria-expanded="true"]{
background:rgba(255,255,255,.10);
border-color:rgba(116,181,255,.32);
box-shadow:0 0 0 3px rgba(32,110,253,.08);
}
}
@media (max-width:620px){
:root{
--header-height:4.35rem;
--mobile-nav-width:min(92vw,24rem);
}
.site-header{min-height:var(--header-height)}
.header-inner{min-height:var(--header-height)}
.has-js .site-nav{
top:calc(var(--header-height) + env(safe-area-inset-top,0px));
padding-top:.85rem;
}
}
@media (max-width:360px){
:root{--mobile-nav-width:94vw}
.has-js .site-nav{padding-left:.8rem;padding-right:max(.8rem,env(safe-area-inset-right,0px))}
.site-header .site-nav a,.site-header .has-js .site-nav a{padding-inline:.72rem}
}
@media (max-width:1180px) and (max-height:560px) and (orientation:landscape){
:root{--mobile-nav-width:min(70vw,32rem)}
.has-js .site-nav{padding-top:.7rem}
.has-js .site-nav ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:.25rem .45rem}
.has-js .site-nav ul::before{grid-column:1/-1;padding-bottom:.4rem}
.site-header .site-nav a,.site-header .has-js .site-nav a{min-height:2.65rem;padding:.5rem .72rem}
}
@media (prefers-reduced-motion:reduce){
body::after,.has-js .site-nav{transition:none!important}
}
/* ================================================================
FIRST-CLASS RESPONSIVE HEADER · RELEASE 4.7.0
One header system for wide desktop, compact laptops, tablets and phones.
================================================================ */
:root{
--header-desktop-height:5.25rem;
--header-desktop-compact:4.65rem;
}
.site-header{
isolation:isolate;
transition:background-color 180ms ease,box-shadow 180ms ease,border-color 180ms ease;
}
.site-header::after{
content:"";
position:absolute;
z-index:-1;
left:0;right:0;bottom:-1px;
height:1px;
background:linear-gradient(90deg,transparent 0%,rgba(32,110,253,.28) 24%,rgba(25,169,255,.34) 50%,rgba(32,110,253,.20) 76%,transparent 100%);
pointer-events:none;
}
.header-inner{
position:relative;
transition:min-height 180ms ease,padding 180ms ease;
}
.brand{
flex:0 1 auto;
min-width:0;
gap:.72rem;
border-radius:.9rem;
padding:.28rem .35rem .28rem .28rem;
transition:background 160ms ease,color 160ms ease;
}
.brand:hover{background:rgba(255,255,255,.045);color:#fff}
.brand-logo{
width:2.55rem;
height:2.55rem;
border-radius:.82rem;
box-shadow:0 8px 20px rgba(0,0,0,.18);
transition:width 180ms ease,height 180ms ease,box-shadow 180ms ease;
}
.brand-copy{gap:.18rem;line-height:1}
.brand-copy span{
font-size:1rem;
font-weight:790;
letter-spacing:-.018em;
}
.brand-copy small{
margin:0;
font-size:.62rem;
line-height:1.25;
font-weight:690;
letter-spacing:.085em;
color:rgba(226,238,250,.66);
}
.nav-shell{min-width:0;gap:.55rem}
.icon-button,.nav-toggle{
width:2.65rem;
height:2.65rem;
min-width:2.65rem;
border-radius:.82rem;
background:rgba(255,255,255,.045);
border-color:rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.icon-button:hover,.nav-toggle:hover{
background:rgba(255,255,255,.085);
border-color:rgba(126,186,255,.30);
}
.theme-icon{width:1.12rem;height:1.12rem}
/* Full desktop header only when all eight links have enough room. */
@media (min-width:1181px){
.site-header{
min-height:var(--header-desktop-height);
background:linear-gradient(180deg,rgba(7,22,43,.955),rgba(7,22,43,.90));
box-shadow:0 1px 0 rgba(255,255,255,.08),0 12px 34px rgba(3,11,23,.10);
-webkit-backdrop-filter:blur(18px) saturate(135%);
backdrop-filter:blur(18px) saturate(135%);
}
.header-inner{min-height:var(--header-desktop-height);gap:1.1rem}
.site-nav{
min-width:0;
padding:.25rem;
border:1px solid rgba(255,255,255,.075);
border-radius:1rem;
background:rgba(255,255,255,.026);
box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.site-nav ul{gap:.04rem}
.site-header .site-nav a{
min-height:2.42rem;
padding:.54rem .58rem;
border:1px solid transparent;
border-radius:.72rem;
color:rgba(232,241,251,.72);
font-size:clamp(.79rem,.72rem + .08vw,.88rem);
font-weight:680;
line-height:1;
white-space:nowrap;
transition:background 150ms ease,color 150ms ease,border-color 150ms ease,box-shadow 150ms ease;
}
.site-header .site-nav a:hover,
.site-header .site-nav a:focus-visible{
color:#fff;
background:rgba(255,255,255,.06);
border-color:rgba(255,255,255,.07);
}
.site-header .site-nav a[aria-current="page"]{
color:#fff;
background:linear-gradient(180deg,rgba(48,124,255,.19),rgba(32,110,253,.10));
border-color:rgba(92,163,255,.20);
box-shadow:inset 0 -2px 0 #4ea4ff;
}
.site-header .site-nav a.nav-featured{
color:#eaf4ff;
background:rgba(32,110,253,.075);
border-color:rgba(92,163,255,.10);
}
.site-header .site-nav a.nav-featured:hover,
.site-header .site-nav a.nav-featured:focus-visible{background:rgba(32,110,253,.13)}
.site-nav .nav-featured::after{display:none}
/* Restrained compact state after the page starts moving. */
.site-header.is-scrolled{
min-height:var(--header-desktop-compact);
background:rgba(6,18,36,.965);
box-shadow:0 1px 0 rgba(255,255,255,.09),0 12px 34px rgba(2,8,18,.20);
}
.site-header.is-scrolled .header-inner{min-height:var(--header-desktop-compact)}
.site-header.is-scrolled .brand-logo{width:2.3rem;height:2.3rem}
.site-header.is-scrolled .brand-copy small{opacity:.82}
}
/* Small desktop / large tablet: off-canvas nav, full brand identity. */
@media (min-width:621px) and (max-width:1180px){
:root{--header-height:4.8rem}
.site-header{min-height:var(--header-height)}
.header-inner{min-height:var(--header-height);gap:.8rem}
.brand-logo{width:2.35rem;height:2.35rem}
.brand-copy span{font-size:.96rem}
.brand-copy small{display:block;font-size:.59rem}
.nav-shell{gap:.5rem}
.has-js .site-nav{top:calc(var(--header-height) + env(safe-area-inset-top,0px))}
}
/* Phones: compact, balanced, still clearly branded. */
@media (max-width:620px){
:root{--header-height:4.35rem}
.site-header{min-height:var(--header-height)}
.header-inner{min-height:var(--header-height);gap:.5rem}
.brand{gap:.56rem;padding:.2rem .22rem .2rem .18rem;max-width:calc(100% - 5.65rem)}
.brand-logo{width:2.1rem;height:2.1rem;border-radius:.72rem}
.brand-copy span{font-size:.91rem}
.brand-copy small{display:none}
.nav-shell{gap:.38rem}
.icon-button,.nav-toggle{width:2.55rem;height:2.55rem;min-width:2.55rem;border-radius:.76rem}
.has-js .site-nav{top:calc(var(--header-height) + env(safe-area-inset-top,0px))}
}
@media (max-width:380px){
.brand{max-width:calc(100% - 5.35rem)}
.brand-logo{width:1.95rem;height:1.95rem}
.brand-copy span{font-size:.86rem}
.icon-button,.nav-toggle{width:2.45rem;height:2.45rem;min-width:2.45rem}
}
@media (max-width:330px){
.brand-copy span{font-size:.82rem}
.brand-logo{width:1.85rem;height:1.85rem}
.brand{gap:.46rem}
}
@media (prefers-reduced-motion:reduce){
.site-header,.header-inner,.brand-logo{transition:none!important}
}
/* No-JavaScript parity for the widened 1180px header breakpoint. */
html:not(.has-js) [data-theme-toggle]{display:none}
@media (max-width:1180px){
html:not(.has-js) .header-inner{
min-height:auto;
align-items:center;
flex-wrap:wrap;
padding-block:.65rem;
}
html:not(.has-js) .site-nav{display:none}
html:not(.has-js) .nav-toggle{display:none}
html:not(.has-js) .site-nav-nojs{
display:block;
order:3;
width:100%;
margin-top:.5rem;
padding:.6rem 0 .1rem;
border-top:1px solid rgba(255,255,255,.10);
}
html:not(.has-js) .site-nav-nojs ul{
display:flex;
flex-wrap:wrap;
gap:.35rem;
margin:0;
padding:0;
list-style:none;
}
html:not(.has-js) .site-nav-nojs a{
display:flex;
align-items:center;
min-height:2.65rem;
padding:.52rem .72rem;
border:1px solid rgba(255,255,255,.10);
border-radius:.72rem;
background:rgba(255,255,255,.045);
color:rgba(238,246,255,.82);
text-decoration:none;
}
html:not(.has-js) .site-nav-nojs a:hover,
html:not(.has-js) .site-nav-nojs a:focus-visible{
color:#fff;
background:rgba(255,255,255,.08);
}
}
@media (max-width:1180px){
html:not(.has-js) .nav-shell{
order:3;
flex:1 1 100%;
width:100%;
min-width:0;
flex-wrap:wrap;
}
html:not(.has-js) .site-nav-nojs{
width:100%;
min-width:0;
}
html:not(.has-js) .site-nav-nojs ul{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(8.25rem,1fr));
width:100%;
min-width:0;
}
html:not(.has-js) .site-nav-nojs li,
html:not(.has-js) .site-nav-nojs a{min-width:0;max-width:none}
}
@media (max-width:420px){
html:not(.has-js) .site-nav-nojs ul{grid-template-columns:repeat(2,minmax(0,1fr))}
html:not(.has-js) .site-nav-nojs a{font-size:.88rem;padding-inline:.6rem}
}
/* ==================================================================
FIRST-CLASS FOOTER · CONSOLIDATED IN RELEASE 4.8.0
Unified brand, navigation and utility architecture across devices.
================================================================== */
.site-footer{
position:relative;
isolation:isolate;
overflow:hidden;
padding-block:clamp(3.4rem,5vw,5.1rem) max(1.35rem,calc(1rem + env(safe-area-inset-bottom,0px)));
border-top:0;
background:
radial-gradient(44rem 24rem at 8% -16%,rgba(32,110,253,.18),transparent 64%),
radial-gradient(34rem 22rem at 92% 108%,rgba(25,169,255,.08),transparent 72%),
linear-gradient(180deg,#08182b 0%,#061321 56%,#050f1b 100%);
color:#eef5fc;
}
.site-footer::before{
content:"";
position:absolute;
z-index:0;
inset:0 0 auto;
height:1px;
background:linear-gradient(90deg,transparent 0%,rgba(25,169,255,.32) 12%,#4b8fff 43%,#19a9ff 68%,transparent 100%);
opacity:1;
}
.site-footer::after{
content:"";
position:absolute;
z-index:0;
right:-8rem;
top:-12rem;
width:30rem;
height:30rem;
border-radius:50%;
background:radial-gradient(circle,rgba(32,110,253,.10),transparent 68%);
pointer-events:none;
}
.footer-shell{position:relative;z-index:1}
.footer-primary{
display:grid;
grid-template-columns:minmax(18rem,.92fr) minmax(0,1.42fr);
gap:clamp(2.5rem,5vw,5.5rem);
align-items:start;
}
.footer-brand-panel{min-width:0;max-width:37rem}
.footer-identity{
display:inline-flex;
align-items:center;
gap:1rem;
min-width:0;
color:#f7fbff;
text-decoration:none;
}
.footer-brand-logo{
flex:0 0 auto;
width:3.7rem;
height:3.7rem;
border-radius:1rem;
box-shadow:0 15px 34px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.07);
}
.footer-identity__copy{display:grid;gap:.22rem;min-width:0}
.footer-identity__copy strong{
color:#fff;
font-size:1.08rem;
font-weight:780;
letter-spacing:-.018em;
transition:color var(--transition);
}
.footer-identity__copy small{
color:rgba(225,238,250,.68);
font-size:.78rem;
font-weight:620;
line-height:1.45;
}
.footer-identity:hover strong{color:#a9d8ff}
.footer-statement{
max-width:34rem;
margin:1.25rem 0 0;
color:rgba(225,238,250,.72);
font-size:.94rem;
line-height:1.72;
}
.footer-proof-list{
display:flex;
flex-wrap:wrap;
gap:.5rem;
margin-top:1.25rem;
}
.footer-proof{
display:inline-flex;
align-items:center;
gap:.45rem;
min-height:2.1rem;
padding:.38rem .68rem;
border:1px solid rgba(255,255,255,.10);
border-radius:999px;
background:rgba(255,255,255,.045);
color:rgba(233,242,251,.72);
font:690 .7rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
letter-spacing:.035em;
white-space:nowrap;
}
.footer-proof__dot{
width:.46rem;
height:.46rem;
border-radius:50%;
background:#55c9ff;
box-shadow:0 0 0 3px rgba(85,201,255,.10),0 0 14px rgba(85,201,255,.48);
}
.footer-nav{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:clamp(1.35rem,3vw,2.5rem);
min-width:0;
}
.footer-nav-group{min-width:0}
.site-footer .footer-title{
margin:0 0 .85rem;
color:#f4f8fd;
font-size:.72rem;
font-weight:800;
letter-spacing:.12em;
line-height:1.35;
text-transform:uppercase;
}
.footer-nav-links{list-style:none;margin:0;padding:0}
.footer-nav-links li+li{margin-top:.14rem}
.footer-nav-links a{
position:relative;
display:inline-flex;
align-items:center;
min-height:2.35rem;
max-width:100%;
padding:.3rem .1rem;
color:rgba(225,238,250,.72);
font-size:.88rem;
font-weight:620;
line-height:1.4;
text-decoration:none;
transition:color var(--transition),transform var(--transition);
}
.footer-nav-links a::after{
content:"";
position:absolute;
left:.1rem;
right:100%;
bottom:.2rem;
height:1px;
background:#55b6ff;
transition:right var(--transition);
}
.footer-nav-links a:hover{color:#fff;transform:translateX(.1rem)}
.footer-nav-links a:hover::after{right:.1rem}
.footer-utility{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:1.25rem 2rem;
align-items:center;
margin-top:clamp(2.6rem,4vw,3.6rem);
padding-top:1.35rem;
border-top:1px solid rgba(255,255,255,.10);
}
.site-footer .footer-rights__copy{
display:grid;
gap:.25rem;
color:rgba(225,238,250,.58);
font-size:.76rem;
line-height:1.55;
}
.footer-rights__copy p{max-width:68ch;margin:0}
.footer-work-meta{
display:flex;
flex-wrap:nowrap;
align-items:center;
justify-content:flex-end;
gap:.55rem;
min-width:0;
}
.footer-work-status,.footer-work-id{
min-height:2.65rem;
border:1px solid rgba(255,255,255,.11);
border-radius:.78rem;
background:rgba(255,255,255,.045);
color:rgba(232,242,251,.7);
box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
font-size:.7rem;
font-weight:680;
}
.footer-work-status{
display:inline-flex;
align-items:center;
gap:.48rem;
padding:.56rem .76rem;
white-space:nowrap;
}
.footer-work-status>span{
width:.46rem;
height:.46rem;
border-radius:50%;
background:#55c9ff;
box-shadow:0 0 0 3px rgba(85,201,255,.09),0 0 12px rgba(85,201,255,.4);
}
.footer-work-id{
display:inline-flex;
align-items:center;
gap:.5rem;
max-width:100%;
padding:.5rem .66rem .5rem .76rem;
cursor:pointer;
transition:background var(--transition),border-color var(--transition),color var(--transition),transform var(--transition);
}
.footer-work-id:hover{
transform:translateY(-1px);
border-color:rgba(85,182,255,.38);
background:rgba(85,182,255,.09);
color:#fff;
}
.footer-work-id:active{transform:none}
.footer-work-id.is-copied{border-color:rgba(85,201,255,.48);color:#cdeaff}
.site-footer .footer-work-id__label{color:rgba(225,238,250,.56);font-weight:760;white-space:nowrap}
.site-footer .footer-work-id code{
min-width:0;
max-width:18rem;
overflow:hidden;
color:#edf7ff;
font:700 .68rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
letter-spacing:.015em;
text-overflow:ellipsis;
white-space:nowrap;
}
.footer-work-id svg{flex:0 0 auto;width:.95rem;height:.95rem;fill:currentColor}
.site-footer .footer-copy-feedback{
min-height:1.15rem;
margin:.45rem 0 0;
color:#a9dfff;
font-size:.72rem;
font-weight:680;
}
@media (max-width:1080px){
.footer-primary{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:2.5rem}
.footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.65rem 2rem}
.footer-nav-group:last-child{grid-column:1 / -1}
.footer-nav-group:last-child .footer-nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.5rem}
.footer-utility{grid-template-columns:1fr;align-items:start}
.footer-work-meta{justify-content:flex-start}
}
@media (max-width:760px){
.site-footer{padding-top:3.2rem}
.footer-primary{grid-template-columns:1fr;gap:2.4rem}
.footer-brand-panel{max-width:38rem}
.footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem 1.4rem}
.footer-nav-group:last-child{grid-column:1 / -1}
.footer-nav-group:last-child .footer-nav-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.footer-utility{margin-top:2.5rem;padding-top:1.2rem}
.footer-work-meta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%}
.footer-work-status,.footer-work-id{width:100%;justify-content:flex-start}
}
@media (max-width:520px){
.site-footer{padding-top:2.8rem}
.footer-identity{gap:.8rem}
.footer-brand-logo{width:3.2rem;height:3.2rem;border-radius:.9rem}
.footer-identity__copy strong{font-size:1rem}
.footer-identity__copy small{font-size:.73rem}
.footer-statement{font-size:.9rem;line-height:1.66}
.footer-nav{grid-template-columns:1fr;gap:1.55rem}
.footer-nav-group:last-child{grid-column:auto}
.footer-nav-group:last-child .footer-nav-links{grid-template-columns:1fr}
.footer-nav-links{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:.18rem 1rem;
}
.footer-nav-group:nth-child(2) .footer-nav-links,
.footer-nav-group:nth-child(3) .footer-nav-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.footer-work-meta{grid-template-columns:1fr}
.footer-work-status,.footer-work-id{min-height:2.8rem}
.site-footer .footer-work-id code{max-width:none;flex:1 1 auto}
}
@media (max-width:360px){
.footer-proof-list{display:grid;grid-template-columns:1fr 1fr}
.footer-proof:first-child{grid-column:1 / -1}
.footer-proof{justify-content:center;white-space:normal;text-align:center}
.footer-nav-links,
.footer-nav-group:nth-child(2) .footer-nav-links,
.footer-nav-group:nth-child(3) .footer-nav-links{grid-template-columns:1fr}
.footer-nav-links a{min-height:2.55rem}
}
@media (max-height:520px) and (orientation:landscape){
.site-footer{padding-top:2.6rem}
.footer-primary{gap:2rem}
.footer-nav{gap:1rem 1.5rem}
.footer-utility{margin-top:2rem}
}
@media (hover:none){
.footer-nav-links a:hover,.footer-work-id:hover{transform:none}
}
@media (prefers-reduced-motion:reduce){
.footer-nav-links a,.footer-nav-links a::after,.footer-work-id{transition:none}
}
/* Tablet footer balance: brand first, navigation as a clean three-column band. */
@media (max-width:900px) and (min-width:641px){
.footer-primary{grid-template-columns:1fr;gap:2.35rem}
.footer-brand-panel{max-width:42rem}
.footer-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem 1.8rem}
.footer-nav-group:last-child{grid-column:auto}
.footer-nav-group:last-child .footer-nav-links{display:block}
}
@media (max-width:640px) and (min-width:521px){
.footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.55rem 1.4rem}
.footer-nav-group:last-child{grid-column:1 / -1}
.footer-nav-group:last-child .footer-nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1rem}
}
/* ==================================================================
FULL-SITE FIRST CLASS · RELEASE 4.8.0
Final unified visual system: typography, rhythm, surfaces, controls,
content hierarchy and device-independent sticky geometry.
================================================================== */
:root{
--content:80rem;
--reading:44rem;
--header-offset:var(--header-desktop-height,5.25rem);
--section-space:clamp(4rem,7vw,6.75rem);
--section-space-compact:clamp(3rem,5.4vw,5rem);
--card-radius:1.3rem;
--card-padding:clamp(1.15rem,2vw,1.55rem);
--card-shadow:0 1px 2px rgba(7,25,47,.04),0 14px 38px rgba(7,25,47,.075);
--card-shadow-hover:0 2px 4px rgba(7,25,47,.05),0 22px 54px rgba(7,25,47,.12);
--focus-ring:color-mix(in srgb,var(--accent) 34%,transparent);
}
:root[data-theme=dark]{
--card-shadow:0 1px 2px rgba(0,0,0,.18),0 18px 46px rgba(0,0,0,.22);
--card-shadow-hover:0 2px 5px rgba(0,0,0,.2),0 26px 64px rgba(0,0,0,.32);
}
html{
scroll-padding-top:calc(var(--header-offset) + 1.1rem);
scrollbar-color:color-mix(in srgb,var(--accent) 52%,var(--line)) var(--bg);
}
body{
font-size:clamp(1rem,.975rem + .11vw,1.075rem);
line-height:1.7;
font-kerning:normal;
font-synthesis:none;
}
p,li,dd{max-width:68ch;text-wrap:pretty}
h1,h2,h3,h4{text-wrap:balance}
.site-main :is(section,article,details)[id]{scroll-margin-top:calc(var(--header-offset) + 1.25rem)}
.container{width:min(calc(100% - (var(--page-gutter) * 2)),var(--content))}
.reading{max-width:var(--reading)}
.section{padding-block:var(--section-space)}
.section--compact{padding-block:var(--section-space-compact)}
.section--surface,.section--tint{position:relative}
.section--surface{background:color-mix(in srgb,var(--surface) 96%,var(--bg))}
.section--tint{background:color-mix(in srgb,var(--surface-2) 82%,var(--bg))}
.section-heading{
grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
gap:clamp(1.5rem,4.2vw,4.25rem);
margin-bottom:clamp(1.8rem,3.5vw,2.8rem);
}
.section-heading h2{max-width:18ch;font-size:clamp(2rem,1.65rem + 1.35vw,3rem);letter-spacing:-.04em}
.section-heading>p,.section-heading .lead{max-width:58ch;line-height:1.62}
.eyebrow{margin-bottom:.9rem;font-size:.74rem;letter-spacing:.14em}
.eyebrow::before{width:1.8rem}
.lead{max-width:60ch;line-height:1.6}
/* Controls: one tactile language everywhere. */
.button{
min-height:3rem;
padding:.72rem 1.08rem;
border-radius:.78rem;
box-shadow:0 1px 2px rgba(7,25,47,.06);
}
.button--primary{box-shadow:0 10px 28px rgba(32,110,253,.23),inset 0 1px 0 rgba(255,255,255,.16)}
.button--secondary,.button--quiet{box-shadow:0 1px 2px rgba(7,25,47,.035)}
.text-link{min-height:2.35rem;text-underline-offset:.22em}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{
outline:3px solid var(--focus-ring);
outline-offset:3px;
}
/* Premium surface language across all content cards. */
:is(.project-row,.project-card,.week-card,.practice-day-card,.foundation-card,.verified-practice-card,
.competency-grid article,.final-day-list article,.practice-principles article,.document-card,
.contact-aside,.contact-form-shell,.legal-nav,.legal-content,.cv-panel,.info-band,.goal-panel,
.featured-project,.projects-feature,.internship-hero__panel,.project-live-panel,.reflection-card){
border-radius:var(--card-radius);
box-shadow:var(--card-shadow);
}
:is(.project-row,.project-card,.week-card,.practice-day-card,.foundation-card,.verified-practice-card,
.competency-grid article,.final-day-list article,.practice-principles article,.document-card){
border-color:color-mix(in srgb,var(--line) 92%,transparent);
}
@media (hover:hover) and (pointer:fine){
:is(.project-row,.project-card,.week-card,.practice-day-card,.foundation-card,.verified-practice-card,
.competency-grid article,.final-day-list article,.practice-principles article,.document-card):hover{
transform:translateY(-2px);
border-color:color-mix(in srgb,var(--accent) 34%,var(--line));
box-shadow:var(--card-shadow-hover);
}
}
/* Hero and page introduction: stronger editorial balance. */
.hero{padding-block:clamp(4.1rem,7vw,6.7rem)}
.hero-grid{grid-template-columns:minmax(0,1.04fr) minmax(25rem,.96fr);gap:clamp(2.5rem,5vw,5.5rem)}
.hero h1{max-width:12ch;font-size:clamp(3rem,2.05rem + 3.25vw,5rem);line-height:.98;letter-spacing:-.055em}
.hero .lead{margin-top:1.35rem}
.hero-actions{margin-top:1.8rem}
.system-signature{margin-top:1.55rem}
.system-signature__copy strong{font-size:.82rem;letter-spacing:.015em}
.system-signature__copy small{font-size:.72rem;line-height:1.45}
.hero-facts{margin-top:1.65rem;padding-top:1rem}
.hero-facts>div{min-height:5.35rem;display:flex;flex-direction:column;justify-content:center}
.hero-facts strong{font-size:.8rem;letter-spacing:.035em;text-transform:uppercase}
.hero-facts span{font-size:.84rem;line-height:1.42}
.carousel{overflow:hidden}
.carousel-meta{padding:.78rem .2rem .1rem}
.carousel-caption{line-height:1.45}
.page-intro{padding-block:clamp(4rem,7vw,6.4rem)}
.page-intro__grid{grid-template-columns:minmax(0,1.25fr) minmax(19rem,.75fr);gap:clamp(2rem,5vw,5rem)}
.page-intro h1{max-width:14ch;font-size:clamp(2.8rem,2rem + 2.7vw,4.65rem);line-height:1.01;letter-spacing:-.05em}
.page-intro__meta{padding:1.2rem 1.25rem;line-height:1.66;box-shadow:0 16px 38px rgba(0,0,0,.12)}
/* Homepage: clearer progression from competence to evidence. */
.core-skills-grid{gap:1.05rem}
.core-skill{padding:1.3rem;min-height:9.6rem}
.core-skill strong{font-size:1.04rem}
.core-skill>span:last-child{font-size:.86rem;line-height:1.52}
.practice-grid,.verified-practice-grid{gap:1.05rem}
.practice-item,.verified-practice-grid article{min-height:13rem;padding:1.45rem!important;border-left:0!important}
.featured-project{padding:clamp(1.1rem,2vw,1.5rem);gap:clamp(1.5rem,3.5vw,3.2rem)}
.featured-project__content{padding:clamp(.5rem,1.5vw,1rem)}
.project-pair{gap:1rem}
.project-card{padding:1.35rem}
.goal-panel{padding:clamp(1.35rem,2.8vw,2rem)}
.cta-band{border-radius:var(--card-radius);padding:clamp(1.35rem,3vw,2.2rem)}
/* Project overview: stronger cards, readable filters and consistent media. */
.projects-feature{padding:clamp(1.25rem,2.8vw,2rem);gap:clamp(1.7rem,4vw,3.5rem)}
.projects-feature picture,.project-row>picture{background:linear-gradient(145deg,#081a31,#0c2949)}
.project-filter-panel{align-items:flex-end;padding-bottom:1.15rem;margin-bottom:1.35rem}
.project-filters{gap:.45rem}
.filter-button{min-height:2.7rem;padding:.5rem .78rem;border-radius:.72rem}
.project-list{gap:1.1rem}
.project-row>div:last-child{padding:1.35rem 1.35rem 1.45rem}
.project-row h3{font-size:1.28rem;line-height:1.17}
.project-row p{font-size:.94rem;line-height:1.6}
.project-row .button{width:100%;margin-top:1rem}
/* Systemtechnik: make the dense knowledge library calmer and easier to scan. */
.foundation-intro{gap:clamp(1.5rem,4vw,3.5rem)}
.foundation-controls{padding:1rem;border:1px solid var(--line);border-radius:1rem;background:color-mix(in srgb,var(--surface) 93%,transparent);box-shadow:0 8px 28px rgba(7,25,47,.045)}
.foundation-filterbar button{min-height:2.65rem;border-radius:.72rem}
.foundation-search input{min-height:3rem;border-radius:.8rem}
.foundation-count{margin-top:1rem}
.foundation-grid{gap:1.05rem;margin-top:1.15rem}
.foundation-card{padding:1.3rem;gap:1rem;box-shadow:var(--card-shadow)}
.foundation-card h3{font-size:1.16rem;line-height:1.2}
.foundation-card p{font-size:.92rem;line-height:1.66}
.knowledge-disclosure{overflow:clip}
.knowledge-disclosure__summary{min-height:4.2rem;padding:1rem 1.15rem;cursor:pointer}
.knowledge-disclosure[open] .knowledge-disclosure__summary{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface-2) 70%,var(--surface))}
.knowledge-disclosure__body{padding:1.1rem 1.15rem 1.3rem}
.knowledge-item{padding:.9rem 0;gap:1.1rem}
/* Internship: fix the public-safe section and improve editorial hierarchy. */
.internship-hero{padding-block:clamp(4rem,7vw,6.8rem)}
.internship-hero__copy h1{font-size:clamp(3.1rem,2.05rem + 3.4vw,5.45rem);max-width:11.5ch}
.internship-hero__panel{padding:clamp(1.4rem,2.7vw,2rem)}
.internship-jump{top:var(--header-offset)}
.internship-kpis{gap:1.05rem}
.internship-kpis article{min-height:11rem;padding:1.35rem}
.week-card{min-height:24rem;padding:clamp(1.35rem,2.7vw,1.8rem)}
.practice-day-grid{gap:1.05rem}
.practice-day-card{padding:1.25rem}
.final-day-grid{grid-template-columns:minmax(17rem,.72fr) minmax(0,1.28fr);gap:clamp(2rem,5vw,5rem)}
.final-day-grid>.section-heading{display:block;margin:0;align-self:start}
.final-day-grid>.section-heading .lead{margin-top:1.1rem;max-width:48ch}
.final-day-grid>.competency-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:0}
.final-day-grid>.competency-grid article{min-height:13rem;padding:1.35rem}
/* Case studies: stable sticky navigation and more deliberate reading rhythm. */
.case-hero{grid-template-columns:minmax(0,1.05fr) minmax(22rem,.75fr);gap:clamp(2rem,5vw,4.5rem)}
.case-layout{grid-template-columns:minmax(14rem,.34fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem)}
.case-nav,.legal-nav,.profile-panel{top:calc(var(--header-offset) + 1.25rem)}
.case-nav{padding:1.15rem}
.case-nav a{padding:.68rem .2rem;line-height:1.4}
.case-section{scroll-margin-top:calc(var(--header-offset) + 1.35rem);padding-bottom:clamp(2.2rem,4vw,3.4rem)}
.case-section+.case-section{padding-top:clamp(2.2rem,4vw,3.4rem)}
.case-section>h2{font-size:clamp(1.75rem,1.45rem + .9vw,2.4rem);max-width:24ch}
.case-section>p:first-of-type{margin-top:.8rem}
.info-band{padding:1.25rem}
.tech-specs{gap:.8rem}
/* About, experience, CV and contact: quieter editorial panels. */
.about-split,.personal-social,.experience-layout,.cv-grid,.contact-layout,.legal-layout{gap:clamp(1.6rem,4vw,3.5rem)}
.profile-panel,.contact-aside,.legal-nav{padding:1.25rem}
.principle{padding:1.3rem}
.timeline-item{padding-block:1.25rem}
.cv-panel{padding:clamp(1.2rem,2.6vw,1.75rem)}
.contact-form-shell{padding:clamp(1.25rem,3vw,2rem)}
.contact-method{padding:1.05rem 0}
.form-grid{gap:1.05rem}
.field{gap:.48rem}
.field label{font-size:.92rem}
.field input,.field textarea,.field select{
min-height:3.15rem;
border-radius:.8rem;
padding:.78rem .88rem;
transition:border-color var(--transition),box-shadow var(--transition),background var(--transition);
}
.field input:hover,.field textarea:hover,.field select:hover{border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}
.field input:focus,.field textarea:focus,.field select:focus{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent)}
.field textarea{min-height:12rem;line-height:1.62}
.check-field{align-items:flex-start;gap:.72rem;padding:.55rem .1rem}
.notice,.form-deployment-note{line-height:1.58}
.legal-content{padding:clamp(1.25rem,3vw,2rem)}
.legal-content h2{scroll-margin-top:calc(var(--header-offset) + 1.2rem)}
/* 404: intentionally polished rather than an empty dead end. */
.error-page{min-height:calc(100svh - var(--header-offset));padding-block:clamp(4rem,8vw,7rem);background:radial-gradient(circle at 50% 28%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 38%)}
.error-page .container{display:grid;place-items:center}
.error-code{font-size:clamp(7rem,20vw,15rem);color:color-mix(in srgb,var(--accent) 9%,var(--surface-3));text-shadow:0 18px 55px rgba(7,25,47,.08)}
.error-content{max-width:50rem;margin-top:-1.8rem;padding:clamp(1.2rem,3vw,2rem);border:1px solid var(--line);border-radius:1.35rem;background:color-mix(in srgb,var(--surface) 90%,transparent);box-shadow:var(--card-shadow);backdrop-filter:blur(12px)}
.error-content h1{font-size:clamp(2rem,1.55rem + 1.4vw,3rem)}
/* Dynamic header geometry: JS measures the real header on every device. */
.has-js .site-nav{top:var(--header-offset)}
/* Better high-contrast and OS accessibility modes. */
@media (prefers-contrast:more){
:root{--line:color-mix(in srgb,var(--text) 34%,var(--bg));--muted:color-mix(in srgb,var(--text) 76%,var(--bg))}
.button,.filter-button,.tag,.foundation-card,.project-row,.week-card{border-width:2px}
}
@media (forced-colors:active){
.button,.tag,.filter-button,.footer-proof,.footer-work-status,.footer-work-id{forced-color-adjust:auto}
.hero::before,.hero::after,.page-intro::before,.page-intro::after,.site-footer::after{display:none}
}
/* Responsive editorial tuning. */
@media (max-width:1180px){
:root{--header-offset:calc(var(--header-height,4.8rem) + env(safe-area-inset-top,0px))}
.page-intro__grid,.hero-grid{grid-template-columns:1fr}
.hero-grid{gap:2.3rem}
.hero h1{max-width:13ch}
.carousel{max-width:54rem}
.page-intro__meta{max-width:44rem}
.case-hero{grid-template-columns:1fr}
.case-hero picture{max-width:48rem}
}
@media (max-width:900px){
.section-heading{grid-template-columns:1fr;gap:1rem}
.section-heading>p,.section-heading .lead{justify-self:start}
.final-day-grid{grid-template-columns:1fr}
.final-day-grid>.section-heading .lead{max-width:62ch}
.case-layout{grid-template-columns:1fr}
.case-nav{position:relative;top:auto;display:block;padding:.75rem;overflow-x:auto}
.case-nav ol{display:flex;width:max-content;min-width:100%;gap:.35rem;border-top:0}
.case-nav li{flex:0 0 auto}
.case-nav a{min-height:2.7rem;padding:.55rem .7rem;border:1px solid var(--line);border-radius:.7rem;white-space:nowrap}
.profile-panel,.legal-nav{position:relative;top:auto}
}
@media (max-width:720px){
:root{--section-space:clamp(3.3rem,10vw,4.5rem);--section-space-compact:clamp(2.7rem,8vw,3.7rem)}
body{line-height:1.67}
.hero,.page-intro{padding-block:3.5rem}
.hero h1,.page-intro h1{font-size:clamp(2.45rem,11.5vw,3.65rem);max-width:13ch}
.hero-facts{grid-template-columns:1fr;gap:.65rem}
.hero-facts>div{min-height:auto;padding:.82rem 1rem}
.system-signature{grid-template-columns:auto 1fr;padding:.85rem .9rem}
.page-intro__meta{padding:1rem}
.project-filter-panel{align-items:flex-start;flex-direction:column}
.project-filter-status{white-space:normal}
.project-filters,.foundation-filterbar{width:calc(100% + var(--page-gutter));margin-right:calc(var(--page-gutter) * -1);padding-right:var(--page-gutter);overflow-x:auto;flex-wrap:nowrap;scroll-snap-type:x proximity}
.project-filters>* ,.foundation-filterbar>*{flex:0 0 auto;scroll-snap-align:start}
.final-day-grid>.competency-grid{grid-template-columns:1fr}
.final-day-grid>.competency-grid article{min-height:0}
.internship-kpis{gap:.75rem}
.week-card{min-height:0}
.foundation-controls{padding:.85rem}
.foundation-card{padding:1.1rem}
.contact-layout{gap:1rem}
.contact-aside,.contact-form-shell{padding:1.1rem}
.form-grid{grid-template-columns:1fr}
.form-grid .field--full{grid-column:auto}
.cta-band{align-items:flex-start;flex-direction:column}
.cta-band .button{width:100%}
}
@media (max-width:420px){
.button{width:100%}
.cluster.hero-actions{display:grid;grid-template-columns:1fr;width:100%}
.project-card-actions{display:grid;width:100%}
.project-card-actions .button,.project-card-actions .text-link{width:100%}
.foundation-card{grid-template-columns:auto minmax(0,1fr)}
.foundation-card__number{width:2.05rem;height:2.05rem}
.foundation-card h3{font-size:1.08rem}
.error-content{padding:1rem}
}
@media (max-width:340px){
:root{--page-gutter:.9rem}
.foundation-card{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
/* 4.8.0 micro-polish: remove doubled separators in contact panels. */
.contact-method{border-bottom:0}
.contact-method+.contact-method{margin-top:0;padding-top:1.05rem;border-top:1px solid var(--line)}
/* 4.8.1 — Evidence-led project system ------------------------------------ */
.flagship-showcase{margin-bottom:clamp(2rem,4vw,3.5rem);padding:clamp(1.15rem,2.7vw,2rem);border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:1.4rem;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 95%,var(--accent) 5%),var(--surface));box-shadow:0 24px 70px rgba(7,25,47,.08)}
.flagship-heading{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(18rem,.7fr);gap:clamp(1.25rem,4vw,3rem);align-items:end;margin-bottom:1.35rem}.flagship-heading h2{margin:.35rem 0 0;font-size:clamp(1.9rem,1.45rem + 1.3vw,2.8rem);max-width:22ch}.flagship-heading>p{max-width:52ch;color:var(--muted);line-height:1.65}
.flagship-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.flagship-card{display:flex;flex-direction:column;min-height:29rem;padding:1.35rem;border:1px solid var(--line);border-radius:1.15rem;background:color-mix(in srgb,var(--surface) 96%,var(--surface-2));box-shadow:var(--card-shadow);transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition)}.flagship-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 32%,var(--line));box-shadow:0 24px 60px rgba(7,25,47,.12)}.flagship-card--primary{background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 9%,var(--surface)),var(--surface) 55%)}.flagship-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;flex-wrap:wrap}.flagship-card h3{margin:1.15rem 0 .65rem;font-size:clamp(1.45rem,1.25rem + .6vw,1.9rem)}.flagship-card>p{color:var(--muted);line-height:1.65}.flagship-badge{display:inline-flex;align-items:center;min-height:1.85rem;padding:.3rem .62rem;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));color:color-mix(in srgb,var(--accent) 82%,var(--text));font-size:.73rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase}.flagship-proof{display:flex;flex-wrap:wrap;gap:.45rem;margin:1rem 0 1.3rem;padding:0;list-style:none}.flagship-proof li{padding:.35rem .55rem;border-radius:.55rem;background:var(--surface-2);color:var(--muted);font-size:.78rem;font-weight:700}.flagship-actions{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:auto}.flagship-actions .button{min-height:2.65rem}
.project-row--flagship{border-color:color-mix(in srgb,var(--accent) 28%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 5%,var(--surface)),var(--surface))}
.case-identity-line{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:.85rem;color:var(--muted);font-size:.86rem;line-height:1.5}.case-identity-line>span:last-child{max-width:62ch}
.architecture-proof{margin-top:1.45rem;padding:1.05rem;border:1px solid var(--line);border-radius:1rem;background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--accent) 4%,var(--surface-2)))}.architecture-proof__label{margin-bottom:.75rem;color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.architecture-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem;margin:0;padding:0;list-style:none;counter-reset:arch}.architecture-flow li{position:relative;display:flex;min-height:6.4rem;flex-direction:column;justify-content:center;gap:.45rem;padding:.85rem;border:1px solid var(--line);border-radius:.82rem;background:var(--surface);text-align:left}.architecture-flow li:not(:last-child)::after{content:'→';position:absolute;z-index:2;top:50%;right:-.57rem;transform:translate(50%,-50%);display:grid;width:1.45rem;height:1.45rem;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-weight:900}.architecture-flow li>span{color:var(--accent);font-size:.72rem;font-weight:900;letter-spacing:.08em}.architecture-flow li>strong{font-size:.9rem;line-height:1.3}
.troubleshooting-case{margin-top:1.35rem;padding:1.15rem 1.2rem;border-left:3px solid var(--accent);border-radius:0 .95rem .95rem 0;background:color-mix(in srgb,var(--accent) 6%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 14%,transparent)}.troubleshooting-case h3{margin:.25rem 0 .45rem;font-size:1.15rem}.troubleshooting-case p{margin:0;color:var(--muted);line-height:1.65}
.evidence-block{margin-top:1.5rem}.evidence-block__heading{display:flex;justify-content:space-between;align-items:end;gap:1.2rem;margin-bottom:.8rem}.evidence-block__heading>p{max-width:47ch;margin:0;color:var(--muted);font-size:.86rem;line-height:1.55}.evidence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.evidence-grid article{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start;padding:1rem;border:1px solid var(--line);border-radius:.9rem;background:var(--surface)}.evidence-check{display:grid;width:1.65rem;height:1.65rem;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent);font-weight:900}.evidence-grid strong{font-size:.9rem}.evidence-grid p{margin:.28rem 0 0;color:var(--muted);font-size:.82rem;line-height:1.55}
.scope-note{margin-top:1.1rem;padding:1rem 1.05rem;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:.85rem;background:color-mix(in srgb,var(--accent) 4%,var(--surface));color:var(--muted);line-height:1.62}.scope-note strong{color:var(--text)}.stack-links{display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap;margin-top:1rem;padding:.8rem .9rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted);font-size:.85rem}
.home-flagship-row{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--accent) 3%,var(--surface))}.home-proof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.home-proof-grid>a{display:grid;grid-template-columns:auto 1fr;column-gap:.8rem;row-gap:.18rem;padding:1rem;border:1px solid var(--line);border-radius:.9rem;background:var(--surface);color:inherit;text-decoration:none;transition:transform var(--transition),border-color var(--transition)}.home-proof-grid>a:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}.home-proof-grid span{grid-row:1/3;align-self:center;color:var(--accent);font-size:.76rem;font-weight:900;letter-spacing:.08em}.home-proof-grid strong{font-size:.95rem}.home-proof-grid small{color:var(--muted)}
@media(max-width:1050px){.flagship-grid{grid-template-columns:1fr 1fr}.flagship-card:first-child{grid-column:1/-1;min-height:0}.architecture-flow{grid-template-columns:repeat(3,minmax(0,1fr))}.architecture-flow li::after{display:none}.evidence-grid{grid-template-columns:1fr}.home-proof-grid{grid-template-columns:1fr 1fr}.home-proof-grid>a:first-child{grid-column:1/-1}}
@media(max-width:720px){.flagship-heading{grid-template-columns:1fr}.flagship-grid{grid-template-columns:1fr}.flagship-card:first-child{grid-column:auto}.flagship-card{min-height:0}.architecture-flow{grid-template-columns:1fr}.architecture-flow li{min-height:0}.evidence-block__heading{display:block}.evidence-block__heading>p{margin-top:.45rem}.home-proof-grid{grid-template-columns:1fr}.home-proof-grid>a:first-child{grid-column:auto}.case-identity-line{align-items:flex-start;flex-direction:column}}
/* ========================================================================== */
/* Seminar + personal endurance evidence */
/* ========================================================================== */
.home-endurance-proof{
display:grid;
grid-template-columns:auto minmax(0,1fr);
column-gap:.85rem;
row-gap:.15rem;
align-items:center;
margin-top:1.15rem;
padding:1rem 1.05rem;
border:1px solid var(--line);
border-radius:1rem;
background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--accent) 5%,var(--surface-2)));
color:inherit;
text-decoration:none;
box-shadow:0 10px 28px rgba(7,25,47,.05);
transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);
}
.home-endurance-proof:hover{
transform:translateY(-2px);
border-color:color-mix(in srgb,var(--accent) 30%,var(--line));
box-shadow:0 18px 42px rgba(7,25,47,.09);
}
.home-endurance-proof>span{
grid-row:1 / 3;
display:grid;
min-width:4.6rem;
min-height:3.7rem;
place-items:center;
padding:.45rem .65rem;
border-radius:.78rem;
background:var(--brand-carbon,#07192f);
color:#fff;
font-size:.82rem;
font-weight:900;
letter-spacing:.08em;
}
.home-endurance-proof strong{font-size:.96rem;line-height:1.3}
.home-endurance-proof small{color:var(--muted);font-size:.79rem;line-height:1.45}
.personal-achievement-section{overflow:hidden}
.personal-achievement-head{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(20rem,.72fr);
gap:clamp(1.7rem,4vw,4rem);
align-items:end;
}
.personal-achievement-head h2{max-width:15ch}
.personal-achievement-head .lead{max-width:64ch}
.achievement-kpis{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1px;
overflow:hidden;
border:1px solid var(--line);
border-radius:1rem;
background:var(--line);
box-shadow:var(--card-shadow);
}
.achievement-kpis>div{
display:grid;
gap:.22rem;
min-height:6.4rem;
align-content:center;
padding:1rem;
background:var(--surface);
}
.achievement-kpis strong{font-size:1.1rem;letter-spacing:-.015em}
.achievement-kpis span{color:var(--muted);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.tour-story-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1rem;
margin-top:clamp(1.4rem,3vw,2.2rem);
}
.tour-card{
display:flex;
min-width:0;
flex-direction:column;
padding:clamp(1.2rem,2.6vw,1.6rem);
border:1px solid var(--line);
border-radius:1.1rem;
background:var(--surface);
box-shadow:var(--card-shadow);
}
.tour-card--primary{
background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 8%,var(--surface)),var(--surface) 58%);
}
.tour-card__label{
color:var(--accent-strong);
font-size:.74rem;
font-weight:850;
letter-spacing:.075em;
text-transform:uppercase;
}
.tour-card h3{margin:.65rem 0 .7rem;font-size:clamp(1.45rem,1.25rem + .6vw,1.9rem)}
.tour-card p{color:var(--muted);line-height:1.68}
.tour-route{
display:flex;
align-items:center;
gap:.5rem;
flex-wrap:wrap;
margin-top:auto;
padding-top:1.2rem;
color:var(--muted);
font-size:.82rem;
font-weight:750;
}
.tour-route strong{color:var(--text)}
.tour-route [aria-hidden="true"]{color:var(--accent);font-weight:900}
.tour-route--return{font-size:.76rem}
.achievement-reflection{
display:grid;
grid-template-columns:minmax(18rem,.8fr) minmax(0,1.2fr);
gap:clamp(1.4rem,4vw,3.4rem);
align-items:center;
margin-top:1rem;
padding:clamp(1.25rem,3vw,1.8rem);
border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
border-radius:1.1rem;
background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface));
}
.achievement-reflection blockquote{
margin:.45rem 0 0;
font-size:clamp(1.35rem,1.15rem + .75vw,1.85rem);
font-weight:800;
line-height:1.28;
letter-spacing:-.025em;
}
.achievement-reflection p{margin:0;color:var(--muted);line-height:1.7}
.personal-achievement-links{
display:flex;
justify-content:space-between;
gap:1rem;
align-items:center;
margin-top:1rem;
padding-inline:.15rem;
font-size:.84rem;
}
.personal-achievement-links .muted{max-width:58ch;text-align:right}
.seminar-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--accent) 2.5%,var(--surface))}
.seminar-heading{align-items:end}
.seminar-grid{
display:grid;
grid-template-columns:minmax(0,.78fr) minmax(0,.78fr) minmax(22rem,1.44fr);
gap:1rem;
margin-top:1.4rem;
}
.seminar-card{
display:flex;
min-width:0;
flex-direction:column;
padding:1.3rem;
border:1px solid var(--line);
border-radius:1.05rem;
background:var(--surface);
box-shadow:var(--card-shadow);
}
.seminar-card__index{
display:grid;
width:2rem;
height:2rem;
place-items:center;
border-radius:.58rem;
background:color-mix(in srgb,var(--accent) 11%,var(--surface));
color:var(--accent);
font-size:.72rem;
font-weight:900;
}
.seminar-card h3{margin:.95rem 0 .55rem;font-size:1.18rem}
.seminar-card>p{color:var(--muted);font-size:.9rem;line-height:1.66}
.seminar-card--osi{background:linear-gradient(155deg,var(--surface),color-mix(in srgb,var(--accent) 4%,var(--surface-2)))}
.osi-stack{
display:grid;
gap:.38rem;
margin:1rem 0 0;
padding:0;
list-style:none;
}
.osi-stack li{
display:grid;
grid-template-columns:2rem minmax(0,1fr) auto;
gap:.65rem;
align-items:center;
min-height:2.8rem;
padding:.5rem .7rem;
border:1px solid var(--line);
border-radius:.72rem;
background:var(--surface);
}
.osi-stack li>span{
display:grid;
width:1.75rem;
height:1.75rem;
place-items:center;
border-radius:.5rem;
background:var(--brand-carbon,#07192f);
color:#fff;
font-size:.72rem;
font-weight:900;
}
.osi-stack strong{font-size:.86rem}
.osi-stack small{color:var(--muted);font-size:.72rem}
.seminar-note{
margin-top:1rem;
padding:1rem 1.05rem;
border-left:3px solid var(--accent);
border-radius:.25rem .8rem .8rem .25rem;
background:color-mix(in srgb,var(--accent) 6%,var(--surface));
color:var(--muted);
font-size:.88rem;
line-height:1.6;
}
.seminar-note strong{color:var(--text)}
@media(max-width:1050px){
.personal-achievement-head{grid-template-columns:1fr}
.achievement-kpis{max-width:42rem}
.seminar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.seminar-card--osi{grid-column:1/-1}
}
@media(max-width:760px){
.tour-story-grid,.achievement-reflection{grid-template-columns:1fr}
.personal-achievement-links{align-items:flex-start;flex-direction:column}
.personal-achievement-links .muted{text-align:left}
.seminar-grid{grid-template-columns:1fr}
.seminar-card--osi{grid-column:auto}
.osi-stack li{grid-template-columns:2rem minmax(0,1fr)}
.osi-stack small{grid-column:2}
}
@media(max-width:430px){
.achievement-kpis{grid-template-columns:1fr 1fr}
.achievement-kpis>div{min-height:5.6rem;padding:.8rem}
.tour-route{gap:.38rem;font-size:.76rem}
.tour-route--return{align-items:flex-start;flex-direction:column}
.tour-route--return [aria-hidden="true"]{display:none}
.home-endurance-proof{grid-template-columns:1fr}
.home-endurance-proof>span{grid-row:auto;min-height:2.8rem;min-width:0;width:max-content}
}
/* Anchor jumps must clear the measured sticky header. */
.personal-achievement-section,
.seminar-section,
#lernen-lernen-seminar{
scroll-margin-top:calc(var(--header-offset) + 1.25rem);
}
/* -------------------------------------------------------------------------- */
/* Release 4.9.0 · Public-safe activity evidence retained */
/* -------------------------------------------------------------------------- */
.tour-data-proof{
display:grid;
grid-template-columns:minmax(9.5rem,.72fr) minmax(0,1.7fr) minmax(11rem,.8fr);
gap:1rem;
align-items:stretch;
margin-top:1rem;
padding:1rem;
border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
border-radius:1.15rem;
background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 5%,var(--surface)),var(--surface) 62%);
box-shadow:var(--shadow-sm);
}
.tour-data-proof__metric{
display:grid;
align-content:center;
justify-items:start;
min-height:9rem;
padding:1rem;
border-radius:.9rem;
background:var(--brand-carbon);
color:#fff;
}
.tour-data-proof__metric span{
font-size:.7rem;
font-weight:900;
letter-spacing:.14em;
color:rgba(255,255,255,.62);
}
.tour-data-proof__metric strong{
margin-top:.45rem;
font-size:clamp(1.75rem,1.45rem + 1vw,2.55rem);
line-height:1;
letter-spacing:-.035em;
}
.tour-data-proof__metric small{
margin-top:.5rem;
color:rgba(255,255,255,.72);
font-size:.75rem;
line-height:1.45;
}
.tour-data-proof__copy{
align-self:center;
padding:.35rem .15rem;
}
.tour-data-proof__copy h3{
margin:.45rem 0 .55rem;
max-width:24ch;
font-size:clamp(1.2rem,1.08rem + .35vw,1.5rem);
}
.tour-data-proof__copy p{
margin:0;
max-width:67ch;
color:var(--muted);
font-size:.9rem;
line-height:1.65;
}
.tour-data-proof__facts{
display:grid;
align-content:center;
gap:.55rem;
}
.tour-data-proof__facts>div{
display:grid;
gap:.12rem;
padding:.72rem .8rem;
border:1px solid var(--line);
border-radius:.78rem;
background:color-mix(in srgb,var(--surface) 94%,var(--accent) 6%);
}
.tour-data-proof__facts strong{
font-size:.9rem;
color:var(--text);
}
.tour-data-proof__facts span{
color:var(--muted);
font-size:.7rem;
font-weight:800;
text-transform:uppercase;
letter-spacing:.07em;
}
@media(max-width:960px){
.tour-data-proof{
grid-template-columns:minmax(9rem,.75fr) minmax(0,1.5fr);
}
.tour-data-proof__facts{
grid-column:1/-1;
grid-template-columns:repeat(3,minmax(0,1fr));
}
}
@media(max-width:640px){
.tour-data-proof{grid-template-columns:1fr;padding:.8rem}
.tour-data-proof__metric{min-height:0}
.tour-data-proof__facts{grid-column:auto;grid-template-columns:1fr}
}
/* ================================================================
Release 4.9.0 · First-Class information architecture & scanability
================================================================ */
/* Keep long-form pages readable rather than merely dense. */
.case-layout > div:last-child{max-width:64rem}
.case-section > :is(p,ul,ol){max-width:72ch}
.case-section > p{font-size:clamp(.98rem,.94rem + .12vw,1.04rem);line-height:1.76}
.case-section li{line-height:1.68}
.case-section .eyebrow{margin-bottom:.55rem}
/* Executive summary on every technical case study. */
.case-scan{padding-top:clamp(1.7rem,3.5vw,2.8rem);padding-bottom:clamp(2.4rem,5vw,4rem);background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 3%,var(--bg)),var(--bg))}
.case-scan__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(18rem,.7fr);gap:clamp(1.25rem,4vw,3.5rem);align-items:end;margin-bottom:1.25rem}
.case-scan__head h2{max-width:22ch;margin:.35rem 0 0;font-size:clamp(1.85rem,1.45rem + 1.1vw,2.7rem);letter-spacing:-.04em}
.case-scan__head>p{max-width:52ch;margin:0;color:var(--muted);line-height:1.65}
.case-scan__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:0}
.case-scan__item{min-width:0;padding:1rem 1.05rem;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));border-radius:1rem;background:color-mix(in srgb,var(--surface) 96%,var(--accent) 4%);box-shadow:0 10px 28px rgba(7,25,47,.055)}
.case-scan__item dt{margin-bottom:.45rem;color:var(--accent-strong);font-size:.72rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.case-scan__item dd{margin:0;color:var(--text);font-size:.91rem;line-height:1.55;font-weight:650}
.case-phase-label{display:inline-flex;align-items:center;gap:.55rem;margin-bottom:1.35rem;padding:.34rem .62rem;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--accent) 6%,var(--surface));color:var(--accent-strong);font-size:.7rem;font-weight:900;letter-spacing:.085em;text-transform:uppercase}
.case-phase-label::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent)}
.case-nav__hint{margin:.85rem 0 0;color:var(--muted);font-size:.76rem;line-height:1.5}
.case-nav a{position:relative;padding-left:.72rem;border-radius:.55rem}
.case-nav a::before{content:"";position:absolute;left:0;top:50%;width:.22rem;height:0;border-radius:99px;background:var(--accent);transform:translateY(-50%);transition:height var(--transition)}
.case-nav a.is-current,.case-nav a[aria-current="location"]{color:var(--text);background:color-mix(in srgb,var(--accent) 7%,transparent)}
.case-nav a.is-current::before,.case-nav a[aria-current="location"]::before{height:58%}
/* Homepage: fewer sections, faster proof, stronger hierarchy. */
body[data-page="index"] .hero .lead{max-width:58ch}
body[data-page="index"] .hero-facts strong{color:var(--accent-strong)}
body[data-page="index"] .home-flagship-row{padding-block:clamp(2rem,4vw,3rem)}
body[data-page="index"] .section-heading>p{max-width:54ch}
/* Flagship proof becomes outcome-oriented. */
.flagship-result{margin:.15rem 0 1.2rem;padding:.72rem .8rem;border-left:3px solid var(--accent);border-radius:.35rem;background:color-mix(in srgb,var(--accent) 5%,var(--surface));color:var(--text)!important;font-size:.84rem!important;line-height:1.55!important;font-weight:650}
/* Reduce visual pressure on dense editorial pages. */
body[data-page="kenntnisse"] .foundation-section,body[data-page="ueber-mich"] .personal-achievement-section{content-visibility:auto;contain-intrinsic-size:900px}
.page-intro .lead{max-width:58ch}
.page-intro__meta{max-width:38rem}
@media (max-width:1100px){
.case-scan__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.case-scan__head{grid-template-columns:1fr}
.case-scan__head>p{max-width:64ch}
}
@media (max-width:900px){
.case-nav__hint{display:none}
.case-nav a{padding-left:.72rem}
.case-nav a::before{left:.28rem}
.case-nav a.is-current,.case-nav a[aria-current="location"]{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:color-mix(in srgb,var(--accent) 8%,var(--surface))}
}
@media (max-width:620px){
.case-scan__grid{grid-template-columns:1fr;gap:.65rem}
.case-scan__item{padding:.9rem .95rem}
.case-scan__item dd{font-size:.9rem}
.case-section>p{line-height:1.72}
}
@media (prefers-reduced-motion:reduce){
.case-nav a::before{transition:none}
}
/* Project hero contrast correction · 4.9.0 final visual QA */
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .status{
background:rgba(32,110,253,.16);
color:#eef7ff;
border-color:rgba(112,178,255,.30);
box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .status::before{
background:#45b8ff;
box-shadow:0 0 0 3px rgba(69,184,255,.14),0 0 12px rgba(69,184,255,.28);
}
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .case-identity-line{
color:rgba(231,240,250,.74);
}
body[data-page^="projekt"] .site-main > .section.section--compact:first-child .flagship-badge{
background:rgba(32,110,253,.14);
color:#eaf5ff;
border-color:rgba(112,178,255,.28);
}
/* Release 5.0.0: professional evidence hub */
.professional-hub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.professional-hub-card{display:grid;align-content:start;gap:.55rem;min-height:13rem;padding:1.2rem;background:var(--surface);color:var(--text);text-decoration:none;transition:background-color var(--transition),transform var(--transition)}
.professional-hub-card:hover{background:var(--surface-2);transform:translateY(-2px)}
.professional-hub-card:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}
.professional-hub-card__index{font-size:.74rem;font-weight:820;letter-spacing:.13em;text-transform:uppercase;color:var(--accent-strong)}
.professional-hub-card strong{font-size:1.08rem;line-height:1.25}
.professional-hub-card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.6}
.professional-hub-card small{margin-top:auto;color:var(--muted);font-size:.76rem;font-weight:700}
.evidence-matrix{display:grid;border:1px solid var(--line);background:var(--line);gap:1px}
.evidence-matrix__row{display:grid;grid-template-columns:minmax(12rem,.72fr) minmax(9rem,.42fr) minmax(0,1.25fr);gap:1rem;align-items:center;padding:1rem 1.1rem;background:var(--surface)}
.evidence-matrix__skill{display:grid;gap:.25rem}
.evidence-matrix__skill strong{font-size:.96rem}.evidence-matrix__skill small{color:var(--muted);font-size:.78rem}
.evidence-matrix__status{font-size:.78rem;font-weight:790;color:var(--accent-strong);letter-spacing:.04em;text-transform:uppercase}
.evidence-matrix__links{display:flex;flex-wrap:wrap;gap:.45rem .85rem;justify-content:flex-start}
.evidence-matrix__links a{font-size:.86rem;font-weight:700}
.incident-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.incident-card{display:grid;align-content:start;gap:.9rem;padding:1.2rem;background:var(--surface)}
.incident-card__top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.incident-id{font:760 .74rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--accent-strong);letter-spacing:.08em}
.incident-card h2,.incident-card h3{font-size:1.12rem;line-height:1.3}
.incident-card dl{display:grid;gap:.75rem;margin:0}.incident-card dl div{display:grid;gap:.2rem;padding-top:.7rem;border-top:1px solid var(--line)}
.incident-card dt{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.incident-card dd{margin:0;font-size:.9rem;line-height:1.6}
.quality-scoreboard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.quality-scoreboard>div{display:grid;gap:.3rem;padding:1.15rem;background:var(--surface)}
.quality-scoreboard strong{font-size:clamp(1.45rem,3vw,2.2rem);line-height:1;color:var(--text)}
.quality-scoreboard span{font-size:.8rem;color:var(--muted)}
.quality-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.quality-checklist article{display:grid;gap:.5rem;padding:1.1rem;background:var(--surface)}
.quality-checklist h3{font-size:1rem}.quality-checklist p{margin:0;color:var(--muted);font-size:.9rem}
.lab-note-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.lab-note{display:grid;align-content:start;gap:.65rem;padding:1.15rem;background:var(--surface)}
.lab-note__meta{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.72rem;font-weight:780;letter-spacing:.08em;text-transform:uppercase}
.lab-note h2,.lab-note h3{font-size:1.08rem}.lab-note p{margin:0;color:var(--muted)}
.lab-note code{font-size:.82em}
.recruiter-summary{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(16rem,.65fr);gap:1px;border:1px solid var(--line);background:var(--line)}
.recruiter-summary>div{padding:1.25rem;background:var(--surface)}
.recruiter-summary__facts{display:grid;gap:0;margin:0}.recruiter-summary__facts div{display:grid;grid-template-columns:8rem 1fr;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line)}
.recruiter-summary__facts div:last-child{border-bottom:0}.recruiter-summary__facts dt{color:var(--muted);font-size:.78rem;font-weight:760}.recruiter-summary__facts dd{margin:0;font-size:.9rem}
.reading-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.reading-path a{display:grid;gap:.4rem;padding:1rem;background:var(--surface);color:var(--text);text-decoration:none}.reading-path a:hover{background:var(--surface-2)}
.reading-path span{color:var(--accent-strong);font-size:.74rem;font-weight:820;letter-spacing:.1em}.reading-path small{color:var(--muted)}
@media (max-width:980px){.professional-hub-grid,.quality-scoreboard{grid-template-columns:repeat(2,minmax(0,1fr))}.recruiter-summary{grid-template-columns:1fr}}
@media (max-width:760px){.incident-grid,.quality-checklist,.lab-note-grid,.reading-path{grid-template-columns:1fr}.evidence-matrix__row{grid-template-columns:1fr;gap:.45rem}.professional-hub-grid,.quality-scoreboard{grid-template-columns:1fr}.professional-hub-card{min-height:0}.recruiter-summary__facts div{grid-template-columns:1fr;gap:.2rem}}