@font-face{font-family:"Schibsted Grotesk";src:url("../fonts/SchibstedGrotesk-VariableFont_wght.ttf") format("truetype");font-weight:400 900;font-style:normal;font-display:swap}

:root{
  --paper:#f8f7f5; --gips:#eeedea; --gips-2:#e3e1dd; --line:#d4d1cc;
  --steel:#8f8b8a; --text-2:#56534f; --ink:#1f1e1d;
  --night:#262524; --night-2:#302f2d; --on-night:#f2f1ee; --on-night-2:#b8b4b0; --night-line:#45423f;
  --font:"Schibsted Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --maxw:1240px; --gutter:clamp(20px,5vw,64px);
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#1d1c1b; --gips:#252422; --gips-2:#2d2b29; --line:#3d3a37;
    --text-2:#b8b4b0; --ink:#f2f1ee;
    --night:#141312; --night-2:#1d1c1b; --night-line:#3d3a37;
  }
}
:root[data-theme="dark"]{
  --paper:#1d1c1b; --gips:#252422; --gips-2:#2d2b29; --line:#3d3a37;
  --text-2:#b8b4b0; --ink:#f2f1ee;
  --night:#141312; --night-2:#1d1c1b; --night-line:#3d3a37;
}
*,*::before,*::after{box-sizing:border-box}
html{height:100%;scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px)}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.02em;line-height:1.08;text-wrap:balance}
h1{font-size:clamp(40px,5.4vw,74px);font-weight:800;letter-spacing:-.035em}
h2{font-size:clamp(32px,3.8vw,52px);letter-spacing:-.03em}
h3{font-size:22px;letter-spacing:-.01em;line-height:1.25}
p{margin:0;max-width:66ch}
.lead{font-size:clamp(18px,1.6vw,21px);color:var(--text-2);line-height:1.6}
.muted{color:var(--text-2)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;font:600 16px/1 var(--font);text-decoration:none;border:1.5px solid var(--ink);border-radius:2px;cursor:pointer;transition:background .15s,color .15s}
.btn-solid{background:var(--ink);color:var(--paper)}
.btn-solid:hover{opacity:.88}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}
.night{background:var(--night);color:var(--on-night)}
.night .lead,.night .muted{color:var(--on-night-2)}
.night .btn-solid{background:var(--on-night);color:#1f1e1d;border-color:var(--on-night)}
.night .btn-ghost{color:var(--on-night);border-color:var(--on-night)}
.night .btn-ghost:hover{background:var(--on-night);color:#1f1e1d}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:var(--night);color:var(--on-night)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;gap:24px}
.brand img{height:40px;width:auto}
.nav{display:flex;gap:28px;font-size:15.5px}
.nav a{text-decoration:none;padding:6px 0;border-bottom:1.5px solid transparent;color:var(--on-night)}
.nav a:hover{border-color:var(--on-night)}
.header-cta{display:flex;gap:10px;align-items:center}
.header-cta .btn{min-height:44px;padding:0 18px;font-size:15px;background:var(--on-night);color:#1f1e1d;border-color:var(--on-night)}
.header-cta .tel{color:var(--on-night);text-decoration:none;font-weight:600;font-size:15px;margin-right:8px}
.menu-btn{display:none;width:48px;height:48px;border:1.5px solid var(--night-line);background:transparent;color:var(--on-night);border-radius:2px;cursor:pointer;align-items:center;justify-content:center}
.mobile-nav{display:none}
@media (max-width:1060px){
  .nav,.header-cta .hide-sm{display:none}
  .menu-btn{display:inline-flex}
  .brand img{height:32px}
  .mobile-nav{display:block;overflow:hidden;max-height:0;transition:max-height .25s ease}
  .mobile-nav.open{max-height:560px;border-top:1px solid var(--night-line)}
  .mobile-nav a{display:block;padding:15px var(--gutter);text-decoration:none;font-size:18px;border-bottom:1px solid var(--night-line);color:var(--on-night)}
}

/* Hero */
.hero{padding:clamp(40px,6vw,88px) 0 clamp(40px,5vw,72px)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:center}
.hero-text{display:flex;flex-direction:column;gap:28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-photo{margin:0;position:relative}
.hero-photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.hero-photo figcaption{margin-top:12px;font-size:14px;color:var(--text-2)}
.bars{display:flex;gap:6px;margin-bottom:4px}
.bars i{display:block;width:22px;height:34px;transform:skewX(-18deg)}
.bars i:nth-child(1){background:var(--ink)}.bars i:nth-child(2){background:#8f8b8a}.bars i:nth-child(3){background:#55514f}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr}.hero-photo img{aspect-ratio:4/3}}

.facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.facts div{padding:22px 20px 22px 0;font-size:15.5px}
.facts div + div{padding-left:20px;border-left:1px solid var(--line)}
.facts b{display:block;font-weight:600}
.facts span{color:var(--text-2)}
@media (max-width:860px){.facts .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.facts div:nth-child(3){border-left:0;padding-left:0}.facts div:nth-child(n+3){border-top:1px solid var(--line)}}

section.block{padding:clamp(72px,9vw,128px) 0}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
@media (max-width:860px){.sec-head{grid-template-columns:1fr}}
.alt{background:var(--gips)}

/* Services */
.srow{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:center;padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--line)}
.srow:last-child{border-bottom:1px solid var(--line)}
.srow.rev .smedia{order:2}
.smedia img{width:100%;aspect-ratio:4/5;object-fit:cover}
.stext{display:flex;flex-direction:column;gap:18px}
.slist{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 28px;margin:6px 0 0;padding:0;list-style:none}
.slist li{padding:10px 0;border-top:1px solid var(--line);font-size:16px}
@media (max-width:860px){.srow{grid-template-columns:1fr}.srow.rev .smedia{order:0}.smedia img{aspect-ratio:4/3}.slist{grid-template-columns:1fr}}

/* Hidden quality */
.detail{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(28px,5vw,64px);align-items:start}
.drawing{border:1px solid var(--line);background:var(--paper);padding:clamp(16px,2.5vw,32px);margin:0}
.drawing svg{display:block;width:100%;height:auto}
.drawing figcaption,.label-photo figcaption{margin-top:12px;font-size:14px;color:var(--text-2)}
.label-photo{margin:0}
.label-photo img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line)}
.detail-text{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:clamp(28px,4vw,48px)}
.detail-text div{border-top:1.5px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.detail-text p{font-size:16px;color:var(--text-2)}
@media (max-width:860px){.detail,.detail-text{grid-template-columns:1fr}}
.draw{stroke-dasharray:1200;stroke-dashoffset:1200}
.in-view .draw{animation:draw 1.8s cubic-bezier(.3,.6,.2,1) forwards}
.in-view .d2{animation-delay:.25s}.in-view .d3{animation-delay:.5s}.in-view .d4{animation-delay:.8s}
.fadein{opacity:0}.in-view .fadein{animation:fade .6s ease forwards;animation-delay:1.4s}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fade{to{opacity:1}}
@media (prefers-reduced-motion: reduce){.draw{stroke-dashoffset:0}.in-view .draw{animation:none}.fadein{opacity:1}.in-view .fadein{animation:none}}

/* Water */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;border-top:1px solid var(--night-line);counter-reset:s}
.steps li{list-style:none;padding:28px 24px 8px 0;display:flex;flex-direction:column;gap:10px}
.steps li + li{padding-left:24px;border-left:1px solid var(--night-line)}
.steps li::before{counter-increment:s;content:counter(s);font-size:44px;font-weight:400;line-height:1}
@media (max-width:860px){.steps{grid-template-columns:1fr}.steps li + li{padding-left:0;border-left:0;border-top:1px solid var(--night-line)}}
.water-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);margin-top:clamp(56px,7vw,96px)}
@media (max-width:860px){.water-grid{grid-template-columns:1fr}}
.checklist{margin:18px 0 0;padding:0;list-style:none}
.checklist li{padding:14px 0 14px 34px;border-top:1px solid var(--night-line);position:relative}
.checklist li::before{content:"";position:absolute;left:0;top:19px;width:16px;height:9px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.chart{border:1px solid var(--night-line);padding:24px;margin:0}
.chart svg{display:block;width:100%;height:auto}
.chart p{font-size:14px;margin-top:12px}

/* Gallery */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.filters button{font:500 15px/1 var(--font);min-height:44px;padding:0 18px;border:1.5px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px 14px;grid-auto-flow:dense}
.tile{grid-column:span 4;margin:0;display:flex;flex-direction:column;gap:10px}
.tile.w6{grid-column:span 6}.tile.w8{grid-column:span 8}
.tile button{padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%;overflow:hidden}
.tile img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .5s ease}
.tile.land img{aspect-ratio:4/3}
.tile button:hover img{transform:scale(1.03)}
.tile figcaption{font-size:14.5px;color:var(--text-2);line-height:1.45}
.tile figcaption b{display:block;color:var(--ink);font-weight:600;font-size:15.5px}
.tile[hidden]{display:none}
.pair{grid-column:span 8;margin:0;display:flex;flex-direction:column;gap:10px}
.pair .two{display:grid;grid-template-columns:1.43fr 1fr;gap:14px}
.pair button{padding:0;border:0;background:none;cursor:zoom-in;position:relative}
.pair img{width:100%;height:100%;min-height:100%;object-fit:cover;aspect-ratio:auto}
.pair .tag{position:absolute;left:10px;top:10px;background:var(--paper);color:var(--ink);font-size:13px;font-weight:600;padding:5px 9px}
@media (max-width:860px){.tile,.tile.w6,.tile.w8{grid-column:span 6}.pair{grid-column:span 12}}
@media (max-width:520px){.tile,.tile.w6,.tile.w8{grid-column:span 12}}
dialog.lightbox{border:0;padding:0;background:transparent;max-width:min(94vw,1100px);max-height:92vh}
dialog.lightbox::backdrop{background:rgba(15,14,13,.88)}
dialog.lightbox img{max-width:100%;max-height:82vh;width:auto;margin:0 auto}
dialog.lightbox p{color:#f2f1ee;text-align:center;margin:12px auto 0;font-size:15px}
dialog.lightbox .close{position:fixed;top:calc(env(safe-area-inset-top,0px) + 14px);right:14px;width:48px;height:48px;border:1.5px solid #f2f1ee;background:transparent;color:#f2f1ee;font-size:26px;line-height:1;cursor:pointer;border-radius:2px}

/* Process */
.process{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:0;counter-reset:p}
.process li{list-style:none;padding:0 20px 0 0;display:flex;flex-direction:column;gap:10px;position:relative}
.process li::before{counter-increment:p;content:counter(p);width:40px;height:40px;border:1.5px solid var(--ink);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;background:var(--gips);position:relative;z-index:1}
.process li::after{content:"";position:absolute;top:20px;left:40px;right:0;height:1.5px;background:var(--line)}
.process li:last-child::after{display:none}
.process h3{font-size:18px}
.process p{font-size:15.5px;color:var(--text-2)}
@media (max-width:860px){.process{grid-template-columns:1fr;gap:28px}.process li::after{display:none}}
.note{margin-top:40px;padding:20px 24px;border:1px solid var(--line);background:var(--paper);font-size:15.5px;max-width:none}

/* About */
.about{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:center}
@media (max-width:860px){.about{grid-template-columns:1fr}}
.about img{width:100%;aspect-ratio:4/3;object-fit:cover}
.stack{display:flex;flex-direction:column;gap:22px}
.figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);margin-top:12px}
.figures div{padding:18px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column}
.figures div:nth-child(odd){padding-right:16px;border-right:1px solid var(--line)}
.figures div:nth-child(even){padding-left:16px}
.figures b{font-size:30px;font-weight:700;letter-spacing:-.02em}
.figures span{font-size:14.5px;color:var(--text-2)}

.reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.reviews figure{margin:0;display:flex;flex-direction:column;gap:18px;padding-top:24px;border-top:1.5px solid var(--ink)}
.reviews blockquote{margin:0;font-size:19px;line-height:1.55}
.reviews figcaption{margin-top:auto;font-size:15px;color:var(--text-2)}
@media (max-width:860px){.reviews{grid-template-columns:1fr}}

.career{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:start}
@media (max-width:860px){.career{grid-template-columns:1fr}}
.career img{width:100%;aspect-ratio:4/5;object-fit:cover}
.jobs{border-top:1px solid var(--line);margin-top:8px}
.job{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);text-decoration:none}
.job h3{font-size:21px}
.job span{color:var(--text-2);font-size:15.5px}
.job em{font-style:normal;font-weight:600;white-space:nowrap}
.job:hover em{text-decoration:underline}

.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font-size:19px;font-weight:600;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:30px;width:12px;height:12px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(-135deg);top:36px}
.faq details p{padding:0 0 24px;color:var(--text-2)}

.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px)}
@media (max-width:860px){.contact{grid-template-columns:1fr}}
.quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 10px}
.quick a{display:flex;flex-direction:column;gap:2px;padding:16px 18px;border:1.5px solid var(--ink);text-decoration:none}
.quick a:first-child{background:var(--ink);color:var(--paper)}
.quick a small{font-size:13.5px;opacity:.75}
.hours{width:100%;border-collapse:collapse;font-size:15.5px}
.hours td{padding:11px 0;border-top:1px solid var(--line)}
.hours td:last-child{text-align:right;color:var(--text-2)}
form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;align-content:start}
@media (max-width:560px){form{grid-template-columns:1fr}}
form .full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:7px;font-size:15px;font-weight:500}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:2px;padding:12px 14px;min-height:50px}
input:focus,select:focus,textarea:focus{border-color:var(--ink);outline:none}
.form-msg{grid-column:1/-1;font-size:15px;color:var(--text-2);min-height:1.5em}
.maplink{display:inline-flex;margin-top:6px;font-weight:600}

.site-footer{background:var(--night);color:var(--on-night-2);padding:64px 0 40px;font-size:15px}
.site-footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px}
.site-footer img{height:40px;width:auto;margin-bottom:18px}
.site-footer b{color:var(--on-night);display:block;margin-bottom:8px;font-weight:600}
.site-footer a{text-decoration:none}
.site-footer a:hover{color:var(--on-night)}
.site-footer .legal{margin-top:48px;padding-top:20px;border-top:1px solid var(--night-line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (max-width:860px){.site-footer .cols{grid-template-columns:1fr 1fr}}
.call-bar{display:none}
@media (max-width:700px){
  .call-bar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--night);border-top:1px solid var(--night-line)}
  .call-bar a{display:flex;align-items:center;justify-content:center;min-height:56px;font-weight:600;text-decoration:none;color:var(--on-night)}
  .call-bar a:first-child{background:var(--on-night);color:#1f1e1d}
  body{padding-bottom:56px}
}

img{height:auto}
/* Page hero (subpages) */
.page-hero{padding:clamp(40px,6vw,80px) 0 clamp(32px,4vw,56px);border-bottom:1px solid var(--line)}
.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:center}
.page-hero img{width:100%;aspect-ratio:4/3;object-fit:cover}
.page-hero .hero-text{gap:22px}
.crumbs{font-size:14px;color:var(--text-2)}
.crumbs a{color:var(--text-2)}
@media (max-width:860px){.page-hero .wrap{grid-template-columns:1fr}}
/* Service cards (home) */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.card{display:flex;flex-direction:column;gap:12px;text-decoration:none}
.card img{width:100%;aspect-ratio:3/4;object-fit:cover}
.card h3{font-size:21px}
.card p{font-size:15.5px;color:var(--text-2)}
.card span{font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:4px}
.card:hover img{opacity:.92}
@media (max-width:960px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.cards{grid-template-columns:1fr}}
/* Split band */
.band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:center}
.band img{width:100%;aspect-ratio:4/3;object-fit:cover}
@media (max-width:860px){.band{grid-template-columns:1fr}}
/* CTA */
.cta .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.cta h2{font-size:clamp(28px,3vw,40px)}
/* Legal */
.legal-text{max-width:760px}
.legal-text h1{font-size:clamp(34px,4vw,52px);margin-bottom:28px}
.legal-text h2{font-size:24px;margin:40px 0 12px;letter-spacing:-.01em}
.legal-text h3{font-size:18px;margin:24px 0 8px}
.legal-text p,.legal-text li{font-size:16px;color:var(--text-2)}
.legal-text p + p{margin-top:12px}
.legal-text ul{padding-left:20px}
.legal-text a{color:var(--ink)}
.more{margin-top:32px}
.alert{grid-column:1/-1;padding:14px 16px;border:1.5px solid var(--ink);font-size:15.5px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nav a[aria-current="page"]{border-color:var(--on-night)}

/* ---- Animated drawings (all pages) ---- */
.drawing .draw{stroke-dasharray:1000;stroke-dashoffset:1000}
.drawing.in-view .draw{animation:draw 1.8s cubic-bezier(.3,.6,.2,1) forwards}
.drawing.in-view .d2{animation-delay:.3s}.drawing.in-view .d3{animation-delay:.6s}.drawing.in-view .d4{animation-delay:.9s}
.drawing .fadein{opacity:0}
.drawing.in-view .fadein{animation:fade .6s ease forwards;animation-delay:1.6s}
.drawing .flow{stroke-dasharray:8 10}
.drawing.in-view .flow{animation:flow 1.2s linear infinite}
@keyframes flow{to{stroke-dashoffset:-36}}
.drawing .dry{opacity:0}
.drawing.in-view .dry{animation:dry 5s ease forwards;animation-delay:1.6s}
@keyframes dry{0%{opacity:0}12%{opacity:.85}55%{opacity:.85}100%{opacity:0}}
.drawing .wave{opacity:0}
.drawing.in-view .wave{animation:wave 3s ease-out infinite}
@keyframes wave{0%{opacity:0;transform:translateY(40px)}25%{opacity:.9}90%{opacity:0;transform:translateY(-10px)}100%{opacity:0}}
.night .drawing{background:transparent;border-color:var(--night-line);color:var(--on-night)}
.night .drawing figcaption{color:var(--on-night-2)}
.drawband{align-items:center}
.detail-points{display:grid;grid-template-columns:1fr;gap:0;margin-top:8px}
.detail-points div{padding:14px 0;border-top:1px solid var(--line)}
.detail-points h3{font-size:18px;margin-bottom:4px}
.detail-points p{font-size:15.5px;color:var(--text-2)}
.night .detail-points div{border-color:var(--night-line)}
.night .detail-points p{color:var(--on-night-2)}
@media (prefers-reduced-motion: reduce){
  .drawing .draw{stroke-dashoffset:0}.drawing .fadein{opacity:1}
  .drawing.in-view .draw,.drawing.in-view .fadein,.drawing.in-view .flow,.drawing.in-view .wave{animation:none}
  .drawing .wave{opacity:.6}.drawing .dry{opacity:0}
}

/* ---- Photos appear softly when scrolled into view ---- */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.shown{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.js .reveal{opacity:1;transform:none;transition:none}}
.drawing figcaption{display:flex;justify-content:space-between;gap:6px 16px;flex-wrap:wrap}
@media (max-width:560px){.drawing{padding:12px}}

/* ---- Projekte nach Kategorien ---- */
.chips{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter) 8px;display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1.5px solid var(--line);border-radius:999px;text-decoration:none;font-size:15px;font-weight:500}
.chips a:hover{border-color:var(--ink)}
.pcat{padding:clamp(64px,8vw,112px) 0}
.pcat.alt{background:var(--gips)}
.proj{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:start;padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--line)}
.proj.flip .pmedia{order:2}
.pmedia button{padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%}
.pmain img{width:100%;aspect-ratio:4/3;object-fit:cover}
.pthumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}
.pthumbs img{width:100%;aspect-ratio:1/1;object-fit:cover}
.ptext{display:flex;flex-direction:column;gap:14px}
.ptext h3{font-size:clamp(22px,2.2vw,28px)}
.ptext p{color:var(--text-2)}
.plabel{font-size:14px;font-weight:600;color:var(--ink)!important;margin-top:6px}
@media (max-width:860px){.proj{grid-template-columns:1fr}.proj.flip .pmedia{order:0}}
.drawing .slide{transform:translateX(0);transform-box:view-box}
.drawing.in-view .slide{animation:slide 2.6s ease-in-out 2s forwards}
@keyframes slide{to{transform:translateX(-220px)}}
@media (prefers-reduced-motion: reduce){.drawing.in-view .slide{animation:none}}
.cards.six{grid-template-columns:repeat(3,minmax(0,1fr))}
.card .card-svg{aspect-ratio:3/4;border:1px solid var(--line);background:var(--gips);display:flex;align-items:center;padding:14px}
.card .card-svg svg{width:100%;height:auto}
@media (max-width:960px){.cards.six{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.cards.six{grid-template-columns:1fr}}
.partner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center}
@media (max-width:860px){.partner{grid-template-columns:1fr}}
.card-svg .draw{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.card-svg .fadein{opacity:1;animation:none}

/* ---- Dropdown Leistungen ---- */
.has-sub{position:relative;display:flex;align-items:center}
.has-sub > a span{font-size:11px;margin-left:2px}
.has-sub .sub{position:absolute;top:100%;left:-18px;min-width:250px;padding:10px 0;background:var(--night);border:1px solid var(--night-line);display:none;flex-direction:column;z-index:30;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.has-sub .sub::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:flex}
.has-sub .sub a{padding:10px 18px;border-bottom:0;white-space:nowrap}
.has-sub .sub a:hover,.has-sub .sub a[aria-current="page"]{background:var(--night-2)}
.nav .has-sub .sub a{border-bottom:0}
.figures div:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
.nav{gap:22px}
.nav a,.header-cta .tel,.header-cta .btn{white-space:nowrap}
.has-sub > a{display:inline-flex;align-items:center;gap:4px}
@media (max-width:1180px){
  .nav,.header-cta .hide-sm{display:none}
  .menu-btn{display:inline-flex}
  .brand img{height:32px}
  .mobile-nav{display:block;overflow:hidden;max-height:0;transition:max-height .25s ease}
  .mobile-nav.open{max-height:640px;border-top:1px solid var(--night-line)}
  .mobile-nav a{display:block;padding:15px var(--gutter);text-decoration:none;font-size:18px;border-bottom:1px solid var(--night-line);color:var(--on-night)}
}