/* ============================================================
   DOCTEUR — SECTION PREMIUM "À PROPOS"
   Hero + hotspots interactifs + parcours + valeurs + expertise
   + technologies. Design system : voir variables.css
   ============================================================ */

/* ── 1+2. HERO & HOTSPOTS ── */
.dr-hero-section { background:var(--c-bleu-pale); position:relative; overflow:hidden; }
.dr-hero-section::before {
    content:''; position:absolute; top:-12%; left:-10%; width:42%; height:65%;
    background:radial-gradient(ellipse, rgba(125,194,66,.12) 0%, transparent 70%);
    pointer-events:none; animation:deriveFond2 20s ease-in-out infinite; z-index:0;
}
.dr-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:start; }

.dr-hero-visuel { position:relative; }

.dr-hero-halo {
    position:absolute; inset:-16% -16% auto -16%; height:120%; z-index:0; border-radius:50%;
    background:conic-gradient(from 0deg, rgba(125,194,66,.35), rgba(41,171,226,.35), rgba(125,194,66,.35));
    filter:blur(48px); opacity:.5;
    animation:drHaloTourne 16s linear infinite;
}
@keyframes drHaloTourne { to { transform:rotate(360deg); } }

.dr-hero-shape {
    position:absolute; z-index:0; border-radius:50%; pointer-events:none;
    background:var(--g-logo); opacity:.14; filter:blur(2px);
}
.dr-hero-shape-1 { width:64px; height:64px; top:-4%; right:8%; animation:flotteDent 9s ease-in-out infinite; }
.dr-hero-shape-2 { width:44px; height:44px; top:32%; left:-4%; animation:flotteDent 11s ease-in-out infinite reverse; }

/* Grille de points décorative (accent inspiré d'un motif éditorial) */
.dr-hero-dots {
    position:absolute; z-index:0; top:-6%; right:-2%; width:104px; height:104px;
    background-image:radial-gradient(var(--c-vert) 1.6px, transparent 1.6px);
    background-size:16px 16px;
    opacity:.4; pointer-events:none;
    -webkit-mask-image:radial-gradient(circle, #000 55%, transparent 100%);
    mask-image:radial-gradient(circle, #000 55%, transparent 100%);
}

/* Accents "croix" façon signalétique médicale */
.dr-hero-plus { position:absolute; z-index:2; width:22px; height:22px; pointer-events:none; }
.dr-hero-plus::before,
.dr-hero-plus::after { content:''; position:absolute; background:var(--c-vert); border-radius:3px; }
.dr-hero-plus::before { top:0; left:42%; width:16%; height:100%; }
.dr-hero-plus::after  { top:42%; left:0; width:100%; height:16%; }
.dr-hero-plus-1 { top:2%; left:6%; opacity:.55; animation:flotteDent 10s ease-in-out infinite; }
.dr-hero-plus-2 {
    bottom:14%; right:-4%; width:16px; height:16px; opacity:.6;
    animation:flotteDent 8s ease-in-out infinite reverse;
}
.dr-hero-plus-2::before,
.dr-hero-plus-2::after { background:var(--c-bleu); }

.dr-hero-photo-outer {
    position:relative; z-index:1;
    transition:transform .25s ease-out; will-change:transform;
}
.dr-hero-photo-wrap {
    position:relative; overflow:hidden; aspect-ratio:1/1; max-width:440px; margin:0 auto;
    box-shadow:var(--ombre-lg);
    background:var(--g-logo);
    border-radius:42% 58% 65% 35% / 45% 40% 60% 55%;
    animation:drFlotte 7s ease-in-out infinite, drBlobMorph 13s ease-in-out infinite;
}
.dr-hero-photo-wrap img { width:100%; height:100%; object-fit:cover; display:block; }
@keyframes drFlotte {
    0%,100% { transform:translateY(0) rotate(0deg); }
    50%     { transform:translateY(-14px) rotate(.6deg); }
}
@keyframes drBlobMorph {
    0%,100% { border-radius:42% 58% 65% 35% / 45% 40% 60% 55%; }
    50%     { border-radius:58% 42% 35% 65% / 55% 60% 40% 45%; }
}

/* ── Badges flottants sur la photo (crédibilité en un coup d'œil) ── */
.dr-hero-badge {
    position:absolute; z-index:3; display:flex; align-items:center; gap:10px;
    background:var(--c-blanc); border-radius:var(--radius-btn);
    box-shadow:var(--ombre-md); padding:10px 16px 10px 10px;
    animation:drBadgeFlotte 6s ease-in-out infinite;
}
.dr-hero-badge-experience { top:9%; left:-9%; }
.dr-hero-badge-experience .dr-hero-badge-icone {
    width:36px; height:36px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--g-vert); color:#fff;
}
.dr-hero-badge-experience .dr-hero-badge-texte {
    font-size:.8rem; font-weight:700; color:var(--c-bleu-nuit); line-height:1.25; max-width:118px;
}

.dr-hero-badge-stat {
    bottom:7%; right:-7%; flex-direction:column; text-align:center; gap:0;
    background:var(--g-bleu); color:#fff; padding:14px 20px;
    animation-delay:.6s;
}
.dr-hero-badge-stat strong { font-family:var(--f-display); font-size:1.55rem; line-height:1.1; }
.dr-hero-badge-stat small { font-size:.66rem; font-weight:700; opacity:.92; text-transform:uppercase; letter-spacing:.05em; }

@keyframes drBadgeFlotte {
    0%,100% { transform:translateY(0); }
    50%     { transform:translateY(-8px); }
}

@media(max-width:980px){
    .dr-hero-grid { grid-template-columns:1fr; gap:56px; align-items:stretch; }
    .dr-hero-visuel { max-width:400px; margin-left:auto; margin-right:auto; }
    .dr-hero-badge-experience { left:-4%; }
    .dr-hero-badge-stat { right:-4%; }
}
@media(max-width:560px){
    .dr-hero-dots { width:76px; height:76px; }
    .dr-hero-badge { padding:8px 14px 8px 8px; gap:8px; }
    .dr-hero-badge-experience { top:4%; left:-2%; }
    .dr-hero-badge-experience .dr-hero-badge-texte { font-size:.72rem; max-width:96px; }
    .dr-hero-badge-stat { bottom:2%; right:-2%; padding:10px 14px; }
    .dr-hero-badge-stat strong { font-size:1.25rem; }
}

/* ── Contenu texte du hero ── */
.dr-hero-titre { margin-bottom:14px; }
.dr-hero-titre > span:first-child {
    display:block; font-family:var(--f-corps); font-size:.55em; font-weight:700;
    color:var(--c-bleu-fonce); text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px;
}
.dr-hero-nom {
    position:relative; display:inline-block; color:var(--c-vert-fonce); z-index:1;
}
.dr-hero-nom::after {
    content:''; position:absolute; z-index:-1; left:-3%; right:-3%; bottom:.08em; height:.3em;
    background:var(--g-logo); opacity:.16; border-radius:6px;
}
.dr-hero-soussigne {
    font-family:var(--f-display); font-style:italic; font-weight:600;
    font-size:1.3rem; color:var(--c-bleu-fonce); margin-bottom:16px;
}
.dr-hero-texte { font-size:1.02rem; }
.dr-hero-cta { display:flex; gap:14px; flex-wrap:wrap; margin:8px 0 20px; }

/* ============================================================
   5. VALEURS
   ============================================================ */
.dr-valeurs-section { position:relative; }
.dr-valeurs-grille { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.dr-valeur-carte {
    background:var(--c-blanc); border-radius:var(--radius-card);
    padding:32px 24px; text-align:center; border:1.5px solid var(--c-bordure);
    box-shadow:var(--ombre-sm); transition:var(--transition);
    position:relative; overflow:hidden;
}
.dr-valeur-carte::before {
    content:''; position:absolute; top:0; left:0; right:0; height:4px;
    background:var(--g-logo); transform:scaleX(0); transform-origin:left;
    transition:transform .35s ease;
}
.dr-valeur-carte:hover { transform:translateY(-6px); box-shadow:var(--ombre-lg); border-color:transparent; }
.dr-valeur-carte:hover::before { transform:scaleX(1); }
.dr-valeur-icone {
    width:62px; height:62px; border-radius:16px; margin:0 auto 18px;
    display:flex; align-items:center; justify-content:center;
    background:var(--c-bleu-clair); color:var(--c-bleu);
    transition:transform .4s cubic-bezier(.34,1.56,.64,1), background .3s ease, color .3s ease;
}
.dr-valeur-carte:nth-child(even) .dr-valeur-icone { background:var(--c-vert-clair); color:var(--c-vert-fonce); }
.dr-valeur-carte:hover .dr-valeur-icone { transform:scale(1.1) rotate(-6deg); background:var(--g-logo); color:#fff; }
.dr-valeur-carte h3 { font-size:1.08rem; margin-bottom:10px; }
.dr-valeur-carte p { font-size:.88rem; }

@media(max-width:980px){ .dr-valeurs-grille{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .dr-valeurs-grille{ grid-template-columns:1fr; } }

/* ============================================================
   7. TECHNOLOGIES MODERNES
   ============================================================ */
.dr-technologies-section { background:var(--c-bleu-nuit); color:#fff; position:relative; overflow:hidden; }
.dr-technologies-section::before {
    content:''; position:absolute; top:-16%; left:-10%; width:46%; height:70%;
    background:radial-gradient(ellipse, rgba(125,194,66,.14) 0%, transparent 70%);
    pointer-events:none; animation:deriveFond2 19s ease-in-out infinite; z-index:0;
}
.dr-technologies-section::after {
    content:''; position:absolute; bottom:-18%; right:-10%; width:44%; height:65%;
    background:radial-gradient(ellipse, rgba(41,171,226,.16) 0%, transparent 70%);
    pointer-events:none; animation:deriveFond1 22s ease-in-out infinite; z-index:0;
}
.dr-technologies-section .dent-flottante {
    position:absolute; top:8%; right:6%; width:60px; height:60px;
    background:var(--g-logo);
    clip-path:path('M50 4C25 4 8 22 9 46C10 62 18 74 24 88C28 97 38 96 39 85C40 76 43 72 50 72C57 72 60 76 61 85C62 96 72 97 76 88C82 74 90 62 91 46C92 22 75 4 50 4Z');
    opacity:.1; pointer-events:none; animation:flotteDent 12s ease-in-out infinite; z-index:0;
}
.dr-technologies-section .eyebrow { color:var(--c-vert); }
.dr-technologies-section .eyebrow::before,
.dr-technologies-section .eyebrow::after { background:var(--g-logo); }
.dr-technologies-section h2 { color:#fff; }
.dr-technologies-section p  { color:rgba(255,255,255,.72); }

/* ── Slider "coverflow" — vitrine des technologies avec vraies illustrations ── */
.dr-tech-slider-viewport {
    position:relative; z-index:1;
    height:clamp(460px,52vw,540px);
    perspective:1400px;
    display:flex; align-items:center; justify-content:center;
    margin-top:8px;
}
.dr-tech-slider-track {
    position:relative; width:100%; height:100%;
    display:flex; align-items:center; justify-content:center;
    transform-style:preserve-3d;
}
.dr-tech-slide {
    position:absolute; width:clamp(260px,27vw,320px);
    background:rgba(255,255,255,.05); border:1.5px solid rgba(255,255,255,.14);
    border-radius:var(--radius-card); overflow:hidden;
    backdrop-filter:blur(8px);
    box-shadow:0 20px 50px rgba(0,0,0,.35);
    transition:transform .6s cubic-bezier(.25,.1,.25,1), opacity .6s ease, box-shadow .4s ease, border-color .4s ease;
    cursor:pointer;
}
.dr-tech-slide.dr-tech-slide-actif { border-color:var(--c-vert); box-shadow:0 28px 60px rgba(0,0,0,.45); }

.dr-tech-slide-img-wrap { position:relative; aspect-ratio:4/3; overflow:hidden; }
.dr-tech-slide-img-wrap img {
    width:100%; height:100%; object-fit:cover; display:block;
    animation:drTechKenBurns 12s ease-in-out infinite alternate;
}
@keyframes drTechKenBurns { 0%{ transform:scale(1); } 100%{ transform:scale(1.12); } }

/* Effet de balayage lumineux, au survol de la vignette active */
.dr-tech-slide-shine { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.dr-tech-slide-shine::before {
    content:''; position:absolute; top:0; bottom:0; left:-60%; width:40%;
    background:linear-gradient(100deg, transparent 20%, rgba(255,255,255,.5) 50%, transparent 80%);
    transform:skewX(-18deg) translateX(0);
    transition:transform 1s cubic-bezier(.22,1,.36,1);
}
.dr-tech-slide.dr-tech-slide-actif:hover .dr-tech-slide-shine::before { transform:skewX(-18deg) translateX(420%); }

.dr-tech-slide-contenu { padding:20px 22px 24px; }
.dr-tech-slide-contenu h3 { color:#fff; font-size:1.02rem; margin-bottom:8px; }
.dr-tech-slide-contenu p { color:rgba(255,255,255,.68); font-size:.85rem; line-height:1.55; }

.dr-tech-slider-nav { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; gap:18px; margin-top:36px; }
.dr-tech-slider-nav button {
    width:46px; height:46px; border-radius:50%; flex-shrink:0;
    border:1.5px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06);
    color:#fff; display:flex; align-items:center; justify-content:center;
    transition:var(--transition);
}
.dr-tech-slider-nav button:hover { background:var(--c-vert); border-color:var(--c-vert); }
.dr-tech-slider-dots { display:flex; align-items:center; gap:9px; }
.dr-tech-slider-dots button {
    width:9px; height:9px; border-radius:5px; padding:0;
    background:rgba(255,255,255,.25); border:none; transition:var(--transition);
}
.dr-tech-slider-dots button.dr-tech-dot-actif { background:var(--c-vert); width:22px; }

@media(max-width:760px){
    .dr-tech-slider-viewport { height:clamp(420px,94vw,480px); }
    .dr-tech-slide { width:min(78vw,300px); }
}
@media(prefers-reduced-motion:reduce){
    .dr-tech-slide-img-wrap img { animation:none; }
}

@media(prefers-reduced-motion:reduce){
    .dr-hero-halo, .dr-hero-shape, .dr-hero-plus, .dr-hero-photo-wrap, .dr-hero-badge, .dr-hotspot-ping { animation:none !important; }
}