/* gestionatuempresa.es — ajustes propios sobre la plantilla Agentix.
Va SIEMPRE el último del : lo que se toca aquí gana, y así no
hay que editar ni un fichero de la plantilla (que se actualiza aparte). */
/* Los titulares gigantes de la plantilla están calibrados para palabras
inglesas cortas ("Features", 8 letras). En español casi todo es más largo
("Servicios", 9) y a 200px se parte en dos líneas dejando una "s" suelta. */
.gte-nowrap{
white-space:nowrap;
font-size:clamp(3.2rem,12vw,11rem)!important;
line-height:.95!important;
}
/* Marcas propias: la plantilla traía logos de empresas reales que no son
clientes nuestros. Se sustituyen por los nombres escritos. */
.gte-marca{
display:inline-flex;align-items:center;justify-content:center;
font-family:inherit;font-weight:600;font-size:clamp(1.05rem,2vw,1.5rem);
letter-spacing:-.02em;white-space:nowrap;
color:#fff;opacity:.62;transition:opacity .3s ease;
padding-inline:.4rem;
}
.gte-marca:hover{opacity:1}
.gte-marca sup{font-size:.55em;opacity:.7;margin-left:.1em;top:-.55em;position:relative}
/* Logotipo: el nombre escrito, en vez de los dos PNG de la plantilla. */
.gte-logo{
display:inline-flex;align-items:baseline;gap:.32em;
font-size:1.35rem;font-weight:700;letter-spacing:-.03em;color:#fff;
line-height:1;white-space:nowrap;
}
.gte-logo i{font-style:normal;font-weight:400;opacity:.62;font-size:.82em}
.gte-logo-negro{color:#0E0F11}
.gte-logo-negro i{opacity:.55}
/* El botón de la cabecera se partía en dos líneas con el texto en español. */
.tp-header-10-btn .tp-btn-black-radius,
.tp-header-10-btn a{white-space:nowrap}
/* ══ PRECIOS ══════════════════════════════════════════════════════════════
Tres planes equivalentes: aquí sí van tres tarjetas iguales, porque son
cosas comparables. Lo que jerarquiza es el destacado, no el tamaño. */
.gte-precios-area{padding:120px 0 110px;position:relative;z-index:2}
.gte-precios-bajada{max-width:52ch;margin:18px auto 0;color:#9aa3ac;font-size:17px;line-height:1.6}
.gte-precios-fila{align-items:stretch}
.gte-precios-fila > [class*="col-"]{display:flex}
.gte-plan{
position:relative;display:flex;flex-direction:column;width:100%;
padding:38px 32px 34px;border-radius:20px;
border:1px solid #23292f;background:#14191d;
transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s;
}
.gte-plan:hover{transform:translateY(-6px);border-color:#3a434b}
.gte-plan-destacado{border-color:#6a5cff;background:#161426;box-shadow:0 30px 70px -40px rgba(106,92,255,.75)}
.gte-plan-eti{
position:absolute;top:-14px;left:32px;
background:#6a5cff;color:#fff;font-size:12px;font-weight:700;
letter-spacing:.08em;text-transform:uppercase;padding:7px 14px;border-radius:999px;
}
.gte-plan h3{font-size:26px;color:#fff;margin:0 0 6px;font-weight:600}
.gte-plan-que{color:#9aa3ac;font-size:15px;margin:0 0 22px}
.gte-plan-precio{
display:flex;align-items:baseline;gap:10px;margin:0 0 24px;
padding-bottom:24px;border-bottom:1px solid #23292f;
}
.gte-plan-precio span{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#7d8790}
.gte-plan-precio strong{
font-size:46px;font-weight:600;color:#fff;line-height:1;
font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.gte-plan-precio i{font-style:normal;font-size:17px;color:#9aa3ac;font-weight:400}
.gte-plan ul{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:12px;flex:1}
.gte-plan li{position:relative;padding-left:28px;color:#b9c1c8;font-size:15.5px;line-height:1.5}
.gte-plan li::before{
content:"";position:absolute;left:0;top:7px;width:11px;height:6px;
border-left:2px solid #6a5cff;border-bottom:2px solid #6a5cff;transform:rotate(-45deg);
}
.gte-plan-destacado li::before{border-color:#a99cff}
.gte-plan-btn{
display:flex;align-items:center;justify-content:center;min-height:50px;
border-radius:999px;border:1px solid #333b42;color:#fff;text-decoration:none;
font-size:15.5px;font-weight:600;transition:background-color .25s,border-color .25s;
}
.gte-plan-btn:hover{background:#20262c;border-color:#4a535b;color:#fff}
.gte-plan-btn-fuerte{background:#6a5cff;border-color:#6a5cff}
.gte-plan-btn-fuerte:hover{background:#5a4cef;border-color:#5a4cef}
.gte-precios-nota{text-align:center;margin-top:30px;color:#7d8790;font-size:14.5px}
/* ══ CONTACTO ═════════════════════════════════════════════════════════════ */
.gte-contacto-area{padding:110px 0;background:#0E0F11;position:relative;z-index:2}
.gte-contacto-fila{align-items:center;row-gap:50px}
.gte-contacto-titulo{font-size:clamp(32px,4vw,52px);line-height:1.08;color:#fff;font-weight:600;margin:14px 0 20px}
.gte-contacto-texto p{color:#9aa3ac;font-size:17px;line-height:1.65;max-width:44ch}
.gte-contacto-texto strong{color:#fff}
.gte-contacto-lista{list-style:none;margin:26px 0;padding:0;display:flex;flex-direction:column;gap:11px}
.gte-contacto-lista li{position:relative;padding-left:28px;color:#b9c1c8;font-size:15.5px}
.gte-contacto-lista li::before{
content:"";position:absolute;left:0;top:7px;width:11px;height:6px;
border-left:2px solid #6a5cff;border-bottom:2px solid #6a5cff;transform:rotate(-45deg);
}
.gte-contacto-mail a{color:#fff;font-size:19px;font-weight:600;text-decoration:none;border-bottom:1px solid #6a5cff;padding-bottom:3px}
.gte-form{background:#14191d;border:1px solid #23292f;border-radius:20px;padding:34px 32px}
.gte-form-rejilla{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:575px){.gte-form-rejilla{grid-template-columns:1fr}}
.gte-form label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:#9aa3ac;margin-bottom:18px}
.gte-form-rejilla label{margin-bottom:0}
.gte-form input[type=text],.gte-form textarea,.gte-form select{
font:inherit;font-size:15.5px;padding:13px 15px;border-radius:11px;
border:1px solid #2a3137;background:#0E1114;color:#fff;width:100%;
transition:border-color .2s;
}
.gte-form input::placeholder,.gte-form textarea::placeholder{color:#5f686f}
.gte-form input:focus,.gte-form textarea:focus,.gte-form select:focus{outline:none;border-color:#6a5cff}
.gte-form textarea{resize:vertical;min-height:110px}
.gte-form-ancho{margin-top:18px}
.gte-form-acepto{flex-direction:row;align-items:flex-start;gap:11px;font-size:14px;line-height:1.5}
.gte-form-acepto input{margin-top:3px;width:17px;height:17px;flex:none;accent-color:#6a5cff}
.gte-form-acepto a{color:#fff;text-decoration:underline}
.gte-trampa{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.gte-form-enviar{
width:100%;min-height:54px;border:none;border-radius:999px;
background:#6a5cff;color:#fff;font:inherit;font-size:16px;font-weight:600;
cursor:pointer;transition:background-color .25s,transform .25s;
}
.gte-form-enviar:hover{background:#5a4cef;transform:translateY(-2px)}
.gte-form-enviar[disabled]{opacity:.6;cursor:default;transform:none}
.gte-form-aviso{margin:16px 0 0;font-size:14.5px;color:#9aa3ac;min-height:1.2em}
.gte-form-aviso.ok{color:#5fd39a}
.gte-form-aviso.mal{color:#ff8a7a}
/* El `.gte-form label` genérico (0,1,1) le ganaba a `.gte-form-acepto` (0,1,0)
y la casilla quedaba ENCIMA del texto en vez de a su lado. */
.gte-form label.gte-form-acepto{flex-direction:row;align-items:flex-start;gap:11px}
/* Logotipo de la casa (PNG con alfa, recortado del original). */
.gte-logo-img{height:46px;width:auto;display:block}
.tp-offcanvas-logo .gte-logo-img{height:42px}
@media (max-width:767px){.gte-logo-img{height:38px}}
/* ══ HERO: la foto, a toda la altura ══════════════════════════════════════
La plantilla la dejaba como un cuadro con aire arriba y abajo. Mantiene su
ancho (media rejilla), pero ahora llega de arriba abajo del hero. */
@media (min-width:1200px){
.it-hero-area .row.align-items-end{align-items:stretch!important}
.it-hero-thumb{
height:100%;margin-bottom:0!important;display:flex;
}
.it-hero-thumb > div{width:100%;height:100%}
.it-hero-thumb img{
width:100%;height:100%;object-fit:cover;object-position:center;
max-width:none;display:block;
}
/* el texto se centra en vez de quedarse pegado abajo */
.it-hero-content{display:flex;flex-direction:column;justify-content:center;height:100%}
}
/* ══ El plan destacado en el verde de la marca, no en el morado que traía ══ */
.gte-plan-destacado{
border-color:#1fae7e!important;
background:#10201b!important;
box-shadow:0 30px 70px -40px rgba(31,174,126,.75)!important;
}
.gte-plan-eti{background:#14a074!important}
.gte-plan li::before{border-color:#1fae7e!important}
.gte-plan-destacado li::before{border-color:#4fe0ae!important}
.gte-plan-btn-fuerte{background:#14a074!important;border-color:#14a074!important}
.gte-plan-btn-fuerte:hover{background:#0f8760!important;border-color:#0f8760!important}
/* el resto de acentos morados de mis secciones, al mismo verde */
.gte-contacto-lista li::before{border-color:#1fae7e}
.gte-contacto-mail a{border-bottom-color:#1fae7e}
.gte-form input:focus,.gte-form textarea:focus,.gte-form select:focus{border-color:#1fae7e}
.gte-form-acepto input{accent-color:#14a074}
.gte-form-enviar{background:#14a074}
.gte-form-enviar:hover{background:#0f8760}
/* ══ Los dos adornos del titular, a tamaño de letra ═══════════════════════
Los PNG nuevos son de más resolución que los de la plantilla y se pintaban
a tamaño natural: el muñeco salía más alto que la propia línea. Se miden en
`em` para que sigan al titular, que es un clamp(). */
.it-hero-title .img-1,
.it-hero-title img.img-1{height:.92em!important;width:auto!important;vertical-align:-.12em}
.it-hero-title .img-2,
.it-hero-title img.img-2{height:.42em!important;width:auto!important;vertical-align:.06em}
.it-hero-title span{display:inline-block;line-height:0}
/* El morado es el acento que traía la plantilla; la marca es verde. */
.btn-blue-bg,.tp-btn-black-radius.btn-blue-bg{background-color:#14a074!important}
.btn-blue-bg:hover{background-color:#0f8760!important}
.btn-blue-bg.btn-border{background-color:transparent!important;border-color:#2c343b!important}
.btn-blue-bg.btn-border:hover{background-color:rgba(20,160,116,.14)!important;border-color:#14a074!important}
/* Red de seguridad: si el preloader vuelve (al actualizar la plantilla), que no
pueda tapar la página. Se quedaba visible con la carga ya terminada. */
#preloader,.preloader{display:none!important;visibility:hidden!important}
/* ══ Marquesina de servicios: las dos franjas, en verde ═══════════════════
Venían en rosa y lila. Una va en verde de marca con la letra clara y la
otra en verde muy pálido con la letra oscura: el contraste entre las dos
es lo que hace que se lean al cruzarse. */
.tp-brand-area .tp-brand-wrapper{background:#0f7f5e!important}
.tp-brand-area .tp-brand-wrapper .tp-brand-title{color:#eafaf3!important}
.tp-brand-area .tp-brand-wrapper .tp-brand-item svg path,
.tp-brand-area .tp-brand-wrapper .tp-brand-item svg *{fill:#eafaf3!important;stroke:#eafaf3!important}
.tp-brand-area .tp-brand-wrapper:nth-of-type(2){background:#d6f5e6!important}
.tp-brand-area .tp-brand-wrapper:nth-of-type(2) .tp-brand-title{color:#0b4a37!important}
.tp-brand-area .tp-brand-wrapper:nth-of-type(2) .tp-brand-item svg path,
.tp-brand-area .tp-brand-wrapper:nth-of-type(2) .tp-brand-item svg *{fill:#0b4a37!important;stroke:#0b4a37!important}
/* ══ Pie: los datos de contacto ═══════════════════════════════════════════ */
.crp-footer-widget-contact .gte-pie-mail{
font-size:16px;margin-top:8px;color:#d9efe6;text-decoration:none;
}
.crp-footer-widget-contact .gte-pie-mail:hover{color:#fff}
/* El CIF heredaba el tamaño de titular de la plantilla y se partía en dos
líneas: es letra pequeña, no un reclamo. */
.gte-pie-fiscal{
margin-top:14px!important;font-size:13.5px!important;line-height:1.5;
color:#9fc7b8!important;font-weight:400!important;letter-spacing:0!important;
}
.crp-footer-widget-info a{line-height:1.6}
/* Con 12 proyectos, la fila de puntos se cruzaba con las dos flechas. Los
puntos bajan a su propia línea y las flechas se quedan centradas. */
.it-project-area .it-project-dots{margin-top:26px}
.it-project-area .it-project-dots .swiper-pagination{
position:static!important;display:flex;flex-wrap:wrap;gap:8px;
justify-content:center;max-width:520px;margin:0 auto;
}
.it-project-area .it-project-arrow{position:relative;z-index:3}
/* Las dos pastillas de cifras venían en lima y lila (paleta de la plantilla).
Van al verde de la marca: una llena y otra en verde muy claro, para que se
distingan entre sí sin salirse de la gama. */
.it-about-counter-item:nth-of-type(1),
.it-about-area [class*="counter"] > *:nth-child(1){background:#14a074!important}
.it-about-counter-item:nth-of-type(1) *{color:#ffffff!important}
.it-about-counter-item:nth-of-type(2),
.it-about-area [class*="counter"] > *:nth-child(2){background:#d6f5e6!important}
.it-about-counter-item:nth-of-type(2) *{color:#0b4a37!important}
/* La primera pastilla no trae data-bg-color (la pinta el CSS de la plantilla en
lima); la segunda sí, y se le cambió el atributo porque el estilo en línea
gana a cualquier hoja. */
.it-about-info-item.gte-cifra-1{background-color:#14a074!important}
.it-about-info-item.gte-cifra-1 i,.it-about-info-item.gte-cifra-1 span,
.it-about-info-item.gte-cifra-1 p{color:#fff!important}
.it-about-info-item[data-bg-color="#D6F5E6"] i,
.it-about-info-item[data-bg-color="#D6F5E6"] span,
.it-about-info-item[data-bg-color="#D6F5E6"] p{color:#0b4a37!important}
/* Logos reales de nuestras marcas. Vienen de webs distintas, así que se igualan
por ALTO (no por ancho) y se les quita el fondo claro con `multiply` sobre la
franja oscura; los que ya traen alfa no se enteran. */
.gte-marca-logo{
height:38px;width:auto;max-width:190px;object-fit:contain;
opacity:.85;transition:opacity .3s ease;
mix-blend-mode:screen;
}
.gte-marca-logo:hover{opacity:1}
.creative-brand-item{display:flex;align-items:center;justify-content:center;min-height:64px}
/* ══ FAQ: la plantilla invierte esa ilustración ═══════════════════════════
`filter: invert(1)` venía para una imagen clara pensada sobre fondo oscuro.
Invertir la nuestra, que es verde, la volvía ROSA — el complementario exacto
del verde. Por eso «se veía bugeada» sin que el fichero tuviera nada malo. */
.app-faq-area img{filter:none!important}
/* ══ Reservar hueco de llamada ════════════════════════════════════════════
Va plegado por defecto: quien sólo quiere escribir no tiene que ver dos
desplegables más. Los huecos los manda el servidor, que es el único que
sabe cuáles siguen libres. */
.gte-cita{margin-top:6px;padding:16px 18px;border:1px solid #23292f;border-radius:14px;background:#11161a}
.gte-form label.gte-cita-quiero{
flex-direction:row;align-items:center;gap:11px;margin:0;cursor:pointer;
font-size:15px;color:#e7eaec;
}
.gte-cita-quiero input{width:17px;height:17px;flex:none;accent-color:#14a074;cursor:pointer}
.gte-cita-campos{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
@media (max-width:575px){.gte-cita-campos{grid-template-columns:1fr}}
.gte-form .gte-cita-campos label{margin-bottom:0}
.gte-cita-nota{grid-column:1/-1;margin:0;font-size:13px;color:#7d8790;line-height:1.5}
.gte-cita-campos select:disabled{opacity:.5;cursor:not-allowed}
/* ══ Banner de consentimiento ═════════════════════════════════════════════
Abajo, sin tapar el contenido, y con los dos botones del mismo peso: un
«Rechazar» escondido o en gris invalida el consentimiento. */
.gte-cookies{
position:fixed;left:0;right:0;bottom:0;z-index:9999;
padding:0 16px 16px;pointer-events:none;
transform:translateY(120%);transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.gte-cookies.dentro{transform:none}
.gte-cookies-caja{
pointer-events:auto;
max-width:760px;margin-inline:auto;
display:flex;flex-wrap:wrap;align-items:center;gap:18px;justify-content:space-between;
background:#14191d;border:1px solid #2b333a;border-radius:16px;
padding:18px 22px;box-shadow:0 24px 60px -24px rgba(0,0,0,.9);
}
.gte-cookies p{margin:0;color:#c3cacf;font-size:14.5px;line-height:1.55;flex:1 1 320px}
.gte-cookies b{color:#fff}
.gte-cookies a{color:#4fe0ae}
.gte-cookies-botones{display:flex;gap:10px;flex:0 0 auto}
.gte-cookies button{
font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;
padding:11px 20px;border-radius:999px;border:1px solid #39434b;
background:transparent;color:#e7eaec;transition:background-color .2s,border-color .2s;
}
.gte-cookies button:hover{border-color:#5a646d;background:rgba(255,255,255,.05)}
.gte-cookies button.si{background:#14a074;border-color:#14a074;color:#fff}
.gte-cookies button.si:hover{background:#0f8760;border-color:#0f8760}
@media (max-width:560px){
.gte-cookies-caja{padding:16px 18px}
.gte-cookies-botones{width:100%}
.gte-cookies button{flex:1}
}
@media (prefers-reduced-motion:reduce){.gte-cookies{transition:none}}
/* ══════════════════════════════════════════════════════════════════════════
MÓVIL. La plantilla está calibrada para escritorio y en 390 px pasaban tres
cosas: los titulares se solapaban con el texto de debajo, los iconos de los
servicios ocupaban media pantalla cada uno (la página llegaba a 18.000 px,
frente a 11.000 en escritorio) y había desbordes de ~19 px.
══════════════════════════════════════════════════════════════════════════ */
@media (max-width:767px){
/* ── 1. Titulares que se pisaban ──────────────────────────────────────
Los `h3`/`h4` de la plantilla llevan line-height muy ceñido pensado para
una sola línea; al partirse en dos, la segunda se montaba sobre el
párrafo. Se les da aire y se impide que recorten. */
[data-lui="linea"] h3,
.it-step-content h3, .it-step-title,
.it-feature-title, .it-project-title,
.gte-plan h3, .it-about-title{
line-height:1.22!important;
overflow:visible!important;
text-wrap:balance;
margin-bottom:.45em!important;
}
.it-step-item, .it-step-content{overflow:visible!important}
/* ── 2. Altura: los iconos de servicios a la mitad ───────────────────── */
.it-feature-icon img{width:96px!important;height:96px!important}
.it-feature-icon{margin-block:14px!important}
.it-feature-item{padding:26px 20px!important}
.it-feature-area .col-xl-4{margin-bottom:14px!important}
/* ── 3. Ritmo vertical: la plantilla usa pt-120/pb-140, que en un móvil
son pantallas enteras de nada ─────────────────────────────────── */
.pt-200,.pt-140,.pt-120{padding-top:56px!important}
.pb-200,.pb-140,.pb-120{padding-bottom:56px!important}
.mb-90,.mb-70{margin-bottom:34px!important}
.it-feature-ptb,.it-about-ptb,.it-testimonial-ptb,.it-project-ptb{
padding-top:56px!important;padding-bottom:56px!important}
.gte-precios-area,.gte-contacto-area{padding:56px 0!important}
/* ── 4. Titulares gigantes: `fs-200` es ilegible a 390 px ────────────── */
.fs-200,.gte-nowrap{font-size:clamp(2.6rem,17vw,4.4rem)!important}
.tp-section-title-platform{font-size:clamp(1.9rem,8.5vw,2.6rem)!important;line-height:1.12!important}
.it-hero-title{font-size:clamp(2.2rem,11vw,3.2rem)!important;line-height:1.08!important}
/* ── 5. Desbordes: nada más ancho que la pantalla ─────────────────────── */
body{overflow-x:hidden}
.container,.container-1630,.container-1460,.container-1350{
padding-inline:18px!important;max-width:100%!important}
img,svg,video{max-width:100%;height:auto}
/* ── 6. Zonas táctiles de 44 px, que es el mínimo usable ─────────────── */
.acciones button,.filtros button,.gte-plan-btn,.tp-btn-black-radius{min-height:46px}
[data-lui="faq"] summary,.accordion-buttons{min-height:52px;padding-block:14px!important}
}
/* El carril de la línea de tiempo salía AMARILLO (color de la plantilla). */
[data-lui="linea"]::after,[data-lui="linea"] .lui-relleno,
.it-step-line span,.it-step-area .it-step-line{background:#14a074!important}
.it-step-area [class*="line"]{--tp-theme-1:#14a074}
/* Los títulos de los pasos son dentro de .accordion-buttons con
font-size 32px y line-height 22.4px: el interlineado es MENOR que la letra,
así que en cuanto el título ocupa dos líneas se solapan. En escritorio no se
veía porque cabían en una. */
.accordion-buttons,
.accordion-buttons span{line-height:1.22!important}
@media (max-width:767px){
.accordion-buttons span{font-size:26px!important;display:inline-block}
.accordion-buttons{padding-right:46px!important} /* sitio para el +/- */
}
/* El carril del paso activo salía amarillo (color de la plantilla). No está en
el DOM: lo pinta un pseudo-elemento, así que se cubren las tres formas en
que puede estar hecho (borde, ::before y ::after). */
.it-step-area .accordion-items,
.it-step-area .accordion-items::before,
.it-step-area .accordion-items::after,
.it-step-area .accordion-item,
.it-step-area .accordion-item::before,
.it-step-area .accordion-item::after{
border-left-color:#14a074!important;
}
.it-step-area .accordion-items::before,
.it-step-area .accordion-items::after,
.it-step-area [class*="line"]::before,
.it-step-area [class*="line"]::after{background-color:#14a074!important}
/* ══ Barra de confianza bajo el hero ══════════════════════════════════════
Quien llega de un anuncio decide en segundos. Los tres quitamiedos que más
frenan —precio, plazo y permanencia— van antes de pedirle que baje. */
.gte-confianza{background:#14a074;padding:18px 0;position:relative;z-index:3}
.gte-confianza ul{
list-style:none;margin:0;padding:0;
display:flex;flex-wrap:wrap;gap:10px 34px;justify-content:center;
}
.gte-confianza li{
position:relative;padding-left:26px;color:rgba(255,255,255,.88);
font-size:15px;line-height:1.45;
}
.gte-confianza li::before{
content:"";position:absolute;left:0;top:7px;width:11px;height:6px;
border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);
}
.gte-confianza b{color:#fff;font-weight:600}
@media (max-width:767px){
.gte-confianza{padding:16px 0}
.gte-confianza ul{gap:9px 20px;justify-content:flex-start}
.gte-confianza li{font-size:14px;flex:1 1 44%}
}
/* el teléfono del hero, clicable y visible */
.gte-tel-hero a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.4)}
.gte-tel-hero a:hover{border-bottom-color:#fff}
/* ══ Iconos de servicios dentro de su círculo ═════════════════════════════
Los objetos 3D ocupaban el 100 % del círculo de fondo, así que lo
desbordaban por los cuatro lados y parecía que el círculo estaba
descolocado. Se centran con flex y se les deja aire. */
.it-feature-icon{
display:flex!important;align-items:center;justify-content:center;
/* con `display:flex` deja de ser inline-block y pierde el centrado que le
daba el `text-center` de la tarjeta: hay que devolvérselo */
margin-inline:auto!important;
line-height:0;
}
.it-feature-icon img{
width:72%!important;height:72%!important;
object-fit:contain;margin:0!important;
}
@media (max-width:767px){
.it-feature-icon img{width:70%!important;height:70%!important}
}