/* ============================================================
   SHARED.CSS — Alur Immo
   Header, nav, footer, hamburger, reveal, bouton flottant,
   btn-call, cta-call, img-cards premium, att-cards, certs.
   ============================================================ */

/* ── Variables ── */
:root{
  --primary:#5025d1;--primary-dark:#3a1a9e;--primary-light:#ede8ff;
  --accent:#9b6dff;--dark:#24232B;--mid:#1d1e2a;--light:#ffffff;
  --gray-text:#6b6d82;--border:#e2e0f0;
}

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Outfit',sans-serif;color:var(--dark);background:var(--light);overflow-x:hidden;}

/* ── Header ── */
header{position:fixed;top:0;left:0;right:0;z-index:200;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(80,37,209,.08);height:72px;display:flex;align-items:center;padding:0 40px;transition:height .35s cubic-bezier(.4,0,.2,1),box-shadow .35s ease;}
header.scrolled{height:54px;box-shadow:0 4px 24px rgba(0,0,0,.07);}
.header-inner{max-width:1280px;width:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:center;}
.logo img{height:48px;width:auto;max-height:85%;transition:height .35s cubic-bezier(.4,0,.2,1);}
header.scrolled .logo img{height:36px;}

/* ── Navigation ── */
nav{display:flex;align-items:center;gap:4px;}
nav>a{text-decoration:none;color:var(--dark);font-weight:500;font-size:14px;padding:8px 13px;border-radius:7px;transition:all .22s;white-space:nowrap;}
nav>a:hover,nav>a.active{background:var(--primary-light);color:var(--primary);}
.nav-cta{background:var(--primary)!important;color:#fff!important;font-weight:600!important;padding:10px 20px!important;border-radius:7px!important;}
.nav-cta:hover{background:var(--primary-dark)!important;transform:translateY(-1px);box-shadow:0 6px 18px rgba(80,37,209,.3)!important;}

/* ── Dropdown ── */
.dropdown{position:relative;}
.dropdown-trigger{display:flex;align-items:center;gap:5px;text-decoration:none;color:var(--dark);font-weight:500;font-size:14px;padding:8px 13px;border-radius:7px;transition:all .22s;cursor:pointer;white-space:nowrap;}
.dropdown-trigger:hover,.dropdown:hover .dropdown-trigger{background:var(--primary-light);color:var(--primary);}
.dropdown-chevron{font-size:9px;transition:transform .25s;display:inline-block;}
.dropdown:hover .dropdown-chevron{transform:rotate(180deg);}
.dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(-4px);min-width:230px;background:#fff;border-radius:12px;border:1px solid var(--border);box-shadow:0 12px 40px rgba(0,0,0,.12);padding:16px 8px 8px;z-index:300;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;}
.dropdown-menu::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px;background:transparent;}
.dropdown:hover .dropdown-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);}
.dropdown-menu a{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:8px;text-decoration:none;color:var(--dark);font-size:13px;font-weight:500;transition:all .18s;}
.dropdown-menu a:hover{background:var(--primary-light);color:var(--primary);}
.pack-badge,.pack-badge-nav{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:var(--primary-light);color:var(--primary);font-weight:700;font-size:11px;flex-shrink:0;}
.pack-info{display:flex;flex-direction:column;}
.pack-info strong{font-size:13px;}
.pack-info span{font-size:11px;color:var(--gray-text);}
.dd-divider{height:1px;background:var(--border);margin:5px 0;}
.dd-all{justify-content:center!important;color:var(--primary)!important;font-weight:600!important;font-size:13px!important;}

/* ── Footer ── */
footer{background:var(--dark);border-top:1px solid rgba(255,255,255,.05);padding:56px 40px 34px;}
.footer-inner{max-width:1280px;margin:0 auto;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:44px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.05);margin-bottom:28px;}
.footer-brand img{height:36px;margin-bottom:16px;}
.footer-brand p{font-size:13px;color:rgba(255,255,255,.38);line-height:1.7;max-width:260px;}
.footer-col h4{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:16px;}
.footer-col a{display:block;text-decoration:none;color:rgba(255,255,255,.38);font-size:13px;margin-bottom:9px;transition:color .25s;}
.footer-col a:hover{color:#fff;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:rgba(255,255,255,.28);flex-wrap:wrap;gap:8px;}
.footer-bottom a{color:rgba(255,255,255,.32);text-decoration:none;transition:color .25s;}
.footer-bottom a:hover{color:#fff;}

/* ── Hamburger & menu mobile ── */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;padding:8px;border:none;background:none;z-index:300;flex-shrink:0;}
.hamburger span{display:block;width:22px;height:2px;background:var(--dark);border-radius:2px;transition:all .3s;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-menu{display:none;position:fixed;top:72px;left:0;right:0;background:#fff;border-top:1px solid var(--border);box-shadow:0 8px 32px rgba(0,0,0,.12);z-index:199;padding:12px 0;}
.mobile-menu.open{display:block;}
.mobile-menu a{display:block;padding:14px 24px;text-decoration:none;color:var(--dark);font-weight:500;font-size:15px;border-bottom:1px solid var(--border);}
.mobile-menu a:last-child{border-bottom:none;}
.mobile-menu a:hover,.mobile-menu a:active{background:var(--primary-light);color:var(--primary);}
.mobile-menu .mob-cta{background:var(--primary);color:#fff!important;margin:12px 16px;border-radius:8px;text-align:center;border-bottom:none!important;padding:13px 24px;}
.mobile-menu .mob-cta:hover{background:var(--primary-dark);}

/* ── Reveal animation ── */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
[data-reveal].revealed{opacity:1;transform:translateY(0);}

/* ── Bouton flottant appel ── */
.float-call{position:fixed;bottom:28px;right:28px;z-index:999;display:flex;align-items:center;gap:10px;background:var(--primary);color:#fff;font-family:'Outfit',sans-serif;font-weight:600;font-size:14px;padding:13px 22px;border-radius:50px;text-decoration:none;box-shadow:0 8px 30px rgba(80,37,209,.45);transition:transform .22s,box-shadow .22s;}
.float-call:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(80,37,209,.55);}
.float-call-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;flex-shrink:0;animation:pulseDot 1.8s infinite;}
@keyframes pulseDot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.6;transform:scale(1.4);}}

/* ── Bouton CTA appel inline ── */
.btn-call{display:inline-flex;align-items:center;gap:9px;background:var(--primary);color:#fff!important;font-family:'Outfit',sans-serif;font-weight:600;font-size:15px;padding:13px 26px;border-radius:9px;text-decoration:none;transition:background .22s,transform .22s,box-shadow .22s;}
.btn-call:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 24px rgba(80,37,209,.35);}

/* ── Section CTA appel ── */
.cta-call-section{background:linear-gradient(135deg,#5025d1 0%,#3a1a9e 100%);padding:64px 40px;text-align:center;}
.cta-call-section h2{font-family:'Cormorant Garant',serif;font-size:clamp(1.6rem,3vw,2.4rem);color:#fff;margin-bottom:12px;}
.cta-call-section p{color:rgba(255,255,255,.75);font-size:15px;margin-bottom:28px;max-width:500px;margin-left:auto;margin-right:auto;}

/* ── IMG-CARDS premium ── */
.img-card{position:relative;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:300px;padding:28px 26px;color:#fff;transition:transform .3s,box-shadow .3s;}
.img-card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(0,0,0,.35);}
.card-opco{background:linear-gradient(135deg,#1a0540 0%,#5025d1 55%,#7b4fff 100%);}
.card-direct{background:linear-gradient(135deg,#0d1a2e 0%,#1d2e4a 55%,#2d4270 100%);}
.card-14h{background:linear-gradient(135deg,#0e1a0e 0%,#1a4a1a 55%,#2d7a2d 100%);}
.card-28h{background:linear-gradient(135deg,#1a0e0e 0%,#4a1a1a 55%,#7a2d2d 100%);}
.card-42h{background:linear-gradient(135deg,#0e0e1a 0%,#25154a 55%,#5025d1 100%);}
.card-qualiopi{background:linear-gradient(135deg,#0a1428 0%,#1a3a6b 55%,#2d5cb8 100%);}
.card-cci{background:linear-gradient(135deg,#0a2018 0%,#0a5530 55%,#16a34a 100%);}
.card-opco-fin{background:linear-gradient(135deg,#1a0e00 0%,#5c3d00 55%,#92600a 100%);}
.card-e24{background:linear-gradient(135deg,#1a001a 0%,#5c005c 55%,#9d1a9d 100%);}
.img-card-svg{position:absolute;pointer-events:none;}
.img-card-deco{position:absolute;font-size:100px;opacity:.12;right:16px;top:38%;pointer-events:none;}
.img-card-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.2);border-radius:100px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;margin-bottom:auto;width:fit-content;}
.img-card-badge-dot{width:6px;height:6px;border-radius:50%;background:#4ade80;animation:pulseDot 1.8s infinite;}
.img-card-bottom{display:flex;flex-direction:column;gap:8px;position:relative;z-index:2;}
.img-card-ico{font-size:28px;}
.img-card-title{font-family:'Cormorant Garant',serif;font-size:clamp(1.3rem,2vw,1.7rem);font-weight:700;line-height:1.2;margin-bottom:10px;}
.img-card-sub{font-size:13px;color:rgba(255,255,255,.72);line-height:1.7;}
.img-card-pills{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;}
.img-card-pill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:100px;font-size:10px;font-weight:600;padding:3px 10px;color:rgba(255,255,255,.85);}
.img-card-link{display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--primary);font-weight:700;font-size:13px;padding:10px 18px;border-radius:8px;text-decoration:none;margin-top:10px;transition:all .22s;width:fit-content;}
.img-card-link:hover{background:var(--primary-light);}
.img-cards-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.img-cards-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.img-cards-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}

/* ── Certifications logos ── */
.certs-grid{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;}
.cert-item{background:#fff;border-radius:14px;padding:20px 28px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(80,37,209,.07);transition:all .3s;}
.cert-item:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(80,37,209,.15);}
.cert-item img{height:48px;width:auto;}
.certs-ref-txt{text-align:center;font-size:14px;color:var(--gray-text);margin-top:22px;line-height:1.8;}
.certs-ref-txt strong{color:var(--primary);}

/* ── Bandeau attestation ── */
.att-4cards{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.att-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:10px;transition:background .2s;}
.att-card:hover{background:rgba(255,255,255,.11);}
.att-card-ico{font-size:1.4rem;flex-shrink:0;}
.att-card strong{display:block;color:#fff;font-size:12px;font-weight:700;margin-bottom:3px;}
.att-card span{font-size:11px;color:rgba(255,255,255,.55);line-height:1.5;}
.attestation-inner{display:flex;align-items:center;gap:24px;max-width:1280px;margin:0 auto;padding:40px 40px;}
.attestation-cta{flex-shrink:0;}

/* ── Responsive ── */
@media(max-width:1100px){.footer-grid{grid-template-columns:1fr 1fr;gap:32px;}}
@media(max-width:900px){
  .img-cards-grid-4,.img-cards-grid-3{grid-template-columns:1fr 1fr;}
  .img-cards-grid-2{grid-template-columns:1fr;}
  .att-4cards{grid-template-columns:1fr 1fr;}
  .attestation-inner{flex-direction:column;}
}
@media(max-width:768px){
  header{padding:0 20px;}
  header.scrolled{height:52px;}
  nav>a{display:none!important;}
  nav>.dropdown{display:none!important;}
  nav>.nav-cta{display:none!important;}
  .hamburger{display:flex!important;}
  .logo img{height:40px;}
  .footer-grid{grid-template-columns:1fr;gap:24px;}
}
@media(max-width:600px){
  .float-call{font-size:13px;padding:11px 16px;bottom:16px;right:16px;}
  .img-cards-grid-4,.img-cards-grid-3,.img-cards-grid-2{grid-template-columns:1fr;}
  .att-4cards{grid-template-columns:1fr;padding:0 20px;}
  .attestation-inner{padding:24px 20px;}
}