/*
Theme Name: Domolis Child
Theme URI: https://domolis-conseil.com
Description: Child theme for Domolis (responsive version).
Author: Domolis
Template: twentytwentyfour
Version: 1.1.0
*/

:root{
  --domolis-primary: #41778a; /* primary */
  --domolis-accent: #e9a146;  /* accent */
  --domolis-warn: #a62930;    /* warn / secondary */
  --domolis-body-font: 'Montserrat', sans-serif;
}

/* Import Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&display=swap');

body{ font-family: var(--domolis-body-font); color: #222; margin:0; background:#fff; }

/* === HEADER === */
.site-header{ background: var(--domolis-primary); color: #fff; padding: 15px 0; position:relative; }
.site-header .brand h1{ margin:0; font-weight:600; font-size:1.4rem; }
.main-nav{ display:flex; gap:20px; justify-content:flex-end; align-items:center; }
.main-nav a{ color:#fff; text-decoration:none; font-weight:500; }
.main-nav a:hover{ color:var(--domolis-accent); }

/* === HERO === */
.hero{ padding:80px 0; background:linear-gradient(180deg, rgba(65,119,138,0.1), rgba(233,161,70,0.05)); text-align:center; }
.hero h1{ font-size:2.2rem; margin-bottom:10px; }
.hero .tagline{ font-size:1.1rem; margin-bottom:24px; color:#0b2b33; }

/* === LAYOUT === */
.container{ max-width:1100px; margin:0 auto; padding:0 20px; }
.services-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.project-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; }

/* === COMPONENTS === */
a.cta{ background:var(--domolis-accent); color:#111; padding:12px 20px; border-radius:6px; text-decoration:none; display:inline-block; transition:background 0.2s ease; }
a.cta:hover{ background:#f3b661; }
.button-outline{ border:2px solid var(--domolis-primary); color:var(--domolis-primary); padding:8px 14px; border-radius:6px; text-decoration:none; transition:all 0.2s ease; }
.button-outline:hover{ background:var(--domolis-primary); color:#fff; }

/* === TYPOGRAPHY === */
h1,h2,h3{ color: #0b2b33; font-weight:600; margin-top:0; }
h1{ font-size:2rem; }
.mission-single .mission-content p{ line-height:1.6; }
.highlight{ color:var(--domolis-warn); }

/* === FOOTER === */
.site-footer{ background:#111; color:#fff; padding:30px 0; text-align:center; font-size:0.9rem; }

/* === CARDS === */
.card{ background:#fff; border:1px solid #eee; padding:18px; border-radius:8px; box-shadow:0 6px 18px rgba(10,10,10,0.03); }
.card img{ width:100%; border-radius:8px 8px 0 0; }

/* === RESPONSIVE NAVIGATION === */
.menu-toggle{ display:none; position:absolute; right:20px; top:18px; background:none; border:none; color:#fff; font-size:1.5rem; cursor:pointer; }
@media (max-width:768px){
  .main-nav{ display:none; flex-direction:column; position:absolute; top:60px; right:0; background:var(--domolis-primary); width:100%; padding:20px 0; text-align:center; }
  .main-nav.active{ display:flex; }
  .menu-toggle{ display:block; }
}

/* === RESPONSIVE GRID & TEXT === */
@media (max-width:768px){
  .hero{ padding:60px 0; }
  .hero h1{ font-size:1.8rem; }
  .hero .tagline{ font-size:1rem; }
  .services-grid, .project-grid{ grid-template-columns:1fr; }
  .container{ padding:0 16px; }
  a.cta{ padding:10px 16px; font-size:0.95rem; }
  h2{ font-size:1.4rem; }
}

@media (max-width:480px){
  .hero h1{ font-size:1.6rem; }
  .hero .tagline{ font-size:0.95rem; }
  body{ font-size:0.95rem; }
  .site-header{ padding:12px 0; }
}