:root{ --primary:#0f6cbd; --primary-2:#093f78; --accent:#ff7a00;
  --text:#111827; --muted:#6b7280; --bg:#ffffff; --card:#ffffff; --border:#e5e7eb; --shadow:0 10px 30px rgba(2,8,20,.06) }
.theme-mediterranee{ --primary:#0f6cbd; --primary-2:#093f78; --accent:#ff7a00; --bg:#ffffff; --card:#ffffff; --text:#111827; --muted:#6b7280; --border:#e5e7eb }
.theme-terracotta{ --primary:#c1492e; --primary-2:#8a2e1e; --accent:#f2c14e; --bg:#fffdfb; --card:#ffffff; --text:#1f2937; --muted:#6b7280; --border:#ead9d4 }
.theme-beton{ --primary:#374151; --primary-2:#111827; --accent:#f59e0b; --bg:#f9fafb; --card:#ffffff; --text:#111827; --muted:#6b7280; --border:#e5e7eb }
.theme-sauge{ --primary:#2f855a; --primary-2:#22543d; --accent:#e6b400; --bg:#f8fbf9; --card:#ffffff; --text:#0f172a; --muted:#64748b; --border:#dbe3df }

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);line-height:1.6;background:var(--bg)}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo img{height:44px;vertical-align:middle}
.main-nav{display:flex;gap:10px;align-items:center}
.main-nav a{color:var(--text);text-decoration:none;padding:12px 10px;border-radius:8px}
.main-nav a:hover{background:#f5f7fb}
.main-nav .cta{background:var(--primary);color:#fff}
.menu-toggle{display:none;border:1px solid var(--border);background:#fff;border-radius:8px;padding:10px 12px}
@media (max-width:820px){
  .main-nav{position:fixed;inset:auto 16px 16px 16px;top:64px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;box-shadow:var(--shadow);display:none;flex-direction:column}
  .main-nav.open{display:flex}
  .menu-toggle{display:inline-block}
}

/* HERO */
.hero{padding:56px 0 24px;display:grid;gap:12px}
.hero--gradient{color:#fff;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-2) 100%)}
.hero--gradient::after{content:"";position:absolute;inset:0;background:url('/assets/pattern.svg');opacity:.12;pointer-events:none}
.hero--gradient .surface{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:12px;display:inline-block}
.hero h1{margin:0;font-size:clamp(26px,4.2vw,38px)}
.hero p.sub{margin:0;color:var(--muted);font-size:1.05rem}
.hero--gradient p.sub{color:#e6ebf5}
.badges{display:flex;gap:8px;flex-wrap:wrap}
.badge{border:1px solid var(--border);padding:6px 10px;border-radius:999px;background:#fff}
.hero--gradient .badge{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}

/* Cards, grid */
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{border:1px solid var(--border);border-radius:14px;padding:16px;background:var(--card);box-shadow:var(--shadow)}
.card h3{margin-top:0}

/* Buttons */
.btn{display:inline-block;padding:12px 16px;border-radius:10px;text-decoration:none;border:1px solid var(--border);background:#fff;transition:transform .06s ease}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#111}
.btn.ghost{background:#fff;color:var(--text)}

/* Footer */
.site-footer{margin-top:48px;padding:32px 0;background:#fbfbfc;border-top:1px solid var(--border);font-size:.95rem;color:#475569}

/* Utilities */
.phone-float{position:fixed;right:16px;bottom:16px;background:var(--primary);color:#fff;padding:12px 16px;border-radius:999px;text-decoration:none;box-shadow:var(--shadow)}
.gallery{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.gallery img{width:100%;height:180px;object-fit:cover;border-radius:12px;border:1px solid var(--border);background:#f3f4f6}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.kpi{border:1px solid var(--border);background:#fff;padding:14px;border-radius:12px;text-align:center}
.small{font-size:.95rem;color:var(--muted)}

/* Cookie banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;display:none;justify-content:space-between;align-items:center;gap:12px;box-shadow:var(--shadow)}
.cookie-actions{display:flex;gap:8px}

/* Bottom bar mobile */
.bottom-bar{position:fixed;bottom:0;left:0;right:0;display:none;gap:8px;justify-content:space-between;padding:10px;background:#ffffffcc;border-top:1px solid var(--border);backdrop-filter:blur(10px)}
.bottom-bar a{flex:1;text-align:center;border:1px solid var(--border);border-radius:10px;padding:10px;text-decoration:none;color:var(--text)}
@media (max-width:640px){.bottom-bar{display:flex}.phone-float{display:none}}

/* Theme picker */
.theme-picker{position:fixed;right:14px;top:84px;display:flex;gap:8px;background:#fff;border:1px solid var(--border);padding:8px;border-radius:12px;box-shadow:var(--shadow)}
.theme-picker button{width:22px;height:22px;border-radius:999px;border:1px solid var(--border);cursor:pointer}
.theme-mediterranee .sw1{background:linear-gradient(135deg,#0f6cbd,#093f78)}
.theme-terracotta .sw2, .sw2{background:linear-gradient(135deg,#c1492e,#8a2e1e)}
.sw1{background:linear-gradient(135deg,#0f6cbd,#093f78)}
.sw2{background:linear-gradient(135deg,#c1492e,#8a2e1e)}
.sw3{background:linear-gradient(135deg,#374151,#111827)}
.sw4{background:linear-gradient(135deg,#2f855a,#22543d)}

/* --- Fix: mobile menu contrast & backdrop --- */
#menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:blur(2px);display:none;z-index:900}
body.menu-open #menu-backdrop{display:block}
@media (max-width:820px){
  .main-nav{z-index:1000; position:fixed; left:16px; right:16px; top:70px; background:var(--card); border:1px solid var(--border); border-radius:14px; padding:10px; box-shadow:var(--shadow); display:none; flex-direction:column}
  .main-nav.open{display:flex}
  .main-nav a{display:block; color:var(--text); background:#fff; border:1px solid var(--border); padding:14px 12px; border-radius:10px; margin:4px 0; font-size:1.05rem}
  .main-nav .cta{background:var(--primary); color:#fff; border-color:var(--primary)}
}

/* --- v4 Mobile menu: full-width panel, high contrast --- */
body.menu-open{overflow:hidden}
@media (max-width:820px){
  .main-nav{
    z-index:1000; position:fixed; left:0; right:0; top:60px;
    background:#fff; border:0; border-bottom:1px solid var(--border);
    border-radius:0 0 14px 14px; padding:6px 12px 10px; box-shadow:var(--shadow);
    display:none; flex-direction:column
  }
  .main-nav.open{display:flex; animation:navDrop .12s ease-out}
  .main-nav a{
    display:block; color:var(--text); background:transparent; border:0;
    padding:14px 8px; margin:0; border-radius:8px; font-size:1.1rem
  }
  .main-nav a + a{ border-top:1px solid var(--border) }
  .main-nav .cta{ background:var(--primary); color:#fff; border:0; margin-top:6px; text-align:center }
}
@keyframes navDrop { from { transform:translateY(-6px); opacity:.85 } to { transform:none; opacity:1 } }
/* Backdrop */
#menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:blur(2px);display:none;z-index:900}
body.menu-open #menu-backdrop{display:block}

/* CSS-ONLY-MENU-V6 */
.menu-checkbox{position:absolute;left:-9999px;opacity:0;width:0;height:0}
.menu-toggle-label{display:none}
@media (max-width:820px){
  .menu-toggle-label{display:inline-block;border:1px solid var(--border);background:#fff;border-radius:8px;padding:10px 12px;cursor:pointer}
  #nav{position:fixed;left:0;right:0;top:60px;background:#fff;border:0;border-bottom:1px solid var(--border);border-radius:0 0 14px 14px;padding:8px 12px 12px;box-shadow:var(--shadow);display:none;flex-direction:column;z-index:1000}
  #nav a{display:block;color:var(--text);background:transparent;border:0;padding:14px 10px;margin:0;font-size:1.1rem}
  #nav a + a{border-top:1px solid var(--border)}
  #nav-toggle:checked ~ #nav{display:flex}
  #menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:900}
  #nav-toggle:checked ~ #menu-backdrop{display:block}
  body{overflow-x:hidden}
}

/* CSS-ONLY-MENU-V7 */
@media (max-width:820px){
  .menu-toggle-label{display:inline-block;border:1px solid var(--border);background:#fff;border-radius:8px;padding:10px 12px;cursor:pointer;z-index:1200;position:relative}
  #nav{position:fixed;left:0;right:0;top:60px;background:#fff;border:0;border-bottom:1px solid var(--border);border-radius:0 0 14px 14px;padding:8px 12px 12px;box-shadow:var(--shadow);display:none;flex-direction:column;z-index:1100}
  #nav a{display:block;color:#111;background:transparent;border:0;padding:14px 10px;margin:0;font-size:1.1rem}
  #nav a + a{border-top:1px solid var(--border)}
  #nav-toggle:checked ~ #nav{display:flex}
  #menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:1000}
  #nav-toggle:checked ~ #menu-backdrop{display:block}
}