/* ===== Fonts ===== */
@font-face { font-family:'Sofia Sans'; font-style:normal; font-weight:300 700; font-display:swap; src:url('fonts/sofiasans-400.woff2') format('woff2'); }
@font-face { font-family:'Ephesis'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/ephesis-400.woff2') format('woff2'); }

/* ===== Tokens ===== */
:root{
  --plum:#80285A; --plum-deep:#6f2350; --plum-soft:#954E73;
  --lilac:#E1CFD9; --lilac-card:#ead9e2;
  --peach:#FFB470; --peach-deep:#f7a35a; --peach-card:#FBB56E;
  --orange-bg:#FBB56E;
  --ink:#3a2f33; --ink-soft:#5d5158;
  --white:#fff;
  --sans:'Sofia Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --script:'Ephesis',cursive;
  --maxw:1240px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:96px;}
body{margin:0;font-family:var(--sans);font-weight:300;color:var(--ink);background:#fff;line-height:1.7;font-size:18px;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--sans);font-weight:700;line-height:1.12;margin:0;}
.script{font-family:var(--script);font-weight:400;}

/* ===== Header: pill nav ===== */
.site-header{position:sticky;top:0;z-index:200;padding:14px 0;background:transparent;}
.site-header.scrolled{background:transparent;}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:18px;}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;background:var(--plum);color:#fff;padding:9px 24px 9px 10px;border-radius:40px;box-shadow:0 6px 18px rgba(128,40,90,.25);}
.logo-badge{width:46px;height:46px;flex:0 0 46px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.logo-badge img{width:80%;height:80%;object-fit:contain;}
.logo-text{display:flex;flex-direction:column;line-height:1.05;}
.logo-text strong{font-size:21px;letter-spacing:1px;font-weight:700;}
.logo-text em{font-style:normal;font-size:9.5px;letter-spacing:1px;opacity:.92;margin-top:3px;font-weight:700;white-space:nowrap;}
.nav-links{display:flex;align-items:center;gap:10px;list-style:none;margin:0;padding:0;}
.nav-links a{display:inline-block;text-decoration:none;font-family:var(--script);font-size:21px;color:var(--plum);background:var(--peach);padding:7px 20px;border-radius:30px;line-height:1;transition:transform .15s ease, background .2s ease, box-shadow .2s ease;box-shadow:0 3px 10px rgba(255,180,112,.35);white-space:nowrap;}
.nav-links a:hover{background:var(--peach-deep);transform:translateY(-2px);}
.nav-links a.active{background:var(--plum);color:#fff;box-shadow:0 3px 10px rgba(128,40,90,.3);}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px;width:46px;height:46px;}
.nav-toggle span{display:block;height:2.5px;width:28px;background:var(--plum);margin:6px 0;border-radius:2px;transition:transform .3s ease,opacity .3s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(8.5px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg);}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--peach);color:var(--plum);font-family:var(--sans);font-weight:600;font-size:17px;text-decoration:none;padding:15px 32px;border-radius:34px;border:0;cursor:pointer;transition:background .2s ease,transform .15s ease,box-shadow .2s ease;box-shadow:0 8px 22px rgba(255,180,112,.4);}
.btn:hover{background:var(--peach-deep);transform:translateY(-2px);box-shadow:0 12px 28px rgba(255,180,112,.5);}
.btn-script{font-family:var(--script);font-size:26px;font-weight:400;padding:14px 38px;}
.btn .arrow{font-size:20px;line-height:1;}

/* ===== Bands (colour blocks) ===== */
.band{position:relative;padding:90px 0;}
.band > *:not(.wave){position:relative;z-index:2;}
.band-purple{background:var(--plum);color:#fff;}
.band-lilac{background:var(--lilac);color:var(--ink);}
.band-orange{background:var(--orange-bg);color:var(--ink);}
.band-white{background:#fff;}
.band.slim{padding:70px 0;}
.band-title{font-size:clamp(34px,5.2vw,60px);text-align:center;margin:0 auto 56px;max-width:1000px;}
.band-title.plum{color:var(--plum);}
.band-purple .band-title{color:#fff;}

/* ===== Wave dividers ===== */
.wave{position:absolute;left:0;width:100%;height:90px;z-index:3;line-height:0;pointer-events:none;}
.wave-bottom{bottom:-1px;}
.wave svg{display:block;width:100%;height:100%;}
@media(max-width:700px){ .wave{height:50px;} }

/* ===== HERO ===== */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;background:var(--plum);margin-top:-104px;padding-top:104px;}
.hero-photo{position:absolute;inset:0;background-size:cover;background-position:center 28%;will-change:transform;z-index:1;}
.hero-blob{position:relative;z-index:2;margin-left:max(4vw,calc((100vw - var(--maxw))/2 + 10px));width:min(60vw,720px);aspect-ratio:1/1;background:rgba(111,35,80,.92);border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;box-shadow:0 30px 80px rgba(60,20,45,.35);}
.hero-content{padding:6%;max-width:88%;}
.hero h1{color:#fff;font-size:clamp(40px,6vw,80px);font-weight:700;margin:0 0 22px;text-shadow:0 2px 16px rgba(0,0,0,.18);}
.hero-sub{font-family:var(--script);color:var(--peach);font-size:clamp(26px,3.6vw,44px);line-height:1.2;margin:0 0 30px;}
.hero .btn-script{background:var(--peach);color:var(--plum);}

/* ===== WORUM GEHT'S ===== */
.worum{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;}
.worum-photo{position:relative;}
.leaf-clip{width:100%;aspect-ratio:1/1.05;background-size:cover;background-position:center;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;box-shadow:0 20px 50px rgba(0,0,0,.25);}
.worum-cards{display:flex;flex-direction:column;gap:26px;}
.worum-cards .band-title{text-align:left;margin:0 0 8px;}
.pill-card{background:var(--peach-card);border-radius:60px;padding:30px 38px;display:flex;align-items:center;gap:22px;box-shadow:0 14px 34px rgba(0,0,0,.14);}
.pill-card:nth-child(3){margin-left:40px;}
.pill-card:nth-child(4){margin-left:18px;}
.pill-icon{flex:0 0 64px;width:64px;height:64px;}
.pill-icon svg{width:100%;height:100%;}
.pill-body h3{font-size:34px;color:var(--plum);margin:0 0 6px;-webkit-text-stroke:0.8px var(--plum);}
.pill-body p{margin:0;color:var(--plum-deep);font-size:17px;line-height:1.55;}

/* ===== KENNST DU DAS ===== */
.feel-grid{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:start;}
.feel-col{display:flex;flex-direction:column;align-items:center;}
.icon-circle{width:230px;height:230px;border-radius:50%;background:var(--plum);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;z-index:2;}
.icon-circle svg{width:62%;height:62%;}
/* Kennst du das: white line illustrations on purple */
.feel-col .icon-circle svg path{fill:#fff;}
/* DU bist richtig: orange line illustrations on purple */
.rcard .icon-circle svg path{fill:var(--peach);}
.feel-card{background:var(--lilac-card);border-radius:38px;padding:60px 26px 30px;margin-top:-46px;text-align:center;width:100%;min-height:230px;display:flex;align-items:center;justify-content:center;}
.feel-card p{margin:0;font-size:19px;color:var(--ink);}
.prose-blob{max-width:920px;margin:54px auto 0;background:var(--plum);color:#fff;border-radius:60px;padding:60px 56px;text-align:center;}
.prose-blob p{margin:0 0 18px;}
.prose-blob .center{margin-top:34px;}
.prose-blob .btn{background:var(--peach);}

/* ===== DU BIST RICHTIG ===== */
.richtig{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;}
.richtig-text .band-title{text-align:left;margin:0 0 40px;}
.richtig-list{display:flex;flex-direction:column;gap:22px;}
.rcard{display:flex;align-items:center;gap:18px;background:#fff;border-radius:50px;padding:18px 30px 18px 18px;box-shadow:0 10px 26px rgba(0,0,0,.1);}
.rcard .icon-circle.sm{flex:0 0 92px;width:92px;height:92px;}
.rcard .icon-circle.sm svg{width:66%;height:66%;}
.rcard p{margin:0;font-size:17px;color:var(--ink);}
.richtig-media{position:relative;}
.circle-clip{width:100%;aspect-ratio:1/1.08;background-size:cover;background-position:center;border-radius:50%;box-shadow:0 20px 50px rgba(0,0,0,.2);}
.star-doodle{position:absolute;left:-6%;top:18%;width:150px;z-index:3;}
.star-doodle svg{width:100%;height:auto;}

/* ===== PULLQUOTES ===== */
.pullquote{text-align:center;font-family:var(--script);font-size:clamp(34px,5vw,62px);color:var(--plum);line-height:1.25;max-width:1000px;margin:0 auto;padding:0 22px;}

/* ===== ABOUT (purple section) ===== */
.about-section{position:relative;overflow:hidden;}
.about-frame{max-width:1080px;margin:0 auto;padding:0 22px;position:relative;z-index:3;}
/* rounded-rectangle outline framing the content */
.about-frame::before{content:"";position:absolute;left:8px;right:8px;top:330px;bottom:-10px;border:1.5px solid rgba(255,255,255,.45);border-radius:60px;pointer-events:none;z-index:-1;}
/* overlapping circular photos */
.about-photos{position:relative;height:430px;display:flex;justify-content:center;align-items:flex-start;margin-bottom:10px;}
.about-photo{border-radius:50%;overflow:hidden;border:6px solid var(--plum);box-shadow:0 16px 40px rgba(0,0,0,.25);}
.about-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.22,.61,.36,1);}
.about-photo:hover img{transform:scale(1.07);}
.about-photo-main{width:400px;height:400px;position:relative;z-index:2;}
.about-photo-sub{width:240px;height:240px;position:absolute;left:calc(50% - 320px);top:170px;z-index:3;}
.about-title{color:#fff;text-align:center;margin:0 0 8px;}
.about-body{max-width:880px;margin:0 auto;text-align:center;color:#fff;}
.about-sub{font-family:var(--script);font-weight:400;color:var(--peach);font-size:clamp(28px,3.4vw,40px);margin:0 0 26px;-webkit-text-stroke:.6px var(--peach);}
.about-body p{margin:0 0 26px;}
.about-sign{position:relative;margin:34px 0 8px;}
.about-sign .signature{font-family:var(--script);font-size:46px;color:var(--peach);margin:0;text-align:center;}
.about-woman{position:absolute;right:0;bottom:-150px;width:150px;opacity:.5;pointer-events:none;}
.about-woman svg{width:100%;height:auto;}
.about-woman svg path{fill:none;stroke:rgba(255,255,255,.7);stroke-width:1.5;}
.about-section .center{text-align:center;margin-top:30px;position:relative;z-index:4;}
.about-section .btn-script{background:var(--peach);color:var(--plum);}
/* hearts down both sides */
.about-section .about-hearts{position:absolute;width:130px;z-index:1;pointer-events:none;}
.about-section .about-hearts-left{left:20px;top:120px;}
.about-section .about-hearts-right{right:20px;top:380px;transform:scaleX(-1);}
.about-hearts svg{width:100%;height:auto;}
.center{text-align:center;margin-top:36px;}

/* ===== FB SPLIT ===== */
.fb-split{max-width:var(--maxw);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.fb-split .btn{margin-top:14px;}
.fb-img{border-radius:24px;box-shadow:0 18px 44px rgba(128,40,90,.18);}

/* ===== STORIES ===== */
.erfolg{position:relative;overflow:hidden;}
.erfolg .erfolg-woman{position:absolute;left:0;bottom:30px;width:200px;z-index:1;pointer-events:none;}
.erfolg-woman svg{width:100%;height:auto;}
.erfolg-woman svg path{fill:var(--plum);}
.erfolg .erfolg-hearts{position:absolute;right:40px;top:50px;width:120px;z-index:1;pointer-events:none;}
.erfolg-hearts svg{width:100%;height:auto;}
.stories{max-width:1000px;margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start;position:relative;z-index:2;}
.stories img{border-radius:18px;box-shadow:0 14px 34px rgba(128,40,90,.14);}
.stories .story-tall{grid-row:span 2;}

/* ===== FOOTER ===== */
.site-footer{background:var(--orange-bg);padding:40px 22px 56px;}
.footer-squiggle{width:150px;margin:0 auto 18px;}
.footer-squiggle svg{width:100%;height:auto;}
.footer-bar{max-width:1240px;margin:0 auto;background:var(--plum);border-radius:80px;padding:34px 56px;display:flex;align-items:center;justify-content:space-between;gap:30px;}
.footer-copy{color:#fff;font-size:14px;margin:0;opacity:.92;flex:1;}
.footer-cta{margin:0;flex:0 0 auto;}
.footer-legal{display:flex;gap:26px;justify-content:flex-end;margin:0;flex:1;}
.footer-legal a{color:var(--peach);font-family:var(--script);font-size:24px;text-decoration:none;}
.footer-legal a:hover{text-decoration:underline;}

/* ===== Legal pages ===== */
.legal-page{padding:60px 0 90px;}
.legal-page .wrap{max-width:860px;margin:0 auto;padding:0 22px;}
.legal-page h1{font-size:clamp(34px,5vw,52px);color:var(--plum);margin:0 0 36px;}
.legal-page h3{color:var(--plum);font-size:22px;margin:40px 0 14px;}
.legal-page h5{color:var(--plum);font-size:19px;margin:30px 0 10px;font-weight:700;}
.legal-page p,.legal-page li{font-size:16px;line-height:1.75;}
.legal-page a{color:var(--plum);word-break:break-word;}
.legal-page ul{padding-left:22px;}

/* ===== Reveal ===== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* ===== Responsive ===== */
@media(max-width:1000px){
  .nav-links{gap:7px;}
  .nav-links a{font-size:18px;padding:6px 15px;}
}
@media(max-width:900px){
  .nav-toggle{display:block;}
  .nav-links{position:fixed;inset:78px 12px auto 12px;flex-direction:column;gap:8px;background:#fff;padding:16px;border-radius:22px;box-shadow:0 16px 36px rgba(128,40,90,.18);transform:translateY(-130%);transition:transform .35s ease;align-items:stretch;}
  .nav-links.open{transform:translateY(0);}
  .nav-links a{text-align:center;font-size:22px;padding:11px;}
  .worum,.richtig,.fb-split{grid-template-columns:1fr;gap:36px;}
  .hero-blob{width:min(86vw,560px);margin:0 auto;}
  .hero{justify-content:center;}
  .hero-photo{background-position:center 20%;}
  .pill-card:nth-child(3),.pill-card:nth-child(4){margin-left:0;}
  .feel-grid{grid-template-columns:1fr;gap:14px;max-width:560px;}
  .feel-card{min-height:0;margin-top:-40px;padding:56px 24px 26px;}
  .icon-circle{width:200px;height:200px;}
  .richtig-media{max-width:460px;margin:0 auto;}
  .star-doodle{width:110px;left:0;top:-4%;}
  .about-photos{height:auto;flex-direction:column;align-items:center;gap:0;}
  .about-photo-main{width:74vw;max-width:320px;height:74vw;max-height:320px;}
  .about-photo-sub{position:relative;left:auto;top:-50px;width:48vw;max-width:200px;height:48vw;max-height:200px;align-self:flex-start;margin-left:10vw;}
  .about-frame::before{top:auto;display:none;}
  .about-woman{display:none;}
  .about-section .about-hearts{width:80px;}
  .about-section .about-hearts-left{left:6px;top:60px;}
  .about-section .about-hearts-right{right:6px;top:auto;bottom:120px;}
  .stories{grid-template-columns:1fr;max-width:520px;}
  .stories .story-tall{grid-row:auto;}
  .band{padding:64px 0;}
  .prose-blob{padding:44px 28px;border-radius:40px;}
  .footer-bar{flex-direction:column;gap:22px;text-align:center;border-radius:40px;padding:30px 26px;}
  .footer-copy,.footer-legal{flex:none;justify-content:center;}
  .erfolg-woman{width:120px;bottom:10px;opacity:.85;}
  .erfolg-hearts{width:100px;right:10px;top:30px;}
}
@media(max-width:540px){
  body{font-size:17px;}
  .logo-text strong{font-size:17px;}
  .logo-text em{font-size:8px;}
  .hero h1{font-size:38px;}
  .pill-card{flex-direction:row;padding:24px 26px;border-radius:40px;}
  .btn-script{font-size:21px;}
}