/* style_porteur-de-projet.css */
  
  /* =====================================================
     Section HERO (Porteur de Projet)
  ===================================================== */
  .hero-section {
    position: relative;
    background-image: url('https://www.ecomelio.fr/images/escaliers.jpg');
    background-size: cover;
    background-position: center;
    padding: 100px 20px;
    text-align: center;
    color: #111111;
}

.hero-content {
    max-width: 800px;
    margin: 0 auto;
}

.hero-subtitle {
    font-size: clamp(0.875rem, 0.38vw + 0.8rem, 1.125rem);
    font-weight: 400;
    letter-spacing: 0.08em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.hero-title {
    font-size: clamp(3.5rem, 2.63vw + 2.99rem, 5.25rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    font-family: 'Tiempos Headline', 'Lucida', Georgia, serif;
    line-height: 1.08;
    margin-bottom: 20px;
}

.hero-description {
    font-size: clamp(1.125rem, 0.56vw + 1.02rem, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    margin-bottom: 40px;
}

.hero-button {
    display: inline-block;
    padding: 15px 30px;
    background-color: #ffffff;
    color: #111111;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: 50px;
    transition: background-color 0.3s, transform 0.3s;
}

.hero-button:hover {
    background-color: #f0f0f0;
}

/* -------------------------------------------
   Section 4 - Trusted By
------------------------------------------- */
.trusted-by-section {
    background-color: var(--background);
    padding: 100px 20px;
    position: relative;
    z-index: 7;
}

.trusted-content {
    max-width: 1200px;
    margin: 0 auto;
}

.section-container {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 40px;
    padding: 20px;
    flex-direction: row;
}

.image-block {
    flex: 1;
    max-width: 50%;
    overflow: hidden;
}

.image-block img {
    width: 100%;
    height: auto;
    max-width: 400px;
    border-radius: 15px;
    object-fit: cover;
}

.text-block {
    flex: 1;
    max-width: 50%;
}

.text-block h2 {
    font-size: clamp(2.25rem, 1.74rem + 2.63vw, 4rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    font-family: 'Tiempos Headline', Georgia, serif;
    line-height: 1.16;
    margin-bottom: 20px;
}

.text-block p {
    font-size: clamp(1.125rem, 1.02rem + 0.56vw, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
}

/* Statistiques */
.trusted-stats {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    padding: 20px;
    border-top: 1px solid #d1d1d1;
    border-bottom: 1px solid #d1d1d1;
    text-align: center;
}

.stat-item {
    flex: 1;
    padding: 20px;
}

.stat-item h3 {
    font-size: clamp(2rem, 1.5rem + 1.5vw, 2.5rem);
    font-weight: 600;
    font-family: 'Tiempos Headline', Georgia, serif;
    line-height: 1.2;
    margin-bottom: 10px;
}

.stat-item p {
    font-size: clamp(1rem, 0.8rem + 0.5vw, 1.25rem);
    font-weight: 400;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.4;
}

.stat-item:not(:last-child) {
    border-right: 1px solid #d1d1d1;
    padding-right: 20px;
}

/* Responsive */
@media (max-width: 768px) {
    .section-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .text-block {
        order: 1;
        max-width: 100%;
    }
    .image-block {
        order: 2;
        max-width: 100%;
    }
    .trusted-stats {
        flex-direction: column;
    }
    .stat-item:not(:last-child) {
        border-right: none;
        border-bottom: 1px solid #d1d1d1;
        padding-bottom: 20px;
    }
}

/***** SECTION – Parcours de Financement (Porteur) *****/
.steps-section{
    background-color:#ffffff;
    padding:100px 20px;
}
.container-steps{max-width:1200px;margin:0 auto;}
.steps-title{
    font-family:'Tiempos Headline','Lucida',Georgia,serif;
    font-size:clamp(2.25rem,1.5rem + 2.5vw,3.25rem);
    font-weight:500;
    text-align:center;
    margin-bottom:80px;
}
/* Wrapper & spacing */
.steps-wrapper{display:flex;flex-direction:column;gap:80px;}
.step-item{display:flex;flex-wrap:wrap;align-items:center;gap:40px;}
.step-item:nth-child(even){flex-direction:row-reverse;}
/* Media */
.step-media{flex:1 1 400px;max-width:500px;text-align:center;}
.step-media img{width:100%;border-radius:15px;}
/* Content */
.step-content{flex:1 1 400px;max-width:600px;}
.step-number{
    font-family:'Futura PT',system-ui,'Helvetica Neue',sans-serif;
    font-size:clamp(0.875rem,0.38vw + 0.8rem,1.125rem);
    text-transform:uppercase;
    letter-spacing:0.08em;
    font-weight:600;
    color:#BAA883;          /* accent EcoMelio */
    margin-bottom:10px;
}
.step-heading{
    font-family:'Futura PT',system-ui,'Helvetica Neue',sans-serif;
    font-size:clamp(1.75rem,1.31rem + 1.75vw,2.5rem);
    font-weight:500;
    letter-spacing:-0.0075em;
    margin-bottom:15px;
}
.step-text{
    font-family:'Futura PT',system-ui,'Helvetica Neue',sans-serif;
    font-size:clamp(1.125rem,1.02rem + 0.56vw,1.5rem);
    line-height:1.5;
}
/* --------- Mobile optimisation --------- */
@media(max-width:768px){
    .step-item{flex-direction:column;text-align:center;}
    .step-item:nth-child(even){flex-direction:column;}
    .step-media,.step-content{max-width:100%; flex: 1 1;}
    .steps-wrapper{gap:60px;}          /* espace réduit sur mobile */
}


/* -------------------------------------------
   Section 4b - Investissement Immobilier Fractionné
------------------------------------------- */
.fractional-investment-section {
    --background: #faf9f9;
    --text-color: #111111;

    background-color: var(--background);
    color: var(--text-color);
    padding: 100px 20px;
    position: relative;
    z-index: 2;
}

.fractional-investment-wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

.fractional-header {
    text-align: center;
    margin-bottom: 40px;
}

.fractional-title {
    font-size: clamp(2.5rem, 2.26vw + 2.06rem, 4rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    font-family: 'Tiempos Headline', Georgia, serif;
    line-height: 1.16;
    margin-bottom: 20px;
}

.fractional-subtitle {
    font-size: clamp(1.125rem, 0.56vw + 1.02rem, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    margin-bottom: 20px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.fractional-cta {
    display: inline-block;
    padding: 15px 30px;
    background-color: #111111;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
    border-radius: 50px;
    transition: background-color 0.3s, transform 0.3s;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
}

.fractional-cta:hover {
    background-color: #333333;
}

/* Séparateur (optionnel) */
.fractional-separator {
    width: 80%;
    max-width: 800px;
    border: none;
    margin: 40px auto;
}

.fractional-content-grid {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

/* Partie gauche : texte + liste numérotée */
.fractional-content-text {
    flex: 1;
    max-width: 600px;
}

.fractional-content-text h3 {
    font-size: clamp(1.75rem, 1.5rem + 1vw, 2.5rem);
    font-family: 'Tiempos Headline', Georgia, serif;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.16;
    margin-bottom: 20px;
}

/* Liste numérotée */
.numbered-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.numbered-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1rem;
}

/* Cercle autour du chiffre */
.number-circle {
    width: 40px;
    height: 40px;
    background-color: #111;
    color: #fff;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 1;
    margin-right: 10px;
    flex-shrink: 0; /* IMPORTANT pour éviter l'écrasement en flex */
}

/* Texte à côté du cercle */
.numbered-list li p {
    font-size: clamp(1.125rem, 0.56vw + 1.02rem, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    margin-bottom: 20px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* Partie droite : image */
.fractional-content-image {
    flex: 1;
    max-width: 500px;
    overflow: hidden;
    text-align: center;
}

.fractional-image {
    width: 100%;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

/* Responsive */
@media (max-width: 768px) {
    .fractional-content-grid {
        flex-direction: column;
        text-align: center;
        gap: 30px;
    }
    .fractional-content-text,
    .fractional-content-image {
        max-width: 100%;
    }
    .fractional-content-text h3 {
        text-align: center;
    }
    .numbered-list li {
        flex-direction: column;
        align-items: center;
    }
    .numbered-list li p {
        text-align: center;
        margin-top: 10px;
    }
}

  /* Section Sécurité */

.section-securite {
    position: relative;
    padding: 100px 20px;
    z-index: 8;
}


/* Centre et borne la grille interne de la section 3 */
.section-securite .section-content {
  max-width: 1200px;         /* largeur max du contenu */
  width: 100%;
  margin: 0 auto;            /* centre horizontalement */
  padding-left: clamp(16px, 5vw, 40px);
  padding-right: clamp(16px, 5vw, 40px);
  /* on garde tes règles existantes */
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: center;
  text-align: left;
}
/* Contenu textuel */
.section-securite .text-content {
    flex: 1;
    max-width: 600px;
    text-align: left;
}

/* Sous-titre de la section */
.section-securite .hero-subtitle {
    font-size: clamp(0.875rem, 0.38vw + 0.8rem, 1.125rem);
    font-weight: 400;
    letter-spacing: 0.08em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* Titre principal */
.section-securite .title {
    font-family: 'Tiempos Headline', 'Lucida', Georgia, serif;
    margin-bottom: 20px;
    font-size: clamp(2.5rem, 1.69rem + 4.14vw, 3.5rem);
    font-weight: 500;
    letter-spacing: -0.0075em;
    line-height: 1.16;
}

/* Sous-titre */
.section-securite .subtitle {
    font-size: clamp(1.125rem, 1.02rem + 0.56vw, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    margin-bottom: 30px;
}

/* Bouton d'appel à l'action */
.section-securite .cta-button {
    display: inline-block;
    padding: 15px 30px;
    background-color: #111111;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
    border-radius: 50px;
    transition: background-color 0.3s, transform 0.3s;
    margin-bottom: 30px;
}

.section-securite .cta-button:hover {
    background-color: #333333;
}

/* Contenu image */
.section-securite .media-content {
    flex: 1;
    max-width: 700px;
    overflow: hidden;
    text-align: center;
}

.section-securite .background-image {
    width: 100%;
    max-width: 400px;
    height: auto;
    object-fit: cover;
    border-radius: 15px;
}

/* Responsivité pour petits écrans */
@media (max-width: 768px) {
    .section-securite .section-content {
        flex-direction: column-reverse;
        align-items: center;
        padding: 20px 20px;
    }

    .section-securite .text-content {
        text-align: center;
    }

    .section-securite .media-content {
        order: 2;
        margin-top: 20px;
    }
}


/* -------------------------------------------
   Section — Frais transparents (aligné au style existant)
------------------------------------------- */

.fees-subtitle{
  font-size:clamp(1.125rem, 0.56vw + 1.02rem, 1.5rem);
  font-weight:400;
  letter-spacing:-0.005em;
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
  line-height:1.24;
  max-width:700px;
  margin:0 auto;
}

/* Cards */
.fees-grid{
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 60px;
    padding: 0 20px;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
}
.fee-card{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    flex: 1;
    max-width: 300px;
    padding: 20px;
}
.fee-heading{
    font-size: clamp(1.5rem, 1.39rem + 0.56vw, 1.875rem);
    font-weight: 500;
    letter-spacing: -0.0075em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.24;
    margin-bottom: 10px;
}
.fee-text{
    font-size: clamp(1.125rem, 1.02rem + 0.56vw, 1.5rem);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-family: 'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
    line-height: 1.5;
}

.fee-note{
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
  font-size:.95rem;
  color:#6b6b6b;
  margin-top:12px;
}

@media (max-width: 768px){
  .fees-grid{grid-template-columns:1fr;}

    .fees-grid {
        flex-direction: column;
        border-top: none;
        border-bottom: none;
        align-items: center;
    }

    .fee-card {
        border-bottom: 1px solid #e1e1e1;
        text-align: center;
    }
}

/* On utilise directement .fractional-subtitle pour la phrase sous le titre */
/* Harmonisation section frais avec tes sections existantes */
.fees-section{
  --background:#fcfcfc;
  --text-color:#111111;
  background-color:var(--background);
  color:var(--text-color);
  padding:100px 20px;
  position:relative;
  z-index:2;
}
.fees-wrapper{max-width:1200px;margin:0 auto;}
.fees-header{text-align:center;margin-bottom:40px;}
.fees-title{
  font-size:clamp(2.5rem, 2.26vw + 2.06rem, 4rem);
  font-weight:400;
  letter-spacing:0.01em;
  font-family:'Tiempos Headline', Georgia, serif;
  line-height:1.16;
  margin-bottom:20px;
}

/* Simulateur */
.fees-sim{
  border:1px solid #d1d1d1;
  border-radius:15px;
  padding:24px;
  background:#fff;
  margin-top:40px;
}
.fee-sim-title{
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
  font-size:clamp(1.25rem, 1rem + 0.75vw, 1.5rem);
  font-weight:600;
  margin-bottom:16px;
}
.fee-sim-row{
  display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:16px;
}
.fee-label{
  min-width:260px;
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;
  font-size:clamp(1rem, 0.8rem + 0.5vw, 1.125rem);
}
.fee-input{
  flex:1 1 280px;min-width:240px;padding:12px 14px;border:1px solid #d1d1d1;border-radius:10px;
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;font-size:1rem;outline:none;
}
.fee-input:focus{border-color:#111; box-shadow:0 0 0 2px rgba(17,17,17,.08);}

.fee-sim-results{
  display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px;
}
.fee-result{
  border:1px solid #d1d1d1;border-radius:12px;padding:14px 16px;
  display:flex;align-items:center;justify-content:space-between;background:#fafafa;
}
.fee-result-label{
  font-family:'Futura PT', system-ui, 'Helvetica Neue', sans-serif;font-size:1rem;color:#555;
}
/* .fee-result-value hérite de .fractional-subtitle pour la typo demandée */
@media (max-width:768px){
  .fee-sim-results{grid-template-columns:1fr;}
}