:root {
            color-scheme: dark;
            --bg: #112A30;
            --bg-deep: #0A2228;
            --bg-shape: #14383D;
            --green: #28565A;
            --green-dark: #204347;
            --rose: #F4B3BF;
            --rose-soft: #F8D3DB;
            --mint: #BCE1D5;
            --white: #F9FAF8;
            --muted: #B2C9C7;
            --stroke: #416368;
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            min-width: 320px;
            background: var(--bg);
            color: var(--white);
            font-family: Lato, "Avenir Next", "Segoe UI", Arial, sans-serif;
            -webkit-font-smoothing: antialiased;
        }
        .site {
            min-height: 100svh;
            overflow: hidden;
            position: relative;
            isolation: isolate;
            background: radial-gradient(circle at 91% 26%, rgba(20, 56, 61, .44), transparent 29%), var(--bg);
        }
        .site::before, .site::after {
            content: "";
            position: absolute;
            z-index: -1;
            border-radius: 50%;
            pointer-events: none;
        }
        .site::before {
            width: 690px; height: 690px;
            right: -400px; top: 92px;
            background: #14383D;
            opacity: .78;
        }
        .site::after {
            width: 330px; height: 330px;
            left: -250px; bottom: 220px;
            background: #19383D;
        }
        .container { width: min(1150px, calc(100% - 72px)); margin-inline: auto; }
        .site-header {
            padding-top: 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 25px;
            padding-bottom: 24px;
            border-bottom: 1px solid var(--stroke);
        }
        .brand { display: flex; align-items: center; gap: 17px; }
        .brand-icon {
            height: 60px; width: 60px;
            border-radius: 18px;
            display: grid; place-items: center;
            flex-shrink: 0;
            background: var(--green);
        }
        .brand-icon svg { width: 37px; height: 37px; fill: var(--rose); }
        .brand-name { margin: 0; font-size: clamp(28px, 3vw, 39px); font-weight: 900; letter-spacing: -.048em; line-height: 1; }
        .brand-caption {
            display: block;
            margin-top: 9px;
            font-size: 12px; font-weight: 700;
            letter-spacing: .12em; color: var(--muted);
        }
        .header-pill {
            display: inline-flex; align-items: center; gap: 10px;
            flex-shrink: 0;
            border: 1px solid #4A7073;
            border-radius: 99px;
            padding: 12px 18px;
            font-size: 13px;
            font-weight: 700;
            color: var(--mint);
            background: rgba(30, 71, 76, .55);
        }
        .pulse-dot { width: 8px; height: 8px; border-radius: 100%; background: var(--rose); box-shadow: 0 0 0 4px rgba(244,179,191,.11); }
        .hero {
            padding: 70px 0 38px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(350px, .9fr);
            align-items: center;
            gap: 34px;
        }
        .eyebrow {
            margin: 0 0 24px;
            font-size: 13px; font-weight: 900;
            letter-spacing: .145em;
            color: var(--rose);
        }
        .headline {
            margin: 0;
            font-weight: 900;
            font-size: clamp(51px, 6.2vw, 85px);
            line-height: 1.055;
            letter-spacing: -.066em;
        }
        .headline span { display: block; }
        .headline .emphasis { color: var(--rose); }
        .intro {
            max-width: 550px;
            margin: 29px 0 0;
            font-size: clamp(17px, 1.9vw, 21px);
            line-height: 1.58;
            color: var(--white);
        }
        .features { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px; }
        .feature {
            display: inline-flex; align-items: center; gap: 9px;
            padding: 10px 13px;
            border-radius: 11px;
            border: 1px solid rgba(188,225,213,.19);
            background: rgba(40,86,90,.39);
            font-size: 13px; font-weight: 700;
            color: var(--mint);
        }
        .feature svg { width: 17px; height: 17px; color: var(--rose); }

        /* Illustration – bewusst ohne externe Bilddateien, angelehnt an den Flyer. */
        .hero-art {
            position: relative;
            height: 440px;
            width: 100%;
            display: grid; place-items: center;
        }
        .art-disc {
            position: absolute;
            width: min(100%, 410px);
            aspect-ratio: 1;
            border-radius: 50%;
            background: rgba(30, 71, 76, .46);
            right: 0; top: 1%;
        }
        .art-wisp {
            position: absolute;
            right: -4%; top: -10%;
            width: 45%; height: auto;
            color: #416F74; opacity: .7;
        }
        .receipt-back {
            position: absolute;
            top: 33%; left: 16%;
            width: 72%; max-width: 395px;
            height: 245px;
            border-radius: 30px;
            transform: rotate(10deg) translate(13px, 14px);
            background: #2B6064;
        }
        .receipt {
            position: absolute;
            top: 31%; left: 13%;
            width: 77%; max-width: 415px;
            min-height: 248px;
            border-radius: 29px;
            background: var(--white);
            color: var(--green-dark);
            transform: rotate(-7deg);
            box-shadow: 0 18px 80px rgba(0,0,0,.12);
            padding: 34px 31px 28px;
        }
        .receipt-title { font-size: 15px; font-weight: 900; }
        .fake-line { height: 3px; border-radius: 20px; background: #D4E0DC; margin-top: 18px; }
        .fake-line.short { width: 64%; }
        .fake-line.mid { width: 84%; }
        .receipt-bottom { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:30px; font-size: clamp(13px, 1.55vw, 18px); font-weight:900; }
        .receipt-heart { color:var(--rose); width:49px; height:49px; flex-shrink:0; }
        .floating-heart { position: absolute; z-index: 2; color: var(--rose); filter: drop-shadow(0 12px 10px rgba(0,0,0,.09)); }
        .floating-heart svg { width:100%; height:100%; fill:currentColor; }
        .floating-heart.one { left:3%; top:46%; width:70px; height:70px; transform:rotate(-12deg); animation: float 5s ease-in-out infinite; }
        .floating-heart.two { right:2%; top:19%; width:38px; height:38px; animation: float 4.5s ease-in-out infinite .7s; }
        .floating-heart.three { right:9%; bottom:8%; width:18px; height:18px; color:var(--mint); }
        @keyframes float { 0%,100%{translate:0 0} 50%{translate:0 -14px} }

        .countdown-panel {
            position: relative;
            margin-top: 14px;
            padding: 34px 39px 35px;
            border: 1px solid #41686B;
            border-radius: 30px;
            background: linear-gradient(115deg, #1B4146 0%, #214C50 65%, #1A4045 100%);
            box-shadow: 0 20px 60px rgba(3,21,24,.18);
        }
        .count-header { display: flex; justify-content: space-between; gap: 20px; align-items: end; }
        .release-eyebrow { color: var(--mint); font-size: 13px; font-weight: 800; letter-spacing: .115em; }
        .release-label { margin: 9px 0 0; font-size: clamp(29px,3.6vw,47px); font-weight: 900; letter-spacing: -.045em; line-height: 1.08; }
        .platform-label { border-left: 1px solid #70908F; padding: 3px 0 3px 23px; font-size: 19px; font-weight: 700; }
        .platform-label strong { color: var(--rose); }
        .section-rule { margin: 28px 0 25px; border: 0; border-top: 1px solid rgba(188,225,213,.22); }
        .countdown-label { margin: 0 0 18px; font-size: 13px; color: var(--muted); letter-spacing: .1em; font-weight: 800; text-transform: uppercase; }
        .time-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
        .time-cell {
            border: 1px solid rgba(188,225,213,.12);
            background: rgba(10,34,40,.45);
            border-radius: 20px;
            padding: 21px 12px 18px;
            text-align: center;
        }
        .time-number { font-variant-numeric: tabular-nums; line-height: 1; font-weight: 900; letter-spacing: -.06em; font-size: clamp(37px, 5.2vw, 64px); }
        .time-cell:first-child .time-number { color: var(--rose); }
        .time-unit { display:block; margin-top: 12px; font-size: 11px; letter-spacing: .14em; font-weight:800; color: var(--mint); text-transform: uppercase; }
        .note { font-size: 12px; color: var(--muted); margin: 17px 0 0; line-height: 1.5; }
        .note a { color: inherit; }
        .steps { padding: 37px 0 36px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
        .step { display:flex; align-items: center; gap:14px; padding: 14px 16px; border: 1px solid rgba(188,225,213,.11); border-radius: 15px; background: rgba(10,34,40,.27); }
        .step-number { font-size: 12px; color:var(--rose); font-weight:900; letter-spacing:.06em; }
        .step-text { font-size: 14px; font-weight:700; color: var(--white); }
        .site-footer { padding: 21px 0 28px; background: var(--bg-deep); color: var(--muted); text-align: center; font-size: 12px; }
        .site-footer p { margin: 0; }
        .site-footer p + p { margin-top: 6px; }

        @media (max-width: 910px) {
            .hero { grid-template-columns: minmax(0,1fr) minmax(290px,.8fr); gap: 10px; }
            .hero-art { height: 380px; }
            .receipt { padding: 30px 22px 23px; }
            .receipt-back { height:220px; }
        }
        @media (max-width: 720px) {
            .container { width: min(100% - 36px, 560px); }
            .site-header { padding-top: 22px; padding-bottom: 20px; }
            .brand { gap:12px; }
            .brand-icon { width:48px; height:48px; border-radius:14px; }
            .brand-icon svg { width:29px; height:29px; }
            .brand-name { font-size: 29px; }
            .brand-caption { font-size:9px; letter-spacing:.09em; margin-top:7px; }
            .header-pill { display:none; }
            .hero { grid-template-columns: 1fr; padding-top: 48px; gap: 10px; }
            .eyebrow { font-size:11px; margin-bottom:17px; }
            .headline { font-size: clamp(46px, 9.3vw, 70px); }
            .intro { margin-top:24px; font-size:17px; }
            .features { margin-top:23px; }
            .feature { font-size:12px; }
            .hero-art { height: 320px; max-width:450px; margin-inline:auto; }
            .art-disc { width: 315px; right:-8%; }
            .receipt { top:21%; left:18%; width:68%; min-height:203px; border-radius:22px; padding:25px 22px 20px; }
            .receipt-back { top:22%; left:19%; width:68%; height:195px; }
            .receipt-title { font-size:12px; }
            .fake-line { margin-top:13px; }
            .receipt-bottom { margin-top:23px; font-size:13px; }
            .receipt-heart { width:33px; height:33px; }
            .floating-heart.one { left:5%; top:40%; width:54px; height:54px; }
            .floating-heart.two { right:6%; top:13%; width:29px; height:29px; }
            .countdown-panel { padding:24px 20px; border-radius:23px; }
            .release-label { font-size:32px; }
            .platform-label { font-size:15px; padding-left:14px; }
            .time-grid { gap:7px; }
            .time-cell { padding:17px 4px 15px; border-radius:13px; }
            .time-number { font-size: clamp(26px,7vw,44px); }
            .time-unit { font-size:9px; letter-spacing:.07em; }
            .steps { padding:23px 0 30px; grid-template-columns: 1fr; gap:9px; }
        }
        @media (max-width: 370px) {
            .brand-name { font-size:25px; }
            .brand-caption { font-size:8px; }
            .headline { font-size:43px; }
            .release-label { font-size:27px; }
            .platform-label { font-size:13px; }
        }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration: .01ms !important; scroll-behavior:auto !important; }
        }

        /* Gemeinsame Navigation und FAQ-Design */
        a { color: inherit; }
        .brand { text-decoration: none; }
        .brand:focus-visible, .nav-link:focus-visible, .btn:focus-visible,
        .faq-search:focus-visible, .faq-item summary:focus-visible,
        .site-footer a:focus-visible { outline: 3px solid var(--rose); outline-offset: 5px; }
        .header-actions { display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
        .main-nav { display:flex; align-items:center; gap:7px; }
        .nav-link { display:inline-block; text-decoration:none; color:var(--muted); font-size:14px; font-weight:800;
            border-radius:12px; padding:12px 17px; transition:background .18s,color .18s; }
        .nav-link:hover, .nav-link[aria-current="page"] { background:rgba(244,179,191,.10); color:var(--rose); }
        .site-footer a { color:var(--mint); text-decoration:none; }
        .site-footer a:hover { text-decoration:underline; }
        .site-footer .footer-links { display:flex; gap:24px; justify-content:center; margin-top:12px; }
        .faq-teaser { margin:8px 0 64px; padding:32px 37px; border:1px solid var(--stroke); border-radius:26px;
          background:linear-gradient(112deg,rgba(244,179,191,.10),rgba(32,67,71,.5));
          display:flex; align-items:center; justify-content:space-between; gap:24px; }
        .faq-teaser-eyebrow { font-size:12px; text-transform:uppercase; color:var(--rose);
          font-weight:900; letter-spacing:.15em; margin:0 0 12px; }
        .faq-teaser h2 { font-size:clamp(25px,3vw,39px); letter-spacing:-.045em; line-height:1.15; margin:0 0 10px; }
        .faq-teaser p:last-child { color:var(--muted); font-size:15px; line-height:1.55; margin:0; }
        .btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid transparent;
          border-radius:15px; padding:16px 22px; font-size:14px; font-weight:900; text-decoration:none;
          transition:transform .18s,background .18s; white-space:nowrap; }
        .btn:hover { transform:translateY(-2px); }
        .btn-primary { background:var(--rose); color:var(--bg-deep); }
        .btn-primary:hover { background:var(--rose-soft); }
        .btn-secondary { background:rgba(40,86,90,.45); border-color:var(--stroke); color:var(--mint); }
        .faq-hero { padding:72px 0 45px; max-width:820px; }
        .faq-hero h1 { margin:0; font-size:clamp(42px,5.5vw,72px); line-height:1.07; font-weight:900;
          letter-spacing:-.06em; }
        .faq-hero h1 span { color:var(--rose); }
        .faq-hero .intro { max-width:790px; margin-top:22px; font-size:18px; }
        .prelaunch-note { display:inline-flex; gap:9px; align-items:center; padding:12px 15px; margin-top:24px;
          border:1px solid rgba(188,225,213,.19); background:rgba(40,86,90,.39); border-radius:12px;
          font-size:12px; color:var(--mint); font-weight:750; line-height:1.5; }
        .faq-layout { display:grid; grid-template-columns:268px minmax(0,1fr); gap:47px; padding-bottom:70px; align-items:start; }
        .faq-sidebar { position:sticky; top:20px; background:rgba(10,34,40,.35); border:1px solid var(--stroke);
          border-radius:22px; padding:23px; }
        .faq-sidebar h2 { font-size:13px; margin:0 0 16px; letter-spacing:.13em; color:var(--mint); text-transform:uppercase; }
        .faq-links { display:grid; gap:6px; }
        .faq-links a { display:block; padding:12px 14px; border-radius:11px; font-weight:750; font-size:13px;
          text-decoration:none; color:var(--muted); }
        .faq-links a:hover { color:var(--white); background:rgba(244,179,191,.08); }
        .side-note { margin-top:23px; padding-top:20px; border-top:1px solid rgba(188,225,213,.19);
          font-size:12px; line-height:1.65; color:var(--muted); }
        .faq-search-wrap { position:relative; margin-bottom:26px; }
        .faq-search-icon { position:absolute; width:21px; height:21px; left:18px; top:50%; transform:translateY(-50%);
          color:var(--rose); pointer-events:none; }
        .faq-search { display:block; width:100%; height:58px; padding:14px 18px 14px 54px; color:var(--white);
          font:inherit; font-size:15px; background:#1A4146; border:1px solid #4B7779; border-radius:16px; }
        .faq-search::placeholder { color:#AEC8C6; }
        .faq-section { margin-bottom:33px; scroll-margin-top:24px; }
        .faq-section h2 { font-size:23px; margin:0 0 16px; letter-spacing:-.035em; color:var(--white); }
        .faq-item { border:1px solid rgba(188,225,213,.17); background:rgba(13,43,49,.80);
          border-radius:16px; margin-bottom:9px; overflow:hidden; }
        .faq-item[open] { border-color:#537C7D; background:#193C41; }
        .faq-item summary { display:flex; list-style:none; cursor:pointer; user-select:none; gap:16px;
          justify-content:space-between; align-items:center; padding:20px 22px; font-size:15px;
          line-height:1.5; font-weight:850; }
        .faq-item summary::-webkit-details-marker { display:none; }
        .faq-item summary::after { content:'+'; flex-shrink:0; width:30px; height:30px; border-radius:9px;
          display:grid; place-items:center; font-size:22px; line-height:1; font-weight:500;
          background:rgba(244,179,191,.1); color:var(--rose); }
        .faq-item[open] summary::after { content:'−'; }
        .faq-answer { padding:0 22px 21px; font-size:14px; color:#D0DFDD; line-height:1.75; }
        .faq-answer p { margin:0 0 12px; }
        .faq-answer p:last-child { margin:0; }
        .faq-answer strong { color:var(--white); }
        .faq-answer a { color:var(--rose-soft); text-underline-offset:3px; }
        .faq-answer ul { margin:10px 0; padding-left:22px; }
        .faq-answer li + li { margin-top:5px; }
        .faq-noresults { padding:22px; border:1px solid var(--stroke); border-radius:15px; color:var(--mint);
          text-align:center; }
        [hidden] { display:none !important; }
        .faq-bottom { margin:18px 0 64px; border-radius:24px; padding:28px 32px; border:1px solid var(--stroke);
          background:linear-gradient(114deg,#1C4146,#234B4E); display:flex; align-items:center;
          justify-content:space-between; gap:20px; }
        .faq-bottom h2 { margin:0 0 7px; font-size:24px; letter-spacing:-.035em; }
        .faq-bottom p { margin:0; font-size:14px; color:var(--muted); line-height:1.6; }
        @media (max-width: 1080px) {
          .header-actions { gap:8px; }
          .header-pill { display:none; }
        }
        @media (max-width: 820px) {
          .faq-layout { grid-template-columns:1fr; gap:22px; }
          .faq-sidebar { position:static; }
          .faq-links { display:flex; flex-wrap:wrap; }
          .faq-links a { padding:8px 10px; }
          .side-note { display:none; }
        }
        @media (max-width:720px) {
          .site-header { flex-wrap:wrap; }
          .header-actions { width:100%; }
          .main-nav { width:100%; border-top:1px solid rgba(188,225,213,.13); padding-top:11px; }
          .nav-link { padding:10px 14px; }
          .faq-teaser, .faq-bottom { flex-direction:column; align-items:stretch; padding:25px 22px; }
          .faq-teaser { margin-bottom:32px; }
          .faq-hero { padding:43px 0 26px; }
          .faq-hero h1 { font-size:clamp(36px,10vw,54px); }
          .faq-hero .intro { font-size:16px; }
          .faq-sidebar { padding:17px; }
          .faq-item summary { padding:17px; font-size:14px; }
          .faq-answer { padding:0 17px 18px; font-size:14px; }
          .faq-section h2 { font-size:20px; }
          .btn { width:100%; white-space:normal; }
        }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }


/* Herzbetrag – gemeinsame Navigation mit vier oder mehr Menüpunkten */
.main-nav { flex-wrap:wrap; justify-content:flex-end; row-gap:5px; }
.footer-links { flex-wrap:wrap; row-gap:10px; }
.footer-links a[aria-current="page"] { color:var(--rose); }

/* Rechtliche Seiten */
.legal-hero { max-width:870px; }
.legal-layout { display:grid; grid-template-columns:268px minmax(0,1fr); gap:45px; align-items:start; padding-bottom:90px; }
.legal-content { display:grid; gap:18px; min-width:0; }
.legal-card { border-radius:22px; border:1px solid rgba(188,225,213,.18); padding:29px 34px;
    background:linear-gradient(125deg,rgba(22,59,64,.91),rgba(12,40,46,.82)); scroll-margin-top:26px; }
.legal-card-index { color:var(--rose); font-size:11px; letter-spacing:.18em; font-weight:900; margin-bottom:13px; }
.legal-card h2 { font-size:clamp(21px,2.5vw,29px); margin:0 0 18px; letter-spacing:-.03em; line-height:1.2; }
.legal-card p { line-height:1.8; color:#D2E2E0; font-size:15px; margin:0 0 14px; overflow-wrap:anywhere; }
.legal-card p:last-child { margin-bottom:0; }
.legal-card strong { color:var(--white); }
.legal-card a { color:var(--rose-soft); text-decoration-thickness:1px; text-underline-offset:4px; }
.legal-card a:hover { color:var(--white); }
.legal-card .legal-address { color:var(--white); font-weight:700; font-size:17px; }
.legal-muted { color:var(--muted)!important; }
.legal-warning { padding:21px 24px; border:1px solid rgba(244,179,191,.50); background:rgba(244,179,191,.11);
    color:var(--white); font-size:14px; line-height:1.8; border-radius:16px; }
.legal-warning strong { color:var(--rose-soft); }
.legal-warning code { color:var(--mint); }
.legal-missing { color:var(--rose-soft); font-style:italic; font-weight:700; }
.legal-data { margin:0 0 18px; }
.legal-data > div { display:grid; grid-template-columns:minmax(125px,36%) 1fr; gap:12px; align-items:start;
    border-bottom:1px solid rgba(188,225,213,.12); padding:12px 0; }
.legal-data dt { color:var(--muted); font-size:13px; }
.legal-data dd { margin:0; color:var(--white); overflow-wrap:anywhere; font-weight:700; }
@media (max-width:980px) {
  .legal-layout { grid-template-columns:225px minmax(0,1fr); gap:23px; }
  .legal-card { padding:25px 25px; }
}
@media (max-width:820px) {
  .legal-layout { grid-template-columns:1fr; gap:22px; }
  .legal-sidebar { position:static; }
  .legal-sidebar .faq-links { display:flex; flex-wrap:wrap; }
  .main-nav { justify-content:flex-start; }
}
@media (max-width:720px) {
  .main-nav { padding-top:12px; justify-content:flex-start; gap:5px; }
  .nav-link { padding:9px 11px; font-size:13px; }
  .legal-card { padding:23px 20px; border-radius:18px; }
  .legal-data > div { grid-template-columns:1fr; gap:3px; }
  .legal-hero { padding:43px 0 28px; }
  .legal-layout { padding-bottom:44px; }
  .site-footer .footer-links { gap:12px 22px; }
}

/* Herzbetrag ACP-Frontend-Modi */
.hb-state-main{max-width:700px;min-height:66vh;display:flex;flex-direction:column;justify-content:center;padding:60px 0 110px}
.hb-state-main h1{font-size:clamp(3.1rem,8vw,6rem);line-height:1.04;margin:16px 0 20px;letter-spacing:-.06em}
.hb-state-main p{font-size:clamp(1rem,2vw,1.22rem);line-height:1.7;color:var(--muted);margin:0 0 15px}
.hb-rose{color:var(--rose)}.hb-state-links{display:flex;gap:24px;margin-top:25px}
.hb-state-links a{color:var(--rose);font-weight:700}

/* Herzbetrag 0.2.1 – Anzeige von CHF/Euro und manuelle Korrektur */
.hb-currency-display { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:21px; color:var(--muted); font-size:13px; font-weight:700; }
.hb-currency-options { display:inline-flex; gap:4px; border:1px solid var(--stroke); padding:4px; border-radius:99px; background:rgba(10,34,40,.35); }
.hb-currency-option { display:inline-block; min-width:42px; text-align:center; color:var(--mint); padding:7px 10px; border-radius:99px; text-decoration:none; }
.hb-currency-option:hover, .hb-currency-option:focus-visible { background:rgba(244,179,191,.15); outline-offset:3px; }
.hb-currency-option.is-active { background:var(--rose); color:var(--bg-deep); }

/* 0.2.2 – offizielle Download-Links (nur bei im ACP hinterlegter URL sichtbar) */
.app-download{margin:23px 0 37px;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:29px 32px;border:1px solid var(--stroke);border-radius:24px;background:linear-gradient(125deg,rgba(38,88,91,.57),rgba(15,49,53,.55))}
.app-download-text{min-width:0}
.app-download-kicker{display:block;font-size:11px;letter-spacing:.16em;color:var(--rose);font-weight:800;margin-bottom:8px}
.app-download h2{font-size:clamp(24px,2.8vw,35px);margin:0 0 6px;letter-spacing:-.035em}
.app-download .hb-rose{color:var(--rose)}
.app-download p{color:var(--muted);margin:0;font-size:14px;line-height:1.6}
.app-download-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.store-button{display:flex;align-items:center;gap:12px;padding:11px 16px;border:1px solid rgba(248,250,248,.3);border-radius:13px;background:#0D2228;color:var(--white);text-decoration:none;min-width:155px;transition:background .18s,border .18s,transform .18s}
.store-button:hover{background:#23474C;border-color:var(--rose);transform:translateY(-2px)}
.store-button:focus-visible{outline:3px solid var(--rose);outline-offset:3px}
.store-button small,.store-button strong{display:block;line-height:1.3}
.store-button small{font-size:10px;color:var(--muted)}
.store-button strong{font-size:16px;letter-spacing:-.01em}
.store-button-icon{font-size:25px;line-height:1;color:var(--rose);width:25px;text-align:center}
@media(max-width:880px){.app-download{flex-direction:column;align-items:flex-start;padding:25px}.app-download-actions{width:100%}}
@media(max-width:420px){.app-download{padding:20px}.app-download-actions{flex-direction:column;align-items:stretch}.store-button{width:100%}}
@media(prefers-reduced-motion:reduce){.store-button{transition:none}}
/* Herzbetrag 0.3 – Jobs im bestehenden Dunkelpetrol-Rosé-Design */
.hb-jobs-page{padding:70px 0 95px;max-width:960px;margin:auto}.hb-jobs-page h1{font-size:clamp(2.5rem,6vw,5rem);letter-spacing:-.06em;line-height:1.08;margin:15px 0}.hb-jobs-page h1 span,.hb-job-apply h2 span{color:var(--rose)}.hb-jobs-intro{max-width:660px;color:var(--muted);line-height:1.7;margin-bottom:34px}.hb-jobs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:34px}.hb-job-card,.hb-job-detail,.hb-job-apply{border:1px solid var(--stroke);border-radius:19px;background:linear-gradient(155deg,#1C454A,#15363B);padding:30px}.hb-job-card h2,.hb-job-detail h2{font-size:clamp(1.45rem,3vw,2.2rem);letter-spacing:-.04em;margin:12px 0}.hb-job-card p,.hb-job-summary,.hb-job-apply p{line-height:1.65;color:var(--muted)}.hb-job-card .btn{display:inline-flex;margin-top:15px}.hb-jobs-back{display:inline-block;margin:8px 0 20px;color:var(--rose)}.hb-job-description{line-height:1.85;overflow-wrap:anywhere;white-space:normal;margin-top:25px}.hb-job-apply{margin-top:24px}.hb-job-apply h2{margin:0 0 13px}.hb-job-form{display:grid;gap:17px;margin-top:24px;max-width:740px}.hb-job-form label{display:grid;gap:8px;font-weight:650;color:#E0EEEB;font-size:.9rem}.hb-job-form input:not([type=checkbox]),.hb-job-form textarea{border:1px solid var(--stroke);background:#0E2C31;border-radius:11px;color:var(--white);padding:14px;font:inherit;width:100%;outline-offset:3px}.hb-job-form textarea{resize:vertical}.hb-job-form .hb-job-check{display:flex;align-items:flex-start;gap:11px;font-weight:400;line-height:1.6}.hb-job-check input{margin-top:6px;accent-color:var(--rose)}.hb-job-check a{color:var(--rose)}.hb-job-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.hb-jobs-message{border:1px solid #5B9B84;border-radius:11px;background:#204C43;color:#E5FFF0;padding:15px;margin:20px 0}.hb-jobs-error{background:#513A42;border-color:#A56D7E;color:#FFDEE4}@media(max-width:760px){.hb-jobs-list{grid-template-columns:1fr}.hb-jobs-page{padding:42px 0 75px}.hb-job-card,.hb-job-detail,.hb-job-apply{padding:20px}}
/* Herzbetrag 0.4 – Newsletter, Team, transparente Cookie-Information */
.hb04-simple{padding:80px 0 110px;max-width:960px;margin:auto}
.hb04-simple h1{font-size:clamp(2.3rem,6vw,4.8rem);line-height:1.1;margin:14px 0 24px}
.hb04-simple>p{color:var(--muted);line-height:1.8;max-width:700px}
.hb04-newsletter{margin:45px auto 35px;max-width:980px;border:1px solid var(--stroke);background:linear-gradient(135deg,#1b4347,#102d31);border-radius:22px;padding:32px}
.hb04-newsletter h2{font-size:clamp(1.45rem,3vw,2.25rem);margin:10px 0}
.hb04-newsletter p{color:#c5dbd8;line-height:1.65}
.hb04-signup{max-width:620px;display:grid;gap:13px;margin-top:24px}
.hb04-signup input[type=email]{width:100%;min-height:50px;border:1px solid #628487;color:#fff;background:#112a30;border-radius:10px;padding:12px 15px;font-size:1rem}
.hb04-signup label{display:flex;gap:10px;align-items:flex-start;line-height:1.6;color:#d1e2df;font-size:.9rem}
.hb04-signup label input{margin-top:5px;accent-color:#f4b3bf}
.hb04-signup button{border:0;background:#f4b3bf;color:#112a30;font-weight:800;padding:15px 25px;border-radius:11px;cursor:pointer;width:fit-content}
.hb04-signup button:hover{background:#ffcad3}
.hb04-signup a,.hb04-simple a{color:#f4b3bf}
.hb04-honeypot{position:absolute!important;left:-10000px!important}
.hb04-message{margin:22px 0;padding:16px 18px;border:1px solid #59807e;background:#1a4145;border-radius:12px;line-height:1.6}
.hb04-message.fail{border-color:#dc768d;color:#ffdce5}.hb04-message.ok{border-color:#86c9af}
.hb04-team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:44px}
.hb04-person{background:#17383c;border:1px solid #426a6d;border-radius:20px;padding:22px;display:flex;gap:18px;align-items:center;min-height:180px;position:relative}
.hb04-person::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:calc(var(--level)*4px);max-width:16px;background:#f4b3bf;border-radius:4px}
.hb04-person img{width:94px;height:110px;object-fit:cover;border-radius:14px;border:2px solid #5d8283;flex:none}
.hb04-person small{color:#f4b3bf;font-weight:bold;letter-spacing:.1em;font-size:.68rem}
.hb04-person h2{font-size:1.2rem;margin:6px 0}.hb04-person p{margin:0 0 5px;color:#e1f2ee}.hb04-person span{color:#98baba;font-size:.85rem}
.hb04-cookie-notice{position:fixed;z-index:1000;bottom:18px;left:18px;right:18px;max-width:620px;margin:0 auto;background:#163b3e;border:1px solid #698b8a;border-radius:16px;box-shadow:0 10px 40px #0008;padding:18px 20px;display:flex;align-items:center;gap:18px}
.hb04-cookie-notice p{font-size:.86rem;line-height:1.5;margin:0;flex:1;color:#e0f0ed}
.hb04-cookie-notice a{color:#f4b3bf}.hb04-cookie-notice button{background:#f4b3bf;border:0;color:#10272c;padding:10px 15px;border-radius:10px;font-weight:800;cursor:pointer}
@media(max-width:620px){.hb04-simple{padding:50px 0 80px}.hb04-newsletter{padding:22px}.hb04-cookie-notice{align-items:flex-start;flex-direction:column;gap:12px;bottom:8px;left:8px;right:8px}.hb04-person{min-height:145px}}

/* Herzbetrag 0.5: permanenter Support-Link in der Hauptnavigation */
.main-nav a[href^="https://support.herzbetrag.li"]{color:var(--rose);font-weight:800}

/* Herzbetrag Entwicklungsunterstützung 0.6 */
.hb06-funding{margin:42px 0;padding:clamp(20px,4vw,42px);border:1px solid #416368;border-radius:24px;background:linear-gradient(150deg,#1a3d41,#112a30);box-shadow:0 24px 70px #06191b44}.hb06-heading h2{font-size:clamp(26px,4vw,42px);line-height:1.15;color:#f9faf8;margin:12px 0}.hb06-heading p,.hb06-fine{color:#b2c9c7;line-height:1.8}.hb06-goal{padding:22px;border:1px solid #416368;border-radius:16px;background:#10282d;margin:16px 0}.hb06-goal-numbers{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:15px}.hb06-goal-numbers strong{font-size:24px;color:#f4b3bf}.hb06-goal-numbers span{color:#bce1d5}.hb06-track{height:16px;border-radius:20px;background:#31555a;overflow:hidden}.hb06-track span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#f4b3bf,#bce1d5);transition:width .3s}.hb06-goal small{display:block;margin-top:9px;color:#b2c9c7}.hb06-secondary-goal{opacity:.87}.hb06-funding h3{font-size:18px;margin:20px 0 8px;color:#f9faf8}.hb06-form{margin:26px 0;padding:24px;border:1px solid #416368;border-radius:18px;display:grid;gap:20px}.hb06-form label{font-weight:600;display:grid;gap:8px;color:#d6e7e3}.hb06-fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.hb06-form input:not([type=radio]):not([type=checkbox]),.hb06-form select{width:100%;padding:12px;border-radius:10px;background:#0d282d;color:#fff;border:1px solid #567478;font:inherit}.hb06-form fieldset{border:1px solid #416368;border-radius:12px;padding:12px 16px}.hb06-form legend{color:#f4b3bf;font-weight:700}.hb06-form fieldset label,.hb06-consent{display:flex!important;align-items:start;gap:9px;font-weight:400!important}.hb06-form input[type=checkbox],.hb06-form input[type=radio]{accent-color:#f4b3bf;margin-top:5px}.hb06-trap{position:absolute!important;left:-10000px!important}.hb06-donors{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}.hb06-donors>div{padding:13px 15px;background:#102a30;border:1px solid #416368;border-radius:12px;display:flex;justify-content:space-between;gap:12px}.hb06-donors strong{color:#f4b3bf}.hb06-feedback{margin:20px 0;background:#20494b;border:1px solid #bce1d5;padding:16px;border-radius:12px}.hb06-fine{font-size:12px}@media(max-width:650px){.hb06-fields{grid-template-columns:1fr}.hb06-form{padding:16px}}

/* Herzbetrag 0.6.2: Sichtbares Herz als Teil des PayPal-Buttons. */
.hb06-pay-button{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:50px}
.hb06-pay-heart{display:block;width:27px;height:27px;flex:0 0 27px;fill:#9d3652;filter:drop-shadow(0 1px 1px rgba(0,0,0,.12));transition:transform .18s ease}
.hb06-pay-button:hover .hb06-pay-heart,.hb06-pay-button:focus-visible .hb06-pay-heart{transform:scale(1.13)}
@media(max-width:440px){.hb06-pay-heart{width:25px;height:25px;flex-basis:25px}}