:root{
    --ink:#171717;
    --text:#303030;
    --muted:#6f6f6f;
    --soft:#f5f2ee;
    --soft-2:#ece8e3;
    --white:#ffffff;
    --accent:#b62424;
    --accent-dark:#8f1818;
    --line:#ded9d4;
    --max:1240px;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--text);
    background:var(--white);
    line-height:1.55;
}

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

a{
    color:inherit;
}

.container{
    width:min(calc(100% - 48px),var(--max));
    margin-inline:auto;
}


/* ==========================================================
   HEADER
   ========================================================== */

.site-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(10px);
}

.header-inner{
    width:min(calc(100% - 48px),var(--max));
    min-height:88px;
    margin:auto;
    display:flex;
    align-items:center;
    gap:30px;
}

.brand{
    display:flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
    min-width:285px;
}

.brand img{
    width:88px;
    height:44px;
    object-fit:contain;
    background:#111;
}

.brand-copy{
    display:flex;
    flex-direction:column;
}

.brand-copy strong{
    font-size:1rem;
    letter-spacing:.02em;
    color:var(--ink);
}

.brand-copy span{
    color:var(--muted);
    font-size:.78rem;
    margin-top:2px;
}

.desktop-nav{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:28px;
}

.desktop-nav a{
    text-decoration:none;
    font-size:.88rem;
    font-weight:700;
    color:#444;
}

.desktop-nav a:hover{
    color:var(--accent);
}

.header-phone{
    flex:none;
    text-decoration:none;
    padding:12px 16px;
    border:1px solid var(--accent);
    color:var(--accent);
    font-weight:800;
}


/* ==========================================================
   HERO
   ========================================================== */

.hero{
    min-height:720px;
    position:relative;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
    background:#222;
}

.hero-image,
.hero-overlay{
    position:absolute;
    inset:0;
}

.hero-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 62%;
}

.hero-overlay{
    background:
        linear-gradient(
            90deg,
            rgba(16,16,16,.90) 0%,
            rgba(16,16,16,.72) 34%,
            rgba(16,16,16,.18) 68%,
            rgba(16,16,16,.04) 100%
        );
}

.hero-content{
    position:relative;
    z-index:2;
    width:min(calc(100% - 48px),var(--max));
    margin:0 auto;
    padding:110px 0 90px;
    color:#fff;
}

.kicker,
.section-label{
    margin:0 0 18px;
    text-transform:uppercase;
    letter-spacing:.18em;
    font-size:.75rem;
    font-weight:800;
    color:var(--accent);
}

.hero .kicker{
    color:#fff;
    opacity:.78;
}

h1,
h2,
h3{
    margin-top:0;
    line-height:1.04;
    color:var(--ink);
}

h1{
    max-width:760px;
    margin-bottom:24px;
    font-size:clamp(3.4rem,7vw,7.2rem);
    letter-spacing:-.065em;
    color:#fff;
}

h2{
    font-size:clamp(2.4rem,4.6vw,4.8rem);
    letter-spacing:-.05em;
    margin-bottom:22px;
}

h3{
    font-size:1.45rem;
    margin-bottom:14px;
}

.hero-text{
    max-width:650px;
    margin:0 0 32px;
    font-size:1.17rem;
    color:#e7e7e7;
}

.hero-actions,
.cta-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:14px 22px;
    text-decoration:none;
    font-weight:800;
    border:1px solid transparent;
    transition:.2s ease;
}

.btn-main{
    background:var(--accent);
    color:#fff;
}

.btn-main:hover{
    background:var(--accent-dark);
}

.btn-outline{
    border-color:rgba(255,255,255,.55);
    color:#fff;
    background:rgba(255,255,255,.03);
}

.btn-outline:hover{
    background:#fff;
    color:#111;
}

.btn-dark{
    background:#1c1c1c;
    color:#fff;
}


/* ==========================================================
   INTRO
   ========================================================== */

.intro{
    padding:105px 0 95px;
    background:var(--soft);
    border-bottom:1px solid var(--line);
}

.intro-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:100px;
    align-items:start;
}

.intro-copy{
    max-width:580px;
    padding-top:20px;
}

.intro-copy p{
    margin:0 0 22px;
    font-size:1.13rem;
    color:#555;
}


/* ==========================================================
   SERVICES
   ========================================================== */

.services{
    padding:105px 0;
}

.section-heading{
    max-width:800px;
    margin-bottom:56px;
}

.services-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid var(--line);
    border-left:1px solid var(--line);
}

.service-card{
    padding:34px 30px 40px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
    background:#fff;
    transition:.2s ease;
}

.service-card:hover{
    background:var(--soft);
}

.service-card > span{
    display:block;
    margin-bottom:55px;
    font-size:.75rem;
    font-weight:800;
    letter-spacing:.12em;
    color:var(--accent);
}

.service-card p{
    margin:0;
    color:var(--muted);
}


/* ==========================================================
   PROCESS
   ========================================================== */

.process{
    padding:105px 0;
    background:#191919;
    color:#fff;
}

.process h2{
    color:#fff;
}

.process .section-label{
    color:#d67272;
}

.process-head{
    display:grid;
    grid-template-columns:1fr auto;
    gap:50px;
    align-items:end;
    margin-bottom:50px;
}

.process-head > p{
    margin:0 0 8px;
    color:#bcbcbc;
}

.process-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:18px;
}

.process-grid figure{
    margin:0;
    background:#252525;
}

.process-grid img{
    width:100%;
    height:430px;
    object-fit:cover;
}

.process-grid figcaption{
    min-height:82px;
    padding:20px 22px;
    display:flex;
    align-items:center;
    gap:18px;
}

.process-grid figcaption span{
    color:#bfbfbf;
    font-size:.78rem;
}

.process-grid figcaption strong{
    font-size:1rem;
}


/* ==========================================================
   FEATURE
   ========================================================== */

.feature{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    min-height:720px;
}

.feature-image{
    background:#ddd;
}

.feature-image img{
    width:100%;
    height:100%;
    min-height:720px;
    object-fit:cover;
    object-position:center center;
}

.feature-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:90px max(50px,calc((100vw - var(--max))/2));
    padding-left:80px;
    background:#fff;
}

.feature-copy p:not(.section-label){
    max-width:590px;
    margin:0 0 20px;
    font-size:1.08rem;
    color:#555;
}


/* ==========================================================
   RESULT
   ========================================================== */

.result{
    padding:105px 0;
    background:var(--soft);
}

.result-grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:80px;
    align-items:center;
}

.result-copy p:not(.section-label){
    max-width:500px;
    color:#555;
    font-size:1.08rem;
}

.result-image img{
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover;
}


/* ==========================================================
   WORKSHOP
   ========================================================== */

.workshop{
    padding:105px 0;
}

.workshop-grid{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:80px;
    align-items:center;
}

.workshop-images{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:16px;
}

.workshop-images img{
    width:100%;
    height:520px;
    object-fit:cover;
}

.workshop-images img:last-child{
    margin-top:70px;
    height:390px;
}

.workshop-copy > p:not(.section-label){
    font-size:1.08rem;
    color:#555;
}

.workshop-data{
    margin:38px 0 26px;
    border-top:1px solid var(--line);
}

.workshop-data > div{
    padding:20px 0;
    border-bottom:1px solid var(--line);
}

.workshop-data span{
    display:block;
    margin-bottom:5px;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:.7rem;
    color:var(--muted);
}

.workshop-data strong,
.workshop-data a{
    color:var(--ink);
    text-decoration:none;
}

.workshop-data a{
    font-size:1.35rem;
    font-weight:800;
}

.text-link{
    color:var(--accent);
    text-decoration:none;
    font-weight:800;
}


/* ==========================================================
   FAQ
   ========================================================== */

.faq{
    padding:105px 0;
    background:#f8f8f8;
}

.faq-grid{
    max-width:940px;
}

.faq details{
    border-top:1px solid var(--line);
    padding:0;
}

.faq details:last-child{
    border-bottom:1px solid var(--line);
}

.faq summary{
    cursor:pointer;
    list-style:none;
    padding:25px 4px;
    font-weight:800;
    font-size:1.08rem;
    color:var(--ink);
}

.faq summary::-webkit-details-marker{
    display:none;
}

.faq summary::after{
    content:"+";
    float:right;
    color:var(--accent);
    font-size:1.4rem;
    line-height:1;
}

.faq details[open] summary::after{
    content:"–";
}

.faq details p{
    max-width:780px;
    margin:0;
    padding:0 0 26px;
    color:#646464;
}


/* ==========================================================
   CTA
   ========================================================== */

.cta{
    padding:78px 0;
    background:var(--accent);
    color:#fff;
}

.cta .section-label{
    color:#fff;
    opacity:.8;
}

.cta h2{
    margin-bottom:0;
    color:#fff;
}

.cta-inner{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:50px;
}

.cta .btn-main{
    background:#fff;
    color:var(--accent);
}

.cta .btn-main:hover{
    background:#f1f1f1;
}


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

.site-footer{
    padding:66px 0 32px;
    background:#111;
    color:#c7c7c7;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.45fr .65fr .65fr;
    gap:70px;
}

.footer-grid > div{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.footer-grid strong{
    margin-bottom:18px;
    color:#fff;
}

.footer-brand{
    font-size:1.45rem;
}

.footer-grid p{
    max-width:520px;
    margin:0 0 18px;
}

.footer-grid a{
    margin-bottom:10px;
    color:#ddd;
    text-decoration:none;
}

.footer-grid a:hover{
    color:#fff;
}

.footer-grid > div:first-child > a{
    color:#fff;
    font-size:1.25rem;
    font-weight:800;
    border-bottom:2px solid var(--accent);
}

.footer-bottom{
    margin-top:48px;
    padding-top:24px;
    border-top:1px solid #333;
    display:flex;
    justify-content:space-between;
    gap:20px;
    font-size:.85rem;
    color:#9f9f9f;
}


/* ==========================================================
   MOBILE ACTIONS
   ========================================================== */

.mobile-actions{
    display:none;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media(max-width:1050px){

    .desktop-nav{
        gap:18px;
    }

    .desktop-nav a{
        font-size:.82rem;
    }

    .services-grid{
        grid-template-columns:1fr 1fr;
    }

    .feature-copy{
        padding-left:55px;
        padding-right:45px;
    }
}


@media(max-width:850px){

    body{
        padding-bottom:62px;
    }

    .container{
        width:min(calc(100% - 32px),var(--max));
    }

    .site-header{
        position:sticky;
    }

    .header-inner{
        width:calc(100% - 32px);
        min-height:72px;
    }

    .brand{
        min-width:0;
    }

    .brand img{
        width:72px;
        height:38px;
    }

    .brand-copy strong{
        font-size:.88rem;
    }

    .brand-copy span{
        font-size:.7rem;
    }

    .desktop-nav,
    .header-phone{
        display:none;
    }

    .hero{
        min-height:auto;
        display:block;
        background:#171717;
    }

    .hero-image{
        position:relative;
        height:310px;
    }

    .hero-image img{
        object-position:center 60%;
    }

    .hero-overlay{
        display:none;
    }

    .hero-content{
        width:calc(100% - 32px);
        padding:42px 0 48px;
    }

    h1{
        font-size:3.15rem;
    }

    .hero-text{
        font-size:1rem;
    }

    .intro,
    .services,
    .process,
    .result,
    .workshop,
    .faq{
        padding:72px 0;
    }

    .intro-grid,
    .result-grid,
    .workshop-grid{
        grid-template-columns:1fr;
        gap:42px;
    }

    .intro-copy{
        padding-top:0;
    }

    .process-head{
        grid-template-columns:1fr;
        gap:0;
    }

    .process-grid{
        grid-template-columns:1fr;
    }

    .process-grid img{
        height:390px;
    }

    .feature{
        grid-template-columns:1fr;
        min-height:0;
    }

    .feature-image img{
        min-height:0;
        height:560px;
    }

    .feature-copy{
        padding:70px 32px;
    }

    .workshop-images img{
        height:390px;
    }

    .workshop-images img:last-child{
        height:320px;
        margin-top:40px;
    }

    .cta-inner{
        grid-template-columns:1fr;
        gap:32px;
    }

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

    .footer-grid > div:first-child{
        grid-column:1 / -1;
    }

    .mobile-actions{
        position:fixed;
        z-index:1200;
        left:0;
        right:0;
        bottom:0;
        display:grid;
        grid-template-columns:1fr 1fr;
        height:62px;
        box-shadow:0 -4px 18px rgba(0,0,0,.15);
    }

    .mobile-actions a{
        display:flex;
        align-items:center;
        justify-content:center;
        text-decoration:none;
        font-weight:800;
        background:#fff;
        color:#111;
    }

    .mobile-actions a:last-child{
        background:var(--accent);
        color:#fff;
    }
}


@media(max-width:560px){

    .container{
        width:calc(100% - 28px);
    }

    .header-inner{
        width:calc(100% - 24px);
    }

    .hero-image{
        height:245px;
    }

    .hero-content{
        width:calc(100% - 28px);
        padding:34px 0 40px;
    }

    h1{
        font-size:2.7rem;
        line-height:1;
    }

    h2{
        font-size:2.35rem;
    }

    .hero-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .btn{
        width:100%;
    }

    .services-grid{
        grid-template-columns:1fr;
    }

    .service-card > span{
        margin-bottom:32px;
    }

    .process-grid img{
        height:315px;
    }

    .feature-image img{
        height:420px;
    }

    .feature-copy{
        padding:58px 18px;
    }

    .result-image img{
        aspect-ratio:1/1;
    }

    .workshop-images{
        grid-template-columns:1fr;
    }

    .workshop-images img,
    .workshop-images img:last-child{
        height:310px;
        margin-top:0;
    }

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

    .footer-grid > div:first-child{
        grid-column:auto;
    }

    .footer-bottom{
        flex-direction:column;
        gap:6px;
    }
}


/* ==========================================================
   SEGUNDA PASADA PINTAR COCHE MOSTOLES
   ========================================================== */


/* HERO algo más compacto en escritorio */
@media(min-width:851px){
    .hero{
        min-height:660px;
    }

    .hero-content{
        padding-top:85px;
        padding-bottom:75px;
    }
}


/* ==========================================================
   BLOQUE SEO
   ========================================================== */

.paint-seo{
    padding:105px 0;
    background:#fff;
    border-top:1px solid var(--line);
}

.paint-seo-grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:90px;
    align-items:start;
}

.paint-seo-copy{
    max-width:720px;
}

.paint-seo-copy p{
    margin:0 0 22px;
    color:#555;
    font-size:1.06rem;
    line-height:1.72;
}

.paint-seo-tags{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:30px;
}

.paint-seo-tags span{
    border:1px solid var(--line);
    padding:9px 13px;
    font-size:.78rem;
    font-weight:700;
}


/* ==========================================================
   TALLER - composición fotográfica nueva
   ========================================================== */

@media(min-width:851px){

    .workshop-images{
        position:relative;
        display:block;
        min-height:610px;
    }

    .workshop-images img:first-child{
        width:82%;
        height:560px;
        object-fit:cover;
    }

    .workshop-images img:last-child{
        position:absolute;
        width:47%;
        height:285px;
        right:0;
        bottom:0;
        margin:0;
        object-fit:cover;
        border:12px solid #fff;
        box-shadow:0 18px 45px rgba(0,0,0,.13);
    }
}


/* ==========================================================
   RESEÑAS
   ========================================================== */

.paint-reviews{
    padding:105px 0 90px;
    background:#181818;
    color:#fff;
}

.paint-reviews-layout{
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:70px;
    align-items:start;
}

.paint-reviews h2{
    color:#fff;
}

.paint-reviews .section-label{
    color:#d77b74;
}

.paint-reviews-intro > p:not(.section-label){
    color:#bdbdbd;
    max-width:430px;
}

.paint-google-score{
    display:flex;
    gap:15px;
    align-items:center;
    margin-top:32px;
}

.paint-google-g{
    width:52px;
    height:52px;
    border-radius:50%;
    background:#fff;
    color:#4285f4;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.5rem;
    font-weight:900;
}

.paint-rating-line{
    display:flex;
    gap:11px;
    align-items:center;
}

.paint-rating-line strong{
    font-size:2.3rem;
    line-height:1;
}

.paint-rating-line span{
    color:#f4b400;
    letter-spacing:2px;
}

.paint-google-score small{
    color:#aaa;
}

.paint-reviews-all{
    display:inline-block;
    margin-top:25px;
    color:#fff;
    font-weight:800;
    text-decoration:none;
    border-bottom:1px solid var(--accent);
}

.paint-reviews .google-reviews-summary{
    display:none;
}

.paint-reviews .reviews-carousel{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 18px)/2);
    gap:18px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    scrollbar-width:none;
    padding:0 1px 10px;
}

.paint-reviews .reviews-carousel::-webkit-scrollbar{
    display:none;
}

.paint-reviews .google-review-card{
    background:#242424;
    border:1px solid #353535;
    border-radius:0;
    padding:26px;
    min-height:350px;
    display:flex;
    flex-direction:column;
    scroll-snap-align:start;
}

.paint-reviews .review-author{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:17px;
}

.paint-reviews .review-author img{
    width:44px;
    height:44px;
    border-radius:50%;
    object-fit:cover;
}

.paint-reviews .review-author-name{
    color:#fff;
    font-weight:800;
    font-size:.92rem;
}

.paint-reviews .review-date{
    color:#bdbdbd;
    font-size:.76rem;
    margin-top:3px;
}

.paint-reviews .review-stars{
    color:#f4b400;
    letter-spacing:2px;
    margin-bottom:15px;
}

.paint-reviews .review-text{
    color:#d5d5d5;
    line-height:1.62;
    font-size:.9rem;
    margin:0 0 20px;
    flex-grow:1;
}

.paint-reviews .review-google-link{
    color:#fff;
    font-size:.8rem;
    font-weight:800;
    text-decoration:none;
    border-bottom:1px solid var(--accent);
    align-self:flex-start;
}

.paint-reviews .reviews-controls{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:14px;
}

.paint-reviews .reviews-arrow{
    width:42px;
    height:42px;
    border:1px solid #4a4a4a;
    background:#242424;
    color:#fff;
    cursor:pointer;
    font-size:1.3rem;
}

.paint-reviews .reviews-arrow:hover{
    background:var(--accent);
    border-color:var(--accent);
}

.paint-reviews .google-attribution{
    display:none;
}

.paint-reviews .google-reviews-error{
    border:1px solid #333;
    color:#fff;
    padding:30px;
}


/* ==========================================================
   FOOTER TOTALMENTE NUEVO
   ========================================================== */

.footer-paint{
    background:#f1ede7;
    color:#242424;
    padding:0;
    border-top:1px solid #d8d2ca;
}

.footer-paint-top{
    min-height:340px;
    display:grid;
    grid-template-columns:1fr .9fr;
    gap:90px;
    align-items:center;
    padding-top:58px;
    padding-bottom:58px;
}

.footer-paint-brand img{
    width:170px;
    height:auto;
    margin-bottom:24px;
}

.footer-eyebrow{
    margin:0 0 10px;
    color:var(--accent);
    font-size:.72rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.16em;
}

.footer-paint h2{
    max-width:600px;
    margin-bottom:18px;
    color:#171717;
}

.footer-paint-brand > p:last-child{
    max-width:520px;
    color:#666;
}

.footer-paint-contact{
    padding-left:55px;
    border-left:1px solid #d1cbc3;
}

.footer-phone{
    display:block;
    color:#171717;
    text-decoration:none;
    font-size:clamp(2.8rem,4.5vw,4.8rem);
    font-weight:900;
    line-height:1;
    letter-spacing:-.055em;
}

.footer-whatsapp{
    display:inline-block;
    margin-top:22px;
    color:var(--accent);
    font-weight:800;
    text-decoration:none;
}

.footer-paint-bar{
    background:#fff;
    border-top:1px solid #d8d2ca;
    border-bottom:1px solid #d8d2ca;
}

.footer-paint-bar-grid{
    min-height:95px;
    display:grid;
    grid-template-columns:1fr .8fr 1.15fr;
    gap:40px;
    align-items:center;
}

.footer-paint-bar-grid > div:not(.footer-paint-links){
    display:grid;
    gap:3px;
}

.footer-paint-bar-grid strong{
    font-size:.74rem;
    text-transform:uppercase;
    letter-spacing:.09em;
}

.footer-paint-bar-grid span{
    color:#666;
    font-size:.88rem;
}

.footer-paint-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px 20px;
    justify-content:flex-end;
}

.footer-paint-links a{
    color:#333;
    text-decoration:none;
    font-size:.84rem;
}

.footer-paint-bottom{
    padding:22px 0 26px;
    color:#777;
    font-size:.8rem;
}


/* ==========================================================
   RESPONSIVE NUEVOS BLOQUES
   ========================================================== */

@media(max-width:850px){

    .paint-seo-grid,
    .paint-reviews-layout,
    .footer-paint-top,
    .footer-paint-bar-grid{
        grid-template-columns:1fr;
    }

    .paint-seo-grid{
        gap:28px;
    }

    .paint-reviews-layout{
        gap:42px;
    }

    .paint-reviews .reviews-carousel{
        grid-auto-columns:82%;
    }

    .footer-paint-top{
        gap:40px;
    }

    .footer-paint-contact{
        padding-left:0;
        padding-top:35px;
        border-left:0;
        border-top:1px solid #d1cbc3;
    }

    .footer-paint-bar-grid{
        gap:22px;
        padding-top:28px;
        padding-bottom:28px;
    }

    .footer-paint-links{
        justify-content:flex-start;
    }
}


@media(max-width:560px){

    .paint-seo,
    .paint-reviews{
        padding:68px 0;
    }

    .paint-reviews .reviews-carousel{
        grid-auto-columns:92%;
    }

    .paint-reviews .google-review-card{
        min-height:0;
        padding:21px;
    }

    .footer-paint-top{
        min-height:0;
        padding-top:45px;
        padding-bottom:45px;
    }

    .footer-paint-brand img{
        width:135px;
    }

    .footer-phone{
        font-size:2.65rem;
    }
}


/* ==================================================
   TRABAJO PROFESIONAL - FORMATO HORIZONTAL EQUILIBRADO
   ================================================== */

@media (min-width: 901px) {

  .feature {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: clamp(55px, 6vw, 100px);

    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;

    padding: 80px 60px;
  }

  .feature-image {
    width: 100%;
    height: 500px;
    overflow: hidden;
  }

  .feature-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .feature-copy {
    padding: 0;
    max-width: 610px;
  }

}

/* Tablet y móvil */
@media (max-width: 900px) {

  .feature {
    display: block;
  }

  .feature-image {
    width: 100%;
    height: auto;
  }

  .feature-image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
  }

}

/* ==================================================
   OPINIONES - AJUSTE VISUAL DESTACADO
   ================================================== */

.paint-reviews-intro{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

.paint-reviews-intro .section-label{
    margin-bottom:28px;
}

.paint-google-score{
    display:block;
    margin:0 0 30px;
}

.paint-google-g{
    display:none;
}

.paint-rating-line{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
}

.paint-rating-line strong{
    font-size:clamp(72px,7vw,120px);
    line-height:.9;
    letter-spacing:-4px;
    color:#fff;
}

.paint-rating-line span{
    font-size:34px;
    line-height:1;
    letter-spacing:3px;
    color:#f4b400;
}

.paint-google-score small{
    display:block;
    margin-top:20px;
    font-size:20px;
    color:#ddd;
}

.paint-reviews-all{
    display:inline-block;
    width:max-content;
    margin-top:16px;
    padding:18px 24px;
    background:#c92525;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    border-bottom:0;
}

.paint-reviews-all:hover{
    background:#a91f1f;
}

@media(max-width:900px){

    .paint-rating-line strong{
        font-size:72px;
    }

    .paint-rating-line span{
        font-size:28px;
    }

    .paint-google-score small{
        font-size:18px;
    }
}


/* ==================================================
   MOVIL - ORDEN DE BLOQUES
   ================================================== */

@media (max-width: 900px) {

  /* TRABAJO PROFESIONAL:
     texto primero, imagen después */
  .feature {
    display: flex;
    flex-direction: column;
  }

  .feature-copy {
    order: 1;
  }

  .feature-image {
    order: 2;
  }

  /* NUESTRO TALLER:
     texto primero, imagen después */
  .workshop-grid {
    display: flex;
    flex-direction: column;
  }

  .workshop-copy {
    order: 1;
  }

  .workshop-images {
    order: 2;
  }

  /* En móvil dejamos solo la fachada */
  .workshop-images img:first-child {
    display: none;
  }

  .workshop-images img:last-child {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    object-fit: cover;
  }

}


/* ==================================================
   MOVIL - CABECERA Y TRABAJO PROFESIONAL
   ================================================== */

@media (max-width: 900px) {

  /* Cabecera: logo + teléfono */
  .site-header .header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
  }

  .site-header .brand{
    flex:0 0 auto;
  }

  .site-header .header-phone{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:auto;
    padding:10px 12px;
    font-size:15px;
    line-height:1;
    white-space:nowrap;
  }

  /* Ocultamos navegación de escritorio si todavía ocupa espacio */
  .site-header .desktop-nav{
    display:none;
  }

  /* Trabajo profesional:
     imagen integrada dentro del bloque */
  .feature-image{
    width:calc(100% - 32px);
    margin:0 16px 34px;
    overflow:hidden;
  }

  .feature-image img{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:4/3;
    object-fit:cover;
    object-position:center;
  }

}

@media (max-width: 420px){

  .site-header .header-phone{
    font-size:14px;
    padding:9px 10px;
  }

}


/* ==========================================================
   PAGINAS INTERNAS - PINTAR COCHE MOSTOLES
   Contacto + legales
   ========================================================== */

.internal-page{
    background:#f4f1ec;
    color:#171717;
}


/* ----------------------------------------------------------
   CABECERA
   ---------------------------------------------------------- */

.internal-page .site-header{
    position:relative;
    top:auto;
    z-index:20;
    background:#fff;
    border-bottom:1px solid #dedbd6;
}

.internal-page .header-inner{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
    min-height:94px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.internal-page .brand{
    display:flex;
    align-items:center;
    flex:none;
}

.internal-page .brand img{
    display:block;
    width:auto;
    height:52px;
}

.internal-page .nav{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:28px;
}

.internal-page .nav a{
    color:#222;
    text-decoration:none;
    font-size:15px;
    font-weight:700;
}

.internal-page .nav > a:not(.header-phone):hover{
    color:#bd2328;
}

.internal-page .header-phone{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 18px;
    border:1px solid #bd2328;
    color:#bd2328 !important;
    font-size:17px !important;
    font-weight:800 !important;
}


/* ----------------------------------------------------------
   HERO PAGINAS INTERNAS
   ---------------------------------------------------------- */

.internal-page .page-hero{
    padding:95px 0 90px;
    background:#171717;
    color:#fff;
}

.internal-page .page-hero .container{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
}

.internal-page .page-hero .eyebrow{
    margin:0 0 22px;
    color:#d34a4e;
    font-size:13px;
    line-height:1.3;
    font-weight:800;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.internal-page .page-hero h1{
    margin:0;
    max-width:900px;
    color:#fff;
    font-size:clamp(54px, 6vw, 92px);
    line-height:.96;
    letter-spacing:-.045em;
}

.internal-page .page-hero p:not(.eyebrow){
    max-width:820px;
    margin:30px 0 0;
    color:#ddd;
    font-size:19px;
    line-height:1.65;
}


/* ==========================================================
   CONTACTO
   ========================================================== */

.contact-page .contact-content{
    padding:90px 0;
    background:#f4f1ec;
}

.contact-page .contact-content > .container{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
}

.contact-page .contact-grid{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(420px, .78fr);
    gap:90px;
    align-items:start;
}

.contact-page .contact-grid > div:first-child h2{
    margin:0 0 28px;
    max-width:680px;
    font-size:clamp(50px, 5vw, 78px);
    line-height:.98;
    letter-spacing:-.045em;
}

.contact-page .contact-grid > div:first-child > p{
    max-width:680px;
    font-size:18px;
    line-height:1.7;
    color:#4e4b47;
}

.contact-page .actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.contact-page .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:58px;
    padding:0 25px;
    text-decoration:none;
    font-weight:800;
    border-radius:0;
}

.contact-page .btn-dark{
    background:#171717;
    color:#fff;
    border:1px solid #171717;
}

.contact-page .btn-primary{
    background:#c32227;
    color:#fff;
    border:1px solid #c32227;
}

.contact-page .btn-light{
    background:transparent;
    color:#171717;
    border:1px solid #171717;
}

.contact-page .contact-panel{
    background:#fff;
    padding:42px 48px;
}

.contact-page .contact-line{
    padding:22px 0;
    border-top:1px solid #ddd7cf;
}

.contact-page .contact-line:first-child{
    padding-top:0;
    border-top:0;
}

.contact-page .contact-line span{
    display:block;
    margin-bottom:8px;
    color:#77716a;
    font-size:12px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.contact-page .contact-line strong,
.contact-page .contact-line a{
    color:#171717;
    font-size:18px;
    line-height:1.45;
    font-weight:750;
}

.contact-page .contact-line a{
    text-decoration-thickness:1px;
    text-underline-offset:4px;
}


/* ----------------------------------------------------------
   CTA VISITA
   ---------------------------------------------------------- */

.contact-page .contact-visit{
    padding:0;
    background:#171717;
    border-top:4px solid #c32227;
    color:#fff;
}

.contact-page .contact-visit > .container{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
}

.contact-page .contact-visit-box{
    min-height:250px;
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;
    gap:70px;
    padding:55px 0;
}

.contact-page .contact-visit-box .eyebrow{
    margin:0 0 10px;
    color:#d34a4e;
    font-size:12px;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.contact-page .contact-visit-box h2{
    margin:0 0 14px;
    color:#fff;
    font-size:40px;
    line-height:1;
}

.contact-page .contact-visit-box p:not(.eyebrow){
    margin:0;
    max-width:760px;
    color:#d7d7d7;
    font-size:17px;
    line-height:1.6;
}

.contact-page .contact-visit-actions{
    display:flex;
    gap:12px;
}

.contact-page .contact-visit-actions .btn{
    white-space:nowrap;
}

.contact-page .contact-visit-actions .btn-primary{
    background:#c32227;
    border-color:#c32227;
    color:#fff;
}

.contact-page .contact-visit-actions .btn-light{
    color:#fff;
    border-color:#777;
}


/* ==========================================================
   PAGINAS LEGALES
   ========================================================== */

.legal-page .content-page{
    padding:90px 0 110px;
    background:#f4f1ec;
}

.legal-page .content-page > .container{
    width:min(1050px, calc(100% - 48px));
    margin:0 auto;
}

.legal-page .prose{
    max-width:1000px;
}

.legal-page .prose h2{
    margin:60px 0 20px;
    color:#171717;
    font-size:34px;
    line-height:1.1;
    letter-spacing:-.025em;
}

.legal-page .prose h2:first-child{
    margin-top:0;
}

.legal-page .prose h3{
    margin:42px 0 16px;
    font-size:25px;
    line-height:1.2;
}

.legal-page .prose p,
.legal-page .prose li{
    color:#4b4844;
    font-size:17px;
    line-height:1.75;
}

.legal-page .prose p{
    margin:0 0 22px;
}

.legal-page .prose ul,
.legal-page .prose ol{
    padding-left:24px;
    margin:18px 0 28px;
}

.legal-page .prose a{
    color:#a91f23;
    text-underline-offset:3px;
}

.legal-page .prose strong{
    color:#171717;
}


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

.internal-page .site-footer{
    background:#171717;
    border-top:4px solid #c32227;
    color:#fff;
}

.internal-page .site-footer > .container{
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
}

.internal-page .footer-small,
.internal-page .footer-small-final{
    min-height:100px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:28px 0;
    border:0;
    color:#ccc;
    font-size:14px;
}

.internal-page .footer-small nav{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
}

.internal-page .footer-small a{
    color:#fff;
    text-decoration:none;
}

.internal-page .footer-small a:hover{
    text-decoration:underline;
}


/* ==========================================================
   MÓVIL
   ========================================================== */

@media(max-width:900px){

    .internal-page .header-inner{
        width:calc(100% - 28px);
        min-height:78px;
        gap:15px;
    }

    .internal-page .brand img{
        height:43px;
    }

    .internal-page .nav{
        gap:10px;
    }

    .internal-page .nav > a:not(.header-phone){
        display:none;
    }

    .internal-page .header-phone{
        display:inline-flex !important;
        padding:10px 11px;
        font-size:14px !important;
    }

    .internal-page .page-hero{
        padding:62px 0 65px;
    }

    .internal-page .page-hero .container,
    .contact-page .contact-content > .container,
    .contact-page .contact-visit > .container,
    .legal-page .content-page > .container,
    .internal-page .site-footer > .container{
        width:calc(100% - 36px);
    }

    .internal-page .page-hero h1{
        font-size:clamp(43px, 13vw, 64px);
    }

    .internal-page .page-hero p:not(.eyebrow){
        font-size:17px;
    }

    .contact-page .contact-content{
        padding:65px 0;
    }

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

    .contact-page .contact-grid > div:first-child h2{
        font-size:48px;
    }

    .contact-page .contact-panel{
        padding:30px 25px;
    }

    .contact-page .contact-visit-box{
        min-height:0;
        grid-template-columns:1fr;
        gap:30px;
        padding:45px 0 55px;
    }

    .contact-page .contact-visit-actions{
        flex-wrap:wrap;
    }

    .legal-page .content-page{
        padding:65px 0 85px;
    }

    .legal-page .prose h2{
        margin-top:45px;
        font-size:30px;
    }

    .internal-page .footer-small,
    .internal-page .footer-small-final{
        min-height:0;
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
        padding:30px 0 90px;
    }
}

@media(max-width:520px){

    .contact-page .contact-grid > div:first-child h2{
        font-size:42px;
    }

    .contact-page .actions,
    .contact-page .contact-visit-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .contact-page .actions .btn,
    .contact-page .contact-visit-actions .btn{
        width:100%;
    }
}



/* ==========================================================
   LEGALES MÓVIL - MOSTRAR VOLVER AL INICIO
   ========================================================== */

@media(max-width:900px){

    .legal-page .nav > a:not(.header-phone){
        display:inline-flex;
        align-items:center;
        white-space:nowrap;
        font-size:14px;
        font-weight:700;
    }

    .legal-page .nav{
        display:flex;
        margin-left:auto;
    }

}