/* DNE – einkommensstrategie.de · gemeinsame Styles */
@font-face{font-family:"Nunito";src:url("fonts/nunito.woff") format("woff");font-weight:200 1000;font-style:normal;font-display:swap}
@font-face{font-family:"Mrs Saint Delafield";src:url("fonts/mrs-saint-delafield.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#1A1A1A;color:#F5F5F3;font-family:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%}
button{font-family:inherit}
a{color:#D49F84}a:hover{color:#F5F5F3}
input::placeholder{color:#A8A29C}
input:focus{outline:2px solid #C8866C;outline-offset:1px}
button:focus-visible,a:focus-visible{outline:2px solid #D49F84;outline-offset:3px}
.dne-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Hero */
@keyframes dneblink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes dnepulse{0%{box-shadow:0 0 0 0 rgba(200,134,108,.55)}70%{box-shadow:0 0 0 10px rgba(200,134,108,0)}100%{box-shadow:0 0 0 0 rgba(200,134,108,0)}}
.dne-cursor{animation:dneblink 1s steps(1) infinite}
.dne-dot{animation:dnepulse 2s infinite}

/* Chat */
.dne-chat .dne-b{opacity:0;transform:translateY(12px)}
.dne-go .dne-b{animation:dneIn .45s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes dneIn{to{opacity:1;transform:none}}

/* Danke-Seite */
@keyframes dnepop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes dnepulse2{0%{box-shadow:0 0 0 0 rgba(200,134,108,.55)}70%{box-shadow:0 0 0 16px rgba(200,134,108,0)}100%{box-shadow:0 0 0 0 rgba(200,134,108,0)}}
.dne-pop{animation:dnepop .6s cubic-bezier(.2,.8,.2,1) both}
.dne-play{animation:dnepulse2 2.2s infinite}

/* Einblick: Karte vor dem Abspielen, danach 16:9-Video */
#dne-player.is-card{height:260px}
#dne-player:not(.is-card){aspect-ratio:16/9}
#dne-player.is-card #dne-video{visibility:hidden}
@media (min-width:600px){#dne-player.is-card{height:360px}}
.dne-only-neu{display:none!important}
body.is-neu .dne-only-neu{display:block!important}
body.is-neu div.dne-only-neu{display:flex!important}
body.is-neu .dne-only-neu[class*=dne-pop]{display:flex!important}
body.is-neu span.dne-only-neu{display:block!important}
body.is-neu .dne-only-std{display:none!important}

/* Formular */
.dne-err{display:none;margin:2px 0 0;font-size:13px;color:#8A3A3A}
.dne-form.is-sending button{opacity:.7;pointer-events:none}

/* Cookie-Banner */
.dne-cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;max-width:520px;margin:0 auto;background:#FFFFFF;color:#1A1A1A;border-radius:20px;padding:18px 18px 16px;box-shadow:0 20px 60px rgba(0,0,0,.5);display:none}
.dne-cookie.is-open{display:block}
.dne-cookie p{margin:0 0 6px;font-size:14px;line-height:1.5;color:#3A3836}
.dne-cookie .t{font-weight:900;font-size:16px;color:#1A1A1A;margin-bottom:6px}
.dne-cookie a{color:#6B6560}
.dne-cookie .b{display:flex;gap:10px;margin-top:12px}
.dne-cookie button{flex:1;height:46px;border-radius:12px;font-family:inherit;font-weight:800;font-size:15px;cursor:pointer}
.dne-cookie .no{background:#F5F5F3;color:#1A1A1A;border:1px solid #E2DDD6}
.dne-cookie .yes{background:#1A1A1A;color:#FFFFFF;border:1px solid #1A1A1A}
.dne-linkbtn{background:none;border:0;padding:0;font:inherit;color:#D49F84;text-decoration:underline;cursor:pointer}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .dne-cursor,.dne-dot,.dne-pop,.dne-play{animation:none}
  .dne-chat .dne-b{opacity:1;transform:none;animation:none}
}

/* Laptop & Desktop (23.10.2026) – Handy-Ansicht bleibt unverändert, gilt nur für die Startseite */
@media (min-width:1024px){
  body.es-start{font-size:18px}
  body.es-start{--gut:max(48px, calc((100vw - 1120px) / 2 + 48px))}
  /* Kopf: Text links, Foto rechts */
  body.es-start main > section:first-of-type{max-width:none!important;min-height:min(820px,92vh)!important;justify-content:center!important}
  body.es-start main > section:first-of-type > picture > img{left:auto!important;right:0!important;width:72%!important;object-position:50% 14%!important}
  body.es-start main > section:first-of-type > div[aria-hidden="true"]{background:linear-gradient(90deg,#1A1A1A 0%,#1A1A1A 26%,rgba(26,26,26,.88) 36%,rgba(26,26,26,.55) 48%,rgba(26,26,26,0) 64%),linear-gradient(180deg,rgba(26,26,26,0) 70%,#1A1A1A 100%)!important}
  body.es-start main > section:first-of-type > div:not([aria-hidden]) > div{left:var(--gut)!important;right:var(--gut)!important;top:28px!important}
  body.es-start main > section:first-of-type > div:last-child{padding:0 0 0 var(--gut)!important;max-width:calc(var(--gut) + 560px)}
  body.es-start main > section:first-of-type h1{font-size:58px!important;margin-bottom:22px!important}
  body.es-start main > section:first-of-type h1 + p{font-size:21px!important;margin-bottom:30px!important;text-shadow:0 1px 12px rgba(0,0,0,.5)}
  body.es-start main > section:first-of-type h1{text-shadow:0 2px 24px rgba(0,0,0,.45)}
  body.es-start main > section:first-of-type > div:last-child > a[href="#anmeldung"]{max-width:380px}
  body.es-start main > section:first-of-type > div:last-child > p:last-child{text-align:left!important;max-width:380px}
  /* Inhalt: gleiche Kante wie oben, Überschrift links, Inhalt rechts */
  body.es-start main > div{max-width:1120px!important;padding:0 48px!important}
  body.es-start main > div h2{font-size:40px!important}
  body.es-start main > div section{padding-top:110px!important}
  body.es-start main > div:nth-of-type(1) > section:nth-of-type(1),
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(2),
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(4){display:grid;grid-template-columns:5fr 7fr;column-gap:72px;align-items:start}
  body.es-start main > div:nth-of-type(1) > section:nth-of-type(1) > :not(#dne-chat),
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(2) > p,
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(2) > h2,
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(4) > h2,
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(4) > p{grid-column:1}
  body.es-start #dne-chat,
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(2) > div,
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(4) > div{grid-column:2;grid-row:1 / span 4}
  /* Drei Punkte nebeneinander */
  body.es-start main > div:nth-of-type(2) > div:first-child{display:grid!important;grid-template-columns:repeat(3,1fr);gap:18px!important}
  body.es-start main > div:nth-of-type(2) > div:first-child > div{flex-direction:column!important;padding:26px 24px!important}
  /* Karte „Wer dir das zeigt“: Text links, Foto rechts */
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(1) > div{display:flex;flex-direction:row-reverse;align-items:stretch}
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(1) > div > img{width:46%!important;height:auto!important;min-height:420px}
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(1) > div > div{flex:1;padding:40px 44px!important;display:flex;flex-direction:column;justify-content:center}
  /* Anmeldung */
  body.es-start #anmeldung{max-width:620px;margin:0 auto}
  body.es-start main > div:nth-of-type(2) > section:nth-of-type(5) > a{max-width:420px;margin:0 auto}
  body.es-start footer{padding-bottom:56px!important}
  body.es-start main > section:first-of-type > div:not([aria-hidden]) > div img{height:30px!important}
  body.es-start .dne-cookie{left:auto;right:24px;bottom:24px;margin:0;max-width:420px;padding:16px 18px 14px}
  body.es-start .dne-cookie p{font-size:13px}
}

/* Mama-Hero mobil: Dani etwas hoeher (24.10.) */
@media (max-width: 1023px) { img[src="img/dani-hero.webp"] { top: -36px !important; height: auto !important; } }