/* ==========================================================================
   Laboratoire Al Anouar - feuille de style du site
   Ecrite pour H&Y Way. Reproduit la mise en forme du site d origine.
   Couleurs et tailles relevees dans le CSS du site source, jamais estimees.
   ========================================================================== */

/* --- Polices locales (aucun appel a Google Fonts) --- */
@font-face{font-family:cerebri-sans-light;src:url(fonts/CerebriSans-Light.woff2) format("woff2"),url(fonts/CerebriSans-Light.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:cerebri-sans-regular;src:url(fonts/CerebriSans-Regular.woff2) format("woff2"),url(fonts/CerebriSans-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:cerebri-sans-medium;src:url(fonts/CerebriSans-Medium.woff2) format("woff2"),url(fonts/CerebriSans-Medium.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:cerebri-sans-semibold;src:url(fonts/CerebriSans-SemiBold.woff2) format("woff2"),url(fonts/CerebriSans-SemiBold.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:cerebri-sans-bold;src:url(fonts/CerebriSans-Bold.woff2) format("woff2"),url(fonts/CerebriSans-Bold.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}

:root{
  --ala-base:#283275;
  --ala-card:#2a2d77;
  --ala-footer-icon:#282f75;
  --ala-dark-gray:#292d36;
  --ala-medium-gray:#808291;
  --ala-extra-medium-gray:#e4e4e4;
  --ala-very-light-gray:#f7f7f7;
  --ala-font:"cerebri-sans-regular",sans-serif;
  --ala-font-medium:"cerebri-sans-medium",sans-serif;
  --ala-font-semibold:"cerebri-sans-semibold",sans-serif;
  --ala-font-bold:"cerebri-sans-bold",sans-serif;
  --ala-container:1170px;
}

html{-webkit-text-size-adjust:100%}
body.ala-body{
  margin:0;font-family:var(--ala-font);font-size:17px;line-height:30px;
  color:var(--ala-medium-gray);background:#fff;overflow-x:hidden;
}
.ala-body a{color:var(--ala-medium-gray);text-decoration:none;transition:.3s}
.ala-body a:hover{color:var(--ala-base)}
:where(.ala-body) img{max-width:100%;height:auto}
:where(.ala-body) h1,:where(.ala-body) h2,:where(.ala-body) h3,:where(.ala-body) h4,:where(.ala-body) h5,:where(.ala-body) h6{
  margin:0 0 30px;letter-spacing:-.5px;font-weight:inherit;color:var(--ala-dark-gray);font-family:var(--ala-font)
}
:where(.ala-body) h1{font-size:4.375rem;line-height:4.375rem}
:where(.ala-body) h2{font-size:3.438rem;line-height:3.438rem}
:where(.ala-body) h3{font-size:2.813rem;line-height:3.2rem}
:where(.ala-body) h4{font-size:2.375rem;line-height:2.7rem}
:where(.ala-body) h5{font-size:2rem;line-height:2.2rem}
.ala-body p{margin:0 0 20px}
.ala-body p:last-child{margin-bottom:0}
.ala-body ul{margin:0;padding:0;list-style:none}
.ala-body *:focus-visible{outline:2px solid var(--ala-base);outline-offset:3px}

.ala-container{width:100%;max-width:var(--ala-container);margin:0 auto;padding:0 15px;box-sizing:border-box}
.ala-container-fluid{width:100%;padding:0 30px;box-sizing:border-box}
.ala-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Boutons ---------- */
.ala-btn{
  display:inline-flex;align-items:center;gap:10px;border:2px solid transparent;border-radius:0;
  text-transform:uppercase;letter-spacing:.5px;font-family:var(--ala-font);cursor:pointer;
  transition:all .3s ease-in-out;text-align:center;justify-content:center;line-height:1.3
}
.ala-btn-xl{font-size:16px;padding:24px 46px}
.ala-btn-lg{font-size:14px;padding:18px 34px}
.ala-btn-rounded{border-radius:100px}
.ala-btn-gradient{
  background-image:linear-gradient(to right,#412ce1,#141354,#412ce1);
  background-size:200% auto;color:#fff
}
.ala-btn-gradient:hover{background-position:right center;color:#fff}
.ala-btn-outline-white{border-color:rgba(255,255,255,.3);color:#fff;background:transparent}
.ala-btn-outline-white:hover{background:#fff;color:var(--ala-dark-gray);border-color:#fff}
.ala-btn-base{background:var(--ala-base);color:#fff}
.ala-btn-base:hover{background:#1c2455;color:#fff}
.ala-btn .ala-ico{flex:0 0 auto}

/* ---------- Icones SVG inline ---------- */
.ala-ico{display:inline-block;width:1em;height:1em;vertical-align:-.125em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ala-ico-fill{fill:currentColor;stroke:none}

/* ==========================================================================
   EN-TETE
   ========================================================================== */
.ala-topbar{background-color:#f7f7f7b8;font-size:15px;color:var(--ala-dark-gray);position:relative;z-index:20}
.ala-topbar-inner{display:flex;align-items:center;min-height:45px;gap:20px;flex-wrap:wrap}
.ala-topbar-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap;flex:1 1 auto}
.ala-topbar-item{display:flex;align-items:center;gap:6px;color:var(--ala-dark-gray)}
.ala-topbar-item a{color:var(--ala-dark-gray)}
.ala-topbar-item .ala-ico{color:var(--ala-base);width:17px;height:17px}
.ala-topbar-social{display:flex;align-items:center;gap:15px;margin-left:auto}
.ala-topbar-social a{color:var(--ala-dark-gray);display:inline-flex}
.ala-topbar-social a:hover{color:var(--ala-base)}
.ala-topbar-social .ala-ico{width:16px;height:16px}

.ala-header{position:relative;z-index:15}
.ala-nav-wrap{
  position:absolute;left:0;right:0;top:0;z-index:12;
  border-bottom:1px solid rgba(255,255,255,.1);background:transparent
}
body.ala-not-front .ala-nav-wrap{position:relative;background:var(--ala-base);border-bottom-color:rgba(255,255,255,.15)}
.ala-nav{display:flex;align-items:center;gap:20px;min-height:100px}
.ala-brand{display:inline-block;padding:2px 0 10px}
.ala-brand img{max-height:90px;width:auto;display:block}
.ala-brand .ala-logo-alt{display:none}
.ala-menu{display:flex;align-items:center;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.ala-menu li{position:relative}
.ala-menu a{
  display:block;font-size:16px;line-height:20px;padding:10px 20px;font-weight:500;
  color:#fff;font-family:var(--ala-font);transition:.3s
}
.ala-menu a:hover,.ala-menu .current-menu-item>a{color:#fff;opacity:.7}
.ala-burger{
  display:none;background:transparent;border:0;padding:10px;cursor:pointer;margin-left:auto;
  width:46px;height:46px;flex-direction:column;justify-content:center;gap:5px
}
.ala-burger span{display:block;height:2px;width:26px;background:#fff;transition:.3s}

/* ==========================================================================
   HERO
   ========================================================================== */
.ala-hero{position:relative;min-height:100vh;display:flex;align-items:center;background-size:cover;background-position:center;padding:150px 0 60px}
.ala-hero-overlay{position:absolute;inset:0;background-image:linear-gradient(to right top,#302c8357,#242164e0,#110f3aa8,#0f0e2ac4,#03030e85)}
.ala-hero .ala-container{position:relative;z-index:2;text-align:center}
.ala-hero-badge{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:5px 25px;margin-bottom:25px;border-radius:100px;
  text-transform:uppercase;color:#fff;font-size:16px;font-weight:500;line-height:1.5
}
.ala-hero-badge .ala-ico{width:22px;height:22px}
.ala-hero-title{color:#fff;font-weight:600;margin-bottom:25px;font-size:2.813rem;line-height:3.6rem}
.ala-highlight{position:relative;display:inline-block}
.ala-highlight img{position:absolute;left:0;bottom:-16px;width:100%;max-width:none}
.ala-hero-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:15px}

/* ==========================================================================
   CARTES DE CONTACT (chevauchement sur le hero)
   ========================================================================== */
.ala-cards{padding:0 0 130px;position:relative;overflow:visible}
.ala-cards-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:30px;
  margin-top:-100px;position:relative;z-index:3
}
.ala-card{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  background-color:var(--ala-card);background-repeat:repeat;
  padding:40px 30px;border-radius:5px;color:#fff;
  box-shadow:0 0 25px rgba(0,0,0,.12);transition:.3s
}
.ala-card:hover{box-shadow:0 0 40px rgba(0,0,0,.2);transform:translateY(-3px);color:#fff}
.ala-card-icon{
  width:90px;height:90px;border-radius:50%;border:2px solid rgba(255,255,255,.25);
  display:flex;align-items:center;justify-content:center;margin-bottom:25px;color:#fff;flex:0 0 auto
}
.ala-card-icon .ala-ico{width:34px;height:34px}
.ala-card-title{display:block;font-size:22px;font-weight:500;margin-bottom:5px;color:#fff;line-height:1.4}
.ala-card p{color:#fff;margin:0}

/* ==========================================================================
   BANNIERES INTERACTIVES
   ========================================================================== */
.ala-banners{padding:0 0 110px}
.ala-banners-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.ala-banner{position:relative;overflow:hidden;border-radius:6px;margin:0}
.ala-banner img{display:block;width:100%;height:auto;object-fit:cover;transition:transform .5s ease}
.ala-banner:hover img{transform:scale(1.06)}
.ala-banner figcaption{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  padding:50px;z-index:1
}
.ala-banner-overlay{position:absolute;inset:0;background-image:linear-gradient(to top,rgba(32,35,41,.8) 0,transparent 100%);z-index:-1;opacity:.9}
.ala-banner-row{display:flex;width:100%;align-items:center;gap:15px}
.ala-banner-row h5{color:#fff;margin:0;font-weight:500;font-size:2rem;line-height:2.2rem}
.ala-banner-arrow{
  border:2px solid rgba(255,255,255,.3);width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin-left:auto;flex:0 0 auto;color:#fff
}
.ala-banner-arrow .ala-ico{width:26px;height:26px}
.ala-banner-link{position:absolute;inset:0;z-index:2}

/* ==========================================================================
   PRESENTATION (fond parallaxe)
   ========================================================================== */
.ala-presentation{
  position:relative;background-size:cover;background-position:center;background-attachment:scroll;
  padding:130px 0;color:#fff;text-align:center
}
.ala-presentation-veil{position:absolute;inset:0;background:rgba(16,18,50,.12)}
.ala-presentation .ala-container{position:relative;z-index:2}
.ala-presentation h3{color:#fff;font-weight:600;margin-bottom:25px}
.ala-presentation p{color:#fff;max-width:900px;margin:0 auto;font-size:17px;line-height:32px}

/* ==========================================================================
   CARTE DOCTEUR
   ========================================================================== */
.ala-doctor{padding:0 0 110px}
.ala-doctor-card{
  background:#fff;background-repeat:no-repeat;background-position:center;background-size:cover;
  border-radius:6px;box-shadow:0 0 40px rgba(0,0,0,.08);
  margin-top:-80px;position:relative;z-index:3;padding:60px 50px;
  display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:center
}
.ala-doctor-photo{text-align:center}
.ala-doctor-photo img{width:250px;height:250px;border-radius:50%;object-fit:cover;margin:0 auto 20px;display:block}
.ala-doctor-name{display:block;font-size:18px;color:var(--ala-dark-gray);font-weight:600}
.ala-doctor-role{display:block;font-size:15px;color:var(--ala-medium-gray)}
.ala-doctor-text p{text-align:justify;font-size:17px;line-height:32px;margin-bottom:22px}

/* ==========================================================================
   APPEL A L ACTION PRELEVEMENT
   ========================================================================== */
.ala-prelev{padding:0 0 110px;background-repeat:repeat-x;background-position:center}
.ala-prelev-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.ala-prelev-img img{display:block;width:100%;border-radius:6px}
.ala-prelev h3{color:var(--ala-base);font-weight:600;margin-bottom:35px}
.ala-prelev-actions{display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.ala-prelev-phone{display:inline-flex;align-items:center;gap:10px;color:var(--ala-dark-gray);font-weight:600;font-size:20px}
.ala-prelev-phone .ala-ico{color:var(--ala-base);width:24px;height:24px}

/* ==========================================================================
   NOS SPECIALITES
   ========================================================================== */
.ala-spec{background-color:var(--ala-base);padding:110px 0}
.ala-spec-title{color:#fff;text-align:center;font-weight:600;margin:0 0 48px;font-size:2.813rem;line-height:3.2rem}
.ala-spec-grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(255,255,255,.1);border-left:1px solid rgba(255,255,255,.1)}
.ala-spec-item{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;
  padding:25px 12px;text-align:center;
  border-bottom:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1);
  position:relative;overflow:hidden;transition:.3s
}
.ala-spec-item:hover{background:rgba(255,255,255,.06)}
.ala-spec-item svg{width:64px;height:64px;position:relative;z-index:1}
.ala-spec-label{color:#fff;font-weight:600;font-size:14px;text-transform:uppercase;line-height:22px;position:relative;z-index:1}

/* ==========================================================================
   DETECTEUR DE VEINES
   ========================================================================== */
.ala-veines{padding:110px 0}
.ala-veines-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.ala-veines-img img{display:block;width:100%;border-radius:0 0 50px 0}
.ala-veines-sur{display:block;color:var(--ala-base);font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:15px;margin-bottom:15px}
.ala-veines h3{font-weight:600;margin-bottom:25px}
.ala-veines p{text-align:justify}

/* ==========================================================================
   GALERIE
   ========================================================================== */
.ala-galerie{padding:110px 0;background:var(--ala-very-light-gray)}
.ala-galerie h3{text-align:center;font-weight:600;margin-bottom:48px}
.ala-swiper{overflow:hidden;position:relative}
.ala-swiper .swiper-wrapper{display:flex;box-sizing:content-box;align-items:stretch}
.ala-swiper .swiper-slide{flex-shrink:0;height:auto;position:relative}
.ala-galerie .swiper-slide{width:auto}
.ala-galerie-item{display:block;position:relative;overflow:hidden;border-radius:6px}
.ala-galerie-item img{display:block;height:500px;width:auto;max-width:none;object-fit:cover}
.ala-galerie-item::after{content:"";position:absolute;inset:0;background:rgba(40,50,117,.35);opacity:0;transition:.3s}
.ala-galerie-item:hover::after{opacity:1}
.ala-galerie-zoom{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.8);
  width:75px;height:75px;border-radius:50%;background:#fff;color:var(--ala-base);
  display:flex;align-items:center;justify-content:center;opacity:0;transition:.3s;z-index:2
}
.ala-galerie-item:hover .ala-galerie-zoom{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ala-galerie-zoom .ala-ico{width:26px;height:26px}
.ala-swiper-dots{display:flex;justify-content:center;gap:8px;margin-top:35px}
.ala-swiper-dots button{
  width:10px;height:10px;border-radius:50%;background:#c9cbd6;border:0;padding:0;cursor:pointer;transition:.3s
}
.ala-swiper-dots button.is-active{background:var(--ala-base);width:26px;border-radius:10px}

/* ==========================================================================
   AVIS CLIENTS
   ========================================================================== */
.ala-avis{padding:0 0 110px;background:var(--ala-very-light-gray)}
.ala-avis-card{background:#fff;border-radius:6px;box-shadow:0 0 25px rgba(0,0,0,.06);height:100%;display:flex;flex-direction:column}
.ala-avis-text{padding:30px;font-style:italic;height:250px;overflow:hidden;font-size:16px;line-height:28px;margin:0}
.ala-avis-foot{border-top:1px solid var(--ala-extra-medium-gray);padding:20px 30px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}
.ala-avis-name{color:var(--ala-dark-gray);font-size:16px}
.ala-avis-stars{display:inline-flex;gap:2px;color:#f7a30e}
.ala-avis-stars .ala-ico{width:16px;height:16px;fill:currentColor;stroke:none}

/* ==========================================================================
   FORMULAIRE
   ========================================================================== */
.ala-form-section{padding:110px 0;position:relative;overflow:hidden}
.ala-form-grid{display:grid;grid-template-columns:1fr 2fr;gap:50px;align-items:start}
.ala-form-intro h3{font-weight:600;margin-bottom:30px}
.ala-form-intro-row{display:flex;gap:18px;align-items:flex-start}
.ala-form-intro-row img{width:60px;height:60px;flex:0 0 auto}
.ala-form-phone{display:block;font-size:22px;font-weight:800;color:var(--ala-dark-gray);margin-top:8px}
.ala-form-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ala-form-col{display:flex;flex-direction:column;gap:20px}
.ala-form-label{display:block;font-size:16px;color:var(--ala-dark-gray);margin-bottom:8px}
.ala-form input[type=text],.ala-form input[type=email],.ala-form input[type=tel],.ala-form textarea,.ala-form input[type=file]{
  width:100%;box-sizing:border-box;border:1px solid var(--ala-extra-medium-gray);border-radius:4px;
  padding:14px 18px;font-family:var(--ala-font);font-size:16px;color:var(--ala-dark-gray);background:#fff;transition:.3s
}
.ala-form textarea{min-height:150px;resize:vertical}
.ala-form input:focus,.ala-form textarea:focus{border-color:var(--ala-base);outline:none}
.ala-form input::placeholder,.ala-form textarea::placeholder{color:#a8a8a8;opacity:1}
.ala-form-honeypot{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.ala-form-submit{margin-top:25px;text-align:right}
.ala-form-deco{position:absolute;right:0;bottom:0;width:300px;max-width:35%;z-index:-1;pointer-events:none;opacity:.1}
.ala-form-results{margin-top:20px}
.ala-alert{padding:16px 20px;border-radius:4px;font-size:16px;line-height:26px;margin-bottom:20px}
.ala-alert-ok{background:#e8f6ee;border:1px solid #b7e2c8;color:#1d6b3c}
.ala-alert-ko{background:#fdecec;border:1px solid #f5c2c2;color:#a12626}
.ala-alert ul{margin:8px 0 0;padding-left:18px;list-style:disc}

/* ==========================================================================
   CARTE GOOGLE MAPS
   ========================================================================== */
.ala-map{position:relative}
.ala-map>.ala-container{position:absolute;inset:0;height:100%;display:flex;align-items:center;justify-content:flex-end;pointer-events:none;z-index:2}
.ala-map iframe{display:block;width:100%;height:600px;border:0}
.ala-map-card{
  position:static;width:380px;max-width:90%;pointer-events:auto;
  background:#fff;border-radius:6px;box-shadow:0 0 40px rgba(0,0,0,.12);overflow:hidden;z-index:2
}
.ala-map-inner{padding:35px}
.ala-map-card h4{font-size:2rem;line-height:2.2rem;margin-bottom:20px;font-weight:400}
.ala-map-card p{margin:0 0 14px;font-size:16px;line-height:28px}
.ala-map-card strong{color:var(--ala-dark-gray)}
.ala-map-foot{border-top:1px solid var(--ala-extra-medium-gray);padding:18px 35px;text-align:center}
.ala-map-foot a{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;font-size:13px;letter-spacing:.5px;color:var(--ala-dark-gray)}
.ala-map-foot a:hover{color:var(--ala-base)}
.ala-map-foot .ala-ico{width:16px;height:16px}

/* ==========================================================================
   PIED DE PAGE
   ========================================================================== */
.ala-footer{border-top:1px solid var(--ala-extra-medium-gray);font-size:16px;padding:0}
.ala-footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:70px 0 40px}
.ala-footer-logo img{max-height:100px;width:auto;display:block;margin-bottom:15px}
.ala-footer-line{display:flex;align-items:flex-start;gap:10px;color:var(--ala-dark-gray);font-weight:500;margin-bottom:8px}
.ala-footer-line .ala-ico{color:var(--ala-footer-icon);width:18px;height:18px;flex:0 0 auto;margin-top:6px}
.ala-footer-line a{color:var(--ala-dark-gray)}
.ala-footer-title{font-size:17px;font-weight:600;display:block;color:var(--ala-dark-gray);margin-bottom:5px}
.ala-footer-links{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;padding-top:10px}
.ala-footer-links li{margin-bottom:6px}
.ala-footer-fb{min-height:130px}
.ala-footer-bottom{border-top:1px solid var(--ala-extra-medium-gray);padding:25px 0;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.ala-footer-copy{font-size:15px;margin:0}
.ala-footer-social{display:flex;gap:15px;margin-left:auto}
.ala-footer-social a{color:var(--ala-dark-gray)}
.ala-footer-social .ala-ico{width:18px;height:18px}
.ala-credit{font-size:13px;color:var(--ala-medium-gray);width:100%;margin:0;padding-top:6px}
.ala-credit a{color:var(--ala-medium-gray);text-decoration:underline}

/* ==========================================================================
   POPUP
   ========================================================================== */
.ala-popup-backdrop{position:fixed;inset:0;background:rgba(11,11,11,.8);z-index:9998;display:none;padding:20px;overflow-y:auto}
.ala-popup-backdrop.is-visible{display:flex;align-items:center;justify-content:center}
.ala-popup-card{
  background:#fff;background-repeat:repeat;border-radius:18px;overflow:hidden;position:relative;
  width:100%;max-width:900px;box-shadow:0 30px 70px rgba(0,0,0,.25)
}
.ala-popup-inner{display:grid;grid-template-columns:1fr 1fr;position:relative}
.ala-popup-image{background-size:cover;background-position:center bottom;background-repeat:no-repeat;min-height:400px;animation:ala-float 4s ease-in-out infinite}
.ala-popup-content{padding:40px 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ala-popup-title{color:#2a2d77;font-weight:700;letter-spacing:-1px;margin:0 0 15px;font-size:2rem;line-height:2.2rem;opacity:0;transform:translateY(12px)}
.ala-popup-sub{margin:0;opacity:0;transform:translateY(12px)}
.ala-popup-sub img{width:20px;display:inline-block;vertical-align:middle;margin-left:6px}
.ala-popup-cta-wrap{margin-top:15px;opacity:0;transform:translateY(12px)}
.ala-popup-backdrop.is-open .ala-popup-title{animation:ala-fadeup .55s ease forwards}
.ala-popup-backdrop.is-open .ala-popup-sub{animation:ala-fadeup .55s .15s ease forwards}
.ala-popup-backdrop.is-open .ala-popup-cta-wrap{animation:ala-fadeup .55s .3s ease forwards}
.ala-popup-backdrop.is-open .ala-popup-sub img{animation:ala-wabounce 1.6s ease-in-out infinite}
.ala-phone-cta{
  display:inline-flex;align-items:center;gap:14px;padding:14px 18px;border-radius:16px;position:relative;overflow:hidden;
  background:rgba(42,45,119,.06);border:1px solid rgba(42,45,119,.15);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;max-width:100%
}
.ala-phone-cta:hover{transform:translateY(-2px);border-color:rgba(42,45,119,.28);box-shadow:0 14px 34px rgba(0,0,0,.1)}
.ala-phone-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#2a2d77;color:#fff;flex:0 0 auto}
.ala-phone-icon .ala-ico{width:20px;height:20px}
.ala-phone-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.ala-phone-number{font-size:24px;font-weight:800;letter-spacing:.2px;color:#2a2d77;line-height:1;white-space:nowrap}
.ala-phone-hint{font-size:12px;font-weight:600;color:rgba(0,0,0,.55);white-space:nowrap}
.ala-phone-badge{font-size:12px;font-weight:800;padding:7px 10px;border-radius:999px;background:rgba(42,45,119,.12);color:#2a2d77;flex:0 0 auto}
.ala-popup-close{
  position:absolute;right:10px;top:6px;z-index:5;background:transparent;border:0;cursor:pointer;
  font-size:34px;line-height:1;color:var(--ala-dark-gray);padding:6px 12px
}
@keyframes ala-fadeup{to{opacity:1;transform:translateY(0)}}
@keyframes ala-wabounce{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-6deg)}}
@keyframes ala-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ==========================================================================
   VISIONNEUSE (lightbox)
   ========================================================================== */
.ala-lightbox{position:fixed;inset:0;background:rgba(11,11,11,.9);z-index:9999;display:none;align-items:center;justify-content:center;padding:40px}
.ala-lightbox.is-visible{display:flex}
.ala-lightbox img{max-width:92vw;max-height:80vh;border-radius:4px;display:block}
.ala-lightbox-cap{position:absolute;bottom:26px;left:0;right:0;text-align:center;color:#fff;font-size:15px}
.ala-lightbox-btn{position:absolute;background:transparent;border:0;color:#fff;cursor:pointer;padding:12px}
.ala-lightbox-btn .ala-ico{width:30px;height:30px}
.ala-lightbox-close{top:14px;right:18px}
.ala-lightbox-prev{left:14px;top:50%;transform:translateY(-50%)}
.ala-lightbox-next{right:14px;top:50%;transform:translateY(-50%)}

/* ==========================================================================
   BOUTON WHATSAPP FLOTTANT
   ========================================================================== */
.ala-wa{position:fixed;right:24px;bottom:24px;z-index:9997;display:none}
.ala-wa.is-visible{display:block}
.ala-wa-btn{
  width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.25);position:relative
}
.ala-wa-btn .ala-ico{width:32px;height:32px;fill:currentColor;stroke:none}
.ala-wa-badge{position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;background:#e02b2b;border:2px solid #fff}
.ala-wa-panel{
  position:absolute;right:0;bottom:74px;width:360px;max-width:calc(100vw - 48px);
  background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.25);display:none
}
.ala-wa.is-open .ala-wa-panel{display:block}
.ala-wa-head{background:#008069;color:#fff;padding:16px 18px;display:flex;align-items:center;gap:12px;position:relative}
.ala-wa-head img{width:40px;height:40px;border-radius:50%;object-fit:cover;background:#fff}
.ala-wa-name{font-weight:600;font-size:15px;line-height:1.3}
.ala-wa-status{font-size:12px;opacity:.85}
.ala-wa-body{padding:22px 18px;background:#ece5dd}
.ala-wa-bubble{background:#fff;border-radius:10px;padding:12px 14px;font-size:15px;line-height:22px;color:var(--ala-dark-gray);box-shadow:0 1px 2px rgba(0,0,0,.1);display:inline-block}
.ala-wa-foot{padding:14px 18px;background:#fff}
.ala-wa-foot a{display:flex;align-items:center;justify-content:center;gap:10px;background:#25d366;color:#fff;border-radius:24px;padding:12px 18px;font-weight:600;font-size:15px}
.ala-wa-foot a:hover{background:#1eb958;color:#fff}
.ala-wa-close{position:absolute;right:8px;top:8px;background:transparent;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:4px 8px}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1199px){
  .ala-container{max-width:960px}
  .ala-menu a{padding:10px 12px;font-size:15px}
  .ala-map-card{width:330px}
}
@media (max-width:991px){
  .ala-container{max-width:720px}
  .ala-container-fluid{padding:0 20px}
  .ala-body h3{font-size:2.2rem;line-height:2.6rem}
  .ala-nav-wrap{position:relative;background:#fff;border-bottom-color:var(--ala-extra-medium-gray)}
  body.ala-not-front .ala-nav-wrap{background:#fff}
  .ala-nav{min-height:auto;padding:12px 0;flex-wrap:wrap}
  .ala-brand img{max-height:70px}
  .ala-brand .ala-logo-default{display:none}
  .ala-brand .ala-logo-alt{display:block}
  .ala-burger{display:flex}
  .ala-burger span{background:var(--ala-dark-gray)}
  .ala-menu{display:none;width:100%;flex-direction:column;align-items:stretch;order:3;padding:10px 0 4px}
  .ala-menu.is-open{display:flex}
  .ala-menu a{color:var(--ala-dark-gray);padding:12px 4px;border-bottom:1px solid var(--ala-extra-medium-gray)}
  .ala-hero{min-height:750px;padding:60px 0}
  .ala-hero-title{font-size:2.6rem;line-height:3.2rem}
  .ala-cards-grid{grid-template-columns:repeat(2,1fr);margin-top:40px}
  .ala-banners-grid,.ala-prelev-grid,.ala-veines-grid,.ala-form-grid{grid-template-columns:1fr}
  .ala-doctor-card{grid-template-columns:1fr;padding:40px 30px;text-align:center}
  .ala-doctor-text p{text-align:left}
  .ala-spec-grid{grid-template-columns:repeat(4,1fr)}
  .ala-galerie,.ala-veines,.ala-spec,.ala-form-section,.ala-presentation{padding:70px 0}
  .ala-cards{padding-bottom:70px}
  .ala-banners,.ala-doctor,.ala-prelev,.ala-avis{padding-bottom:70px}
  .ala-galerie-item img{height:350px}
  .ala-map iframe{height:550px}
  .ala-map>.ala-container{align-items:flex-end}
  .ala-map-card{width:300px;margin:0 0 20px}
  .ala-popup-inner{grid-template-columns:1fr}
  .ala-popup-image{order:2;min-height:260px}
  .ala-popup-content{order:1}
  .ala-footer-grid{grid-template-columns:1fr;text-align:center;padding:50px 0 30px}
  .ala-footer-line{justify-content:center}
  .ala-footer-links{justify-items:center;text-align:center}
  .ala-footer-logo img{margin-left:auto;margin-right:auto}
  .ala-footer-bottom{justify-content:center;text-align:center}
  .ala-footer-social{margin-left:0}
}
@media (max-width:767px){
  .ala-container{max-width:100%}
  .ala-topbar{font-size:13px;text-align:center}
  .ala-topbar-inner{justify-content:center;padding:8px 0}
  .ala-topbar-left{justify-content:center}
  .ala-topbar-social{display:none}
  .ala-hero{min-height:750px}
  .ala-hero-badge{font-size:13px}
  .ala-hero-title{font-size:2.3rem;line-height:2.9rem}
  .ala-hero-actions .ala-btn{width:100%}
  .ala-btn-xl{padding:18px 26px;font-size:15px}
  .ala-cards-grid{grid-template-columns:1fr;margin-top:50px;gap:20px}
  .ala-card{padding:5%}
  .ala-banner figcaption{padding:25px}
  .ala-banner-row h5{font-size:1.5rem;line-height:1.8rem}
  .ala-body h3{font-size:2rem;line-height:2.4rem}
  .ala-spec-grid{grid-template-columns:repeat(2,1fr)}
  .ala-galerie-item img{height:250px}
  .ala-form-fields{grid-template-columns:1fr}
  .ala-form-submit{text-align:center}
  .ala-form-submit .ala-btn{width:100%}
  .ala-map iframe{height:350px}
  .ala-map>.ala-container{position:relative;inset:auto;height:auto;display:block;padding-top:30px;padding-bottom:30px;pointer-events:auto}
  .ala-map-card{width:100%;max-width:none;margin:0}
  .ala-avis-text{height:auto;min-height:200px}
  .ala-doctor-card{margin-top:-40px;padding:30px 20px}
  .ala-popup-content{padding:28px 18px}
  .ala-phone-hint{display:none}
  .ala-phone-cta{width:100%;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:14px}
  .ala-phone-text{align-items:center}
  .ala-phone-number{white-space:normal;font-size:20px}
  .ala-phone-badge{width:100%;text-align:center;padding:10px 14px}
  .ala-wa{right:14px;bottom:14px}
  .ala-footer-links{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .ala-body *,.ala-body *::before,.ala-body *::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .ala-popup-title,.ala-popup-sub,.ala-popup-cta-wrap{opacity:1;transform:none}
  .ala-presentation{background-attachment:scroll}
}

/* Rappel de couleurs : ces regles doivent passer apres les regles de base. */
.ala-body .ala-hero-title{color:#fff}
.ala-body .ala-spec-title{color:#fff}
.ala-body .ala-card,.ala-body .ala-card p,.ala-body .ala-card-title{color:#fff}
.ala-body .ala-btn-gradient,.ala-body .ala-btn-base{color:#fff}
.ala-body .ala-btn-outline-white{color:#fff}
.ala-body .ala-btn-outline-white:hover{color:var(--ala-dark-gray)}
.ala-body .ala-btn-base:hover,.ala-body .ala-btn-gradient:hover{color:#fff}
.ala-body .ala-banner-row h5{color:#fff}
.ala-body .ala-prelev-phone,.ala-body .ala-form-phone{color:var(--ala-dark-gray)}
.ala-body .ala-galerie-item{color:inherit}
.ala-body .ala-spec-item{color:#fff}
.ala-body .ala-presentation h3,.ala-body .ala-presentation p{color:#fff}

/* ==========================================================================
   CONFORMITE AU SITE SOURCE — valeurs relevees par mesure CDP sur
   laboratoire-analyses-marrakech.com (viewports 1366 / 820 / 390).
   ========================================================================== */
:root{--ala-container:1140px}
@media (min-width:1400px){:root{--ala-container:1220px}}
.ala-container-fluid{padding:0 60px}
@media (max-width:1199px){.ala-container-fluid{padding:0 30px}}
@media (max-width:767px){.ala-container-fluid{padding:0 15px}}

/* Barre du haut : masquee sous 768px, comme sur le site source */
@media (max-width:767px){.ala-topbar{display:none}}

/* En-tete superpose au hero : le hero demarre en haut de l'ecran */
body:not(.ala-not-front) .ala-topbar{position:absolute;top:0;left:0;right:0}
body:not(.ala-not-front) .ala-nav-wrap{top:45px}
@media (max-width:767px){body:not(.ala-not-front) .ala-nav-wrap{top:0}}
.ala-hero{padding:0}
.ala-nav{min-height:94px}

/* Titre du hero — specificite necessaire pour passer devant .ala-body h1 */
.ala-hero .ala-hero-title{font-size:45.008px;line-height:50px;font-weight:600;letter-spacing:-.5px}
@media (max-width:991px){.ala-hero .ala-hero-title{font-size:39.382px;line-height:43.75px}}
@media (max-width:767px){.ala-hero .ala-hero-title{font-size:27.6px;line-height:37.5px}}

/* Bandeau d'accroche du hero */
.ala-hero-badge{display:flex;line-height:30px}
@media (max-width:767px){.ala-hero-badge{font-size:13px}}
.ala-hero-actions a:first-child .ala-ico{width:30px;height:30px}

/* Fenetre d'accueil */
.ala-popup-card{max-width:855px}
@media (min-width:1400px){.ala-popup-card{max-width:915px}}
@media (max-width:1199px){.ala-popup-card{max-width:800px}}
@media (max-width:991px){.ala-popup-card{max-width:600px}}
@media (max-width:767px){.ala-popup-card{max-width:calc(100% - 30px)}}
.ala-popup-image{background-position:center}
@media (max-width:991px){.ala-popup-image{min-height:400px}}
@media (max-width:575px){.ala-popup-image{min-height:300px}}
@media (max-width:991px){.ala-popup-title{font-size:28px;line-height:30.8px}}
@media (max-width:767px){.ala-popup-title{font-size:24px;line-height:26.4px}}
.ala-phone-cta{padding-left:16px;padding-right:16px}
.ala-highlight{padding-bottom:20px}
@media (max-width:767px){.ala-popup-backdrop{padding:15px}.ala-popup-card{max-width:100%}}
@media (max-width:575px){.ala-phone-cta{padding-left:14px;padding-right:14px}}
/* Menu principal : tenu sur une seule ligne a 1366px (le site source y coupe
   les libelles en deux lignes — corrige ici, cf registre). */
@media (min-width:992px){.ala-menu a{padding-left:16px;padding-right:16px}.ala-menu{flex-wrap:nowrap}}

/* --- Typographie alignee sur le site source (mesures comparees 2026-09-29) --- */
.ala-body h3{line-height:50px}
.ala-presentation h3{font-size:30px;line-height:44.8px}
.ala-presentation p{font-size:22px;line-height:30px;max-width:none}
.ala-prelev h3{font-size:38px;line-height:43.2px;font-weight:700}
.ala-spec-title{font-weight:600}
.ala-veines h3,.ala-form-intro h3{font-weight:800}
.ala-avis-text{font-size:17px;line-height:30px}
.ala-map-inner h4{font-size:38px;line-height:43.2px}
/* Couleur du texte courant : celle du site source, plus foncee que la notre */
.ala-doctor-text p,.ala-veines p,.ala-avis-text,.ala-footer-links a{color:var(--ala-dark-gray)}
/* Boutons */
.ala-btn{font-size:13px;line-height:19.5px;font-weight:500;letter-spacing:normal}
.ala-btn-xl{font-size:16px;line-height:24px}
/* Specificite suffisante pour passer devant les regles generales de titres */
.ala-body .ala-spec-title{font-weight:600}
.ala-body .ala-footer-title{font-size:17px;line-height:30px;font-weight:600}
.ala-doctor-text p{line-height:30px}
.ala-footer-links li,.ala-footer-links li a{color:var(--ala-dark-gray)}
.ala-footer-line p,.ala-footer-line{font-weight:400}

/* Avis : le site source fait deborder le carrousel hors de la zone de contenu
   (cartes de 414 px, visibles en partie sur les bords). Sans cela les cartes sont
   trop etroites et le texte des avis se trouve coupe en plein mot. */
.ala-avis{overflow:hidden}
.ala-avis-text{height:auto;min-height:250px;overflow:visible}
@media (min-width:1200px){
  .ala-avis > .ala-container{max-width:none;width:1746px;padding:0;margin-left:calc(50% - 873px)}
}
/* Specialites : hauteur de case et interligne du site source (256 px / 30 px),
   sans marge laterale sinon les libelles longs se coupent sur deux lignes. */
.ala-spec-item{min-height:256px;padding-left:0;padding-right:0}
.ala-spec-label{line-height:30px}
.ala-spec-item{justify-content:center}

/* ==========================================================================
   BOUTONS SUR MESURE — reprise de la main sur le theme
   Le theme Hello Elementor (reset.css) impose a TOUT <button> un style rose
   #cc3366 au survol (fond rose, croix blanche, contour). Nos boutons ne
   declaraient aucun etat :hover / :focus, le theme prenait donc le dessus.
   Chaque etat est desormais declare explicitement.
   ========================================================================== */
.ala-popup-close,
.ala-popup-close:hover,
.ala-popup-close:focus,
.ala-popup-close:active{
  background:transparent;border:0;border-radius:0;box-shadow:none;
  width:44px;height:44px;padding:0;line-height:44px;text-align:center;
  font-size:28px;font-family:Arial,Baskerville,monospace;color:#333
}
.ala-popup-close{top:10px;right:10px;opacity:.65;transition:opacity .2s}
.ala-popup-close:hover{opacity:1}
.ala-popup-close:focus{outline:none}
.ala-popup-close:focus-visible:not(:hover){outline:2px solid var(--ala-base);outline-offset:2px;opacity:1}

.ala-swiper-dots button,
.ala-swiper-dots button:hover,
.ala-swiper-dots button:focus,
.ala-swiper-dots button:active{background:#c9cbd6;border:0;box-shadow:none;color:inherit}
.ala-swiper-dots button.is-active,
.ala-swiper-dots button.is-active:hover,
.ala-swiper-dots button.is-active:focus,
.ala-swiper-dots button.is-active:active{background:var(--ala-base)}
.ala-swiper-dots button:focus{outline:none}
.ala-swiper-dots button:focus-visible{outline:2px solid var(--ala-base);outline-offset:3px}

.ala-burger,.ala-burger:hover,.ala-burger:focus,.ala-burger:active{
  background:transparent;border:0;box-shadow:none;color:inherit;border-radius:0
}
.ala-burger:focus{outline:none}
.ala-burger:focus-visible{outline:2px solid #fff;outline-offset:2px}

.ala-wa-close,.ala-wa-close:hover,.ala-wa-close:focus,.ala-wa-close:active{
  background:transparent;border:0;box-shadow:none;color:#fff;border-radius:0
}
.ala-wa-close:focus{outline:none}
.ala-wa-close:focus-visible{outline:2px solid #fff;outline-offset:2px}

.ala-lightbox-btn,.ala-lightbox-btn:hover,.ala-lightbox-btn:focus,.ala-lightbox-btn:active{
  background:transparent;border:0;box-shadow:none;color:#fff;border-radius:0
}

/* ==========================================================================
   PAGES INTERIEURES — bandeau d en-tete + grille des conventions
   Valeurs relevees par mesure sur laboratoire-analyses-marrakech.com/nos-conventions
   ========================================================================== */
.ala-pagehead{position:relative;background-color:var(--ala-dark-gray);background-size:cover;background-position:bottom;background-repeat:no-repeat;padding:100px 0 85px}
.ala-pagehead-veil{position:absolute;inset:0;background:#1f232c;opacity:.5}
.ala-pagehead .ala-container{position:relative;z-index:2;min-height:250px;padding-top:30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ala-pagehead-badge{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;box-sizing:border-box;
  padding:5px 25px;margin:0 0 25px;border-radius:100px;text-transform:uppercase;
  color:#fff;font-size:12px;letter-spacing:1px;font-weight:600;line-height:30px
}
.ala-pagehead-badge .ala-ico{width:18px;height:18px;flex:0 0 auto}
.ala-body .ala-pagehead-title{color:#fff;font-size:40px;line-height:40px;font-weight:500;margin:0;letter-spacing:normal;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.ala-pagehead-arrow{display:inline-flex;margin-top:25px;color:#fff;opacity:.85}
.ala-pagehead-arrow:hover{opacity:1;color:#fff}
.ala-pagehead-arrow .ala-ico{width:26px;height:26px}

.ala-conv{background-color:var(--ala-very-light-gray);background-size:cover;background-position:center;background-repeat:no-repeat;padding:41px 0 82px}
.ala-body .ala-conv-title{
  font-size:45.008px;line-height:50px;font-weight:600;letter-spacing:-2px;
  color:var(--ala-dark-gray);text-align:center;max-width:920px;margin:0 auto 30px
}
.ala-conv-mark{
  background-image:linear-gradient(rgba(48,44,131,.3),rgba(48,44,131,.3));
  background-repeat:no-repeat;background-size:100% 10px;background-position:0 calc(100% - 10px)
}
.ala-conv-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 60px}
.ala-conv-card{
  background:#fff;border-radius:4px;height:240px;display:flex;align-items:center;justify-content:center;
  padding:43px;box-sizing:border-box;transition:background .3s
}
.ala-conv-card:hover{background:#f9f9f9}
.ala-conv-logo{width:150px;height:auto;max-width:100%}
@media (max-width:991px){.ala-conv-grid{grid-template-columns:1fr}}
/* Pages interieures : le site source garde le meme en-tete transparent
   pose PAR-DESSUS le bandeau, comme sur l accueil. */
body.ala-not-front .ala-nav-wrap{position:absolute;background:transparent;border-bottom-color:rgba(255,255,255,.1)}
.ala-brand img{max-height:83px}
.ala-body .ala-pagehead-title{width:100%}
.ala-pagehead-arrow .ala-ico{width:30px;height:30px}
.ala-body .ala-conv-title{margin-bottom:52px}
.ala-conv-grid{gap:30px;margin-bottom:52px}
/* Le bandeau des pages interieures demarre en haut de l ecran, comme la photo
   d accueil : la barre d adresse est posee par-dessus, elle ne pousse rien. */
body.ala-not-front .ala-topbar{position:absolute;top:0;left:0;right:0}
body.ala-not-front .ala-nav-wrap{top:45px}
@media (max-width:767px){body.ala-not-front .ala-nav-wrap{top:0}}
/* La fleche de defilement est posee sous le bloc titre, elle ne participe pas
   a son centrage (comme sur le site source). */
.ala-pagehead-arrow{position:absolute;left:50%;transform:translateX(-50%);bottom:-19px;margin-top:0}

/* ============================================ QUESTIONS DEPLIANTES (accordeons) */
.ala-acc-section{position:relative;overflow:hidden;padding:110px 0}
.ala-acc-deco{position:absolute;right:70px;top:-20px;width:250px;opacity:.2;pointer-events:none}
.ala-acc-deco img{width:100%;height:auto;display:block}
.ala-acc-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;position:relative;z-index:1}
.ala-body .ala-acc-coltitle{font-size:2.375rem;line-height:2.7rem;font-weight:700;letter-spacing:-1px;color:var(--ala-dark-gray);margin:0 0 20px}
.ala-acc-item{border-bottom:1px solid var(--ala-extra-medium-gray)}
.ala-acc-head{display:flex;align-items:flex-start;gap:12px;cursor:pointer;list-style:none;padding:18px 30px 18px 0;position:relative}
.ala-acc-head::-webkit-details-marker{display:none}
.ala-acc-title{font-weight:600;font-size:18px;line-height:28px;color:var(--ala-dark-gray)}
.ala-acc-ico{flex:0 0 auto;display:inline-flex;color:var(--ala-dark-gray);margin-top:3px}
.ala-acc-ico .ala-ico{width:22px;height:22px}
.ala-acc-item .ala-acc-moins{display:none}
.ala-acc-item[open] .ala-acc-plus{display:none}
.ala-acc-item[open] .ala-acc-moins{display:inline-block}
.ala-acc-body{padding:0 0 22px}
.ala-acc-body p{margin:0;color:var(--ala-dark-gray)}
.ala-acc-head:focus-visible{outline:2px solid var(--ala-base);outline-offset:2px}
@media (max-width:991px){
  .ala-acc-grid{grid-template-columns:1fr;gap:25px}
  .ala-acc-section{padding:75px 0}
  .ala-acc-deco{right:0;width:200px}
}
/* Le chevron est place a droite du libelle, comme sur le site source. */
.ala-acc-title{order:1}
.ala-acc-ico{order:2;margin-left:auto}

/* ===================================================== BLOC IMAGE + TEXTE */
.ala-service{padding:110px 0;background:url(img/vertical-line-bg-medium-gray.svg) no-repeat center/cover}
.ala-service-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.ala-service-img img{width:100%;height:auto;border-radius:6px;display:block}
.ala-body .ala-service-text h2{font-size:2.813rem;line-height:50px;font-weight:600;letter-spacing:-1px;margin:0 0 25px}
.ala-service-text p{color:var(--ala-dark-gray);text-align:justify;margin:0 0 18px}
.ala-service-text p:last-child{margin-bottom:0}

/* ===================================================== GUIDE EN ETAPES */
.ala-etapes{padding:110px 0;background-size:cover;background-position:center;background-repeat:no-repeat}
.ala-body .ala-etapes-titre{font-size:2.813rem;line-height:50px;font-weight:600;letter-spacing:-1px;text-align:center;max-width:744px;margin:0 auto 60px}
.ala-etapes-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.ala-etape{position:relative;text-align:center;padding:0 15px}
.ala-etape-ico{width:64px;height:64px;display:block;margin:0 auto 20px}
.ala-body .ala-etape-titre{font-size:20px;line-height:28px;font-weight:600;margin:0 0 5px}
.ala-etape-texte{color:var(--ala-dark-gray);height:110px;margin:0;width:90%;display:inline-block}
.ala-etape-tel{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ala-etape-tel .ala-ico{width:16px;height:16px;color:var(--ala-base)}
.ala-etape-numbox{position:relative;margin-top:30px}
.ala-etape-num{
  width:80px;height:80px;border-radius:50%;background:#fff;margin:0 auto;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:600;color:var(--ala-dark-gray);
  box-shadow:0 24px 48px rgba(0,0,0,.1);position:relative;z-index:1
}
.ala-etape-sep{position:absolute;top:50%;left:calc(50% + 40px);width:55%;height:1px;background:var(--ala-dark-gray)}
.ala-etape.is-last .ala-etape-sep{display:none}
@media (max-width:991px){
  .ala-service{padding:75px 0}
  .ala-service-grid{grid-template-columns:1fr;gap:30px}
  .ala-etapes{padding:75px 0}
  .ala-etapes-grid{grid-template-columns:1fr 1fr;gap:50px 0}
  .ala-etape-sep{display:none}
  .ala-etape-texte{height:auto}
}
@media (max-width:575px){.ala-etapes-grid{grid-template-columns:1fr}}
.ala-etape-ico{height:64px;width:auto}
.ala-acc-grid--1{grid-template-columns:1fr}
.ala-acc-body ul{margin:10px 0 10px 20px;padding:0;list-style:disc}
.ala-acc-body li{margin:0 0 6px;color:var(--ala-dark-gray)}
.ala-acc-body p{margin:0 0 14px}
.ala-acc-body p:last-child{margin-bottom:0}

/* ============================================================ ARTICLE DE BLOG */
.ala-art-head{position:relative;min-height:420px;background-size:cover;background-position:center;background-repeat:no-repeat}
.ala-art-veil{position:absolute;inset:0;background:#1f232c;opacity:.6}
.ala-art{padding:0 0 110px;position:relative}
.ala-art-card{background:#fff;border-radius:6px;box-shadow:0 24px 60px rgba(0,0,0,.08);margin-top:-160px;padding:50px 60px;text-align:center;position:relative;z-index:2}
.ala-body .ala-art-title{font-size:2.375rem;line-height:2.7rem;font-weight:700;letter-spacing:-1px;margin:0 0 15px}
.ala-art-date{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;font-size:13px;letter-spacing:1px;font-weight:600;color:var(--ala-medium-gray);margin:0}
.ala-art-date .ala-ico{width:18px;height:18px;color:var(--ala-base)}
.ala-art-badge{width:130px;height:130px;border-radius:50%;border:8px solid #fff;overflow:hidden;margin:-65px auto 0;position:relative;z-index:3;background:#fff}
.ala-art-badge img{width:100%;height:100%;object-fit:cover;display:block}
.ala-art-figure{margin:35px 0 40px;background:var(--ala-card);border-radius:6px;overflow:hidden}
.ala-art-figure img{width:100%;height:auto;display:block}
.ala-art-body{max-width:900px;margin:0 auto}
.ala-art-body p{text-align:justify;margin:0 0 18px;color:var(--ala-dark-gray)}
.ala-body .ala-art-body h2,.ala-body .ala-art-body h3,.ala-body .ala-art-body h4,.ala-body .ala-art-body h5{font-size:1.25rem;line-height:1.7rem;font-weight:700;margin:26px 0 10px}
.ala-art-body ul{margin:0 0 18px 20px;list-style:disc}
.ala-art-body li{margin:0 0 8px;color:var(--ala-dark-gray)}
.ala-art-body img{border-radius:6px;display:block;margin:25px auto}
@media (max-width:767px){
  .ala-art-head{min-height:260px}
  .ala-art-card{margin-top:-90px;padding:30px 22px}
  .ala-art{padding-bottom:70px}
}

/* ============================================================ LISTE DU BLOG */
.ala-blog{padding:110px 0}
.ala-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.ala-blog-card{background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 0 25px rgba(0,0,0,.06);display:flex;flex-direction:column}
.ala-blog-media{position:relative;display:block;overflow:hidden}
.ala-blog-media img{width:100%;height:auto;display:block;transition:transform .5s}
.ala-blog-card:hover .ala-blog-media img{transform:scale(1.05)}
.ala-blog-tag{position:absolute;left:15px;top:15px;background:var(--ala-base);color:#fff;font-size:12px;font-weight:600;letter-spacing:.5px;padding:5px 12px;border-radius:4px}
.ala-blog-body{padding:25px 28px 28px;display:flex;flex-direction:column;flex:1}
.ala-body .ala-blog-title{font-size:20px;line-height:28px;font-weight:600;margin:0 0 12px}
.ala-blog-title a{color:var(--ala-dark-gray)}
.ala-blog-title a:hover{color:var(--ala-base)}
.ala-blog-extrait{color:var(--ala-medium-gray);margin:0 0 15px}
.ala-blog-meta{font-size:14px;color:var(--ala-medium-gray);margin:0 0 15px}
.ala-blog-lire{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--ala-base);margin-top:auto}
.ala-blog-lire .ala-ico{width:18px;height:18px}
@media (max-width:1199px){.ala-blog-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.ala-blog{padding:75px 0}.ala-blog-grid{grid-template-columns:1fr}}

/* ================================================= SPECIALITES DETAILLEES
   Le site source fait deborder la photo jusqu au bord de l ecran (col-md-5)
   et pose le pictogramme dans un disque bleu. */
.ala-specd-item{padding:0}
.ala-specd-item > .ala-container{max-width:none;width:100%;padding:0}
.ala-specd-grid{display:grid;grid-template-columns:5fr 7fr;gap:0;align-items:center}
.ala-specd-img-droite .ala-specd-grid{grid-template-columns:7fr 5fr}
.ala-specd-img-droite .ala-specd-photo{order:2}
.ala-specd-photo img{width:100%;height:auto;display:block;border-radius:0}
.ala-specd-text{text-align:center;padding:60px;max-width:700px;margin:0 auto}
.ala-specd-ico{
  width:100px;height:100px;border-radius:50%;background:var(--ala-base);
  display:inline-flex;align-items:center;justify-content:center;margin-bottom:20px
}
.ala-specd-ico svg{width:48px;height:48px;display:block}
.ala-body .ala-specd-titre{font-size:2.375rem;line-height:2.7rem;font-weight:700;letter-spacing:-1px;margin:0 0 18px}
.ala-specd-desc{font-size:15px;line-height:28px;color:var(--ala-dark-gray)}
.ala-specd-desc p{margin:0 0 14px}
.ala-specd-desc p:last-child{margin-bottom:0}
.ala-specd-desc ul{margin:0 0 14px;padding:0;list-style:none}
.ala-specd-desc li{margin:0 0 8px}
@media (max-width:991px){
  .ala-specd-grid,.ala-specd-img-droite .ala-specd-grid{grid-template-columns:1fr}
  .ala-specd-img-droite .ala-specd-photo{order:0}
  .ala-specd-text{padding:40px 20px}
}

/* =========================================================================
   PASSE MOBILE 2026-09-29 -- alignement sur le site source (mesures CDP 390px)
   Place en FIN de feuille : plusieurs regles NON scopees ecrites plus haut
   (l.579 h3, l.582 prelev h3, l.609 spec-item, l.697 logo) annulaient le
   bloc RESPONSIVE. Tout est sous media query : le rendu ordinateur est
   inchange.
   ========================================================================= */
@media (max-width:991px){
  .ala-brand img{max-height:70px}
  .ala-nav{padding:0}
  .ala-body.home h3{font-size:24px;line-height:37.5px}
  .ala-body.home .ala-prelev h3{font-size:28.5px;line-height:37.5px;margin-bottom:25px}
  .ala-galerie h3{margin-bottom:25px}
  .ala-body .ala-spec-title{margin-bottom:30px}
  .ala-spec-item{min-height:0;padding:21.59px}
  .ala-spec,.ala-galerie{padding:50px 0}
  .ala-veines{padding:0}
  .ala-veines-grid{row-gap:30px}
  .ala-prelev{padding:65px 0 0}
  .ala-prelev-grid{row-gap:35px}
  .ala-avis{padding:60px 0 20px}
  .ala-footer-grid{padding:40px 0 0}
}
@media (max-width:767px){
  .ala-veines-img{margin-left:-15px;margin-right:-15px}
  .ala-footer-links{grid-template-columns:repeat(2,1fr)}
  .ala-popup-content{padding:21.59px}
  .ala-popup-title{margin-bottom:9px}
  .ala-popup-cta-wrap{margin-top:5px}
}
@media (max-width:991px){
  /* l.547 .ala-nav{min-height:94px} n est pas scopee : elle annulait le
     min-height:auto du bloc RESPONSIVE. Barre de 83px comme le site source. */
  .ala-nav{min-height:0}
  /* Avis : marges interieures du site source (25px / 15px-25px) */
  .ala-avis-text{padding:25px}
  .ala-avis-foot{padding:15px 25px}
}

/* =========================================================================
   PASSE MOBILE 2026-10-01 -- PAGES INTERIEURES
   Les composants des pages interieures (bandeau, titres de section, grilles)
   etaient ecrits SANS media query dans le bloc "CONFORMITE AU SITE SOURCE".
   Ils passaient donc devant le bloc RESPONSIVE a specificite egale et
   imposaient les valeurs ordinateur sur telephone.
   Valeurs reprises du site source, mesurees par emulation CDP a 390px sur
   laboratoire-analyses-marrakech.com (6 pages interieures).
   Tout est sous media query : le rendu ordinateur est inchange.
   ========================================================================= */

/* 1. En-tete des pages interieures : le site source repasse la barre en
   BLANC OPAQUE et DANS LE FLUX sous 992px (navbar-expand-lg), le bandeau
   commence en dessous. La regle non scopee l.697
   (position:absolute;background:transparent) annulait les l.438-439 du bloc
   RESPONSIVE : en-tete transparent sur la photo sombre, d ou le rectangle
   blanc du logo (logoblack.png a fond blanc). */
@media (max-width:991px){
  body.ala-not-front .ala-nav-wrap{
    position:relative;top:0;background:#fff;
    border-bottom-color:var(--ala-extra-medium-gray)
  }
}

@media (max-width:767px){
  /* 2. Bandeau de page : source pt=30px (nous 100px), pb=85px identique. */
  .ala-pagehead{padding-top:30px}
  /* 3. Titre du bandeau : source 30/30 (nous 40/40). */
  .ala-body .ala-pagehead-title{font-size:30px;line-height:30px}

  /* 4. Titre de section "Nos conventions" : source 24/37.5, mb 25
     (nous 45.008/50, mb 52). */
  .ala-body .ala-conv-title{font-size:24px;line-height:37.5px;margin-bottom:25px}
  /* 5. Section conventions : source pt=50 pb=23 (nous 41/82). */
  .ala-conv{padding:50px 0 23px}

  /* 6. l.578 .ala-body h3{line-height:50px} n est pas scopee : elle annulait
     l interligne du bloc RESPONSIVE. Source 24/37.5 -- valeur deja en place
     sur l accueil, les pages interieures etaient restees a 32/50. */
  .ala-body.ala-not-front h3{font-size:24px;line-height:37.5px}

  /* 7. Titre de colonne des questions depliantes : source 28.5/32.4, mb 25
     (nous 38/43.2, mb 20). */
  .ala-body .ala-acc-coltitle{font-size:28.5px;line-height:32.4px;margin-bottom:25px}

  /* 8. Titre du bloc image+texte : source 28.5/32.4, ls -.5px
     (nous 45.008/50, ls -1px). */
  .ala-body .ala-service-text h2{font-size:28.5px;line-height:32.4px;letter-spacing:-.5px;margin-bottom:25px}

  /* 9. Titre du guide en etapes : source 24/37.5, mb 25
     (nous 45.008/50, mb 60). */
  .ala-body .ala-etapes-titre{font-size:24px;line-height:37.5px;margin-bottom:25px}

  /* 10. Titre de specialite : source 28.5/32.4, graisse 400, ls -.5px, mb 25
     (nous 38/43.2, graisse 700, ls -1px, mb 18). */
  .ala-body .ala-specd-titre{font-size:28.5px;line-height:32.4px;font-weight:400;letter-spacing:-.5px;margin-bottom:25px}
  /* Interligne du texte de specialite : source 30px (nous 28px). */
  .ala-specd-desc{line-height:30px}

  /* 11. Liste du blog : source pt/pb 50px (nous 75px). */
  .ala-blog{padding:50px 0}
}

/* Correctif de la meme passe : la regle 6 ci-dessus (.ala-body.ala-not-front h3)
   attrapait aussi les titres du guide en 4 etapes, qui sont des h3. Le site
   source les affiche en 20px / 30px, graisse 600 (mesure 390px). */
@media (max-width:767px){
  .ala-body.ala-not-front .ala-etape-titre{font-size:20px;line-height:30px;font-weight:600}
}

/* =========================================================================
   PASSE MOBILE 2 -- 2026-10-01. Gabarit article, pastille du blog,
   espacements de /specialite et /book-an-appointment.
   Valeurs relevees par emulation CDP a 390px sur le site source.
   ========================================================================= */

/* Pastille de categorie de la liste du blog. Source (a.categories-btn) :
   fond BLANC, texte #292d36, MAJUSCULES, graisse 700, padding 4px 12px,
   rayon 2px, interligne 20px, placee en haut a DROITE (top 17px, right 20px).
   Mesure identique a 390px et a 1366px -- la regle n est donc pas scopee. */
.ala-blog-tag{
  left:auto;right:20px;top:17px;
  background:#fff;color:var(--ala-dark-gray);
  font-size:12px;line-height:20px;font-weight:700;letter-spacing:normal;
  text-transform:uppercase;padding:4px 12px;border-radius:2px
}

@media (max-width:767px){
  /* GABARIT ARTICLE. Mesures source a 390px : bandeau 83->433, carte 433
     (donc AUCUN chevauchement sur l image), titre h3 24px/37.5px (4 lignes),
     disque 130px pose 30px SOUS la carte (bas de carte 686, disque 716).
     Chez nous : carte mt -90px (chevauchement), titre 38px/43.2px (7 lignes),
     disque mt -65px qui recouvrait la ligne de date. */
  .ala-art-card{margin-top:0}
  .ala-body .ala-art-title{font-size:24px;line-height:37.5px}
  .ala-art-badge{margin-top:30px}

  /* SPECIALITES. Source : 30px entre la photo et le bloc de texte (marge
     basse de l image), et 0px entre le disque et le titre. Nous : 40px de
     retrait haut et 20px sous le disque. */
  .ala-specd-ico{margin-bottom:0}
  .ala-specd-text{padding-top:30px}

  /* QUESTIONS DEPLIANTES. Source : retrait haut et bas de 25.19px sur le
     bloc des questions. Nous : 75px. */
  .ala-acc-section{padding-top:25px;padding-bottom:25px}
}