@charset "UTF-8";
@import url(main.css);
.video-background-holder { display: none; }

@media (max-width: 990px) { .navbar-nav .dropdown-menu { transform: none !important; } }

footer > div.row.justify-content-center.justify-content-lg-around.text-center.text-lg-start > div:nth-child(3) > div:nth-child(3) { display: none !important; }

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

a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone { border-radius: 0px !important; color: white !important; font-family: 'Inter'; }

.faq-answer.faq-description.p-3 { font-size: 1.05rem; color: #424f61; line-height: 1.8; margin-bottom: 1.5rem; padding-left: 2rem !important; }

.faq-item.faq-card.mb-3.border.rounded-2.active { border-radius: 0px !important; }

.faq-item.active > .faq-question { background-color: #edf2f7 !important; /* ta couleur */ }

.fs-6.lead.mt-4.mb-4 { color: #424f61; line-height: 1.6; }

.display-6.titles.fw-bold.text-body-emphasis.lh-1.mb-5 h3 { font-weight: 600 !important; line-height: 1.1; color: #06214d; margin-bottom: -1rem !important; letter-spacing: 1.5px; font-size: 2rem !important; }

.first-activity-title, .second-activity-title, .third-activity-title { position: relative; display: inline-block; padding-bottom: 10px; /* espace pour le trait */ }

.first-activity-title::after, .second-activity-title::after, .third-activity-title::after { content: ''; position: absolute; left: 0; bottom: -20px; width: 100%; height: 3px; border-radius: 10px; background: linear-gradient(90deg, var(--primary-blue) 0%, var(--accent-orange) 100%); }

.lh-1.mb-3.titles { letter-spacing: 1px; }

.b-bloc-divider { height: 40px !important; background-color: transparent !important; border: none !important; box-shadow: none !important; }

/*---------Bloc SEO----------------------*/
.first-activity-div.shadow-lg { box-shadow: none !important; }

.second-activity-div.shadow-lg { box-shadow: none !important; }

.third-activity-div.shadow-lg { box-shadow: none !important; }

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

/*------------------------------------------------------------BREADCRUMB--------------------------------------*/
.breadcrumb-section { width: 100%; background: #edf2f7; padding: 18px 5%; }

.breadcrumb-container { max-width: 1400px; margin: auto; font-size: 0.95rem; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #7c715e; }

.breadcrumb-container a { text-decoration: none; color: #06214dd1 !important; transition: 0.3s ease; font-family: 'Inter'; }

.breadcrumb-container a:hover { color: #61215e; text-decoration: underline; }

.breadcrumb-container .current { color: #7c715e; font-weight: 600; text-decoration: none !important; }

/* Responsive */
@media (max-width: 768px) { .breadcrumb-container { font-size: 0.85rem; } }

/* =========================== GALERIE photos et couleurs =========================== */
.mosaic-services { width: 100%; overflow: hidden; }

.mosaic-grid { display: grid; grid-template-columns: repeat(8, 1fr); grid-auto-rows: 180px; }

/* Items */
.mosaic-item { position: relative; overflow: hidden; }

/* Images */
.mosaic-item.image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Couleurs */
.mosaic-item.color.blue { background: #2968b3; }

.mosaic-item.color.violet { background: #6e69a3; }

.mosaic-item.color.red { background: #cb404f; }

.mosaic-item.color.orange { background: #f06c2b; }

@media (max-width: 600px) { /* On cache une partie de la mosaïque */ .mosaic-mobile-hide { display: none; } /* Grille mobile simplifiée */ .mosaic-grid { grid-template-columns: repeat(2, 1fr); } /* Carrés bien réguliers */ .mosaic-item { aspect-ratio: 1 / 1; } }

/* =========================== Appel à l'action =========================== */
.cta-renovation-sdb { background: #edf2f7; padding: 4rem 2rem; }

.cta-renovation-sdb-container { max-width: 900px; margin: 0 auto; text-align: center; }

.cta-renovation-sdb-titre { font-size: 2rem; font-weight: 600 !important; color: #06214d; line-height: 1.5; margin-bottom: 1.5rem; letter-spacing: 2px; text-transform: uppercase; }

.cta-renovation-sdb-texte { font-size: 1.05rem; color: #424f61; line-height: 1.8; margin-bottom: 2rem; }

.cta-renovation-sdb-btn { display: inline-block; background: #2563eb; color: #ffffff; padding: 1rem 2.2rem; text-decoration: none; font-family: 'Inter'; font-size: 1rem; transition: all 0.3s ease; }

.cta-renovation-sdb-btn:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(37, 99, 235, 0.4); }

@media (max-width: 768px) { .cta-renovation-sdb { padding: 3rem 1.5rem; } .cta-renovation-sdb-texte { font-size: 1.05rem; } .cta-renovation-sdb-titre { font-size: 1.5rem; } }

/* =========================== FORMULAIRE CONTACT =========================== */
section.tally-form-block { background-color: #edf2f7; padding-top: 4rem !important; }

section.tally-form-block h3 { font-size: 2rem; text-transform: uppercase; letter-spacing: 2px; font-weight: 600 !important; }

/* =========================== SECTION ATOUTS RENOVATION =========================== */
.atouts-renovation-section { padding: 5rem 0; }

.atouts-renovation-container { max-width: 1400px; margin: 0 auto; padding: 0 2rem; }

/* Grille 4 colonnes */
.atouts-renovation-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem; }

/* Item avec icône */
.atout-renovation-item { text-align: center; animation: fadeInUp 0.8s ease-out backwards; }

@keyframes fadeInUp { from { opacity: 0;
    transform: translateY(30px); }
  to { opacity: 1;
    transform: translateY(0); } }

/* Icône */
.atout-renovation-icon-wrapper { display: flex; justify-content: center; align-items: center; margin-bottom: 1.2rem; }

.atout-renovation-icon { width: 100px; height: 100px; object-fit: contain; }

/* Titre */
.atout-renovation-titre { font-size: 1.4rem; font-weight: 600 !important; color: #06214d; line-height: 1.3; letter-spacing: 0.5px; margin: 0; }

/* =========================== RESPONSIVE – ATOUTS RÉNOVATION =========================== */
@media (max-width: 1024px) { .atouts-renovation-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; } }

@media (max-width: 768px) { .atouts-renovation-section { padding: 4rem 0; } .atouts-renovation-grid { gap: 2rem; justify-items: center; /* ✅ centre les cartes */ text-align: center; } .atout-renovation-item { display: flex; flex-direction: column; align-items: center; /* ✅ centre icône + titre */ } .atout-renovation-titre { font-size: 1.5rem; } }

@media (max-width: 480px) { .atouts-renovation-section { padding: 3rem 0; } .atouts-renovation-container { padding: 0 1.5rem; } .atouts-renovation-grid { grid-template-columns: 1fr; gap: 4rem; } .atout-renovation-titre { font-size: 1.4rem; } }

/* =========================== SECTION TYPES RENOVATION =========================== */
.types-renovation-section { background: var(--white); padding: 4rem 0; }

.types-renovation-container { max-width: 1400px; margin: 0 auto; padding: 0 2rem; }

/* Grille 2 cartes */
.types-renovation-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3rem; }

/* Carte de type de rénovation */
.type-renovation-card { background: var(--white); border: 2px solid #dde6f9; padding: 2.5rem; transition: all 0.3s ease; animation: fadeInUp 0.8s ease-out backwards; }

.type-renovation-card:nth-child(1) { animation-delay: 0.1s; }

.type-renovation-card:nth-child(2) { animation-delay: 0.2s; }

@keyframes fadeInUp { from { opacity: 0;
    transform: translateY(30px); }
  to { opacity: 1;
    transform: translateY(0); } }

/* En-tête */
.type-renovation-header { margin-bottom: 1rem; }

.type-renovation-titre { font-size: 1.8rem; font-weight: 600 !important; color: #06214d; letter-spacing: 0.5px; margin: 0; }

/* Liste à puces */
.type-renovation-liste { list-style: none; margin: 0; padding: 0; padding-left: 2rem; }

.type-renovation-liste li { padding: 0.75rem 0; padding-left: 1.5rem; position: relative; font-family: 'Inter'; line-height: 1.2rem; font-size: 1.05rem; color: #424f61; }

.type-renovation-liste li::before { content: '•'; position: absolute; left: 0; font-size: 1.5rem; font-weight: 700; line-height: 1; top: 0.7rem; }

/* Couleurs des bullets */
.type-renovation-card:nth-child(1) .type-renovation-liste li::before { color: var(--primary-blue); }

.type-renovation-card:nth-child(2) .type-renovation-liste li::before { color: var(--accent-orange); }

/* Responsive */
@media (max-width: 1024px) { .types-renovation-grid { gap: 2rem; } }

@media (max-width: 768px) { .types-renovation-grid { grid-template-columns: 1fr; gap: 2rem; } .type-renovation-card { padding: 2rem; } .type-renovation-titre { font-size: 1.8rem; } }

/* ============================ Bloc sdb ============================ */
.sdb-renovation-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; margin-top: 3rem; }

.sdb-card { background: #ffffff; padding: 2rem; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); }

.sdb-card h3 { font-size: 1.3rem; color: #06214d; margin-bottom: 1.2rem; letter-spacing: 1px; text-transform: uppercase; }

.sdb-card ul { list-style: disc; padding-left: 1.2rem; }

.sdb-card li { font-size: 1rem; color: #424f61; line-height: 1.7; margin-bottom: 0.5rem; }

/* Carte mise en avant */
.sdb-card-highlight { border-left: 4px solid var(--accent-orange); }

@media (max-width: 768px) { .sdb-renovation-cards { grid-template-columns: 1fr; gap: 1.5rem; } .sdb-card { padding: 1.5rem; } }

/* ============================ HEADER PAGES SECONDAIRES ============================ */
.service-header { position: relative; min-height: 400px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 100px 20px 100px; overflow: hidden; }

.service-header-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }

.service-header-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; background: linear-gradient(135deg, rgba(26, 35, 50, 0.95) 0%, rgba(15, 23, 42, 0.92) 50%, rgba(26, 35, 50, 0.95) 100%); }

.service-header-content { position: relative; z-index: 3; text-align: center; max-width: 1250px; padding: 0 20px; }

.service-title-main { font-size: 3rem; font-weight: 600 !important; color: var(--white); line-height: 1.1; margin-bottom: 1.5rem; letter-spacing: 2px; }

.service-subtitle-main { font-size: 1.2rem; color: #ffffffde; line-height: 1.7; margin-bottom: 2.8rem; font-weight: 400; }

.service-cta { margin-top: 35px; animation: fadeInUp 0.8s ease-out 0.4s both; }

@media (max-width: 768px) { .service-header { min-height: 350px; padding: 80px 15px 50px; } .service-cta { margin-top: 25px; } .service-title-main { font-size: 2.2rem; letter-spacing: 2px; line-height: 1.25; margin-bottom: 15px; } .service-subtitle-main { font-size: 1.2rem; letter-spacing: 0.5px; line-height: 1.4; } }

/* =========================== SECTION VALEURS POSITIONNEMENT =========================== */
.valeurs-positionnement-section { background: white; padding: 6rem 8%; position: relative; overflow: hidden; }

/* Accent décoratif en arrière-plan */
.valeurs-positionnement-section::before { content: ''; position: absolute; top: -10%; left: -5%; width: 600px; height: 600px; background: radial-gradient(circle, rgba(37, 99, 235, 0.05) 0%, transparent 70%); border-radius: 50%; z-index: 0; }

.valeurs-positionnement-container { max-width: 1400px; margin: 0 auto; position: relative; z-index: 10; }

/* En-tête de section */
.valeurs-positionnement-header { text-align: center; margin-bottom: 4rem; animation: fadeInUp 0.8s ease-out; }

@keyframes fadeInUp { from { opacity: 0;
    transform: translateY(30px); }
  to { opacity: 1;
    transform: translateY(0); } }

.valeurs-positionnement-titre { font-size: 2.4rem; font-weight: 600 !important; line-height: 1.1; color: #06214d; margin-bottom: 1rem; letter-spacing: 2px; text-transform: uppercase; }

.valeurs-positionnement-description { font-size: 1.05rem; color: #424f61; line-height: 1.8; margin-bottom: 1.5rem; max-width: 800px; margin: 0 auto; }

/* Grille des 3 valeurs */
.valeurs-positionnement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4rem; margin-top: 5rem; }

/* Bloc de valeur sans carte */
.valeur-positionnement-item { position: relative; animation: fadeInUp 0.8s ease-out backwards; padding-left: 1.5rem; }

.valeur-positionnement-item:nth-child(1) { animation-delay: 0.1s; }

.valeur-positionnement-item:nth-child(2) { animation-delay: 0.2s; }

.valeur-positionnement-item:nth-child(3) { animation-delay: 0.3s; }

/* Trait vertical coloré à gauche */
.valeur-positionnement-item::before { content: ''; position: absolute; left: 0; top: 0; width: 1.5px; height: 100%; border-radius: 10px; }

.valeur-positionnement-item::before { background: linear-gradient(180deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); }

/* Icône et titre */
.valeur-positionnement-item-header { margin-bottom: 1.5rem; }

.valeur-positionnement-icon { width: 90px; height: 90px; object-fit: contain; margin-bottom: 20px; margin-left: -5px; }

.valeur-positionnement-item-titre { font-size: 1.8rem; font-weight: 600 !important; color: var(--primary-dark); line-height: 1.2; letter-spacing: 0.5px; margin: 0; }

/* ===== Liste à puces ===== */
.valeur-positionnement-list { list-style: disc; padding-left: 1.2rem; }

.valeur-positionnement-list li { font-size: 1.05rem; color: #424f61; margin-bottom: 0.6rem; font-family: 'Inter'; }

/* Responsive */
@media (max-width: 1200px) { .valeurs-positionnement-titre { font-size: 3rem; } .valeurs-positionnement-grid { gap: 3rem; } }

@media (max-width: 1024px) { .valeurs-positionnement-grid { grid-template-columns: 1fr; gap: 3rem; } .valeur-positionnement-item { max-width: 700px; margin: 0 auto; } }

@media (max-width: 768px) { .valeurs-positionnement-section { padding: 4rem 5%; } .valeurs-positionnement-titre { font-size: 2.5rem; } .valeurs-positionnement-description { font-size: 1rem; } .valeur-positionnement-item { padding-left: 1.25rem; } }

@media (max-width: 480px) { .valeurs-positionnement-section { padding: 3rem 1.5rem; } .valeurs-positionnement-titre { font-size: 2rem; } .valeur-positionnement-item-titre { font-size: 1.7rem; } .valeur-positionnement-item { padding-left: 1rem; } }

/* =========================== SECTION PRESENTATION =========================== */
.apropos-section { position: relative; background: var(--white); padding: 7rem 0; overflow: hidden; }

.apropos-section1 { position: relative; background: var(--white); padding: 5rem 0; overflow: hidden; }

.apropos-container { position: relative; z-index: 10; max-width: 1400px; margin: 0 auto; padding: 0 2rem; }

/* Layout Grid */
.apropos-grid { display: grid; grid-template-columns: 1.5fr 1fr; align-items: center; gap: 80px; }

.apropos-grid1-1 { display: grid; grid-template-columns: 1fr 1.5fr; align-items: center; gap: 80px; }

.apropos-grid1 { display: grid; grid-template-columns: 2fr 1fr; align-items: center; gap: 80px; }

/* Contenu texte */
.apropos-content { position: relative; padding-left: 2rem; animation: fadeInLeft 0.8s ease-out; }

@keyframes fadeInLeft { from { opacity: 0;
    transform: translateX(-30px); }
  to { opacity: 1;
    transform: translateX(0); } }

/* Trait dégradé vertical à gauche du texte */
.apropos-content::before { content: ''; position: absolute; left: 0; top: 0; width: 4px; height: 100%; background: linear-gradient(180deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); box-shadow: 0 0 20px rgba(37, 99, 235, 0.3); }

.apropos-titre { font-size: 2.4rem; font-weight: 600 !important; color: #06214d; line-height: 1.5; margin-bottom: 1.5rem; letter-spacing: 2px; text-transform: uppercase; }

.apropos-titre1 { font-size: 2rem; font-weight: 600 !important; color: #06214d; line-height: 1.5; margin-bottom: 1.5rem; letter-spacing: 2px; text-transform: uppercase; }

.highlight { background: linear-gradient(90deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-weight: 600; }

.apropos-texte { font-size: 1.05rem; color: #424f61; line-height: 1.8; margin-bottom: 1.5rem; }

.apropos-texte strong { color: var(--primary-dark); font-weight: 600; }

/* Image container */
.apropos-image-container { position: relative; animation: fadeInRight 0.8s ease-out 0.2s backwards; }

@keyframes fadeInRight { from { opacity: 0;
    transform: translateX(30px); }
  to { opacity: 1;
    transform: translateX(0); } }

.apropos-image-wrapper { position: relative; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15); max-width: 550px; margin-left: auto; }

.apropos-image-wrapper img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 1/1; }

.apropos-image-wrapper-1 { position: relative; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15); max-width: 550px; margin-left: auto; }

.apropos-image-wrapper-1 img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 1/1.2; }

/* Accent décoratif derrière l'image */
.apropos-image-container::before { content: ''; position: absolute; top: -20px; right: -20px; width: 100%; height: 100%; background: linear-gradient(135deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); opacity: 0.15; z-index: -1; max-width: 550px; margin-left: auto; }

/* Responsive */
@media (max-width: 1024px) { .apropos-grid { gap: 3rem; } .apropos-titre { font-size: 2.5rem; } }

@media (max-width: 768px) { .apropos-section { padding: 4rem 0; } .apropos-grid { grid-template-columns: 1fr; gap: 3rem; } .apropos-grid1 { grid-template-columns: 1fr; gap: 3rem; } /* Image en premier */ .apropos-grid1 .apropos-image-container { order: 1; } /* Texte en second */ .apropos-grid1 .apropos-content { order: 2; } .apropos-content { padding-left: 1.5rem; } .apropos-titre { font-size: 1.5rem; } .apropos-texte { font-size: 1rem; } .apropos-content::before { width: 3px; } }

.apropos-btn { background: #f97316; backdrop-filter: blur(10px); color: white !important; padding: 1rem 2rem; text-decoration: none; font-family: 'Inter'; font-size: 1rem; transition: all 0.3s ease; display: inline-block; /* ✅ indispensable */ margin-top: 1rem; /* fonctionne maintenant */ }

.apropos-btn:hover { box-shadow: 0 12px 30px #f9731685; transform: translateY(-3px); color: white !important; }

.apropos-btn2 { background: #2563eb; backdrop-filter: blur(10px); color: white !important; padding: 1rem 2rem; text-decoration: none; font-family: 'Inter'; font-size: 1rem; transition: all 0.3s ease; display: inline-block; /* ✅ indispensable */ margin-top: 1rem; /* fonctionne maintenant */ }

.apropos-btn2:hover { box-shadow: 0 12px 30px rgba(37, 99, 235, 0.4); transform: translateY(-3px); color: white !important; }

/* Layout Grid inversé */
.apropos-grid2 { display: grid; grid-template-columns: 1fr 2fr; align-items: center; gap: 80px; }

/* Image container à gauche */
.apropos-image-container2 { position: relative; animation: fadeInLeft 0.8s ease-out; }

.apropos-image-wrapper2 { position: relative; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15); max-width: 550px; margin-right: auto; }

.apropos-image-wrapper2 img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 1/1; }

.apropos-image-wrapper2-2 { position: relative; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15); max-width: 550px; margin-right: auto; }

.apropos-image-wrapper2-2 img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 1/1.2; }

/* Accent décoratif derrière l'image - à gauche */
.apropos-image-container2::before { content: ''; position: absolute; top: -20px; left: -20px; width: 100%; height: 100%; background: linear-gradient(135deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); opacity: 0.15; z-index: -1; max-width: 550px; margin-right: auto; }

/* Contenu texte à droite */
.apropos-content2 { position: relative; padding-right: 2rem; animation: fadeInRight 0.8s ease-out 0.2s backwards; }

/* Trait dégradé vertical à droite du texte */
.apropos-content2::after { content: ''; position: absolute; right: 0; top: 0; width: 4px; height: 100%; background: linear-gradient(180deg, var(--primary-blue), #6e69a3, #cb404f, #ec6b1c, var(--accent-orange)); box-shadow: 0 0 20px rgba(37, 99, 235, 0.3); }

/* Responsive */
@media (max-width: 768px) { .apropos-grid2 { grid-template-columns: 1fr; gap: 3rem; } .apropos-content2 { padding-right: 1.5rem; } }

@media (max-width: 480px) { .apropos-content2 { padding-right: 1rem; } }

@media (max-width: 768px) { /* 1️⃣ Texte au-dessus, image en dessous */ .apropos-grid1-1 { display: flex; flex-direction: column-reverse; gap: 3rem; } .apropos-titre1 { font-size: 1.5rem; } /* 2️⃣ Ligne dégradée À DROITE */ .apropos-content2 { padding-left: 0; padding-right: 1.5rem; } .apropos-content2::after { left: auto; right: 0; width: 3px; } /* On neutralise tout trait gauche éventuel */ .apropos-content2::before { display: none; } /* Image bien centrée */ .apropos-image-wrapper2 { margin: 0 auto; } }

/* =========================== SECTION PORTFOLIO SERVICES =========================== */
.portfolio-section { padding: 6rem 8%; background: #edf2f7; color: var(--primary-dark); position: relative; overflow: hidden; }

.portfolio-header { text-align: center; margin-bottom: 3rem; position: relative; z-index: 10; animation: fadeInUp 0.8s ease-out; max-width: 1300px; margin: 0 auto 3rem auto; }

@keyframes fadeInUp { from { opacity: 0;
    transform: translateY(30px); }
  to { opacity: 1;
    transform: translateY(0); } }

.portfolio-header h2 { font-size: 2.4rem; font-weight: 600 !important; color: #06214d; line-height: 1.4; /* margin-bottom: 1.5rem; */ letter-spacing: 2px; text-transform: uppercase; }

.portfolio-header p { font-size: 1.05rem; color: #424f61; line-height: 1.8; margin-bottom: 1.5rem; }

/* === Grille principale === */
.portfolio-grid { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; overflow: visible; padding-top: 2rem; position: relative; z-index: 10; }

/* === Cartes === */
.portfolio-card { position: relative; flex: 1; min-width: 200px; aspect-ratio: 2 / 3; background-size: cover; background-position: center; overflow: hidden; text-decoration: none; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); animation: fadeInUp 0.8s ease-out backwards; }

.portfolio-card:nth-child(1) { animation-delay: 0.1s; }

.portfolio-card:nth-child(2) { animation-delay: 0.2s; }

.portfolio-card:nth-child(3) { animation-delay: 0.3s; }

.portfolio-card:nth-child(4) { animation-delay: 0.4s; }

.portfolio-card:nth-child(5) { animation-delay: 0.5s; }

.portfolio-card:nth-child(even) { margin-top: 0; }

/* === Filtre avec dégradé Alliance Services === */
.portfolio-card .overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(26, 35, 50, 0.85) 0%, rgba(15, 23, 42, 0.8) 100%); transition: all 0.4s ease; z-index: 1; }

/* === Bordure dégradée au hover === */
.portfolio-card::before { content: ''; position: absolute; inset: 0; border-radius: 16px; padding: 3px; opacity: 0; transition: opacity 0.4s ease; z-index: 3; }

/* === Zoom et effets au hover === */
.portfolio-card:hover { transform: scale(1.05) translateY(-10px); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); }

.portfolio-card:hover::before { opacity: 1; }

.portfolio-card:hover .overlay { background: #f9731694; }

/* === Titre de la carte === */
.portfolio-card h3 { position: absolute; inset: 0; /* prend toute la carte */ display: flex; align-items: center; /* centre verticalement */ justify-content: center; /* centre horizontalement */ margin: 0; padding: 0 2rem; /* marge interne légère */ text-align: center; color: var(--white); font-size: 1.8rem; line-height: 2.2rem; letter-spacing: 1px; z-index: 2; pointer-events: none; /* évite les clics parasites */ text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); }

/* === Icône décorative === */
.portfolio-card::after { content: '→'; position: absolute; bottom: 20px; right: 20px; color: var(--white); font-size: 1.5rem; font-weight: 700; z-index: 2; opacity: 0; transform: translateX(-10px); transition: all 0.4s ease; }

.portfolio-card:hover::after { opacity: 1; transform: translateX(0); }

/* === Responsive === */
@media (max-width: 1200px) { .portfolio-header h2 { font-size: 3rem; } .portfolio-grid { flex-wrap: wrap; justify-content: center; gap: 1.5rem; } .portfolio-card { flex: 0 1 calc(33.33% - 1.5rem); margin-top: 0 !important; } }

@media (max-width: 768px) { .portfolio-section { padding: 4rem 5%; } .portfolio-header h2 { font-size: 2.5rem; } .portfolio-header p { font-size: 1rem; } .portfolio-card { flex: 0 1 calc(50% - 1rem); aspect-ratio: 3 / 3; } .portfolio-card h3 { font-size: 1.6rem; } }

@media (max-width: 480px) { .portfolio-section { padding: 3rem 1.5rem; } .portfolio-header h2 { font-size: 2rem; } .portfolio-card { flex: 0 1 100%; } }

/* =========================== BLOC ACCUEIL =========================== */
:root { --primary-dark: #1a2332; --primary-blue: #2563eb; --accent-orange: #f97316; --light-gray: #f8fafc; --medium-gray: #64748b; --white: #ffffff; }

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

body { font-family: 'Sora', sans-serif; background: var(--light-gray); overflow-x: hidden; }

/* Hero Header avec image de fond */
.hero-accueil-wrapper { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; background: var(--primary-dark); }

/* Image de fond */
.hero-accueil-wrapper::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url("https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FaeXfP6FfcoQxdAeAa3y18j2i0Rf2%2Fimages%2FImages_Alliance_Services_3_47bp.webp"); background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 0; }

/* Overlay sombre avec dégradé */
.hero-accueil-wrapper::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(135deg, rgba(26, 35, 50, 0.95) 0%, rgba(15, 23, 42, 0.92) 50%, rgba(26, 35, 50, 0.95) 100%); z-index: 1; }

.hero-accueil-container { position: relative; z-index: 10; max-width: 1400px; margin: 0 auto; padding: 0 2rem; width: 100%; }

/* Hero section centré pleine hauteur */
.hero-accueil { min-height: 100vh; display: flex; justify-content: center; align-items: center; padding: 2rem 0; }

.hero-accueil-content { max-width: 1200px; text-align: center; animation: fadeInUp 1s ease-out 0.2s backwards; }

@keyframes fadeInUp { from { opacity: 0;
    transform: translateY(30px); }
  to { opacity: 1;
    transform: translateY(0); } }

.hero-accueil-logo { max-width: 200px; margin-bottom: 2.5rem; }

.hero-accueil-badge { display: inline-block; background: rgba(37, 99, 235, 0.15); border: 1px solid rgba(37, 99, 235, 0.3); color: var(--primary-blue); padding: 0.5rem 1rem; border-radius: 50px; font-size: 1rem; margin-bottom: 1.5rem; font-family: 'Inter'; }

.hero-accueil-titre { font-size: 3.2rem; font-weight: 400 !important; color: var(--white); margin-bottom: 3.5rem; letter-spacing: 2px; }

.hero-accueil-texte { font-size: 1.2rem; color: #ffffffde; line-height: 1.7; margin-bottom: 2.8rem; font-weight: 400; }

.hero-accueil-buttons { display: flex; gap: 1rem; justify-content: center; }

.hero-accueil-btn-primary { background: linear-gradient(135deg, var(--primary-blue) 0%, #1d4ed8 100%); color: white !important; padding: 1rem 2rem; text-decoration: none; font-size: 1rem; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 0.5rem; font-family: 'Inter'; }

.hero-accueil-btn-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(37, 99, 235, 0.4); }

.hero-accueil-btn-secondary { background: #f97316; backdrop-filter: blur(10px); color: white !important; padding: 1rem 2rem; text-decoration: none; font-family: 'Inter'; font-size: 1rem; transition: all 0.3s ease; }

.hero-accueil-btn-secondary:hover { box-shadow: 0 12px 30px #f9731685; transform: translateY(-3px); color: white !important; }

/* Responsive */
@media (max-width: 1024px) { .hero-accueil-titre { font-size: 2.8rem; } }

@media (max-width: 768px) { .hero-accueil-titre { font-size: 2.2rem; } .hero-accueil-texte { font-size: 1rem; } .hero-accueil-buttons { flex-direction: column; align-items: center; } .hero-accueil-btn-primary, .hero-accueil-btn-secondary { justify-content: center; } }

@media (max-width: 480px) { .hero-accueil-titre { font-size: 1.8rem; } .hero-accueil-container { padding: 0 1.5rem; } }

@media (max-width: 768px) { .hero-accueil-btn-primary, .hero-accueil-btn-secondary { width: 260px; /* 👈 même largeur */ justify-content: center; } }

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