/* Hauptnavigation, 16.09.2026. Scoped to six editorial pages. */
body.ta-editorial main { font-weight:300; }
body.ta-editorial main strong { font-weight:600; }
.ta-editorial .hero { background:linear-gradient(125deg,#fff 0%,#f7f5f3 65%,#f9eef0 100%); min-height:0; color:var(--text); border-bottom:1px solid var(--border); }
.ta-editorial .hero::before,.ta-editorial .hero__overlay { display:none; }
.ta-editorial .hero > .wrap { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:center; gap:clamp(2rem,5vw,5rem); padding-block:clamp(3rem,6vw,5rem); }
.ta-editorial .hero__content { max-width:none; color:var(--text); }
.ta-editorial .hero__content h1 { color:var(--text); font-size:clamp(2rem,3.35vw,3.15rem); font-weight:300; line-height:1.12; letter-spacing:-.035em; text-wrap:balance; }
.ta-editorial .hero__content p { color:var(--text); font-size:1.1rem; font-weight:300; line-height:1.75; }
.ta-editorial .hero__content p.hero__trust { color:var(--muted); font-size:.84rem; }
.ta-editorial .hero__actions .btn--white { color:var(--text); background:#ffffffab; border:1px solid #abb2bb; }
.ta-editorial .hero__actions .btn--white:hover { background:#fff; border-color:var(--primary); }
.ta-eyebrow { display:block; font-size:.76rem; font-weight:600; letter-spacing:.11em; text-transform:uppercase; color:var(--primary); margin-bottom:1.25rem; }
.ta-hero-art { position:relative; min-width:0; margin:0; }
.ta-hero-art--photo { border-radius:8px; overflow:hidden; box-shadow:0 18px 45px #37405112; }
.ta-hero-art--photo img { display:block; width:100%; height:clamp(300px,33vw,470px); object-fit:cover; }
.ta-hero-art--diagram { padding:2rem 0; border-block:1px solid #37405120; }
.ta-hero-art svg { display:block; width:100%; height:auto; overflow:visible; }
.ta-hero-art text { font-family:inherit; fill:var(--text); }
.ta-hero-art figcaption { margin-top:1.7rem; font-size:.82rem; color:var(--muted); text-align:center; letter-spacing:.035em; }
.ta-page-index .hero--home { background-image:url(../img/hero_telefonansagen_startseite.webp); background-position:center 30%; background-size:cover; }
.ta-page-index .hero--home::before { display:block; background:linear-gradient(90deg,#fffffffa 0%,#fffffff0 40%,#ffffffb0 58%,#ffffff08 100%); }
.ta-page-index .hero--home > .wrap { display:block; }
.ta-page-index .hero--home .hero__content { max-width:42rem; }
@media(max-width:700px) { .ta-page-index .hero--home::before { background:linear-gradient(90deg,#fffffff5,#ffffffd9); } }
.ta-hero-art .ta-wave-bar { transform-box:fill-box; transform-origin:center; animation:ta-wave 3.5s ease-in-out 1 both; animation-delay:calc(var(--i)*35ms); }
.ta-art-line { stroke-dasharray:500; stroke-dashoffset:500; animation:ta-draw 1.5s cubic-bezier(.22,1,.36,1) .25s forwards; }
.ta-art-layer { animation:ta-enter .85s cubic-bezier(.22,1,.36,1) both; }
.ta-art-layer:nth-child(2) { animation-delay:.15s; }
.ta-art-layer:nth-child(3) { animation-delay:.3s; }
.ta-page-nav { border-bottom:1px solid var(--border); background:#fff; }
.ta-page-nav .wrap { display:flex; gap:.5rem; overflow:auto; padding-block:1rem; scrollbar-width:thin; }
.ta-page-nav a { flex:0 0 auto; font-size:.86rem; padding:.55rem 1rem; border:1px solid var(--border); border-radius:99px; color:var(--text); transition:color .2s,border-color .2s; }
.ta-page-nav a:hover { border-color:var(--primary); color:var(--primary); }
.ta-editorial .section--surface { background:#f5f6f7; }
.ta-editorial .section { padding-block:clamp(3.5rem,6vw,5.75rem); }
.ta-editorial .section--sm { padding-block:1.75rem; }
.ta-editorial .section h2 { font-weight:300; }
.ta-editorial .border-grid--spaced .border-grid__item { padding:1.65rem!important; border:1px solid var(--border)!important; border-radius:8px; background:linear-gradient(145deg,#fff,#f6f6f5); }
.ta-editorial .template-item { padding:1.6rem; border:1px solid var(--border); border-radius:8px; background:linear-gradient(145deg,#fff,#faf6f4); }
.ta-editorial .template-item__cat { font-size:.78rem; letter-spacing:.05em; margin-bottom:1rem; }
.ta-editorial .template-item__text { line-height:1.8; }
.ta-panorama { margin:0 auto; max-width:1600px; overflow:hidden; }
.ta-panorama img { display:block; width:100%; height:clamp(230px,28vw,430px); object-fit:cover; }
.ta-guide { background:linear-gradient(145deg,#fff,#f7f5f3); }
.ta-guide__grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2rem,6vw,6rem); align-items:start; }
.ta-guide__intro h2 { font-size:clamp(1.8rem,2.7vw,2.5rem); line-height:1.15; max-width:21ch; margin-bottom:1.4rem; }
.ta-guide__intro p { color:var(--muted); line-height:1.8; font-size:1.05rem; }
.ta-guide__chapters { border-top:1px solid #cbd1d8; }
.ta-guide details { border-bottom:1px solid #cbd1d8; }
.ta-guide summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.3rem 0; cursor:pointer; font-size:1.12rem; font-weight:500; list-style:none; }
.ta-guide summary::-webkit-details-marker { display:none; }
.ta-guide summary::after { content:'+'; font-weight:300; color:var(--primary); font-size:1.5rem; }
.ta-guide details[open] summary::after { content:'−'; }
.ta-guide details p { margin:0 0 1.3rem; font-size:1rem; line-height:1.8; max-width:65ch; }
.ta-guide details a { color:var(--primary); text-decoration:underline; text-underline-offset:.2em; }
.ta-editorial a:focus-visible,.ta-guide summary:focus-visible { outline:2px solid var(--primary); outline-offset:5px; }
.ta-editorial .toc__list a { border-radius:99px; }
@keyframes ta-wave { 0%,100%{transform:scaleY(1)} 35%{transform:scaleY(.65)} 70%{transform:scaleY(1.08)} }
@keyframes ta-draw { to{stroke-dashoffset:0} }
@keyframes ta-enter { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@media(max-width:900px) { .ta-editorial .hero > .wrap { grid-template-columns:1fr; gap:2.5rem; } .ta-hero-art { width:100%; max-width:650px; margin:auto; } .ta-hero-art--photo img { height:300px; } .ta-hero-art--diagram { max-width:500px; padding:1.5rem 0; } .ta-guide__grid { grid-template-columns:1fr; gap:1.7rem; } .ta-guide__intro h2 { max-width:30ch; } }
@media(max-width:500px) { .ta-editorial .hero__content h1 { font-size:2.1rem; } .ta-hero-art--photo img { height:240px; } .ta-editorial .hero__actions { align-items:stretch; } .ta-editorial .hero__actions .btn { flex:1 1 100%; } .ta-editorial .border-grid--spaced .border-grid__item { padding:1.3rem!important; } }
@media(prefers-reduced-motion:reduce) { .ta-hero-art *, .ta-page-nav a { animation:none!important; transition:none!important; } .ta-art-line { stroke-dashoffset:0; } }

/* Music shares the animated hero family while retaining its catalogue design. */
body.page-musik .hero--musik.hero--musik { background:linear-gradient(125deg,#fff,#f7f5f3 65%,#f9eef0); border-bottom:1px solid var(--border); }
body.page-musik .mk-hero-grid { grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:clamp(2rem,5vw,5rem); }
body.page-musik .hero__content h1 { font-size:clamp(2rem,3.35vw,3.15rem); font-weight:300; line-height:1.12; letter-spacing:-.035em; }
body.page-musik .hero .wrap { padding-block:clamp(3rem,6vw,5rem); }
@media(max-width:900px) { body.page-musik .mk-hero-grid { grid-template-columns:1fr; gap:2.5rem; } }
@media(max-width:500px) { body.page-musik .hero__content h1 { font-size:2.1rem; } }

/* Startseite: ausschließlich Hero angepasst, Preise in den Buttons erhalten. */
.ta-page-index .hero--home { background-image:url(../img/hero_telefonansagen_startseite.webp); background-position:center 30%; }
.ta-page-index .hero--home::before { background:linear-gradient(90deg,#fffffffa 0%,#fffffff0 40%,#ffffffb0 58%,#ffffff08 100%); }
.ta-page-index .hero--home > .wrap { padding-block:clamp(3.25rem,5vw,5rem); }
.ta-page-index .hero--home .hero__content { max-width:39rem; }
.ta-page-index .hero--home .hero__content h1 { font-size:clamp(2.4rem,3.5vw,3.3rem); line-height:1.12; margin-bottom:1.5rem; text-wrap:initial; }
.ta-page-index .hero--home .hero__content > p:not(.hero__trust) { max-width:48ch; font-size:1.1rem; }
.ta-page-index .hero--home .hero__actions { margin-top:1.75rem; gap:.9rem; }
.ta-page-index .hero--home .hero__actions .btn { display:flex; flex-direction:column; align-items:flex-start; gap:.25rem; padding:.85rem 1.3rem; font-size:.95rem; }
.ta-page-index .hero--home .hero__actions .btn::after { content:none; }
.ta-page-index .hero--home .hero__actions small { font-size:.76rem; font-weight:300; opacity:.85; }
.ta-page-index #ansagearten .border-grid--spaced .border-grid__item { padding:1.4rem 0 0!important; border:0!important; border-top:1px solid var(--border)!important; border-radius:0; background:transparent; }
@media(max-width:500px) {
 .ta-page-index .hero--home .hero__content h1 { font-size:2.35rem; }
 .ta-page-index .hero--home::before { background:linear-gradient(90deg,#fffffff0,#ffffffbf); }
 .ta-page-index .hero--home .hero__actions .btn { flex:1 1 0; min-width:0; padding:.85rem 1rem; }
}
/* Bild bereits im Einstieg, Animationen bleiben als gemeinsame Formsprache. */
.ta-editorial:not(.ta-page-index) .hero > .wrap { padding-block:clamp(2.5rem,4.5vw,4.25rem); }
.ta-editorial:not(.ta-page-index) .hero__content h1 { font-size:clamp(2.2rem,3.5vw,3.25rem); line-height:1.1; text-wrap:initial; }
.ta-editorial:not(.ta-page-index) .hero__content > p { max-width:37ch; font-size:1.05rem; }
.ta-editorial:not(.ta-page-index) .ta-hero-art--diagram { width:100%; padding:1rem 0; border:0; max-width:460px; justify-self:end; }
.ta-editorial:not(.ta-page-index) .ta-hero-art figcaption { margin-top:1rem; }
.ta-panorama--intro { max-width:none; }
.ta-panorama--intro img { height:clamp(190px,20vw,310px); object-position:center 52%; }
.ta-intro-details { max-width:66ch; margin:0 0 2.5rem; color:var(--muted); font-size:1.05rem; line-height:1.8; }
.ta-intro-details__trust { font-size:.84rem; margin-top:1rem; }
@media(max-width:900px) {
 .ta-editorial:not(.ta-page-index) .hero > .wrap { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:1.5rem; }
}
@media(max-width:600px) {
 .ta-editorial:not(.ta-page-index) .hero > .wrap { grid-template-columns:1fr; gap:1.25rem; padding-block:2.4rem 1.5rem; }
 .ta-editorial:not(.ta-page-index) .ta-hero-art--diagram { max-width:240px; padding:.25rem 0; justify-self:center; }
 .ta-editorial:not(.ta-page-index) .ta-hero-art figcaption { font-size:.72rem; margin-top:.35rem; }
 .ta-panorama--intro img { height:190px; }
}

/* Foto und Animation bilden gemeinsam die rechte Hero-Komposition. */
.ta-hero-visual { position:relative; width:100%; max-width:510px; padding-bottom:100px; justify-self:end; }
.ta-hero-visual__photo { display:block; width:100%; height:300px; object-fit:cover; object-position:center; border-radius:12px; }
.ta-editorial:not(.ta-page-index) .ta-hero-visual .ta-hero-art--diagram { position:absolute; bottom:0; right:22px; width:calc(100% - 44px); max-width:none; padding:1rem 1.5rem .85rem; border:1px solid #ffffffd9; border-radius:10px; background:#ffffffef; box-shadow:0 12px 35px #3740510c; }
.ta-hero-visual .ta-hero-art svg { height:140px; }
.ta-editorial:not(.ta-page-index) .ta-hero-visual .ta-hero-art figcaption { margin-top:.3rem; font-size:.76rem; }
.ta-page-sprecher .ta-hero-visual .ta-hero-art svg { height:105px; }
@media(min-width:901px) { .ta-editorial:not(.ta-page-index) .hero > .wrap { padding-block:3.75rem; } }
@media(max-width:900px) { .ta-hero-visual { padding-bottom:70px; } .ta-hero-visual__photo { height:245px; } .ta-hero-visual .ta-hero-art svg { height:105px; } .ta-editorial:not(.ta-page-index) .ta-hero-visual .ta-hero-art--diagram { right:10px; width:calc(100% - 20px); padding:.75rem; } }
@media(max-width:600px) { .ta-hero-visual { max-width:440px; justify-self:center; margin-top:.75rem; } .ta-hero-visual__photo { height:215px; } .ta-hero-visual .ta-hero-art svg { height:100px; } .ta-page-sprecher .ta-hero-visual .ta-hero-art svg { height:85px; } }
