/* Bengonia – styles.css (helles Neon-Design) */

:root{
  --fx-crop: 58px;
--bg: #0b1020;
  --panel: rgba(255,255,255,0.06);
  --panel2: rgba(255,255,255,0.08);
  --text: rgba(255,255,255,0.92);
  --muted: rgba(255,255,255,0.68);
  --line: rgba(255,255,255,0.12);
  --btn: rgba(255,255,255,0.08);
  --btn-hover: rgba(255,255,255,0.12);
  --accent: #f7d33f;
  --shadow: 0 14px 35px rgba(0,0,0,0.35);
  --radius: 18px;
  --neon: rgba(255,255,255,0.95);
}
html[data-theme="light"]{
  --bg: #e9eef8;
  --panel: rgba(0,0,0,0.06);
  --panel2: rgba(0,0,0,0.09);
  --text: rgba(12,18,34,0.92);
  --muted: rgba(12,18,34,0.62);
  --line: rgba(12,18,34,0.14);
  --btn: rgba(0,0,0,0.05);
  --btn-hover: rgba(0,0,0,0.09);
  --neon: rgba(12,18,34,0.30);
}
*{ box-sizing: border-box; }
html,body{ height: 100%; }
html{ background: #070b14; }
body{ margin:0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; color: var(--text); position: relative; isolation: isolate; min-height: 100vh; background: transparent; }
body::before{ content:""; position: fixed; inset: 0; background: url("Luxusjet%20bei%20Sonnenuntergang%20am%20Start.png") center / cover no-repeat; transform: translateZ(0); filter: saturate(1.05) contrast(1.05) brightness(0.78); z-index: -2; pointer-events: none; }
html[data-theme="light"] body::before{ filter: saturate(1.00) contrast(1.02) brightness(0.94); }
body::after{ content:""; position: fixed; inset: 0; background: radial-gradient(1200px 800px at 15% 20%, rgba(86,170,255,0.18), transparent 60%), radial-gradient(900px 600px at 90% 10%, rgba(255,210,120,0.12), transparent 55%), linear-gradient(180deg, rgba(10,16,33,0.70), rgba(7,11,20,0.92)); z-index: -1; pointer-events: none; }
html[data-theme="light"] body::after{ background: radial-gradient(1200px 800px at 15% 20%, rgba(86,170,255,0.22), transparent 62%), radial-gradient(900px 600px at 90% 10%, rgba(255,210,120,0.18), transparent 58%), linear-gradient(180deg, rgba(245,248,255,0.54), rgba(220,228,242,0.84)); }
a{ color: rgba(160,210,255,0.95); text-decoration: none; }
a:hover{ text-decoration: underline; }
.app{ display:flex; min-height:100vh; }
.sidebar{ width: 280px; padding: 18px; display: flex; flex-direction: column; transition: width 220ms ease, padding 220ms ease; position: sticky; top:0; height: 120vh; background: rgba(10,14,28,0.7); border-right: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 0 22px 22px 0; outline: 2px solid rgba(255,255,255,0.08); position: relative; isolation: isolate; }
.sidebar::before{ content:""; position:absolute; inset: 10px; border-radius: 18px; pointer-events:none; box-shadow: 0 0 24px rgba(255,255,255,0.06); }
.sidebar:hover{ box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 0 42px rgba(255,255,255,0.10), 0 0 90px rgba(120,200,255,0.12), var(--shadow); }
.sidebar::after{ content:""; position:absolute; inset: 10px; border-radius: 18px; pointer-events:none; box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 0 18px rgba(255,255,255,0.08), 0 0 42px var(--neon); transition: box-shadow 550ms ease; }
.sidebar-controls{ display:flex; justify-content: flex-end; align-items: center; gap: 10px; margin-bottom: 10px; }
.sidebar-toggle{ font-size: 18px; line-height: 1; }
.brand{ display:flex; align-items:center; gap: 1px; padding: 1px; border-radius: 16px; background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03)); border: 1px solid var(--line); margin-bottom: 1px; }
.brand-mark{ width: 150px; height: 150px; display:grid; place-items:center; border-radius: 16px; background: rgba(255,255,255,0.06); box-shadow: 0 0 26px rgba(120,200,255,0.10); font-size: 44px; }
.brand-title{ font-weight: 750; letter-spacing: 0.3px; }
.brand-sub{ font-size: 12px; color: var(--muted); }
.menu{ display:flex; flex-direction: column; gap: 10px; padding-top: 6px; flex: 1; }
.menu-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.menu-btn--mini{ display: flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 10px; }
.menu-btn--mini .label{ font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-btn--mini .ico{ font-size: 14px; }
.sidebar.collapsed .menu-row{ grid-template-columns: 1fr; gap: 8px; }
.menu-btn{ width:100%; text-align:left; padding: 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.05); color: var(--text); cursor:pointer; transition: transform 160ms ease, background 220ms ease, box-shadow 220ms ease, border-color 220ms ease; display: flex; align-items: center; gap: 10px; }
.menu-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.08); box-shadow: 0 0 22px rgba(247,211,63,0.10); border-color: rgba(247,211,63,0.35); }
.menu-btn.active{ background: rgba(247,211,63,0.12); border-color: rgba(247,211,63,0.55); box-shadow: 0 0 28px rgba(247,211,63,0.15); }
.menu-btn .ico{ width: 22px; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; opacity: 0.95; flex: 0 0 22px; line-height: 1; }
.menu-btn .label{ flex: 1; }
#tippsToggle{ margin-top: 10px; }
.tipps-panel{ display:none; }
.tipps-panel.open{ display:block; max-height: 62vh; overflow:auto; }
.hint{ padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,0.04); }
.hint-title{ font-weight: 650; margin-bottom: 6px; }
.sidebar-footer .hint-title{ color: rgba(247,211,63,0.98); text-shadow: 0 0 8px rgba(247,211,63,0.30), 0 0 18px rgba(247,211,63,0.22); letter-spacing: 0.2px; }
.main{ flex:1; padding: 18px 22px 26px; min-width: 0; }
.topbar{ display:flex; align-items:center; justify-content: space-between; gap: 10px; position: sticky; top: 0; padding: 10px 12px; margin-bottom: 16px; background: rgba(10,14,28,0.62); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); z-index: 5; isolation: isolate; }
html[data-theme="light"] .sidebar{ background: rgba(245,248,255,0.62); box-shadow: 0 14px 35px rgba(0,0,0,0.14); }
html[data-theme="light"] .topbar{ background: rgba(245,248,255,0.62); }
html[data-theme="light"] .card, html[data-theme="light"] .hint{ background: rgba(245,248,255,0.60); box-shadow: 0 14px 35px rgba(0,0,0,0.12); }
html[data-theme="light"] .menu-btn{ background: rgba(245,248,255,0.56); border-color: rgba(12,18,34,0.14); }
html[data-theme="light"] .menu-btn:hover{ background: rgba(245,248,255,0.66); }
html[data-theme="light"] .crumb{ color: rgba(12,18,34,0.92); }
html[data-theme="light"] .pill{ background: rgba(0,0,0,0.04); color: rgba(12,18,34,0.78); }
.topbar-left{ display:flex; align-items:center; gap: 10px; }
.crumb{ position: absolute; left: 50%; transform: translateX(-50%); font-weight: 800; letter-spacing: 0.3px; color: rgba(255,255,255,0.92); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 220px); pointer-events: none; }
.icon-btn{ width: 40px; height: 40px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,0.06); color: var(--text); cursor:pointer; }
.icon-btn:hover{ background: rgba(255,255,255,0.09); }
.pill{ padding: 8px 10px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255,255,255,0.06); font-size: 12px; color: rgba(255,255,255,0.85); }
.page{ display:none; }
.page.active{ display:block; }
.page-head{ margin-bottom: 12px; }
.page-head h1{ margin: 0 0 6px; font-size: 28px; letter-spacing: 0.2px; }
.muted{ color: var(--muted); }
.hero{ position: relative; isolation: isolate; border-radius: var(--radius); border: 1px solid var(--line); overflow: hidden; background: rgba(255,255,255,0.03); box-shadow: var(--shadow); margin-bottom: 16px; }
.hero-bg{ position:absolute; left: 0; top: 0; bottom: 0; width: 33%; background: linear-gradient(90deg, rgba(10,14,28,0.75), rgba(10,14,28,0.10)), url("Luxusjet%20bei%20Sonnenuntergang%20am%20Start.png"); background-size: cover; background-position: center; }
.hero.hero--image{ min-height: 224px; margin-bottom: 12px; }
.hero.hero--image .hero-bg{ position:absolute; inset: 0; width: 100%; background: linear-gradient(180deg, rgba(10,14,28,0.08), rgba(10,14,28,0.22)), url("Luxusjet%20bei%20Sonnenuntergang%20am%20Start.png"); background-size: cover; background-position: center; }
.hero-panel{ padding: 18px; margin-bottom: 16px; }
.hero-panel h1{ margin: 0 0 8px; font-size: 34px; }
.hero-panel p{ margin: 0 0 14px; max-width: 820px; line-height: 1.45; color: rgba(255,255,255,0.82); }
.hero-actions{ display:flex; gap: 10px; flex-wrap: wrap; }
.btn, .primary, .ghost{ display:inline-flex; align-items:center; justify-content:center; gap: 8px; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: var(--btn); color: var(--text); cursor:pointer; transition: transform 160ms ease, background 220ms ease, box-shadow 220ms ease; text-decoration:none; }
.btn:hover, .primary:hover, .ghost:hover{ transform: translateY(-1px); background: var(--btn-hover); }
.primary{ background: rgba(247,211,63,0.14); border-color: rgba(247,211,63,0.45); box-shadow: 0 0 30px rgba(247,211,63,0.12); }
.primary:hover{ border-color: rgba(247,211,63,0.65); box-shadow: 0 0 38px rgba(247,211,63,0.16); }
.ghost{ background: rgba(255,255,255,0.05); }
.primary.small, .ghost.small{ padding: 10px 12px; border-radius: 14px; }
.grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 980px){ .grid{ grid-template-columns: 1fr; } }
.sidebar.collapsed{ width: 92px; padding: 14px 10px; }
.sidebar.collapsed .sidebar-controls{ justify-content: center; }
.sidebar.collapsed .brand{ justify-content: center; gap: 0; padding: 12px 10px; }
.sidebar.collapsed .brand-text{ display:none; }
.sidebar.collapsed .menu-btn{ justify-content: center; gap: 0; padding: 12px 10px; text-align: center; }
.sidebar.collapsed .menu-btn .label{ display:none; }
.sidebar.collapsed .tipps-panel{ display:none; }
.sidebar.collapsed .tipps-panel.open{ display:block; position: fixed; left: 108px; bottom: 18px; width: 280px; max-width: calc(100vw - 130px); z-index: 60; box-shadow: 0 18px 44px rgba(0,0,0,0.45); }
.card{ background: rgba(255,255,255,0.04); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow); }
.card h2{ margin: 0 0 10px; font-size: 18px; }
.bullets{ margin: 0; padding-left: 18px; color: rgba(255,255,255,0.82); line-height: 1.45; }
.steps{ margin:0; padding-left: 18px; color: rgba(255,255,255,0.82); line-height: 1.45; }
.toolbar{ display:flex; gap: 10px; flex-wrap: wrap; margin: 10px 0 14px; }
.field{ display:flex; flex-direction:column; gap: 6px; margin-bottom: 12px; }
.field label{ font-size: 12px; color: rgba(255,255,255,0.78); }
.field input, .field select, .field textarea{ padding: 10px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: rgba(0,0,0,0.18); color: var(--text); outline: none; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color: rgba(160,210,255,0.55); box-shadow: 0 0 0 4px rgba(160,210,255,0.10); }
.help{ font-size: 12px; color: rgba(255,255,255,0.62); }
#page-kontaktieren .page-head{ text-align: center; }
#page-kontaktieren .card{ max-width: 920px; margin: 0 auto; }
#page-kontaktieren .form{ display: flex; flex-direction: column; align-items: center; }
#page-kontaktieren .form .grid{ width: 100%; max-width: 920px; }
#page-kontaktieren .form .field{ width: 100%; max-width: 920px; }
#page-kontaktieren .form .field label{ text-align: center; font-size: 13px; }
#page-kontaktieren .form .field input, #page-kontaktieren .form .field textarea{ text-align: center; }
#page-kontaktieren .form textarea{ min-height: 260px; line-height: 1.5; resize: vertical; }
#page-kontaktieren .form button.primary{ min-width: 240px; }
.form-message{ display: none; margin-top: 12px; padding: 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.05); }
.footer{ margin-top: 18px; padding: 12px 6px; color: rgba(255,255,255,0.60); font-size: 12px; text-align:center; }
.footnote{ margin-top: 10px; font-size: 12px; }
.about-emoji{ display:grid; place-items:center; min-height: 240px; }
.about-emoji-inner{ font-size: 64px; width: 120px; height: 120px; display:grid; place-items:center; border-radius: 28px; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.05); }
.services-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 1100px){ .services-grid{ grid-template-columns: 1fr; } }
.service-icon{ width: 44px; height: 44px; border-radius: 16px; display:grid; place-items:center; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.05); font-size: 22px; }
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 980px){ .contact-grid{ grid-template-columns: 1fr; } }
.contact-item{ padding: 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.04); }
.tv-wrap{ height: 1200px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.14); overflow: hidden; background: rgba(0,0,0,0.22); }
.tv-card .tradingview-widget-copyright{ font-size: 12px; color: rgba(255,255,255,0.60); margin-top: 10px; }
.tv-card .blue-text{ color: rgba(160,210,255,0.95); }
.markettools-widgets-row{ display: grid; grid-template-columns: 2fr 3fr; gap: 16px; align-items: start; }
.markettools-widget{ border: 1px solid rgba(255,255,255,0.14); border-radius: 16px; padding: 12px; overflow: hidden; }
.widget-frame{ width: 100%; height: 520px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); overflow: hidden; background: rgba(0,0,0,0.18); }
.markettools-iframe{ width: 100%; height: 100%; border: 0; display: block; }
.widget-frame--crop{ overflow: hidden; position: relative; }
.markettools-iframe--crop{ position: relative; top: calc(var(--fx-crop) * -1); height: calc(100% + var(--fx-crop)); }
.poweredBy{ font-size: 11px; line-height: 1.35; }
.markettools-widget .poweredBy span{ color: rgba(255,255,255,0.72) !important; }
.markettools-widget .poweredBy a{ color: rgba(160,210,255,0.95) !important; }
@media (max-width: 900px){ .markettools-widgets-row{ grid-template-columns: 1fr; } .widget-frame{ height: 560px; } }
.wisdom-box{ padding: 12px; border-radius: 14px; border: 1px solid rgba(247,211,63,0.35); background: rgba(255,255,255,0.04); text-align: center; max-width: 400px; }
.wisdom-text{ margin: 0 0 8px; font-style: italic; font-size: 14px; line-height: 1.35; color: var(--text); }
.wisdom-author{ margin: 0 0 10px; font-weight: 700; color: var(--muted); font-size: 13px; }
.wisdom-text, .wisdom-author{ font-family: "Libre Baskerville", serif !important; font-size: 8px !important; }
.wisdom-btn{ background: rgba(247,211,63,0.90); color: rgba(10,14,28,0.95); border: none; padding: 8px 12px; border-radius: 12px; cursor: pointer; font-weight: 700; transition: transform 160ms ease; }
.wisdom-btn:hover{ transform: translateY(-1px); }
.wisdom-btn:disabled{ cursor: not-allowed; opacity: 0.55; }
.brand-mark .brand-logo{ width: 100%; height: 100%; object-fit: contain; display: block; }
.text{ color: rgba(255,255,255,0.82); line-height: 1.55; }
.section{ margin-top: 16px; }
.page-head.compact h2{ margin: 0 0 6px; font-size: 20px; }
.page-head.compact{ margin: 10px 0 12px; }
.checklist{ margin: 0; padding-left: 0; list-style: none; }
.checklist li{ padding: 6px 0; color: rgba(255,255,255,0.82); }
.tag{ display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.05); font-size: 12px; }
.blog-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 1100px){ .blog-grid{ grid-template-columns: 1fr; } }
.blog-top{ display:flex; align-items:center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.blog-meta{ color: rgba(255,255,255,0.60); font-size: 12px; }
.btn.active{ background: rgba(160,210,255,0.10); border-color: rgba(160,210,255,0.40); }
.skip-link{ position: absolute; left: -999px; top: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.18); background: rgba(10,14,28,0.92); color: rgba(255,255,255,0.92); z-index: 9999; }
.skip-link:focus{ left: 18px; }
:focus-visible{ outline: 3px solid rgba(247,211,63,0.85); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce){ *{ scroll-behavior: auto !important; } .sidebar::after{ transition: none !important; } .menu-btn, .btn, .primary, .ghost{ transition: none !important; } }
html, body{ overflow-x: hidden; }
.mobile-menu-toggle, .sidebar-overlay{ display: none; }
@media (max-width: 980px){
  .app{ min-height: 100dvh; }
  .mobile-menu-toggle{ display: inline-flex; align-items: center; justify-content: center; flex: 0 0 40px; }
  .sidebar{ position: fixed !important; top: 0; left: 0; width: min(86vw, 340px); max-width: 340px; height: 100dvh; min-height: 100dvh; padding: 18px 14px 16px; transition: transform 220ms ease; z-index: 40; overflow-y: auto; }
  .sidebar.collapsed{ width: min(86vw, 340px); padding: 18px 14px 16px; transform: translateX(calc(-100% - 16px)); }
  .sidebar.collapsed .brand{ justify-content: flex-start; gap: 10px; padding: 10px; }
  .sidebar.collapsed .brand-mark{ width: 92px; height: 92px; }
  .sidebar.collapsed .brand-text{ display: block; }
  .sidebar.collapsed .menu-btn{ justify-content: flex-start; gap: 10px; text-align: left; padding: 12px; }
  .sidebar.collapsed .menu-btn .label{ display: block; }
  .sidebar.collapsed .menu-row{ grid-template-columns: 1fr 1fr; }
  .sidebar-overlay{ display: block; position: fixed; inset: 0; background: rgba(7,11,20,0.48); border: 0; padding: 0; opacity: 0; pointer-events: none; transition: opacity 220ms ease; z-index: 35; }
  body.sidebar-open{ overflow: hidden; }
  body.sidebar-open .sidebar-overlay{ opacity: 1; pointer-events: auto; }
  .main{ width: 100%; padding: 14px; }
  .crumb{ position: static; transform: none; max-width: none; font-size: 18px; pointer-events: auto; }
  .hero-actions{ flex-direction: column; align-items: stretch; }
  .hero-actions > *{ width: 100%; }
}
@media (max-width: 720px){
  .main{ padding: 12px; }
  .page-head h1{ font-size: 24px; }
  .card{ padding: 12px; border-radius: 16px; }
  .primary, .ghost, .btn, .icon-btn{ min-height: 44px; }
  .tv-wrap{ height: 820px; }
  .wisdom-box{ max-width: none; }
}
@media (max-width: 420px){
  .sidebar{ width: calc(100vw - 22px); max-width: none; }
  .page-head h1{ font-size: 22px; }
  .tv-wrap{ height: 720px; }
}

/* ===== Kontaktformular: Status & Datenschutz-Checkbox ===== */
.form-message.ok { display:block; background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.45); color:#86efac; padding:12px; border-radius:12px; margin-top:10px; box-shadow:0 0 22px rgba(34,197,94,.15); }
.form-message.err { display:block; background:rgba(239,68,68,.12); border:1px solid rgba(239,68,68,.45); color:#fca5a5; padding:12px; border-radius:12px; margin-top:10px; box-shadow:0 0 22px rgba(239,68,68,.15); }
.field--check { flex-direction:row !important; align-items:flex-start !important; gap:10px; margin-top:4px; }
.check-label { display:flex; align-items:flex-start; gap:10px; cursor:pointer; font-size:14px; line-height:1.4; color:var(--muted); }
.check-label input[type="checkbox"] { width:18px; height:18px; margin-top:2px; flex:0 0 18px; accent-color:rgba(247,211,63,.9); cursor:pointer; }
.check-label a { color:rgba(247,211,63,.95); text-decoration:underline; }
#contactSubmit:disabled { opacity:.6; cursor:not-allowed; transform:none !important; }
html[data-theme="light"] .form-message.ok  { color:#166534; background:rgba(34,197,94,.18); }
html[data-theme="light"] .form-message.err { color:#991b1b; background:rgba(239,68,68,.18); }
html[data-theme="light"] .check-label      { color:rgba(12,18,34,.78); }

/* ===== Newsletter ===== */
.newsletter-card { padding: 18px; }
.newsletter-content { display: grid; grid-template-columns: 1fr 1.1fr; gap: 18px; align-items: center; }
.newsletter-content h2 { margin: 0 0 6px; }
.newsletter-form { display: flex; gap: 10px; flex-wrap: wrap; }
.newsletter-form input[type="email"] {
  flex: 1; min-width: 220px;
  padding: 12px 14px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(0,0,0,0.18); color: var(--text); outline: none;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.newsletter-form input[type="email"]:focus {
  border-color: rgba(247,211,63,0.55);
  box-shadow: 0 0 0 4px rgba(247,211,63,0.10);
}
@media (max-width: 880px){
  .newsletter-content { grid-template-columns: 1fr; }
  .newsletter-form .primary { width: 100%; }
}

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

/* ===== FAQ Accordion ===== */
.faq-list { display: flex; flex-direction: column; gap: 10px; }
.faq-item { padding: 0; overflow: hidden; transition: box-shadow 220ms ease, border-color 220ms ease; }
.faq-item summary {
  cursor: pointer; padding: 16px 18px;
  font-weight: 650; list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  position: relative;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+"; font-size: 22px; line-height: 1;
  color: rgba(247,211,63,0.95);
  transition: transform 220ms ease;
  flex: 0 0 auto;
}
.faq-item[open] summary::after { content: "−"; transform: rotate(180deg); }
.faq-item[open] { border-color: rgba(247,211,63,0.45); box-shadow: 0 0 28px rgba(247,211,63,0.10), var(--shadow); }
.faq-item:hover { border-color: rgba(247,211,63,0.30); }
.faq-body { padding: 0 18px 16px; color: rgba(255,255,255,0.82); line-height: 1.55; }
html[data-theme="light"] .faq-body { color: rgba(12,18,34,0.78); }

/* ===== Scroll-to-top ===== */
.scroll-top {
  position: fixed; right: 18px; bottom: 18px; z-index: 50;
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid rgba(247,211,63,0.55);
  background: rgba(247,211,63,0.18); color: var(--text);
  cursor: pointer; font-size: 20px; font-weight: 700;
  box-shadow: 0 10px 28px rgba(0,0,0,0.35), 0 0 24px rgba(247,211,63,0.18);
  opacity: 0; pointer-events: none;
  transform: translateY(8px);
  transition: opacity 220ms ease, transform 220ms ease, background 220ms ease;
}
.scroll-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.scroll-top:hover { background: rgba(247,211,63,0.28); }
@media (max-width: 720px){ .scroll-top { right: 12px; bottom: 12px; width: 42px; height: 42px; } }

/* ===== Cookie-Hinweis ===== */
.cookie-banner {
  position: fixed; left: 50%; bottom: 18px;
  transform: translateX(-50%);
  z-index: 60; max-width: 720px; width: calc(100% - 36px);
  padding: 14px 16px; border-radius: 16px;
  background: rgba(10,14,28,0.92); color: var(--text);
  border: 1px solid rgba(247,211,63,0.45);
  box-shadow: 0 18px 44px rgba(0,0,0,0.45), 0 0 30px rgba(247,211,63,0.12);
  display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center;
}
html[data-theme="light"] .cookie-banner { background: rgba(245,248,255,0.96); color: rgba(12,18,34,0.92); }
.cookie-banner__text { font-size: 13px; line-height: 1.45; color: rgba(255,255,255,0.85); }
html[data-theme="light"] .cookie-banner__text { color: rgba(12,18,34,0.78); }
.cookie-banner__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.cookie-banner[hidden] { display: none; }
@media (max-width: 720px){
  .cookie-banner { grid-template-columns: 1fr; bottom: 12px; padding: 12px; }
  .cookie-banner__actions { justify-content: stretch; }
  .cookie-banner__actions > * { flex: 1; }
}

/* ===== Footer-Link-Buttons ===== */
.link-btn {
  background: none; border: 0; padding: 0; margin: 0;
  color: rgba(160,210,255,0.95); cursor: pointer;
  font: inherit; text-decoration: none;
}
.link-btn:hover { text-decoration: underline; }
html[data-theme="light"] .link-btn { color: rgba(40,90,180,0.95); }

/* ===== Service-Cards: Mehr Hover-Tiefe ===== */
.service-card { transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease; }
.service-card:hover {
  transform: translateY(-3px);
  border-color: rgba(247,211,63,0.45);
  box-shadow: 0 18px 42px rgba(0,0,0,0.45), 0 0 36px rgba(247,211,63,0.10);
}

/* ===== Blog-Posts: Hover ===== */
.blog-post { transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease; }
.blog-post:hover { transform: translateY(-2px); border-color: rgba(160,210,255,0.40); box-shadow: 0 16px 36px rgba(0,0,0,0.40); }
.blog-post .tag { margin-bottom: 8px; }

/* ===== Reduzierte Bewegung respektieren ===== */
@media (prefers-reduced-motion: reduce){
  .service-card:hover, .blog-post:hover, .faq-item, .scroll-top { transition: none !important; transform: none !important; }
}

/* ===== Wisdom-Box: Schriftgrösse korrigieren (war zu klein mit 8px) ===== */
.wisdom-text, .wisdom-author{ font-family: "Libre Baskerville", serif !important; font-size: 13px !important; }
.wisdom-author{ font-size: 12px !important; }