:root{
  --ink:#111111;--ink-soft:#252525;--paper:#f7f5f0;--white:#fff;
  --grey:#c9c7c1;--line:rgba(17,17,17,.18);--accent:#ff4d3d;--nav-active:#ff4d3d;
  --bg:#f7f5f0;--panel:#fff;--muted:#555550;--accent-2:#ff4d3d;
  --cyan:#ff4d3d;--lime:#ff4d3d;--coral:#ff4d3d;--blue:#111111;--violet:#252525;
  --header:84px;--page:min(1600px,calc(100% - 48px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 24px)}
body{margin:0!important;padding:var(--header) 0 0!important;background:var(--paper)!important;color:var(--ink)!important;font-family:Inter,"Helvetica Neue",Arial,sans-serif!important;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit}
:focus-visible{outline:3px solid var(--accent)!important;outline-offset:4px}
.wrap{width:var(--page)!important;max-width:none!important;margin-inline:auto!important}
section{padding-block:clamp(64px,8vw,128px)!important}
h1,.title,h2,h3{font-family:inherit!important;color:inherit;letter-spacing:-.045em!important}
h1,.title{font-size:clamp(3rem,7.4vw,7rem)!important;line-height:.88!important}
h2{font-size:clamp(2.35rem,5vw,4.8rem)!important;line-height:.95!important}
h3{font-size:clamp(1.25rem,2vw,1.7rem)!important;line-height:1.08!important}
.lead,.subtitle,.hero-copy{font-size:clamp(1.05rem,1.35vw,1.35rem)!important;line-height:1.6!important}
.kicker,.service-label{color:var(--accent)!important;font-size:.9rem!important;font-weight:800!important;line-height:1.45!important;letter-spacing:.12em!important;text-transform:uppercase!important}

/* Fixed, compact brand header */
.topbar{position:fixed!important;z-index:1200!important;inset:0 0 auto!important;width:100%!important;height:var(--header)!important;padding:0!important;background:var(--grey)!important;border-bottom:1px solid var(--ink)!important}
.topbar .nav{position:relative!important;width:var(--page)!important;max-width:none!important;height:100%!important;margin:auto!important;padding:0 0 0 190px!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:28px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important}
.topbar .brand{display:none!important}
.topbar .nav{padding-left:0!important}
.brand-logo{display:block;width:100%;height:100%;object-fit:contain}
.topbar .main-nav{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:max-content!important;display:flex!important;flex:0 0 auto!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:clamp(18px,2.2vw,38px)!important}
.topbar .main-nav>a{position:relative;min-height:48px!important;padding:14px 2px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--ink)!important;font-size:1.25rem!important;font-weight:750!important;text-align:center!important;text-decoration:none!important;transition:color .18s ease!important}
.topbar .main-nav>a::after{display:none!important;content:none!important}
.topbar .main-nav>a:hover,.topbar .main-nav>a.active,.topbar .main-nav>a[aria-current="page"]{color:var(--nav-active)!important}
.nav-signature{display:none!important}

/* Shared square controls */
.btn{min-height:52px!important;padding:14px 22px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:1px solid currentColor!important;border-radius:0!important;box-shadow:none!important;font-weight:800!important;text-decoration:none!important;transition:background .18s ease,color .18s ease,transform .18s ease!important}
.btn:hover{transform:translateY(-2px)!important}

/* Existing page modules translated into the angular system */
.section-head{display:grid!important;grid-template-columns:minmax(260px,.8fr) minmax(300px,1fr)!important;gap:clamp(28px,7vw,120px)!important;align-items:start!important;margin-bottom:clamp(36px,5vw,72px)!important;padding-bottom:28px!important;border-bottom:1px solid var(--line)!important}
.section-head h2{margin:0!important}.section-head .lead{max-width:62ch!important;margin:0!important;padding-top:8px;color:#424242!important}
main>.hero{min-height:calc(100svh - var(--header))!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
main>.hero::before{animation:none!important;transform:none!important}
.hero-inner{width:var(--page)!important;max-width:none!important;margin:auto!important;padding:clamp(80px,12vh,150px) 0 68px!important}
.hero-inner .title{max-width:12ch!important}.hero-inner .subtitle{max-width:680px!important}
.portfolio-intro{padding-bottom:32px!important;background:#fff!important}
.portfolio-panel{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}
.service,.service-media,.process-shell{border-radius:0!important}
.experience-band{background:#dedede!important}
.feature-grid,.services-grid,.proof-grid{gap:14px!important}
.feature,.service,.process-shell,.proof-card{border:1px solid var(--ink)!important;border-radius:0!important;box-shadow:none!important}
.feature{background:#fff!important}.service{background:#fff!important;overflow:hidden!important}.service:hover{transform:none!important;box-shadow:none!important}
.service details{border-radius:0!important;background:#eee!important}
.process-shell{background:#d3d3d3!important}.process-tabs,.tab-button{border-radius:0!important}.tab-button.active{background:var(--accent)!important;color:#fff!important}
.proof-card{background:#fff!important}.proof-card:nth-child(2n){background:var(--grey)!important}
.grad{background:none!important;color:#8f8f8f!important;-webkit-text-fill-color:currentColor!important}
.metric-card strong,.step-number{color:var(--accent)!important}
.metric-card strong,.step-number{display:none!important}
.reveal-site{opacity:0;transform:translateY(18px);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.reveal-site.in-view{opacity:1;transform:none}

/* One visual language across all content pages */
body::before,body::after{display:none!important}
.fotografie-page main>.hero{
  min-height:calc(100svh - var(--header))!important;
  display:grid!important;place-items:end start!important;overflow:hidden!important;
  background:var(--ink)!important
}
.fotografie-page main>.hero::before{
  inset:0!important;border-radius:0!important;transform:scale(1.01)!important;opacity:.72!important;
  background-image:image-set(url('../images/photography/webp/hero/photo_photo.webp') type('image/webp'),url('../images/photography/optimized/hero/photo_photo.jpg') type('image/jpeg'))!important;
  background-position:center 54%!important;background-size:cover!important;background-repeat:no-repeat!important
}
.fotografie-page main>.hero::after{
  display:block!important;content:""!important;position:absolute!important;inset:0!important;
  background:rgba(0,0,0,.1)!important;pointer-events:none!important
}
.fotografie-page .hero-inner{z-index:2!important;text-align:left!important;margin:0 auto!important;padding:clamp(90px,14vh,160px) 0 clamp(72px,10vh,120px)!important}
.fotografie-page .hero-inner .title{
  max-width:10ch!important;
  margin:.18em 0 .28em!important;
  color:#fff!important;
  letter-spacing:-.045em!important
}
.fotografie-page .hero-inner .title span{color:var(--grey)!important;font-weight:350!important}
.fotografie-page .hero-inner .subtitle{max-width:650px!important;color:#eee!important}
.fotografie-page #portfolio{background:#fff!important}
.fotografie-page #realestate{background:var(--paper)!important}

/* Photography page: same angular editorial system as the homepage */
.fotografie-page main{background:var(--paper)!important;color:var(--ink)!important}
.fotografie-page main>.hero::before{
  opacity:1!important;
  filter:none!important
}
.fotografie-page .hero-inner .subtitle{
  margin:0!important;
  max-width:650px!important;
  color:#eee!important;
  font-size:clamp(1.08rem,1.5vw,1.4rem)!important;
  line-height:1.55!important
}
.fotografie-page .portfolio-intro{
  padding-block:clamp(64px,8vw,112px)!important;
  background:#fff!important
}
.fotografie-page .portfolio-panel{
  width:100%!important;display:grid!important;justify-items:center!important
}
.fotografie-page .portfolio-panel .section-head{width:100%!important;margin-bottom:0!important}
.fotografie-page #portfolio,.fotografie-page #realestate{
  padding-block:clamp(72px,9vw,132px)!important
}
.fotografie-page #portfolio{background:var(--paper)!important}
.fotografie-page #realestate{background:var(--grey)!important}
.fotografie-page #portfolio .wrap,.fotografie-page #realestate .wrap{display:grid!important}
.fotografie-page .photo-grid{
  width:100%!important;display:grid!important;gap:14px!important
}
.fotografie-page .photo-tile{
  width:100%!important;margin:0!important;display:block!important;
  border:1px solid var(--ink)!important;
  border-radius:0!important;background:var(--ink)!important;
  box-shadow:none!important;overflow:hidden!important;vertical-align:top!important
}
.fotografie-page .photo-tile picture{display:block!important;width:100%!important}
.fotografie-page .photo-cluster{
  display:grid!important;grid-template-columns:2fr 1fr!important;gap:14px!important;align-items:stretch!important
}
.fotografie-page .photo-cluster-reverse{grid-template-columns:1fr 2fr!important}
.fotografie-page .photo-stack{display:grid!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;gap:14px!important}
.fotografie-page .photo-cluster>.photo-tile,.fotografie-page .photo-stack>.photo-tile{height:100%!important}
.fotografie-page .photo-cluster>.photo-tile picture,.fotografie-page .photo-stack>.photo-tile picture{height:100%!important}
.fotografie-page .photo-cluster>.photo-tile img,.fotografie-page .photo-stack>.photo-tile img{
  height:100%!important;object-fit:cover!important
}
.fotografie-page .photo-pair{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;align-items:start!important}
.fotografie-page .photo-tile img{
  display:block!important;width:100%!important;height:auto!important;
  object-fit:contain!important;filter:none!important;cursor:zoom-in!important
}
.fotografie-page .photo-tile:hover img{transform:scale(1.012)!important}
.fotografie-page .portfolio-instagram{
  justify-self:center!important;width:max-content!important;min-height:72px!important;
  margin:clamp(18px,3vw,36px) auto 0!important;padding:8px 0 12px!important;
  display:flex!important;align-items:center!important;gap:16px!important;
  color:var(--ink)!important;border-bottom:2px solid var(--accent)!important;
  text-decoration:none!important;font-size:1.18rem!important;font-weight:800!important
}
.fotografie-page .portfolio-instagram svg{width:58px!important;height:58px!important;flex:0 0 auto!important}
.fotografie-page .portfolio-instagram span{display:grid!important;gap:2px!important;text-align:left!important}
.fotografie-page .portfolio-instagram small{
  color:var(--muted)!important;font-size:.82rem!important;font-weight:650!important;
  line-height:1.3!important;letter-spacing:.02em!important
}
.fotografie-page .portfolio-instagram:hover{color:var(--accent)!important}
.fotografie-page.lightbox-open{overflow:hidden!important}
.fotografie-page #lightbox{padding:clamp(56px,7vw,96px)!important;background:rgba(7,7,7,.94)!important}
.fotografie-page #lightbox-inner{
  position:relative!important;width:min(82vw,1500px)!important;height:min(82svh,1000px)!important
}
.fotografie-page #lightbox-img{
  width:100%!important;height:100%!important;object-fit:contain!important;
  border:0!important;border-radius:0!important
}
.fotografie-page .lightbox-close,.fotografie-page .lightbox-nav{
  position:absolute!important;z-index:2!important;width:52px!important;height:52px!important;
  display:grid!important;place-items:center!important;padding:0!important;
  border:1px solid rgba(255,255,255,.72)!important;border-radius:0!important;
  background:rgba(17,17,17,.72)!important;color:#fff!important;
  font:400 1.65rem/1 Arial,sans-serif!important;cursor:pointer!important
}
.fotografie-page .lightbox-close{top:20px!important;right:20px!important;font-size:2.1rem!important}
.fotografie-page .lightbox-prev{left:20px!important;top:50%!important;transform:translateY(-50%)!important}
.fotografie-page .lightbox-next{right:20px!important;top:50%!important;transform:translateY(-50%)!important}
.fotografie-page .lightbox-close:hover,.fotografie-page .lightbox-nav:hover{background:var(--accent)!important}
.fotografie-page .lightbox-count{
  position:absolute!important;left:50%!important;bottom:-38px!important;
  margin:0!important;transform:translateX(-50%)!important;
  color:#fff!important;font-size:1rem!important;white-space:nowrap!important
}
@media(max-width:700px){
  .fotografie-page main>.hero::before{background-image:image-set(url('../images/photography/webp/hero/photo_photo-1280.webp') type('image/webp'),url('../images/photography/optimized/hero/photo_photo.jpg') type('image/jpeg'))!important;background-position:62% center!important}
  .fotografie-page .photo-cluster,.fotografie-page .photo-cluster-reverse,.fotografie-page .photo-pair{grid-template-columns:1fr!important}
  .fotografie-page .photo-stack{grid-template-rows:none!important}
  .fotografie-page .photo-cluster>.photo-tile,.fotografie-page .photo-stack>.photo-tile{height:auto!important}
  .fotografie-page .photo-cluster>.photo-tile picture,.fotografie-page .photo-stack>.photo-tile picture{height:auto!important}
  .fotografie-page .photo-cluster>.photo-tile img,.fotografie-page .photo-stack>.photo-tile img{height:auto!important;object-fit:contain!important}
  .fotografie-page #lightbox{padding:72px 12px 90px!important}
  .fotografie-page #lightbox-inner{width:100%!important;height:calc(100svh - 162px)!important}
  .fotografie-page .lightbox-close{top:12px!important;right:12px!important}
  .fotografie-page .lightbox-prev{left:12px!important;top:auto!important;bottom:14px!important;transform:none!important}
  .fotografie-page .lightbox-next{right:12px!important;top:auto!important;bottom:14px!important;transform:none!important}
  .fotografie-page .lightbox-count{bottom:-52px!important}
}

.webdesign-page main>.hero{position:relative!important;padding-block:clamp(72px,9vw,140px)!important;background:var(--ink)!important;color:#fff!important;overflow:hidden!important}
.webdesign-page main>.hero::after{content:"";position:absolute;inset:22% 0 22% 56%;background:linear-gradient(135deg,transparent,rgba(201,199,193,.18));pointer-events:none}
.webdesign-page .hero-grid{position:relative;z-index:1}
.webdesign-page .hero h1,.webdesign-page .hero-copy{color:#fff!important}
.webdesign-page .hero-copy{color:#d7d5cf!important}
.webdesign-page .interface{border:1px solid var(--grey)!important;border-radius:0!important;background:#f7f5f0!important;box-shadow:none!important;transform:none!important}
.webdesign-page .interface::before{display:none!important}
.webdesign-page .window-bar,.webdesign-page .side-panel,.webdesign-page .main-panel{background:#e7e4dd!important}
.webdesign-page .code-card{border-radius:0!important;background:var(--ink)!important;box-shadow:none!important}
.webdesign-page .signal{border:1px solid var(--grey)!important;border-radius:0!important;background:transparent!important;color:#fff!important}
.webdesign-page .experience-band,.webdesign-page .process{background:var(--grey)!important}
.webdesign-page .services,.webdesign-page .proof{background:var(--paper)!important}
.webdesign-page .feature::after{display:none!important}
.webdesign-page .feature-icon{border-radius:0!important;background:var(--accent)!important;color:#fff!important}
.webdesign-page .preview-image,.webdesign-page .url,.webdesign-page .side-line{border-radius:0!important}
.webdesign-page .metric-card{border-radius:0!important;background:#fff!important}
.webdesign-page .service summary::after{border-radius:0!important;background:var(--accent)!important;color:#fff!important}
.webdesign-page .tab-button{border:1px solid var(--ink)!important}

/* Webdesign content palette: digital, cool and high-contrast.
   Header and footer deliberately keep the shared site palette. */
.webdesign-page main{
  --digital-ink:#071426;
  --digital-blue:#2563eb;
  --digital-cyan:#38bdf8;
  --digital-violet:#ff4d3d;
  --digital-coral:#ff4d3d;
  --digital-paper:#f7f5f0;
  --digital-panel:#ffffff;
  --digital-line:#c9c7c1;
  --digital-muted:#555550;
  color:var(--digital-ink)!important;
  background:var(--digital-paper)!important
}
.webdesign-page main>.hero{
  min-height:auto!important;
  background-color:#f7f5f0!important;
  background-image:
    linear-gradient(rgba(7,20,38,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(7,20,38,.055) 1px,transparent 1px),
    radial-gradient(circle at 18% 24%,rgba(255,77,61,.11),transparent 28%)!important;
  background-size:48px 48px,48px 48px,auto!important;
  color:var(--digital-ink)!important
}
.webdesign-page main>.hero::before{
  content:""!important;display:block!important;position:absolute!important;
  width:clamp(150px,19vw,310px)!important;aspect-ratio:1!important;
  left:clamp(-110px,-6vw,-40px)!important;bottom:clamp(-145px,-8vw,-70px)!important;
  border:1px solid rgba(37,99,235,.22)!important;border-radius:50%!important;
  background:transparent!important;pointer-events:none!important
}
.webdesign-page main>.hero::after{
  inset:7% 0 7% 58%!important;
  background:linear-gradient(145deg,#071426 0%,#1d4ed8 46%,#2563eb 78%,#ff4d3d 140%)!important;
  clip-path:polygon(12% 0,100% 0,100% 100%,0 100%)
}
.webdesign-page main .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important;gap:clamp(34px,5vw,88px)!important}
.webdesign-page main .hero h1{max-width:10.5ch!important;color:var(--digital-ink)!important}
.webdesign-page main .hero-copy{max-width:58ch!important;color:var(--digital-muted)!important}
.webdesign-page main .kicker,.webdesign-page main .service-label{color:var(--digital-coral)!important}
.webdesign-page main .hero .kicker{color:var(--digital-blue)!important}
.webdesign-page main .hero .kicker::before{display:none!important;content:none!important}
.webdesign-page main .service-label::before{display:none!important;content:none!important}
.webdesign-page main .kicker::before{background:var(--digital-coral)!important;box-shadow:0 0 0 7px rgba(255,77,61,.13)!important}
.webdesign-page main .grad{
  background:linear-gradient(90deg,#2563eb 0%,#2563eb 48%,#ff4d3d 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;-webkit-text-fill-color:transparent!important
}
.webdesign-page main .hero .btn{border-color:#94a3b8!important;background:rgba(255,255,255,.72)!important;color:var(--digital-ink)!important}
.webdesign-page main .signal{border-color:#bfd0e5!important;background:rgba(255,255,255,.76)!important;color:#334155!important}
.webdesign-page main .signal::before{background:var(--digital-coral)!important}
.webdesign-page main .signal:nth-child(2)::before{background:var(--digital-blue)!important}
.webdesign-page main .signal:nth-child(3)::before{background:#071426!important}
.webdesign-page main .hero-visual{min-height:clamp(440px,40vw,590px)!important}
.webdesign-page main .interface{
  inset:clamp(34px,4vw,62px) 0 clamp(28px,3vw,50px) 0!important;
  border-color:rgba(255,255,255,.7)!important;background:#eaf4ff!important;
  box-shadow:0 30px 70px rgba(7,20,38,.28)!important
}
.webdesign-page main .window-bar,.webdesign-page main .side-panel,.webdesign-page main .main-panel{background:#f8fbff!important}
.webdesign-page main .url{background:#dbeafe!important;color:#1e40af!important}
.webdesign-page main .side-line{background:#dbeafe!important}
.webdesign-page main .side-line:nth-child(2){background:#bae6fd!important}
.webdesign-page main .side-line:nth-child(4){background:#ddd6fe!important}
.webdesign-page main .metric-card{border:1px solid #dbeafe!important}
.webdesign-page main .code-card{background:linear-gradient(145deg,#06101f,#172554)!important}
.webdesign-page main .module-chip{border:1px solid #bfdbfe!important;color:#1e3a8a!important;background:#fff!important}
.webdesign-page main .experience-band{background:#dedbd4!important}
.webdesign-page main .services{background:var(--digital-paper)!important}
.webdesign-page main .process{background:#e7e4dd!important}
.webdesign-page main .proof{background:var(--digital-paper)!important}
.webdesign-page main .section-head{border-color:var(--digital-line)!important}
.webdesign-page main .section-head .lead,.webdesign-page main .feature p,.webdesign-page main .service p,.webdesign-page main .process-panel p,.webdesign-page main .proof-card span{color:var(--digital-muted)!important}
.webdesign-page main .feature,.webdesign-page main .service,.webdesign-page main .proof-card{border-color:var(--digital-line)!important;background:var(--digital-panel)!important}
.webdesign-page main .feature-icon{background:linear-gradient(135deg,#071426,var(--digital-blue))!important}
.webdesign-page main .service details{background:#efede8!important}
.webdesign-page main .service summary::after{background:var(--digital-blue)!important}
.webdesign-page main .detail-content{color:var(--digital-muted)!important}
.webdesign-page main .detail-content li::before{background:var(--digital-cyan)!important}
.webdesign-page main .process-shell{border-color:#c9c7c1!important;background:#fff!important}
.webdesign-page main .process-tabs{background:#efede8!important;border-color:#c9c7c1!important}
.webdesign-page main .tab-button{border-color:#9fb4cf!important;color:var(--digital-ink)!important;background:#fff!important}
.webdesign-page main .tab-button:hover{color:var(--digital-blue)!important}
.webdesign-page main .tab-button.active{border-color:var(--digital-blue)!important;background:var(--digital-blue)!important;color:#fff!important}
.webdesign-page main .step-number{background:linear-gradient(145deg,var(--digital-cyan),#60a5fa)!important}
.webdesign-page main .proof-card:nth-child(2n){background:#e7e4dd!important}
@media (max-width:1080px){
  .webdesign-page main>.hero::after{inset:48% 0 3% 12%!important;clip-path:polygon(8% 0,100% 0,100% 100%,0 100%)!important}
  .webdesign-page main .hero-grid{grid-template-columns:1fr!important}
  .webdesign-page main .hero h1{max-width:12ch!important}
  .webdesign-page main .hero-visual{min-height:500px!important}
}
@media (max-width:760px){
  .webdesign-page main>.hero{background-size:32px 32px,32px 32px,auto!important}
  .webdesign-page main>.hero::after{inset:53% 0 2% 5%!important}
  .webdesign-page main .hero-visual{min-height:430px!important}
}

.legal-page main{background:var(--paper)!important}
.legal-page .legal-main{padding-top:clamp(72px,9vw,140px)!important}
.legal-page .legal-main>.wrap>h1{padding-bottom:28px;border-bottom:1px solid var(--line)}
.legal-page #impressum{background:var(--grey)!important}
.legal-page .card{background:#fff!important;border:1px solid var(--ink)!important}

/* Legal page: restrained reading column */
.legal-main,.legal-main+section{background:var(--paper)!important}
.legal-main .wrap,#impressum .wrap{max-width:1100px!important}
.legal-main h1{font-size:clamp(3rem,7vw,6.5rem)!important}.legal-main h2,#impressum h2{font-size:clamp(2rem,4vw,3.5rem)!important}
.legal-main h3,#impressum h3{font-size:clamp(1.2rem,2vw,1.55rem)!important;letter-spacing:-.02em!important}
.card{padding:clamp(28px,5vw,64px)!important;border:1px solid var(--ink)!important;border-radius:0!important;background:#fff!important;box-shadow:none!important}
.card p,.card li{max-width:76ch;line-height:1.7}

/* Unified footer */
footer{padding:0!important;background:var(--ink)!important;color:#fff!important;border-top:5px solid var(--accent)!important}
.footer-grid{width:var(--page);margin:auto;padding:clamp(24px,3.5vw,46px) 0 18px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:clamp(22px,3vw,48px)}
.footer-intro{grid-column:1/-1;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.2)}
.footer-brand{display:grid;width:180px;max-width:100%;aspect-ratio:1;height:auto;padding:2px;place-items:center;border:0;background:transparent;color:var(--ink)}
.footer-brand img{display:block;width:100%;height:100%;object-fit:contain;filter:invert(1)}
.footer-copy{max-width:none;margin:0;color:#d0cec8;font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.5}.footer-title{margin:0 0 10px;font-size:.88rem;font-weight:800;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:#c9c7c1}
.footer-links{display:grid;gap:6px}.footer-links a{padding-block:3px;text-decoration:none}.footer-links a:hover{color:var(--accent)}
.footer-meta{grid-column:1/-1;padding-top:14px;border-top:1px solid rgba(255,255,255,.2);display:flex;justify-content:space-between;gap:16px;color:#c9c7c1;font-size:.9rem;line-height:1.4}

/* Project-wide minimum sizes for supporting copy */
.signal,.url,.service-label,.footer-links,.legal-lead{font-size:.95rem!important;line-height:1.5!important}
.feature p,.service p,.process-panel p,.proof-card span,.card p,.card li{font-size:1rem!important}
.tab-button,.service summary{font-size:1rem!important}
.process-panel[hidden]{display:none!important}

/* Persistent desktop shortcuts */
.contact-rail{position:fixed;z-index:1180;right:0;top:50%;display:grid;gap:2px;transform:translateY(-50%)}
.contact-rail-link{min-width:66px;height:66px;padding:0 20px;display:flex;align-items:center;justify-content:flex-end;border:1px solid var(--ink);border-right:0;background:rgba(247,245,240,.96);color:var(--ink);text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.12);backdrop-filter:blur(8px);transition:background .18s ease,color .18s ease}
.contact-rail-link span{max-width:0;margin-right:0;overflow:hidden;opacity:0;white-space:nowrap;font-size:1rem;font-weight:800;transition:max-width .22s ease,margin-right .22s ease,opacity .16s ease}
.contact-rail-link svg{width:28px;height:28px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.contact-rail-link:hover,.contact-rail-link:focus-visible{background:var(--accent);color:#fff}
.contact-rail-link:hover span,.contact-rail-link:focus-visible span{max-width:195px;margin-right:18px;opacity:1}

/* Mobile bottom sheet and shortcuts */
.mobile-tools,.menu-backdrop,.mobile-sheet{display:none}
@media (max-width:900px){
  :root{--header:70px;--page:calc(100% - 32px)}
  body{padding:0 0 86px!important}
  .topbar{display:none!important}
  .topbar .main-nav{display:none!important}
  .contact-rail{display:none}
  .mobile-tools{position:fixed;z-index:1300;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));display:grid;gap:6px}
  .mobile-tool{width:52px;height:52px;padding:0;display:grid;place-items:center;border:1px solid var(--ink);border-radius:0;background:var(--accent);color:#fff;text-decoration:none;box-shadow:none}
  .mobile-tool svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
  .menu-backdrop{display:block;position:fixed;z-index:1240;inset:0;background:rgba(0,0,0,.62);opacity:0;visibility:hidden;transition:.2s}
  .mobile-sheet{display:block;position:fixed;z-index:1250;left:0;right:0;bottom:0;max-height:min(82svh,680px);padding:28px 80px max(28px,env(safe-area-inset-bottom)) 24px;background:#fff;border-top:1px solid var(--ink);transform:translateY(105%);transition:transform .25s ease;overflow:auto}
  .mobile-sheet h2{margin:0 0 24px;font-size:2rem!important}.mobile-sheet nav{display:grid}.mobile-sheet nav a{padding:17px 0;border-top:1px solid var(--line);font-size:1.2rem;font-weight:750;text-decoration:none}.mobile-sheet nav a:last-child{border-bottom:1px solid var(--line)}
  .menu-open .menu-backdrop{opacity:1;visibility:visible}.menu-open .mobile-sheet{transform:none}
  .section-head{grid-template-columns:1fr!important;gap:20px!important}
  .footer-grid{grid-template-columns:1fr;padding-bottom:92px}.footer-intro{grid-column:auto}.footer-brand{width:150px}.footer-meta{grid-column:auto;display:grid}
  .fotografie-page main>.hero{min-height:100svh!important}
  .fotografie-page .hero-inner{transform:translateY(-20%)!important}
  .fotografie-page .hero-inner .title{text-shadow:0 3px 20px rgba(0,0,0,.36),0 1px 5px rgba(0,0,0,.45)!important}
  .fotografie-page .hero-inner .subtitle{font-weight:500!important;text-shadow:0 2px 10px rgba(0,0,0,.425)!important}
  .webdesign-page main>.hero{padding-top:90px!important}
}
@media (max-width:520px){:root{--page:calc(100% - 24px)}h1,.title{font-size:clamp(2.75rem,14vw,4.25rem)!important}.hero-inner{padding-top:72px!important}.card{padding:22px!important}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal,.reveal-site{opacity:1!important;transform:none!important}}