/* ADOMANN — Grundgestaltung */

@font-face{
  font-family:"Jost";
  src:url("/fonts/Jost.woff2") format("woff2-variations"),
      url("/fonts/Jost.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
}

:root{
  --anthrazit:#1C1C1A; --flaeche:#242320; --flaeche-alt:#2A2823; --flaeche-news:#322E25;
  --messing:#A87C3D; --messing-hell:#C79A4A;
  --text:#E6E1D6; --leise:#A29D92;
  --spalte:560px; --container:1080px;
  --pad:clamp(72px,44px + 4.4vw,120px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--anthrazit);color:var(--text);
  font-family:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:300;
  font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased}
@media(min-width:768px){body{font-size:18px}}
img{max-width:100%;display:block}
a{color:var(--messing-hell);text-decoration:none}
a:hover{color:var(--messing)}
a:focus-visible,button:focus-visible{outline:1px solid var(--messing);outline-offset:6px}

.wrap{max-width:var(--container);margin:0 auto;
  padding-left:clamp(22px,5vw,64px);padding-right:clamp(22px,5vw,64px)}
section{padding-top:var(--pad);padding-bottom:var(--pad);position:relative;overflow:hidden}
.s-a{background:var(--flaeche)} .s-b{background:var(--flaeche-alt)}
.s-dark{background:var(--anthrazit)} .s-news{background:var(--flaeche-news)}

h1,h2{font-weight:300;font-size:clamp(1.7rem,1.2rem + 1.5vw,2.4rem);line-height:1.2;
  letter-spacing:.01em;margin:0 0 14px}
h3{font-weight:400;font-size:1.05rem;letter-spacing:.02em;margin:0 0 10px}
p{max-width:var(--spalte);margin:0 0 20px;text-align:justify;hyphens:auto}
.rule{width:44px;height:1px;background:var(--messing);margin:0 0 34px;border:0}
.leise{color:var(--leise)} .messing{color:var(--messing-hell)}

/* Sprachumschalter */
.top{position:fixed;top:0;right:0;z-index:40;padding:20px clamp(22px,5vw,64px)}
.lang{display:flex;gap:10px;align-items:center;font-size:.78rem;letter-spacing:.16em}
.lang button{background:none;border:0;padding:4px;cursor:pointer;color:var(--leise);
  font:inherit;letter-spacing:inherit;transition:color .2s}
.lang button[aria-pressed="true"]{color:var(--text)}
.lang button:hover{color:var(--messing-hell)}
.lang span{color:var(--messing)}

/* Startbildschirm */
.start{min-height:auto;display:flex;align-items:center;justify-content:center;
  text-align:center;background:var(--anthrazit);
  padding-top:clamp(84px,14vh,140px);padding-bottom:clamp(64px,10vh,108px)}
.start .wrap{width:100%;max-width:820px;
  padding-left:clamp(16px,4vw,64px);padding-right:clamp(16px,4vw,64px)}
.start p{max-width:none;margin-left:auto;margin-right:auto;text-align:center;hyphens:none}

.mark{font-weight:300;font-size:clamp(2rem,1.1rem + 5.2vw,3.6rem);
  letter-spacing:.2em;padding-left:.2em;line-height:1;margin:0;white-space:nowrap}
.mark sup{font-size:.2em;letter-spacing:0;opacity:.7;
  vertical-align:baseline;position:relative;top:-2.8em;margin-left:-.55em}
.mark-rule{width:min(420px,82%);height:1px;margin:16px auto 0;border:0;
  background:linear-gradient(90deg,transparent,var(--messing) 14%,var(--messing-hell) 50%,var(--messing) 86%,transparent)}
.est{font-size:.7rem;letter-spacing:.28em;padding-left:.28em;color:var(--messing);margin:14px 0 0}
.untertitel{font-size:.76rem;letter-spacing:.22em;padding-left:.22em;color:var(--leise);margin:10px 0 0}

.claim{font-weight:300;font-size:clamp(1.25rem,.95rem + 1.4vw,1.8rem);line-height:1.45;
  max-width:15em;margin:clamp(30px,4.5vh,52px) auto 16px}
.start .subline{max-width:30em;color:var(--leise);font-size:.98rem;margin:0 auto}

/* Videoband */
.band{padding:0;background:var(--anthrazit)}
.band video{width:100%;height:40vh;object-fit:cover;display:block}
@media(min-width:768px){.band video{height:56vh}}
.band.ad-hidden{display:none}

/* Für wen */
.gruppe{max-width:var(--spalte);margin:0 0 26px}
.gruppe b{font-weight:500;color:var(--text)}

/* Leistungen */
.raster{display:grid;grid-template-columns:1fr;gap:56px 64px;max-width:920px}
@media(min-width:860px){.raster{grid-template-columns:1fr 1fr}}
.block .strich,.schritt .strich,.signatur .strich{width:26px;height:1px;
  background:var(--messing);margin:0 0 18px;border:0}
.block p{max-width:none}

/* Wie ich arbeite */
.schritt{max-width:var(--spalte);margin:0 0 52px}
.schritt:last-child{margin-bottom:0}
.schritt .nr{display:block;font-size:.72rem;letter-spacing:.2em;color:var(--messing);margin-bottom:12px}

/* Über mich */
.person{display:grid;grid-template-columns:1fr;gap:44px;align-items:start}
@media(min-width:860px){.person{grid-template-columns:38% 1fr;gap:64px}}
.portrait{aspect-ratio:4/5;overflow:hidden;background:var(--flaeche-alt)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:center 20%;
  filter:grayscale(.12) contrast(1.02)}
.signatur{margin-top:36px}
.signatur b{font-weight:500;display:block}
.signatur span{font-size:.78rem;letter-spacing:.16em;color:var(--leise)}

/* Standort */
.karte{border:0;width:100%;height:340px;background:var(--flaeche-alt);
  filter:grayscale(1) contrast(.9) brightness(.85)}

/* Kontakt */
.kontakt{text-align:center;background:var(--anthrazit)}
.kontakt .rule{margin-left:auto;margin-right:auto}
.kontakt p{margin-left:auto;margin-right:auto;text-align:center;hyphens:none}
.kontakt .name{margin-top:56px;font-weight:500;font-size:1.15rem;letter-spacing:.04em}
.daten{display:grid;grid-template-columns:1fr;gap:32px;margin:32px auto 0;
  max-width:760px;text-align:center}
@media(min-width:720px){.daten{grid-template-columns:repeat(3,1fr);gap:40px;
  padding-top:32px;border-top:1px solid rgba(230,225,214,.10)}}
.daten .feld{display:block}
.daten .titel{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--messing);margin-bottom:12px}
.daten .wert{display:block;line-height:1.7;font-size:.98rem}
.daten a{display:block}

/* Fußzeile */
footer{background:var(--anthrazit);padding:0 0 48px}
footer .inner{border-top:1px solid rgba(230,225,214,.10);padding-top:24px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;
  font-size:.76rem;letter-spacing:.1em;color:var(--leise)}
footer nav{display:flex;gap:26px}
footer a{color:var(--leise)}
footer a:hover{color:var(--messing-hell)}
@media(max-width:560px){footer .inner{justify-content:center;text-align:center}}

/* Rechtsseiten */
.legal{padding-top:calc(var(--pad) + 20px)}
.legal h1{margin-bottom:22px}
.legal h2{font-size:1.15rem;font-weight:400;letter-spacing:.02em;margin:44px 0 12px}
.legal p,.legal li{max-width:var(--spalte)}
.legal ul{padding-left:1.1em;margin:0 0 20px}
.legal li{margin-bottom:8px}
.zurueck{display:inline-block;margin-top:56px;font-size:.8rem;letter-spacing:.14em}
.offen{color:var(--messing-hell)}

/* Zweisprachigkeit */
[data-en]{display:none}
html[lang="en"] [data-de]{display:none}
html[lang="en"] [data-en]{display:revert}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
