/* Zentrale, fließende Schriftgrößen. 1rem respektiert die Browser-Grundschrift. */
:root{
 --text-body:clamp(1rem,.96rem + .18vw,1.125rem);
 --text-lead:clamp(1.125rem,1.02rem + .45vw,1.375rem);
 --text-small:clamp(.875rem,.83rem + .18vw,1rem);
 --text-label:clamp(.8125rem,.78rem + .12vw,.875rem);
 --text-button:clamp(.9375rem,.9rem + .15vw,1rem);
 --text-nav:clamp(.9375rem,.88rem + .18vw,1rem);
 --text-h1:clamp(3.25rem,1.6rem + 8vw,10.3125rem);
 --text-page-title:clamp(2.75rem,1.5rem + 5vw,7rem);
 --text-h2:clamp(2.125rem,1.2rem + 3.7vw,4.875rem);
 --text-h3:clamp(1.5rem,1.25rem + 1vw,2rem);
}
body{font-size:var(--text-body)}
.hero h1{font-size:var(--text-h1)}
.service-hero h1,.reference-intro h1,.project-intro h1,.legal-page h1{font-size:var(--text-page-title)}
.section-heading h2,.partner-intro h2,.agency h2,.service-detail-intro h2,.service-cases-heading h2,.service-faq h2,.journey-heading h2,.reference-cta h2,.project-videos h2{font-size:var(--text-h2)}
.contact h2{font-size:clamp(3rem,1.2rem + 7vw,9rem)}
.service-contact h2{font-size:var(--text-h2)}
.service h3,.service:has(.service-keyvisual) h3{font-size:clamp(1.75rem,1.3rem + 2vw,2.8125rem)}
.process h3,.scope-grid h3,.journey-caption h3,.video-card h3,.reference-caption h2,.service-cases .reference-caption h3{font-size:var(--text-h3)}
.hero-description p,.service p,.work-intro,.agency-copy p,.partner-copy p,.process p,.project-description,.contact-bottom p,.service-contact .contact-bottom>p,.scope-grid p,.service-faq details p,.journey-heading>p,.journey-caption p,.reference-lead,.service-detail-intro>p,.legal-copy p,.legal-copy li{font-size:var(--text-body);line-height:1.7}
.service-hero-bottom>p,.project-summary>p,.project-copy p{font-size:var(--text-lead);line-height:1.7}
.agency-copy .large{font-size:clamp(1.5rem,1.2rem + 1vw,1.875rem);line-height:1.3}
.hero-kicker,.tiny-label,.eyebrow,.process-label,.journey-stage,.journey-number,.process-number,.number,.project-summary h2,.agency-person p,.agency-portrait figcaption>span+span{font-size:var(--text-label);line-height:1.6}
.hero-kicker{flex-wrap:wrap;gap:10px 24px;letter-spacing:.08em}
.tags li{font-size:var(--text-label);line-height:1.5;padding:7px 11px}
.pill,.nav-contact,.menu,.lightbox button{font-size:var(--text-button);line-height:1.45;min-height:44px}
.pill{white-space:normal}.hero-description .pill{white-space:normal}
#navigation,.services-dropdown>a,.services-dropdown>a:first-child{font-size:var(--text-nav);line-height:1.5}
.text-link,.project-summary .text-link,.back-link,.breadcrumbs,.project-link,.service-more,.related-services>a,.journey-caption>.journey-project,.video-action,.reference-filters button{font-size:var(--text-small);line-height:1.6}
.project-caption h3{font-size:var(--text-h3)}
.reference-card p,#reference-count,.video-note,.journey-footnote,.draft-note,.image-hint,.lightbox-caption{font-size:var(--text-small);line-height:1.6}
.journey-image-note{font-size:var(--text-label);line-height:1.5;letter-spacing:.035em}
.footer-main p,.footer-bottom{font-size:var(--text-small);line-height:1.7}
.footer-bottom>div{display:flex;flex-wrap:wrap;gap:8px 20px}
.service-faq summary{font-size:clamp(1.0625rem,1rem + .2vw,1.25rem);line-height:1.5}
.email,.service-contact-links{font-size:clamp(1rem,.65rem + 1.5vw,1.875rem);overflow-wrap:anywhere}
.service-contact-links>a+a{font-size:var(--text-body)}
.breadcrumbs{display:block;position:static;background:none;border:0;padding:0;max-height:none}
@media(max-width:1100px){
 .header{height:90px;position:relative}
 .menu{display:flex;gap:15px;align-items:center;justify-content:flex-end;min-width:64px;border:0;background:none;color:var(--ink);padding:12px 0}
 #navigation{display:none;position:absolute;z-index:30;top:90px;left:0;right:0;background:var(--paper);padding:12px 18px;border-bottom:1px solid var(--ink)}
 #navigation.open{display:flex;flex-direction:column;align-items:stretch;gap:8px;max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain}
 #navigation.open>a:not(.nav-contact){display:flex;align-items:center;min-height:44px}
 #navigation .nav-contact{align-self:flex-start;margin:8px 0 0}
 .services-menu>summary{display:flex;justify-content:space-between;min-height:44px;align-items:center;padding:0}
 .services-dropdown{position:static;min-width:0;border:0;border-left:2px solid #f8b33e;box-shadow:none;margin-top:10px;padding:0 0 0 12px}
 .services-dropdown>a{display:flex;align-items:center;min-height:44px;white-space:normal}
}

/* Ruhigere Desktop-Abstufung; mobile Mindestgrößen bleiben erhalten. */
@media(min-width:701px){
 :root{
  --text-body:clamp(1rem,.95rem + .12vw,1.0625rem);
  --text-lead:clamp(1.125rem,1.04rem + .25vw,1.25rem);
  --text-small:clamp(.875rem,.84rem + .08vw,.9375rem);
  --text-label:clamp(.8125rem,.79rem + .04vw,.84375rem);
  --text-button:clamp(.9375rem,.91rem + .05vw,.96875rem);
  --text-nav:clamp(.875rem,.84rem + .08vw,.9375rem);
  --text-h1:clamp(3.25rem,1.6rem + 7vw,9rem);
  --text-page-title:clamp(2.75rem,1.5rem + 4vw,5.5rem);
  --text-h2:clamp(2.125rem,1.2rem + 2.8vw,4rem);
  --text-h3:clamp(1.5rem,1.25rem + .6vw,1.75rem);
 }
 .agency h2{font-size:clamp(2.125rem,1.2rem + 2.2vw,3rem)}
 .service h3,.service:has(.service-keyvisual) h3{font-size:clamp(1.75rem,1.3rem + 1.4vw,2.375rem)}
 .contact h2{font-size:clamp(3rem,1.2rem + 6vw,8rem)}
 .service-contact h2{font-size:var(--text-h2)}
}

/* Einheitlicher Eckenradius der Pill-Buttons. */
.pill,.nav-contact{border-radius:25px}

/* Entspanntere Laufweite für Abschnittsüberschriften. */
h2,.contact h2,.service-contact h2,.legal-copy h2{letter-spacing:-2px}

/* Lightbox: rahmenlose Pfeile auf halber Höhe. */
.lightbox .lightbox-prev,.lightbox .lightbox-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2;border:0;border-radius:0;background:transparent;font-size:32px;line-height:1;min-width:48px;min-height:48px;padding:8px;color:#fff;text-shadow:0 1px 5px #000,0 0 12px #000;}
.lightbox .lightbox-prev{left:12px}.lightbox .lightbox-next{right:12px}
.lightbox .lightbox-prev:hover,.lightbox .lightbox-next:hover{background:transparent;color:#f8b33e}
.lightbox-footer{justify-content:center}.lightbox-caption{width:100%}
@media(max-width:700px){.lightbox .lightbox-prev{left:2px}.lightbox .lightbox-next{right:2px}}