/* =====================================================
   INICIO | PUNTO APARTE GROUP
   Archivo: css/style.css

   IMPORTANTE:
   - El menú global se controla únicamente desde css/menu.css
   - Este archivo contiene solo las secciones propias del index
===================================================== */

:root{
    --black:#111111;
    --text:#1f1f1f;
    --muted:#626262;
    --gold:#b89a63;
    --gold-light:#c6a365;
    --cream:#fbf8f1;
    --white:#ffffff;
    --border:rgba(0,0,0,.09);
    --serif:"Cormorant Garamond",serif;
    --sans:"Poppins",sans-serif;
}

/* =====================================================
   RESET
===================================================== */

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

html{
    scroll-behavior:smooth;
}

body{
    overflow-x:hidden;
    background:var(--white);
    color:var(--text);
    font-family:var(--sans);
}

img{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
}

button{
    font:inherit;
    -webkit-tap-highlight-color:transparent;
}

/* =====================================================
   SECCIÓN 1 | HERO
===================================================== */

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    padding:155px 8% 100px;
    overflow:hidden;
    background:var(--black);
}

.slide{
    position:absolute;
    inset:0;
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center right;
    opacity:0;
    transform:scale(1.045);
    transition:
        opacity 1.2s ease,
        transform 7s ease;
}

.slide.active{
    opacity:1;
    transform:scale(1);
}

.overlay{
    position:absolute;
    inset:0;
    z-index:1;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.90) 0%,
            rgba(0,0,0,.76) 38%,
            rgba(0,0,0,.46) 68%,
            rgba(0,0,0,.18) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.34) 0%,
            rgba(0,0,0,.08) 48%,
            rgba(0,0,0,.48) 100%
        );
}

.hero-content{
    position:relative;
    z-index:2;
    width:min(100%,760px);
    color:var(--white);
}

.subtitle{
    display:inline-block;
    margin-bottom:24px;
    color:var(--gold-light);
    font-size:10px;
    font-weight:600;
    line-height:1.6;
    letter-spacing:5px;
    text-transform:uppercase;
}

.hero h1{
    max-width:750px;
    margin-bottom:28px;
    font-family:var(--serif);
    font-size:clamp(48px,5vw,64px);
    font-weight:500;
    line-height:1.06;
    letter-spacing:-.6px;
}

.hero-description{
    max-width:650px;
    margin-bottom:35px;
    color:rgba(255,255,255,.80);
    font-size:15px;
    font-weight:300;
    line-height:1.85;
}

.hero-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:32px;
}

.btn-primary,
.btn-outline{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 31px;
    border:1px solid transparent;
    font-size:10px;
    font-weight:600;
    letter-spacing:1.7px;
    text-decoration:none;
    text-transform:uppercase;
    transition:.35s ease;
}

.btn-primary{
    color:var(--white);
    background:var(--gold);
    border-color:var(--gold);
}

.btn-outline{
    color:var(--white);
    background:transparent;
    border-color:rgba(255,255,255,.66);
}

.btn-primary:hover,
.btn-outline:hover{
    color:var(--text);
    background:var(--white);
    border-color:var(--white);
    transform:translateY(-2px);
}

.slider-dots{
    position:absolute;
    left:8%;
    bottom:32px;
    z-index:3;
    display:flex;
    gap:12px;
}

.dot{
    width:9px;
    height:9px;
    padding:0;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.44);
    cursor:pointer;
    transition:.3s ease;
}

.dot:hover,
.dot.active-dot{
    background:var(--white);
    transform:scale(1.18);
}

/* =====================================================
   SECCIÓN 2 | PENSAMIENTO
===================================================== */

.thinking-section{
    padding:115px 0;
    background:var(--cream);
}

.thinking-top{
    width:min(100%,1320px);
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:80px;
    align-items:center;
    margin:0 auto;
    padding:0 70px 90px;
}

.thinking-copy h2{
    margin-bottom:34px;
    color:var(--text);
    font-family:var(--serif);
    font-size:clamp(43px,4.4vw,57px);
    font-weight:500;
    line-height:1.06;
}

.thinking-copy p{
    max-width:570px;
    margin-bottom:18px;
    color:#555;
    font-size:15px;
    line-height:1.9;
}

.thinking-image{
    display:flex;
    justify-content:flex-end;
}

.thinking-image img{
    width:100%;
    max-width:590px;
    height:390px;
    object-fit:cover;
    transition:transform .6s ease;
}

.thinking-image:hover img{
    transform:scale(1.02);
}

.thinking-bottom{
    width:min(100%,1200px);
    margin:0 auto;
    padding:78px 35px 0;
    border-top:1px solid var(--border);
}

.thinking-heading{
    max-width:860px;
    margin:0 auto 75px;
    text-align:center;
}

.thinking-heading > span{
    display:block;
    margin-bottom:17px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:5px;
    text-transform:uppercase;
}

.thinking-heading h3{
    margin-bottom:27px;
    font-family:var(--serif);
    font-size:clamp(42px,4.5vw,55px);
    font-weight:500;
    line-height:1.05;
}

.thinking-heading p{
    margin-bottom:14px;
    color:var(--muted);
    font-size:15px;
    line-height:1.9;
}

.thinking-cards{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:80px;
}

.thinking-card{
    text-align:center;
}

.thinking-icon{
    width:82px;
    height:82px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 27px;
    color:var(--gold);
    border:1px solid rgba(184,154,99,.46);
    border-radius:50%;
    font-size:34px;
    transition:.35s ease;
}

.thinking-card:hover .thinking-icon{
    color:var(--white);
    background:var(--gold);
    transform:translateY(-6px);
}

.thinking-card h4{
    margin-bottom:18px;
    font-family:var(--serif);
    font-size:34px;
    font-weight:500;
    line-height:1.1;
}

.thinking-card h4::after{
    content:"";
    width:36px;
    height:1px;
    display:block;
    margin:16px auto 0;
    background:var(--gold);
}

.thinking-card p{
    max-width:290px;
    margin:0 auto;
    color:var(--muted);
    font-size:14px;
    line-height:1.85;
}

/* =====================================================
   SECCIÓN 3 | MODELO PUNTO APARTE
===================================================== */

.method-section{
    padding:120px 7%;
    background:var(--cream);
    border-top:1px solid var(--border);
}

.method-container{
    width:min(100%,1280px);
    margin:0 auto;
}

.method-header{
    max-width:870px;
    margin:0 auto 76px;
    text-align:center;
}

.method-tag{
    display:block;
    margin-bottom:17px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:5px;
    text-transform:uppercase;
}

.method-header h2{
    margin-bottom:27px;
    font-family:var(--serif);
    font-size:clamp(46px,5vw,60px);
    font-weight:500;
    line-height:1.06;
}

.method-header p{
    max-width:770px;
    margin:0 auto;
    color:var(--muted);
    font-size:15px;
    line-height:1.9;
}

.method-steps{
    position:relative;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:25px;
    margin-bottom:68px;
}

.method-steps::before{
    content:"";
    position:absolute;
    top:45px;
    left:7%;
    right:7%;
    height:1px;
    background:#d9c5a2;
    z-index:0;
}

.method-step{
    position:relative;
    z-index:1;
    padding:0;
    color:var(--text);
    background:transparent;
    border:0;
    text-align:center;
    cursor:pointer;
}

.method-icon{
    width:90px;
    height:90px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 18px;
    color:var(--gold);
    background:var(--cream);
    border:1px solid #d9c5a2;
    border-radius:50%;
    transition:.35s ease;
}

.method-icon svg{
    width:32px;
    height:32px;
    stroke-width:1.3;
}

.method-name{
    display:block;
    color:var(--text);
    font-size:10px;
    font-weight:600;
    line-height:1.45;
    letter-spacing:1.8px;
    text-transform:uppercase;
    transition:.3s ease;
}

.method-step:hover .method-icon,
.method-step.active .method-icon{
    color:var(--white);
    background:var(--gold);
    border-color:var(--gold);
    transform:translateY(-5px);
}

.method-step:hover .method-name,
.method-step.active .method-name{
    color:var(--gold);
}

.method-detail{
    max-width:870px;
    margin:0 auto;
    padding:52px;
    background:var(--white);
    border:1px solid var(--border);
    box-shadow:0 18px 45px rgba(0,0,0,.05);
    text-align:center;
    transition:
        opacity .25s ease,
        transform .25s ease;
}

.method-detail.fade{
    opacity:.35;
    transform:translateY(5px);
}

.detail-label{
    display:block;
    margin-bottom:17px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:4px;
    text-transform:uppercase;
}

.method-detail h3{
    margin-bottom:22px;
    font-family:var(--serif);
    font-size:46px;
    font-weight:500;
    line-height:1.05;
}

.method-detail > p{
    color:#555;
    font-size:15px;
    line-height:1.9;
}

.detail-example{
    margin-top:32px;
    padding-top:26px;
    border-top:1px solid var(--border);
}

.detail-example strong{
    display:block;
    margin-bottom:11px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:3px;
    text-transform:uppercase;
}

.detail-example span{
    color:var(--muted);
    font-size:14px;
    line-height:1.8;
}

.method-button{
    display:flex;
    justify-content:center;
    margin-top:54px;
}

.explore-btn{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 41px;
    color:var(--white);
    background:var(--gold);
    border:1px solid var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:1.8px;
    text-decoration:none;
    text-transform:uppercase;
    transition:.35s ease;
}

.explore-btn:hover{
    background:var(--text);
    border-color:var(--text);
    transform:translateY(-2px);
}

/* =====================================================
   SECCIÓN 4 | ECOSISTEMA DE CAPACIDADES
===================================================== */

.ecosystem-section{
    padding:105px 6%;
    background:var(--cream);
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.ecosystem-container{
    width:min(100%,1380px);
    margin:0 auto;
    text-align:center;
}

.ecosystem-header{
    max-width:890px;
    margin:0 auto 60px;
}

.ecosystem-tag{
    display:block;
    margin-bottom:15px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:5px;
    text-transform:uppercase;
}

.ecosystem-header h2{
    margin-bottom:21px;
    font-family:var(--serif);
    font-size:clamp(43px,4.5vw,56px);
    font-weight:500;
    line-height:1.06;
}

.ecosystem-header p{
    max-width:780px;
    margin:0 auto;
    color:#555;
    font-size:14px;
    line-height:1.85;
}

.ecosystem-grid{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
}

.ecosystem-card{
    min-width:0;
    height:100%;
    display:flex;
    flex-direction:column;
    padding:0 17px;
    border-right:1px solid rgba(0,0,0,.10);
}

.ecosystem-card:last-child{
    border-right:0;
}

.eco-icon{
    margin-bottom:16px;
    color:var(--gold);
}

.eco-icon svg{
    width:37px;
    height:37px;
    stroke-width:1.25;
}

.ecosystem-card h3{
    min-height:46px;
    margin-bottom:13px;
    font-size:10px;
    font-weight:600;
    line-height:1.45;
    letter-spacing:1.1px;
    text-transform:uppercase;
}

.ecosystem-card p{
    flex-grow:1;
    margin-bottom:21px;
    color:#555;
    font-size:11.5px;
    line-height:1.72;
}

.ecosystem-card img{
    width:100%;
    height:122px;
    margin-top:auto;
    object-fit:cover;
    transition:.4s ease;
}

.ecosystem-card:hover img{
    transform:translateY(-5px);
}

.ecosystem-button{
    display:flex;
    justify-content:center;
    margin-top:50px;
}

.ecosystem-btn{
    min-height:51px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 38px;
    color:var(--white);
    background:var(--gold);
    border:1px solid var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:1.8px;
    text-decoration:none;
    text-transform:uppercase;
    transition:.35s ease;
}

.ecosystem-btn:hover{
    background:var(--text);
    border-color:var(--text);
    transform:translateY(-2px);
}

/* =====================================================
   SECCIÓN 5 | IDEAS
===================================================== */

.ideas-section{
    padding:110px 7%;
    background:var(--cream);
    border-bottom:1px solid var(--border);
}

.ideas-container{
    width:min(100%,1200px);
    margin:0 auto;
}

.ideas-header{
    max-width:800px;
    margin:0 auto 66px;
    text-align:center;
}

.ideas-tag{
    display:block;
    margin-bottom:16px;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:5px;
    text-transform:uppercase;
}

.ideas-header h2{
    margin-bottom:23px;
    font-family:var(--serif);
    font-size:clamp(45px,4.8vw,58px);
    font-weight:500;
    line-height:1.05;
}

.ideas-header p{
    max-width:720px;
    margin:0 auto;
    color:#555;
    font-size:15px;
    line-height:1.9;
}

.ideas-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:34px;
    align-items:stretch;
}

.idea-card{
    height:100%;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:var(--white);
    border:1px solid var(--border);
    transition:.4s ease;
}

.idea-card:hover{
    box-shadow:0 22px 55px rgba(0,0,0,.08);
    transform:translateY(-8px);
}

.idea-card > img{
    width:100%;
    height:240px;
    object-fit:cover;
    transition:.5s ease;
}

.idea-card:hover > img{
    transform:scale(1.04);
}

.idea-content{
    flex-grow:1;
    display:flex;
    flex-direction:column;
    padding:31px 29px 35px;
}

.idea-content h3{
    min-height:68px;
    margin-bottom:17px;
    font-family:var(--serif);
    font-size:30px;
    font-weight:500;
    line-height:1.08;
}

.idea-content p{
    flex-grow:1;
    margin-bottom:25px;
    color:#555;
    font-size:14px;
    line-height:1.8;
}

.idea-content a{
    margin-top:auto;
    color:var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:1.8px;
    text-decoration:none;
    text-transform:uppercase;
}

.idea-content a span{
    margin-left:6px;
    transition:.3s ease;
}

.idea-content a:hover span{
    margin-left:11px;
}

.ideas-button{
    display:flex;
    justify-content:center;
    margin-top:56px;
}

.ideas-btn{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 41px;
    color:var(--white);
    background:var(--gold);
    border:1px solid var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:1.8px;
    text-decoration:none;
    text-transform:uppercase;
    transition:.35s ease;
}

.ideas-btn:hover{
    background:var(--text);
    border-color:var(--text);
    transform:translateY(-2px);
}




.idea-link{

    display:block;

    height:100%;

    color:inherit;

    text-decoration:none;

}

.read-more{

    display:inline-flex;
    align-items:center;
    gap:8px;

    margin-top:18px;

    color:#c6a365;

    font-weight:500;

    transition:.35s ease;

}

.idea-card:hover .read-more{

    transform:translateX(8px);

}

/* =====================================================
   SECCIÓN 6 | CTA
===================================================== */

.cta-section{
    position:relative;
    overflow:hidden;
    background:var(--black);
}

.cta-bg{
    position:absolute;
    inset:0;
}

.cta-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.cta-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(20,18,16,.88),
            rgba(35,28,22,.72),
            rgba(20,18,16,.82)
        );
}

.cta-container{
    position:relative;
    z-index:1;
    width:min(100%,1350px);
    min-height:380px;
    display:grid;
    grid-template-columns:1.1fr 1fr auto;
    gap:52px;
    align-items:center;
    margin:0 auto;
    padding:75px 7%;
}

.cta-tag{
    display:block;
    margin-bottom:13px;
    color:var(--gold-light);
    font-size:10px;
    font-weight:600;
    letter-spacing:4px;
    text-transform:uppercase;
}

.cta-left h2{
    color:var(--white);
    font-family:var(--serif);
    font-size:clamp(42px,4.2vw,52px);
    font-weight:500;
    line-height:1.05;
}

.cta-right p{
    max-width:560px;
    margin-bottom:13px;
    color:rgba(255,255,255,.88);
    font-size:14px;
    line-height:1.85;
}

.cta-right p:last-child{
    margin-bottom:0;
}

.cta-btn{
    min-height:53px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:16px 40px;
    color:var(--white);
    background:var(--gold);
    border:1px solid var(--gold);
    font-size:10px;
    font-weight:600;
    letter-spacing:1.8px;
    text-decoration:none;
    text-transform:uppercase;
    white-space:nowrap;
    transition:.35s ease;
}

.cta-btn:hover{
    color:var(--text);
    background:var(--white);
    border-color:var(--white);
    transform:translateY(-2px);
}

/* =====================================================
   FOOTER
===================================================== */

.footer{
    padding:90px 7% 0;
    color:var(--white);
    background:var(--black);
}

.footer-container{
    width:min(100%,1400px);
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr .8fr;
    gap:65px;
    align-items:start;
    margin:0 auto;
}

.footer-brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.footer-logo{
    width:195px;
    height:auto;
    margin:-65px 0 24px;
}

.footer-slogan{
    color:var(--white);
    font-size:14px;
    line-height:2;
}

.footer-column h4{
    margin:0 0 29px;
    color:var(--gold-light);
    font-size:10px;
    font-weight:600;
    line-height:1;
    letter-spacing:5px;
    text-transform:uppercase;
}

.footer-nav ul{
    margin:0;
    padding:0;
    list-style:none;
}

.footer-nav a{
    display:block;
    margin-bottom:12px;
    color:rgba(255,255,255,.82);
    font-size:14px;
    line-height:1.55;
    text-decoration:none;
    transition:.3s ease;
}

.footer-nav a:hover{
    color:var(--gold-light);
    padding-left:4px;
}

.social-icons{
    display:flex;
    align-items:center;
    gap:14px;
}

.social-icons a{
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--white);
    border:1px solid rgba(255,255,255,.18);
    text-decoration:none;
    transition:.3s ease;
}

.social-icons a:hover{
    color:var(--black);
    background:var(--gold-light);
    border-color:var(--gold-light);
    transform:translateY(-3px);
}

.footer-bottom{
    width:min(100%,1400px);
    margin:68px auto 0;
    padding:25px 0;
    color:#aaa;
    border-top:1px solid rgba(255,255,255,.10);
    font-size:13px;
    text-align:center;
}

/* =====================================================
   RESPONSIVE | SOLO SECCIONES DEL INDEX
   El responsive del menú está en menu.css
===================================================== */

@media(max-width:1200px){

    .ecosystem-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:48px 0;
    }

    .ecosystem-card{
        padding:0 24px;
        border-right:0;
    }

    .ecosystem-card img{
        height:180px;
    }
}

@media(max-width:1100px){

    .method-steps{
        grid-template-columns:repeat(3,minmax(0,1fr));
        row-gap:42px;
    }

    .method-steps::before{
        display:none;
    }

    .footer-container{
        grid-template-columns:1fr 1fr;
        gap:55px 70px;
    }
}

@media(max-width:992px){

    .hero{
        min-height:850px;
        align-items:flex-start;
        padding:130px 7% 80px;
    }

    .slide{
        background-position:65% center;
    }

    .overlay{
        background:linear-gradient(
            180deg,
            rgba(0,0,0,.90) 0%,
            rgba(0,0,0,.66) 52%,
            rgba(0,0,0,.78) 100%
        );
    }

    .hero-content{
        max-width:100%;
    }

    .hero h1{
        font-size:45px;
    }

    .slider-dots{
        left:7%;
    }

    .thinking-top{
        grid-template-columns:1fr;
        gap:50px;
        padding:0 35px 70px;
    }

    .thinking-image{
        justify-content:center;
    }

    .thinking-image img{
        max-width:100%;
        height:360px;
    }

    .thinking-cards{
        grid-template-columns:1fr;
        gap:52px;
    }

    .thinking-card p{
        max-width:520px;
    }

    .cta-container{
        grid-template-columns:1fr;
        gap:30px;
        text-align:center;
    }

    .cta-right{
        max-width:720px;
        margin:0 auto;
    }

    .cta-action{
        display:flex;
        justify-content:center;
    }
}

@media(max-width:768px){

    .hero{
        min-height:760px;
        padding:115px 7% 65px;
    }

    .slide{
        background-size:cover;
        background-position:center;
    }

    .subtitle{
        font-size:8px;
        letter-spacing:3px;
    }

    .hero h1{
        font-size:36px;
        line-height:1.12;
    }

    .hero-description{
        font-size:14px;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .btn-primary,
    .btn-outline{
        width:100%;
    }

    .thinking-section{
        padding:82px 0;
    }

    .thinking-top{
        padding:0 7% 58px;
    }

    .thinking-copy h2{
        font-size:39px;
    }

    .thinking-image img{
        height:300px;
    }

    .thinking-bottom{
        padding:58px 7% 0;
    }

    .thinking-heading{
        margin-bottom:56px;
        text-align:left;
    }

    .thinking-heading h3{
        font-size:39px;
    }

    .method-section,
    .ecosystem-section,
    .ideas-section{
        padding:85px 7%;
    }

    .method-header,
    .ecosystem-header,
    .ideas-header{
        margin-bottom:52px;
        text-align:left;
    }

    .method-header h2,
    .ecosystem-header h2,
    .ideas-header h2{
        font-size:40px;
    }

    .method-steps{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .method-detail{
        padding:38px 28px;
        text-align:left;
    }

    .method-detail h3{
        font-size:36px;
    }

    .ecosystem-grid{
        grid-template-columns:1fr;
        gap:45px;
    }

    .ecosystem-card{
        padding:0;
        text-align:left;
    }

    .ecosystem-card h3{
        min-height:auto;
        font-size:12px;
    }

    .ecosystem-card img{
        height:230px;
    }

    .ecosystem-btn,
    .ideas-btn{
        width:100%;
    }

    .ideas-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .idea-card > img{
        height:270px;
    }

    .idea-content h3{
        min-height:auto;
    }

    .cta-container{
        min-height:auto;
        padding:78px 7%;
        text-align:left;
    }

    .cta-action{
        justify-content:flex-start;
    }

    .cta-btn{
        width:100%;
    }

    .footer{
        padding:70px 8% 0;
    }

    .footer-container{
        grid-template-columns:1fr;
        gap:42px;
    }

    .footer-logo{
        width:155px;
        margin:-35px 0 22px;
    }

    .footer-bottom{
        margin-top:48px;
        font-size:12px;
    }
}

@media(max-width:520px){

    .hero{
        min-height:700px;
        padding:105px 7% 58px;
    }

    .hero h1{
        font-size:31px;
    }

    .hero-description{
        display:none;
    }

    .thinking-copy h2{
        font-size:35px;
    }

    .thinking-image img{
        height:245px;
    }

    .thinking-heading h3{
        font-size:34px;
    }

    .method-steps{
        grid-template-columns:1fr;
    }

    .method-step{
        display:flex;
        align-items:center;
        gap:18px;
        text-align:left;
    }

    .method-icon{
        width:68px;
        height:68px;
        flex-shrink:0;
        margin:0;
    }

    .method-icon svg{
        width:24px;
        height:24px;
    }

    .method-name{
        font-size:11px;
    }

    .method-detail{
        margin-top:24px;
    }

    .explore-btn{
        width:100%;
    }

    .method-header h2,
    .ecosystem-header h2,
    .ideas-header h2{
        font-size:35px;
    }

    .idea-card > img{
        height:220px;
    }

    .idea-content{
        padding:27px 23px 31px;
    }

    .idea-content h3{
        font-size:28px;
    }

    .cta-left h2{
        font-size:38px;
    }
}

/* =====================================================
   ACCESIBILIDAD
===================================================== */

@media(prefers-reduced-motion:reduce){

    *,
    *::before,
    *::after{
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
    }
}