/* LICREM assets/style.css */
:root{
  --navy:#1f497d;--navy-dk:#163460;--navy-lt:#2d5fa0;
  --charcoal:#3b3d40;--stone:#8c8f94;
  --cream:#f0ede6;--ivory:#faf9f6;--white:#fff;
  --border:#dedad2;--gold:#b8975a;--gold-lt:#d4b47a;
  --text:#1e2022;--text-lt:#5c5f65;
  --fd:'Cormorant Garamond',Georgia,serif;
  --fb:'DM Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--fb);background:var(--ivory);color:var(--text);line-height:1.65;overflow-x:hidden}

/* skip link */
.skip{position:absolute;top:-100%;left:1rem;background:var(--navy);color:#fff;padding:.4rem 1rem;font-size:.8rem;z-index:9999;border-radius:0 0 4px 4px;transition:top .2s}
.skip:focus{top:0}

/* ── HEADER ── */
#site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:1px solid transparent;
  transition:background .35s,box-shadow .35s,border-color .35s,backdrop-filter .35s;
}
#site-header.scrolled{
  background:rgba(14,18,26,.78);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border-bottom-color:rgba(255,255,255,.1);
  box-shadow:0 4px 32px rgba(0,0,0,.35);
}
.nav-wrap{
  max-width:1360px;margin:0 auto;padding:0 2.5rem;
  height:80px;display:flex;align-items:center;justify-content:space-between;
}
.logo-link{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
/* max-height und max-width zusaetzlich: Safari rechnet width:auto anders,
   wenn dem Bild eine Eigengroesse fehlt (SVG ohne viewBox). */
.logo-link img{height:46px;width:auto;max-height:46px;max-width:230px;min-width:0;flex:0 0 auto;object-fit:contain;display:block;filter:brightness(0) invert(1);opacity:.9;transition:opacity .2s}
.logo-link:hover img{opacity:1}

nav.desk{display:flex;align-items:center;gap:.2rem}
nav.desk a{
  font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;
  color:rgba(255,255,255,.7);text-decoration:none;padding:.45rem 1rem;border-radius:3px;
  transition:color .2s,background .2s;
}
nav.desk a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav-cta{
  background:var(--gold)!important;color:#fff!important;
  padding:.45rem 1.2rem!important;border-radius:3px;
}
.nav-cta:hover{background:#a07840!important;opacity:1!important}

.ham{display:none;background:none;border:none;cursor:pointer;padding:.5rem;flex-direction:column;gap:5px;color:rgba(255,255,255,.8)}
.ham span{display:block;width:22px;height:1.5px;background:currentColor;transition:.3s;transform-origin:center}
.ham[aria-expanded=true] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.ham[aria-expanded=true] span:nth-child(2){opacity:0}
.ham[aria-expanded=true] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.mob-menu{
  display:none;position:fixed;top:80px;left:0;right:0;
  background:var(--ivory);border-bottom:1px solid var(--border);
  padding:1.5rem 2rem 2rem;flex-direction:column;gap:.25rem;z-index:99
}
.mob-menu.open{display:flex}
.mob-menu a{
  display:block;padding:.75rem 1rem;border-radius:4px;
  color:var(--charcoal);text-decoration:none;font-size:.9375rem;transition:background .2s
}
.mob-menu a:hover{background:var(--cream);color:var(--navy)}
.mob-menu .nav-cta{background:var(--navy)!important;color:#fff!important;text-align:center;margin-top:.5rem}

/* ── HERO ── */
#hero{
  position:relative;min-height:100svh;
  display:flex;align-items:flex-end;
  overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;
  background:url('images/iStock-937250254-scaled.jpg') center/cover no-repeat;
  z-index:0;
}
/* layered overlay: dark bottom fade for text legibility + subtle blue tint */
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(to top, rgba(10,18,35,.72) 0%, rgba(10,18,35,.35) 45%, rgba(10,18,35,.1) 100%),
    linear-gradient(to right, rgba(31,73,125,.18) 0%, transparent 60%);
}
/* zigzag wave bottom – same shape as original site */
.hero-wave{
  position:absolute;bottom:0;left:0;right:0;z-index:3;
  height:10vmin;color:var(--ivory);pointer-events:none
}
.hero-wave svg{display:block;width:100%;height:100%}

.hero-ticker{
  position:absolute;
  top:80px;left:0;right:0;
  bottom:38%;
  z-index:2;display:flex;align-items:center;justify-content:center;
  pointer-events:none;
}
.ticker-word{
  font-family:var(--fd);
  font-size:clamp(3.5rem,9vw,8rem);
  font-weight:300;
  letter-spacing:-.02em;
  color:#fff;
  line-height:1;
  position:absolute;
  opacity:0;
  transform:translateY(24px) scale(.97);
  transition:opacity .55s var(--ease), transform .55s var(--ease);
  text-align:center;
  pointer-events:none;
  text-shadow:0 4px 48px rgba(0,0,0,.35);
  white-space:nowrap;
}
.ticker-word.active{opacity:1;transform:none}

.hero-strip{
  position:relative;z-index:4;
  width:100%;
  padding:0 3rem 6rem;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:2rem;
}
.hero-claim{
  font-family:var(--fd);
  font-size:clamp(1rem,1.7vw,1.35rem);
  font-weight:300;
  color:rgba(255,255,255,.82);
  line-height:1.65;
  max-width:480px;
  letter-spacing:.01em;
}
.hero-claim strong{color:#fff;font-weight:500}
.hero-ctas{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.8rem 1.6rem;border-radius:3px;
  font-size:.8rem;font-family:var(--fb);font-weight:500;letter-spacing:.05em;
  text-decoration:none;cursor:pointer;border:none;
  transition:all .2s var(--ease);white-space:nowrap;
}
.btn:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
.btn-primary{background:var(--gold);color:#fff}
.btn-primary:hover{background:#a07840;transform:translateY(-1px);box-shadow:0 8px 24px rgba(184,151,90,.3)}
.btn-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.5)}
.btn-outline:hover{background:rgba(255,255,255,.1);border-color:#fff}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-dk);transform:translateY(-1px);box-shadow:0 6px 20px rgba(31,73,125,.25)}

/* scroll hint */
.scroll-hint{
  position:absolute;bottom:calc(10vmin + 1.5rem);left:50%;transform:translateX(-50%);
  z-index:4;display:flex;flex-direction:column;align-items:center;gap:.4rem;
  color:rgba(255,255,255,.45);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;
  pointer-events:none;
}
.scroll-hint svg{animation:bounceY 1.8s ease-in-out infinite}
@keyframes bounceY{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* ── SECTION BASE ── */
section{padding:6rem 0}
.wrap{max-width:1360px;margin:0 auto;padding:0 2.5rem}

.eyebrow{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);font-weight:500;margin-bottom:1.1rem;
}
.eyebrow::before{content:'';display:block;width:24px;height:1px;background:var(--gold);flex-shrink:0}

.sec-title{
  font-family:var(--fd);
  font-size:clamp(2rem,3.5vw,3.25rem);
  font-weight:300;line-height:1.12;
  color:var(--navy);letter-spacing:-.01em;
}
.sec-title em{font-style:italic}
.sec-lead{font-size:1rem;color:var(--text-lt);line-height:1.8;max-width:560px;margin-top:.9rem}

/* ── LEISTUNGEN ── */
#leistungen{background:var(--cream)}

.srv-head{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:end;margin-bottom:3.5rem}

/* 2-col mosaic grid */
.srv-mosaic{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:auto auto;
  gap:0;
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
}
.srv-tile{
  background:var(--white);
  padding:0;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  position:relative;
  display:flex;flex-direction:column;
}
.srv-tile:nth-child(2n){border-right:none}
.srv-tile:nth-child(3),.srv-tile:nth-child(4){border-bottom:none}
.srv-tile-img{
  aspect-ratio:16/9;overflow:hidden;flex-shrink:0
}
.srv-tile-img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--ease);display:block
}
.srv-tile:hover .srv-tile-img img{transform:scale(1.04)}
.srv-tile-body{
  padding:2rem 2rem 1.75rem;
  flex:1;display:flex;flex-direction:column;
}
.srv-tile-num{
  font-family:var(--fd);
  font-size:clamp(3.5rem,6vw,6rem);
  font-weight:300;
  color:var(--gold);
  letter-spacing:-.02em;
  line-height:1;
  margin-bottom:.5rem;
  opacity:.35;
  display:block;
}
.srv-tile-body h3{
  font-family:var(--fd);font-size:1.35rem;font-weight:500;
  color:var(--navy);margin-bottom:.6rem;line-height:1.25
}
.srv-tile-body p{font-size:.875rem;color:var(--text-lt);line-height:1.7;flex:1;margin-bottom:1.25rem}
.srv-link{
  font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--navy);display:inline-flex;align-items:center;gap:.35rem;
  text-decoration:none;transition:gap .2s,color .2s;
}
.srv-tile:hover .srv-link{gap:.6rem;color:var(--gold)}

/* ── PHILOSOPHIE ── */
#philosophie{
  background:var(--navy);
  color:#fff;
  position:relative;
  overflow:hidden;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(135deg, rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(45deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:60px 60px, 60px 60px, 85px 85px, 85px 85px;
}
#philosophie::before{
  content:'';position:absolute;top:-20%;right:-5%;
  width:700px;height:700px;
  background:radial-gradient(circle, rgba(184,151,90,.09) 0%, transparent 60%);
  pointer-events:none;z-index:0;
}
#philosophie::after{
  content:'';position:absolute;bottom:-15%;left:-10%;
  width:580px;height:580px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.04);
  pointer-events:none;z-index:0;
  box-shadow:
    0 0 0 55px rgba(255,255,255,.015),
    0 0 0 110px rgba(255,255,255,.008);
}
.phi-grid{display:grid;grid-template-columns:5fr 7fr;gap:7rem;align-items:start;position:relative;z-index:1}
.phi-left .eyebrow{color:var(--gold-lt)}
.phi-left .eyebrow::before{background:var(--gold-lt)}
.phi-left .sec-title{color:#fff}
.phi-left .sec-lead{color:rgba(255,255,255,.65);max-width:100%}

.phi-img{
  margin-top:2.5rem;border-radius:8px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
}
.phi-img img{width:100%;display:block;opacity:.75;filter:saturate(.8)}

.val-list{margin-top:3rem;display:flex;flex-direction:column}
.val-item{
  display:grid;
  grid-template-columns:5rem 1fr;
  gap:1.5rem;
  padding:1.5rem 0;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:padding .2s;
  align-items:start;
}
.val-item:last-child{border-bottom:none}
.val-item:hover{padding-left:.35rem}
.val-n{
  font-family:var(--fd);
  font-size:clamp(2.5rem,4.5vw,4.5rem);
  font-weight:300;
  color:var(--gold);
  opacity:.3;
  line-height:1;
  letter-spacing:-.02em;
  padding-top:.1rem;
  display:block;
}
.val-item h4{font-size:.9rem;font-weight:500;color:#fff;margin-bottom:.3rem}
.val-item p{font-size:.825rem;color:rgba(255,255,255,.5);line-height:1.6}

/* ── GESCHICHTE ── */
#geschichte{
  background:#1a1c1f;
  color:#fff;
  position:relative;
}
#geschichte::before{
  content:'';position:absolute;top:-30%;right:-5%;
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(184,151,90,.07) 0%,transparent 65%);
  pointer-events:none;
}
#geschichte .tl-head .eyebrow{color:var(--gold-lt)}
#geschichte .tl-head .eyebrow::before{background:var(--gold-lt)}
#geschichte .tl-head .sec-title{color:#fff}
#geschichte .tl-head .sec-lead{color:rgba(255,255,255,.55)}

.tl-head{text-align:center;max-width:560px;margin:0 auto 5rem}
.tl-head .eyebrow{justify-content:center}
.tl-head .sec-lead{margin:.8rem auto 0}

.timeline{position:relative;max-width:820px;margin:0 auto}
.timeline::before{
  content:'';position:absolute;left:50%;transform:translateX(-50%);
  top:0;bottom:0;width:1px;background:rgba(255,255,255,.1)
}

/* each item: content | dot | empty  (odd) / empty | dot | content (even) */
.tl-item{
  display:grid;
  grid-template-columns:1fr 1.5rem 1fr;
  gap:2.5rem;
  align-items:start;
  margin-bottom:4rem;
  position:relative;
}
.tl-item:last-child{margin-bottom:0}

/* odd: content on LEFT side */
.tl-item .tl-content{text-align:right}
.tl-item .tl-empty{/* placeholder right col */}

/* even: swap — content on RIGHT side */
.tl-item:nth-child(even) .tl-content{order:3;text-align:left}
.tl-item:nth-child(even) .tl-dot{order:2}
.tl-item:nth-child(even) .tl-empty{order:1}

.tl-dot{
  width:13px;height:13px;border-radius:50%;
  background:#1a1c1f;border:2px solid var(--gold);
  margin-top:.55rem;flex-shrink:0;
  transition:background .25s,transform .25s;
  justify-self:center;
}
.tl-item:hover .tl-dot{background:var(--gold);transform:scale(1.4)}

.tl-date{
  font-family:var(--fd);font-size:1.5rem;font-weight:300;
  color:var(--gold-lt);line-height:1;display:block;margin-bottom:.4rem;
}
.tl-ttl{font-size:.85rem;font-weight:500;color:#fff;margin-bottom:.3rem}
.tl-desc{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.65}

/* connector line between dot and content card */
.tl-item::after{
  content:'';
  position:absolute;
  top:.95rem;
  left:calc(50% - .25rem);
  width:2.5rem;
  height:1px;
  background:rgba(255,255,255,.12);
}

/* ── KONTAKT ── */
#kontakt{background:var(--cream)}
.con-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:5rem;align-items:start}
.con-info{padding-top:.5rem}
.con-info .sec-lead{margin-bottom:2.5rem}

.con-row{display:flex;align-items:flex-start;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--border)}
.con-row:last-of-type{border-bottom:none}
.con-ico{
  width:34px;height:34px;background:var(--navy);border-radius:6px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.con-ico svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:1.75}
.con-lbl{display:block;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin-bottom:.2rem}
.con-val{font-size:.9rem;color:var(--charcoal);text-decoration:none;display:block;line-height:1.5}
.con-val:hover{color:var(--navy)}

.con-form{
  background:var(--white);border-radius:10px;
  padding:2.5rem;border:1px solid var(--border)
}
.form-ttl{font-family:var(--fd);font-size:1.4rem;font-weight:400;color:var(--navy);margin-bottom:1.75rem}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.f-grp{display:flex;flex-direction:column;gap:.3rem;margin-bottom:1.1rem}
.f-grp label{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--charcoal);font-weight:500}
.f-grp input,.f-grp textarea{
  width:100%;padding:.65rem .9rem;
  border:1px solid var(--border);border-radius:4px;
  font-family:var(--fb);font-size:.9rem;color:var(--text);
  background:var(--ivory);transition:border-color .2s,box-shadow .2s;
  resize:vertical;outline:none
}
.f-grp input:focus,.f-grp textarea:focus{
  border-color:var(--navy);box-shadow:0 0 0 3px rgba(31,73,125,.1);background:#fff
}
.f-grp textarea{min-height:110px}
.f-note{font-size:.75rem;color:var(--stone);line-height:1.6;margin-bottom:1.25rem}
.f-note button{font:inherit;color:var(--navy);background:none;border:none;cursor:pointer;padding:0;font-size:.75rem}
.btn-submit{width:100%;justify-content:center;padding:.9rem}

/* ── FOOTER ── */
footer{background:#24262a;color:rgba(255,255,255,.55);padding:3rem 0}
.ft-inner{
  max-width:1360px;margin:0 auto;padding:0 2.5rem;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.5rem
}
.ft-logo img{height:36px;width:auto;max-height:36px;max-width:180px;min-width:0;flex:0 0 auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.6}
.ft-adr{font-size:.8rem;line-height:1.85;text-align:center}
.ft-adr a{color:rgba(255,255,255,.6);text-decoration:none}
.ft-adr a:hover{color:#fff}
.ft-links{display:flex;gap:1.5rem}
.ft-links button{
  background:none;border:none;cursor:pointer;padding:0;
  font-size:.8rem;color:rgba(255,255,255,.45);transition:color .2s
}
.ft-links button:hover{color:#fff}
.ft-copy{
  width:100%;padding-top:1.75rem;margin-top:1.25rem;
  border-top:1px solid rgba(255,255,255,.07);
  text-align:center;font-size:.75rem
}

/* ── LEGAL ── */
.legal{display:none;padding:8rem 0 5rem}
.legal.active{display:block}
.legal-body{max-width:780px;margin:0 auto}
.legal-body h1{font-family:var(--fd);font-size:clamp(2rem,3vw,2.75rem);font-weight:300;color:var(--navy);margin-bottom:2rem}
.legal-body h2{font-family:var(--fd);font-size:1.3rem;font-weight:500;color:var(--navy);margin:2rem 0 .6rem}
.legal-body p{font-size:.9rem;color:var(--text-lt);line-height:1.8;margin-bottom:.9rem}
.legal-body ul{padding-left:1.5rem;margin-bottom:.9rem}
.legal-body li{font-size:.9rem;color:var(--text-lt);line-height:1.8;margin-bottom:.3rem}
.back{
  display:inline-flex;align-items:center;gap:.45rem;
  font-size:.82rem;color:var(--navy);cursor:pointer;
  background:none;border:none;padding:0;margin-bottom:2rem;font-weight:500
}
.back:hover{color:var(--gold)}

/* ── REVEAL ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal.visible{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* ── RESPONSIVE ── */

/* ═══════════════════════════════════════════════
   RESPONSIVE — full overhaul
   1024 · 768 · 480 · 360
═══════════════════════════════════════════════ */

/* ── 1024px: tablet landscape ── */
@media(max-width:1024px){
  /* layout */
  .wrap{padding:0 2rem}
  .srv-head{grid-template-columns:1fr;gap:1rem}
  .phi-grid{grid-template-columns:1fr;gap:3rem}
  .phi-img{max-width:420px}
  .con-grid{grid-template-columns:1fr;gap:3rem}
  /* hero */
  .hero-strip{padding:0 2rem 5rem;gap:1.5rem}
  /* timeline stays alternating at this size */
}

/* ── 768px: tablet portrait → burger ── */
@media(max-width:768px){
  /* nav: hide desktop, show burger */
  nav.desk{display:none}
  .ham{display:flex}

  /* mobile menu dark glass (matches header) */
  .mob-menu{
    background:rgba(14,18,26,.96);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid rgba(255,255,255,.1);
    top:80px;
    padding:1.25rem 1.5rem 2rem;
  }
  .mob-menu a{
    color:rgba(255,255,255,.75);
    font-size:.875rem;letter-spacing:.06em;text-transform:uppercase;
    padding:.75rem 1rem;border-radius:3px;
  }
  .mob-menu a:hover{background:rgba(255,255,255,.08);color:#fff}
  .mob-menu .nav-cta{
    background:var(--gold)!important;color:#fff!important;
    text-align:center;margin-top:.75rem;
  }

  /* hero */
  .hero-strip{
    padding:0 1.5rem 4.5rem;
    grid-template-columns:1fr;
    gap:1.25rem;
  }
  .hero-ctas{justify-content:flex-start;gap:.6rem}
  .hero-ticker{bottom:44%}
  .scroll-hint{display:none}

  /* sections */
  .wrap{padding:0 1.5rem}
  section{padding:4.5rem 0}

  /* services: single column */
  .srv-mosaic{grid-template-columns:1fr}
  .srv-tile{border-right:none!important}
  .srv-tile:not(:last-child){border-bottom:1px solid var(--border)!important}
  .srv-tile:last-child{border-bottom:none!important}
  .srv-tile-num{font-size:clamp(2.5rem,10vw,4rem)}

  /* philosophy */
  .phi-grid{grid-template-columns:1fr;gap:2.5rem}
  .phi-img{max-width:100%}

  /* timeline: collapse to single-column left-aligned */
  .timeline::before{left:16px;transform:none}
  .tl-item{
    display:grid;
    grid-template-columns:2rem 1fr;
    grid-template-rows:auto;
    gap:.75rem 1rem;
    padding-left:0;
    margin-bottom:2.75rem;
  }
  .tl-dot{
    position:static;
    grid-column:1;grid-row:1;
    margin-top:.5rem;justify-self:center;
  }
  .tl-content{
    grid-column:2;grid-row:1;
    text-align:left!important;
    order:unset!important;
  }
  .tl-empty{display:none!important}
  .tl-item:nth-child(even) .tl-content{
    order:unset!important;grid-column:2;grid-row:1;text-align:left!important;
  }
  .tl-item:nth-child(even) .tl-dot{order:unset!important;grid-column:1;grid-row:1}
  .tl-item::after{display:none}
  .timeline::before{
    left:16px;width:1px;
    top:0;bottom:0;
  }

  /* contact form */
  .f-row{grid-template-columns:1fr}

  /* footer */
  .ft-inner{flex-direction:column;align-items:center;text-align:center;gap:1.25rem}
  .ft-adr{text-align:center}
  .ft-links{justify-content:center;flex-wrap:wrap;gap:1rem}
}

/* ── 480px: large mobile ── */
@media(max-width:480px){
  .wrap{padding:0 1.25rem}
  section{padding:3.5rem 0}
  .hero-strip{padding:0 1.25rem 4rem}
  .hero-claim{font-size:1rem}
  .btn{padding:.75rem 1.25rem;font-size:.8rem}
  .srv-tile-body{padding:1.5rem 1.25rem}
  .con-form{padding:1.5rem 1.25rem}
  .tl-head{margin-bottom:3.5rem}
  .ft-inner{padding:0 1.25rem}
  .nav-wrap{padding:0 1.25rem}
}

/* ── 360px: small mobile ── */
@media(max-width:360px){
  .ticker-word{white-space:normal;text-align:center;padding:0 1rem}
  .wrap{padding:0 1rem}
  .nav-wrap{padding:0 1rem}
  .hero-strip{padding:0 1rem 3.5rem}
  .ticker-word{font-size:clamp(2.5rem,13vw,4rem)}
  .btn{padding:.65rem 1rem;font-size:.75rem}
}

/* Prevent any horizontal overflow */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
table{max-width:100%;word-break:break-word}

/* ── ACCESSIBILITY ── */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
#main:focus{outline:none}
#page-impressum h1:focus,#page-datenschutz h1:focus,#page-barrierefreiheit h1:focus{outline:none}


/* ═══════════════════════════════════════════════
   MAKLER-SEITE  (makler.html)
═══════════════════════════════════════════════ */

/* ── HERO ── */
#m-hero{
  position:relative;min-height:88svh;
  display:flex;align-items:flex-end;overflow:hidden;
}
.m-hero-bg{
  position:absolute;inset:0;z-index:0;
  background:url('images/iStock-937250254-scaled.jpg') center/cover no-repeat;
}
.m-hero-bg::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(to top, rgba(10,18,35,.8) 0%, rgba(10,18,35,.4) 45%, rgba(10,18,35,.15) 100%),
    linear-gradient(to right, rgba(31,73,125,.25) 0%, transparent 62%);
}
.m-hero-wave{
  position:absolute;bottom:0;left:0;right:0;z-index:3;
  height:9vmin;color:var(--ivory);pointer-events:none;
}
.m-hero-wave svg{display:block;width:100%;height:100%}
.m-hero-inner{
  position:relative;z-index:4;width:100%;
  max-width:1360px;margin:0 auto;padding:0 2.5rem 7rem;
}
.m-hero-kicker{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-lt);font-weight:500;margin-bottom:1.5rem;
}
.m-hero-kicker::before{content:'';width:28px;height:1px;background:var(--gold-lt);flex-shrink:0}
.m-hero-title{
  font-family:var(--fd);font-size:clamp(2.75rem,7vw,6.5rem);
  font-weight:300;line-height:1;letter-spacing:-.02em;color:#fff;
  margin-bottom:1.5rem;text-shadow:0 4px 48px rgba(0,0,0,.3);
}
.m-hero-title em{font-style:italic;color:var(--gold-lt)}
.m-hero-sub{
  font-family:var(--fd);font-size:clamp(1rem,1.7vw,1.4rem);
  font-weight:300;color:rgba(255,255,255,.8);
  line-height:1.6;max-width:520px;margin-bottom:2.25rem;
}
.m-hero-ctas{display:flex;gap:.75rem;flex-wrap:wrap}

/* ── INTRO ── */
#m-intro{background:var(--ivory);padding:6rem 0}
.m-intro-grid{display:grid;grid-template-columns:5fr 7fr;gap:6rem;align-items:start}
.m-intro-body p{font-size:1rem;color:var(--text-lt);line-height:1.85;margin-bottom:1.25rem}
.m-intro-body p strong{color:var(--navy);font-weight:500}
.m-usps{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  margin-top:2.5rem;border-top:1px solid var(--border);
}
.m-usp{padding:1.75rem 1.5rem 1.75rem 0;border-right:1px solid var(--border)}
.m-usp:last-child{border-right:none;padding-right:0}
.m-usp-n{
  font-family:var(--fd);font-size:clamp(2rem,3vw,3rem);
  font-weight:300;color:var(--gold);opacity:.35;
  line-height:1;display:block;margin-bottom:.5rem;
}
.m-usp h4{font-size:.875rem;font-weight:500;color:var(--navy);margin-bottom:.3rem}
.m-usp p{font-size:.8rem;color:var(--text-lt);line-height:1.6}

/* ── SHOWROOM ── */
#m-showroom{
  background:var(--navy);color:#fff;position:relative;
  overflow:hidden;padding:6.5rem 0;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(135deg, rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(45deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:60px 60px,60px 60px,85px 85px,85px 85px;
}
#m-showroom::before{
  content:'';position:absolute;top:-20%;right:-5%;
  width:700px;height:700px;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(184,151,90,.09) 0%,transparent 60%);
}
#m-showroom .wrap{position:relative;z-index:1}
#m-showroom .eyebrow{color:var(--gold-lt)}
#m-showroom .eyebrow::before{background:var(--gold-lt)}
#m-showroom .sec-title{color:#fff}
#m-showroom .sec-lead{color:rgba(255,255,255,.6)}
.m-show-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem;margin-bottom:3.5rem}

/* Bündiges Bildraster – einheitliches Seitenverhältnis, kein Versatz */
.m-gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  align-items:stretch;
}
.m-shot{
  display:block;width:100%;margin:0;padding:0;
  position:relative;overflow:hidden;
  border-radius:6px;border:1px solid rgba(255,255,255,.08);
  background:#0e1220;cursor:zoom-in;
  aspect-ratio:4/3;
}
.m-shot img{
  width:100%;height:100%;
  object-fit:cover;object-position:center;
  display:block;
  transition:transform .7s var(--ease), filter .4s;
  filter:saturate(.82) brightness(.9);
}
.m-shot:hover img,.m-shot:focus-visible img{transform:scale(1.05);filter:saturate(1) brightness(1)}
.m-shot::after{
  content:'';position:absolute;inset:0;
  border:1px solid transparent;border-radius:6px;
  transition:border-color .3s;pointer-events:none;
}
.m-shot:hover::after,.m-shot:focus-visible::after{border-color:rgba(212,180,122,.55)}
.m-shot-cap{
  position:absolute;left:0;right:0;bottom:0;
  padding:2rem 1rem .9rem;text-align:left;
  background:linear-gradient(to top, rgba(8,14,26,.92), transparent);
  transform:translateY(6px);opacity:0;
  transition:opacity .3s,transform .3s;pointer-events:none;
}
.m-shot:hover .m-shot-cap,.m-shot:focus-visible .m-shot-cap{opacity:1;transform:none}
.m-shot-cap strong{display:block;font-family:var(--fd);font-size:1.05rem;font-weight:500;color:#fff;line-height:1.2}
.m-shot-cap span{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-lt)}
.m-show-foot{margin-top:1.5rem;display:flex;justify-content:center}

/* ── LIGHTBOX ── */
.m-lightbox{
  position:fixed;inset:0;z-index:200;
  background:rgba(8,12,20,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  display:none;align-items:center;justify-content:center;padding:4rem 2rem;
}
.m-lightbox.open{display:flex}
.m-lb-figure{
  max-width:min(1100px,92vw);max-height:86vh;
  display:flex;flex-direction:column;gap:1rem;
  animation:lbIn .4s var(--ease);
}
@keyframes lbIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.m-lb-figure img{
  max-width:100%;max-height:76vh;object-fit:contain;display:block;
  border-radius:4px;box-shadow:0 24px 80px rgba(0,0,0,.6);margin:0 auto;
}
.m-lb-cap{display:flex;align-items:baseline;gap:1rem;color:rgba(255,255,255,.65);font-size:.82rem}
.m-lb-cap strong{font-family:var(--fd);font-size:1.15rem;font-weight:400;color:#fff}
.m-lb-count{margin-left:auto;letter-spacing:.1em;font-size:.72rem;color:var(--gold-lt)}
.m-lb-btn{
  position:absolute;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);color:#fff;cursor:pointer;
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s,border-color .2s;
}
.m-lb-btn:hover{background:rgba(255,255,255,.16);border-color:var(--gold)}
.m-lb-close{top:1.5rem;right:1.5rem}
.m-lb-prev{left:1.5rem;top:50%;transform:translateY(-50%)}
.m-lb-next{right:1.5rem;top:50%;transform:translateY(-50%)}
.m-lb-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}

/* ── FAQ ── */
#m-faq{background:var(--cream);padding:6rem 0}
.m-faq-head{text-align:center;max-width:560px;margin:0 auto 3.5rem}
.m-faq-head .eyebrow{justify-content:center}
.m-faq-head .sec-lead{margin:.8rem auto 0}
.m-faq-list{max-width:820px;margin:0 auto;border-top:1px solid var(--border)}
.m-faq-item{border-bottom:1px solid var(--border)}
.m-faq-q{
  width:100%;display:grid;grid-template-columns:auto 1fr auto;
  gap:1.25rem;align-items:center;padding:1.6rem .25rem;
  background:none;border:none;cursor:pointer;text-align:left;
  font-family:var(--fb);transition:padding .2s;
}
.m-faq-q:hover{padding-left:.6rem}
.m-faq-n{font-family:var(--fd);font-size:1.4rem;font-weight:300;color:var(--gold);opacity:.4;line-height:1;min-width:1.6rem}
.m-faq-q h3{font-size:.95rem;font-weight:500;color:var(--navy);line-height:1.4;margin:0}
.m-faq-ico{width:26px;height:26px;flex-shrink:0;position:relative}
.m-faq-ico::before,.m-faq-ico::after{content:'';position:absolute;background:var(--navy);top:50%;left:50%;transition:transform .3s var(--ease)}
.m-faq-ico::before{width:13px;height:1.5px;transform:translate(-50%,-50%)}
.m-faq-ico::after{width:1.5px;height:13px;transform:translate(-50%,-50%)}
.m-faq-q[aria-expanded="true"] .m-faq-ico::after{transform:translate(-50%,-50%) rotate(90deg)}
.m-faq-q[aria-expanded="true"] .m-faq-n{opacity:.9}
.m-faq-a{overflow:hidden;max-height:0;transition:max-height .45s var(--ease)}
.m-faq-a-inner{padding:0 3.5rem 1.75rem 4rem;font-size:.9rem;color:var(--text-lt);line-height:1.8}

#m-kontakt{background:var(--ivory)}

/* ── MAKLER RESPONSIVE ── */
@media(max-width:1024px){
  .m-intro-grid{grid-template-columns:1fr;gap:2.5rem}
  .m-hero-inner{padding:0 2rem 6rem}
  .m-gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  #m-hero{min-height:80svh}
  .m-hero-inner{padding:0 1.5rem 5rem}
  .m-usps{grid-template-columns:1fr;border-top:none}
  .m-usp{border-right:none;border-top:1px solid var(--border);padding:1.35rem 0}
  .m-show-head{grid-template-columns:1fr;gap:1.25rem}
  .m-gallery{grid-template-columns:1fr;gap:14px}
  .m-shot{aspect-ratio:16/10}
  .m-shot-cap{opacity:1;transform:none}
  .m-lightbox{padding:3.5rem 1rem}
  .m-lb-prev{left:.5rem}
  .m-lb-next{right:.5rem}
  .m-lb-close{top:1rem;right:1rem}
  .m-faq-a-inner{padding:0 1rem 1.5rem 2.85rem}
  .m-faq-q{gap:.85rem}
  #m-intro,#m-showroom,#m-faq{padding:4.5rem 0}
}
@media(max-width:480px){
  .m-hero-inner{padding:0 1.25rem 4.5rem}
  .m-faq-q{padding:1.35rem .1rem}
  .m-faq-n{font-size:1.15rem;min-width:1.3rem}
  .m-faq-a-inner{padding:0 .5rem 1.35rem 2.4rem;font-size:.85rem}
}
@media(prefers-reduced-motion:reduce){
  .m-shot img,.m-shot-cap,.m-faq-a,.m-lb-figure{transition:none;animation:none}
}