/* DIEHAUSMARKE | Designvorlage: LAURIS WEBSITE DHM, 09.10.2026 */

:root {
  --paper:#fff;
  --warm:#f1eee7;
  --stone:#dfddd1;
  --sage:#9e9f92;
  --ink:#050505;
  --footer:#23251d;
  --gutter:4.4vw;
  --line:rgba(35,37,29,.18);
  --type-scale-mobile:0.7;
  --text-bild-headline-size:calc(42px * var(--type-scale-mobile));
  --text-bild-lead-size:calc(25px * var(--type-scale-mobile));
  --hero-lead-size:clamp(20px,2.2vw,36px);
}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;}
body.warm {background:var(--warm);}
a {color:inherit;text-decoration:none;}
button {font:inherit;}
img {display:block;width:100%;height:auto;}
figure,p,h1,h2,h3 {margin:0;}
a,button,summary {-webkit-tap-highlight-color:transparent;}
a:focus-visible,button:focus-visible,summary:focus-visible {outline:3px solid #8c4800;outline-offset:6px;}
.skip {position:fixed;top:-80px;left:16px;background:white;padding:16px;z-index:100;}
.skip:focus {top:16px;}
.sr-only {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
.site-header {position:fixed;z-index:100;top:0;left:0;width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;padding:18px 22px;color:#fff;gap:20px;background:transparent;}
.brand {width:138px;display:block;}
.brand img,.center-brand img {filter:invert(1);}
.center-brand {justify-self:center;text-align:center;padding-top:2px;}
.center-brand span {font-size:11px;font-weight:700;letter-spacing:.02em;white-space:nowrap;}
.center-brand img {width:40px;margin:7px auto 0;}
.site-header nav {display:flex;justify-content:flex-end;gap:23px;padding-top:4px;font-size:11px;font-weight:700;white-space:nowrap;}
.site-header nav a {padding:3px 0;}
.site-header nav a:hover {text-decoration:underline;text-underline-offset:4px;}
.site-header nav [aria-current] {color:#080808;}
.on-photo nav [aria-current] {color:#fff;border-bottom:1px solid #fff;}
.menu-toggle {display:none;}
.photo-hero {display:block;position:relative;width:100%;height:44vw;min-height:430px;max-height:900px;overflow:hidden;}
.photo-hero>img {height:100%;object-fit:cover;object-position:center 53%;}
.hero-link {position:absolute;bottom:25px;left:var(--gutter);background:rgba(0,0,0,.5);color:#fff;padding:10px 14px;font-size:14px;opacity:0;transition:opacity .2s;}
.photo-hero:hover .hero-link,.photo-hero:focus-visible .hero-link {opacity:1;}
.project-grid,.image-pair,.split {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;}
.project-card {position:relative;overflow:hidden;aspect-ratio:1.08;}
.project-card img {height:100%;object-fit:cover;}
.project-card figcaption {position:absolute;bottom:25px;left:26px;color:white;font-size:25px;font-weight:700;text-shadow:0 1px 8px #0008;opacity:0;transition:opacity .2s;}
.project-card:hover figcaption {opacity:1;}
.project-intro>img,.image-pair>img {height:100%;aspect-ratio:1.08;object-fit:cover;}
.text-panel {display:flex;flex-direction:column;justify-content:flex-end;padding:40px var(--gutter);min-height:100%;}
.text-panel-body {display:flex;flex-direction:column;justify-content:flex-end;width:100%;}
.text-panel--has-main {justify-content:space-between;}
.text-panel--has-main .text-panel-body {flex:1;}
.text-panel h1 {font-size:clamp(36px,4.55vw,76px);line-height:.95;letter-spacing:-.065em;font-weight:700;}
h2 {font-size:clamp(36px,4.55vw,76px);line-height:.95;letter-spacing:-.065em;font-weight:700;}
.project-intro h2,.project-story h2,.project-intro .text-panel-main,.project-story .text-panel-main {font-size:var(--text-bild-headline-size);line-height:.95;letter-spacing:-.065em;font-weight:700;}
.lead {font-size:clamp(21px,2.25vw,40px);font-weight:700;line-height:.94;letter-spacing:-.052em;max-width:680px;}
.project-intro .lead,.project-story .lead {font-size:var(--text-bild-lead-size);line-height:1.03;}
.text-panel .lead {margin-top:36px;}
.image-caption {font-size:var(--text-bild-lead-size);line-height:1.03;letter-spacing:-.052em;font-weight:700;padding:28px 5.6vw;}
.wide-image>img {width:100%;aspect-ratio:2.05;object-fit:cover;min-height:420px;}
.project-story .text-panel {justify-content:center;}
.project-story .text-panel--has-main {justify-content:space-between;}
.project-story>div>img,.media-stack>img {aspect-ratio:1.08;object-fit:cover;}
.media-stack {display:flex;flex-direction:column;}
.media-stack>img {width:100%;height:auto;}
.courtyard>img {aspect-ratio:2.23;}
.project-facts {padding:55px var(--gutter);gap:5vw;}
.project-facts h2 {font-size:clamp(30px,3vw,50px);margin-bottom:22px;}
.project-facts p {margin-bottom:25px;}
.text-link {display:inline-block;padding:5px 0;border-bottom:1px solid currentColor;font-size:14px;}
.text-link:hover {opacity:.65;}
dl {display:grid;grid-template-columns:100px 1fr;gap:14px;font-size:14px;line-height:1.4;margin:0;}
dt {color:#666;}
dd {margin:0;}
.text-hero {padding:205px var(--gutter) 58px;min-height:590px;background:var(--stone);display:flex;flex-direction:column;justify-content:flex-end;}
.text-hero h1 {font-size:clamp(50px,6.75vw,118px);letter-spacing:-.065em;line-height:.93;font-weight:700;}
.text-hero h1 span {color:#fff;}
.text-hero .lead {margin-top:14px;max-width:42%;font-size:var(--hero-lead-size);}
.stone {background:var(--stone);}
.sage {background:var(--sage);}
.accordions {padding:90px var(--gutter);background:var(--warm);}
details {border-top:1px solid var(--line);}
summary {cursor:pointer;display:flex;align-items:baseline;gap:18px;list-style:none;font-size:26px;padding:24px 0;font-weight:400;}
summary::-webkit-details-marker {display:none;}
summary:before {content:'';display:inline-block;flex-shrink:0;width:11px;height:11px;background:url('../Images/pfeil-rechts.png') center/contain no-repeat;}
details[open]>summary:before {background-image:url('../Images/pfeil-runter.png');}
.number {font-size:.8em;}
.detail-content {padding:0 0 30px 22px;max-width:640px;font-size:18px;line-height:1.45;}
.detail-content .text-link {margin-top:18px;}
.conversation {padding:140px var(--gutter) 70px;background:var(--stone);gap:5vw;}
.conversation>div {padding-top:5px;font-size:16px;max-width:460px;font-weight:700;letter-spacing:-.035em;}
.conversation .text-link {margin-top:12px;}
.inset {margin:0 var(--gutter);}
.studio-intro {padding-top:70px;border-top:1px solid var(--line);gap:8vw;}
.eyebrow {font-size:11px;letter-spacing:.08em;font-weight:700;line-height:1.4;}
.studio-intro h2 {margin:18px 0 14px;}
.studio-intro>img {height:100%;object-fit:cover;max-height:640px;}
.small-copy {font-size:16px;line-height:1.35;letter-spacing:-.035em;font-weight:700;max-width:460px;margin-top:60px;}
.studio-second {padding-top:25px;gap:8vw;}
.studio-second img {max-height:640px;width:100%;object-fit:cover;}
.bios {gap:8vw;padding-top:70px;font-size:15px;line-height:1.45;}
.bios h3 {font-size:22px;margin:6px 0;}
.process .eyebrow {margin-bottom:20px;}
.process summary {font-size:19px;padding:18px 0;}
.statement {padding:140px var(--gutter) 70px;}
.statement h2 {font-size:clamp(40px,4.6vw,78px);}
.impulse-intro {padding:75px 0 65px;gap:6vw;border-top:1px solid var(--line);}
.impulse-intro>img {margin-top:120px;height:560px;object-fit:cover;}
.impulse-intro>div {padding-top:8px;}
.sketch {border-top:1px solid var(--line);padding-top:35px;}
.sketch img {width:100%;max-height:620px;object-fit:contain;background:white;}
.sketch figcaption {font-size:9px;padding:10px 0;}
.article-copy {padding:65px var(--gutter) 90px;margin-left:50%;max-width:830px;font-size:18px;line-height:1.5;}
.article-copy .eyebrow {margin-bottom:25px;}
.article-copy h1 {font-size:clamp(36px,4.55vw,76px);letter-spacing:-.065em;font-weight:700;line-height:.95;margin:0 0 14px;}
.article-copy h2 {font-size:32px;letter-spacing:-.035em;font-weight:400;line-height:1.05;margin:35px 0 14px;}
.article-copy p {margin-bottom:20px;}
.contact-intro {border-top:1px solid var(--line);padding:75px 0;gap:8vw;}
.addresses {padding-top:18px;}
address {font-style:normal;margin-bottom:55px;font-size:16px;line-height:1.6;}
address h3 {font-size:25px;font-weight:400;margin:15px 0 8px;}
address p {margin-bottom:16px;}
address .eyebrow {margin:0;}
address a:hover {text-decoration:underline;}
.contact-photos {gap:6vw;padding:0 0 80px;margin-bottom:0;}
body.warm .contact-intro,body.warm .contact-photos {background:var(--warm);}
body.warm main {background:var(--warm);}
address .contact-web {display:inline-block;margin-bottom:16px;text-decoration:underline;text-underline-offset:3px;}
address .contact-phone-or {display:inline-block;margin:10px 0 4px;font-size:14px;line-height:1.4;}
.contact-photos figure:last-child {align-self:end;margin-top:180px;}
.contact-photos img {width:100%;}
.contact-photos figcaption {font-weight:700;font-size:16px;letter-spacing:-.035em;line-height:1.35;max-width:320px;padding-top:15px;}
body.impressum .site-header {position:absolute;}
.contact-portrait {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6vw;padding:70px var(--gutter);align-items:start;background:#fff;}
.contact-list {display:grid;gap:50px;}
.legal-unit h2 {font-size:clamp(32px,3.4vw,58px);line-height:.98;letter-spacing:-.055em;margin:15px 0 22px;}
.legal-unit address {font-style:normal;font-size:16px;line-height:1.5;margin:0 0 20px;}
.legal-unit p {font-size:16px;line-height:1.5;}
.legal-unit .eyebrow {font-size:11px;}
.legal-unit a {text-decoration:underline;text-underline-offset:4px;}
.legal-unit dl {display:grid;grid-template-columns:160px minmax(0,1fr);gap:10px 20px;margin-top:22px;font-size:14px;line-height:1.4;}
.legal-unit dt {color:#64645e;overflow-wrap:anywhere;}
.legal-unit dd {margin:0;overflow-wrap:anywhere;}
.legal-unit dd a {overflow-wrap:anywhere;}
.team-photo {margin:0;position:sticky;top:25px;}
.team-photo img {width:100%;height:auto;}
.team-photo figcaption {font-size:11px;padding-top:12px;color:#555;}
.process {background:#fff;border-top:1px solid var(--line);}
.process .detail-content {max-width:850px;font-size:16px;line-height:1.6;}
.process .detail-content p+p {margin-top:18px;}
.legal-pending {padding:0 var(--gutter) 60px;background:#fff;}
.legal-pending summary {font-size:18px;}
.legal-heading {font-size:clamp(30px,4vw,56px);letter-spacing:-.055em;margin-bottom:20px;}
.legal-intro {font-size:15px;line-height:1.5;max-width:850px;margin-bottom:35px;}
.legal-body {max-width:850px;padding:0 0 28px;font-size:15px;line-height:1.65;}
.legal-body p+p {margin-top:20px;}
.owner-pending {background:#f1eee7;padding:18px;}
.footer {background:var(--paper);color:var(--ink);padding:55px var(--gutter) 30px;}
.footer>.eyebrow {font-weight:400;font-size:10px;margin-bottom:25px;letter-spacing:.15em;}
.conversation.split>h2,.footer-cta {font-size:clamp(36px,4.55vw,76px);line-height:.95;letter-spacing:-.065em;font-weight:700;}
.footer-cta {display:block;color:inherit;}
.footer-cta:hover {opacity:.65;}
.footer-intro {margin-top:48px;max-width:520px;font-size:16px;line-height:1.35;letter-spacing:-.035em;font-weight:400;}
.footer-logo {display:block;width:120px;height:auto;margin-top:56px;}
.footer-bottom {display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--line);padding-top:25px;margin-top:72px;gap:25px;font-size:11px;line-height:1.6;}
.footer-bottom nav {display:flex;gap:16px;justify-content:center;}
.footer-bottom>p:last-child {text-align:right;}
.backtop {display:inline-block;font-size:11px;margin-top:25px;}
.project-pager {display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:20px;padding:45px var(--gutter) 55px;border-top:1px solid var(--line);}
.project-pager-next {text-align:right;}
@media(min-width:1800px) {
  :root {--gutter:80px;}
  .text-hero {min-height:700px;}
  .site-header {padding:26px 30px;}
  .brand {width:165px;}
  .site-header nav {font-size:14px;}
}
@media(max-width:900px) {
  .legal-unit dl {grid-template-columns:1fr;gap:4px;}
  .legal-unit dt {margin-top:8px;}
  .site-header {grid-template-columns:1fr 1fr;}
  .center-brand {display:none;}
  .site-header nav {gap:15px;}
  .brand {width:110px;}
  .text-hero {min-height:500px;}
  .text-hero .lead {max-width:55%;}
  .small-copy {margin-top:35px;}
  .studio-intro,.studio-second,.bios {gap:5vw;}
  .impulse-intro>img {height:400px;}
  .footer-bottom {grid-template-columns:1fr 1fr;}
  .footer-bottom nav {justify-content:flex-end;}
  .footer-bottom>p:last-child {grid-column:1/-1;text-align:left;}
}
@media(max-width:620px) {
  :root {--gutter:22px;--type-scale:0.7;}
  main {font-size:calc(16px * var(--type-scale));}
  .site-header {padding:15px 20px;align-items:start;}
  .brand {width:92px;}
  .menu-toggle {display:flex;gap:28px;align-items:center;justify-self:end;border:0;background:transparent;color:inherit;font-weight:700;font-size:calc(14px * var(--type-scale));padding:8px 0;cursor:pointer;}
  .menu-toggle span {font-size:calc(24px * var(--type-scale));line-height:16px;}
  .site-header nav {display:none;position:absolute;top:115px;left:0;right:0;background:var(--footer);padding:25px 22px;flex-direction:column;gap:16px;font-size:calc(23px * var(--type-scale));box-shadow:0 15px 30px #0002;}
  .site-header nav.is-open {display:flex;}
  .site-header nav [aria-current] {color:white;text-decoration:underline;text-underline-offset:5px;}
  .on-photo nav [aria-current] {border:0;}
  .photo-hero {height:76svh;min-height:450px;max-height:720px;}
  .photo-hero>img {object-position:51% center;}
  .hero-link {opacity:1;font-size:calc(12px * var(--type-scale));bottom:20px;}
  .project-grid {grid-template-columns:1fr;}
  .project-card {aspect-ratio:1.12;}
  .project-card figcaption {opacity:1;font-size:calc(20px * var(--type-scale));left:22px;bottom:20px;}
  .split {grid-template-columns:1fr;}
  .image-pair {grid-template-columns:1fr;}
  .text-panel {padding:55px 22px;}
  .project-intro>img {aspect-ratio:1.05;}
  .text-panel .lead {margin-top:25px;}
  .text-panel h1,.text-panel h2 {font-size:calc(clamp(36px,4.55vw,76px) * var(--type-scale));}
  .project-intro h2,.project-story h2,.project-intro .text-panel-main,.project-story .text-panel-main {font-size:var(--text-bild-headline-size);line-height:.95;letter-spacing:-.065em;}
  .project-intro .lead,.project-story .lead {font-size:var(--text-bild-lead-size);line-height:1.03;}
  .lead {font-size:calc(25px * var(--type-scale));line-height:1.03;}
  .image-pair>img {aspect-ratio:1.05;object-fit:cover;}
  .image-caption {padding:25px 22px;font-size:var(--text-bild-lead-size);line-height:1.03;letter-spacing:-.052em;}
  .wide-image>img {aspect-ratio:1.05;min-height:unset;}
  .courtyard>img {aspect-ratio:1.5;}
  .project-story>div>img,.media-stack>img {aspect-ratio:1.2;}
  .project-facts {padding:45px 22px;gap:35px;}
  .project-facts h2 {font-size:calc(35px * var(--type-scale));}
  .project-facts p {font-size:calc(16px * var(--type-scale));}
  dl {font-size:calc(13px * var(--type-scale));grid-template-columns:85px 1fr;}
  .text-hero {min-height:590px;padding:205px 22px 45px;}
  .text-hero h1 {font-size:clamp(calc(44px * var(--type-scale)),11vw,calc(69px * var(--type-scale)));letter-spacing:-.065em;line-height:.96;}
  .text-hero .lead {max-width:95%;font-size:calc(22px * var(--type-scale));line-height:1;margin-top:23px;}
  .accordions {padding:50px 22px;}
  summary {font-size:calc(20px * var(--type-scale));gap:10px;padding:22px 0;}
  .detail-content {font-size:calc(16px * var(--type-scale));padding-left:0;}
  .conversation {padding:90px 22px 45px;gap:32px;}
  .conversation h2,.footer-cta {font-size:calc(45px * var(--type-scale));}
  .conversation>div {max-width:300px;font-size:calc(16px * var(--type-scale));}
  .studio-intro {padding-top:40px;gap:32px;}
  .studio-intro h2 {font-size:calc(45px * var(--type-scale));}
  .studio-intro>img {max-height:none;aspect-ratio:.87;}
  .studio-second {padding-top:22px;}
  .studio-second img {max-height:none;aspect-ratio:.87;}
  .bios {padding-top:40px;gap:30px;font-size:calc(15px * var(--type-scale));}
  .bios h3 {font-size:calc(22px * var(--type-scale));}
  .process summary {font-size:calc(19px * var(--type-scale));}
  .small-copy {font-size:calc(15px * var(--type-scale));margin-top:30px;}
  .statement {padding:90px 22px 45px;}
  .statement h2 {font-size:calc(40px * var(--type-scale));}
  .impulse-intro {padding:40px 0;gap:30px;}
  .impulse-intro>img {order:2;margin-top:0;height:420px;}
  .impulse-intro h2 {font-size:calc(43px * var(--type-scale));}
  .sketch {padding-top:25px;}
  .sketch figcaption {font-size:calc(9px * var(--type-scale));}
  .article-copy {margin-left:0;padding:35px 22px 50px;font-size:calc(16px * var(--type-scale));}
  .article-copy h1 {font-size:clamp(calc(32px * var(--type-scale)),8vw,calc(42px * var(--type-scale)));}
  .article-copy h2 {font-size:calc(29px * var(--type-scale));}
  .contact-intro {padding:40px 0;gap:35px;}
  .contact-intro h2 {font-size:calc(43px * var(--type-scale));}
  .addresses {padding:0;}
  address {margin-bottom:30px;font-size:calc(15px * var(--type-scale));}
  address h3 {font-size:calc(25px * var(--type-scale));}
  address:last-child {margin-bottom:0;}
  .contact-photos {gap:30px;padding-bottom:45px;}
  .contact-photos figure:last-child {margin-top:0;}
  .contact-photos figcaption {font-size:calc(15px * var(--type-scale));}
  .contact-portrait {grid-template-columns:1fr;padding:40px 22px;gap:35px;}
  .contact-list {gap:40px;}
  .team-photo {position:static;}
  .legal-unit h2 {font-size:36px;}
  .legal-unit dl {font-size:14px;}
  .process .detail-content {font-size:15px;}
  .legal-pending {padding:0 22px 40px;}
  .legal-unit address,.legal-unit p {font-size:15px;}
  .footer {padding:40px 22px 25px;}
  .footer>.eyebrow {font-size:calc(10px * var(--type-scale));}
  .footer-intro {margin-top:32px;font-size:calc(15px * var(--type-scale));max-width:100%;}
  .footer-logo {width:120px;margin-top:40px;}
  .footer-bottom {display:flex;flex-direction:column;margin-top:48px;gap:20px;font-size:calc(11px * var(--type-scale));}
  .footer-bottom nav {justify-content:flex-start;}
  .footer-bottom>p:last-child {text-align:left;}
  .backtop {font-size:calc(11px * var(--type-scale));}
  main .text-link,.footer .text-link {font-size:calc(14px * var(--type-scale));}
  main .eyebrow {font-size:calc(11px * var(--type-scale));}
  .project-pager {padding:35px 22px 40px;}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
  * {transition:none!important;}
}
@media print {
  .site-header {position:static;}
  .menu-toggle,.backtop,.skip {display:none;}
  .footer,.text-hero {-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}
