:root{
      --bg:#fff1d7;
      --dark:#09331f;
      --salmon:#f28080;
      --orange:#f5a70f;
      --green2:#70d19d;
      --textlight:#fff1d7;
    }

    .color-green{
      color:var(--green2);
    }
    .color-salmon{
      color:var(--salmon);
    }
    html,body{height:100%}
    body{
      font-family:"Bricolage Grotesque", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
      background:var(--dark);
      margin: 0 auto !important;
      max-width: 1600px;      
      color: var(--dark);
      text-align:center;
    }

    p{
      font-size:1.2rem;
      line-height:1.4;
      margin-bottom:1.3rem;
    }

    .img-forma-2{
      width:93px;
      margin:20px;
    }

    .text-light{
      color: var(--textlight) !important;
    }
    .intro-manifiesto{
      font-size:1.56rem;
      line-height:1.3;
      color: var(--salmon);
    }

    /* HEADER HERO */
.hero {
    background: url(../img/intro.jpg);
    background-color: var(--dark);
    color: #fff;
    padding: 72px 0 60px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100%;
}
    .hero h1{
      font-size:4.5rem;
      font-weight:800;
      line-height:1.1;
      color:var(--textlight);
    }

    /* Títulos de secciones */
    .section-title,
    .timeline-title{
      font-weight:800;
      font-size:4.5rem;
      text-align:center;
      line-height:1;
      margin-bottom:25px;
    }
    .section-title{color:var(--dark);}
    .timeline-title{color:var(--green2);}

.manifiesto {
    background: url(../img/bg.png) no-repeat center top;
    background-color: var(--bg);
    background-size: cover;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .citas{
        background-color: var(--bg);      
    }

    /* Citas grandes con fondo */
    .quote-block{max-width:920px; margin-inline:auto;}
    .quote-box{
      position:relative;
      background-color:rgb(113 209 157 / 20%);
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:center;
      padding:57px 32px 24px;
      margin:100px auto 30px;
      width:116%;
      transform:translateX(-7%);
    }
    .quote-box::before{
      content:'';
      position:absolute;
      width:112px;
      height:90px;
      top:-64px; /* se corrige con margin-top negativo original */
      background-size:contain;
      background-repeat:no-repeat;
    }
    .quote-img-1::before{ background-image:url(../img/forma_1.svg); }
    .quote-img-2::before{ background-image:url(../img/forma_3.svg); }

    .divider-salmon {
        background-image: url(../img/ave.png);
        height: 40%;
        background-color: var(--salmon);
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;        
    }

    .divider-salmon2 {
        background-image: url(../img/bg-final.jpg);
        height: 40%;
        background-color: var(--salmon);
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;        
    }


    .divider-salmon2 a{
      color: var(--textlight) !important;
    }

    /* Icono sol de la timeline */
    .sun{
      display:inline-flex;
      width:40px;
      height:86px;
      margin-left:-35px;
      margin-top:-10px;
    }

    /* Quiénes */
    .people-section{background-color:var(--salmon);}
    .people-title{
      color:var(--dark);
      font-weight:800;
      font-size:3rem;
      text-align:center;
    }
    .people{
      font-size:0.98rem;
      line-height:1.5;
      max-width:725px;
      margin:0 auto;
      text-align:center;
    }

    /* Timeline */
    .timeline{max-width:900px; margin:0 auto;}
    .timeline-section{position:relative; padding-left:60px;}

    .tl-item{position:relative; display:flex; gap:16px;}
    .tl-dot::after {
        content: '';
        display: block;
        height: 126%;
        background-color: #f5a70f;
        width: 2px;
        margin-top: -55px;
        margin-left: 17px;
    }
    .timeline div .tl-item:last-child .tl-dot::after {
        display: none;
    }

    .timeline div .tl-item:last-child .tl-dot {
        margin-left: 19px;
    }

    .timeline div .tl-item:last-child .tl-card h3,
    .timeline div .tl-item:last-child p  {
        padding-left: 37px !important;
    }

    .tl-dot{margin-left:12px; margin-top:1px;}
    .tl-card{text-align:left;}
    .tl-card h3{
      color:var(--dark);
      font-weight:700;
      margin-bottom:6px;
      font-size:1.56rem;
      padding-left:30px;
      margin-top: 20px;
    }

  .timeline p {
      color: var(--dark);
      margin-top: 12px;
      padding-left: 30px;
  }

    .divider-salmon2 h3{
      font-size:1.56rem;
    }

    /* Footer */
    footer{background:var(--green2); color:var(--orange);}
    .footer-logos img{height:28px; object-fit:contain;}

    footer img {
    max-width: 190px;
    width: 100%;
    height: auto;
    }


    /* Responsive */
    @media (max-width:768px){
      .hero h1{font-size:3rem;}
      .section-title, .timeline-title{font-size:3rem;}
    .timeline-section {
        padding-left: 24px;
    }
    .hero{
      height: 60%;
    }

.manifiesto {
    background-size: contain;
}
    .manifiesto .quote-block {
        padding: 54px;
    }

.divider-salmon2 h3 {
    font-size: 1.3rem;
}
.divider-salmon2{
  height: auto;
}
    }

    @media (max-width:1024px){
      .divider-salmon{
        height:11%;
      }
      .quote-box{
        padding:57px 32px 24px;
        margin-top:80px;
        width:100%;
        transform:none;
      }

    }