/**
 * Mesures du site source Isimedia appliquées au socle et aux blocs du parent : tailles des
 * titres, puis réglages des blocs via les propriétés CSS qu'ils exposent (voir l'en-tête de
 * leur style.css).
 */

/* Titres (source : galaxyy-isimedia/scss/abstracts/_common.scss). Le h1 garde 45px à toutes les
   largeurs (l'entête d'accueil réduit son titre en mobile). Sous 992px, h2 et h3 prennent les
   tailles du parent (24 et 18px, comme la source), sauf dans les blocs où la source les garde. */
h1,
h2,
h3,
h4 {
    line-height: 1.2;
    text-wrap: balance;
}

h1 {
    font-size: 45px;
}

@media (min-width: 992px) {
    h2,
    h1.image-texte__section-title {
        font-size: 37px;
    }

    h3 {
        font-size: 25px;
    }
}

@media (max-width: 991px) {
    :is(.cartes-couleur, .cartes-lien, .references, .faq) h2 {
        font-size: 37px;
    }

    .cartes-couleur h3 {
        font-size: 25px;
    }
}

/* Entête accueil : colonne du texte alignée sur la grille du site, texte en gras 18px, flèche
   jaune (source : galaxyy-isimedia/scss/modules/_entete_accueil.scss). */
.entete-accueil {
    --entete-accueil-width: var(--gt-container-width);
    --entete-accueil-max-width: var(--gt-container-max);
    --entete-accueil-intro-max-width: none;
    --entete-accueil-text-size: 18px;
    --entete-accueil-text-weight: bold;
    --entete-accueil-text-line-height: 27px;
    --entete-accueil-scroll-color: var(--gt-color-primary);
    --entete-accueil-stats-columns-mobile: 1;
}

/* Entête d'accueil « simple » (page d'atterrissage, source : entete_accueil_2) : image calée en haut
   à gauche, texte en gras 16px / 24px. */
.entete-accueil--simple {
    --entete-accueil-simple-position: 0 0;
    --entete-accueil-simple-text-weight: bold;
    --entete-accueil-simple-text-line-height: 24px;
}

/* Entête de page en h2 (sous un autre h1) : taille du h1 du site, 45px à toutes les largeurs. */
.entete-page {
    --entete-page-h2-size: 45px;
    --entete-page-h2-size-mobile: 45px;
}

/* Cartes lien : titre à la taille des h2 du site, bordure gris très clair (source : #ebf0ec),
   cartes à l'espacement de la section sous un titre sans introduction. */
.cartes-lien {
    --cartes-lien-title-size: 37px;
    --cartes-lien-border-color: #ebf0ec;
    --cartes-lien-title-margin-sans-intro: 0;
}

/* Image et texte : paragraphes sans marge haute (colonne flex de la source, sans fusion). */
.image-texte {
    --image-texte-paragraph-margin: 0 0 16px;
}

/* FAQ : sections espacées de 64px comme les autres blocs de la source ; texte foncé sur le jaune,
   description en texte courant, filets gris-bleu ; en disposition « empilée », en-tête centré en
   bloc mais texte aligné à gauche (source : galaxyy-isimedia/scss/modules/_faq.scss). */
.faq {
    --faq-padding: var(--gt-spacing-lg);
    --faq-toggle-color: var(--gt-color-neutral-900);
    --faq-description-color: var(--gt-color-neutral-900);
    --faq-border-color: #94a3b8;
    --faq-empilee-header-align: start;
}

/* Questions équilibrées sur leurs lignes, comme les titres du site. */
.faq__question-text {
    text-wrap: balance;
}

/* Encart « couleur » : texte foncé sur le jaune (contraste suffisant, RGAA 3.2). */
.encart-cta {
    --encart-cta-couleur-color: var(--gt-color-neutral-900);
}

/* Étapes : titres à la taille des h3 du site, étiquette en texte foncé sur le jaune. */
.etapes {
    --etapes-title-size: 25px;
    --etapes-tag-color: var(--gt-color-neutral-900);
}

/* Bandeau citation (icônes) : titre crème sur fond sombre (source : text-tertiary-text). */
.bandeau--icones:is(.bandeau--primary-dark, .bandeau--black) {
    --bandeau-title-color: var(--isimedia-color-cream);
}

/* Bandeau texte et image : titre à la taille des h2 du site, texte à 128px des bords. */
.bandeau-texte-image {
    --bandeau-texte-image-primary-color: var(--gt-color-neutral-900);
    --bandeau-texte-image-title-size: 37px;
    --bandeau-texte-image-inner-margin: 128px;
    --bandeau-texte-image-inner-padding: 128px;
}

/* Disposition « image-texte » : comme la source (entete_tertiaire), image au-dessus du texte
   dès 1199px, texte à 64px des bords, puis à 10 % sous 992px. */
@media (max-width: 1199px) {
    .bandeau-texte-image--image-texte {
        flex-direction: column-reverse;
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__content,
    .bandeau-texte-image--image-texte .bandeau-texte-image__media {
        width: 100%;
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__content {
        padding: var(--gt-spacing-lg);
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__content-inner {
        width: 100%;
        margin: 0;
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__media img {
        height: auto;
    }
}

@media (max-width: 991px) {
    .bandeau-texte-image--image-texte .bandeau-texte-image__content {
        padding: 10%;
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__title {
        margin-top: 0.83em;
    }

    .bandeau-texte-image--image-texte .bandeau-texte-image__text p:last-child,
    .bandeau-texte-image--image-texte .bandeau-texte-image__actions {
        margin-bottom: 0;
    }
}

/* Atouts (source : module atout) : chiffres à la taille des h2, liste sans marge au-dessus,
   atouts empilés et centrés sous 992px. */
.atouts {
    --atouts-figure-size: 37px;
    --atouts-list-offset: 0;
}

@media (max-width: 991px) {
    .atouts {
        --atouts-figure-size: 24px;
    }

    .atouts:not(.atouts--etroite) .atouts__list {
        flex-direction: column;
        align-items: center;
    }

    .atouts:not(.atouts--etroite) .atouts__item {
        flex: none;
    }
}

/* Cartes encadrées : sections espacées de 64px, titre à 30px des cartes. */
.cartes-encadrees {
    --cartes-encadrees-padding: var(--gt-spacing-lg);
    --cartes-encadrees-title-margin: 0 0 30px;
    --cartes-encadrees-card-max-width: 688px;
}

/* Sous 992px, titres de 24px dans ces bandeaux (source). */
@media (max-width: 991px) {
    .bandeau-texte-image {
        --bandeau-texte-image-title-size: 24px;
    }

    .bandeau--icones .bandeau__title {
        font-size: 24px;
    }

    .etapes {
        --etapes-title-size: 18px;
    }

    .etapes--icones .etapes__title {
        font-size: 24px;
        text-align: left;
    }
}

/* Tuiles de couleur principale : texte foncé sur le jaune. */
.tuiles {
    --tuiles-primary-color: var(--gt-color-neutral-900);
}

/* Témoignage (mot des fondateurs) : contenu sur la largeur du site, fond gris très clair, texte
   aligné à gauche à toutes les largeurs (source : galaxyy-isimedia/scss/modules/_temoignage.scss). */
.temoignage {
    --temoignage-padding: var(--gt-spacing-lg);
    --temoignage-background: var(--gt-color-neutral-50);
    --temoignage-width: var(--gt-container-width);
    --temoignage-max-width: var(--gt-container-max);
    --temoignage-title-margin: 0.83em 0;
    --temoignage-text-align-mobile: start;
}

/* Frise (dates clés, style « empilée ») : tailles des titres et du texte du site. */
.frise {
    --frise-empilee-title-size: 37px;
    --frise-empilee-annee-size: 37px;
    --frise-empilee-nom-size: 25px;
    --frise-texte-size: 16px;
}

@media (max-width: 991px) {
    .frise {
        --frise-empilee-title-size: 24px;
        --frise-empilee-annee-size: 24px;
        --frise-empilee-nom-size: 18px;
    }
}

/* Texte centré resserré (confirmation d'envoi du formulaire) : pas d'espace au-dessus, 50px
   dessous, titre à 0.83em du texte, bouton 16px sous le texte (marge du dernier paragraphe),
   comme la source. */
.texte-centre--resserre {
    --texte-centre-resserre-padding: 0 50px;
    --texte-centre-resserre-title-margin: 0.83em;
    --texte-centre-bouton-margin: 0;
}
