/* AstroGroup Startseite · Desktop-Stylesheet
   Gilt für alle Bildschirmbreiten. Mobile Anpassungen stehen in mobile.css (bis 899 px). */

/* Basis */
body     { margin: 0; background: #FFFFFF; color: #2F2F33; font-family: "Open Sans", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a        { color: inherit; text-decoration: none; }
a:hover  { color: #A3449B; }
*        { box-sizing: border-box; }

/* Animationen */
@keyframes ag-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

/* Komponenten */
.box-1    { background-color: #FFFFFF; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; position: relative; overflow-x: clip; }
.box-2    { height: 5px; background: #A3449B; }
.box-3    { display: block; }
.sec-1    { position: relative; min-height: min(78vh, 760px); display: flex; flex-direction: column; background: #F4EEE9; }
.img-1    { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 65% 25%; }
.box-4    { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.8) max(28%, 480px), rgba(255, 255, 255, 0) max(52%, 700px)); pointer-events: none; }
.box-5    { position: absolute; inset: auto 0 0; height: 28%; background: linear-gradient(0deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0)); pointer-events: none; }
.hdr-1    { position: relative; z-index: 5; max-width: 1320px; width: 100%; margin: 0 auto; padding: 24px clamp(20px, 4vw, 56px); display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }
.lnk-1    { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.txt-1    { font-size: 30px; font-weight: 300; letter-spacing: -0.01em; line-height: 1; }
.txt-2    { color: #A3449B; font-weight: 400; }
.txt-3    { color: #5A5A60; }
.nav-1    { display: flex; align-items: center; gap: 4px; padding: 6px; border-radius: 12px; background: rgba(255, 255, 255, 0.7); border: 1px solid #ECE6EB; backdrop-filter: blur(14px); box-shadow: rgba(94, 31, 90, 0.06) 0 6px 24px; font-size: 15px; flex-wrap: wrap; }
.lnk-2    { padding: 9px 16px; border-radius: 8px; color: #A3449B; background: #F8EEF7; font-weight: 600; }
.lnk-3    { padding: 9px 16px; border-radius: 8px; color: #46464C; background: transparent; font-weight: 400; }
.lnk-4    { padding: 9px 18px; border-radius: 8px; background: #A3449B; color: #FFFFFF; font-weight: 600; }
.box-6    { position: relative; z-index: 4; flex: 1 1 0%; max-width: 1320px; width: 100%; margin: 0 auto; padding: clamp(32px, 5vw, 72px) clamp(20px, 4vw, 56px) 0; display: flex; align-items: center; }
.box-7    { max-width: min(620px, 100%); }
.box-8    { display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px 7px 8px; border-radius: 999px; background: #FFFFFF; border: 1px solid #EAD6E8; box-shadow: rgba(163, 68, 155, 0.08) 0 4px 16px; font-size: 13px; font-weight: 600; color: #A3449B; }
.txt-4    { background: #A3449B; color: #FFFFFF; border-radius: 999px; padding: 2px 9px; font-size: 12px; }
.ttl-1    { font-weight: 600; font-size: clamp(44px, 5.6vw, 84px); line-height: 1.04; letter-spacing: -0.03em; margin: 24px 0 0; color: #1F1F23; }
.txt-5    { color: #A3449B; }
.par-1    { font-size: clamp(17px, 1.4vw, 19px); line-height: 1.7; color: #5A5A62; max-width: 46ch; margin: 28px 0 0; text-wrap: pretty; }
.box-9    { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 40px; }
.lnk-5    { padding: 16px 28px; border-radius: 10px; background: #A3449B; color: #FFFFFF; font-weight: 600; box-shadow: rgba(163, 68, 155, 0.3) 0 12px 30px; }
.lnk-6    { padding: 16px 28px; border-radius: 10px; background: #FFFFFF; border: 1px solid #E2D5E1; font-weight: 600; color: #2F2F33; }
.box-10   { position: relative; z-index: 6; max-width: 1320px; width: 100%; margin: 0 auto; padding: 28px clamp(20px, 4vw, 56px) 36px; }
.box-11   { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); border-radius: 14px; background: rgba(255, 255, 255, 0.75); border: 1px solid #ECE4EB; backdrop-filter: blur(18px); box-shadow: rgba(94, 31, 90, 0.1) 0 24px 60px; overflow: hidden; }
.box-12   { padding: 14px 22px; }
.box-13   { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #6B6B73; }
.txt-6    { width: 7px; height: 7px; border-radius: 50%; background: #3FBF7F; animation: 1.8s ease 0s infinite normal none running ag-pulse; }
.box-14   { font-size: clamp(22px, 2vw, 30px); font-weight: 300; margin-top: 2px; color: #2A2A2E; font-variant-numeric: tabular-nums; }
.box-15   { font-size: 11px; color: #8A8A92; margin-top: 2px; }
.box-16   { padding: 14px 22px; border-left: 1px solid #EFE8EE; }
.box-17   { font-size: 13px; color: #6B6B73; }
.box-18   { font-size: clamp(22px, 2vw, 30px); font-weight: 300; margin-top: 2px; color: #2A2A2E; }
.box-19   { padding: 14px 22px; border-left: 1px solid #EFE8EE; background: #A3449B; color: #FFFFFF; }
.box-20   { font-size: 13px; color: #F6DDF3; }
.box-21   { font-size: clamp(22px, 2vw, 30px); font-weight: 300; margin-top: 2px; }
.box-22   { font-size: 11px; color: #F6DDF3; margin-top: 2px; }
.box-23   { position: relative; border-top: 1px solid #EFE8EE; border-bottom: 1px solid #EFE8EE; background: #FFFFFF; overflow: hidden; padding: 20px 0; }
.box-24   { display: flex; gap: 48px; width: max-content; will-change: transform; }
.txt-7    { display: flex; align-items: center; gap: 48px; font-size: 22px; font-weight: 300; color: #46464C; white-space: nowrap; }
.txt-8    { color: #A3449B; font-size: 13px; }
.sec-2    { background-color: #F1EFF1; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; background-position: 110px 60px; }
.box-25   { max-width: 1320px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 4vw, 56px); }
.box-26   { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin-bottom: 48px; }
.box-27   { font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #A3449B; }
.ttl-2    { font-weight: 300; font-size: clamp(36px, 4.4vw, 58px); line-height: 1.08; letter-spacing: -0.03em; margin: 14px 0 0; color: #2A2A2E; }
.txt-9    { font-weight: 600; }
.par-2    { font-size: 16px; line-height: 1.7; color: #5A5A62; max-width: 46ch; margin: 0; }
.box-28   { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 22px; }
.lnk-7    { display: block; border-radius: 14px; background: #FFFFFF; border: 1px solid #E8E4E8; box-shadow: rgba(40, 20, 40, 0.06) 0 10px 30px; overflow: hidden; transition: transform 0.4s, box-shadow 0.4s, border-color 0.4s; }
.box-29   { display: flex; align-items: center; gap: 6px; padding: 10px 12px; border-bottom: 1px solid #EFEBEF; background: #FAFAFB; }
.txt-10   { width: 8px; height: 8px; border-radius: 50%; background: #E6DDE5; }
.txt-11   { flex: 1 1 0%; margin-left: 8px; padding: 3px 10px; border-radius: 6px; background: #FFFFFF; border: 1px solid #EFEBEF; font-size: 11px; color: #8A8A92; }
.box-30   { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #F3EAF2; }
.box-31   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/tarotpolis.jpg"); }
.box-32   { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; }
.txt-12   { font-size: 18px; font-weight: 600; color: #2A2A2E; }
.txt-13   { width: 32px; height: 32px; border-radius: 50%; background: #F8EEF7; color: #A3449B; display: grid; place-items: center; font-size: 14px; }
.box-33   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/tarotversum.jpg"); }
.box-34   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/viatarot.jpg"); }
.box-35   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/spiritane.jpg"); }
.box-36   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/pangeca.jpg"); }
.box-37   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/seekhana.jpg"); }
.box-38   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/livanea.jpg"); }
.box-39   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/astrovidere.jpg"); }
.box-40   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/astrorubina.jpg"); }
.box-41   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/7heaven-life.jpg"); }
.box-42   { position: absolute; inset: 0; }
.box-43   { position: absolute; inset: 0; background: linear-gradient(160deg, #FFFFFF, #F8EEF7); display: grid; place-items: center; padding: 18%; }
.txt-14   { font-size: clamp(26px, 3vw, 36px); font-weight: 300; color: #2A2A2E; letter-spacing: -0.01em; }
.box-44   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/esolita.jpg"); }
.box-45   { position: absolute; inset: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("https://www.astrogroup.de/files/img/astroase.jpg"); }
.sec-3    { position: relative; background-color: #FFFFFF; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; border-bottom: 1px solid #EFEBEF; }
.box-46   { max-width: 1320px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 4vw, 56px) 0; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.box-47   { display: flex; gap: 10px; }
.btn-1    { width: 48px; height: 48px; border-radius: 50%; border: 1px solid #E2D5E1; background: #FFFFFF; color: #A3449B; font-size: 18px; cursor: pointer; }
.btn-2    { width: 48px; height: 48px; border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: #A3449B; color: #FFFFFF; font-size: 18px; cursor: pointer; }
.box-48   { overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; scroll-padding-left: max(clamp(20px, 4vw, 56px), 50% - 604px); padding: 56px 0 clamp(72px, 9vw, 120px); }
.box-49   { position: relative; display: flex; gap: 20px; width: max-content; padding: 0 max(clamp(20px, 4vw, 56px), -604px + 50vw); }
.box-50   { position: absolute; left: 0; right: 0; top: 27px; height: 2px; background: linear-gradient(90deg, #F3E4F1, #A3449B 50%, #F3E4F1); }
.box-51   { position: relative; width: 280px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 22px; }
.txt-15   { width: 56px; height: 56px; border-radius: 50%; background: #FFFFFF; border: 2px solid #A3449B; box-shadow: #FFFFFF 0 0 0 8px; }
.box-52   { padding: 24px; border-radius: 16px; background: #FFFFFF; border: 1px solid #ECE6EB; box-shadow: rgba(94, 31, 90, 0.08) 0 14px 40px; flex: 1 1 0%; display: flex; flex-direction: column; gap: 10px; }
.box-53   { font-size: 40px; font-weight: 300; letter-spacing: -0.03em; color: #A3449B; line-height: 1; }
.box-54   { align-self: flex-start; padding: 4px 10px; border-radius: 999px; background: #F8EEF7; color: #8A3483; font-size: 12px; font-weight: 600; }
.box-55   { font-size: 19px; font-weight: 600; color: #2A2A2E; }
.par-3    { font-size: 15px; line-height: 1.55; color: #5A5A62; margin: 0; }
.txt-16   { width: 56px; height: 56px; border-radius: 50%; background: #A3449B; color: #FFFFFF; display: grid; place-items: center; font-size: 20px; box-shadow: #FFFFFF 0 0 0 8px, rgba(163, 68, 155, 0.35) 0 10px 30px; }
.box-56   { position: relative; width: 340px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 22px; }
.txt-17   { width: 56px; height: 56px; border-radius: 50%; background: #3FBF7F; color: #FFFFFF; display: grid; place-items: center; font-size: 12px; font-weight: 700; box-shadow: #FFFFFF 0 0 0 8px, rgba(63, 191, 127, 0.35) 0 10px 30px; }
.box-57   { padding: 26px; border-radius: 16px; background: linear-gradient(160deg, #B24FA9, #7A2A73); color: #FFFFFF; box-shadow: rgba(94, 31, 90, 0.3) 0 20px 50px; flex: 1 1 0%; }
.box-58   { font-size: 40px; font-weight: 300; letter-spacing: -0.03em; }
.box-59   { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.box-60   { font-size: 26px; font-weight: 300; }
.box-61   { grid-column: span 2; }
.box-62   { font-size: 26px; font-weight: 300; font-variant-numeric: tabular-nums; }
.box-63   { background-color: #F1EFF1; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; }
.box-64   { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 48px; align-items: start; }
.box-65   { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.txt-18   { padding: 8px 16px; border-radius: 999px; background: #F8EEF7; color: #8A3483; font-size: 14px; font-weight: 600; }
.box-66   { display: grid; gap: 14px; }
.box-67   { display: grid; grid-template-columns: clamp(110px, 14vw, 160px) minmax(0, 1fr); gap: 22px; align-items: center; padding: 14px; border-radius: 16px; border: 1px solid #ECE6EB; background: #FFFFFF; transition: border-color 0.3s, box-shadow 0.3s; }
.box-68   { aspect-ratio: 4 / 3; border-radius: 10px; background-color: #F3EAF2; background-size: cover; background-position: center center; background-image: url("../assets/kanal-telefon.jpg"); }
.box-69   { font-size: 22px; font-weight: 600; color: #2A2A2E; }
.box-70   { font-size: 15px; color: #5A5A62; margin-top: 4px; }
.box-71   { aspect-ratio: 4 / 3; border-radius: 10px; background-color: #F3EAF2; background-size: cover; background-position: center center; background-image: url("../assets/kanal-chat.jpg"); }
.box-72   { aspect-ratio: 4 / 3; border-radius: 10px; background-color: #F3EAF2; background-size: cover; background-position: center center; background-image: url("../assets/kanal-email.jpg"); }
.sec-4    { background-color: #FFFFFF; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; background-position: 40px 90px, 0 0; }
.box-73   { max-width: 1320px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 4vw, 56px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: clamp(40px, 6vw, 88px); align-items: center; }
.box-74   { position: relative; aspect-ratio: 4 / 5; max-width: 540px; width: 100%; }
.box-75   { position: absolute; inset: -7%; border-radius: 50%; border: 1px solid rgba(163, 68, 155, 0.18); }
.box-76   { position: absolute; inset: 0; border-radius: 24px; overflow: hidden; box-shadow: rgba(94, 31, 90, 0.2) 0 40px 90px; }
.img-2    { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.box-77   { position: absolute; right: -5%; bottom: 8%; padding: 18px 22px; border-radius: 16px; background: rgba(255, 255, 255, 0.85); border: 1px solid #ECE4EB; backdrop-filter: blur(16px); box-shadow: rgba(94, 31, 90, 0.15) 0 20px 50px; pointer-events: none; }
.box-78   { font-size: 30px; font-weight: 300; color: #2A2A2E; font-variant-numeric: tabular-nums; }
.box-79   { font-size: 13px; color: #A3449B; font-weight: 600; margin-top: 2px; }
.quo-1    { font-weight: 300; font-style: italic; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.2; letter-spacing: -0.02em; margin: 16px 0 0; color: #2A2A2E; text-wrap: balance; }
.par-4    { font-size: 17px; line-height: 1.75; color: #5A5A62; margin: 24px 0 36px; max-width: 54ch; }
.box-80   { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.box-81   { padding: 20px 22px; border-radius: 14px; background: #FFFFFF; border: 1px solid #ECE6EB; }
.box-82   { font-size: 12px; font-weight: 700; color: #A3449B; }
.box-83   { font-size: 19px; font-weight: 600; color: #2A2A2E; margin-top: 8px; }
.box-84   { font-size: 14px; line-height: 1.55; color: #5A5A62; margin-top: 4px; }
.sec-5    { max-width: 1320px; margin: 0 auto; padding: clamp(48px, 6vw, 88px) clamp(20px, 4vw, 56px) clamp(72px, 9vw, 120px); }
.box-85   { position: relative; border-radius: 28px; overflow: hidden; background: linear-gradient(135deg, #8A3483 0%, #5E1F5A 100%); color: #FFFFFF; box-shadow: rgba(94, 31, 90, 0.3) 0 40px 100px; }
.box-86   { position: absolute; right: -10%; top: -40%; width: 60%; aspect-ratio: 1 / 1; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.15); pointer-events: none; }
.box-87   { position: absolute; right: 0; top: -25%; width: 40%; aspect-ratio: 1 / 1; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.1); pointer-events: none; }
.box-88   { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.box-89   { position: relative; padding: clamp(36px, 5vw, 68px); }
.box-90   { font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #F6DDF3; }
.ttl-3    { font-weight: 300; font-size: clamp(34px, 3.8vw, 52px); line-height: 1.08; letter-spacing: -0.03em; margin: 14px 0 0; }
.par-5    { font-size: 17px; line-height: 1.75; color: #F1DCEE; margin: 22px 0 28px; max-width: 52ch; }
.box-91   { display: flex; flex-direction: column; gap: 12px; margin-bottom: 36px; }
.box-92   { display: flex; align-items: center; gap: 12px; font-size: 16px; }
.txt-19   { width: 22px; height: 22px; border-radius: 50%; background: rgba(255, 255, 255, 0.18); display: grid; place-items: center; font-size: 11px; }
.box-93   { display: flex; gap: 12px; flex-wrap: wrap; }
.lnk-8    { padding: 16px 28px; border-radius: 10px; background: #FFFFFF; color: #8A3483; font-weight: 700; }
.lnk-9    { padding: 16px 28px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.4); font-weight: 600; color: #FFFFFF; }
.box-94   { position: relative; min-height: 420px; }
.img-3    { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.ftr-1    { border-top: 1px solid #EFEBEF; background: #FFFFFF; }
.box-95   { max-width: 1320px; margin: 0 auto; padding: 36px clamp(20px, 4vw, 56px); display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; font-size: 14px; color: #6B6B73; }
.txt-20   { font-size: 22px; font-weight: 300; }
.box-96   { display: flex; gap: 28px; flex-wrap: wrap; }
.box-97   { display: none; }
.sec-6    { position: relative; min-height: 100vh; display: flex; flex-direction: column; background-color: #F1EFF1; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; }
.box-98   { flex: 1 1 0%; max-width: 1320px; width: 100%; margin: 0 auto; padding: clamp(16px, 3vw, 40px) clamp(20px, 4vw, 56px) clamp(48px, 6vw, 88px); display: flex; align-items: center; }
.box-99   { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); border-radius: 28px; overflow: hidden; background: #FFFFFF; border: 1px solid #ECE6EB; box-shadow: rgba(94, 31, 90, 0.14) 0 40px 100px; }
.box-100  { position: relative; min-height: 520px; background: #5E1F5A; color: #FFFFFF; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(32px, 4vw, 56px); }
.box-101  { position: absolute; inset: 0; background-size: cover; background-position: center 30%; background-image: url("../assets/berater-headset.jpg"); }
.box-102  { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(70, 20, 66, 0.92) 0%, rgba(94, 31, 90, 0.55) 45%, rgba(94, 31, 90, 0) 75%); }
.box-103  { position: relative; }
.box-104  { font-weight: 300; font-size: clamp(30px, 3vw, 42px); line-height: 1.12; letter-spacing: -0.03em; margin-top: 12px; }
.box-105  { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 28px; }
.box-106  { padding: clamp(32px, 5vw, 72px); display: flex; flex-direction: column; justify-content: center; }
.frm-1    { display: grid; gap: 20px; max-width: 440px; width: 100%; }
.ttl-4    { font-weight: 600; font-size: clamp(32px, 3vw, 42px); line-height: 1.1; letter-spacing: -0.03em; margin: 12px 0 0; color: #1F1F23; }
.par-6    { font-size: 16px; line-height: 1.6; color: #5A5A62; margin: 10px 0 0; }
.lbl-1    { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: #46464C; }
.fld-1    { width: 100%; padding: 15px 16px; border-radius: 10px; border: 1px solid #DDD3DC; background: #FFFFFF; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; color: #2A2A2E; outline-color: #A3449B; }
.txt-21   { display: flex; justify-content: space-between; align-items: center; }
.lnk-10   { font-weight: 400; color: #A3449B; }
.txt-22   { position: relative; display: block; }
.fld-2    { width: 100%; padding: 15px 96px 15px 16px; border-radius: 10px; border: 1px solid #DDD3DC; background: #FFFFFF; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; color: #2A2A2E; outline-color: #A3449B; }
.btn-3    { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: #F8EEF7; color: #8A3483; font-style: inherit; font-variant: inherit; font-weight: 600; font-stretch: inherit; font-size: 13px; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; padding: 7px 12px; border-radius: 8px; cursor: pointer; }
.lbl-2    { display: flex; align-items: center; gap: 10px; font-size: 15px; color: #46464C; cursor: pointer; }
.fld-3    { width: 18px; height: 18px; accent-color: #A3449B; }
.btn-4    { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; font-style: inherit; font-variant: inherit; font-weight: 600; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; padding: 16px 28px; border-radius: 10px; background: #A3449B; color: #FFFFFF; box-shadow: rgba(163, 68, 155, 0.3) 0 12px 30px; }
.box-107  { padding-top: 20px; border-top: 1px solid #EFEBEF; font-size: 15px; color: #5A5A62; }
.lnk-11   { color: #A3449B; font-weight: 600; }
.box-108  { font-size: 13px; color: #8A8A92; }
.sec-7    { position: relative; min-height: 100vh; background-color: #F1EFF1; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'240'%3E%3Cfilter%20id%3D'h'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.9%200.035'%20numOctaves%3D'2'%20seed%3D'3'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.5%20-.38'%2F%3E%3C%2Ffilter%3E%3Cfilter%20id%3D'v'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.035%200.9'%20numOctaves%3D'2'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20values%3D'0%200%200%200%200.6%20%200%200%200%200%200.5%20%200%200%200%200%200.57%20%200%200%200%201.4%20-.36'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23h)'%20opacity%3D'0.2'%2F%3E%3Crect%20width%3D'240'%20height%3D'240'%20filter%3D'url(%23v)'%20opacity%3D'0.17'%2F%3E%3C%2Fsvg%3E"); background-size: 240px 240px; }
.box-109  { max-width: 1320px; margin: 0 auto; padding: clamp(24px, 4vw, 56px) clamp(20px, 4vw, 56px) clamp(64px, 8vw, 110px); }
.lnk-12   { color: #6B6B73; }
.ttl-5    { font-weight: 600; font-size: clamp(40px, 4.8vw, 68px); line-height: 1.06; letter-spacing: -0.03em; margin: 16px 0 0; color: #1F1F23; }
.par-7    { font-size: 17px; line-height: 1.7; color: #5A5A62; max-width: 60ch; margin: 18px 0 0; }
.box-110  { display: flex; flex-wrap: wrap; gap: clamp(24px, 4vw, 48px); margin-top: 48px; align-items: flex-start; }
.nav-2    { position: sticky; top: 24px; flex: 1 1 240px; max-width: 280px; max-height: calc(-48px + 100vh); overflow-y: auto; padding: 24px; border-radius: 16px; background: #FFFFFF; border: 1px solid #ECE6EB; display: flex; flex-direction: column; gap: 2px; }
.box-111  { font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #A3449B; margin-bottom: 10px; }
.lnk-13   { display: flex; gap: 10px; padding: 7px 0; font-size: 14px; color: #46464C; }
.txt-23   { color: #A3449B; font-weight: 600; min-width: 20px; }
.el-1     { flex: 999 1 400px; min-width: 0; padding: clamp(28px, 4vw, 56px); border-radius: 20px; background: #FFFFFF; border: 1px solid #ECE6EB; box-shadow: rgba(94, 31, 90, 0.06) 0 20px 60px; display: flex; flex-direction: column; gap: 40px; }
.box-112  { display: flex; flex-direction: column; gap: 12px; scroll-margin-top: 24px; }
.ttl-6    { display: flex; gap: 14px; align-items: baseline; font-size: clamp(22px, 2vw, 26px); font-weight: 600; letter-spacing: -0.01em; margin: 0; color: #2A2A2E; }
.txt-24   { color: #A3449B; font-weight: 300; }
.par-8    { font-size: 16px; line-height: 1.75; color: #46464C; margin: 0; max-width: 72ch; white-space: pre-line; }
.lst-1    { margin: 0; padding: 0 0 0 20px; display: grid; gap: 6px; font-size: 16px; line-height: 1.6; color: #46464C; max-width: 72ch; }
.par-9    { font-size: 16px; line-height: 1.75; color: #46464C; margin: 0; max-width: 72ch; }

/* Zustände (Hover, Fokus) */
.hv-1:hover  { background: #8A3483; color: #FFFFFF; }
.hv-2:hover  { transform: translateY(-6px); border-color: #D9A6D4; box-shadow: rgba(94, 31, 90, 0.16) 0 24px 50px; }
.hv-3:hover  { background: #F8EEF7; }
.hv-4:hover  { background: #8A3483; }
.hv-5:hover  { border-color: #D9A6D4; box-shadow: rgba(94, 31, 90, 0.1) 0 16px 40px; }
.hv-6:hover  { color: #5E1F5A; }
.hv-7:hover  { color: #FFFFFF; background: rgba(255, 255, 255, 0.1); }