/* V11 refinements. Shared components accommodate additional projects. */
:root{--radius:14px;--shadow:0 18px 44px #13243135}
[hidden]{display:none!important}
html{scroll-padding-top:110px}
body{font-kerning:normal;-webkit-font-smoothing:antialiased}
main:focus{outline:none}
a,button,summary,input,textarea{touch-action:manipulation}
:focus-visible{outline:3px solid #b6f0f3;outline-offset:5px}
.skip-link{position:fixed;top:10px;left:12px;z-index:1000;transform:translateY(-160%);background:#90dce8;color:#143744;padding:12px 20px;border-radius:6px;font-weight:700}
.skip-link:focus{transform:translateY(0)}
.sitehead{box-shadow:0 5px 22px #14252f19}
.navlinks a{position:relative;padding-block:12px}
.navlinks a[aria-current="page"]::after{content:"";position:absolute;bottom:3px;left:0;right:0;height:2px;border-radius:2px;background:var(--accent)}
.langlinks{padding:2px 4px;gap:0}
.langlinks a{display:grid;place-items:center;min-width:34px;min-height:34px;border-radius:24px}
.langlinks a.active{background:#90dce814}
.mobilemenu summary{min-height:44px;display:flex;align-items:center;gap:6px}
.mobilemenu summary::-webkit-details-marker{display:none}
.mobilemenu nav{max-height:calc(100dvh - 100px);overflow-y:auto}
.mobilemenu nav a{border-radius:5px}
.mobilemenu nav a:hover{background:#90dce814}
.hero{gap:48px;padding-top:72px;padding-bottom:80px}
.hero-copy{min-width:0}
.hero h1{font-size:clamp(42px,4.5vw,65px);line-height:1.12}
.hero h1,.page-hero h1,.gateway h1,.heading h2{text-wrap:balance}
.herovisual{border-color:#6a8b98;border-radius:var(--radius);box-shadow:var(--shadow)}
.herovisual::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,#90dce80b,transparent 55%)}
.wirelabel,.wirefoot{font-size:9px;letter-spacing:.12em;right:18px}
.btn{min-height:46px;border-radius:8px;transition:background .18s,color .18s,transform .18s,box-shadow .18s}
.btn.primary:hover{background:#b0e9ef;border-color:#b0e9ef;box-shadow:0 5px 24px #90dce81a}
.btn.ghost:hover{background:#90dce80e}
.btn.textbtn{border-color:transparent;padding-inline:12px;color:var(--accent)}
.kicker{line-height:1.6}
.heading{margin-bottom:36px}
.info-card{border-color:#607e8e;border-radius:var(--radius);position:relative;box-shadow:0 10px 25px #15263115}
.info-card::before{content:"";display:block;width:28px;height:2px;background:var(--accent);margin-bottom:17px}
.info-card h3{margin-top:18px}
.info-card p{line-height:1.8}
.projecttile,.bigproject{border-radius:var(--radius);box-shadow:var(--shadow)}
.projecttile:focus-visible,.bigproject:focus-visible{outline-offset:5px}
.projecttile img,.bigproject img{transition:transform .35s ease}
.projecttile:hover img,.bigproject:hover img{transform:scale(1.025)}
.imagebox{isolation:isolate}
.imagecap{max-width:calc(100% - 34px);letter-spacing:.08em}
.project-next{display:flex;justify-content:space-between;align-items:center;gap:28px}
.project-next h2{font-size:clamp(26px,3vw,40px);line-height:1.2;letter-spacing:-.035em;margin:0}
.project-next .ctas{margin-top:0}
.job{padding-block:32px}
.jobdate{position:relative;padding-left:16px}
.jobdate::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.formpanel{box-shadow:var(--shadow);border-radius:var(--radius)}
.contactform textarea{resize:vertical;min-height:170px}
.contactform input[type="checkbox"]{flex-shrink:0;width:18px;height:18px}
.contactform input[type="hidden"],.contactform .honeypot{display:none!important}
.contactform .consent{line-height:1.7}
.form-status{scroll-margin-top:120px}
.contactform .form-status{color:#edf9fa}
.viewer-card{box-shadow:var(--shadow)}
.viewer-stage{isolation:isolate}
.viewer-poster{opacity:.9;z-index:0}
model-viewer{z-index:1}
.viewer-tag{z-index:2}
.load-model{position:absolute;z-index:3;left:50%;bottom:24px;transform:translateX(-50%);max-width:calc(100% - 32px);white-space:nowrap;box-shadow:0 5px 25px #13243180}
.load-model:hover{transform:translateX(-50%) translateY(-2px)}
.load-model:disabled{opacity:.75;cursor:wait}
.viewer-status{padding:0 18px 18px;margin:0;min-height:40px}
.smallbtn{min-height:42px;min-width:90px}
.smallbtn:disabled{opacity:.5;cursor:not-allowed}
.smallbtn[aria-pressed="true"]{background:var(--accent);color:var(--ink)}
.model-error model-viewer{visibility:hidden}
.privacycopy{max-width:850px}
.privacyitem{padding-block:28px}
.privacyitem:first-child{padding-top:0}
.privacyitem h2{font-size:24px;line-height:1.3;letter-spacing:-.02em;margin:0 0 15px}
.privacyitem p{line-height:1.85}
.privacyitem a{text-decoration-thickness:1px;text-underline-offset:4px;color:#b5ebf0;overflow-wrap:anywhere}
.footrow{column-gap:22px}
.footrow a:hover{text-decoration:underline;text-underline-offset:4px}
.gateway{position:relative;background:radial-gradient(ellipse at 90% 15%,#3c5969 0,transparent 48%),#293946}
.gateway::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#a3ccd507 1px,transparent 1px),linear-gradient(90deg,#a3ccd507 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(90deg,transparent,#000)}
.gatewrap{position:relative;max-width:1050px;padding-block:44px}
.gateeyebrow{margin-top:76px}
.gateway h1{max-width:820px;font-size:clamp(48px,6.2vw,82px)}
.gatedivider{margin-top:38px}
.language-grid a{position:relative;padding:24px 28px;border-color:#6c909f;background:linear-gradient(130deg,#3a5566,#2e4655);box-shadow:var(--shadow)}
.language-grid a:focus-visible{border-color:var(--accent)}
.language-grid strong{font-size:28px}
.language-grid a em{margin-top:8px}
.gateway footer{margin-top:42px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.gate-privacy{margin-left:auto;white-space:nowrap}
@media(min-width:681px){.projecttiles{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))}}
@media(max-width:1100px){.headrow{gap:10px}.navlinks{gap:11px}}
@media(max-width:920px){.hero{gap:32px}.hero h1{font-size:clamp(44px,7vw,66px)}.project-next{align-items:flex-start;flex-direction:column}.headrow{gap:8px}}
@media(max-width:680px){html{scroll-padding-top:88px}.hero{padding:46px 0 56px;gap:30px}.hero h1{font-size:clamp(37px,10vw,56px)}.page-hero h1{font-size:clamp(36px,9vw,52px);overflow-wrap:break-word}.logotext{font-size:10px;letter-spacing:.09em}.logomark{width:36px;height:36px}.logo{gap:8px}.langlinks a{min-width:29px;min-height:34px}.headrow{gap:6px}.mobilemenu summary{padding-inline:6px;font-size:13px}.hero .ctas{gap:9px}.hero .ctas .btn{font-size:13px;padding-inline:15px}.microchips{margin-top:28px}.herovisual{min-height:290px}.wirefoot{font-size:8px}.info-card{min-height:0}.contactcols{gap:32px}.section{padding-block:54px}.viewer-stage{height:350px}.viewer-foot{gap:12px}.viewerbuttons{flex-wrap:wrap}.load-model{font-size:13px;padding-inline:16px}.gatewrap{width:calc(100% - 36px);padding-block:28px}.gateeyebrow{margin-top:52px;font-size:10px}.gateway h1{font-size:clamp(43px,11vw,66px)}.language-grid{gap:12px}.language-grid a{padding:20px 22px}.gate-privacy{margin-left:0;display:block;width:100%}.privacyitem h2{font-size:22px}.imagecap{font-size:9px}.footrow{gap:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.projecttile:hover img,.bigproject:hover img{transform:none}}
/* Decorative mascot: one short greeting, never an overlay or chat widget. */
.mascot{object-fit:contain;filter:drop-shadow(0 7px 8px #10202a50);transform-origin:80% 90%;pointer-events:none}
.mascot-heading{display:grid;grid-template-columns:1fr 104px;column-gap:12px;align-items:center}
.mascot-heading .kicker{grid-column:1/-1}
.mascot-heading h2{grid-column:1;grid-row:2;margin-bottom:0}
.mascot-heading .mascot{width:104px;height:104px;grid-column:2;grid-row:2}
.mascot-note{display:flex;align-items:center;gap:16px;margin-top:32px;padding:12px 16px;border:1px solid #68828f;border-radius:12px;background:linear-gradient(120deg,#364c58,#293e4c)}
.mascot-note .mascot{width:86px;height:86px;flex-shrink:0}
.mascot-note p{font-size:14px;margin:0;line-height:1.6}
.mascot-note strong{color:var(--text);font-weight:600}
.mascot.greet{animation:mascot-greeting 1.8s ease-in-out 1}
@keyframes mascot-greeting{0%,100%{transform:rotate(0)}35%{transform:rotate(-4deg)}70%{transform:rotate(1deg)}}
@media(max-width:680px){.mascot-heading{grid-template-columns:1fr 82px;gap:10px}.mascot-heading .mascot{width:82px;height:82px}.mascot-note{max-width:380px}.mascot-note .mascot{width:76px;height:76px}}
@media(prefers-reduced-motion:reduce){.mascot.greet{animation:none!important}}
