/* ==================================================
   PROTECCIÓN DE DATOS
   Estilos específicos
================================================== */


/* ==================================================
   INTRODUCCIÓN
================================================== */

.service-intro{

    max-width:1320px;

    margin:0 auto;

    padding:80px 40px 90px;

}


.service-intro-content{

    max-width:1100px;

}


.service-intro .section-label{

    margin-bottom:22px;

}


.service-intro h2{

    max-width:970px;

    margin:0 0 34px;

    color:#17263F;

    font-size:58px;

    line-height:1.08;

    letter-spacing:-2.5px;

}


.service-intro-lead{

    max-width:960px;

    margin-bottom:38px;

    color:#17263F !important;

    font-size:22px !important;

    line-height:1.72 !important;

    font-weight:550;

}


.service-intro-columns{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:64px;

    padding-top:36px;

    border-top:1px solid var(--color-border);

}


.service-intro-columns p{

    margin:0 0 20px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}


/* ==================================================
   ALCANCE DEL SERVICIO
================================================== */

.service-scope{

    padding:95px 40px;

    background:#FAF7F1;

}


.service-scope-header{

    max-width:900px;

    margin:0 auto 64px;

    text-align:center;

}


.service-scope-header .section-label{

    margin-bottom:20px;

}


.service-scope-header h2{

    margin:0 0 24px;

    color:#17263F;

    font-size:56px;

    line-height:1.1;

    letter-spacing:-2px;

}


.service-scope-header p{

    max-width:790px;

    margin:0 auto;

    color:#667085;

    font-size:18px;

    line-height:1.8;

}


.service-scope-grid{

    max-width:1400px;

    margin:0 auto;

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    border-top:1px solid #DDD3C1;

    border-left:1px solid #DDD3C1;

}


.service-scope-item{

    position:relative;

    min-height:285px;

    padding:42px 46px;

    background:rgba(255,255,255,.42);

    border-right:1px solid #DDD3C1;

    border-bottom:1px solid #DDD3C1;

    transition:
        background .3s ease,
        transform .3s ease,
        box-shadow .3s ease;

}


.service-scope-item:hover{

    z-index:2;

    background:#FFFFFF;

    transform:translateY(-4px);

    box-shadow:0 22px 55px rgba(23,38,63,.08);

}


.service-scope-number{

    display:block;

    margin-bottom:22px;

    color:var(--color-primary);

    font-size:12px;

    font-weight:800;

    letter-spacing:2px;

}


.service-scope-item h3{

    max-width:520px;

    margin:0 0 16px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:35px;

    line-height:1.12;

    font-weight:650;

}


.service-scope-item p{

    max-width:540px;

    margin:0;

    color:#667085;

    font-size:16px;

    line-height:1.8;

}


/* ==================================================
   CUMPLIMIENTO DIGITAL
================================================== */

.service-digital{

    padding:95px 40px;

    background:#FFFFFF;

}


.service-digital-header{

    max-width:900px;

    margin:0 auto 70px;

    text-align:center;

}


.service-digital-header .section-label{

    margin-bottom:20px;

}


.service-digital-header h2{

    max-width:850px;

    margin:0 auto 26px;

    color:#17263F;

    font-size:56px;

    line-height:1.1;

    letter-spacing:-2px;

}


.service-digital-header p{

    max-width:780px;

    margin:0 auto;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}


.service-digital-grid{

    max-width:1320px;

    margin:0 auto;

    display:grid;

    grid-template-columns:repeat(4,minmax(0,1fr));

    gap:22px;

}


.service-digital-item{

    min-height:330px;

    padding:38px 30px;

    border:1px solid var(--color-border);

    border-radius:24px;

    background:#FFFFFF;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;

}


.service-digital-item:hover{

    transform:translateY(-6px);

    border-color:rgba(202,157,33,.55);

    box-shadow:0 24px 55px rgba(23,38,63,.07);

}


.service-digital-number{

    display:block;

    margin-bottom:28px;

    color:var(--color-primary);

    font-size:12px;

    font-weight:800;

    letter-spacing:2px;

}


.service-digital-item h3{

    margin:0 0 18px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:34px;

    line-height:1.15;

    font-weight:650;

}


.service-digital-item p{

    margin:0;

    color:#667085;

    font-size:16px;

    line-height:1.8;

}


/* ==================================================
   DESCONEXIÓN DIGITAL
================================================== */

.service-disconnection{

    padding:95px 40px;

    background:#FAF7F1;

}


.service-disconnection-container{

    max-width:1360px;

    margin:0 auto;

    display:grid;

    grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);

    gap:95px;

    align-items:start;

}


.service-disconnection-content .section-label{

    margin-bottom:22px;

}


.service-disconnection-content h2{

    max-width:620px;

    margin:0 0 28px;

    color:#17263F;

    font-size:56px;

    line-height:1.08;

    letter-spacing:-2px;

}


.service-disconnection-content p{

    max-width:590px;

    margin-bottom:20px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}


.service-disconnection-list{

    border-top:1px solid #DDD3C1;

}


.service-disconnection-item{

    display:grid;

    grid-template-columns:48px 1fr;

    gap:22px;

    padding:36px 0;

    border-bottom:1px solid #DDD3C1;

}


.service-disconnection-item > span{

    padding-top:7px;

    color:var(--color-primary);

    font-size:12px;

    font-weight:800;

    letter-spacing:2px;

}


.service-disconnection-item h3{

    margin:0 0 13px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:36px;

    line-height:1.15;

    font-weight:650;

}


.service-disconnection-item p{

    margin:0;

    color:#667085;

    font-size:17px;

    line-height:1.8;

}


/* ==================================================
   ¿POR QUÉ LIRO?
================================================== */

.service-why{

    padding:95px 40px;

    background:#FFFFFF;

}


.service-why-container{

    max-width:1360px;

    margin:0 auto;

    display:grid;

    grid-template-columns:minmax(0,1fr) minmax(0,1fr);

    gap:95px;

    align-items:start;

}


.service-why-left{

    position:sticky;

    top:140px;

}


.service-why-left .section-label{

    margin-bottom:22px;

}


.service-why-left h2{

    max-width:620px;

    margin:0 0 28px;

    color:#17263F;

    font-size:58px;

    line-height:1.07;

    letter-spacing:-2.5px;

}


.service-why-left > p{

    max-width:590px;

    margin-bottom:22px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}


.service-why-highlight{

    margin-top:34px !important;

    padding-left:24px;

    border-left:3px solid var(--color-primary);

    color:#17263F !important;

    font-family:"Cormorant Garamond",serif;

    font-size:26px !important;

    line-height:1.4 !important;

    font-weight:600;

}


.service-why-right{

    border-top:1px solid var(--color-border);

}


.service-value{

    display:grid;

    grid-template-columns:48px 1fr;

    gap:22px;

    padding:39px 0;

    border-bottom:1px solid var(--color-border);

}


.service-value-number{

    padding-top:8px;

    color:var(--color-primary);

    font-size:12px;

    font-weight:800;

    letter-spacing:2px;

}


.service-value h3{

    margin:0 0 14px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:38px;

    line-height:1.12;

    font-weight:650;

}


.service-value p{

    max-width:650px;

    margin:0;

    color:#667085;

    font-size:17px;

    line-height:1.8;

}


/* ==================================================
   DELEGADO DE PROTECCIÓN DE DATOS
================================================== */

.service-dpd{

    padding:95px 40px;

    background:#FFFFFF;

}


.service-dpd-container{

    max-width:1320px;

    margin:0 auto;

    display:grid;

    grid-template-columns:minmax(0,1fr) 430px;

    gap:90px;

    align-items:center;

}


.service-dpd-content .section-label{

    margin-bottom:22px;

}


.service-dpd-content h2{

    max-width:760px;

    margin:0 0 28px;

    color:#17263F;

    font-size:56px;

    line-height:1.08;

    letter-spacing:-2px;

}


.service-dpd-content p{

    max-width:720px;

    margin-bottom:20px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}


.service-dpd-content .btn-principal{

    margin-top:18px;

}


.service-dpd-card{

    padding:45px 38px;

    border:1px solid #E7DEC9;

    border-radius:28px;

    background:#FAF7F1;

    box-shadow:0 24px 65px rgba(23,38,63,.07);

}


.service-dpd-badge{

    display:inline-block;

    margin-bottom:24px;

    padding:8px 14px;

    border-radius:999px;

    background:#FFFFFF;

    color:var(--color-primary);

    font-size:11px;

    font-weight:800;

    letter-spacing:1.5px;

    text-transform:uppercase;

}


.service-dpd-card h3{

    margin:0 0 26px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:37px;

    line-height:1.15;

    font-weight:650;

}


.service-dpd-card ul{

    margin:0;

    padding:0;

    list-style:none;

}


.service-dpd-card li{

    position:relative;

    padding:14px 0 14px 26px;

    border-bottom:1px solid #E1D7C4;

    color:#667085;

    font-size:16px;

    line-height:1.65;

}


.service-dpd-card li:last-child{

    border-bottom:none;

}


.service-dpd-card li::before{

    content:"✓";

    position:absolute;

    left:0;

    color:var(--color-primary);

    font-weight:800;

}


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

.service-faq{

    padding:95px 40px 100px;

    background:#FFFFFF;

}


.service-faq-header{

    max-width:900px;

    margin:0 auto 60px;

    text-align:center;

}


.service-faq-header .section-label{

    margin-bottom:20px;

}


.service-faq-header h2{

    margin:0 0 24px;

    color:#17263F;

    font-size:54px;

    line-height:1.1;

    letter-spacing:-2px;

}


.service-faq-header p{

    max-width:730px;

    margin:0 auto;

    color:#667085;

    font-size:18px;

    line-height:1.8;

}


.faq-list{

    max-width:1180px;

    margin:0 auto;

    border-top:1px solid var(--color-border);

}


.faq-item{

    display:grid;

    grid-template-columns:minmax(330px,.95fr) minmax(0,1.05fr);

    gap:72px;

    padding:38px 0;

    border-bottom:1px solid var(--color-border);

}


.faq-item h3{

    margin:0;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:36px;

    line-height:1.17;

    font-weight:650;

}


.faq-item p{

    margin:0;

    color:#667085;

    font-size:17px;

    line-height:1.8;

}


/* ==================================================
   TABLET
================================================== */

@media(max-width:1100px){

    .service-intro-columns{

        grid-template-columns:1fr;

        gap:6px;

    }


    .service-scope-grid{

        grid-template-columns:1fr;

    }


    .service-digital-grid{

        grid-template-columns:repeat(2,minmax(0,1fr));

    }


    .service-disconnection-container{

        grid-template-columns:1fr;

        gap:55px;

    }


    .service-why-container{

        grid-template-columns:1fr;

        gap:60px;

    }


    .service-why-left{

        position:relative;

        top:auto;

    }


    .service-dpd-container{

        grid-template-columns:1fr;

        gap:55px;

    }


    .service-dpd-card{

        max-width:600px;

    }


    .faq-item{

        grid-template-columns:1fr;

        gap:18px;

    }

}


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

@media(max-width:768px){

    .service-intro{

        padding:75px 24px 85px;

    }


    .service-intro h2{

        font-size:40px;

        letter-spacing:-1.5px;

    }


    .service-intro-lead{

        margin-bottom:32px;

        font-size:19px !important;

    }


    .service-intro-columns{

        padding-top:30px;

    }


    .service-intro-columns p{

        font-size:17px;

    }


    .service-scope{

        padding:85px 24px;

    }


    .service-scope-header{

        margin-bottom:46px;

    }


    .service-scope-header h2{

        font-size:39px;

        letter-spacing:-1.5px;

    }


    .service-scope-header p{

        font-size:17px;

    }


    .service-scope-item{

        min-height:auto;

        padding:36px 26px;

    }


    .service-scope-item h3{

        font-size:31px;

    }


    .service-scope-item p{

        font-size:16px;

    }


    .service-digital{

        padding:85px 24px;

    }


    .service-digital-header{

        margin-bottom:45px;

    }


    .service-digital-header h2{

        font-size:39px;

    }


    .service-digital-grid{

        grid-template-columns:1fr;

    }


    .service-digital-item{

        min-height:auto;

        padding:34px 26px;

    }


    .service-disconnection{

        padding:85px 24px;

    }


    .service-disconnection-content h2{

        font-size:40px;

    }


    .service-disconnection-item{

        grid-template-columns:34px 1fr;

        gap:12px;

        padding:31px 0;

    }


    .service-disconnection-item h3{

        font-size:31px;

    }


    .service-why{

        padding:85px 24px;

    }


    .service-why-container{

        gap:48px;

    }


    .service-why-left h2{

        font-size:40px;

        letter-spacing:-1.5px;

    }


    .service-why-left > p{

        font-size:17px;

    }


    .service-why-highlight{

        font-size:24px !important;

    }


    .service-value{

        grid-template-columns:34px 1fr;

        gap:12px;

        padding:32px 0;

    }


    .service-value h3{

        font-size:32px;

    }


    .service-value p{

        font-size:16px;

    }


    .service-dpd{

        padding:85px 24px;

    }


    .service-dpd-content h2{

        font-size:40px;

    }


    .service-dpd-card{

        padding:36px 26px;

    }


    .service-dpd-card h3{

        font-size:32px;

    }


    .service-faq{

        padding:85px 24px 95px;

    }


    .service-faq-header{

        margin-bottom:45px;

    }


    .service-faq-header h2{

        font-size:39px;

        letter-spacing:-1.5px;

    }


    .service-faq-header p{

        font-size:17px;

    }


    .faq-item{

        padding:31px 0;

    }


    .faq-item h3{

        font-size:30px;

    }


    .faq-item p{

        font-size:16px;

    }

}