@charset "UTF-8";
@import url(main.css);
/*================== CUSTOM FORMULAIRE DE CONTACT ===================*/
.lh-1.mb-3.titles { margin-left: 50px; }

@media (max-width: 991px) { .lh-1.mb-3.titles { margin-left: 0px; padding: 10px; } }

form#formContact { border-radius: 0px !important; border: none !important; }

button.w-100.btn.btn-outline-dark { border: none; }

/*================= CUSTOM BLOC MAPS =======================*/
div.maps-section.position-relative.bg-sixthColor > div.content-container.position-relative > div > div.col-sm-12.col-lg-6.col-xl-4.py-5.content.text-color-sixth > div.mb-4.text-center.display-6.titles > h4 { font-size: 2.5rem; }

h5.mb-4, span.fs-4.titles { font-family: 'Indie Flower'; }

.maps-section .map-content { padding: 50px; }

.maps-section iframe { border-radius: 0px !important; }

/*================== CUSTOM BLOC SEO =====================*/
.mx-auto.third-activity-div.col-lg-11.px-4.py-4.mb-4.mt-5.bg-primaryColor.text-color-primary.rounded-3.shadow-lg.position-relative, .mx-auto.second-activity-div.col-lg-11.px-4.py-4.mb-5.mt-5.rounded-3.shadow-lg.bg-primaryColor.text-color-primary.position-relative, .mx-auto.first-activity-div.col-lg-11.px-4.py-4.mb-5.mt-5.bg-primaryColor.text-color-primary.rounded-3.shadow-lg.position-relative { box-shadow: none !important; }

.card.card-cover.h-100.overflow-hidden.rounded-4.shadow-lg { border-radius: 0px !important; border: none !important; box-shadow: none !important; }

.black-screen { display: none; }

/*================== CUSTOM COOKIES =====================*/
div#termsfeed-com---nb { border-radius: 0px !important; margin: 10px; }

/*=================== CUSTOM NAVBAR ==================*/
.spacer { margin-top: 9vh; }

.navbar-brand { height: 10vh !important; width: 10vw !important; }

.logo_nav { height: 9vh !important; }

.fs-6.animated-border-button.obftrucs { font-family: 'Aesthet Nova'; color: #3f3d75; font-size: 1.2rem !important; }

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone { padding: 12px 22px !important; }

.animated-border-button:after { background-color: #c54b83; }

a.nav-link.fs-6.dropdown-toggle.px-0.text-color-secondary.text-center { color: #3f3d75 !important; font-family: 'Aesthet Nova'; font-size: 1.1rem !important; }

/*====================================================================== HERO D'ACCUEIL ==========================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; --white: #fefefe; }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── FOND LAVANDE ── */
.drohe-page { background: var(--white); min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 4vh 0; }

/* ── OUTER WRAPPER — marges lavande sur les côtés ── */
.drohe-hero-outer { width: 100%; }

/* ── HERO CONTAINER ── */
.drohe-hero { position: relative; width: 100%; min-height: 92vh; border-radius: 0px; overflow: hidden; display: flex; align-items: center; justify-content: center; }

/* ── IMAGE DE FOND ── */
.drohe-hero__bg { position: absolute; inset: 0; background: url("https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2F0f4Yb4CuKtejlYEgiz6gVeUclfu1%2Fimages%2FIdentite_visuelle_Drohe_Home_Conception_lf36.webp") center center/cover no-repeat; background-color: #a89bb0; }

.drohe-hero__overlay { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(63, 61, 117, 0.35) 0%, rgba(30, 28, 60, 0.55) 50%, rgba(197, 75, 131, 0.2) 100%); }

/* ── CONTENU CENTRÉ ── */
.drohe-hero__content { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 1740px; padding: 4vh 4vw; }

.drohe-hero__logo { width: 400px; object-fit: contain; margin-bottom: 3vh; opacity: 0; animation: drohe-fade 1s 0s ease forwards; }

.drohe-hero__eyebrow { font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--dry-sage); display: flex; align-items: center; gap: 12px; margin-bottom: 3.5vh; opacity: 0; animation: drohe-up 0.8s 0.2s ease forwards; }

.drohe-hero__eyebrow::before, .drohe-hero__eyebrow::after { content: ''; display: block; width: 24px; height: 1px; background: var(--fuchsia-plum); flex-shrink: 0; }

.drohe-hero__title { font-family: 'Aesthet Nova'; font-size: 8rem; font-weight: 400; color: #fff; line-height: 0.95; margin: 0 0 3vh; opacity: 0; animation: drohe-up 1s 0.4s ease forwards; white-space: nowrap; /* Empêche le texte de se diviser en plusieurs lignes */ max-width: none; }

.drohe-hero__title em { font-style: italic; color: var(--pastel-petal); display: block; }

.drohe-hero__subtitle { font-family: 'Indie Flower', cursive; font-size: 2rem; color: rgba(255, 255, 255, 0.82); margin: 0 0 5vh; line-height: 1.6; opacity: 0; animation: drohe-up 1s 0.6s ease forwards; }

button.w-100.btn.btn-outline-dark, a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone, .drohe-hero__btn { display: inline-flex; align-items: center; gap: 14px; font-family: 'Lato', sans-serif; font-size: 15px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 16px 30px; border-radius: 40px; text-decoration: none; opacity: 0; animation: drohe-up 1s 0.8s ease forwards; transition: background 0.3s ease, gap 0.3s ease; }

button.w-100.btn.btn-outline-dark:hover, a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone:hover, .drohe-hero__btn:hover { background: #a83870; gap: 20px; color: white; }

.drohe-hero__btn svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-hero__btn svg path, a.grow svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 200; stroke-dashoffset: 200; animation: drohe-draw 1.4s 1s ease forwards; }

.drohe-hero__horseshoe { position: absolute; bottom: 4vh; left: 3vw; width: 60px; opacity: 0; animation: drohe-fade 1s 1.4s ease forwards; z-index: 2; }

.drohe-hero__deco-line { position: absolute; top: 4vh; right: 3vw; width: 80px; opacity: 0; animation: drohe-fade 1s 1.6s ease forwards; z-index: 2; }

.drohe-hero__deco-line path { stroke-dasharray: 300; stroke-dashoffset: 300; animation: drohe-draw 2s 1.6s ease forwards; }

@media (max-width: 1666px) { .drohe-hero__eyebrow { font-size: 1rem; } .drohe-hero__title { font-size: 6rem; } .drohe-hero__subtitle { font-size: 1.5rem; } }

@media (max-width: 768px) { .drohe-hero-outer { padding: 0 4vw; } .drohe-hero { min-height: 88vh; border-radius: 0px; } .drohe-hero__title { font-size: clamp(32px, 10vw, 52px); } .drohe-hero__subtitle { font-size: 4vw; } }

@keyframes drohe-up { from { opacity: 0;
    transform: translateY(16px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes drohe-fade { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes drohe-draw { to { stroke-dashoffset: 0; } }

/*=================================================================== PRESENTATION DE L'ENTREPRISE ==================================================================*/
.drohe-section { background: #fefefe; padding: 16vh 6vw; display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; align-items: center; position: relative; overflow: hidden; }

/* ── TRAITS ONE-LINE EN BACKGROUND ── */
.drohe-section__bg-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }

.drohe-section__bg-lines path, .drohe-section__bg-lines circle { stroke-dasharray: 600; stroke-dashoffset: 600; animation: drohe-draw-bg 3s 0.8s ease forwards; }

.drohe-section__bg-lines circle { stroke-dasharray: 100; stroke-dashoffset: 100; }

.drohe-section__images, .drohe-section__text { position: relative; z-index: 1; }

@keyframes drohe-draw-bg { to { stroke-dashoffset: 0; } }

/* ── COLONNE GAUCHE — deux images en quinconce ── */
.drohe-section__images { position: relative; height: 560px; }

.drohe-section__img { position: absolute; object-fit: cover; border-radius: 0px; overflow: hidden; }

/* Image principale — grande, en haut à gauche */
.drohe-section__img--main { width: 68%; aspect-ratio: 4/5; top: 0; left: 0; box-shadow: 0 12px 40px rgba(63, 61, 117, 0.12); opacity: 0; animation: drohe-up 1s 0.2s ease forwards; }

/* Image secondaire — plus petite, décalée en bas à droite */
.drohe-section__img--secondary { width: 52%; aspect-ratio: 3/4; bottom: 0; right: 0; box-shadow: 0 8px 28px rgba(63, 61, 117, 0.1); opacity: 0; animation: drohe-up 1s 0.5s ease forwards; }

/* Accent déco — petit carré fuchsia derrière l'image principale */
.drohe-section__img-accent { position: absolute; width: 40%; aspect-ratio: 1; top: -18px; left: -18px; border-radius: 0px; background: var(--pastel-petal); opacity: 0.45; z-index: 0; }

.drohe-section__img--main, .drohe-section__img--secondary { z-index: 1; }

/* ── COLONNE DROITE — texte ── */
.drohe-section__text { display: flex; flex-direction: column; gap: 0; }

.drohe-section__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 10px; margin-bottom: 2.5vh; opacity: 0; animation: drohe-up 0.8s 0.3s ease forwards; }

.drohe-section__eyebrow::before { content: ''; display: block; width: 20px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-section__title { font-family: 'Aesthet Nova'; font-size: 3.7rem; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin-bottom: 2vh; opacity: 0; animation: drohe-up 1s 0.4s ease forwards; }

.drohe-section__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-section__subtitle { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: var(--dry-sage); margin-bottom: 3.5vh; opacity: 0; animation: drohe-up 1s 0.5s ease forwards; }

/* Ligne séparatrice */
.drohe-section__divider { width: 100%; height: 1px; background: linear-gradient(to right, var(--fuchsia-plum) 0%, rgba(197, 75, 131, 0.15) 60%, transparent 100%); margin-bottom: 3.5vh; opacity: 0; animation: drohe-fade 1s 0.6s ease forwards; }

.drohe-section__body { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #555; line-height: 1.85; opacity: 0; animation: drohe-up 1s 0.7s ease forwards; max-width: 600px; }

/* ── RESPONSIVE ── */
@media (max-width: 900px) { .drohe-section { grid-template-columns: 1fr; padding: 8vh 8vw; } .drohe-section__title { font-size: 2.2rem; } .drohe-section__images { height: 420px; } }

/* ── ANIMATIONS ── */
@keyframes drohe-up { from { opacity: 0;
    transform: translateY(16px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes drohe-fade { from { opacity: 0; }
  to { opacity: 1; } }

/*========================================================================= LES PRODUITS =======================================================================*/
.drohe-products { background: #d1d1e2; padding: 100px 0; text-align: center; }

/* ── HEADER ── */
.drohe-products__header { margin-bottom: 2rem; padding: 0 6vw; }

.drohe-products__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 2vh; opacity: 0; animation: drohe-up 0.8s 0.1s ease forwards; }

.drohe-products__eyebrow::before, .drohe-products__eyebrow::after { content: ''; display: block; width: 20px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-products__title { font-family: 'Aesthet Nova'; font-size: clamp(32px, 3.5vw, 56px); font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; opacity: 0; animation: drohe-up 1s 0.25s ease forwards; }

.drohe-products__title em { font-style: italic; color: var(--fuchsia-plum); }

/* ── GRILLE ── */
.drohe-products__grid { display: grid; grid-template-columns: repeat(3, 1fr); }

/* ── CARTE ── */
.drohe-card { position: relative; display: flex; flex-direction: column; align-items: center; border-right: 1px solid rgba(63, 61, 117, 0.1); opacity: 0; transition: background 0.4s ease; }

.drohe-card:last-child { border-right: none; }

/* Delay par carte */
.drohe-card:nth-child(1) { animation: drohe-up 1s 0.3s ease forwards; }

.drohe-card:nth-child(2) { animation: drohe-up 1s 0.5s ease forwards; }

.drohe-card:nth-child(3) { animation: drohe-up 1s 0.7s ease forwards; }

/* ── IMAGE PRODUIT ── */
.drohe-card__img { width: 100%; aspect-ratio: 16/9; object-fit: contain; border-radius: 0px; margin-bottom: 0; display: block; max-height: 300px; }

/* ── ICÔNE ONE-LINE SVG ── */
.drohe-card__icon { width: 72px; height: 56px; margin-bottom: 3.5vh; flex-shrink: 0; }

.drohe-card__icon path, .drohe-card__icon line, .drohe-card__icon rect, .drohe-card__icon circle, .drohe-card__icon polyline { fill: none; stroke: var(--twilight-indigo); stroke-width: 1.1; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 400; stroke-dashoffset: 400; }

.drohe-card:nth-child(1) .drohe-card__icon path, .drohe-card:nth-child(1) .drohe-card__icon line, .drohe-card:nth-child(1) .drohe-card__icon rect { animation: drohe-draw 2s 0.6s ease forwards; }

.drohe-card:nth-child(2) .drohe-card__icon path, .drohe-card:nth-child(2) .drohe-card__icon line, .drohe-card:nth-child(2) .drohe-card__icon polyline { animation: drohe-draw 2s 0.9s ease forwards; }

.drohe-card:nth-child(3) .drohe-card__icon path, .drohe-card:nth-child(3) .drohe-card__icon line, .drohe-card:nth-child(3) .drohe-card__icon circle { animation: drohe-draw 2s 1.1s ease forwards; }

/* ── NOM PRODUIT ── */
.drohe-card__name { font-family: 'Aesthet Nova'; font-size: clamp(22px, 2vw, 30px); font-weight: 400; color: var(--twilight-indigo); margin-bottom: 2.5vh; letter-spacing: 0.01em; }

/* Ligne séparatrice sous le nom */
.drohe-card__sep { width: 36px; height: 1px; background: var(--fuchsia-plum); opacity: 0.6; margin-bottom: 2.5vh; transition: width 0.4s ease; }

.drohe-card:hover .drohe-card__sep { width: 60px; }

/* ── DESCRIPTION ── */
.drohe-card__desc { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #666; line-height: 1.85; max-width: 280px; margin-bottom: 4vh; }

/* ── LIEN — même style que le bouton hero ── */
.drohe-card__link { display: inline-flex; align-items: center; gap: 14px; font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 14px 26px; border-radius: 40px; text-decoration: none; margin-top: auto; transition: background 0.3s ease, gap 0.3s ease; }

.drohe-card__link:hover { background: #a83870; gap: 20px; color: white; }

.drohe-card__link svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-card__link svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 200; stroke-dashoffset: 200; animation: drohe-draw 1.4s 1s ease forwards; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-products__grid { grid-template-columns: 1fr; } .drohe-card { border-right: none; border-bottom: 1px solid rgba(63, 61, 117, 0.1); } .drohe-card:last-child { border-bottom: none; } }

@keyframes drohe-up { from { opacity: 0;
    transform: translateY(16px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes drohe-draw { to { stroke-dashoffset: 0; } }

@media (max-width: 768px) { .drohe-card { border-bottom: 1px solid rgba(63, 61, 117, 0); } }

/*====================================================================== MENUISERIE SPECIALISEE =====================================================================*/
.drohe-testimonials { background: #fff; padding: 70px 0 0; position: relative; overflow: hidden; }

/* ── LAYOUT ── */
.drohe-testimonials__inner { display: grid; grid-template-columns: 400px 1fr 400px; align-items: stretch; min-height: 420px; }

/* ── IMAGES LATÉRALES ── */
.drohe-testimonials__img-wrap { display: flex; align-items: stretch; }

.drohe-testimonials__img { width: 100%; height: 100%; object-fit: contain; object-position: center top; display: block; margin-top: 40px; }

/* ── CONTENU CENTRAL ── */
.drohe-testimonials__content { text-align: center; padding: 6vh 5vw; display: flex; flex-direction: column; align-items: center; }

.drohe-testimonials__label { font-family: 'Aesthet Nova'; font-size: clamp(28px, 3vw, 56px); font-weight: 400; color: var(--twilight-indigo); margin-bottom: 2rem; letter-spacing: 0.02em; opacity: 0; animation: drohe-up 1s 0.2s ease forwards; }

.drohe-testimonials__label em { font-style: italic; color: var(--fuchsia-plum); display: block; }

/* ── CARROUSEL ── */
.drohe-testimonials__slider { position: relative; width: 100%; min-height: 160px; }

.drohe-testimonials__quote { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #666; line-height: 1.9; max-width: 840px; margin-bottom: 3.5vh; font-style: italic; position: relative; }

/* Guillemet déco */
.drohe-testimonials__quote::before { content: '\201C'; font-family: 'Aesthet Nova'; font-size: 80px; color: var(--pastel-petal); line-height: 0; position: absolute; top: 18px; left: -30px; opacity: 0.7; }

/* ── DOTS ── */
.drohe-testimonials__dots { display: flex; gap: 10px; margin-top: 4vh; justify-content: center; }

.drohe-testimonials__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lavender); border: none; cursor: pointer; padding: 0; transition: background 0.3s ease, transform 0.3s ease; }

.drohe-testimonials__dot.active { background: var(--fuchsia-plum); transform: scale(1.3); }

/* ── RESPONSIVE ── */
@media (max-width: 900px) { .drohe-testimonials__inner { grid-template-columns: 140px 1fr 140px; } }

@media (max-width: 600px) { .drohe-testimonials__inner { grid-template-columns: 1fr; } .drohe-testimonials__img-wrap { display: none; } .drohe-testimonials__content { padding: 4vh 6vw; } }

@keyframes drohe-up { from { opacity: 0;
    transform: translateY(14px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes drohe-fade-in { from { opacity: 0;
    transform: translateY(8px); }
  to { opacity: 1;
    transform: translateY(0); } }

/*======================================================================== PROCESSUS ===========================================================================*/
.drohe-process-outer { background: var(--white); padding: 4vh 6vw 10vh; }

/* ── INNER — bloc arrondi blanc cassé ── */
.drohe-process { background: #d1d1e2; border-radius: 0px; padding: 50px; position: relative; overflow: hidden; }

/* ── HEADER ── */
.drohe-process__header { text-align: center; margin-bottom: 8vh; position: relative; z-index: 1; }

.drohe-process__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 2vh; opacity: 0; animation: drohe-up 0.8s 0.1s ease forwards; }

.drohe-process__eyebrow::before, .drohe-process__eyebrow::after { content: ''; display: block; width: 20px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-process__title { font-family: 'Aesthet Nova'; font-size: clamp(30px, 3.5vw, 56px); font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; opacity: 0; animation: drohe-up 1s 0.25s ease forwards; }

.drohe-process__title em { font-style: italic; color: var(--fuchsia-plum); }

/* ── FRISE ── */
.drohe-timeline { position: relative; z-index: 1; }

/* ── ÉTAPES ── */
.drohe-timeline__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; position: relative; }

.drohe-step { display: flex; flex-direction: column; align-items: center; opacity: 0; padding: 0 8px; }

/* Délais échelonnés */
.drohe-step:nth-child(1) { animation: drohe-up 0.8s 0.2s ease forwards; }

.drohe-step:nth-child(2) { animation: drohe-up 0.8s 0.35s ease forwards; }

.drohe-step:nth-child(3) { animation: drohe-up 0.8s 0.5s ease forwards; }

.drohe-step:nth-child(4) { animation: drohe-up 0.8s 0.65s ease forwards; }

.drohe-step:nth-child(5) { animation: drohe-up 0.8s 0.8s ease forwards; }

.drohe-step:nth-child(6) { animation: drohe-up 0.8s 0.95s ease forwards; }

/* Étapes paires décalées vers le bas */
.drohe-step:nth-child(even) { padding-top: 50px; }

/* ── POINT + CONNECTEUR ── */
.drohe-step__dot-wrap { display: flex; flex-direction: column; align-items: center; margin-bottom: 20px; }

.drohe-step__num { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: 'Aesthet Nova'; font-size: 40px; color: var(--white); flex-shrink: 0; transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease; cursor: default; margin-top: 15px; }

/* ── TEXTE ── */
.drohe-step__body { text-align: center; }

/* Étapes impaires : texte en haut (avant le dot) */
.drohe-step:nth-child(odd) .drohe-step__body { order: -1; margin-bottom: 0; }

/* Étapes paires : texte en bas (après le dot) */
.drohe-step:nth-child(even) .drohe-step__body { margin-top: 0; }

.drohe-step__label { font-family: 'Lato', sans-serif; font-size: 0.7rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--fuchsia-plum); margin-bottom: 6px; opacity: 0.8; }

h4, .drohe-step__title { font-family: 'Aesthet Nova'; font-size: 1.5rem; font-weight: 400; color: var(--twilight-indigo); line-height: 1.25; margin: 0 0 8px; }

.drohe-step__desc { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #888; line-height: 1.7; margin: 0; }

/* ── SVG BG TRAITS ── */
.drohe-process__bg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }

.drohe-process__bg path { stroke-dasharray: 600; stroke-dashoffset: 600; animation: drohe-draw-bg 3s 0.5s ease forwards; }

/* ── RESPONSIVE ── */
@media (max-width: 900px) { .drohe-process-outer { padding: 4vh 4vw; } .drohe-timeline__steps { grid-template-columns: repeat(3, 1fr); gap: 5vh 0; } .drohe-step:nth-child(even) { padding-top: 0; } .drohe-step:nth-child(4), .drohe-step:nth-child(5), .drohe-step:nth-child(6) { padding-top: 0; } .drohe-timeline__line { display: none; } .drohe-step:nth-child(even) .drohe-step__dot-wrap { flex-direction: column; margin-bottom: 20px; margin-top: 0; } .drohe-step:nth-child(even) .drohe-step__body { order: 1; } .drohe-step:nth-child(odd) .drohe-step__body { order: 1; } .drohe-step__connector { display: none; } }

@media (max-width: 560px) { .drohe-timeline__steps { grid-template-columns: repeat(2, 1fr); } }

@keyframes drohe-up { from { opacity: 0;
    transform: translateY(14px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes drohe-draw-bg { to { stroke-dashoffset: 0; } }

/*==================================================================== EN TETE : PAGES SECONDAIRES ==================================================================*/
.bloc-a7f3-header, .bloc-a7f3-header *, .bloc-a7f3-header *::before, .bloc-a7f3-header *::after { box-sizing: border-box; }

.bloc-a7f3-header { position: relative; width: 100%; height: 55vh; min-height: 380px; overflow: hidden; background-color: #fefefe; }

.bloc-a7f3-header__bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; filter: saturate(0.6) brightness(0.55); z-index: 0; }

.bloc-a7f3-header__overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(58, 61, 117, 0.88) 0%, rgba(197, 75, 131, 0.1) 55%, rgba(58, 61, 117, 0.82) 100%); z-index: 0; }

.bloc-a7f3-header::after { content: ''; position: absolute; bottom: -30px; left: -40px; width: 360px; height: 220px; background: radial-gradient(ellipse 65% 55% at 35% 65%, rgba(10, 120, 62, 0.2) 0%, transparent 70%); filter: blur(50px); z-index: -1; pointer-events: none; }

.bloc-a7f3-header__container { position: relative; z-index: 2; max-width: 1500px; height: 100%; margin: 0 auto; padding: 0 5% 0 3%; display: grid; grid-template-columns: 1.2fr 2fr; align-items: center; gap: 48px; }

.bloc-a7f3-header__logo { display: flex; align-items: center; justify-content: flex-start; padding-left: 0; margin-left: -34px; }

.bloc-a7f3-header__logo img { max-width: 500px; width: 100%; height: auto; }

.bloc-a7f3-header__text-lined { display: flex; align-items: stretch; gap: 36px; }

.bloc-a7f3-header__line { width: 3px; background: linear-gradient(180deg, var(--fuchsia-plum, #c54b83ff), rgba(197, 75, 131, 0.3)); border-radius: 2px; flex-shrink: 0; }

.bloc-a7f3-header__text-content { display: flex; flex-direction: column; justify-content: center; gap: 0; }

.bloc-a7f3-header__text-content h1 { font-family: 'Aesthet Nova'; font-size: clamp(28px, 3vw, 56px); font-weight: 400; color: var(--white); margin-bottom: 2rem; letter-spacing: 0.02em; opacity: 0; animation: drohe-up 1s 0.2s ease forwards; }

.bloc-a7f3-header__text-content p { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: rgba(255, 255, 255, 0.82); margin: 0 0 5vh; line-height: 1.6; opacity: 0; animation: drohe-up 1s 0.6s ease forwards; }

@media (max-width: 900px) { .bloc-a7f3-header__container { grid-template-columns: 1fr; gap: 28px; padding: 70px 32px; justify-items: center; text-align: center; } .bloc-a7f3-header__logo { justify-content: center; margin-top: 16px; } .bloc-a7f3-header__logo img { max-width: 250px; } .bloc-a7f3-header__text-lined { justify-content: center; gap: 20px; } .bloc-a7f3-header__text-content { align-items: center; } .bloc-a7f3-header__text-content p { max-width: 100%; } }

@media (max-width: 600px) { .bloc-a7f3-header { height: auto; min-height: 460px; padding: 60px 0; } .bloc-a7f3-header__container { padding: 32px 24px; gap: 24px; } .bloc-a7f3-header__logo img { max-width: 150px; } .bloc-a7f3-header__text-lined { flex-direction: column; align-items: center; gap: 14px; } .bloc-a7f3-header__line { width: 50px; height: 3px; } .bloc-a7f3-header__text-content h1 { margin-bottom: 12px; } }

@media (max-width: 600px) { .bloc-a7f3-header { min-height: 520px; } .bloc-a7f3-header__logo img { max-width: 200px; margin-top: 30px; } .bloc-a7f3-header__container { padding: 24px 16px; } }

/*======================================================================== SAVOIR FAIRE ==========================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-about { width: 100%; background: #fefefe; box-sizing: border-box; padding: 10vh 6vw; }

.drohe-about__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: start; max-width: 1200px; margin: 0 auto; }

/* ── COLONNE GAUCHE — texte ── */
.drohe-about__left { display: flex; flex-direction: column; gap: 3vh; }

.drohe-about__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 12px; }

.drohe-about__eyebrow::before { content: ''; display: block; width: 24px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-about__title { font-family: 'Aesthet Nova'; font-size: 4vw; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; }

.drohe-about__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-about__intro { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #5a5a5a; line-height: 1.8; }

.drohe-about__divider { width: 40px; height: 1px; background: var(--fuchsia-plum); }

.drohe-about__body { font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 300; color: #7a7a7a; line-height: 1.85; }

.drohe-about__cta { display: inline-flex; align-items: center; gap: 14px; align-self: flex-start; font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 14px 26px; border-radius: 40px; text-decoration: none; transition: background 0.3s ease, gap 0.3s ease; margin-top: 1vh; }

.drohe-about__cta:hover { background: #a83870; gap: 20px; color: white; }

.drohe-about__cta svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-about__cta svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }

/* ── COLONNE DROITE — visuels ── */
.drohe-about__right { display: flex; flex-direction: column; gap: 2vh; padding-top: 1vh; }

/* Carte savoir-faire */
.drohe-about__card { background: #d1d1e2; border-radius: 0px; padding: 3vh 2.5vw; display: flex; gap: 2vw; align-items: flex-start; transition: border-color 0.3s ease, box-shadow 0.3s ease; }

.drohe-about__card:hover { border-color: rgba(197, 75, 131, 0.2); box-shadow: 0 8px 32px rgba(197, 75, 131, 0.06); }

.drohe-about__card-text { display: flex; flex-direction: column; gap: 6px; }

.drohe-about__card-label { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: var(--twilight-indigo); line-height: 1.2; }

.drohe-about__card-desc { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #8a8a8a; line-height: 1.65; }

/* Trait one-line déco */
.drohe-about__oneline { align-self: flex-end; opacity: 0.4; margin-right: 1vw; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-about { padding: 8vh 6vw; } .drohe-about__inner { grid-template-columns: 1fr; gap: 6vh; } .drohe-about__title { font-size: 9vw; } .drohe-about__stats { grid-template-columns: 1fr 1fr; } .drohe-about__stat-number { font-size: 7vw; } .drohe-about__card { padding: 3vh 4vw; gap: 4vw; } }

/*========================================================================= POURQUOI NOUS CHOISIR ? ================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-why { width: 100%; background-color: #fefefe; position: relative; box-sizing: border-box; padding: 10vh 6vw; }

.drohe-why__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: start; max-width: 1200px; margin: 0 auto; }

/* ── GAUCHE — intro ── */
.drohe-why__left { position: sticky; top: 6vh; display: flex; flex-direction: column; gap: 3vh; }

.drohe-why__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 12px; }

.drohe-why__eyebrow::before { content: ''; display: block; width: 24px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-why__title { font-family: 'Aesthet Nova'; font-size: 4vw; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; }

.drohe-why__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-why__intro { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #5a5a5a; line-height: 1.8; }

.drohe-why__cta { display: inline-flex; align-items: center; gap: 14px; align-self: flex-start; font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 14px 26px; border-radius: 40px; text-decoration: none; transition: background 0.3s ease, gap 0.3s ease; margin-top: 2vh; }

.drohe-why__cta:hover { background: #a83870; gap: 20px; color: white; }

.drohe-why__cta svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-why__cta svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }

/* ── DROITE — accordéon ── */
.drohe-why__right { display: flex; flex-direction: column; gap: 0; }

.drohe-why__item { border-top: 1px solid rgba(63, 61, 117, 0.12); overflow: hidden; }

.drohe-why__item:last-child { border-bottom: 1px solid rgba(63, 61, 117, 0.12); }

.drohe-why__trigger { width: 100%; background: none; border: none; padding: 3vh 0; display: flex; align-items: center; gap: 2vw; cursor: pointer; text-align: left; }

.drohe-why__number { font-family: 'Aesthet Nova'; font-size: 2.2vw; font-weight: 400; color: rgba(63, 61, 117, 0.2); line-height: 1; flex-shrink: 0; width: 3vw; transition: color 0.3s ease; }

.drohe-why__item--open .drohe-why__number { color: var(--fuchsia-plum); }

.drohe-why__question { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: var(--twilight-indigo); flex: 1; transition: color 0.3s ease; }

.drohe-why__item--open .drohe-why__question { color: var(--fuchsia-plum); }

.drohe-why__icon { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(63, 61, 117, 0.2); display: flex; align-items: center; justify-content: center; transition: background 0.3s ease, border-color 0.3s ease, transform 0.4s ease; }

.drohe-why__item--open .drohe-why__icon { background: var(--fuchsia-plum); border-color: var(--fuchsia-plum); transform: rotate(45deg); }

.drohe-why__icon svg { width: 12px; height: 12px; }

.drohe-why__icon svg path { stroke: var(--twilight-indigo); transition: stroke 0.3s ease; }

.drohe-why__item--open .drohe-why__icon svg path { stroke: #fff; }

/* Panneau dépliable */
.drohe-why__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s ease; }

.drohe-why__item--open .drohe-why__panel { grid-template-rows: 1fr; }

.drohe-why__panel-inner { overflow: hidden; }

.drohe-why__answer { font-family: 'Lato', sans-serif; font-size: 0.9rem; font-weight: 300; color: #6a6a6a; line-height: 1.85; padding: 0 0 3vh 5vw; border-left: 2px solid var(--fuchsia-plum); margin-left: 5vw; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-why { padding: 8vh 6vw; } .drohe-why__inner { position: relative; z-index: 1; grid-template-columns: 1fr; gap: 5vh; } .drohe-why__left { position: static; } .drohe-why__title { font-size: 9vw; } .drohe-why__number { font-size: 6vw; width: 7vw; } .drohe-why__question { font-size: 4vw; } .drohe-why__answer { padding: 0 0 3vh 4vw; margin-left: 7vw; } }

/*==================================================================== BANNIERE QUI S'ECRIT ========================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-banner { width: 100%; background: #fff; display: flex; align-items: center; justify-content: center; padding: 5vh 6vw; box-sizing: border-box; }

.drohe-banner__box { background: var(--lavender); border-radius: 0px; padding: 4vh 5vw; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 1200px; min-height: 120px; position: relative; overflow: hidden; }

.drohe-banner__text { font-family: 'Indie Flower', cursive; font-size: clamp(18px, 2.2vw, 28px); color: var(--twilight-indigo); text-align: center; line-height: 1.5; position: relative; z-index: 1; }

/* Curseur clignotant */
.drohe-banner__cursor { display: inline-block; width: 2px; height: 1.1em; background: var(--fuchsia-plum); margin-left: 3px; vertical-align: middle; animation: drohe-blink 0.75s step-end infinite; }

@keyframes drohe-blink { 0%, 100% { opacity: 1; }
  50% { opacity: 0; } }

@media (max-width: 768px) { .drohe-banner__box { padding: 4vh 6vw; } }

/*======================================================================= PROCESSUS DE FABRICATION ================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-processs { width: 100%; background: #fefefe; box-sizing: border-box; padding: 10vh 6vw; position: relative; overflow: hidden; }

.drohe-processs__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; max-width: 1200px; margin: 0 auto; position: relative; z-index: 1; }

/* ── GAUCHE — texte ── */
.drohe-processs__left { display: flex; flex-direction: column; gap: 1vh; }

.drohe-processs__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 12px; }

.drohe-processs__eyebrow::before { content: ''; display: block; width: 24px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-processs__title { font-family: 'Aesthet Nova'; font-size: 4vw; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; }

.drohe-processs__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-processs__intro { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #5a5a5a; line-height: 1.85; }

.drohe-processs__divider { width: 40px; height: 1px; background: var(--dry-sage); }

.drohe-processs__body { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #7a7a7a; line-height: 1.85; }

/* Points mis en avant */
.drohe-processs__points { display: flex; flex-direction: column; gap: 0px; }

.drohe-processs__point { display: flex; align-items: flex-start; gap: 0.9rem; font-family: 'Lato', sans-serif; font-size: 0.9rem; font-weight: 300; color: #5a5a5a; line-height: 1.65; }

.drohe-processs__point::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--fuchsia-plum); flex-shrink: 0; margin-top: 7px; }

/* ── DROITE — photo ── */
.drohe-processs__right { position: relative; display: flex; flex-direction: column; gap: 2vh; }

/* Cadre photo principal */
.drohe-processs__photo-wrap { position: relative; border-radius: 0px; overflow: hidden; aspect-ratio: 4 / 5; background: var(--lavender); }

.drohe-processs__photo { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Placeholder si pas de photo */
.drohe-processs__photo-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(140deg, var(--lavender) 0%, rgba(209, 209, 226, 0.4) 100%); font-family: 'Lato', sans-serif; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(63, 61, 117, 0.4); }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-processs { padding: 8vh 6vw; } .drohe-processs__inner { grid-template-columns: 1fr; gap: 5vh; } .drohe-processs__title { font-size: 9vw; } .drohe-processs__right { order: -1; } .drohe-processs__photo-wrap { aspect-ratio: 3 / 2; } .drohe-processs__badge { left: 4vw; bottom: 2vh; } .drohe-processs__badge-value { font-size: 4vw; } .drohe-processs__card-sm { padding: 2vh 4vw; gap: 4vw; } }

/*===================================================================== EXPLICATIONS PROCESS ====================================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-craft { width: 100%; background: #fefefe; box-sizing: border-box; padding: 50px 6vw 150px; }

.drohe-craft__inner { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; gap: 6vh; }

/* ── En-tête ── */
.drohe-craft__header { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2vh; }

.drohe-craft__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 12px; }

.drohe-craft__eyebrow::before, .drohe-craft__eyebrow::after { content: ''; display: block; width: 24px; height: 1px; background: var(--dry-sage); }

.drohe-craft__title { font-family: 'Aesthet Nova'; font-size: 3.8vw; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; }

.drohe-craft__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-craft__intro { font-family: 'Lato', sans-serif; font-size: 15px; font-weight: 300; color: #6a6a6a; line-height: 1.85; max-width: 620px; }

/* ── Encadré lavande ── */
.drohe-craft__frame { background: var(--lavender); border-radius: 0px; padding: 5vh 4vw; display: flex; flex-direction: column; gap: 4vh; }

/* ── Grille de cartes ── */
.drohe-craft__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4vh 2vw; }

.drohe-craft__card { background: #fff; border-radius: 0px; padding: 2rem 1.6rem; display: flex; flex-direction: column; gap: 0.6rem; transition: border-color 0.3s ease, box-shadow 0.3s ease; }

.drohe-craft__card:hover { border-color: rgba(197, 75, 131, 0.2); box-shadow: 0 6px 24px rgba(197, 75, 131, 0.06); }

/* Dernière carte — livraison — pleine largeur */
.drohe-craft__card--full { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 1.5rem; padding: 1.8rem 2rem; background: var(--twilight-indigo); border-color: transparent; }

.drohe-craft__card--full:hover { border-color: transparent; box-shadow: 0 6px 24px rgba(63, 61, 117, 0.2); }

.drohe-craft__card--full .drohe-craft__card-num { color: rgba(255, 255, 255, 0.25); }

.drohe-craft__card--full .drohe-craft__card-label { color: #fff; }

.drohe-craft__card--full .drohe-craft__card-desc { color: rgba(255, 255, 255, 0.55); }

.drohe-craft__card-num { font-family: 'Aesthet Nova'; font-size: 2rem; font-weight: 400; color: rgba(63, 61, 117, 0.18); line-height: 1; }

.drohe-craft__card-label { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: var(--twilight-indigo); line-height: 1.3; }

.drohe-craft__card-desc { font-family: 'Lato', sans-serif; font-size: 0.9rem; font-weight: 300; color: #9a9a9a; line-height: 1.6; margin-top: auto; }

/* Point de couleur entre numéro et label */
.drohe-craft__card-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--fuchsia-plum); flex-shrink: 0; }

.drohe-craft__card--full .drohe-craft__card-dot { background: var(--dry-sage); }

/* ── CTA ── */
.drohe-craft__footer { display: flex; justify-content: center; }

.drohe-craft__cta { display: inline-flex; align-items: center; gap: 14px; font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 14px 28px; border-radius: 40px; text-decoration: none; transition: background 0.3s ease, gap 0.3s ease; }

.drohe-craft__cta:hover { background: #a83870; gap: 20px; color: white; }

.drohe-craft__cta svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-craft__cta svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-craft { padding: 8vh 6vw; } .drohe-craft__title { font-size: 9vw; } .drohe-craft__grid { grid-template-columns: 1fr 1fr; gap: 2vh 3vw; } .drohe-craft__card--full { flex-direction: column; align-items: flex-start; gap: 1vh; } .drohe-craft__card-num { font-size: 6vw; } .drohe-craft__card-label { font-size: 3.5vw; } .drohe-craft__frame { padding: 4vh 5vw; } }

/*======================================================================= PRESENTATION DES PRODUITS ===============================================================*/
:root { --fuchsia-plum: #c54b83; --twilight-indigo: #3f3d75; --pastel-petal: #f2c9d1; --lavender: #d1d1e2; --dry-sage: #b7c8a3; }

.drohe-cso { width: 100%; background: #fefefe; box-sizing: border-box; padding: 10vh 6vw; }

.drohe-cso__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; align-items: center; max-width: 1200px; margin: 0 auto; }

/* ── GAUCHE — texte ── */
.drohe-cso__left { display: flex; flex-direction: column; gap: 2vh; }

.drohe-cso__eyebrow { font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fuchsia-plum); display: flex; align-items: center; gap: 12px; }

.drohe-cso__eyebrow::before { content: ''; display: block; width: 24px; height: 1px; background: var(--dry-sage); flex-shrink: 0; }

.drohe-cso__title { font-family: 'Aesthet Nova'; font-size: 4vw; font-weight: 400; color: var(--twilight-indigo); line-height: 1.05; margin: 0; }

.drohe-cso__title em { font-style: italic; color: var(--fuchsia-plum); }

.drohe-cso__text { font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #5a5a5a; line-height: 1.85; }

.drohe-cso__divider { width: 40px; height: 1px; background: var(--dry-sage); }

.drohe-cso__options-title { font-family: 'Indie Flower', cursive; font-size: 1.5rem; color: var(--twilight-indigo); }

.drohe-cso__options { display: flex; flex-direction: column; gap: 0vh; }

.drohe-cso__option { display: flex; align-items: flex-start; gap: 10px; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #5a5a5a; line-height: 1.6; }

.drohe-cso__option::before { content: ''; display: block; width: 5px; height: 5px; border-radius: 50%; background: var(--fuchsia-plum); flex-shrink: 0; margin-top: 8px; }

/* Note en bas */
.drohe-cso__note { background: rgba(209, 209, 226, 0.25); border: 1px solid rgba(209, 209, 226, 0.6); border-left: 3px solid var(--lavender); border-radius: 0; padding: 1.4rem 1.4rem; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 300; color: #7a7a7a; line-height: 1.75; }

.drohe-cso__cta { display: inline-flex; align-items: center; gap: 14px; align-self: flex-start; font-family: 'Lato', sans-serif; font-size: 10px; font-weight: 400; letter-spacing: 0.22em; text-transform: uppercase; color: #fff; background: var(--fuchsia-plum); padding: 14px 26px; border-radius: 40px; text-decoration: none; transition: background 0.3s ease, gap 0.3s ease; }

.drohe-cso__cta:hover { background: #a83870; gap: 20px; color: white; }

.drohe-cso__cta svg { width: 28px; height: 18px; flex-shrink: 0; }

.drohe-cso__cta svg path { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }

/* ── DROITE — carrousel ── */
.drohe-cso__right { display: flex; flex-direction: column; gap: 1.6vh; }

.drohe-cso__carousel { position: relative; border-radius: 0px; overflow: hidden; aspect-ratio: 4 / 5; background: var(--lavender); user-select: none; }

.drohe-cso__slides { display: flex; height: 100%; transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); }

.drohe-cso__slide { min-width: 100%; height: 100%; flex-shrink: 0; position: relative; }

.drohe-cso__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Placeholder slide */
.drohe-cso__slide-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; background: linear-gradient(140deg, var(--lavender) 0%, rgba(209, 209, 226, 0.5) 100%); font-family: 'Lato', sans-serif; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(63, 61, 117, 0.4); }

.drohe-cso__slide-placeholder span { font-family: 'Aesthet Nova', 'Cormorant Garamond', Georgia, serif; font-size: 1.4rem; color: rgba(63, 61, 117, 0.2); letter-spacing: 0.06em; }

/* Boutons flèches */
.drohe-cso__arrows { display: flex; gap: 1rem; justify-content: flex-end; align-items: center; }

.drohe-cso__arrow { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(63, 61, 117, 0.2); background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.3s ease, border-color 0.3s ease, transform 0.2s ease; flex-shrink: 0; }

.drohe-cso__arrow:hover { background: var(--fuchsia-plum); border-color: var(--fuchsia-plum); }

.drohe-cso__arrow:hover svg path { stroke: #fff; }

.drohe-cso__arrow:active { transform: scale(0.94); }

.drohe-cso__arrow svg { width: 16px; height: 16px; }

.drohe-cso__arrow svg path { fill: none; stroke: var(--twilight-indigo); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: stroke 0.3s ease; }

/* Compteur */
.drohe-cso__counter { font-family: 'Aesthet Nova', 'Cormorant Garamond', Georgia, serif; font-size: 1.1rem; color: rgba(63, 61, 117, 0.35); margin-right: auto; line-height: 1; }

.drohe-cso__counter strong { color: var(--twilight-indigo); font-weight: 400; }

/* Dots */
.drohe-cso__dots { display: flex; gap: 6px; justify-content: center; }

.drohe-cso__dot { width: 5px; height: 5px; border-radius: 50%; background: rgba(63, 61, 117, 0.2); transition: background 0.3s ease, transform 0.3s ease; cursor: pointer; }

.drohe-cso__dot--active { background: var(--fuchsia-plum); transform: scale(1.3); }

/* Note + CTA pleine largeur */
.drohe-cso__full { max-width: 1200px; margin: 4vh auto 0; display: flex; flex-direction: column; gap: 3vh; }

.drohe-cso__footer { display: flex; justify-content: center; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) { .drohe-cso { padding: 8vh 6vw; } .drohe-cso__inner { grid-template-columns: 1fr; gap: 5vh; } .drohe-cso__title { font-size: 8vw; } .drohe-cso__right { order: -1; } .drohe-cso__carousel { aspect-ratio: 3 / 2; } }

/*# sourceMappingURL=custom.css.map */