/* Produktseite WeSayYes – baut auf app.css auf (Farben, Schriften, Buttons). */
.landing{--max:1160px}
.top--landing{max-width:none;padding-inline:max(16px,calc((100vw - var(--max)) / 2 + 16px));position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.top__nav{display:flex;gap:22px;align-items:center}
.top__nav a:not(.btn){text-decoration:none;font-family:var(--caps);text-transform:uppercase;letter-spacing:.16em;font-size:.74rem}
.btn--small{min-height:40px;padding:.5em 1.2em;font-size:.72rem}
.btn--wide{width:100%}
.btn--light{background:#fff;border-color:#fff;color:var(--ink)}
@media(max-width:700px){.top__nav a:not(.btn){display:none}}
.landing main>section{max-width:var(--max);margin:0 auto;padding:clamp(64px,10vw,120px) 16px}
.sec-title{margin:0 auto clamp(30px,5vw,56px);text-align:center;font-family:var(--caps);font-weight:400;font-size:clamp(1.7rem,4.4vw,2.7rem);line-height:1.2;letter-spacing:.03em;max-width:22ch}
.sec-title .eyebrow{display:block;margin-bottom:12px}
.sec-title--left{text-align:left;margin-left:0}
.eyebrow--light{color:rgba(255,255,255,.75)}

/* Hero */
.lhero{display:grid;gap:40px;align-items:center;padding-top:clamp(30px,6vw,70px)!important}
@media(min-width:900px){.lhero{grid-template-columns:1fr 1.05fr}}
.lhero__title{margin:14px 0 0;font-family:var(--caps);font-weight:400;font-size:clamp(2.6rem,7vw,4.6rem);line-height:1.04;letter-spacing:.01em}
.lhero__ja{display:inline-block;font-size:1.25em;margin-left:.15em;vertical-align:-.12em}
.lhero .lead{margin:22px 0 0;max-width:44ch}
.lhero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.lhero__note{margin:18px 0 0;font-size:.98rem;color:var(--soft)}
.lhero__phones{position:relative;height:clamp(420px,52vw,620px)}
.phone{position:absolute;top:50%;left:50%;width:clamp(170px,19vw,250px);aspect-ratio:390/844;border-radius:30px;overflow:hidden;border:7px solid #1f211f;background:#1f211f;box-shadow:0 30px 60px -20px rgba(30,30,25,.45)}
.phone img{width:100%;height:100%;object-fit:cover;display:block}
.phone--b{transform:translate(-50%,-50%);z-index:2}
.phone--a{transform:translate(-118%,-46%) rotate(-7deg)}
.phone--c{transform:translate(18%,-46%) rotate(7deg)}
@media(prefers-reduced-motion:no-preference){
  .phone{animation:rise 1.1s cubic-bezier(.2,.8,.2,1) backwards}
  .phone--a{animation-delay:.15s}.phone--c{animation-delay:.3s}
}
@keyframes rise{from{opacity:0;margin-top:40px}}

/* Features */
.feat__list{list-style:none;margin:0;padding:0;display:grid;gap:clamp(26px,4vw,40px)}
@media(min-width:800px){.feat__list{grid-template-columns:1fr 1fr;column-gap:64px}}
.feat__list li{display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:start;padding-top:22px;border-top:1px solid var(--line)}
.ficon{width:52px;height:52px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.feat__list b{font-family:var(--caps);font-weight:400;font-size:1.25rem;letter-spacing:.03em}
.feat__list p{margin:6px 0 0;color:var(--soft)}

/* Konfigurator */
.conf{background:var(--paper);border-radius:28px;max-width:calc(var(--max) + 0px)!important;margin:0 auto!important}
@media(min-width:1192px){.conf{padding-inline:48px!important}}
.conf__grid{display:grid;gap:36px;align-items:start}
@media(min-width:900px){.conf__grid{grid-template-columns:1fr 380px;gap:56px}}
.conf__controls{display:grid;gap:26px}
.conf__label{margin:0 0 10px;font-family:var(--caps);text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;color:var(--soft)}
.conf__desc{margin:10px 0 0;font-size:.98rem;color:var(--soft)}
.conf__desc--center{text-align:center}
.seg3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:4px}
.seg3 label{position:relative;cursor:pointer}
.seg3 input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg3 span{display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 8px;border-radius:999px;text-align:center;font-size:.98rem;line-height:1.15;transition:background-color .2s,color .2s}
.seg3 input:checked+span{background:var(--ink);color:var(--bg)}
.seg3 input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.swatch{position:relative;cursor:pointer}
.swatch input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.swatch>span:last-child{display:block;text-align:center;font-size:.86rem;color:var(--soft);margin-top:4px}
.swatch__dots{display:flex;padding:6px;border-radius:999px;border:1.5px solid var(--line);background:#fff;transition:border-color .2s}
.swatch__dots i{width:26px;height:26px;border-radius:50%;margin-left:-6px;border:2px solid #fff}
.swatch__dots i:first-child{margin-left:0}
.swatch input:checked+.swatch__dots{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.swatch input:focus-visible+.swatch__dots{outline:2px solid var(--gold);outline-offset:2px}
.conf__custom{margin-top:12px}
.conf__custom summary{cursor:pointer;font-size:.98rem;color:var(--soft)}
.pickers{display:flex;flex-wrap:wrap;gap:16px;margin-top:12px}
.pickers label{display:flex;align-items:center;gap:8px;font-size:.98rem;cursor:pointer}
.toggles{display:grid;gap:4px}
@media(min-width:560px){.toggles{grid-template-columns:1fr 1fr;column-gap:20px}}
.tgl{display:flex;align-items:center;gap:12px;cursor:pointer;padding:7px 0;font-size:1rem;line-height:1.3}
.tgl input{position:absolute;opacity:0;width:1px;height:1px}
.tgl__track{flex:none;width:42px;height:24px;border-radius:999px;background:#cfc9c3;position:relative;transition:background-color .2s}
.tgl__track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.tgl input:checked+.tgl__track{background:var(--ink)}
.tgl input:checked+.tgl__track::after{transform:translateX(18px)}
.tgl input:focus-visible+.tgl__track{outline:2px solid var(--gold);outline-offset:2px}
.conf__preview{display:flex;flex-direction:column;align-items:center;position:sticky;top:90px}
.device{--s:.88;width:calc(390px * var(--s) + 16px);height:calc(844px * var(--s) + 16px);border-radius:44px;background:#1f211f;padding:8px;box-shadow:0 40px 80px -30px rgba(30,30,25,.5);overflow:hidden}
.device iframe{width:390px;height:844px;border:0;border-radius:36px;transform:scale(var(--s));transform-origin:0 0;background:#fff;display:block}
@media(max-width:420px){.device{--s:.76}}
.conf__hint{margin:14px 0 0;font-size:.95rem;color:var(--soft);text-align:center;max-width:32ch}
@media(max-width:899px){.conf__preview{position:static;order:-1}}

/* Gästeliste */
.guests{display:grid;gap:40px;align-items:center}
@media(min-width:900px){.guests{grid-template-columns:1fr 1fr;gap:70px}}
.guests p{color:var(--soft);max-width:48ch}
.ticks{list-style:none;padding:0;margin:18px 0 26px;display:grid;gap:8px}
.ticks li{padding-left:28px;position:relative}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:12px;height:7px;border-left:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg)}
.sheet{background:#fff;border-radius:22px;padding:26px;box-shadow:0 30px 60px -30px rgba(30,30,25,.35);display:grid;gap:12px;transform:rotate(-1.5deg)}
.sheet__row{display:grid;grid-template-columns:repeat(3,1fr);font-family:var(--caps);font-size:2.6rem;line-height:1}
.sheet__labels{display:grid;grid-template-columns:repeat(3,1fr);font-family:var(--caps);text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:var(--soft);margin-top:-6px}
.sheet__line{padding:12px 14px;border-radius:12px;background:var(--paper);font-size:1rem}
.sheet__line--warn{background:#fbf3e3}

/* So geht's */
.how__steps{list-style:none;margin:0;padding:0;display:grid;gap:22px}
@media(min-width:860px){.how__steps{grid-template-columns:repeat(3,1fr);gap:40px}}
.how__steps li{display:grid;gap:8px;align-content:start}
.how__no{font-family:var(--script);font-size:3.6rem;line-height:1;color:var(--gold)}
.how__steps b{font-family:var(--caps);font-weight:400;font-size:1.25rem;letter-spacing:.03em}
.how__steps p{margin:0;color:var(--soft)}

/* WeMarried */
.after{max-width:none!important;background:var(--sage);color:#fff;text-align:center}
.after__inner{max-width:640px;margin:0 auto}
.after__title{margin:6px 0 16px;font-family:var(--caps);font-weight:400;font-size:clamp(2.2rem,6vw,3.4rem);letter-spacing:.06em;text-transform:uppercase}
.after__title .script{display:inline;color:#fff;text-transform:none;letter-spacing:.02em;font-size:1.3em;margin-left:.1em}
.after p{color:rgba(255,255,255,.88);margin:0 0 28px}

/* Preise */
.price__grid{display:grid;gap:18px;max-width:860px;margin:0 auto}
@media(min-width:760px){.price__grid{grid-template-columns:1.15fr 1fr;align-items:start}}
.pcard{background:#fff;border-radius:24px;padding:30px;border:1.5px solid var(--line)}
.pcard--main{border-color:var(--ink)}
.pcard__name{margin:0;font-family:var(--caps);text-transform:uppercase;letter-spacing:.18em;font-size:.82rem;color:var(--soft)}
.pcard__price{margin:6px 0 0;font-family:var(--caps);font-size:2.4rem}

/* FAQ */
.faq__list{max-width:760px;margin:0 auto;display:grid;gap:10px}
.faq details{background:#fff;border-radius:16px;padding:4px 20px}
.faq summary{cursor:pointer;padding:14px 0;font-size:1.1rem;list-style:none;position:relative;padding-right:30px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:10px;font-size:1.5rem;color:var(--soft);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 16px;color:var(--soft)}

.final{text-align:center}
.final__ja{font-size:5rem;margin:0;line-height:1}
.final__title{margin:6px 0 26px;font-family:var(--caps);font-weight:400;font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:.03em}
.final .hint{margin-top:18px}
