/* Hybrid: v5-Stile bleiben die Basis, hier nur die optische Aufwertung. Farben: nur Marke (Periwinkle, Weiß, tiefes Indigo der App). */
@font-face{font-family:Bricolage;src:url(fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{--display:Bricolage,Verdana,Geneva,sans-serif;--deep:#141840;--lav:#e6eaff;--ease:cubic-bezier(.2,.8,.2,1)}
html{overflow-x:clip}body{overflow-x:clip}
h1,h2{font-weight:800;letter-spacing:-.025em;line-height:1.03}
h2{font-size:clamp(34px,4.6vw,62px)}h3{letter-spacing:-.015em}
.section{position:relative;padding-top:clamp(84px,9vw,128px);padding-bottom:clamp(84px,9vw,128px)}
.section-head{max-width:880px}.section-lead{font-size:clamp(17px,1.4vw,20px)}

/* Wellenkante zwischen Abschnitten */
.hy-edge{position:absolute;left:0;bottom:100%;width:200%;height:clamp(50px,6vw,88px);margin-bottom:-1px;fill:var(--edge,#fff);pointer-events:none;animation:hy-edge 38s linear infinite;z-index:2}
@keyframes hy-edge{to{transform:translateX(-50%)}}

/* Echtes iPhone */
.hp{--w:300px;position:relative;flex:none;width:var(--w);max-width:100%;aspect-ratio:1320/2868;padding:calc(var(--w)*.03);border-radius:calc(var(--w)*.165);background:linear-gradient(135deg,#55586a,#191b26 28%,#2c2f3c 72%,#6a6d7e);box-shadow:0 0 0 1px #000,0 40px 80px -18px rgba(20,24,64,.55),0 18px 34px -14px rgba(20,24,64,.4)}
.hp-screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--w)*.138);background:#05060f}
.hp-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}
.hp-screen img.on{opacity:1}
.hp-island{position:absolute;top:calc(var(--w)*.05);left:50%;transform:translateX(-50%);width:29%;height:calc(var(--w)*.085);border-radius:99px;background:#000}
.hp-btns::before,.hp-btns::after{content:"";position:absolute;width:3px;border-radius:2px;background:#2a2c38}
.hp-btns::before{left:-3px;top:21%;height:11%;box-shadow:0 calc(var(--w)*.17) 0 #2a2c38}.hp-btns::after{right:-3px;top:27%;height:15%}

/* Stimme */
.hy-wave{display:inline-flex;align-items:center;gap:3px;height:16px}
.hy-wave i{width:3px;height:100%;border-radius:3px;background:currentColor;transform:scaleY(.3);animation:hy-wv 1.1s ease-in-out infinite}
.hy-wave i:nth-child(2){animation-delay:.12s}.hy-wave i:nth-child(3){animation-delay:.28s}.hy-wave i:nth-child(4){animation-delay:.42s}.hy-wave i:nth-child(5){animation-delay:.2s}
@keyframes hy-wv{50%{transform:scaleY(1)}}

/* Hero: Markenfarbe statt Foto */
.hero{padding-top:calc(60px + var(--header-h));padding-bottom:clamp(110px,10vw,150px);background:radial-gradient(900px 620px at 76% 34%,#c6d2ff,transparent 70%),linear-gradient(180deg,#eef1ff,var(--lav))}
.hero-title{font-size:clamp(44px,5.6vw,84px)}
.hy-hero-phone{position:relative;display:flex;justify-content:center}.hy-hero-phone .hp{--w:clamp(250px,23vw,320px)}
.hy-say{position:absolute;z-index:3;left:-6%;bottom:6%;width:300px;padding:17px 20px;border-radius:22px 22px 22px 6px;background:#fff;color:var(--ink);font:700 18px/1.25 var(--display);box-shadow:0 26px 56px -14px rgba(20,24,64,.45);transition:opacity .3s,transform .4s var(--ease)}
.hy-say .hy-wave{display:flex;margin-bottom:8px;color:var(--brand)}
.hy-say.you{background:var(--brand);color:#fff;border-radius:22px 22px 6px 22px}.hy-say.you .hy-wave{color:#fff}
.hy-say.swap{opacity:0;transform:translateY(10px) scale(.97)}

/* Zahlen */
.trustbar{position:relative;--edge:#fff;background:#fff;border:0;padding:30px 0 70px}
.trust-item strong{font-family:var(--display);font-weight:800;font-size:clamp(28px,3.2vw,46px);letter-spacing:-.03em;line-height:1.05}

/* Gespräch: tiefes Indigo wie die App */
.conversation{--edge:var(--deep);background:var(--deep);color:#fff}
.conversation h2,.conversation h3{color:#fff}.conversation .section-lead{color:rgba(255,255,255,.8)}
.conversation .grad-text{background:none;-webkit-text-fill-color:#b8d4ff;color:#b8d4ff}
.proof-grid{display:block!important}
.hy-talk{position:relative;display:flex;justify-content:center;margin:60px auto 70px;max-width:1100px}.hy-talk-phone{--w:310px}
.hy-tb{position:absolute;width:320px;padding:18px 22px;border-radius:22px 22px 22px 6px;background:#fff;color:var(--ink);font:700 19px/1.25 var(--display);box-shadow:0 24px 50px -14px rgba(0,0,0,.6);opacity:0;transform:translateY(34px) scale(.92);transition:opacity .6s,transform .7s var(--ease)}
.hy-tb b{display:block;font:700 12px var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--brand);margin-bottom:6px}
.hy-tb.you{background:var(--brand-mid);color:#fff;border-radius:22px 22px 6px 22px}.hy-tb.you b{color:#fff}
.hy-tb.in{opacity:1;transform:none}
.hy-tb1{left:calc(50% - 510px);top:6%}.hy-tb2{left:calc(50% + 190px);top:18%}.hy-tb3{left:calc(50% - 480px);top:48%}.hy-tb4{left:calc(50% + 160px);top:68%}
.proof-copy{max-width:900px;margin:0 auto;text-align:center}
.proof-copy .vs{text-align:left}
.vs-col{border-radius:24px}.vs-old{background:rgba(255,255,255,.07);border:0;color:rgba(255,255,255,.85)}.vs-old h3,.vs-old li{color:rgba(255,255,255,.85)}
.vs-new{background:#fff}.vs-new h3{color:var(--ink)!important}.vs-new li{color:var(--ink-2)}
.proof-note{color:rgba(255,255,255,.72)}

/* So geht's: Handy-Fächer auf Periwinkle */
.how{--edge:var(--brand);background:var(--brand)!important;color:#fff}
.how h2{color:#fff}.how .section-lead{color:rgba(255,255,255,.88)}
.hy-fan{position:relative;height:clamp(420px,50vw,640px);margin-top:50px;--p:0}
.hy-fp{--w:clamp(170px,20vw,280px);position:absolute;left:50%;top:0;margin-left:calc(var(--w)/-2);transform:translateX(calc(var(--x)*var(--p)*1%)) translateY(calc(var(--y)*var(--p)*1px)) rotate(calc(var(--r)*var(--p)*1deg))}
.hy-fp1{--x:-190;--r:-11;--y:60;z-index:1}.hy-fp2{--x:-96;--r:-5.5;--y:18;z-index:2}.hy-fp3{--x:0;--r:0;--y:0;z-index:3}.hy-fp4{--x:96;--r:5.5;--y:18;z-index:2}.hy-fp5{--x:190;--r:11;--y:60;z-index:1}
.hy-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.hy-steps li{padding:28px;border-radius:26px;background:rgba(255,255,255,.13)}
.hy-steps .step-num{background:#fff;color:var(--brand)}.hy-steps h3{color:#fff;margin:14px 0 10px;font-size:clamp(20px,1.7vw,24px);line-height:1.18}.hy-steps p{color:rgba(255,255,255,.9);font-size:16px}

/* Jedes Thema */
.generate{--edge:var(--deep);background:var(--deep)!important;color:#fff;padding-bottom:clamp(120px,11vw,170px)}
.generate h2{color:#fff}.generate .section-lead{color:rgba(255,255,255,.8)}
.generate .grad-text{background:none;-webkit-text-fill-color:#b8d4ff;color:#b8d4ff}
.hy-wall{display:grid;gap:12px;margin-top:clamp(40px,5vw,64px);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.hy-wall-row{display:flex;width:max-content;max-width:none;margin:0;padding:0;list-style:none;animation:hy-mq 95s linear infinite}
.hy-wall-row:nth-child(2){animation-direction:reverse;animation-duration:120s}.hy-wall-row:nth-child(3){animation-duration:80s}.hy-wall-row:nth-child(4){animation-direction:reverse;animation-duration:105s}
.hy-wall-row li{flex:none;margin-right:12px;padding:.62em 1.05em;border-radius:99px;background:rgba(184,212,255,.13);color:#fff;font:700 clamp(17px,1.7vw,24px)/1.15 var(--display);white-space:nowrap}
.hy-wall-row li:nth-child(5n+2){background:var(--brand-mid)}
.hy-wall-row i{font-style:normal;font-weight:500;color:#b8d4ff}.hy-wall-row li:nth-child(5n+2) i{color:#fff}
.hy-ex{display:grid;grid-template-columns:1fr auto;gap:clamp(36px,6vw,84px);align-items:center;max-width:1080px;margin:clamp(56px,6vw,84px) auto 0;padding:clamp(36px,4.4vw,60px);border-radius:32px;background:#fff;color:var(--ink);text-align:left}
.hy-ex-label{margin:0 0 9px;font:800 12px var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--brand)}
.hy-ex-wish{width:fit-content;margin:0 0 30px;padding:14px 22px;border-radius:18px 18px 18px 6px;background:var(--lav);font:700 clamp(19px,1.8vw,24px)/1.2 var(--display);color:var(--ink)}
.hy-ex .hy-ex-title{margin:0;font:800 clamp(30px,3.3vw,46px)/1.05 var(--display);letter-spacing:-.025em;color:var(--ink)}
.hy-ex-meta{margin:9px 0 30px;font-size:16px;color:var(--muted)}
.hy-ex-stories{display:grid;gap:18px;margin:6px 0 32px;padding:0;list-style:none}
.hy-ex-stories li{display:grid;grid-template-columns:32px 1fr;gap:14px}
.hy-ex-num{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--brand);color:#fff;font:800 15px var(--display)}
.hy-ex-stories b{display:block;font:700 18px/1.25 var(--display);color:var(--ink)}
.hy-ex-stories p{margin:3px 0 0;font-size:16px;line-height:1.45;color:var(--ink-2)}
.hy-ex-cta{display:inline-flex}
.hy-ex-phone{display:flex;justify-content:center}.hy-ex-phone .hp{--w:clamp(250px,24vw,310px)}
@keyframes hy-mq{to{transform:translateX(-50%)}}

/* Vergleich */
.compare{--edge:var(--soft);background:var(--soft)!important}
.cmp-note{margin:-8px 0 16px;font-size:14px;line-height:1.4;color:var(--muted)}
.compare-grid{max-width:1120px}.cmp{border-radius:26px}.cmp-win{transform:translateY(-10px);box-shadow:var(--sh-hover)}

/* Zwei Wege: gleicher Stopp in der Mitte */
.adapt{background:#fff}
.adapt-grid{max-width:1180px;grid-template-columns:1fr 150px 1fr!important;gap:0!important;align-items:stretch}
.adapt-col{display:flex;flex-direction:column;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.adapt-said{font-size:15px;margin-bottom:16px;text-align:center}
.adapt-tag{display:block;margin-top:8px;padding:14px 20px;border-radius:18px;background:var(--brand);color:#fff!important;font:700 clamp(18px,1.6vw,22px)/1.2 var(--display)}
.adapt-bubble{flex:1;padding:28px!important;border-radius:28px!important;border:0!important;background:var(--lav)!important;font:700 clamp(19px,1.65vw,23px)/1.3 var(--display);color:var(--ink);box-shadow:none!important}
.adapt-bubble::before,.adapt-bubble::after{display:none!important}
.adapt-bubble .who{display:flex;align-items:center;gap:8px;margin-bottom:14px;font:800 12px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.adapt-bubble b{color:inherit;font-weight:inherit}
.js-words .w{opacity:.2;transition:opacity .25s}.js-words .w.lit{opacity:1}
.adapt-why{margin-top:14px;text-align:center;font-weight:600;color:var(--brand-strong)}
.adapt-vs{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:none!important;position:relative;z-index:2;margin:0 -30px;padding:0!important;border:0!important}
.adapt-vs img{width:190px;height:190px;max-width:none;border-radius:50%;object-fit:cover;border:7px solid #fff;box-shadow:0 18px 44px -10px rgba(40,55,120,.45)}
.adapt-vs span{padding:6px 14px;border-radius:99px;background:var(--deep);color:#fff;font:700 13px var(--body);white-space:nowrap}
.adapt-foot{max-width:760px;margin:40px auto 0;text-align:center;font:700 clamp(19px,1.7vw,24px)/1.3 var(--display);color:var(--ink)}

/* Dein Weg: Echtfoto */
.yourwalk{background:var(--soft)}
.yourwalk-media .proof-phone{margin:0;position:relative}.yourwalk-media .real-phone-card{border-radius:28px;overflow:hidden;box-shadow:var(--sh-hover)}
.yourwalk-grid{align-items:center}

/* Features */
.features{background:#fff!important}
.feature-card{border-radius:26px;border:0;background:var(--soft);box-shadow:none;transition:transform .3s var(--ease),box-shadow .3s}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--sh-hover)}
.hy-art{height:120px;margin-bottom:16px;border-radius:18px;background:var(--lav);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;overflow:hidden}
.hy-hello,.hy-theme{font:800 34px var(--display);color:var(--brand);transition:opacity .25s,transform .25s;text-align:center;padding:0 10px;line-height:1.1}.hy-theme{font-size:22px}
.hy-hello.swap,.hy-theme.swap{opacity:0;transform:translateY(8px)}
.hy-chip{padding:7px 13px;border-radius:99px;background:var(--brand);color:#fff;font:700 14px var(--body);animation:hy-bob 3s ease-in-out infinite}.hy-chip:nth-child(2){animation-delay:.4s}.hy-chip:nth-child(3){animation-delay:.8s}
@keyframes hy-bob{50%{transform:translateY(-6px)}}
.hy-art svg{width:86%}.hy-art path{fill:none;stroke:var(--brand);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;animation:hy-dr 5s ease-in-out infinite}.hy-art circle{fill:var(--brand-strong)}
@keyframes hy-dr{0%{stroke-dashoffset:1}60%,100%{stroke-dashoffset:0}}

/* Touren: Laufband mit Fotos, ruhiger Grund */
.tours{background:var(--soft)!important}
.hy-tours{overflow:hidden;margin:44px 0}
.hy-tours .tour-grid{display:flex!important;gap:18px;width:max-content;max-width:none;margin:0;animation:hy-mq 50s linear infinite;grid-template-columns:none}
.hy-tours:hover .tour-grid{animation-play-state:paused}
.hy-tours li{flex:none;width:clamp(240px,27vw,370px)}
.hy-tours .tour-card{position:relative;display:block;aspect-ratio:4/3;min-height:0;padding:0;border-radius:26px;overflow:hidden;background:#000;box-shadow:0 22px 40px -18px rgba(40,55,120,.55);transition:transform .35s var(--ease)}
.hy-tours .tour-card:hover{transform:translateY(-8px)}
.hy-tours .tour-landmark{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:1;transform:none;filter:none;right:auto;bottom:auto;top:0;left:0}
.hy-tours .tour-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,24,64,.9),rgba(20,24,64,.55) 28%,transparent 62%)}
.hy-tours .tour-city,.hy-tours .tour-meta{position:absolute;z-index:1;left:20px;color:#fff;text-shadow:none}
.hy-tours .tour-city{bottom:38px;font:800 28px var(--display)}.hy-tours .tour-meta{bottom:15px;font-size:14px;opacity:.9}

/* Preise: All-inclusive in der Mitte */
.pricing{background:#fff!important}
.price-grid{max-width:1120px;align-items:stretch}.price-card{border-radius:28px}
.price-pop{background:var(--deep)!important;color:#fff;border:0!important;transform:translateY(-14px);box-shadow:0 34px 70px -24px rgba(20,24,64,.7)}
.price-pop .price-name,.price-pop .price-amount,.price-pop .price-feat li{color:#fff}.price-pop .price-amount span,.price-pop .price-unit{color:rgba(255,255,255,.75)}
.price-amount{font-family:var(--display);font-weight:800;letter-spacing:-.03em}

/* Datenschutz, FAQ */
.privacy{background:var(--lav)!important}
.faq{background:#fff}

/* Schluss */
.final-cta{position:relative;--edge:#4f5fce;background:linear-gradient(135deg,#4f5fce,#4f46e5)!important;padding-top:clamp(90px,9vw,130px);padding-bottom:clamp(90px,9vw,130px)}
.final-cta h2{font-size:clamp(38px,5.4vw,76px)}

@media (max-width:980px){
  .hy-say{left:50%;margin-left:-150px;bottom:-34px}.hy-hero-phone{margin:20px 0 40px}
  .hy-talk{display:block;margin:36px 0 44px}.hy-talk-phone{--w:240px;margin:0 auto 26px}
  .hy-tb{position:relative;left:auto!important;top:auto!important;width:auto;margin-bottom:12px}.hy-tb.you{margin-left:34px}.hy-tb:not(.you){margin-right:34px}
  .hy-fan{height:400px}.hy-fp{--w:165px}.hy-fp1{--x:-118;--r:-10;--y:34}.hy-fp2{--x:-62;--r:-5;--y:10}.hy-fp4{--x:62;--r:5;--y:10}.hy-fp5{--x:118;--r:10;--y:34}
  .hy-steps,.hy-ex{grid-template-columns:1fr}.hy-ex{margin-top:44px;padding:30px 24px 36px;border-radius:28px}.hy-ex-phone .hp{--w:240px}.hy-ex-cta{width:100%;justify-content:center}
  .adapt-grid{grid-template-columns:1fr!important;gap:16px!important}.adapt-vs{margin:0;order:-1}.adapt-vs img{width:150px;height:150px}
  .cmp-win,.price-pop{transform:none}
}
@media (prefers-reduced-motion:reduce){.hy-wall{-webkit-mask-image:none;mask-image:none;padding:0 16px}.hy-wall-row{width:auto;flex-wrap:wrap;justify-content:center;row-gap:12px}.hy-wall-row li[aria-hidden]{display:none}.hy-edge,.hy-wall-row,.hy-tours .tour-grid,.hy-wave i,.hy-chip,.hy-art path{animation:none!important}.hy-tb{opacity:1;transform:none}.js-words .w{opacity:1}}

/* Korrekturen nach Sichtprüfung */
.hero-grid{grid-template-columns:1.15fr .85fr;gap:40px}
.hero-copy{order:0!important;grid-column:1!important;grid-row:1!important}.hy-hero-phone{order:1!important;grid-column:2!important;grid-row:1!important}
.section-head h2,.yourwalk-copy h2{font-size:clamp(34px,4.6vw,62px)!important}
.hy-tours .tour-landmark{-webkit-mask:none!important;mask:none!important;clip-path:none!important;border-radius:0!important;width:100%!important;height:100%!important}
.privacy{--edge:var(--lav)}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr}.hero-copy,.hy-hero-phone{grid-column:1!important;grid-row:auto!important}}

/* Vergleich Audioguide/Guide: Paare je Zeile */
.hy-pairs{max-width:900px;margin:0 auto;text-align:left}
.hy-pairs ul{list-style:none;margin:0;padding:0}
.hy-pairs-head,.hy-pairs li{display:grid;grid-template-columns:1fr 1fr}
.hy-pairs .hy-old,.hy-pairs .hy-new{padding:13px 26px;font-size:16px;line-height:1.4}
.hy-pairs .hy-old{background:rgba(255,255,255,.07);color:rgba(255,255,255,.72)}
.hy-pairs .hy-new{background:#fff;color:var(--ink-2)}.hy-pairs .hy-new b{color:var(--ink)}
.hy-pairs li span::before{display:inline-block;width:24px;font-weight:800}
.hy-pairs li .hy-old::before{content:"✕";color:rgba(255,255,255,.5)}
.hy-pairs li .hy-new::before{content:"✓";color:var(--brand)}
.hy-pairs-head h3{margin:0;padding-top:24px;padding-bottom:12px;font:800 clamp(19px,1.7vw,23px)/1.2 var(--display)}
.hy-pairs-head h3.hy-old{color:rgba(255,255,255,.72);border-radius:24px 0 0 0}.hy-pairs-head h3.hy-new{color:var(--ink);border-radius:0 24px 0 0}
.hy-pairs li:last-child .hy-old{padding-bottom:26px;border-radius:0 0 0 24px}.hy-pairs li:last-child .hy-new{padding-bottom:26px;border-radius:0 0 24px 0}
.proof-cta{display:inline-flex!important;margin:30px auto 0!important}
.proof-note{text-align:center!important;margin:16px auto 0!important;max-width:560px}
@media (max-width:700px){
  .hy-pairs{border-radius:24px;overflow:hidden;background:#fff}
  .hy-pairs-head{display:none}
  .hy-pairs li{display:block;padding:16px 20px;border-bottom:1px solid var(--line)}.hy-pairs li:last-child{border-bottom:0}
  .hy-pairs li span{display:block;padding:0!important;background:none!important;border-radius:0!important}
  .hy-pairs li .hy-old{font-size:14px;color:var(--muted-2);text-decoration:line-through;text-decoration-color:rgba(100,116,139,.5)}
  .hy-pairs li .hy-old::before{color:var(--muted-2);text-decoration:none;width:22px}
  .hy-pairs li .hy-new{margin-top:5px;font:700 18px/1.25 var(--display);color:var(--ink)}
  .hy-pairs li .hy-new::before{width:22px;font-size:16px}
}
@media (max-width:700px){.hy-pairs li span{position:relative;padding-left:24px!important}.hy-pairs li span::before{position:absolute;left:0;top:0;width:auto}.hy-pairs li .hy-new::before{top:1px}}
