/* ============================================================
       CRITICAL FIX — Anti-overflow horizontal
       ============================================================ */
    html, body { overflow-x: hidden !important; max-width: 100vw; }
    * { max-width: 100%; box-sizing: border-box; }
    img, video, iframe { max-width: 100% !important; height: auto; }
    .container { max-width: 1180px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

    /* Force-reset GeneratePress qui parfois met content-area trop large */
    .site, .site-content, .content-area, .site-main { max-width: 100%; overflow-x: hidden; }

    /* Hide GeneratePress double H1 (entry-title) — on garde seulement le H1 du hero du contenu */
    .home h1.entry-title { display: none !important; }
    .home .entry-header { display: none !important; }

    /* ============================================================
       TYPOGRAPHIE & GLOBAL
       ============================================================ */
    body { font-family: 'Inter', sans-serif; color: #0a1a12; font-size: 16px; line-height: 1.6; }
    h1, h2, h3, .wp-block-heading { color: #0a3a1f; letter-spacing: -.3px; }
    h1, h2 { font-family: 'Georgia', serif; font-weight: 400; }
    h3 { font-family: 'Inter', sans-serif; font-weight: 600; }
    .entry-content strong { color: #0a3a1f; }
    .entry-content a { color: #846619; font-weight: 500; }
    .entry-content a:hover { color: #d4a72c; }

    /* ============================================================
       GP Header / Nav
       ============================================================ */
    .site-header { background: #0a3a1f; border-bottom: 2px solid #d4a72c; padding: 14px 0; }
    .site-header .site-title { font-family: 'Georgia', serif; color: #d4a72c; font-size: 22px; letter-spacing: 3px; margin: 0; line-height: 1.2; }
    .site-header .site-title a { color: #d4a72c; text-decoration: none; }
    .site-header .site-description { color: #a8b8ad; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; margin-top: 4px; }
    .main-navigation { background: #0a3a1f; }
    .main-navigation .main-nav ul li a { color: #e8ede9; font-weight: 500; padding: 18px 16px; }
    .main-navigation .main-nav ul li a:hover { color: #d4a72c; }
    .main-navigation .main-nav ul li.current-menu-item > a { color: #d4a72c; }
    .main-navigation .main-nav ul li a[href*="devis"] { background: #d4a72c; color: #0a3a1f !important; margin-left: 14px; border-radius: 4px; padding: 11px 18px; font-weight: 600; }
    .main-navigation .main-nav ul li a[href*="devis"]:hover { background: #e6c25f; }

    /* ============================================================
       HERO du mockup — Force responsive
       ============================================================ */
    .hero { padding: 50px 0 60px !important; }
    .hero-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 30px !important; }
    .hero h1 { font-size: 32px !important; line-height: 1.1 !important; letter-spacing: -.5px !important; margin-bottom: 18px !important; }
    .hero h1 .gold { color: #d4a72c; font-style: italic; }
    .hero-eyebrow { font-size: 10px !important; padding: 5px 12px !important; margin-bottom: 16px !important; }
    .hero-lead { font-size: 15px !important; margin-bottom: 24px !important; }
    .hero-ctas { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; margin-bottom: 32px !important; }
    .hero-ctas .btn { width: 100% !important; justify-content: center !important; padding: 13px 20px !important; font-size: 13px !important; }
    .trust-row { gap: 12px !important; padding-top: 20px !important; }
    .trust-item { width: 100% !important; font-size: 12px !important; }
    .hero-card { padding: 22px !important; margin-top: 0 !important; }
    .hero-card-title { font-size: 10px !important; }
    .hero-card-h { font-size: 18px !important; margin-bottom: 18px !important; }
    .contact-row { padding: 12px 0 !important; gap: 12px !important; }
    .contact-ico { width: 34px !important; height: 34px !important; font-size: 16px !important; }
    .contact-row .value { font-size: 14px !important; }

    /* ============================================================
       Sections (why, services, méthode, etc.)
       ============================================================ */
    .section { padding: 50px 0 !important; }
    .section h2 { font-size: 26px !important; line-height: 1.2 !important; margin-bottom: 14px !important; }
    .section-eyebrow { font-size: 10px !important; }
    .section-sub { font-size: 15px !important; }
    .section-title { margin-bottom: 35px !important; }
    .why-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 22px !important; }
    .why-card { padding: 0 !important; }
    .why-num { width: 42px !important; height: 42px !important; font-size: 18px !important; margin-bottom: 12px !important; }
    .why-card h3 { font-size: 17px !important; }
    .why-card p { font-size: 14px !important; }
    .services-bg { padding: 55px 0 !important; }
    .services-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 16px !important; }
    .service-card { padding: 26px 22px !important; }
    .service-card.cta-card { padding: 30px 22px !important; }
    .service-num { font-size: 24px !important; margin-bottom: 14px !important; }
    .service-card h3 { font-size: 18px !important; }
    .service-card p { font-size: 14.5px !important; }

    /* ============================================================
       Page intérieure : hero + body + CTA
       ============================================================ */
    .jel-page-hero { background: linear-gradient(135deg, #0a3a1f 0%, #0c4524 60%, #1a5a3a 130%); color: #fff; padding: 50px 0 60px; position: relative; }
    .jel-page-hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle at 15% 25%, rgba(212,167,44,.08) 0%, transparent 40%); pointer-events: none; }
    .jel-page-hero .container { max-width: 880px; margin: 0 auto; padding: 0 20px; position: relative; }
    .jel-page-hero .eyebrow { display: inline-block; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: #d4a72c; font-weight: 700; margin-bottom: 14px; padding: 5px 12px; border: 1px solid rgba(212,167,44,.4); border-radius: 30px; }
    .jel-page-hero h1 { font-family: 'Georgia', serif; font-size: 30px; font-weight: 400; line-height: 1.15; letter-spacing: -.5px; color: #fff; margin: 0 0 18px; }
    .jel-page-hero .lead { font-size: 15px; color: #cad5cd; line-height: 1.6; margin-bottom: 22px; }
    .jel-page-hero .cta { display: inline-block; background: #d4a72c; color: #0a3a1f !important; padding: 12px 22px; border-radius: 4px; font-weight: 600; font-size: 13px; text-decoration: none; margin-right: 8px; margin-bottom: 8px; transition: background .2s; }
    .jel-page-hero .cta:hover { background: #e6c25f; }
    .jel-page-hero .cta-ghost { background: transparent; color: #fff !important; border: 1.5px solid rgba(255,255,255,.4); }
    .jel-page-hero .cta-ghost:hover { border-color: #d4a72c; color: #d4a72c !important; }

    body:not(.home) .entry-header { display: none; }
    body:not(.home) .entry-content { max-width: 100%; margin: 0; padding: 0; }
    body:not(.home) .entry-content > * { max-width: 760px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
    body:not(.home) .entry-content > .jel-page-hero, body:not(.home) .entry-content > .jel-cta-section { max-width: 100%; padding-left: 0; padding-right: 0; }
    body:not(.home) .entry-content h2 { font-size: 24px; margin-top: 40px; margin-bottom: 14px; }
    body:not(.home) .entry-content h3 { font-size: 18px; margin-top: 28px; margin-bottom: 10px; }
    body:not(.home) .entry-content p { font-size: 16px; line-height: 1.65; margin-bottom: 14px; }
    body:not(.home) .entry-content ul, body:not(.home) .entry-content ol { padding-left: 0; margin: 14px auto 20px; list-style: none; max-width: 720px; }
    body:not(.home) .entry-content ul li { font-size: 16px; line-height: 1.6; margin-bottom: 10px; padding-left: 26px; position: relative; }
    /* Puce en SVG et non en glyphe « ✓ » : un dingbat depend d'une police
       installee et tombe en carre vide sur certains mobiles. */
    body:not(.home) .entry-content ul li::before { content: ""; position: absolute; left: 0; top: 6px; width: 13px; height: 13px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4a72c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E") center / contain no-repeat; }
    body:not(.home) .entry-content ol { counter-reset: jel-counter; }
    body:not(.home) .entry-content ol li { counter-increment: jel-counter; font-size: 16px; margin-bottom: 14px; padding-left: 34px; position: relative; }
    body:not(.home) .entry-content ol li::before { content: counter(jel-counter, decimal-leading-zero); position: absolute; left: 0; top: 0; color: #d4a72c; font-family: 'Georgia', serif; font-size: 15px; font-style: italic; font-weight: 700; }

    /* CTA fin de page */
    .jel-cta-section { background: #faf6ea; border-top: 1px solid #e5dec1; padding: 45px 20px; text-align: center; margin-top: 40px; }
    .jel-cta-section h2 { font-family: 'Georgia', serif; color: #0a3a1f; font-size: 26px; margin: 0 0 10px; }
    .jel-cta-section p { color: #5a6a5e; font-size: 15px; margin: 0 auto 20px; max-width: 480px; }
    .jel-cta-section .cta-btn { display: inline-block; background: #0a3a1f; color: #fff !important; padding: 13px 28px; border-radius: 4px; font-weight: 600; text-decoration: none; transition: background .2s; }
    .jel-cta-section .cta-btn:hover { background: #d4a72c; color: #0a3a1f !important; }

    /* Forms */
    .entry-content form { background: #faf6ea; padding: 22px 18px; border-radius: 6px; border: 1px solid #e5dec1; margin: 20px auto; max-width: 720px; }
    .entry-content form label { display: block; font-weight: 600; color: #0a3a1f; margin-bottom: 6px; font-size: 14px; }
    .entry-content form input, .entry-content form textarea, .entry-content form select { padding: 12px 14px !important; border: 1px solid #c8cdcb !important; border-radius: 4px !important; font-size: 16px !important; font-family: 'Inter', sans-serif !important; background: #fff !important; width: 100% !important; box-sizing: border-box; }
    .entry-content form button { background: #0a3a1f !important; color: #fff !important; padding: 14px 28px !important; border-radius: 4px !important; font-weight: 600 !important; font-size: 15px !important; border: none !important; cursor: pointer !important; width: auto !important; }
    .entry-content form button:hover { background: #d4a72c !important; color: #0a3a1f !important; }

    /* Footer */
    .site-footer { background: #031a0f; color: #9aaa9d; }
    .site-footer a { color: #cfd8d2; }
    .site-footer a:hover { color: #d4a72c; }
    .site-footer .footer-widgets { padding: 40px 0 25px; }
    .site-footer .footer-widgets .widget-title { color: #d4a72c; font-family: 'Inter', sans-serif; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 14px; }
    .site-footer .site-info { background: #020f08; padding: 16px 0; font-size: 12px; color: #808f83; text-align: center; }

    /* ============================================================
       Desktop (>=880px)
       ============================================================ */
    @media (min-width: 880px) {
      .container { padding: 0 28px; }
      .hero { padding: 80px 0 95px !important; }
      .hero-grid { grid-template-columns: 1.25fr 1fr !important; gap: 50px !important; }
      .hero h1 { font-size: 52px !important; }
      .hero-eyebrow { font-size: 11px !important; padding: 7px 16px !important; }
      .hero-lead { font-size: 17px !important; }
      .hero-ctas { flex-direction: row !important; align-items: center !important; }
      .hero-ctas .btn { width: auto !important; }
      .hero-card { padding: 32px !important; }
      .hero-card-h { font-size: 22px !important; }
      .section { padding: 90px 0 !important; }
      .section h2 { font-size: 38px !important; }
      .why-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 22px !important; }
      .why-card h3 { font-size: 17px !important; }
      .services-bg { padding: 90px 0 !important; }
      .services-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 22px !important; }
      .jel-page-hero { padding: 70px 0 80px; }
      .jel-page-hero h1 { font-size: 42px; }
      body:not(.home) .entry-content h2 { font-size: 30px; margin-top: 50px; }
      .jel-cta-section { padding: 60px 28px; }
      .jel-cta-section h2 { font-size: 32px; }
    }