/* ============================================================
   OCTOPUS MOCKUP v2 – Korrektes Branding
   A = Bestehendes Branding (Gold #fc0 + #333 + #147ecc)
   B = Vorschlag: Navy + Teal
   C = Vorschlag: Tiefblau + Koralle
   ============================================================ */
/* Fonts loaded locally via fonts.css – DSGVO-konform */

/* --- VARIANTE A: Original octopus.at --- */
[data-theme="a"]{
  --primary:#ffcc00;--primary-dark:#e6b800;--primary-light:#ffe066;
  --accent:#0d6ab5;--accent-light:#3a9de0;
  --dark:#333;--dark-deeper:#222;
  --surface:#fff;--surface-alt:#f8f7f4;--surface-warm:#fffcf0;
  --border:#ddd;--border-light:#eee;
  --text:#333;--text-sec:#5c5c5c;--text-muted:#636363;
  --text-on-primary:#333;--text-on-dark:#fff;
  --hero-bg:#333;--hero-text:#fff;--hero-accent:#fc0;
  --nav-bg:#fc0;--nav-text:#333;--nav-hover-bg:#333;--nav-hover-text:#fff;
  --nav-active-bg:#333;--nav-active-text:#fff;
  --nav-fixed-bg:#333;--nav-fixed-text:#fff;--nav-fixed-hover:#fc0;
  --footer-bg:#333;--footer-text:#ccc;
  --badge-bg:#fff5cc;--badge-text:#333;
  --cta-bg:#fc0;--cta-text:#333;--cta-hover:#e6b800;
  --btn-bg:#fc0;--btn-text:#333;--btn-hover:#e6b800;
  --card-shadow:0 2px 16px rgba(0,0,0,.05);--card-hover:0 8px 30px rgba(255,204,0,.12);
  --step-color:#333;--link:#0d6ab5;
  --quote-border:#fc0;--quote-bg:#f8f7f4;
}
/* --- VARIANTE B: Navy + Teal --- */
[data-theme="b"]{
  --primary:#0891B2;--primary-dark:#0E7490;--primary-light:#22D3EE;
  --accent:#0F172A;--accent-light:#1E293B;
  --dark:#0F172A;--dark-deeper:#020617;
  --surface:#fff;--surface-alt:#F0F9FF;--surface-warm:#F0FDFA;
  --border:#CBD5E1;--border-light:#E2E8F0;
  --text:#0F172A;--text-sec:#475569;--text-muted:#94A3B8;
  --text-on-primary:#fff;--text-on-dark:#fff;
  --hero-bg:#0F172A;--hero-text:#fff;--hero-accent:#22D3EE;
  --nav-bg:#fff;--nav-text:#334155;--nav-hover-bg:#F0F9FF;--nav-hover-text:#0891B2;
  --nav-active-bg:#0891B2;--nav-active-text:#fff;
  --nav-fixed-bg:#fff;--nav-fixed-text:#334155;--nav-fixed-hover:#0891B2;
  --footer-bg:#0F172A;--footer-text:#94A3B8;
  --badge-bg:#ECFEFF;--badge-text:#0891B2;
  --cta-bg:#0891B2;--cta-text:#fff;--cta-hover:#0E7490;
  --btn-bg:#0891B2;--btn-text:#fff;--btn-hover:#0E7490;
  --card-shadow:0 2px 16px rgba(8,145,178,.05);--card-hover:0 8px 30px rgba(8,145,178,.12);
  --step-color:#0891B2;--link:#0891B2;
  --quote-border:#0891B2;--quote-bg:#F0F9FF;
}
/* --- VARIANTE C: Tiefblau + Koralle --- */
[data-theme="c"]{
  --primary:#E85D3A;--primary-dark:#D14E2D;--primary-light:#FF7F5C;
  --accent:#1B3A5C;--accent-light:#2A5580;
  --dark:#1B3A5C;--dark-deeper:#0F2440;
  --surface:#fff;--surface-alt:#FDF8F6;--surface-warm:#FFF5F2;
  --border:#E0D5CF;--border-light:#F0EBE8;
  --text:#1B3A5C;--text-sec:#4A6580;--text-muted:#8A9FB5;
  --text-on-primary:#fff;--text-on-dark:#fff;
  --hero-bg:#1B3A5C;--hero-text:#fff;--hero-accent:#FF7F5C;
  --nav-bg:#fff;--nav-text:#1B3A5C;--nav-hover-bg:#FFF5F2;--nav-hover-text:#E85D3A;
  --nav-active-bg:#E85D3A;--nav-active-text:#fff;
  --nav-fixed-bg:#fff;--nav-fixed-text:#1B3A5C;--nav-fixed-hover:#E85D3A;
  --footer-bg:#1B3A5C;--footer-text:#8A9FB5;
  --badge-bg:#FFF0EB;--badge-text:#E85D3A;
  --cta-bg:#E85D3A;--cta-text:#fff;--cta-hover:#D14E2D;
  --btn-bg:#E85D3A;--btn-text:#fff;--btn-hover:#D14E2D;
  --card-shadow:0 2px 16px rgba(232,93,58,.05);--card-hover:0 8px 30px rgba(232,93,58,.14);
  --step-color:#E85D3A;--link:#E85D3A;
  --quote-border:#E85D3A;--quote-bg:#FDF8F6;
}

/* RESET */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Lato','Poppins',sans-serif;color:var(--text);background:var(--surface);line-height:1.65;font-size:16px;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration:none;transition:color .2s}
a:hover{color:var(--primary-dark)}

/* THEME SWITCHER */
.theme-wrap{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.theme-label{background:var(--dark);color:var(--text-on-dark);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;padding:6px 14px;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.2);pointer-events:none;white-space:nowrap;font-family:'Lato',sans-serif}
.theme-btns{display:flex;gap:6px}
.theme-btn{width:40px;height:40px;border-radius:50%;border:3px solid rgba(255,255,255,.5);cursor:pointer;transition:all .2s;box-shadow:0 2px 10px rgba(0,0,0,.25);position:relative}
.theme-btn:hover{transform:scale(1.15)}
.theme-btn.active{border-color:#fff;transform:scale(1.2);box-shadow:0 4px 20px rgba(0,0,0,.35)}
.theme-btn[data-t="a"]{background:linear-gradient(135deg,#fc0 50%,#333 50%)}
.theme-btn[data-t="b"]{background:linear-gradient(135deg,#0891B2 50%,#0F172A 50%)}
.theme-btn[data-t="c"]{background:linear-gradient(135deg,#E85D3A 50%,#1B3A5C 50%)}
.theme-btn[data-t="d"]{background:linear-gradient(135deg,#147ecc 50%,#fc0 50%)}
.theme-btn.active::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.5)}

/* LAYOUT */
html,body{overflow-x:hidden}
.container{max-width:1140px;margin:0 auto;padding:0 24px;box-sizing:border-box}
.section{padding:80px 0;overflow-x:hidden}
.section--alt{background:#f8f7f4;background:var(--surface-alt);color:#333;color:var(--text)}
.section--warm{background:var(--surface-warm)}

/* NAV */
.nav{position:sticky;top:0;z-index:1000;background:var(--nav-bg);border-bottom:1px solid rgba(0,0,0,.06);padding:0 24px;transition:all .3s}
.nav.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.08)}
[data-theme="a"] .nav.scrolled{background:var(--nav-fixed-bg)}
[data-theme="a"] .nav.scrolled .nav__links a{color:var(--nav-fixed-text)}
[data-theme="a"] .nav.scrolled .nav__links a:hover{color:var(--nav-fixed-hover);background:rgba(255,255,255,.1)}
[data-theme="a"] .nav.scrolled .nav__links a.active{background:var(--primary);color:#333}
[data-theme="a"] .nav.scrolled .nav__toggle span{background:var(--nav-fixed-text)}
.nav__inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:68px}
.nav__logo{display:flex;align-items:center;gap:0}
.nav__logo img{height:38px;width:auto}
/* In dark scrolled nav for theme A, invert logo to white */
[data-theme="a"] .nav .nav__logo .logo-white{display:none}
[data-theme="a"] .nav .nav__logo .logo-dark{display:block}
[data-theme="a"] .nav.scrolled .nav__logo .logo-white{display:block}
[data-theme="a"] .nav.scrolled .nav__logo .logo-dark{display:none}
[data-theme="b"] .nav__logo .logo-white,[data-theme="c"] .nav__logo .logo-white{display:none}
[data-theme="b"] .nav__logo .logo-dark,[data-theme="c"] .nav__logo .logo-dark{display:block}
.nav__links{display:flex;gap:2px;list-style:none;align-items:center}
.nav__links a{padding:8px 14px;border-radius:6px;font-size:13px;font-weight:600;color:var(--nav-text);transition:all .2s;text-transform:uppercase;letter-spacing:.5px}
.nav__links a:hover{color:var(--nav-hover-text);background:var(--nav-hover-bg)}
.nav__links a.active{color:var(--nav-active-text);background:var(--nav-active-bg)}
.nav__cta{background:var(--btn-bg)!important;color:var(--btn-text)!important;padding:10px 22px!important;border-radius:8px!important;font-weight:700!important}
[data-theme="a"] .nav__cta{background:#333!important;color:#fff!important}
[data-theme="a"] .nav.scrolled .nav__cta{background:var(--primary)!important;color:#333!important}
.nav__cta:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.15)}
.nav__toggle{display:none;background:none;border:none;cursor:pointer;padding:8px}
.nav__toggle span{display:block;width:24px;height:2px;background:var(--nav-text);margin:5px 0;transition:all .3s;border-radius:2px}

/* HERO */
.hero{background:var(--hero-bg);color:var(--hero-text);padding:80px 0 70px;position:relative;overflow:hidden}
.hero__inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.hero__content{flex:1;min-width:0}
.hero__octopus{flex-shrink:0;width:300px}
.hero__octopus img{width:100%;height:auto;filter:drop-shadow(0 8px 30px rgba(0,0,0,.3))}
.hero__badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:50px;padding:6px 16px;font-size:13px;font-weight:500;margin-bottom:24px;backdrop-filter:blur(4px)}
.hero__badge-dot{width:6px;height:6px;border-radius:50%;background:var(--hero-accent)}
.hero h1{font-family:'Playfair Display',serif;font-size:clamp(30px,4.5vw,48px);font-weight:700;line-height:1.15;margin-bottom:20px}
.hero h1 em{font-style:italic;color:var(--hero-accent)}
.hero p{font-size:17px;line-height:1.7;max-width:560px;opacity:.88;margin-bottom:32px}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:8px;font-size:15px;font-weight:700;font-family:'Lato',sans-serif;cursor:pointer;transition:all .25s;border:none;text-decoration:none;text-transform:uppercase;letter-spacing:.5px}
.btn--primary{background:var(--btn-bg);color:var(--btn-text);box-shadow:0 2px 12px rgba(0,0,0,.1)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,0,0,.15);background:var(--btn-hover);color:var(--btn-text)}
.btn--outline{background:transparent;color:var(--hero-text);border:2px solid rgba(255,255,255,.3)}
.btn--outline:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}
.btn--ghost{background:transparent;color:#0d6ab5;border:2px solid var(--border)}
.btn--ghost:hover{border-color:var(--primary);background:var(--badge-bg)}

/* USP STRIP */
.usp-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border-light);border-radius:14px;overflow:hidden;background:var(--surface)}
.usp-item{padding:28px 24px;text-align:center;border-right:1px solid var(--border-light)}
.usp-item:last-child{border-right:none}
.usp-item__icon{font-size:28px;margin-bottom:10px}
.usp-item__title{font-size:14px;font-weight:700;margin-bottom:4px}
.usp-item__text{font-size:13px;color:var(--text-muted)}

/* SERVICE CARDS */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.service-card{background:#fff;background:var(--surface);border:1px solid var(--border-light);border-radius:14px;padding:32px 28px;transition:all .3s;position:relative;overflow:hidden}
.service-card:hover{box-shadow:var(--card-hover);border-color:var(--primary);transform:translateY(-4px)}
.service-card__icon{width:52px;height:52px;border-radius:12px;background:var(--badge-bg);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:20px}
.service-card h2,.service-card h3{font-size:18px;font-weight:700;margin-bottom:10px;color:#333;color:var(--text)}
.service-card p{font-size:14px;color:#5c5c5c;color:var(--text-sec);line-height:1.6;margin-bottom:18px}
.service-card__link{font-size:14px;font-weight:700;display:inline-flex;align-items:center;gap:6px;color:#0d6ab5;color:var(--link)}
.service-card__link::after{content:'→';transition:transform .2s}
.service-card:hover .service-card__link::after{transform:translateX(4px)}

/* STEPS */
.steps{counter-reset:step}
.step{display:flex;gap:24px;padding:24px 0;counter-increment:step;position:relative}
.step::before{content:counter(step);flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--badge-bg);color:var(--step-color);font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;border:2px solid var(--primary)}
.step+.step{border-top:1px dashed var(--border)}
.step h3{font-size:16px;font-weight:700;margin-bottom:4px}
.step p{font-size:14px;color:var(--text-sec)}

/* FAQ */
.faq-list{border:1px solid var(--border-light);border-radius:14px;overflow:hidden}
.faq-item{border-bottom:1px solid var(--border-light)}
.faq-item:last-child{border-bottom:none}
.faq-q{width:100%;padding:20px 24px;background:none;border:none;text-align:left;font-size:15px;font-weight:600;font-family:'Lato',sans-serif;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:background .2s}
.faq-q:hover{background:var(--surface-alt)}
.faq-q::after{content:'+';font-size:22px;font-weight:400;color:var(--primary);transition:transform .3s;flex-shrink:0}
[data-theme="a"] .faq-q::after{color:var(--accent)}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-a{max-height:600px}
.faq-a__inner{padding:0 24px 20px;font-size:14px;color:var(--text-sec);line-height:1.7}
.faq-category{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent);margin:40px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--border-light)}
.faq-category:first-child{margin-top:0}

/* TESTIMONIALS */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.testimonial{background:#f8f7f4;background:var(--quote-bg);border-radius:14px;padding:28px;border-left:4px solid var(--quote-border)}
.testimonial blockquote{font-size:14px;font-style:italic;line-height:1.7;color:#5c5c5c;color:var(--text-sec);margin-bottom:14px}
.testimonial__author{font-size:13px;font-weight:700;color:#333;color:var(--text)}
.testimonial__role{font-size:12px;color:#636363;color:var(--text-muted)}

/* CTA SECTION */
.cta-section{background:var(--hero-bg);color:var(--hero-text);text-align:center;padding:70px 0;position:relative;overflow:hidden}
.cta-section h2{font-family:'Playfair Display',serif;font-size:clamp(24px,3.5vw,36px);font-weight:700;margin-bottom:14px}
.cta-section h2 em{font-style:italic;color:var(--hero-accent)}
.cta-section p{font-size:16px;opacity:.85;margin-bottom:28px;max-width:500px;margin-inline:auto}

/* CONTENT PAGES */
.page-hero{background:var(--hero-bg);color:var(--hero-text);padding:70px 0 60px}
.page-hero h1{font-family:'Playfair Display',serif;font-size:clamp(28px,4vw,42px);font-weight:700;line-height:1.2;margin-bottom:14px}
.page-hero h1 em{font-style:italic;color:var(--hero-accent)}
.page-hero p{font-size:17px;opacity:.85;max-width:620px}
.content-section h2{font-size:24px;font-weight:700;margin-bottom:14px}
.content-section h3{font-size:18px;font-weight:700;margin-bottom:8px}
.content-section p,.content-section li{font-size:15px;color:var(--text-sec);line-height:1.7}

/* Benefits */
.benefits-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.benefit-item{display:flex;gap:14px;padding:18px 20px;background:var(--surface-alt);border-radius:10px}
.benefit-item__icon{font-size:20px;flex-shrink:0;margin-top:2px}
.benefit-item h3{font-size:14px;font-weight:700;margin-bottom:4px}
.benefit-item p{font-size:13px;color:var(--text-muted);margin:0}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.contact-form label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:8px;font-size:15px;font-family:'Lato',sans-serif;transition:border-color .2s;background:var(--surface);color:var(--text)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:2px solid var(--primary);outline-offset:2px;border-color:var(--primary)}
.contact-form textarea{min-height:140px;resize:vertical}
.form-group{margin-bottom:20px}
.contact-info-card{background:var(--surface-alt);border-radius:14px;padding:28px;margin-bottom:20px}
.contact-info-card h3{font-size:16px;font-weight:700;margin-bottom:14px}
.contact-info-card p{font-size:14px;color:var(--text-sec);line-height:1.7;margin-bottom:6px}
.contact-info-card a{font-weight:600}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:560px}
.team-card{background:var(--surface-alt);border-radius:14px;padding:28px;text-align:center}
.team-card__avatar{width:72px;height:72px;border-radius:50%;background:var(--badge-bg);margin:0 auto 14px;display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--step-color);font-weight:700}
.team-card h3{font-size:16px;font-weight:700;margin-bottom:2px}
.team-card p{font-size:13px;color:var(--text-muted)}

/* Crosslinks */
.crosslink-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.crosslink-card{display:flex;align-items:center;gap:16px;padding:20px;background:var(--surface);border:1px solid var(--border-light);border-radius:10px;transition:all .25s}
.crosslink-card:hover{border-color:var(--primary);box-shadow:var(--card-shadow);transform:translateY(-2px);color:var(--text)}
.crosslink-card__icon{font-size:24px;flex-shrink:0}
.crosslink-card h3{font-size:14px;font-weight:700;margin-bottom:2px;color:var(--text)}
.crosslink-card p{font-size:13px;color:var(--text-muted);margin:0}

/* Section headers */
.section-header{margin-bottom:40px}
.section-header__badge{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#0d6ab5;margin-bottom:10px}
.section-header h2{font-family:'Playfair Display',serif;font-size:clamp(24px,3.5vw,36px);font-weight:700;line-height:1.2;margin-bottom:10px}
.section-header p{font-size:16px;color:var(--text-sec);max-width:600px}

/* FOOTER */
.footer{background:var(--footer-bg);color:var(--footer-text);padding:56px 0 32px}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.footer__heading{font-size:14px;font-weight:700;color:#fff;margin-bottom:16px}
.footer__brand p{font-size:14px;line-height:1.7;margin-bottom:12px}
.footer__brand .footer-logo{height:30px;margin-bottom:14px}
.footer ul{list-style:none}
.footer li{margin-bottom:8px}
.footer a{color:var(--footer-text);font-size:14px}
.footer a:hover{color:#fff}
.footer__bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;font-size:13px;display:flex;justify-content:center;align-items:center;gap:24px;flex-wrap:wrap}
.footer__bottom a{color:inherit}
.footer__legal a{margin-left:20px;padding:8px 0;display:inline-block}
.footer__legal{display:flex;flex-wrap:wrap;justify-content:center;gap:0}
.footer__disclaimer{text-align:center;font-size:11px;color:rgba(255,255,255,.65);margin-top:16px}

/* RESPONSIVE */
@media(max-width:900px){
  .services-grid,.testimonials-grid{grid-template-columns:1fr}
  .usp-strip{grid-template-columns:repeat(2,1fr)}
  .usp-item:nth-child(2){border-right:none}
  .contact-grid,.benefits-grid,.crosslink-grid,.team-grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr 1fr}
  .hero__octopus{width:200px}
}
@media(max-width:1024px){
  .nav__links{display:none;position:absolute;top:68px;left:0;right:0;background:var(--nav-bg);border-bottom:1px solid var(--border);flex-direction:column;padding:16px 24px;gap:4px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
  [data-theme="a"] .nav.scrolled .nav__links{background:var(--nav-fixed-bg)}
  .nav__links.open{display:flex}
  .nav__toggle{display:block}
  .nav__cta{margin-top:8px}
}
@media(max-width:768px){
  .hero{padding:60px 0 50px}
  .hero__inner{flex-direction:column;text-align:center}
  .hero__octopus{width:180px;order:-1}
  .hero__actions{justify-content:center}
  .section{padding:56px 0}
  .usp-strip{grid-template-columns:1fr}
  .usp-item{border-right:none;border-bottom:1px solid var(--border-light)}
  .usp-item:last-child{border-bottom:none}
  .footer__grid{grid-template-columns:1fr;gap:28px}
  .footer__bottom{flex-direction:column;gap:12px;text-align:center}
  .footer__legal{flex-direction:column;gap:4px}
  .footer__legal a{margin-left:0;padding:6px 0}
}

/* ANIMATIONS */
@keyframes fadeInUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.animate-in{opacity:0;animation:fadeInUp .6s ease forwards}
.animate-in:nth-child(1){animation-delay:.05s}
.animate-in:nth-child(2){animation-delay:.12s}
.animate-in:nth-child(3){animation-delay:.19s}
.animate-in:nth-child(4){animation-delay:.26s}
.hero h1{animation:fadeInUp .7s ease .1s forwards;opacity:0}
.hero p{animation:fadeInUp .7s ease .25s forwards;opacity:0}
.hero__actions{animation:fadeInUp .7s ease .4s forwards;opacity:0}
.hero__badge{animation:fadeInUp .5s ease 0s forwards;opacity:0}

/* === UPDATES v2 === */

/* Service notice banner */
.service-notice {
  background: rgba(var(--primary-rgb, 252,204,0), 0.15);
  border-left: 4px solid var(--primary);
  padding: 12px 16px;
  border-radius: 0 8px 8px 0;
  font-size: 14px;
  margin-top: 12px;
  color: var(--text);
}
.service-notice strong { color: var(--text, #333); }
[data-theme="b"] .service-notice { background: rgba(8,145,178,0.1); border-color: #0891B2; }
[data-theme="c"] .service-notice { background: rgba(232,93,58,0.1); border-color: #E85D3A; }

.benefit-notice {
  font-size: 12px;
  color: var(--primary-dark, #996600);
  font-style: italic;
  margin-top: 4px;
  padding: 4px 8px;
  background: rgba(252,204,0,0.1);
  border-radius: 4px;
}

/* Team photo placeholders */
.team-card__photo {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 16px;
  border: 3px solid var(--primary);
}
.team-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Map container */
.map-container {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}
.map-container iframe {
  display: block;
}

/* Impressum page */
.legal-content {
  max-width: 720px;
  line-height: 1.8;
}
.legal-content p { margin-bottom: 12px; }
.legal-content strong { color: var(--text); }

/* Content example page */
.article-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.article-meta span { display: flex; align-items: center; gap: 6px; }
.article-body { max-width: 740px; line-height: 1.9; overflow-wrap: break-word; word-wrap: break-word; }
.article-body img, .article-body iframe, .article-body figure { max-width: 100%; height: auto; }
.article-body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.article-body .wp-block-table { overflow-x: auto; }
.article-body .alignwide, .article-body .alignfull { max-width: 100%; margin-left: 0; margin-right: 0; }
.article-body > * { max-width: 100%; box-sizing: border-box; }
.article-body h2 { margin: 32px 0 12px; font-size: 1.4rem; }
.article-body h3 { margin: 24px 0 8px; font-size: 1.15rem; }
.article-body p { margin-bottom: 16px; }
.article-body ul { margin: 0 0 16px 24px; }
.article-body ul li { margin-bottom: 6px; line-height: 1.7; }
.article-sidebar {
  position: sticky;
  top: 100px;
}
.sidebar-card {
  background: var(--bg-alt, #f5f5f5);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
}
.sidebar-card h3 { margin-bottom: 10px; font-size: 15px; }
.sidebar-card ul { list-style: none; padding: 0; }
.sidebar-card ul li { padding: 6px 0; font-size: 14px; border-bottom: 1px solid rgba(0,0,0,0.05); }
.sidebar-card ul li:last-child { border: none; }
.sidebar-card ul li a { color: var(--primary-dark, var(--link)); }
.article-layout {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 48px;
  align-items: start;
}
@media (max-width: 900px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-sidebar { position: static; }
}

.info-box {
  background: rgba(var(--primary-rgb, 252,204,0), 0.1);
  border: 1px solid rgba(var(--primary-rgb, 252,204,0), 0.3);
  border-radius: 10px;
  padding: 20px;
  margin: 20px 0;
}
.info-box h3 { margin-bottom: 8px; }
.comparison-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 20px 0; }
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  margin: 20px 0;
}
.comparison-table th,
.comparison-table td {
  padding: 10px 14px;
  text-align: left;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
@media (max-width:600px) {
  .comparison-table { font-size: 12px; }
  .comparison-table th, .comparison-table td { padding: 8px 6px; }
}
.comparison-table th {
  background: var(--dark, #333);
  color: #fff;
  font-weight: 600;
}
.comparison-table tr:nth-child(even) td {
  background: rgba(0,0,0,0.02);
}

/* Fix: service-notice in dark hero sections */
.page-hero .service-notice {
  background: rgba(255,255,255,0.12);
  color: #fff;
  border-left-color: var(--primary, #fc0);
}
.page-hero .service-notice strong { color: var(--primary, #fc0); }

/* Variante D: Blau-Betont (octopus.at Blau #147ecc prominent) */
[data-theme="d"]{
  --primary:#147ecc;--primary-dark:#0d5a94;--primary-light:#4da3e8;
  --accent:#1a3a5c;--accent-light:#2a5580;
  --dark:#1a3a5c;--dark-deeper:#0d2844;
  --surface:#fff;--surface-alt:#f0f6fc;--surface-warm:#e8f1fa;
  --border:#c0d8ed;--border-light:#d8e8f5;
  --text:#1a2a3a;--text-sec:#3a5a7a;--text-muted:#5a7a9a;
  --text-on-primary:#fff;--text-on-dark:#fff;
  --hero-bg:linear-gradient(135deg,#147ecc 0%,#1a3a5c 100%);--hero-text:#fff;--hero-accent:#fc0;
  --nav-bg:#fff;--nav-text:#1a3a5c;--nav-hover-bg:#f0f6fc;--nav-hover-text:#147ecc;
  --nav-active-bg:#147ecc;--nav-active-text:#fff;
  --nav-fixed-bg:#fff;--nav-fixed-text:#1a3a5c;--nav-fixed-hover:#147ecc;
  --footer-bg:#0d2844;--footer-text:rgba(255,255,255,.7);
  --badge-bg:#e0edf8;--badge-text:#147ecc;
  --cta-bg:#147ecc;--cta-text:#fff;--cta-hover:#0d5a94;
  --btn-bg:#147ecc;--btn-text:#fff;--btn-hover:#0d5a94;
  --card-shadow:0 2px 16px rgba(20,126,204,.05);--card-hover:0 8px 30px rgba(20,126,204,.12);
  --step-color:#147ecc;--link:#147ecc;
  --quote-border:#147ecc;--quote-bg:#f0f6fc;
}
[data-theme="d"] .nav__logo .logo-white{display:none}
[data-theme="d"] .nav__logo .logo-dark{display:block}
[data-theme="d"] .hero{background:linear-gradient(135deg,#147ecc 0%,#0d5a94 60%,#1a3a5c 100%)}
[data-theme="d"] .page-hero{background:linear-gradient(135deg,#147ecc 0%,#1a3a5c 100%)}
[data-theme="d"] .cta-section{background:linear-gradient(135deg,#147ecc,#1a3a5c)}
[data-theme="d"] .footer__heading{color:#4da3e8}
[data-theme="d"] .service-notice{background:rgba(20,126,204,0.1);border-color:#147ecc}
[data-theme="d"] .page-hero .service-notice{background:rgba(255,255,255,.12);color:#fff;border-left-color:#fc0}
[data-theme="d"] .page-hero .service-notice strong{color:#fc0}
[data-theme="d"] .comparison-table th{background:#1a3a5c}
[data-theme="d"] .info-box{background:rgba(20,126,204,0.08);border-color:rgba(20,126,204,0.2)}
[data-theme="d"] .section h2 em,[data-theme="d"] .section h3 em{color:#147ecc}
[data-theme="d"] .section-header__badge{background:#e0edf8;color:#147ecc}

/* Team grid: 3 members */
.team-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.team-grid{grid-template-columns:1fr}}

/* Form checkbox alignment */
.form-check{display:flex;align-items:flex-start;gap:10px;margin:16px 0 20px}
.form-check input[type="checkbox"]{margin-top:4px;flex-shrink:0;width:18px;height:18px}
.form-check label{font-size:14px;line-height:1.5;cursor:pointer}

/* Form checkbox: no bold */
.form-check label{font-weight:400}

/* DSE consent toggle boxes */
.dse-consent-box{background:var(--surface-alt,#f8f7f4);border:1px solid var(--border,#ddd);border-radius:8px;padding:16px 20px;margin:16px 0}

/* Borlabs Widget versteckt (bleibt im DOM fuer Footer Cookie-Link) */
.brlbs-cmpnt-widget{display:none!important}

/* Card link text (Wissensportal "Jetzt lesen") */
.card-link-text{color:#0d6ab5;font-size:14px;font-weight:600}

/* ============================================================
   ACCESSIBILITY
   ============================================================ */

/* Skip-Link: nur sichtbar bei Fokus */
.skip-link{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{position:fixed;top:0;left:16px;width:auto;height:auto;padding:8px 16px;margin:0;overflow:visible;clip:auto;white-space:normal;background:var(--primary,#ffcc00);color:var(--text,#333);font-weight:700;font-size:14px;z-index:10000;border-radius:0 0 4px 4px;text-decoration:none}

/* Focus-Visible: sichtbarer Fokusring fuer alle interaktiven Elemente */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary,#ffcc00);outline-offset:2px}

/* FAQ-Buttons: expanded-state */
.faq-q[aria-expanded="true"]{font-weight:700}

/* Reduzierte Bewegung */
@media(prefers-reduced-motion:reduce){*,.animate-in{animation:none!important;transition:none!important}}
