/*


sections.css*/


.services-section { background: #fff; }
.services-icon-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 24px; }
.service-icon-card { text-align: center; padding: 26px 18px 24px; border-radius: 18px; transition: .24s; }
.service-icon-card:hover { background: #f5fbfd; transform: translateY(-5px); }
.service-icon-circle { width: 84px; height: 84px; border: 2px solid #d6eaf1; border-radius: 24px; margin: 0 auto 20px; display: grid; place-items: center; color: var(--gio-primary); font-size: 34px; background: #fff; transition: .2s; }
.service-icon-card:hover .service-icon-circle { background: var(--gio-primary); color: #fff; border-color: var(--gio-primary); transform: rotate(-2deg) scale(1.03); }
.service-icon-card h3 { font-family: 'Montserrat', sans-serif; color: var(--gio-primary-dark); font-size: 20px; line-height: 1.25; margin: 0 0 10px; }
.service-icon-card p { color: var(--gio-muted); font-size: 14px; margin: 0 auto; max-width: 240px; min-height: 67px; }
.service-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 15px; font-size: 12px; font-weight: 800; color: var(--gio-secondary-dark); }
.about-section { background: var(--gio-sky-2); }
.about-grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 70px; align-items: center; }
.about-media { position: relative; min-height: 500px; }
.about-image-wrap { height: 500px; border-radius: 26px 90px 26px 26px; overflow: hidden; background: #fff; box-shadow: var(--gio-shadow); position: relative; }
.about-image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.about-image-accent { position: absolute; inset: auto 0 0; height: 7px; background: linear-gradient(90deg, var(--gio-primary), var(--gio-secondary)); }
.about-mini-card { position: absolute; right: -28px; bottom: 35px; max-width: 290px; padding: 18px; border-radius: 15px; background: #fff; box-shadow: var(--gio-shadow); display: flex; align-items: center; gap: 13px; border: 1px solid var(--gio-border); }
.about-mini-card i { width: 44px; height: 44px; border-radius: 12px; background: #e9f7f6; color: var(--gio-secondary); display: grid; place-items: center; flex: 0 0 auto; }
.about-mini-card strong, .about-mini-card small { display: block; }.about-mini-card strong { font-size: 13px; }.about-mini-card small { font-size: 11px; color: var(--gio-muted); }
.about-copy h2 { font-family: 'Montserrat', sans-serif; font-size: clamp(34px,4vw,49px); line-height: 1.12; letter-spacing: -.04em; margin: 0 0 18px; color: var(--gio-primary-dark); }
.about-copy > p { font-size: 17px; color: var(--gio-muted); }
.about-points { margin-top: 26px; display: grid; gap: 13px; }
.about-points div { display: flex; align-items: flex-start; gap: 10px; color: #415764; font-size: 14px; }
.about-points i { color: var(--gio-secondary); margin-top: 4px; }
.about-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 30px; padding-top: 25px; border-top: 1px solid #d9e7ee; }
.about-stats div { min-width: 0; }.about-stats strong { display: block; font-family: 'Montserrat', sans-serif; color: var(--gio-primary); font-size: 30px; }.about-stats span { color: var(--gio-muted); font-size: 11px; }
.specialties-section { background: #fff; }
.specialties-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.specialty-card { border: 1px solid var(--gio-border); border-radius: 18px; padding: 26px; background: #fff; transition: .22s; }
.specialty-card:hover { border-color: #b7dbe4; box-shadow: var(--gio-shadow-soft); transform: translateY(-4px); }
.specialty-symbol { width: 62px; height: 62px; border-radius: 15px; display: grid; place-items: center; color: var(--gio-primary); background: var(--gio-sky); font-size: 26px; margin-bottom: 19px; }
.specialty-card h3 { font-family: 'Montserrat', sans-serif; font-size: 18px; color: var(--gio-primary-dark); margin: 0 0 9px; }.specialty-card p { min-height: 64px; margin: 0; color: var(--gio-muted); font-size: 13px; }.specialty-card a { display: inline-flex; gap: 7px; align-items: center; margin-top: 14px; color: var(--gio-secondary-dark); font-size: 12px; font-weight: 800; }
.trust-strip-section { padding: 18px 0 78px; background: #fff; }.trust-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; padding: 28px; border-radius: 20px; background: var(--gio-primary); color: #fff; box-shadow: var(--gio-shadow); }.trust-strip article { display: flex; align-items: center; gap: 13px; padding: 8px; }.trust-strip article > span { width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.13); display: grid; place-items: center; color: #b9f2ef; flex: 0 0 auto; }.trust-strip strong,.trust-strip small{display:block}.trust-strip strong{font-size:13px}.trust-strip small{font-size:11px;opacity:.75;margin-top:2px}
.team-section { background: var(--gio-sky-2); }.team-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }.team-card { background: #fff; border-radius: 18px; overflow: hidden; border: 1px solid var(--gio-border); box-shadow: var(--gio-shadow-soft); }.team-photo { height: 280px; background: #eaf2f6; display: grid; place-items: center; overflow: hidden; }.team-photo img { width:100%;height:100%;object-fit:cover; }.team-photo > i { font-size: 80px; color:#91a8b5; }.team-body { padding: 23px; }.team-body > span { font-size: 11px; font-weight: 800; letter-spacing: .1em; color: var(--gio-secondary-dark); }.team-body h3 { font-family:'Montserrat',sans-serif;font-size:21px;margin:7px 0;color:var(--gio-primary-dark); }.team-body p { color:var(--gio-muted);font-size:13px; }.team-body small{display:block;color:#8596a0;margin-top:10px}
.pricing-section { background: #fff; }.pricing-heading-row { display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:34px; }.price-list { border:1px solid var(--gio-border);border-radius:20px;overflow:hidden;background:#fff;box-shadow:var(--gio-shadow-soft); }.price-row { display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:20px 22px;border-bottom:1px solid var(--gio-border); }.price-row:last-child{border-bottom:0}.price-icon{width:46px;height:46px;border-radius:12px;background:#eaf6fb;color:var(--gio-primary);display:grid;place-items:center}.price-main small{font-size:10px;letter-spacing:.08em;color:#8496a1;text-transform:uppercase}.price-main h3{font-family:'Montserrat',sans-serif;font-size:16px;margin:3px 0;color:var(--gio-primary-dark)}.price-main p{margin:0;color:var(--gio-muted);font-size:12px}.price-row>strong{color:var(--gio-primary);font-size:19px;white-space:nowrap}
.gallery-section{background:var(--gio-sky-2)}.gallery-filters{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:28px}.gallery-filters button{border:1px solid var(--gio-border);background:#fff;padding:9px 14px;border-radius:999px;color:#536a76;font-size:12px;font-weight:800;cursor:pointer}.gallery-filters button.active{background:var(--gio-primary);border-color:var(--gio-primary);color:#fff}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.gallery-card{position:relative;height:250px;border:0;border-radius:16px;overflow:hidden;padding:0;background:#dde9ef;cursor:pointer}.gallery-card[hidden]{display:none}.gallery-card img{width:100%;height:100%;object-fit:cover;transition:.3s}.gallery-card:hover img{transform:scale(1.04)}.gallery-card span{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.94);padding:7px 10px;border-radius:8px;font-size:12px;font-weight:800;color:var(--gio-primary)}.gallery-card>i{position:absolute;right:14px;top:14px;width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:rgba(23,76,119,.82);color:#fff}.gallery-modal{position:fixed;inset:0;background:rgba(7,25,37,.86);z-index:100;display:none;align-items:center;justify-content:center;padding:30px}.gallery-modal.is-open{display:flex}.gallery-modal figure{margin:0;max-width:900px;width:100%;}.gallery-modal img{max-height:78vh;margin:auto;border-radius:16px}.gallery-modal figcaption{text-align:center;color:#fff;margin-top:12px;font-weight:700}.gallery-modal-close{position:absolute;right:28px;top:24px;border:0;background:#fff;color:var(--gio-primary);width:44px;height:44px;border-radius:50%;cursor:pointer}
.contact-section{background:linear-gradient(135deg,var(--gio-primary-dark),var(--gio-primary));padding:88px 0;color:#fff}.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}.contact-copy h2{color:#fff}.contact-copy>p{max-width:650px;color:rgba(255,255,255,.75);font-size:16px}.contact-list{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-top:28px}.contact-list>a,.contact-list>div{display:flex;gap:12px;align-items:center;padding:13px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.05)}.contact-list i{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:#b8f0ed}.contact-list small,.contact-list strong{display:block}.contact-list small{font-size:10px;opacity:.7}.contact-list strong{font-size:12px;font-weight:700;word-break:break-word}.contact-card{background:#fff;color:var(--gio-text);border-radius:22px;padding:30px;box-shadow:0 25px 60px rgba(6,31,47,.2)}.contact-card>span{font-size:11px;letter-spacing:.12em;font-weight:800;color:var(--gio-secondary-dark)}.contact-card h3{font-family:'Montserrat',sans-serif;color:var(--gio-primary-dark);font-size:28px;margin:8px 0}.contact-card p{color:var(--gio-muted);font-size:14px}.contact-actions{display:grid;gap:10px;margin-top:22px}.contact-actions .button{width:100%}
.tariff-tools{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px}.search-field{min-height:48px;flex:1;max-width:520px;display:flex;align-items:center;gap:9px;border:1px solid var(--gio-border);border-radius:12px;padding:0 14px;background:#fff}.search-field i{color:#8aa0ad}.search-field input{border:0;outline:0;width:100%;color:var(--gio-text)}.tariff-tools>span{font-size:12px;color:var(--gio-muted)}.tariff-table-wrap{overflow:auto;border:1px solid var(--gio-border);border-radius:16px;background:#fff;box-shadow:var(--gio-shadow-soft)}.tariff-table{width:100%;border-collapse:collapse;min-width:780px}.tariff-table th,.tariff-table td{padding:16px;border-bottom:1px solid var(--gio-border);text-align:left;font-size:13px}.tariff-table th{background:#f2f8fb;color:var(--gio-primary);font-size:11px;letter-spacing:.07em;text-transform:uppercase}.tariff-table td strong,.tariff-table td small{display:block}.tariff-table td small{font-size:11px;color:var(--gio-muted);margin-top:4px}.tariff-price{font-weight:800;color:var(--gio-primary);white-space:nowrap}
.appointment-layout,.portal-login-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:start}.appointment-form,.portal-login-card,.portal-help-card,.appointment-side-card{background:#fff;border:1px solid var(--gio-border);border-radius:20px;padding:30px;box-shadow:var(--gio-shadow-soft)}.form-heading>span{font-size:11px;letter-spacing:.12em;font-weight:800;color:var(--gio-secondary-dark)}.form-heading h2,.portal-login-card h2,.portal-help-card h2,.appointment-side-card h2{font-family:'Montserrat',sans-serif;color:var(--gio-primary-dark);font-size:27px;margin:7px 0 18px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:18px}.form-grid label,.portal-login-card label{display:grid;gap:7px;font-size:12px;font-weight:700;color:#536a76}.form-grid input,.form-grid select,.form-grid textarea,.portal-login-card input{width:100%;border:1px solid var(--gio-border);border-radius:10px;padding:12px 13px;outline:0;background:#fff;color:var(--gio-text)}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.portal-login-card input:focus{border-color:#80c7c4;box-shadow:0 0 0 3px rgba(22,166,161,.1)}.full-span{grid-column:1/-1}.appointment-side-card>a{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;align-items:center;margin-top:22px;padding:14px;border-radius:12px;background:#edf7fb;color:var(--gio-primary)}.appointment-side-card>a i{grid-row:1/3;width:38px;height:38px;border-radius:10px;background:#fff;display:grid;place-items:center}.appointment-side-card>a span{font-size:11px;color:var(--gio-muted)}.portal-login-icon{width:58px;height:58px;border-radius:16px;background:#eaf6fb;color:var(--gio-primary);display:grid;place-items:center;font-size:25px}.portal-login-card form{display:grid;gap:15px;margin-top:22px}.portal-help-card{background:linear-gradient(145deg,var(--gio-primary),var(--gio-primary-dark));color:#fff}.portal-help-card h2{color:#fff}.portal-help-card ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:13px}.portal-help-card li{display:flex;gap:9px;color:rgba(255,255,255,.82);font-size:13px}.portal-help-card li i{color:#9fe7e3;margin-top:4px}
/* ==========================================================
   GIOLABS - PRESENTACIÓN / SOBRE NOSOTROS - MEJORADO
   ========================================================== */

.giolabs-presentation {
    position: relative;
    width: 100%;
    padding: 70px 0;
    background: linear-gradient(135deg, #f8fbfe 0%, #ffffff 40%, #f0f9f8 100%);
    overflow: hidden;
}

/* Fondo decorativo sutil */
.giolabs-presentation::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(23, 76, 119, 0.06), transparent 70%);
    pointer-events: none;
}

.giolabs-presentation::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -15%;
    width: 350px;
    height: 350px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(22, 166, 161, 0.06), transparent 70%);
    pointer-events: none;
}

.giolabs-presentation-content {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    z-index: 2;
}

/* ============ HEADING ============ */
.giolabs-presentation-heading {
    max-width: 850px;
    margin: 0 auto 40px;
    text-align: center;
}

.giolabs-presentation-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 9px 18px;
    border-radius: 50px;
    background: rgba(23, 76, 119, 0.08);
    border: 1px solid rgba(23, 76, 119, 0.15);
    color: #174c77;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

.giolabs-presentation-tag:hover {
    background: rgba(23, 76, 119, 0.12);
    border-color: #16a6a1;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(23, 76, 119, 0.1);
}

.giolabs-presentation h1 {
    margin: 0 0 8px;
    color: #103a5c;
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.giolabs-presentation h2 {
    margin: 0;
    color: #16a6a1;
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(19px, 2.5vw, 26px);
    line-height: 1.3;
    font-weight: 600;
}

/* ============ TEXTO ============ */
.giolabs-presentation-text {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.giolabs-presentation-text p {
    margin: 0 0 16px;
    color: #526270;
    font-size: 16px;
    line-height: 1.75;
}

.giolabs-presentation-text strong {
    color: #174c77;
    font-weight: 700;
}

/* ============ SERVICIOS / VALORES ============ */
.giolabs-presentation-services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 40px;
}

.giolabs-info-item {
    position: relative;
    padding: 24px 22px;
    background: #ffffff;
    border: 1.5px solid rgba(18, 67, 93, 0.1);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(18, 67, 93, 0.06);
    text-align: center;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: default;
    overflow: hidden;
}

/* Línea decorativa superior */
.giolabs-info-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #174c77, #16a6a1);
    transform: scaleX(0);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.giolabs-info-item:hover {
    transform: translateY(-6px);
    border-color: rgba(22, 166, 161, 0.4);
    box-shadow: 0 16px 40px rgba(18, 67, 93, 0.12);
}

.giolabs-info-item:hover::before {
    transform: scaleX(1);
}

/* Icono dentro de cada item */
.giolabs-info-item .info-icono {
    width: 54px;
    height: 54px;
    margin: 0 auto 14px;
    border-radius: 14px;
    background: linear-gradient(135deg, #174c77, #1a5a8a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 22px;
    transition: all 0.35s ease;
}

.giolabs-info-item:hover .info-icono {
    background: linear-gradient(135deg, #16a6a1, #0c827e);
    transform: rotate(-5deg) scale(1.1);
}

.giolabs-info-item h3 {
    margin: 0 0 8px;
    color: #174c77;
    font-family: 'Montserrat', sans-serif;
    font-size: 17px;
    font-weight: 700;
}

.giolabs-info-item p {
    margin: 0;
    color: #687782;
    font-size: 13px;
    line-height: 1.6;
}

/* ============ RESPONSIVE ============ */
@media screen and (max-width: 991px) {
    .giolabs-presentation {
        padding: 55px 25px;
    }
    
    .giolabs-presentation-services {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px;
    }
}

@media screen and (max-width: 767px) {
    .giolabs-presentation {
        padding: 45px 18px;
    }
    
    .giolabs-presentation-heading {
        margin-bottom: 30px;
    }
    
    .giolabs-presentation h1 {
        font-size: 28px;
    }
    
    .giolabs-presentation h2 {
        font-size: 18px;
    }
    
    .giolabs-presentation-text p {
        font-size: 15px;
    }
    
    .giolabs-presentation-services {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 30px;
    }
    
    .giolabs-info-item {
        padding: 20px 18px;
    }
}

@media screen and (max-width: 400px) {
    .giolabs-presentation h1 {
        font-size: 24px;
    }
    
    .giolabs-info-item .info-icono {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
}
/* ==========================================================
   GIOLABS - TARIFARIO MODERNO (Cards)
   ========================================================== */

.tarifario-moderno {
    background: linear-gradient(135deg, #f8fbfe 0%, #ffffff 40%, #f0f9f8 100%);
    position: relative;
}

.tarifario-hero {
    background: linear-gradient(135deg, #eff8fc, #f9fcfe);
    border-bottom: 1px solid var(--gio-border);
}

.tarifario-hero h1 span {
    color: var(--gio-secondary);
}

/* ============ HERRAMIENTAS ============ */
.tariff-tools {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.tariff-count {
    font-size: 12px;
    font-weight: 600;
    color: var(--gio-muted);
    background: rgba(23, 76, 119, 0.06);
    padding: 8px 16px;
    border-radius: 50px;
    border: 1px solid rgba(23, 76, 119, 0.1);
}

/* ============ FILTROS ============ */
.tarifario-moderno-filtros {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 28px;
}

.filtro-btn {
    padding: 9px 18px;
    border: 1.5px solid rgba(23, 76, 119, 0.15);
    background: #fff;
    border-radius: 50px;
    color: #536a76;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.filtro-btn:hover {
    border-color: var(--gio-secondary);
    color: var(--gio-primary);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(23, 76, 119, 0.1);
}

.filtro-btn.active {
    background: linear-gradient(135deg, var(--gio-primary), #1a5a8a);
    border-color: var(--gio-primary);
    color: #fff;
    box-shadow: 0 8px 20px rgba(23, 76, 119, 0.25);
}

/* ============ GRID DE TARJETAS ============ */
.tarifario-moderno-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

/* ============ TARJETA INDIVIDUAL ============ */
.tarjeta-precio {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 22px 20px 18px;
    background: #fff;
    border: 1.5px solid rgba(18, 67, 93, 0.1);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(18, 67, 93, 0.06);
    transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    animation: tarjetaIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: var(--delay, 0s);
    overflow: hidden;
}

@keyframes tarjetaIn {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tarjeta-precio:hover {
    transform: translateY(-6px);
    border-color: rgba(22, 166, 161, 0.4);
    box-shadow: 
        0 18px 40px rgba(18, 67, 93, 0.14),
        0 5px 15px rgba(18, 67, 93, 0.06);
}

/* Línea superior */
.tarjeta-precio::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--gio-primary), var(--gio-secondary));
    transform: scaleX(0);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.tarjeta-precio:hover::before {
    transform: scaleX(1);
}

/* Código */
.tarjeta-precio-codigo {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #94a3b8;
    background: #f8fafc;
    padding: 3px 8px;
    border-radius: 6px;
}

/* Icono */
.tarjeta-precio-icono {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--gio-primary), #1a5a8a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    margin-bottom: 12px;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.tarjeta-precio:hover .tarjeta-precio-icono {
    background: linear-gradient(135deg, var(--gio-secondary), #0c827e);
    transform: rotate(-5deg) scale(1.08);
    box-shadow: 0 8px 20px rgba(22, 166, 161, 0.3);
}

/* Contenido */
.tarjeta-precio-contenido {
    flex: 1;
    margin-bottom: 14px;
}

.tarjeta-precio-contenido h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--gio-primary-dark);
    margin: 0 0 4px;
    line-height: 1.3;
}

.tarjeta-precio-categoria {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--gio-secondary-dark);
    background: rgba(22, 166, 161, 0.1);
    padding: 3px 10px;
    border-radius: 50px;
    margin-bottom: 8px;
}

.tarjeta-precio-contenido p {
    font-size: 12px;
    color: var(--gio-muted);
    line-height: 1.55;
    margin: 0 0 8px;
}

.tarjeta-precio-info {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: #8496a1;
    margin-bottom: 4px;
}

.tarjeta-precio-info i {
    color: var(--gio-secondary);
    font-size: 12px;
}

/* Footer */
.tarjeta-precio-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid rgba(18, 67, 93, 0.08);
}

.tarjeta-precio-monto {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--gio-primary);
}

.tarjeta-precio-boton {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: rgba(23, 76, 119, 0.08);
    border: 1px solid rgba(23, 76, 119, 0.15);
    border-radius: 8px;
    color: var(--gio-primary);
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.tarjeta-precio-boton:hover {
    background: var(--gio-primary);
    border-color: var(--gio-primary);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(23, 76, 119, 0.25);
}

/* ============ MENSAJE VACÍO ============ */
.tarifario-moderno .public-empty {
    text-align: center;
    padding: 40px 20px;
    border: 1px dashed #c9d8e2;
    border-radius: 16px;
    background: #fff;
    color: var(--gio-muted);
    font-size: 14px;
    margin-top: 20px;
}

/* ============ RESPONSIVE ============ */
@media (max-width: 1080px) {
    .tarifario-moderno-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

@media (max-width: 767px) {
    .tarifario-moderno-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .tarifario-moderno-filtros {
        gap: 8px;
    }
    
    .filtro-btn {
        padding: 8px 14px;
        font-size: 11px;
    }
    
    .tarjeta-precio {
        padding: 18px 16px 14px;
    }
    
    .tarjeta-precio-monto {
        font-size: 16px;
    }
}

@media (max-width: 400px) {
    .tarifario-moderno-filtros {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filtro-btn {
        justify-content: center;
    }
    
    .tarjeta-precio-footer {
        flex-direction: column;
        gap: 8px;
    }
    
    .tarjeta-precio-boton {
        width: 100%;
        justify-content: center;
    }
}
/* ==========================================================
   GIOLABS - CUIDADOS MODERNOS
   ========================================================== */

.cuidados-modernos {
    padding: 70px 0;
    background: #ffffff;
}

.cuidados-header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 40px;
}

.cuidados-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: rgba(23, 76, 119, 0.08);
    border: 1px solid rgba(23, 76, 119, 0.15);
    border-radius: 50px;
    color: #174c77;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.15em;
    margin-bottom: 16px;
}

.cuidados-badge i {
    color: #16a6a1;
}

.cuidados-titulo {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(30px, 3.5vw, 42px);
    font-weight: 800;
    color: #103a5c;
    margin: 0 0 12px;
}

.cuidados-titulo span {
    color: #16a6a1;
}

.cuidados-descripcion {
    font-size: 15px;
    color: #6a7b87;
    line-height: 1.6;
    margin: 0;
}

.cuidados-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.cuidado-item {
    position: relative;
    padding: 24px 20px;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: default;
}

.cuidado-item:hover {
    background: #fff;
    border-color: #16a6a1;
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(23, 76, 119, 0.1);
}

.cuidado-icono {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, #174c77, #1a5a8a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    margin-bottom: 14px;
    transition: all 0.3s ease;
}

.cuidado-item:hover .cuidado-icono {
    background: linear-gradient(135deg, #16a6a1, #0c827e);
    transform: rotate(-5deg) scale(1.08);
}

.cuidado-item h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #174c77;
    margin: 0 0 8px;
}

.cuidado-item p {
    font-size: 13px;
    color: #6a7b87;
    line-height: 1.6;
    margin: 0 0 12px;
}

.cuidado-tag {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 50px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.tag-azul {
    background: rgba(23, 76, 119, 0.1);
    color: #174c77;
}

.tag-rojo {
    background: rgba(226, 92, 92, 0.1);
    color: #e25c5c;
}

.tag-ambar {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}

/* ==========================================================
   GIOLABS - ESTADÍSTICAS MODERNAS
   ========================================================== */

.estadisticas-modernas {
    padding: 70px 0;
    background: linear-gradient(135deg, #174c77 0%, #103a5c 50%, #16a6a1 100%);
    position: relative;
    overflow: hidden;
}

.estadisticas-header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 40px;
    position: relative;
    z-index: 2;
}

.estadisticas-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.15em;
    margin-bottom: 16px;
}

.estadisticas-badge i {
    color: #5eead4;
}

.estadisticas-titulo {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(30px, 3.5vw, 42px);
    font-weight: 800;
    color: #fff;
    margin: 0 0 12px;
}

.estadisticas-titulo span {
    color: #5eead4;
}

.estadisticas-descripcion {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.8);
    margin: 0;
}

.estadisticas-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    position: relative;
    z-index: 2;
}

.estadistica-card {
    text-align: center;
    padding: 30px 20px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 18px;
    backdrop-filter: blur(10px);
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.estadistica-card:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
}

.estadistica-icono {
    width: 60px;
    height: 60px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5eead4;
    font-size: 26px;
}

.estadistica-numero {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(30px, 3vw, 40px);
    font-weight: 800;
    color: #fff;
    margin-bottom: 4px;
}

.estadistica-simbolo {
    color: #5eead4;
    font-size: 24px;
    font-weight: 800;
}

.estadistica-etiqueta {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    letter-spacing: 0.05em;
}

/* ==========================================================
   GIOLABS - TESTIMONIOS MODERNOS
   ========================================================== */

.testimonios-modernos {
    padding: 70px 0;
    background: #ffffff;
}

.testimonios-header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 40px;
}

.testimonios-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: rgba(23, 76, 119, 0.08);
    border: 1px solid rgba(23, 76, 119, 0.15);
    border-radius: 50px;
    color: #174c77;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.15em;
    margin-bottom: 16px;
}

.testimonios-badge i {
    color: #16a6a1;
}

.testimonios-titulo {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(30px, 3.5vw, 42px);
    font-weight: 800;
    color: #103a5c;
    margin: 0 0 12px;
}

.testimonios-titulo span {
    color: #16a6a1;
}

.testimonios-descripcion {
    font-size: 15px;
    color: #6a7b87;
    margin: 0;
}

.testimonios-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.testimonio-card {
    padding: 25px 22px;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: default;
}

.testimonio-card:hover {
    background: #fff;
    border-color: #16a6a1;
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(23, 76, 119, 0.1);
}

.testimonio-estrellas {
    display: flex;
    gap: 4px;
    margin-bottom: 14px;
    color: #fbbf24;
    font-size: 14px;
}

.testimonio-texto {
    font-size: 14px;
    color: #526270;
    line-height: 1.7;
    margin: 0 0 18px;
    font-style: italic;
}

.testimonio-autor {
    display: flex;
    align-items: center;
    gap: 12px;
}

.testimonio-avatar {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: linear-gradient(135deg, #174c77, #16a6a1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    flex-shrink: 0;
}

.testimonio-info strong {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #174c77;
}

.testimonio-info span {
    font-size: 12px;
    color: #6a7b87;
}

/* ==========================================================
   GIOLABS - BLOG MODERNO
   ========================================================== */

.blog-moderno {
    padding: 70px 0;
    background: linear-gradient(135deg, #f8fbfe 0%, #ffffff 40%, #f0f9f8 100%);
}

.blog-header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 40px;
}

.blog-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: rgba(23, 76, 119, 0.08);
    border: 1px solid rgba(23, 76, 119, 0.15);
    border-radius: 50px;
    color: #174c77;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.15em;
    margin-bottom: 16px;
}

.blog-badge i {
    color: #16a6a1;
}

.blog-titulo {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(30px, 3.5vw, 42px);
    font-weight: 800;
    color: #103a5c;
    margin: 0 0 12px;
}

.blog-titulo span {
    color: #16a6a1;
}

.blog-descripcion {
    font-size: 15px;
    color: #6a7b87;
    margin: 0;
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.blog-card {
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.blog-card:hover {
    transform: translateY(-6px);
    border-color: #16a6a1;
    box-shadow: 0 18px 40px rgba(23, 76, 119, 0.12);
}

.blog-imagen {
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px;
    color: rgba(255, 255, 255, 0.8);
}

.blog-imagen-1 {
    background: linear-gradient(135deg, #174c77, #1a5a8a);
}

.blog-imagen-2 {
    background: linear-gradient(135deg, #16a6a1, #0c827e);
}

.blog-imagen-3 {
    background: linear-gradient(135deg, #0c827e, #174c77);
}

.blog-contenido {
    padding: 20px;
}

.blog-categoria {
    display: inline-block;
    padding: 4px 12px;
    background: rgba(22, 166, 161, 0.1);
    color: #16a6a1;
    border-radius: 50px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 10px;
}

.blog-contenido h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #174c77;
    margin: 0 0 8px;
    line-height: 1.4;
}

.blog-contenido p {
    font-size: 13px;
    color: #6a7b87;
    line-height: 1.6;
    margin: 0 0 14px;
}

.blog-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #174c77;
    text-decoration: none;
    transition: all 0.3s ease;
}

.blog-link:hover {
    color: #16a6a1;
    gap: 10px;
}

/* ============ RESPONSIVE PARA LAS 4 SECCIONES ============ */
@media (max-width: 1080px) {
    .cuidados-grid,
    .testimonios-grid,
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .estadisticas-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 620px) {
    .cuidados-grid,
    .testimonios-grid,
    .blog-grid,
    .estadisticas-grid {
        grid-template-columns: 1fr;
    }
    
    .cuidados-modernos,
    .estadisticas-modernas,
    .testimonios-modernos,
    .blog-moderno {
        padding: 50px 0;
    }
    
    .cuidados-titulo,
    .estadisticas-titulo,
    .testimonios-titulo,
    .blog-titulo {
        font-size: 26px;
    }
}