/*
Theme Name: Welcome Service
Theme URI: https://welcomeservice.ma/
Author: Welcome Service
Author URI: https://welcomeservice.ma/
Description: Thème vitrine pour Welcome Service (cuisines équipées, meubles TV, habillage mural, salles de bains). Couleurs respectent le logo.
Version: 1.0.0
License: GPL-2.0+
Text Domain: welcomeservice
*/

:root {
  --ws-navy: #0B2434;
  --ws-gold: #C5A46D;
  --ws-offwhite: #F9F9F9;
  --ws-ink: #0D1117;
  --ws-gray: #2E2E2E;
  --ws-radius: 14px;
}

html, body {
  margin:0; padding:0;
  color: var(--ws-offwhite);
  background: var(--ws-navy);
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height: 1.6;
}

a { color: var(--ws-gold); text-decoration: none; }
a:hover { text-decoration: underline; }

.container {
  width: min(1200px, 92%);
  margin: 0 auto;
}

.site-header {
  background: var(--ws-navy);
  border-bottom: 1px solid rgba(255,255,255,.08);
  position: sticky; top:0; z-index: 40;
}

.header-inner {
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px 0;
}

.brand { display:flex; align-items:center; gap:12px; }
.brand img { width:52px; height:auto; border-radius: 8px; }
.brand .title { font-weight:800; letter-spacing:.5px; }

.nav-toggle { display:none; background:none; border:none; color:var(--ws-offwhite); font-size:26px; }

.primary-nav { display:flex; gap:24px; align-items:center; }
.primary-nav a { color:var(--ws-offwhite); font-weight:600; }
.primary-nav .btn-cta { background: var(--ws-gold); color: var(--ws-ink); padding:10px 16px; border-radius: 999px; font-weight:700; }

.hero {
  padding: 80px 0 40px;
  background: linear-gradient(180deg, rgba(197,164,109,.15), rgba(11,36,52,0));
}

.hero-grid {
  display:grid; grid-template-columns: 1.2fr .8fr; gap: 32px; align-items:center;
}

.card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--ws-radius);
  padding: 20px;
}

.section-title { font-size: clamp(26px, 3vw, 36px); margin: 8px 0 12px; }
.lead { font-size: clamp(16px, 2vw, 18px); opacity:.92; }

.grid-3 {
  display:grid; gap:18px;
  grid-template-columns: repeat(3, 1fr);
}

.service {
  padding:18px; border-radius: var(--ws-radius);
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
}

.badge { background: rgba(197,164,109,.12); color: var(--ws-gold); padding:6px 10px; border-radius:999px; font-weight:700; font-size:12px; }

.cta { text-align:center; padding:40px 0 70px; }
.cta .btn { background: var(--ws-gold); color: var(--ws-ink); padding:14px 24px; border-radius: 999px; font-weight:800; }

.site-footer {
  border-top:1px solid rgba(255,255,255,.08);
  padding: 36px 0; margin-top: 40px;
  font-size: 14px; opacity:.9;
}

.projects-grid {
  display:grid; grid-template-columns: repeat(3, 1fr); gap:16px;
}

.project-card img { width:100%; height:220px; object-fit:cover; border-radius: 12px; }
.project-card h3 { margin:.6rem 0 .2rem; font-size:18px; }

@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .projects-grid { grid-template-columns: 1fr; }
  .nav-toggle { display:block; }
  .primary-nav { display:none; flex-direction:column; gap:12px; background: var(--ws-navy); padding: 12px 0; }
  .primary-nav.open { display:flex; }
}