/* Nur Startseite – übertragen aus Entwurf-Startseite-aktuell.html */

section { padding:84px 0; }
.sec-title { font-size:40px; line-height:1.15; margin:18px 0 34px; }
.k { font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--muted); margin:0 0 10px; }

.photo { border-radius:18px; background:linear-gradient(160deg,#cdb994,#a98f68); position:relative; display:flex; align-items:flex-end; overflow:hidden; }
.photo::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 14px,transparent 14px 28px); }
.photo.real::before { display:none; }

/* Kopfbild */
.hero2 { position:relative; display:flex; align-items:center; overflow:hidden; background:#23170e; }
.hero2 .scene-bg { position:absolute; left:30%; top:-30px; width:92%; height:auto; }
.hero2::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(20,13,8,.8) 0%,rgba(20,13,8,.45) 40%,rgba(20,13,8,0) 70%); }
.hero2 .in { z-index:2; position:relative; width:100%; display:grid; grid-template-columns:1.45fr 1fr; gap:44px; align-items:center; padding:64px 64px 64px 96px; }
.hero2 .eb { color:#f4ede1; font-size:15px; letter-spacing:.08em; font-weight:500; }
.hero2 h1 { color:#fbf7f0; font-size:60px; line-height:1.08; font-weight:500; margin:18px 0 26px; }
.hero2 h1 em { color:#8fd8b4; font-style:italic; }
.hero2 .lead { font-family:var(--serif); color:#efe6d6; font-size:22px; line-height:1.45; max-width:620px; }
.hero2 .lead.goal2 { font-style:italic; color:#f6dcb3; font-size:23px; line-height:1.45; margin:0 0 10px; }
.hero2 .lead.small { font-size:18px; color:#e6dccb; margin-top:16px; }
.hero2 .knopf { border:2px solid #cfe9dc; padding:16px 34px; font-size:18px; margin-top:16px; }
.hero2 .trust { display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:22px; font-size:14.5px; color:#e8dcc8; }
.hero2 .trust span::before { content:"✓"; color:#8fd8b4; margin-right:7px; }
.vid { display:block; text-decoration:none; color:inherit; margin-top:150px; background:#fbf8f2; border-radius:22px; padding:14px; box-shadow:0 18px 40px rgba(0,0,0,.35); }
.vid .scr { height:300px; border-radius:14px; background:linear-gradient(160deg,#6b4e36,#2e2219); position:relative; display:flex; align-items:center; justify-content:center; text-align:center; color:#f2e8d8; font-size:13.5px; line-height:1.45; padding:20px; }
.vid .bar { position:absolute; left:0; right:0; bottom:0; height:42px; background:#0b5e47; border-radius:0 0 14px 14px; display:flex; align-items:center; gap:12px; padding:0 14px; color:#fff; font-size:14px; }
.vid .bar i { flex:1; height:4px; background:rgba(255,255,255,.35); border-radius:2px; position:relative; }
.vid .bar i::after { content:""; position:absolute; left:0; top:0; bottom:0; width:35%; background:#fff; border-radius:2px; }
.vid .meta { display:flex; justify-content:space-between; padding:12px 6px 2px; font-size:15px; color:#2e261e; }
.vid .meta span { color:#8a7c6c; }
@media (max-width:900px) {
  .hero2 .in { grid-template-columns:1fr; padding:64px 28px; }
  .hero2 h1 { font-size:42px; }
}

/* Take 1 / Take 2 */
.bgT1A { background-image:url('/assets/img/szene-nachricht-take1.jpg'); }
.bgO2 { background-image:url('/assets/img/szene-abendessen-take1.jpg'); }
.bgO3 { background-image:url('/assets/img/szene-kollegin-take1.jpg'); }
.bgO4 { background-image:url('/assets/img/szene-kueche-take1.jpg'); }
.bgO5 { background-image:url('/assets/img/szene-bett-take1.jpg'); }
.bgK1 { background-image:url('/assets/img/szene-nachricht-take2.jpg'); }
.bgK2 { background-image:url('/assets/img/szene-abendessen-take2.jpg'); }
.bgK3 { background-image:url('/assets/img/szene-kollegin-take2.jpg'); }
.bgK4 { background-image:url('/assets/img/szene-kueche-take2.jpg'); }
.bgK5 { background-image:url('/assets/img/szene-bett-take2.jpg'); }
.takes { background:#f5efe4; padding:76px 0 60px; }
.takes .head { text-align:center; padding:0 24px; }
.takes .k { font-size:13px; letter-spacing:.32em; color:#8a6a3c; font-weight:600; }
.takes h2 { font-size:52px; line-height:1.08; margin:14px 0 8px; }
.takes .sub { font-family:var(--serif); font-size:26px; color:#2e261e; margin:0 0 34px; }
.tk-stage { position:relative; margin:0 36px; }
/* Ohne JavaScript stehen alle Szenen untereinander; ausgeblendet wird nur unter .js */
.js .tk-scene { position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; pointer-events:none; }
.js .tk-scene.on { position:relative; opacity:1; pointer-events:auto; }
html:not(.js) .tk-scene + .tk-scene { margin-top:20px; }
html:not(.js) .tk-arr, html:not(.js) .tk-tabs, html:not(.js) .tk-next { display:none; }
.tk-pair { display:grid; grid-template-columns:1fr 1fr; gap:3px; background:#f5efe4; border-radius:20px; overflow:hidden; position:relative; }
.tk-panel { position:relative; min-height:620px; background-color:#2a1c11; background-size:cover; background-position:center 22%; color:#fbf7f0; display:flex; flex-direction:column; padding:28px 30px 34px; }
.tk-panel::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(24,16,10,.3) 0%,rgba(24,16,10,.05) 25%,rgba(24,16,10,.35) 45%,rgba(24,16,10,.92) 72%); }
.tk-panel > * { position:relative; }
.tk-txt { margin-top:auto; padding-top:24px; max-width:460px; text-shadow:0 1px 8px rgba(20,12,6,.9), 0 0 2px rgba(20,12,6,.6); }
.tk-txt h3 { font-family:var(--serif); color:#fbf7f0; font-size:28px; line-height:1.2; margin:0 0 14px; }
.tk-txt p { font-family:var(--serif); color:#efe6d6; font-size:20px; line-height:1.45; margin:0; }
.tk-txt .q { font-family:var(--serif); color:#9fd9bd; font-size:20px; line-height:1.35; margin:0 0 12px; }
.tk-lbl { font-size:12px; letter-spacing:.2em; font-weight:600; color:#e2c48f; margin-bottom:12px; }
.tk-lbl.two { color:#9fd9bd; }
.tk-next { margin-top:26px; align-self:flex-start; background:#0b5e47; border:2px solid #cfe9dc; color:#fff; padding:12px 26px; border-radius:40px; font-weight:600; font-size:16px; cursor:pointer; font-family:inherit; }
.tk-mid { position:absolute; z-index:3; left:50%; top:50%; width:40px; height:40px; margin:-20px 0 0 -20px; border-radius:50%; background:transparent; color:#fbf7f0; display:none; align-items:center; justify-content:center; font-size:34px; opacity:.85; }
.tk-arr { position:absolute; z-index:4; top:50%; margin-top:-24px; width:48px; height:48px; border-radius:50%; border:2px solid #fbf7f0; background:rgba(30,26,21,.75); color:#fbf7f0; font-size:20px; cursor:pointer; }
.tk-arr.l { left:-24px; } .tk-arr.r { right:-24px; }
.tk-tabs { display:flex; justify-content:center; gap:54px; margin-top:34px; }
.tk-tabs button { background:none; border:0; cursor:pointer; font-family:var(--serif); font-size:19px; color:#5e5246; display:flex; flex-direction:column; align-items:center; gap:10px; padding:0 0 10px; border-bottom:2px solid transparent; }
.tk-tabs button i { font-style:normal; width:46px; height:46px; border-radius:50%; border:1.5px solid #5e5246; display:flex; align-items:center; justify-content:center; font-size:18px; }
.tk-tabs button.on { color:#1e1a15; border-color:#0b5e47; }
.tk-tabs button.on i { background:#0b5e47; border-color:#0b5e47; color:#fff; }

/* Handy-Ansicht der Szenen */
@media (max-width:760px) {
  .takes { padding:44px 0 36px; }
  .takes h2 { font-size:32px; }
  .takes .sub { font-size:19px; margin-bottom:22px; }
  .tk-wrap { display:flex; flex-direction:column; }
  .tk-stage { margin:0 14px; }
  .tk-pair { grid-template-columns:1fr; gap:0; border-radius:16px; }
  .tk-panel { min-height:400px; padding:20px 20px 24px; }
  .tk-txt h3 { font-size:24px; }
  .tk-mid { display:flex; position:relative; left:auto; top:auto; transform:rotate(90deg); }
  .tk-arr { display:none; }
  .tk-tabs { justify-content:flex-start; gap:10px; overflow-x:auto; margin:0 14px 18px; padding-bottom:4px; order:-1; }
  .tk-tabs button { flex-direction:row; font-size:15px; border:1.5px solid #cdbfa6; border-radius:30px; padding:6px 14px 6px 6px; white-space:nowrap; gap:8px; }
  .tk-tabs button i { width:28px; height:28px; font-size:14px; }
  .tk-tabs button.on { border-color:#0b5e47; }
}

/* Warum sich das wiederholt */
.dark { background:var(--forest); color:var(--forest-ink); }
.dark h2 { color:#f4ede1; }
.dark p { color:#d6d9cc; }
.pull { border-left:2px solid var(--caramel); padding:6px 0 6px 26px; margin:36px 0 0; font-family:var(--serif); font-style:italic; font-size:30px; line-height:1.3; color:#f4ede1; }
.pull small { display:block; font-family:var(--sans); font-style:normal; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:#b9c9bf; margin-top:14px; }
.band .wrap { max-width:1020px; }
.band p.t { color:#e6e2d6; font-size:19px; line-height:1.65; margin:0 0 16px; max-width:820px; }
.band .bridge { font-family:var(--serif); font-size:28px; line-height:1.35; color:#fbf7f0; margin:34px 0 0; max-width:820px; }
.band .noblame { font-family:var(--serif); font-size:24px; color:#9fd9bd; margin-top:34px; }

/* Über mich */
#ueber-mich { background:linear-gradient(180deg,#e6d9c2 0%,#cdb48c 100%); padding:64px 0; }
.um { max-width:1060px; margin:0 auto; background:#fff; border-radius:26px; padding:34px; box-shadow:0 10px 30px rgba(46,38,30,.12); display:grid; grid-template-columns:360px 1fr; grid-template-rows:auto 1fr; grid-template-areas:"bild text" "sobin text"; column-gap:48px; row-gap:0; align-items:start; }
/* Reihenfolge im HTML: Foto, Text, „So bin ich“; am Desktop stehen Foto und „So bin ich“ links */
.um-bild { grid-area:bild; aspect-ratio:3/4; border-radius:18px; background:url('/assets/img/jasmin-am-wasser.jpg') center top/cover; }
.um .sobin { grid-area:sobin; margin-top:22px; background:#faf6ee; border:1px solid var(--line); border-left:4px solid #0b5e47; border-radius:14px; padding:20px 22px; }
.um .sobin .eyebrow { display:block; color:#0b5e47; }
.um .sobin p { font-size:16px; line-height:1.6; margin:8px 0 0; color:var(--ink); }
.um .sobin p:first-of-type { font-family:'Newsreader',serif; font-size:21px; }
.um h2 { font-size:38px; line-height:1.15; margin:10px 0 20px; }
.um-text { grid-area:text; }
.um-text p { font-size:18px; line-height:1.7; color:var(--soft); margin:0 0 16px; }
.um-text b { color:var(--ink); }
.um-text .zitat { font-family:'Newsreader',serif; font-size:24px; line-height:1.4; color:#0b5e47; border-left:3px solid #0b5e47; padding-left:20px; margin:26px 0; }
@media (max-width:760px) {
  #ueber-mich { padding:32px 14px; }
  .um { grid-template-columns:1fr; grid-template-rows:none; grid-template-areas:"bild" "text" "sobin"; padding:20px; gap:24px; }
  .um .sobin { margin-top:0; }
  .um h2 { font-size:30px; }
}

/* Was Frauen erleben */
.quote { background:var(--sand); }
.bigq { font-family:var(--serif); font-size:32px; line-height:1.35; font-weight:300; }
.bigq em { color:var(--em); font-style:italic; }
.who { margin-top:20px; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--soft); }
.voices { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:40px; }
.voice { background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:28px 30px; }
.voice .k { font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:#0b5e47; margin-bottom:12px; }
.voice p { font-size:18px; color:var(--ink); line-height:1.6; margin:0 0 10px; }
.voice .big { font-family:var(--serif); font-size:30px; line-height:1.3; color:var(--ink); }
@media (max-width:760px) { .voices { grid-template-columns:1fr; } }

/* Bevor du buchst */
.faq2 { border-top:1px solid var(--line); }
.faq2 details { border-bottom:1px solid var(--line); }
.faq2 summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 4px; font-family:var(--serif); font-size:23px; color:var(--ink); }
.faq2 summary::-webkit-details-marker { display:none; }
.faq2 summary span::before { content:"+"; font-family:var(--sans); font-size:26px; color:#0b5e47; }
.faq2 details[open] summary span::before { content:"–"; }
.faq2 .ans { padding:0 4px 22px; max-width:720px; }
.faq2 .ans p { font-size:17.5px; }
.faq2 .ans em { font-family:var(--serif); color:#0b5e47; font-size:19px; }

/* Dein nächster Schritt */
.final { background:var(--forest); text-align:center; padding:96px 0; }
.final h2 { color:#f4ede1; font-size:44px; line-height:1.15; max-width:700px; margin:18px auto 22px; }
.final p { color:#d6d9cc; max-width:560px; margin:0 auto 32px; }
.final .final-goal { font-family:var(--serif); font-style:italic; font-size:22px; line-height:1.5; color:#f6dcb3; max-width:640px; margin:0 auto 22px; }
.final .knopf { padding:15px 28px; }

.hinweis { padding:18px 36px; font-size:13px; color:var(--soft); background:var(--bg); border-top:1px solid var(--line); }
@media (max-width:760px) { .hinweis { padding:18px 20px; } }