/* ============================================================
   eilo · v2 — „Zusammenführung"
   Farb-mutig · dänische Sprezzatura · Hin-zu-Kommunikation
   ============================================================ */

@font-face{font-family:"Rethink Sans";font-weight:400;font-display:swap;src:url("../fonts/rethink-sans-latin-400-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Rethink Sans";font-weight:500;font-display:swap;src:url("../fonts/rethink-sans-latin-500-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Rethink Sans";font-weight:700;font-display:swap;src:url("../fonts/rethink-sans-latin-700-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Rethink Sans";font-weight:400;font-display:swap;src:url("../fonts/rethink-sans-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Rethink Sans";font-weight:500;font-display:swap;src:url("../fonts/rethink-sans-latin-ext-500-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Rethink Sans";font-weight:700;font-display:swap;src:url("../fonts/rethink-sans-latin-ext-700-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --cream:#f4f0e7; --paper:#fbf9f4; --ink:#1f1e1a;
  --flieder:#cdc2ed; --mauve:#e0d3e0; --rost:#9f2917; --olivgold:#9e8f44;
  --braun:#684d3c; --tann:#215043; --khaki:#626148; --orange:#e88d44; --gelb:#e7d66d;
  --font:"Rethink Sans",system-ui,-apple-system,sans-serif;
  --pad:clamp(1.5rem,6vw,6rem); --maxw:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--font);background:var(--cream);color:var(--ink);line-height:1.65;
  font-size:clamp(1rem,.95rem + .3vw,1.12rem);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-weight:500;line-height:1.04;letter-spacing:-.025em}
::selection{background:var(--rost);color:var(--cream)}

/* Section base: bold color fields, lots of air (Sprezzatura) */
.sec{background:var(--bg,var(--cream));color:var(--fg,var(--ink));
  padding:clamp(5rem,13vh,11rem) var(--pad);position:relative;overflow:hidden}
.in-wrap{max-width:var(--maxw);margin-inline:auto;width:100%}
.eyebrow{font-size:.8rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
  opacity:.7;display:flex;align-items:center;gap:.7em;margin-bottom:1.6rem}
.eyebrow::before{content:"";width:2.4em;height:1px;background:currentColor;opacity:.6}
.display{font-size:clamp(2.4rem,1.4rem + 5vw,5.2rem);font-weight:500;letter-spacing:-.03em;max-width:16ch}
.h2{font-size:clamp(2rem,1.3rem + 3vw,3.6rem);font-weight:500;max-width:18ch}
.body-lg{font-size:clamp(1.15rem,1.05rem + .7vw,1.5rem);line-height:1.5;max-width:40ch;opacity:.92}
.body{max-width:54ch;opacity:.9;margin-top:1.2rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.6em;font:inherit;font-weight:500;cursor:pointer;
  padding:.95em 1.7em;border-radius:100px;border:1.5px solid currentColor;transition:.35s var(--ease);font-size:1rem}
.btn--solid{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.btn--solid:hover{transform:translateY(-2px)}
.btn--light{background:var(--cream);color:var(--tann);border-color:var(--cream)}
.btn--light:hover{transform:translateY(-2px)}
.btn--out:hover{background:currentColor}
.btn--out:hover span{color:var(--bg)}
.btn .ar{transition:transform .35s var(--ease)}
.btn:hover .ar{transform:translateX(5px)}

/* Wortmarke */
.wm svg{display:block;height:auto}
.wm svg path,.wm svg rect{fill:currentColor}

/* Nav — minimal (Weglassen) */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:1.3rem var(--pad);color:var(--cream);transition:color .4s,background .4s}
.nav .wm svg{width:76px}
.nav__t{font:inherit;font-weight:500;font-size:.92rem;color:inherit;border:1.5px solid currentColor;
  border-radius:100px;padding:.5em 1.25em;background:transparent;cursor:pointer;transition:.3s}
.nav__t:hover{background:var(--cream);color:var(--tann);border-color:var(--cream)}
.nav.dark{color:var(--ink)}
.nav.dark .nav__t:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}

/* ---------- HERO · Konvergenz ---------- */
.hero{min-height:100svh;display:flex;align-items:center;background:var(--tann);color:var(--cream);
  padding:var(--pad);position:relative}
.converge{position:relative;width:100%;max-width:var(--maxw);margin-inline:auto;
  min-height:60vh;display:flex;flex-direction:column;justify-content:center}
.frag{position:absolute;left:50%;top:46%;
  transform:translate(-50%,-50%) translate(var(--x),var(--y));
  font-size:clamp(.9rem,.6rem + 1vw,1.35rem);color:rgba(244,240,231,.55);white-space:nowrap;font-weight:400;
  transition:transform 1.7s var(--ease) var(--d,0s),opacity 1.5s ease var(--d,0s);pointer-events:none}
.converge.go .frag{transform:translate(-50%,-50%) scale(.5);opacity:0}
.essence{position:relative;opacity:0;transform:translateY(14px);
  transition:opacity 1.3s ease 1.15s,transform 1.3s var(--ease) 1.15s}
.converge.go .essence{opacity:1;transform:none}
.hero .body-lg{margin-top:1.6rem;color:rgba(244,240,231,.85)}
.hero__cta{margin-top:2.4rem;display:flex;gap:1rem;flex-wrap:wrap}

/* ---------- VERBINDUNG · Scroll-Connect ---------- */
.verbindung{background:var(--paper)}
.weave-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;margin-top:1rem}
.weave{width:100%;height:auto;overflow:visible}
.weave .link{fill:none;stroke:var(--braun);stroke-width:1.5;opacity:.5;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ease)}
.weave.in .link{stroke-dashoffset:0}
.weave .node{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.4);
  transition:opacity .7s ease,transform .7s var(--ease)}
.weave.in .node{opacity:1;transform:scale(1)}
.weave .node-l{opacity:0;transition:opacity .7s ease .4s}
.weave.in .node-l{opacity:1}
.weave .origin{transform-box:fill-box;transform-origin:center}
.weave.in .origin{animation:pulse 3.2s var(--ease) infinite 1.4s}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}

/* ---------- DOMINIK ---------- */
.dominik{background:var(--flieder);color:#2a2342}
.dom-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.dom-portrait{aspect-ratio:4/5;border-radius:16px;background:rgba(255,255,255,.35);
  display:flex;align-items:center;justify-content:center;text-align:center;color:#5a5278}
.dom-portrait svg{width:52px;height:52px;opacity:.55;margin-bottom:.7rem}
.dom-portrait span{font-size:.85rem;letter-spacing:.03em}

/* ---------- METHODE ---------- */
.methode{background:var(--rost);color:var(--cream)}
.flow{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(1rem,3vw,2.5rem);align-items:center;margin-top:3rem}
.flow__c{font-weight:500}
.flow__c h3{font-size:1.5rem;margin-bottom:.5rem}
.flow__c p{opacity:.85;font-size:1rem}
.flow__plus{font-size:2rem;opacity:.6}
.flow__sum{margin-top:2.4rem;font-size:clamp(1.2rem,1rem + 1vw,1.7rem);max-width:34ch;opacity:.95}

/* ---------- WEG ---------- */
.weg{background:var(--olivgold);color:#2b2710}
.weg-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem;counter-reset:s}
.weg-step{padding-top:1.4rem;border-top:2px solid rgba(43,39,16,.35)}
.weg-step::before{counter-increment:s;content:"0" counter(s);font-size:.9rem;font-weight:500;opacity:.6}
.weg-step h3{font-size:1.3rem;margin:.6rem 0 .4rem}
.weg-step p{font-size:1rem;opacity:.85;max-width:26ch}

/* ---------- ORT ---------- */
.ort{min-height:80svh;display:flex;align-items:flex-end;color:var(--cream);background:var(--ink)}
.ort__media{position:absolute;inset:0;z-index:0}
.ort__media img{width:100%;height:100%;object-fit:cover}
.ort::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(20,26,24,.6),rgba(20,26,24,.05) 65%)}
.ort .in-wrap{position:relative;z-index:2}

/* ---------- KONTAKT ---------- */
.kontakt{background:var(--tann);color:var(--cream);text-align:center}
.kontakt .display{margin-inline:auto}
.kontakt .body-lg{margin:1.4rem auto 0}
.kontakt .btn{margin-top:2.4rem}
.kontakt__meta{margin-top:3rem;display:flex;justify-content:center;gap:2.5rem;flex-wrap:wrap;
  font-size:.95rem;opacity:.8}
.kontakt__meta b{display:block;opacity:1;font-weight:500;margin-bottom:.2em}

/* ---------- FOOTER ---------- */
.foot{background:var(--ink);color:rgba(244,240,231,.65);padding:clamp(3rem,6vw,5rem) var(--pad)}
.foot__in{max-width:var(--maxw);margin-inline:auto;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:2rem;align-items:flex-end}
.foot .wm svg{width:104px;color:var(--cream)}
.foot p{font-size:.9rem;margin-top:1rem;max-width:30ch}
.foot__legal{display:flex;flex-direction:column;gap:.5rem;font-size:.9rem}
.foot__legal a:hover{color:var(--cream)}
.foot__credit{width:100%;max-width:var(--maxw);margin:2.4rem auto 0;padding-top:1.6rem;
  border-top:1px solid rgba(244,240,231,.14);font-size:.82rem;opacity:.6;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.foot__credit a{border-bottom:1px solid rgba(244,240,231,.3)}

/* Reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.12s}.rv[data-d="2"]{transition-delay:.24s}.rv[data-d="3"]{transition-delay:.36s}

/* Responsive */
@media (max-width:860px){
  .weave-grid,.dom-grid{grid-template-columns:1fr;gap:2.5rem}
  .flow{grid-template-columns:1fr;gap:1.5rem;text-align:center}
  .flow__plus{transform:rotate(90deg)}
  .weg-steps{grid-template-columns:1fr}
  .frag{font-size:.85rem}
}

/* Reduced motion: keine Bewegung, Inhalt sofort sichtbar */
@media (prefers-reduced-motion:reduce){
  .frag{opacity:0!important}
  .essence,.rv{opacity:1!important;transform:none!important;transition:none!important}
  .weave .link{stroke-dashoffset:0!important;transition:none!important}
  .weave .node,.weave .node-l{opacity:1!important;transform:none!important;transition:none!important}
  .weave.in .origin{animation:none!important}
}
