/* ===== LEXORA Responsive Patch (2025-10-30) ===== */
:root { --bleu-nuit:#0a0a23; --or:#d4af37; }
html { scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:#0a0a23; }
.container { max-width:1200px; margin:0 auto; padding:0 16px; }

/* Header */
.site-header{ background:var(--bleu-nuit); position:sticky; top:0; z-index:999;
  padding: calc(env(safe-area-inset-top,0) + .25rem) 2rem .25rem; }
.header-container{ max-width:1200px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.logo{ height:80px; display:block; } @media (max-width:768px){ .logo{ height:56px; } }
.menu{ list-style:none; display:flex; gap:1rem; margin:0; padding:0; flex-wrap:wrap; }
.menu a{ color:var(--or); text-decoration:none; font-weight:600; font-size:1rem; transition:opacity .2s; }
.menu a:hover{ opacity:.7; }

/* Hero */
.hero{ position:relative; min-height:68vh; padding: clamp(60px, 8vh, 120px) 16px;
  display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; }
.hero-bg{ position:absolute; inset:0;
  background-image:url('https://assets.codepen.io/14949111/creation-site-internet-local-referencement-lexora.jpg');
  background-size:cover; background-position:center; animation:heroZoom 12s ease-in-out infinite;
  z-index:0; filter:brightness(.6); }
.hero-overlay{ position:relative; z-index:1; background:rgba(10,10,35,.60);
  padding: clamp(16px, 4vw, 48px); border-radius:12px; color:var(--or); max-width:min(940px, 92vw); }
.hero h1{ font-size: clamp(1.6rem, 3.8vw, 2.4rem); margin:.2rem 0 1rem; line-height:1.2; }
.hero-subtext{ font-size: clamp(1rem, 2.6vw, 1.15rem); color:#fff; margin:0 0 1.2rem; }
.btn-primary{ background:var(--or); color:var(--bleu-nuit); padding:.9rem 1.5rem; font-size:1rem; border:none; border-radius:10px; cursor:pointer; transition:transform .25s ease; display:inline-block; }
.btn-primary:hover{ transform:scale(1.05); }
@keyframes heroZoom{ 0%{transform:scale(1)} 50%{transform:scale(1.05)} 100%{transform:scale(1)} }

/* Offre */
.offre{ background:#fff; padding: clamp(2rem, 5vw, 4rem) 1rem; }
.offre-container{ max-width:1200px; margin:auto; display:flex; flex-wrap:wrap; gap:2rem; align-items:center; }
.offre-image{ flex:1 1 420px; text-align:center; }
.offre-image img{ max-width:100%; height:auto; aspect-ratio:auto; }
.offre-texte{ flex:1 1 480px; color:#0a0a23; }
.offre-texte h2{ font-size: clamp(1.4rem, 3.6vw, 1.9rem); margin:.4rem 0 1rem; }
.offre-texte ul{ padding-left:1.2rem; margin:0 0 1rem; }
.btn-secondary{ background:var(--or); color:var(--bleu-nuit); padding:.9rem 1.4rem; font-size:1rem; border:none; border-radius:8px; cursor:pointer; transition:background-color .25s, transform .2s; }
.btn-secondary:hover{ background:#f0c74c; transform:translateY(-1px); }

/* Solutions */
.solutions{ background:var(--bleu-nuit); color:var(--or); padding: clamp(2rem, 3vw, 3rem) 1rem clamp(4rem, 6vw, 6rem); text-align:center; }
.solutions-inner{ max-width:1300px; margin:auto; }
.solutions-intro h2{ font-size: clamp(1.6rem, 4.5vw, 3rem); margin:.2rem 0 .6rem; }
.solutions-intro .subtitle{ font-size: clamp(1.05rem, 2.6vw, 1.2rem); color:#fff; margin-bottom: clamp(1.2rem, 3vw, 2rem); }
.solutions-cards{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(12px, 2.5vw, 24px); align-items:stretch; }
.solution-card{ position:relative; border-radius:16px; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.25); background:var(--bleu-nuit); display:flex; flex-direction:column; min-height: 460px; transition:transform .25s, box-shadow .25s; }
.solution-card:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(212,175,55,.28); }
.card-bg{ position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.45); }
.card-content{ position:relative; z-index:1; padding: 1.4rem 1rem 1.8rem; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:.6rem; min-height: 460px; }
.solution-icon{ display:block; width: clamp(140px, 35vw, 220px); height:auto; margin: clamp(.6rem, 2vw, 1.6rem) auto clamp(1rem, 3vw, 2.2rem); object-fit:contain; }
.link-solution{ color:#f0c74c; font-weight:700; text-decoration:none; border:1px solid #f0c74c; padding:.5rem 1rem; border-radius:8px; transition: all .25s ease; }
.link-solution:hover{ background:#f0c74c; color:var(--bleu-nuit); }

/* A propos */
.apropos-container{ display:flex; flex-wrap:wrap; max-width:1300px; margin:auto; align-items:center; justify-content:space-between; gap: clamp(16px, 3vw, 36px); padding: clamp(2rem, 4vw, 6rem) 1rem; }
.apropos-texte{ flex:1 1 480px; }
.apropos-image{ flex:1 1 460px; text-align:center; }
.apropos-image img{ width:100%; height:auto; border-radius:12px; }

/* Contact */
.contact-header{ background:var(--bleu-nuit); padding: clamp(1.6rem, 4vw, 3rem) 1rem clamp(2.6rem, 5vw, 5rem); text-align:center; }
.contact-title{ color:var(--or); font-size: clamp(1.6rem, 5vw, 3rem); margin:0 0 .6rem; }
.contact-subtitle{ color:#fff; font-size: clamp(1rem, 3.6vw, 1.2rem); margin:0; }
.separateur-dore{ width:100%; height:6px; background:var(--or); }
.contact-block{ background:#fffaf4; position:relative; z-index:2; padding: clamp(1.2rem, 3.5vw, 3rem) clamp(1rem, 3vw, 2rem); border-radius:16px; max-width:1100px; margin: -3rem auto 0; border:1px solid var(--or); box-shadow:0 0 30px rgba(212,175,55,.15), 0 4px 20px rgba(0,0,0,.08); }
.contact-columns{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(12px, 2.6vw, 24px); align-items:stretch; }
@media (max-width: 860px){ .contact-columns{ grid-template-columns:1fr; } }
.contact-left img{ width:100%; height:100%; object-fit:cover; border-radius:12px; }
.contact-right{ background:#fff; padding: clamp(1rem, 3vw, 2rem); border-radius:12px; box-shadow:0 0 15px rgba(0,0,0,.05); display:flex; flex-direction:column; justify-content:center; }
.contact-right form{ display:flex; flex-direction:column; }
.contact-right input,.contact-right textarea{ padding:.85rem; margin-bottom:.9rem; border:1px solid #ccc; border-radius:8px; font-size:1rem; }
.contact-right button{ background:var(--bleu-nuit); color:#fff; padding:.95rem 1.2rem; font-size:1rem; border:none; border-radius:10px; cursor:pointer; }
.contact-right button:hover{ background:var(--or); color:var(--bleu-nuit); }

/* Zones + FAQ */
.zones-desservies{ padding: clamp(1.6rem, 4vw, 3rem) 1rem; background:#fff; }
.zones-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; list-style:none; padding:0; margin:0; }
.zones-grid a{ display:block; padding:.8rem 1rem; border:1px solid var(--or); border-radius:8px; text-decoration:none; color:#0a0a23; font-weight:600; }
.zones-grid a:hover{ background:#fff6df; }

.faq{ padding: clamp(1.6rem, 4vw, 3rem) 1rem; background:#f8f9fb; }
.faq details{ background:#fff; border:1px solid #e5e7eb; border-radius:8px; padding:1rem 1.2rem; margin-bottom:.8rem; }
.faq summary{ cursor:pointer; font-weight:700; }

/* Footer */
.site-footer{ background:#000; color:#fff; text-align:center; padding:2rem 1rem 1rem; }
.footer-top{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; max-width:1200px; margin:0 auto 1rem; }
.footer-logo img{ height:100px; }
.footer-links a{ color:var(--or); text-decoration:none; margin:0 .5rem; }
.footer-links a:hover{ color:#fff; }
.footer-socials a{ margin-left:.8rem; display:inline-block; transition:transform .25s ease; }
.footer-socials a:hover{ transform:scale(1.1); }
.footer-bottom{ font-size:.85rem; color:#aaa; margin-top:1rem; }

/* Animations */
.fade-in{ opacity:0; transform:translateY(28px); transition:opacity .6s ease, transform .6s ease; }
.fade-in.visible{ opacity:1; transform:translateY(0); }

/* === Bandeau info pro === */
.info-strip{background:#0a0a23;color:#d4af37;border-bottom:1px solid rgba(255,255,255,.06);}
.info-strip__inner{max-width:1200px;margin:0 auto;padding:.55rem 1rem;display:flex;gap:.8rem;align-items:center;justify-content:center;flex-wrap:wrap;}
.info-item{display:inline-flex;gap:.4rem;align-items:center}
.info-link{color:#d4af37;text-decoration:none;font-weight:700}
.info-link:hover{text-decoration:underline}
.dot{opacity:.5}
.ico{width:18px;height:18px}
.info-note{color:#fff;opacity:.6;font-size:.9rem}

.btn-wa{display:inline-flex;align-items:center;gap:.45rem;background:#25D366;color:#0a0a23;padding:.4rem .8rem;border-radius:999px;font-weight:800;text-decoration:none}
.btn-wa:hover{filter:brightness(1.05)}
@media (max-width:768px){
  .info-strip__inner{gap:.6rem}
  .info-note{display:none}
}

/* ===== Offre — responsive & lisible ===== */
.offre { background:#fff; padding: clamp(1.5rem, 4vw, 4rem) 1rem; }
.offre-container {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: clamp(16px, 3.5vw, 32px); align-items: center;
}
@media (max-width: 900px){
  .offre-container { grid-template-columns: 1fr; }
}

.offre-image img {
  width: 100%; height: auto; border-radius: 12px;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
}

.offre-texte { color:#0a0a23; }
.offre-texte .badge-offre {
  display:inline-block; background:#fff6df; color:#7a5a00;
  font-weight:700; padding:.35rem .7rem; border-radius:999px; margin-bottom:.6rem;
  border:1px solid #f3e2b0;
  font-size: clamp(.85rem, 1.6vw, .95rem);
}

.offre-texte h2 {
  font-size: clamp(1.35rem, 3.2vw, 2rem);
  margin: .2rem 0 .4rem; line-height: 1.2;
}

.prix { margin: 0 0 .6rem; font-size: clamp(.95rem, 1.8vw, 1.05rem); }
.prix-barre { text-decoration: line-through; opacity:.6; }
.prix-note { margin-left:.4rem; color:#0a0a23; opacity:.85; }

.pitch { margin:.4rem 0 1rem; font-size: clamp(1rem, 2.4vw, 1.05rem); }

.offre-points { margin:.4rem 0 1rem 1.1rem; }
.offre-points li { margin:.25rem 0; }

.engagement, .limite {
  margin:.4rem 0; font-size: clamp(.92rem, 2.2vw, .98rem);
}
.limite { color:#c0392b; font-weight:700; }

.offre-cta { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.offre-cta .btn-secondary { border-radius: 10px; }
.offre-cta .link-solution { font-weight:700; border-radius:8px; }

@media (max-width: 520px){
  .offre-cta { flex-direction: column; align-items: stretch; }
  .offre-cta .link-solution { text-align:center; display:block; padding:.6rem 0; }
}
/* Groupe de CTA */
.cta-group{
  display:flex; gap:.8rem; align-items:stretch; flex-wrap:wrap;
}

/* Boutons */
.btn, .btn-secondary{
  display:inline-flex; justify-content:center; align-items:center;
  padding:14px 18px; border-radius:12px; font-weight:700; text-align:center;
}

/* Mobile : stack + full width */
@media (max-width: 560px){
  .cta-group{flex-direction:column;}
  .btn, .btn-secondary{width:100%;}
}