/* ============================================================
   Zentrales Redesign – Petrol/Teal, Wortmarke, runde Boxen
   Auf allen Seiten ausser index.html verlinkt (index hat es inline).
   ============================================================ */
:root{
  --amt-red:#1F6F73;        /* Petrol/Teal (Primär/CTA) */
  --amt-red-dark:#195B5E;   /* dunkleres Petrol (Hover) */
  --amt-ink:#1F2933;        /* Text (Anthrazit) */
  --amt-ink-2:#5B6570;      /* Sekundärtext (Grau) */
  --amt-line:#D8DDE3;       /* Haarlinien */
  --amt-bg-2:#F5F6F7;       /* Hellgrau */
  --ch-red:#D8232A;         /* Schweizer Rot (Akzent) */
}

/* Sachliche Schrift */
body, .hero h1, .hero p, .offer-title, .offer-sub, .section-h, .section-sub,
.explainer-h, .explainer-p, .step h4, .step p, summary, .faq-a,
.footer-cta-text h3, .verify-text h3, .logo, nav, .nav, .subnav, button, input, select, textarea{
  font-family:"Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif !important;
}
body{ color:var(--amt-ink); border-top:none !important; }

/* ── Wortmarke-Logo ── */
.logo{ display:inline-flex !important; align-items:center; padding:0 !important; gap:0 !important; margin-right:auto; }
.logo img, .nav-logo img{ display:block !important; height:50px !important; width:auto; max-width:180px; }
@media (max-width:720px){ .logo img, .nav-logo img{ height:38px !important; max-width:140px; } }
.logo-text{ display:flex; flex-direction:column; line-height:1.05; }
.logo-text strong{ font-size:1.12rem; font-weight:800; color:var(--amt-ink); letter-spacing:-0.02em; }
.logo-text small{ font-size:0.82rem; font-weight:600; color:var(--amt-red); letter-spacing:0.02em; }
.logo-sq{ display:inline-block; width:0.4em; height:0.4em; background:var(--ch-red);
  border-radius:1px; margin:0 0.14em; vertical-align:baseline; }
.logo-footer .logo-text strong{ font-size:1.18rem; }

/* ── NAV ── */
nav, nav.scrolled{ background:#fff !important; border-bottom:1px solid var(--amt-line) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.nav-links a:not(.nav-cta){ color:var(--amt-ink) !important; font-weight:600 !important; }
.nav-links a:not(.nav-cta):hover{ color:var(--amt-red) !important; }
.menu-btn{ background:#fff !important; border:1px solid var(--amt-line) !important; }
.menu-btn span, .menu-btn span::before, .menu-btn span::after{ background:var(--amt-ink) !important; }

/* ── Buttons: Petrol, eckig→leicht rund, kein Hover-Versatz ── */
.nav-cta, .hero-cta, .offer-cta, .mm-cta, .footer-cta-btn, .verify-btn, .hero-cta-secondary{
  background:var(--amt-red) !important; color:#fff !important; font-weight:700 !important;
  border-radius:10px !important; box-shadow:none !important; transform:none !important; }
.nav-cta:hover, .hero-cta:hover, .offer-cta:hover, .mm-cta:hover,
.footer-cta-btn:hover, .verify-btn:hover{ background:var(--amt-red-dark) !important; transform:none !important; }
.hero-cta svg, .offer-cta svg, .nav-cta svg, .verify-btn svg, .footer-cta-btn svg{ stroke:#fff !important; }

/* ── Akzente/Eyebrows ── */
.section-eyebrow, .offer-eyebrow, .explainer-h span, .logo span,
.price-badge .pb-amount .ccy, .offer-price-amount .ccy{ color:var(--amt-red) !important; }

/* ── SUBNAV (falls noch vorhanden) ── */
.subnav{ background:#fff !important; border-bottom:1px solid var(--amt-line) !important; }
.subnav a.active{ border-bottom-color:var(--amt-red) !important; color:var(--amt-ink) !important; }

/* ── TRUST-STRIP ── */
.trust-strip{ background:var(--amt-bg-2) !important; border-bottom:1px solid var(--amt-line) !important; }
.trust-strip .ts-item svg{ stroke:var(--amt-red) !important; }

/* ── HERO (Kantons-Layout: Foto rechts, zarter Petrol-Ton) ── */
.hero-section{ background:linear-gradient(180deg,#F5F6F7 0%,#ECF1F1 100%) !important; }
.hero-section::before, .hero-section::after{ display:none !important; }
.hero h1{ color:var(--amt-ink) !important; }
.hero p{ color:var(--amt-ink-2) !important; }
.hero p .hl{ color:var(--amt-red) !important; }
.price-badge{ background:var(--amt-bg-2) !important; border:1px solid var(--amt-line) !important;
  border-radius:14px !important; box-shadow:none !important; }
.price-badge .pb-amount strong{ color:var(--amt-ink) !important; }
.price-badge .pb-foot{ color:var(--amt-ink-2) !important; }
.hero-trust-icon{ background:var(--amt-red) !important; border-radius:50% !important; }
.hero-trust-icon svg{ stroke:#fff !important; }
.hero-cta-band{ display:none !important; }

/* ── OFFER / Boxen: Rahmen statt Schatten, runde Ecken ── */
.offer, .steps .step, .hinweis, .offer-price{ border-radius:16px !important; box-shadow:none !important; }
.offer{ border:1px solid var(--amt-line) !important; }
.offer-left{ background:#fff !important; display:flex !important; flex-direction:column; justify-content:center; }
.offer-right{ background:var(--amt-bg-2) !important; }
.offer-right::before{ display:none !important; }
.offer-price{ background:#fff !important; border:1px solid var(--amt-line) !important; }
.offer-price-amount{ color:var(--amt-ink) !important; }
.offer-price small, .offer-price-foot, .offer-sub{ color:var(--amt-ink-2) !important; }
.check{ background:var(--amt-red) !important; border-radius:50% !important; }
/* Zahlungsarten in der Bestell-Box */
.offer-pay{ margin-top:4px; position:static !important; }
.offer-pay-label{ display:block !important; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:700; color:var(--amt-ink-2) !important; margin-bottom:9px !important; }
.offer-pay img{ width:100% !important; max-width:280px; height:auto !important; display:block; }

/* ── HINWEIS ── */
.hinweis{ background:var(--amt-bg-2) !important; border:1px solid var(--amt-line) !important; }
.hinweis-icon{ background:#fff !important; border:1px solid var(--amt-line); border-radius:10px !important; }
.hinweis-icon svg{ stroke:var(--amt-red) !important; }

/* ── SECTION / SCHRITTE ── */
.section-sub, .step p{ color:var(--amt-ink-2) !important; }
.steps::before{ display:none !important; }
.steps .step{ border:1px solid var(--amt-line) !important; }
.steps .step:hover{ border-color:var(--amt-red) !important; box-shadow:none !important; transform:none !important; }
.step-icon{ background:var(--amt-bg-2) !important; border-radius:14px !important; }
.step-icon svg{ stroke:var(--amt-red) !important; }
.step-num{ background:var(--amt-red) !important; border:2px solid #fff !important; border-radius:50% !important; }

/* ── EXPLAINER ── */
.explainer-p{ color:var(--amt-ink-2) !important; }
.explainer-sample img{ border:1px solid var(--amt-line) !important; border-radius:16px !important; box-shadow:none !important; }
.ec{ background:var(--amt-red) !important; border-radius:50% !important; }

/* ── VERIFY: Petrol-Band ── */
.verify{ background:var(--amt-red) !important; border:none !important; }
.verify-text h3{ color:#fff !important; }
.verify-text p, .footer-cta-text p{ color:rgba(255,255,255,0.9) !important; }
.verify-btn{ background:#fff !important; color:var(--amt-red) !important; }
.verify-btn:hover{ background:var(--amt-bg-2) !important; }
.verify-btn svg{ stroke:var(--amt-red) !important; }

/* ── FAQ ── */
.faq, details{ border-color:var(--amt-line) !important; }
.ico{ border-radius:50% !important; }
details[open] .ico{ background:var(--amt-red) !important; border-color:var(--amt-red) !important; }
.faq-a a{ color:var(--amt-red) !important; }

/* ── FOOTER (dunkles Petrol) ── */
footer{ background:#16494C !important; border-top:none !important; color:#fff !important;
  padding:40px 56px !important; display:flex !important; flex-direction:column !important;
  gap:28px !important; font-size:0.9rem; align-items:stretch !important; }
.footer-bottom{ display:flex !important; justify-content:space-between !important; align-items:center !important;
  flex-wrap:wrap !important; gap:18px !important; max-width:1040px !important; margin:0 auto !important; width:100% !important; }
.fl{ display:flex !important; flex-direction:column !important; gap:6px !important; align-items:flex-start !important; }
.flinks{ display:flex !important; gap:24px !important; flex-wrap:wrap; }
.footer-meta{ max-width:1040px !important; margin:24px auto 0 !important; padding-top:18px !important;
  border-top:1px solid rgba(255,255,255,0.15) !important; font-size:0.78rem; text-align:center !important; line-height:1.5; width:100%; }
@media (max-width:768px){ footer{ padding:30px 20px !important; } .footer-bottom{ flex-direction:column !important; align-items:flex-start !important; } }
footer .fl span{ color:rgba(255,255,255,0.78) !important; }
.flinks a, .footer-links a{ color:rgba(255,255,255,0.9) !important; }
.flinks a:hover, .footer-links a:hover{ color:#fff !important; }
.footer-meta{ color:rgba(255,255,255,0.65) !important; border-top-color:rgba(255,255,255,0.15) !important; }
.logo-footer .logo-text strong{ color:#fff !important; }
.logo-footer .logo-text small{ color:rgba(255,255,255,0.85) !important; }

/* ── Mobile-Menü ── */
.mobile-menu{ border:1px solid var(--amt-line) !important; border-radius:16px !important; }
.mobile-menu .mm-cta{ color:#fff !important; }