/**
 * STYLES SPÉCIFIQUES - PAGE D'ACCUEIL (index.php)
 * Jagg.Site - Création de sites internet à Louhans
 */

/* ===================================
   HERO - Accroche principale
   =================================== */
.hero p.hero-description {
    text-align: justify;
    hyphens: none;
}

.hero p.hero-description .highlight-orange {
    color: #e9840a;
    font-weight: 600;
}

.hero p.hero-description .highlight-green {
    color: #326108;
    font-weight: 600;
}

.hero p.hero-suivi {
    margin-top: 20px;
    font-size: 1.6rem;
    font-weight: normal;
    text-align: center;
}

/* ===================================
   SECTION PRÉSENTATION
   =================================== */
#presentation .section-title h2 {
    color: #0d5a73;
}

.presentation-row {
    align-items: center;
    gap: 40px;
    margin-bottom: 60px;
}

.presentation-row.last {
    margin-bottom: 0;
}

.presentation-row .presentation-image img {
    width: 80%;
    height: auto;
    border-radius: 8px;
    margin: 0 auto;
    display: block;
}

.presentation-row .presentation-text h3 {
    color: #0d5a73;
    margin-bottom: 20px;
}

.presentation-row .presentation-text p {
    text-align: justify;
    hyphens: none;
    color: #1d1d1d;
}

/* ===================================
   SECTION SERVICES
   =================================== */
#services .section-title h2 {
    color: #0d5a73;
}

#services .section-title p {
    color: #1d1d1d;
}

/* Cartes services - fond gris */
#services .card.service-dark {
    background: rgba(110, 110, 110, 0.7);
}

#services .card.service-dark h3 {
    color: #0d5a73;
}

#services .card.service-dark p {
    color: #ffffff;
    text-align: justify;
    hyphens: none;
}

/* Cartes services - fond blanc */
#services .card.service-light {
    background: rgba(255, 255, 255, 0.8);
}

#services .card.service-light h3 {
    color: #0d5a73;
}

#services .card.service-light p {
    color: #1d1d1d;
    text-align: justify;
    hyphens: none;
}

/* ===================================
   SECTION AVIS CLIENTS
   =================================== */
#avis .section-title h2 {
    color: #0d5a73;
}

#avis .section-title p {
    color: #1d1d1d;
}

#avis .avis-texte-complet {
    display: none;
}

#avis .avis-date {
    margin-bottom: 0;
}

#avis .text-center {
    margin-top: 40px;
}

/* ===================================
   SECTION RÉALISATIONS
   =================================== */
#realisations .section-title h2 {
    color: #0d5a73;
}

#realisations .section-title p {
    color: #1d1d1d;
}

#realisations .text-center {
    margin-top: 50px;
}

/* ===================================
   SECTION RESPONSIVE DESIGN
   =================================== */
#responsive .section-title h2 {
    color: #0d5a73;
}

#responsive .presentation-row {
    align-items: center;
    gap: 40px;
}

#responsive .presentation-row .presentation-image img {
    width: 80%;
    height: auto;
    border-radius: 8px;
    margin: 0 auto;
    display: block;
}

#responsive .presentation-row .presentation-text h3 {
    color: #0d5a73;
    margin-bottom: 20px;
}

#responsive .presentation-row .presentation-text p {
    text-align: justify;
    hyphens: none;
    color: #1d1d1d;
}

/* ===================================
   SECTION CTA FINAL
   =================================== */
#cta-final {
    text-align: center;
}

#cta-final h2 {
    color: #0d5a73;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin-bottom: 20px;
}

#cta-final p {
    font-size: 1.6rem;
    margin-bottom: 35px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    color: #1d1d1d;
}

#cta-final .cta-buttons {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
}