/*
Theme Name: LAA Avocats (Gold v3.1 – Expertises + Mobile)
Author: ChatGPT
Description: Accueil (slide 2), A propos (slide 3), En savoir plus (photo à droite), or/noir, pages préremplies.
\g<1>1.5.2(2)
Text Domain: laa-avocats
*/

:root{
  --gold:#C9A43A;
  --ivory:#FFF7E6;
  --black:#000;
  --text:#222;
  --muted:#666;
}

*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}
.container{width:92%;max-width:1200px;margin:auto}
.section{padding:3rem 0;border-bottom:1px solid #eee}

header.site-header{background:var(--black);color:#fff}
header .brand{display:flex;align-items:center;gap:1rem}
header .brand img{height:110px}
header .site-name{color:#fff;margin:0;font-weight:600;letter-spacing:.4px}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.2rem;flex-wrap:wrap}
.main-nav a{color:#fff;text-decoration:none;padding:.7rem 0;border-bottom:2px solid transparent}
.main-nav a:hover{border-bottom-color:var(--gold)}

.btn{display:inline-block;padding:.85rem 1.2rem;border-radius:999px;text-decoration:none;font-weight:600}
.btn-primary{background:var(--gold);color:#000}
.btn-outline{border:2px solid var(--gold);color:var(--gold)}
.btn-outline:hover{background:var(--gold);color:#000}

.hero{background:var(--black);color:#fff;text-align:center;padding:5rem 1rem}
.hero .logo{width:170px;max-width:40vw;height:auto;margin-bottom:1rem}
.hero h1{font-size:clamp(28px,4.5vw,48px);margin:.2rem 0 .4rem}
.hero p.tagline{font-size:clamp(16px,2.5vw,20px);color:#ddd;margin:0 0 1.2rem}
.hero .cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

.expertises{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
.card{border:1px solid #eee;border-radius:14px;padding:1rem;background:#fff;transition:transform .15s ease, box-shadow .15s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.06)}
.card a{color:#000;text-decoration:none}
.card h3{margin:.3rem 0 .6rem;font-weight:500}
.card p{color:var(--muted);font-size:.95rem;margin:0}

.split{display:grid;grid-template-columns:1fr 420px;gap:2rem;align-items:start}
.split.right{grid-template-columns:420px 1fr}
.split img{width:100%;height:auto;border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,.08)}
@media (max-width:900px){ .split,.split.right{grid-template-columns:1fr} }

.map iframe{width:100%;height:360px;border:0;border-radius:12px}

.site-footer{background:#000;color:#fff;text-align:center;padding:1.2rem}
.site-footer a{color:var(--gold)}

.notice{background:#e7f7ea;border:1px solid #bde5c8;padding:10px 12px;border-radius:8px;color:#20543a}
.error{background:#fdecea;border:1px solid #f5c6cb;padding:10px 12px;border-radius:8px;color:#7a1e1e}

form .row{display:flex;gap:1rem;flex-wrap:wrap}
form .row > div{flex:1;min-width:240px}
form label{display:block;margin:.5rem 0 .25rem}
form input, form textarea{width:100%;padding:.7rem;border:1px solid #ccc;border-radius:8px}
form button{margin-top:.6rem;background:var(--gold);color:#000;border:none;padding:.8rem 1.2rem;border-radius:999px;cursor:pointer;font-weight:600}
form button:hover{filter:brightness(0.95)}


/* v3.1 tweaks */
.split img{max-width:360px}
.split.right img{max-width:360px}
.hero .home-photo{width:320px;max-width:38vw;height:auto;border-radius:12px;margin-top:1rem;box-shadow:0 6px 18px rgba(0,0,0,.08)}
@media (max-width:900px){ .hero .home-photo{width:220px} }


/* v3.2 tweaks */
header .brand img{height:110px}
.hero{padding:4rem 0}
.hero .wrap{display:grid;grid-template-columns:1.2fr .9fr;gap:2rem;align-items:center}
@media (max-width:980px){ .hero .wrap{grid-template-columns:1fr} }
.hero .home-photo{width:360px;max-width:46vw;height:auto;border-radius:12px;margin:0 auto;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.hero h1{margin:0 0 .5rem}
.hero p.tagline{margin:0 0 1.2rem}
.hero .cta{justify-content:flex-start}
.container.narrow .page-content{max-width:800px}
.split, .split.right{grid-template-columns:1.2fr 420px}
.split.right article .page-content{max-width:820px}


/* v3.5 — Expertise typography & quote form */
.page-content h2{margin:1.2rem 0 .6rem;font-weight:600;color:#000}
.page-content h3{margin:1rem 0 .4rem;font-weight:600;color:#000}
.page-content p{line-height:1.7;margin:.6rem 0}
.page-content ul{margin:0 0 1rem 1.2rem}
.page-content ul li{margin:.35rem 0;padding-left:.2rem}

.expertise-callout{background:#fff;border:1px solid #eee;border-left:4px solid var(--gold);padding:1rem;border-radius:10px;margin:1rem 0}
.expertise-callout p{margin:0}

.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:900px){.quote-grid{grid-template-columns:1fr}}
.quote-grid .field{display:flex;flex-direction:column}
.quote-grid label{font-weight:600;margin:.3rem 0}
.quote-grid input,.quote-grid select,.quote-grid textarea{padding:.65rem;border:1px solid #ccc;border-radius:8px}
.small-note{font-size:.9rem;color:#666;margin-top:.2rem}
.badge{display:inline-block;background:var(--gold);color:#000;border-radius:999px;padding:.25rem .6rem;font-weight:600;font-size:.85rem}
.btn-wide{min-width:240px;text-align:center}

/* Custom header background color */
header, .site-header, .navbar, .main-header {
    background-color: #04213E !important;
}

/* Custom font color for header text */
.site-title, .navbar a, .site-description {
    color: white !important;
}

/* Ensure similar checkbox styles */
input[type='checkbox'], input[type='radio'] {
    margin-right: 10px;
    margin-left: 10px;
}

/* Reduce space between the options */
.form-group, .checkbox-group {
    margin-bottom: 10px;
}

/* Align checkboxes with text */
.checkbox-group input[type='checkbox'] {
    vertical-align: middle;
}


/* === Final mobile/tablette & layout tuning (Aug 2025) === */
:root{ --bg:#F7F9FC; --surface:#FFFFFF; --gold:#C9A43A; --black:#000; --text:#222; --muted:#666; }
body{ background:var(--bg) !important; }
.section{ border-bottom:1px solid rgba(4,33,62,.08) !important; }

/* Hero background color */
.hero{ background:#04213E !important; color:#fff; }
.hero .cta{ justify-content:center !important; }

/* Header & brand */
.site-header{ position:sticky; top:0; z-index:1000; }
.site-header .brand img{ height:140px; max-height:24vh; }

/* Mobile menu */
.nav-toggle{ display:none; background:transparent; border:2px solid var(--gold); color:var(--gold); padding:.4rem .8rem; border-radius:999px; font-weight:600; }
@media(max-width:980px){
  .nav-toggle{ display:inline-block; }
  .main-nav{ display:none; width:100%; }
  .main-nav.open{ display:block; }
  .main-nav ul{ list-style:none; padding:0; margin:.6rem 0 0; display:flex; flex-direction:column; gap:.3rem; }
  .main-nav a{ display:block; padding:.6rem .8rem; border-radius:12px; background:rgba(255,255,255,.04); color:#fff; text-decoration:none; }
}

/* Forms: devis checkboxes/radios aligned */
.inline-options{ display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center; margin:.3rem 0 .6rem; }
.inline-options label{ display:inline-flex; align-items:center; gap:.4rem; margin:0; }
.inline-options input[type="checkbox"],
.inline-options input[type="radio"]{ width:auto; height:auto; vertical-align:middle; float:none; margin:0 .5rem 0 0; }

/* Contact CTA full-width on mobile */
@media(max-width:700px){
  .contact-cta{ display:flex; flex-direction:column; align-items:stretch; gap:.6rem; }
  .contact-cta .btn{ width:100%; min-height:48px; text-align:center; }
  .site-header{ padding:.35rem 0 !important; }
  .site-header .brand img{ height:clamp(64px,16vw,120px) !important; }
}

/* Expertises grid: 2 columns from tablets, equal heights */
.expertises{ display:grid; gap:1.2rem; grid-template-columns:1fr; }
@media(min-width:700px){ .expertises{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.expertises .card{ display:flex; background:var(--surface); border:1px solid rgba(4,33,62,.08); border-radius:16px; padding:1.1rem; box-shadow:0 6px 14px rgba(4,33,62,.05); }
.expertises .card a{ display:flex; flex-direction:column; height:100%; color:inherit; text-decoration:none; }
.expertises .card h3{ margin:.2rem 0 .2rem; font-weight:600; }
.expertises .card p{ margin-top:auto; color:var(--muted); }

/* Contact page styling */
.contact-block{ background:var(--surface); border:1px solid rgba(4,33,62,.08); border-radius:14px; padding:1.2rem; }
.contact-list{ list-style:none; padding:0; margin:0 0 1rem; display:grid; gap:.4rem; }
.contact-list a{ text-decoration:none; }
.contact-block .map{ margin-top:.8rem; border-radius:12px; overflow:hidden; }
.contact-block .map iframe{ width:100%; height:360px; border:0; }
@media(min-width:900px){ .contact-block .map iframe{ height:420px; } }


/* Hero: afficher le logo en grand à la place de la photo */
.hero .logo-hero{
  width:clamp(240px, 46vw, 640px);
  max-width:100%;
  height:auto;
  display:block;
  margin:0 auto;
  border-radius:0;
  box-shadow:none;
}


/* === Header logo size doubled (desktop & mobile) === */
.site-header .brand img{ height:280px !important; max-height:none !important; }
@media (max-width:700px){
  .site-header .brand img{ height:clamp(128px, 32vw, 240px) !important; }
}


/* === Header logo size tuned (reduced) === */
.site-header .brand img{ height:180px !important; max-height:24vh !important; }
@media (max-width:700px){
  .site-header .brand img{ height:clamp(88px, 18vw, 140px) !important; }
}


/* === Hero background with transparent photo overlay (rotated) === */
.hero{
  position: relative;
  background-color: #04213E;
  overflow: hidden;
}
.hero::before{
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(4,33,62,0.78), rgba(4,33,62,0.78)),
    url('assets/home-bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}
.hero > *{ position: relative; z-index: 1; }
@media (max-width: 700px){
  .hero::before{ background-attachment: scroll; }
}

/* === Minor mobile polish (safe) === */
@media (max-width: 768px){
  .entry-content .wp-block-image img,
  .media img { max-width: 100%; height: auto; }
  .container, .wrap, .inner, .entry-content { padding-left: 16px; padding-right: 16px; }
  .site-header { padding: .35rem 0; }
  .site-header .site-name, .site-title { display: none !important; }
}


/* === Expertises grid (2×N) === */
@media(min-width:700px){
  }

/* === CTA Contact centered on mobile/tablet === */
.contact-cta{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; }
@media(max-width:1024px){
  .contact-cta{ justify-content:center; }
}
@media(max-width:700px){
  .contact-cta{ flex-direction:column; align-items:stretch; }
  .contact-cta .btn{ width:100%; max-width:420px; margin:0 auto; }
}

/* === Header more compact on mobile/tablet === */
@media(max-width:1024px){
  .site-header{ padding:.35rem 0 !important; }
  .site-header .brand img{ height:clamp(72px, 10vw, 110px) !important; max-height:none !important; }
}
@media(max-width:700px){
  .site-header{ padding:.25rem 0 !important; }
  .site-header .brand img{ height:clamp(56px, 12vw, 96px) !important; }
}


/* === CTA Contact: force row alignment (always side-by-side) === */
.contact-cta{ display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; gap:.6rem; align-items:center; }
.contact-cta .btn, .contact-cta a, .contact-cta button{ width:auto !important; min-width:140px; }
@media (max-width:480px){
  .contact-cta{ flex-wrap:wrap !important; justify-content:center; }
  .contact-cta .btn, .contact-cta a, .contact-cta button{ flex:0 0 auto; }
}


/* === LAA Avocats — Pack correctifs 2025-08-31 === */

/* Hero background color */
.hero{ background:#04213E !important; }

/* Mobile: hero full-bleed container and comfy paddings */
@media (max-width: 780px){
  .hero .container{ width:100% !important; max-width:none !important; padding-left:0 !important; padding-right:0 !important; }
  .hero{ padding-left:0 !important; padding-right:0 !important; }
  .hero .wrap{ grid-template-columns:1fr !important; }
}

/* Home — remove the 'À propos' heading block on the first columns section only */
.home .entry-content .wp-block-columns:first-of-type > .wp-block-column:first-child h2{ display:none !important; }

/* Quote form (demande de devis) — align and compact checkboxes */
.page-template-template-quote .page-content p:has(input[type="checkbox"]){ margin: 6px 0 !important; }
.page-template-template-quote .page-content input[type="checkbox"]{
  width: 16px; height: 16px;
  vertical-align: middle; margin-right: 8px;
  accent-color: #04213E;
}
.page-template-template-quote .page-content label{
  display: inline-flex; align-items: center; gap: 8px;
}
/* Ensure consistent square look across browsers */
.page-template-template-quote .page-content input[type="checkbox"]{
  -webkit-appearance: auto; appearance: auto;
}

/* Center hero CTA buttons just in case */
.hero .cta{ justify-content:center !important; text-align:center !important; }
.hero .cta .btn{ margin: 6px 8px !important; }

/* Tighten spacing image/text on homepage "À propos" block */
.home .entry-content .wp-block-image{ margin-bottom: 12px !important; }


/* Accessible hidden heading (keeps SEO, hides visually) */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}


/* v1.4.5 — Tighten gap on About page (text closer to photo) */
@media (min-width: 992px){
  .page-template-template-about .split{ gap: 1rem !important; }
}
@media (min-width: 1200px){
  .page-template-template-about .split{ gap: 1.2rem !important; }
}
/* Also reduce right/left padding slightly for that section only */
.page-template-template-about .section.container{ padding-left: 0 !important; padding-right: 0 !important; }


/* v1.4.6 — About page: shift photo slightly to the right on desktop */
@media (min-width: 992px){
  .page-template-template-about .split > div:last-child img{
    margin-left: 18px !important;
  }
}
@media (min-width: 1280px){
  .page-template-template-about .split > div:last-child img{
    margin-left: 24px !important;
  }
}


/* v1.4.7 — En savoir plus: image sous le texte en mobile */
@media (max-width: 900px){
  .page-template-template-more .split{
    display:flex !important;
    flex-direction: column !important;
    gap: .8rem !important;
  }
  .page-template-template-more .split > article{ order: 1 !important; }
  .page-template-template-more .split > div:last-child{ order: 2 !important; }
  .page-template-template-more .split img{
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    border-radius:16px !important;
  }
  .page-template-template-more .section{ padding-left:16px !important; padding-right:16px !important; }
}


/* v1.5.1 — Contact: center button labels */
.contact-cta{ display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; }
.contact-cta .btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-height:44px; /* touch size */
  line-height:1.2 !important;
  padding:.6rem 1.1rem !important;
  vertical-align:middle;
  text-align:center;
}


/* v1.5.2 — Quote form: urgency radio layout (mobile-friendly) */
.page-template-template-quote .urgent-options{
  display:grid;
  grid-auto-rows:minmax(36px,auto);
  row-gap:.5rem;
  margin:.3rem 0 1rem;
}
.page-template-template-quote .urgent-options label{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-weight:500;
}
.page-template-template-quote .urgent-options input[type="radio"]{
  width:18px; height:18px; margin:0 .4rem 0 0; vertical-align:middle;
}
@media (max-width: 700px){
  .page-template-template-quote .urgent-options label{ font-size:16px; }
}

/* v1.5.2(2) — Footer legal link */
.footer-legal .legal-link{ text-decoration:underline; }
