/* ------------------------------------------------------------------------- Orbital Pedro Montt — réplica del sitio Wix clinicadentalpedromontt.cl Paleta y tipografías medidas sobre el sitio original: lima separadores #ADC743 oliva cajas/botón #899C40 (el original la pinta al 90% de opacidad) azul cajas #183981 azul botón agenda #060552 azul botón enviar #1D67CD texto #2F2E2E Tipografías del original: Avenir LT Light y Questrial (topbar y footer). Avenir es de pago; Jost es el sustituto geométrico más cercano en Google Fonts. Questrial sí es la original. ------------------------------------------------------------------------- */ :root { --pm-lima: #adc743; --pm-oliva: #899c40; --pm-oliva-oscuro: #5d6b2f; --pm-azul: #183981; --pm-azul-noche: #060552; --pm-azul-boton: #1d67cd; --pm-tinta: #2f2e2e; --pm-gris: #6f6f6f; --pm-blanco: #fff; --pm-shell: 1020px; --pm-sans: "Jost", "Avenir Next", Avenir, "Segoe UI", sans-serif; --pm-questrial: "Questrial", "Jost", sans-serif; } html { scroll-behavior: smooth; } body.orbital-pm-site { margin: 0; background: var(--pm-blanco); color: var(--pm-tinta); font-family: var(--pm-sans); font-size: 16px; font-weight: 300; line-height: 1.65; -webkit-font-smoothing: antialiased; } body.orbital-pm-site * { box-sizing: border-box; } /* Orbital inyecta en el un `a { color: #2196f3 }` desde su customizer, así que el reset necesita al menos una clase para ganarle. Se queda en (0,1,1) — el mismo peso que las reglas de enlace del tema — y como éstas van más abajo en el archivo, mandan ellas. */ .orbital-pm-site a { color: inherit; text-decoration: none; } /* Orbital elimina el outline de todos los controles. Se restituye un anillo doble: azul sobre fondos claros y con borde blanco cuando el control vive dentro de las cajas azules/verdes. Sólo aparece al navegar con teclado. */ body.orbital-pm-site :where(a, button, input, textarea, select, [tabindex]):focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px var(--pm-azul-boton); } :where(body.orbital-pm-site) :where(img) { display: block; max-width: 100%; height: auto; } .pm-shell { width: min(var(--pm-shell), calc(100% - 40px)); margin: 0 auto; } .pm-skip-link { position: absolute; left: -9999px; } /* Visible solo para lectores de pantalla y buscadores. Se recorta en vez de usar display:none para que siga anunciándose. */ .pm-solo-lectores { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; } .pm-skip-link:focus { left: 12px; top: 12px; z-index: 1000; background: var(--pm-azul); color: #fff; padding: 10px 16px; } /* ============================== CABECERA ============================== */ .pm-header { background: var(--pm-blanco); border-bottom: 5px solid var(--pm-lima); padding-top: 18px; } .pm-header__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 40px; align-items: center; } .pm-brand img { width: 494px; max-width: 100%; height: auto; } .pm-header__side { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; } .pm-header__social { display: flex; gap: 14px; align-self: flex-end; } .pm-header__social img { width: 50px; height: 50px; } .pm-header__dato { display: flex; align-items: center; gap: 14px; font-family: var(--pm-questrial); font-size: 23px; color: var(--pm-tinta); } .pm-header__dato img { width: 42px; height: 40px; object-fit: contain; } .pm-nav { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 14px 0 10px; } .pm-nav a { font-weight: 600; font-size: 16.5px; color: var(--pm-tinta); padding: 4px 22px; } .pm-nav a:hover { color: var(--pm-oliva); } .pm-nav .pm-nav__activo > a, .pm-nav a[aria-current="page"], .pm-nav .current-menu-item > a, .pm-nav .current_page_item > a { color: var(--pm-oliva); } /* Submenú (Convenios > Convenio Caja los Andes) */ .pm-nav ul, .pm-nav li { margin: 0; padding: 0; list-style: none; } .pm-nav > ul { display: flex; flex-wrap: wrap; gap: 4px 12px; } .pm-nav li { position: relative; } .pm-nav li ul { display: none; position: absolute; top: 100%; left: 12px; z-index: 60; min-width: 240px; background: var(--pm-blanco); border: 1px solid #e4e4e4; box-shadow: 0 14px 34px rgba(0, 0, 0, .12); padding: 6px 0; } .pm-nav li:hover > ul, .pm-nav li:focus-within > ul { display: block; } .pm-nav li ul a { display: block; padding: 8px 18px; font-weight: 400; } .pm-menu-toggle { display: none; } /* ============================== FONDO PATRÓN ============================== */ .pm-main { position: relative; padding: 46px 0 60px; } /* El patrón va en un pseudo-elemento y no como fondo directo. En la captura Wix a 1440 px, el recurso cuadrado se muestra estirado a 1440 x 1080 y su trazo opaco #49CB00 termina cerca de #D1F1BD sobre blanco (~26%). */ .pm-main::before { content: ""; position: absolute; inset: 0; z-index: 0; background-image: url("../images/patron-dental-fondo.png"); background-size: 1440px 1080px; background-repeat: repeat; opacity: .26; pointer-events: none; } .pm-main > * { position: relative; z-index: 1; } /* Página sin patrón (urgencia usa fondo propio) */ .pm-main--plano { background: #fff; padding: 0; } .pm-main--plano::before { display: none; } /* ============================== SECCIONES ============================== */ .pm-separador { border: 0; border-top: 5px solid var(--pm-lima); margin: 46px 0; } /* Caja de título (azul o verde según página) */ .pm-titulo { display: inline-block; background: var(--pm-azul); color: #fff; font-family: var(--pm-sans); font-size: 38px; font-weight: 700; font-style: italic; line-height: 1.2; padding: 14px 46px; margin: 0 0 34px; } .pm-titulo--verde { background: rgba(137, 156, 64, .91); } .pm-titulo--centrado { display: block; width: fit-content; margin-left: auto; margin-right: auto; text-align: center; } /* Dos columnas texto + media de las páginas interiores */ .pm-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; } /* Caja de contenido azul (o verde) con texto blanco */ .pm-caja { background: var(--pm-azul); color: #fff; padding: 44px 40px; font-size: 18px; font-weight: 500; line-height: 1.75; } .pm-caja--verde { background: rgba(137, 156, 64, .91); } /* El padre Orbital asigna color negro y Montserrat directamente a headings y strong; sin este reset dejan de heredar el blanco/Jost de la caja. */ .pm-caja :where(h1, h2, h3, h4, h5, h6, strong) { color: inherit; font-family: inherit; } .pm-caja p { margin: 0 0 26px; text-align: justify; } .pm-caja p:last-child { margin-bottom: 0; } /* Los enlaces dentro de la caja van subrayados como en el original, pero un botón que vive dentro de la caja no. */ .pm-caja a:not(.pm-boton) { text-decoration: underline; } /* Lista con flechas blancas (chevrons del original) */ .pm-flechas { margin: 0; padding: 0; list-style: none; } .pm-flechas li { position: relative; padding-left: 44px; margin-bottom: 30px; } .pm-flechas li:last-child { margin-bottom: 0; } .pm-flechas li::before { content: ""; position: absolute; left: 4px; top: .32em; width: 14px; height: 14px; border-top: 4px solid #fff; border-right: 4px solid #fff; transform: rotate(45deg); } /* Lista de checks verdes (urgencia) */ .pm-checks { margin: 0; padding: 0; list-style: none; } .pm-checks li { position: relative; padding-left: 46px; margin-bottom: 26px; font-size: 15px; color: #4a4a4a; } .pm-checks li::before { content: ""; position: absolute; left: 2px; top: .1em; width: 16px; height: 9px; border-left: 4px solid #2e7d5b; border-bottom: 4px solid #2e7d5b; transform: rotate(-45deg); } /* ============================== BOTONES ============================== */ .pm-boton { display: inline-block; font-family: var(--pm-sans); font-weight: 500; text-align: center; cursor: pointer; border: 0; } .orbital-pm-site a.pm-boton--whatsapp { background: var(--pm-oliva-oscuro); color: #fff; font-size: 19px; font-weight: 600; padding: 16px 34px; border: 1px solid rgba(255, 255, 255, .55); border-radius: 6px; } .orbital-pm-site a.pm-boton--whatsapp:hover { background: #4d5927; color: #fff; } .pm-boton--claro { background: rgba(255, 255, 255, .87); color: var(--pm-tinta); border: 1px solid #9b1c1c; border-radius: 22px; font-size: 15px; padding: 10px 24px; } /* CTAs flotantes a la derecha, presentes en todo el sitio */ .pm-flotantes a { position: fixed; right: 0; z-index: 400; color: #fff; font-weight: 600; } .pm-flotante-agenda { top: 300px; background: var(--pm-azul-noche); font-size: 17px; padding: 14px 26px; border-radius: 8px 0 0 8px; } .pm-flotante-wsp { top: 448px; display: inline-flex; align-items: center; gap: 12px; background: var(--pm-oliva); font-size: 17px; letter-spacing: 3px; padding: 13px 22px; border-radius: 30px 0 0 30px; } .pm-flotante-wsp img { width: 30px; height: 30px; } .pm-flotante-agenda:hover, .pm-flotante-wsp:hover { filter: brightness(1.12); } /* ============================== PORTADA ============================== */ .pm-hero { position: relative; height: clamp(240px, 30vw, 435px); overflow: hidden; } .pm-hero__pista { position: absolute; inset: 0; } .pm-hero__slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity var(--pm-carrusel-duracion, 1000ms) ease; } .pm-hero__slide.activo { opacity: 1; pointer-events: auto; } .pm-hero__slide > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } .pm-hero__rotulo { position: absolute; top: 34px; left: 0; z-index: 2; max-width: 460px; background: rgba(137, 156, 64, .9); color: #fff; font-size: 33px; font-weight: 700; font-style: italic; line-height: 1.25; padding: 12px 28px; margin: 0; } .pm-hero__flecha { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; background: none; border: 0; color: #fff; font-size: 44px; line-height: 1; cursor: pointer; text-shadow: 0 1px 6px rgba(0, 0, 0, .45); padding: 8px 14px; } .pm-hero__flecha--izq { left: 6px; } .pm-hero__flecha--der { right: 6px; } .pm-hero__puntos { position: absolute; bottom: 14px; left: 50%; z-index: 6; transform: translateX(-50%); display: flex; gap: 10px; } .pm-hero__puntos button { width: 9px; height: 9px; border-radius: 50%; border: 1px solid #fff; background: transparent; padding: 0; cursor: pointer; } .pm-hero__puntos button.activo { background: #fff; } /* Fila de iconos de servicios */ .pm-servicios-fila { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; max-width: 900px; margin: 0 auto; text-align: center; } .pm-servicios-fila .pm-servicio-card { color: var(--pm-azul-noche); font-weight: 600; font-size: 17px; letter-spacing: 2px; } .pm-servicios-fila .pm-servicio-card > a { color: inherit; } .pm-servicios-fila .pm-servicio-card__titulo { display: inline-block; } .pm-servicios-fila .pm-servicio-card__imagen { display: block; width: 133px; margin: 0 auto 18px; } .pm-servicios-fila img { width: 133px; height: 133px; object-fit: contain; margin: 0; } .pm-servicios-fila .subrayado { text-decoration: underline; } /* Convenios en portada */ .pm-convenios { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 44px; align-items: start; } .pm-carrusel { position: relative; width: 100%; max-width: 420px; margin: 0 auto; overflow: hidden; } .pm-carrusel__pista { position: relative; display: flex; overflow: visible; transition: transform var(--pm-carrusel-duracion, 1000ms) ease; will-change: transform; } .pm-carrusel__item { display: block; flex: 0 0 100%; min-width: 0; } .pm-carrusel__pista .pm-carrusel__item > img { display: block; width: 100%; height: auto; } .pm-carrusel:not(.pm-carrusel--pago) .pm-carrusel__item { aspect-ratio: 1 / 1; } .pm-carrusel:not(.pm-carrusel--pago) .pm-carrusel__pista .pm-carrusel__item > img { height: 100%; object-fit: cover; } .pm-carrusel .pm-hero__flecha { color: #444; text-shadow: none; } .pm-carrusel:not(.pm-carrusel--pago) .pm-hero__flecha, .pm-carrusel:not(.pm-carrusel--pago) .pm-carrusel__contador { opacity: 0; transition: opacity .5s ease; } .pm-carrusel:not(.pm-carrusel--pago):hover .pm-hero__flecha, .pm-carrusel:not(.pm-carrusel--pago):hover .pm-carrusel__contador, .pm-carrusel:not(.pm-carrusel--pago):focus-within .pm-hero__flecha, .pm-carrusel:not(.pm-carrusel--pago):focus-within .pm-carrusel__contador { opacity: 1; } .pm-carrusel__contador { position: absolute; right: 0; bottom: 0; z-index: 6; width: 60px; padding: 0 10px 10px 0; background: transparent; color: #222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-align: right; } /* Formas de pago usa el carrusel panorámico de 980 x 435 del Wix, no el carrusel angosto de convenios. Los puntos van sobre la lámina clara. */ .pm-formas-titulo { width: 100%; max-width: 980px; margin: -14px auto 30px; font-family: var(--pm-sans); font-size: 45px; font-weight: 300; line-height: 1.2; color: #555353; } .pm-carrusel--pago { width: 100%; max-width: 980px; } .pm-carrusel--pago .pm-carrusel__pista { display: block; aspect-ratio: 980 / 435; overflow: hidden; transform: none !important; } .pm-carrusel--pago .pm-carrusel__item { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity var(--pm-carrusel-duracion, 1000ms) ease; } .pm-carrusel--pago .pm-carrusel__item.activo { opacity: 1; pointer-events: auto; } .pm-carrusel--pago .pm-carrusel__pista .pm-carrusel__item > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } .pm-carrusel--pago .pm-hero__flecha { color: var(--pm-azul-noche); } .pm-carrusel--pago .pm-hero__flecha--izq { left: 14px; } .pm-carrusel--pago .pm-hero__flecha--der { right: 14px; } .pm-carrusel--pago .pm-hero__puntos { bottom: 16px; z-index: 6; } .pm-carrusel--pago .pm-hero__puntos button { width: 18px; height: 18px; border: 2px solid var(--pm-azul-noche); background: #fff; } .pm-carrusel--pago .pm-hero__puntos button.activo { background: var(--pm-azul-noche); } /* ============================== FORMULARIOS (CF7) ============================== */ .pm-form-intro { color: #4a90d9; font-size: 21px; font-weight: 400; margin: 0 0 26px; } .pm-form label, .pm-form .wpcf7-form-control-wrap { display: block; } .pm-form label { font-size: 14px; font-weight: 500; color: var(--pm-tinta); margin-bottom: 6px; } .pm-form .campo { margin-bottom: 22px; } .pm-form input[type="text"], .pm-form input[type="email"], .pm-form input[type="tel"], .pm-form textarea { width: 100%; background: #e7edf8; border: 1px solid #c3cfe6; border-radius: 4px; font-family: var(--pm-sans); font-size: 16px; color: var(--pm-tinta); padding: 14px 16px; } .pm-form textarea { min-height: 96px; height: 96px; resize: vertical; } .pm-form input:focus, .pm-form textarea:focus { outline: 2px solid var(--pm-azul-boton); outline-offset: 1px; } .pm-form .pm-enviar { background: var(--pm-azul-boton); color: #fff; font-size: 16px; font-weight: 500; border: 0; border-radius: 6px; padding: 12px 34px; cursor: pointer; display: block; margin-left: auto; } .pm-form .pm-enviar:hover { background: #1857ad; } .pm-form .wpcf7-not-valid-tip { font-size: 13px; color: #b3261e; margin-top: 4px; } .pm-form .wpcf7-response-output { margin: 18px 0 0; padding: 10px 14px; border: 1px solid var(--pm-oliva); font-size: 14px; } /* ============================== MAPA ============================== */ .pm-mapa { margin-top: 46px; } .pm-mapa iframe { display: block; width: 100%; height: 420px; border: 0; } .pm-mapa--ubicacion { width: 100%; } .pm-mapa--quienes-somos { margin-top: 26px; } .pm-mapa--quienes-somos iframe { height: 433px; } /* ============================== VIDEO ============================== */ .pm-video { position: relative; width: 100%; aspect-ratio: 16 / 9; } .pm-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } /* ============================== PIE ============================== */ .pm-footer { background: var(--pm-blanco); border-top: 5px solid var(--pm-lima); padding: 40px 0 30px; font-family: var(--pm-questrial); } .pm-footer__titulo { text-align: center; font-family: var(--pm-questrial); font-size: 25px; font-weight: 700; line-height: 1.3; color: #6f6f6f; margin: 0 0 34px; } .pm-footer__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; max-width: 1000px; margin: 0 auto; } .pm-footer__encabezado { font-size: 22px; letter-spacing: 1px; color: var(--pm-tinta); text-align: center; border-bottom: 4px solid var(--pm-lima); padding-bottom: 12px; margin: 0 0 22px; } .pm-footer__accesos .nota h2 { font-size: 13.5px; font-weight: 400; color: #6f6f6f; margin: 10px 0 0; } .pm-footer__col { text-align: center; font-size: 15px; color: #4a4a4a; } .pm-footer__col p { margin: 0 0 14px; } .pm-footer__accesos { text-align: left; margin: 0; padding: 0; list-style: none; } .pm-footer__accesos a { font-weight: 600; color: var(--pm-tinta); } .pm-footer__accesos a::before { content: "›"; color: var(--pm-oliva); font-weight: 700; margin-right: 8px; } .pm-footer__accesos .nota { font-size: 13.5px; color: #6f6f6f; margin-top: 10px; } .pm-footer__social { display: flex; justify-content: center; gap: 16px; margin-bottom: 26px; } .pm-footer__social img { width: 38px; height: 38px; } .pm-footer__logo { margin: 0 auto; width: 237px; } .pm-footer__base { border-bottom: 12px solid var(--pm-lima); margin-top: 34px; } /* ============================== URGENCIA (landing propia) ============================== */ .pm-urgencia { font-family: var(--pm-questrial); } .pm-urgencia__header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 26px 0; } .pm-urgencia__header .datos { display: grid; gap: 12px; font-size: 19px; color: var( --pm-gris, #6f6f6f ); /* antes #8a8a8a (3,45:1 sobre blanco); el gris del tema da 5,0:1 (9-sep-2026) */ } .pm-urgencia__header .datos .fono { font-size: 34px; } .pm-urgencia__header .datos .fono > a, .pm-urgencia__header .datos > div:last-child > span { color: #A2A2A0; } .pm-urgencia__header .datos > div { display: flex; align-items: center; gap: 14px; } .pm-urgencia__header .datos img { width: 44px; height: 44px; object-fit: contain; } .pm-urgencia__hero { background: #f2ece9 url("../images/urgencia-fondo.jpg") right top / cover no-repeat; border-top: 5px solid var(--pm-lima); border-bottom: 5px solid var(--pm-lima); padding: 34px 0 44px; } .pm-urgencia__hero h1 { font-size: 30px; font-weight: 700; margin: 0 0 6px; } .pm-urgencia__hero .lema { font-size: 20px; letter-spacing: 1px; color: #555; text-transform: uppercase; margin: 0 0 24px; } .pm-urgencia__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; } .pm-urgencia__form { background: var(--pm-azul-noche); color: #fff; padding: 34px 30px; } .pm-urgencia__form h2 { color: #fff; font-size: 26px; letter-spacing: 2px; text-align: center; margin: 0 0 24px; } .pm-urgencia__form label { color: #fff; } .pm-urgencia__form input, .pm-urgencia__form textarea { background: #fff; border: 0; } .pm-urgencia__form .privacidad { text-align: center; font-size: 15px; margin-top: 18px; } .pm-urgencia__testimonios { background: #fafafa url('../images/urgencia-testimonios-fondo.jpg') center center / cover no-repeat; border-bottom: 5px solid var(--pm-lima); padding: 44px 0; text-align: center; } .pm-urgencia__testimonios h2 { color: var(--pm-tinta); font-size: 26px; letter-spacing: 2px; margin: 0 0 30px; } .pm-testimonios-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; max-width: 1000px; margin: 0 auto 30px; } .pm-testimonios-grid h3 { font-size: 24px; font-weight: 400; color: #555; margin: 0 0 10px; } .pm-testimonios-grid p { font-size: 14px; color: #4a4a4a; margin: 0; } .pm-urgencia__servicios { padding: 44px 0; text-align: center; } .pm-urgencia__servicios h2 { color: var(--pm-tinta); font-size: 26px; letter-spacing: 2px; margin: 0 0 26px; } .pm-urgencia__video { width: min(480px, 100%); aspect-ratio: 96 / 65; margin: 0 auto 34px; background: #111; } .pm-urgencia__video iframe, .pm-urgencia__mapa iframe { display: block; width: 100%; height: 100%; border: 0; } .pm-urgencia__cta-online { margin: 0 0 19px; } .pm-urgencia__mapa { width: min(980px, 100%); height: 307px; margin: 0 auto; } .pm-urgencia__cta-final { margin: 35px 0 0; } /* ============================== RESPONSIVE ============================== */ @media (max-width: 1100px) { .pm-flotante-agenda { top: auto; bottom: 130px; } .pm-flotante-wsp { top: auto; bottom: 74px; } } @media (max-width: 900px) { .pm-header__inner { grid-template-columns: 1fr; justify-items: center; text-align: center; } .pm-header__side { align-items: center; } .pm-header__social { align-self: center; } .pm-header__dato { font-size: 18px; } .pm-header__dato img { width: 32px; height: 30px; } .pm-menu-toggle { display: inline-flex; align-items: center; gap: 10px; background: none; border: 1px solid #ccc; border-radius: 6px; font: inherit; font-weight: 600; padding: 8px 18px; margin: 10px 0; cursor: pointer; } .pm-nav { display: none; width: 100%; padding-top: 0; } .pm-nav.abierto { display: block; } .pm-nav > ul { flex-direction: column; align-items: center; } .pm-nav li ul { position: static; display: block; border: 0; box-shadow: none; text-align: center; } .pm-cols, .pm-convenios, .pm-urgencia__grid { grid-template-columns: 1fr; } .pm-servicios-fila { grid-template-columns: repeat(2, 1fr); } .pm-testimonios-grid { grid-template-columns: 1fr; } .pm-titulo { font-size: 30px; padding: 12px 26px; } .pm-hero__rotulo { font-size: 22px; max-width: 320px; } .pm-carrusel:not(.pm-carrusel--pago) .pm-hero__flecha, .pm-carrusel:not(.pm-carrusel--pago) .pm-carrusel__contador { opacity: 1; } .pm-footer__cols { grid-template-columns: 1fr; } } @media (max-width: 560px) { .pm-formas-titulo { margin-top: -10px; font-size: 34px; } .pm-servicios-fila { grid-template-columns: 1fr 1fr; gap: 20px; } .pm-servicios-fila img { width: 100px; height: 100px; } .pm-servicios-fila .pm-servicio-card__imagen { width: 100px; } .pm-caja { padding: 30px 22px; } .pm-flotante-agenda, .pm-flotante-wsp { right: 8px; font-size: 11px; line-height: 1.2; padding: 9px 12px; } .pm-flotante-agenda { bottom: 72px; max-width: 158px; border-radius: 7px; } .pm-flotante-wsp { bottom: 16px; gap: 7px; letter-spacing: 1.5px; border-radius: 24px; } .pm-flotante-wsp img { width: 24px; height: 24px; } .pm-carrusel--pago .pm-hero__flecha { font-size: 34px; padding: 6px 8px; } .pm-carrusel--pago .pm-hero__flecha--izq { left: 2px; } .pm-carrusel--pago .pm-hero__flecha--der { right: 2px; } .pm-carrusel--pago .pm-hero__puntos { bottom: 8px; gap: 7px; } .pm-carrusel--pago .pm-hero__puntos button { width: 14px; height: 14px; } } /* ============================== GRILLA DE SERVICIOS ============================== */ /* La página /servicios muestra 14 iconos en filas de 4, con rótulo debajo. */ .pm-servicios-grilla { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 30px; max-width: 900px; margin: 0 auto; text-align: center; } .pm-servicios-grilla > * { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; color: var(--pm-azul-noche); } .pm-servicio-videoconsulta { position: relative; } .pm-servicio-videoconsulta__principal { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; color: inherit; } .pm-servicio-videoconsulta__centro { position: absolute; top: 27px; left: 50%; z-index: 2; width: 78px; height: 78px; transform: translateX(-50%); } .pm-servicios-grilla img { width: 133px; height: 133px; object-fit: contain; margin: 0 auto 16px; } /* En el original cada rótulo de servicio es un H1; se conserva la etiqueta y se le da el tamaño real que tenía en pantalla. */ .pm-servicios-grilla h2 { font-size: 17px; font-weight: 600; line-height: 1.35; margin: 0; } .pm-servicios-grilla .subrayado span { text-decoration: underline; } /* ============================== ARTÍCULOS LARGOS ============================== */ /* Implantes, terceros molares y las páginas legales: bloque de texto a fondo blanco, centrado y justificado, como en el sitio de origen. */ .pm-full-blanco { background: #fff; margin: 46px calc(50% - 50vw) 0; padding: 40px calc(50vw - 50%); } /* En móvil el shell siempre deja 20 px por lado. Usar 100vw aquí incluía el ancho de la barra vertical de Chrome y generaba 8 px de scroll horizontal. */ @media (max-width: 560px) { .pm-full-blanco { margin-right: -20px; margin-left: -20px; padding-right: 20px; padding-left: 20px; } } .pm-articulo { max-width: 780px; margin: 0 auto; font-size: 14px; line-height: 1.75; color: #4a4a4a; text-align: justify; } .pm-articulo h2 { font-size: 15px; font-weight: 700; font-style: italic; color: var(--pm-tinta); text-align: center; margin: 34px 0 16px; } .pm-articulo ul, .pm-articulo ol { margin: 0 0 18px; padding-left: 26px; } .pm-articulo li { margin-bottom: 8px; } /* Título de las páginas de artículo: caja azul, dos líneas, alineado a la izquierda. */ .pm-titulo--articulo { font-size: 27px; padding: 16px 34px; max-width: 620px; } /* ============================== GRACIAS ============================== */ .pm-gracias h1, .pm-gracias h2 { font-size: 21px; font-weight: 600; line-height: 1.4; color: var(--pm-tinta); margin: 0 0 16px; } .pm-gracias img { max-width: 100%; height: auto; } @media (max-width: 900px) { .pm-servicios-grilla { grid-template-columns: repeat(2, 1fr); } .pm-titulo--articulo { font-size: 22px; } } /* ============================== BLOG ============================== */ /* En el original la caja del título del blog sale del contenedor y llega hasta el borde izquierdo de la ventana. */ .pm-titulo--sangra { margin-left: calc(50% - 50vw); padding-left: calc(50vw - 50% + 46px); } .pm-entradas { display: grid; gap: 30px; max-width: 930px; } .pm-entrada { position: relative; display: grid; grid-template-columns: minmax(0, 460px) minmax(0, 1fr); background: #fff; border: 1px solid #e6e6e6; } .pm-entrada__foto img { width: 100%; height: 100%; object-fit: cover; } .pm-entrada__texto { display: flex; flex-direction: column; padding: 34px 30px; } .pm-entrada__titulo { font-family: Georgia, "Times New Roman", serif; font-size: 26px; font-weight: 400; line-height: 1.3; color: var(--pm-tinta); margin: 0 0 16px; } .pm-entrada__extracto { font-size: 16px; line-height: 1.6; color: #4a4a4a; margin: 0; } .pm-entrada__estadisticas { display: flex; gap: 24px; align-items: center; margin-top: auto; padding-top: 18px; border-top: 1px solid #d9d9d9; font-size: 12px; line-height: 1.2; color: #555; } .pm-entrada__estadisticas .pm-like-button { margin-left: auto; } .pm-main .navigation.pagination { margin-top: 34px; } .pm-main .nav-links { display: flex; gap: 10px; justify-content: center; } .pm-main .page-numbers { padding: 6px 14px; border: 1px solid var(--pm-lima); color: var(--pm-tinta); } .pm-main .page-numbers.current { background: var(--pm-oliva); color: #fff; } @media (max-width: 760px) { .pm-entrada { grid-template-columns: 1fr; } .pm-titulo--sangra { padding-left: calc(50vw - 50% + 22px); } .pm-entrada__estadisticas { margin-top: 30px; gap: 14px; } } /* ============================== ENTRADA INDIVIDUAL ============================== */ /* El Wix encierra la lectura en una tarjeta de 940 px: 740 px útiles y unos 90 px de aire por lado. La imagen destacada no se repite en esta plantilla. */ .pm-post { position: relative; width: calc(100% - 40px); max-width: 940px; margin: 96px auto 30px; padding: 62px 90px 50px; background: #fff; border: 1px solid #eee; color: var(--pm-tinta); } .pm-post__cabecera { margin-bottom: 20px; } .pm-post__lectura { margin: 0 0 18px; font-family: var(--pm-sans); font-size: 13px; font-weight: 300; line-height: 1.4; } .pm-post__cabecera h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 40px; font-weight: 400; line-height: 1.2; color: var(--pm-tinta); } .pm-post__contenido { position: relative; font-family: var(--pm-sans); font-size: 18px; font-weight: 300; line-height: 1.5; color: var(--pm-tinta); } .pm-post__contenido p, .pm-post__contenido ol, .pm-post__contenido ul { font-size: inherit; margin: 0 0 24px; } .pm-post__contenido ol, .pm-post__contenido ul { padding-left: 32px; } .pm-post__contenido li { margin-bottom: 20px; } .pm-post__contenido a { color: #92ad28; text-decoration: underline; } .pm-post__contenido img { display: block; width: 100%; height: auto; margin: 0 auto 28px; } .pm-post__contenido img[width="350"] { width: min(350px, 100%); margin-top: 58px; margin-bottom: 58px; } .pm-post__meta { margin-top: 76px; border-top: 1px solid #ddd; font-family: var(--pm-sans); } .pm-post__compartir { display: flex; align-items: center; gap: 26px; min-height: 58px; border-bottom: 1px solid #ddd; } .pm-post__compartir a, .pm-post__compartir button { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 22px; min-height: 22px; padding: 0; border: 0; background: transparent; font-size: 14px; font-weight: 500; line-height: 1; color: var(--pm-tinta); cursor: pointer; } .pm-post__estadisticas { display: flex; align-items: center; gap: 24px; padding-top: 18px; font-size: 12px; font-weight: 300; color: #666; } .pm-post__estadisticas .pm-like-button { margin-left: auto; } .pm-like-button { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; font: inherit; line-height: inherit; color: inherit; cursor: pointer; } .pm-like-button svg { width: 15px; height: 15px; fill: transparent; stroke: #e84a43; stroke-width: 1.8; stroke-linejoin: round; } .pm-like-button[aria-pressed="true"] svg { fill: #e84a43; } .pm-copy-feedback { position: absolute; bottom: calc(100% + 9px); left: 50%; width: max-content; padding: 7px 10px; transform: translateX(-50%); border-radius: 3px; background: #222; color: #fff; font-size: 12px; font-weight: 400; line-height: 1.2; } .pm-copy-feedback[hidden], .pm-comment-editor[hidden], .pm-comment-login[hidden], .pm-comment-placeholder[hidden] { display: none !important; } .pm-post__comentarios { width: calc(100% - 40px); max-width: 940px; margin: 0 auto 96px; padding: 58px 90px 64px; background: #fff; border: 1px solid #eee; font-family: var(--pm-sans); } .pm-post__comentarios h2 { margin: 0 0 28px; padding-bottom: 20px; border-bottom: 1px solid #ddd; font-family: inherit; font-size: 16px; font-weight: 400; line-height: 1.4; color: var(--pm-tinta); } .pm-comment-placeholder, .pm-post__comentarios textarea { display: block; width: 100%; min-height: 58px; padding: 15px 16px; border: 1px solid #ccc; border-radius: 0; background: #fff; font-family: inherit; font-size: 14px; line-height: 1.4; color: var(--pm-tinta); text-align: left; } .pm-comment-placeholder { cursor: text; } .pm-post__comentarios textarea { resize: vertical; } .pm-comment-editor__footer, .pm-comment-form { display: grid; gap: 12px; } .pm-comment-editor__footer { justify-items: end; } .pm-comment-editor__footer > button, .pm-comment-form > button { padding: 9px 22px; border: 0; border-radius: 2px; background: var(--pm-azul-noche); color: #fff; font: inherit; cursor: pointer; } .pm-comment-login { margin: 0; font-size: 13px; } .pm-comment-login a { color: var(--pm-azul-noche); text-decoration: underline; } .pm-comment-list { margin: 0 0 22px; padding: 0; list-style: none; } /* Controles editoriales del blog presentes en Wix. */ .pm-post-actions__toggle, .pm-post-actions__menu button, .pm-post-search button, .pm-post-image-expand, .pm-modal button { appearance: none; border: 0; font: inherit; cursor: pointer; } .pm-post-actions__toggle { position: absolute; z-index: 5; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 2px; background: transparent; color: #222; } .pm-post-actions__toggle svg, .pm-post-actions__menu svg { display: block; width: 19px; height: 19px; fill: currentcolor; } .pm-entrada > .pm-post-actions__toggle { top: 29px; right: 28px; } .pm-post > .pm-post-actions__toggle { top: 60px; right: 99px; } .pm-post-actions__menu { position: absolute; z-index: 20; width: 200px; height: 52px; background: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, .2); } .pm-entrada > .pm-post-actions__menu { top: 56px; right: 28px; } .pm-post > .pm-post-actions__menu { top: 88px; right: 99px; } .pm-post-actions__menu button { display: flex; align-items: center; gap: 13px; width: 100%; height: 100%; padding: 0 17px; background: #fff; color: #222; font-family: Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 400; text-align: left; } .pm-post-actions__menu button:hover { background: #f5f5f5; } .pm-post-search { position: absolute; top: 0; left: calc(50% + 234px); z-index: 10; width: 220px; height: 19px; margin: 0; } .pm-post-search input { position: absolute; box-sizing: border-box; top: 0; left: 20px; width: 200px; height: 17px; min-height: 0; padding: 0 42px 0 0; border: 0; border-bottom: 1px solid #222; border-radius: 0; outline: 0; background: transparent; font: 500 14px/17px Helvetica, Arial, sans-serif; opacity: 0; pointer-events: none; transition: opacity .15s ease; } .pm-post-search input::-webkit-search-cancel-button { display: none; } body.single-post.orbital-pm-site .pm-post-search input[type="search"] { box-sizing: border-box; width: 200px; height: 17px; min-height: 0; padding: 0 42px 0 0; border: 0; border-bottom: 1px solid #222; border-radius: 0; background: transparent; box-shadow: none; } .pm-post-search.abierto input { opacity: 1; pointer-events: auto; } .pm-post-search__toggle { position: absolute; top: 0; left: 201px; display: flex; align-items: flex-start; justify-content: center; width: 19px; height: 19px; padding: 0; background: transparent; color: #222; } .pm-post-search__toggle svg { display: block; width: 19px; height: 19px; fill: currentcolor; } .pm-post-search__clear { position: absolute; top: 1px; left: 185px; z-index: 2; width: 14px; height: 14px; padding: 0; background: transparent; color: #222; font: 400 15px/12px Arial, sans-serif !important; } .pm-post-image-expand { position: absolute; z-index: 4; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 4px; border-radius: 30px; background: #fff; } .pm-post-image-expand svg { display: block; width: 19px; height: 19px; } .pm-post-search-results { width: 940px; min-height: 341px; margin: 100px auto 31px; background: #fff; } .pm-post-search-results__card { display: grid; grid-template-columns: 454px 486px; height: 341px; border: 1px solid #f0f0f0; } .pm-post-search-results__image, .pm-post-search-results__image img { display: block; width: 100%; height: 100%; object-fit: cover; } .pm-post-search-results__card > div { padding: 70px 30px 25px 34px; } .pm-post-search-results__title { margin: 0 0 8px; font-family: Georgia, "Times New Roman", serif; font-size: 28px; font-weight: 400; line-height: 1.3; } .pm-post-search-results__excerpt { font-size: 16px; line-height: 1.6; } .pm-post-search-results mark { background: #fff16a; color: inherit; } html.pm-modal-abierto { overflow: hidden; } .pm-modal { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(0, 0, 0, .62); } .pm-modal__panel { width: min(460px, 100%); padding: 28px; background: #fff; box-shadow: 0 8px 32px rgba(0, 0, 0, .35); } .pm-modal__header { display: flex; align-items: center; justify-content: space-between; gap: 20px; } .pm-modal__header h2 { margin: 0; font-size: 24px; font-weight: 500; } .pm-modal__close { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; background: transparent; color: #222; font: 300 32px/1 Arial, sans-serif !important; } .pm-share-dialog__links { display: flex; gap: 16px; margin-top: 28px; } .pm-share-dialog__links a, .pm-share-dialog__links button { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 1px solid #d3d3d3; border-radius: 50%; background: #fff; color: #222; font: 700 15px/1 Arial, sans-serif; text-decoration: none; } .pm-image-lightbox__panel { position: relative; max-width: min(1100px, 92vw); max-height: 90vh; } .pm-image-lightbox__panel img { display: block; max-width: 100%; max-height: 90vh; object-fit: contain; } .pm-image-lightbox__close { position: absolute; top: 8px; right: 8px; border-radius: 50%; background: #fff; } .pm-post-actions__toggle:focus-visible, .pm-post-actions__menu button:focus-visible, .pm-post-search button:focus-visible, .pm-post-search input:focus-visible, .pm-post-image-expand:focus-visible, .pm-like-button:focus-visible, .pm-copy-link:focus-visible, .pm-comment-placeholder:focus-visible, .pm-comment-editor button:focus-visible, .pm-comment-editor textarea:focus-visible, .pm-modal a:focus-visible, .pm-modal button:focus-visible { outline: 2px solid #060552; outline-offset: 2px; } @media (max-width: 560px) { .pm-post > .pm-post-actions__toggle { top: 30px; right: 20px; } .pm-post > .pm-post-actions__menu { top: 58px; right: 20px; } .pm-post-search { top: 8px; left: auto; right: 12px; } .pm-post-search-results { width: calc(100% - 24px); margin-top: 32px; } .pm-post-search-results__card { grid-template-columns: 1fr; height: auto; } .pm-post-search-results__image { height: 220px; } .pm-post-search-results__card > div { padding: 28px 22px; } .pm-post { width: calc(100% - 24px); margin-top: 32px; padding: 32px 20px 34px; } .pm-post__cabecera h1 { font-size: 30px; } .pm-post__contenido { font-size: 16px; line-height: 1.55; overflow-wrap: anywhere; } .pm-post__contenido ol, .pm-post__contenido ul { padding-left: 22px; } .pm-post__meta { margin-top: 48px; } .pm-post__compartir { gap: 18px; } .pm-post__estadisticas { flex-wrap: wrap; gap: 8px 16px; } .pm-post__estadisticas .pm-like-button { margin-left: 0; } .pm-post__comentarios { width: calc(100% - 24px); margin-bottom: 48px; padding: 32px 20px 38px; } } /* ====================== CALIBRACIÓN WIX DE ESCRITORIO ====================== Medidas tomadas sobre las capturas fuente de 1440 px. Los selectores quedan fuera de los seis documentos legacy y del breakpoint móvil. */ @media (min-width: 901px) { body.orbital-pm-site:not(.pm-legacy-document) .pm-header, body.orbital-pm-site:not(.pm-legacy-document) .pm-footer { border-width: 6px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header { position: sticky; top: 0; z-index: 50; height: 267px; padding-top: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__inner { position: relative; display: block; height: 224px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-brand { position: absolute; top: 46px; left: 13px; width: 494px; height: 150px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__side { position: absolute; inset: 0; display: block; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__social { position: absolute; top: 27px; left: 739px; width: 176px; height: 50px; gap: 13px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__dato { position: absolute; font-size: 23px; line-height: normal; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__dato:nth-of-type(1) { top: 99px; left: 644px; gap: 11px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__dato:nth-of-type(1) img { width: 48px; height: 45px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__dato:nth-of-type(2) { top: 172px; left: 653px; gap: 13px; letter-spacing: .05em; } body.orbital-pm-site:not(.pm-legacy-document) .pm-header__dato:nth-of-type(2) img { width: 37px; height: 34px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-nav { position: relative; left: 6px; width: 966px; height: 20px; padding: 0; margin: 0 0 17px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-nav > ul { width: 870px; height: 20px; margin: 0 auto; flex-wrap: nowrap; gap: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-nav > ul > li { flex: 0 0 145px; width: 145px; height: 20px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-nav > ul > li > a { display: flex; align-items: center; justify-content: center; height: 20px; padding: 0 5px; font-size: 16px; font-weight: 400; line-height: 20px; } body.orbital-pm-site:not(.pm-legacy-document) :is(.pm-header, .pm-main, .pm-footer) > .pm-shell, body.orbital-pm-site:not(.pm-legacy-document) .pm-header > .pm-shell { width: min(980px, calc(100% - 40px)); } body.orbital-pm-site:not(.pm-legacy-document) .pm-main:not(.pm-main--plano) { padding-top: 19px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-main { overflow-x: clip; } /* El fondo Wix es un tile nativo de 1080 px anclado al lienzo de la página, no una imagen deformada a 1440 px. Sólo ocupa el primer viewport de 900 px: como el main empieza en y=267, aquí quedan 633 px visibles. */ body.orbital-pm-site:not(.pm-legacy-document) .pm-main::before { inset: 0 0 auto; height: 633px; background-size: 1080px 1080px; background-position: center -267px; background-repeat: repeat-x; opacity: .26; } body.blog.orbital-pm-site .pm-main::before, body.single-post.orbital-pm-site .pm-main::before { display: none; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-agenda { top: calc(50% - 26px); right: 4px; z-index: 55; display: flex; align-items: center; justify-content: center; width: 267px; height: 56px; padding: 0; border-radius: 20px; background: var(--pm-azul-noche); box-shadow: 0 3px 9px rgba(0, 0, 0, .19); font-size: 18px; font-weight: 400; line-height: 1.4; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-agenda:hover { background: var(--pm-azul); filter: none; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-wsp { top: auto; right: 10px; bottom: 199px; z-index: 56; width: 255px; height: 55px; gap: 6px; padding: 3px; border: 1px solid var(--pm-oliva); border-radius: 50px; background: var(--pm-oliva); font-size: 20px; font-weight: 400; line-height: 1.4; letter-spacing: .25em; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-wsp svg { width: 54px; height: 54px; margin-left: 16px; transition: width .2s ease, height .2s ease; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-wsp:hover { border-width: 0; background: var(--pm-oliva); filter: none; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotante-wsp:hover svg { width: 54px; height: 54px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-titulo { padding-top: 11px; padding-bottom: 11px; margin-bottom: 24px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-caja { padding: 28px; line-height: 1.55; } body.orbital-pm-site:not(.pm-legacy-document) .pm-articulo { max-width: 900px; line-height: 1.6; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer { position: relative; height: 377px; padding: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer > .pm-shell { position: relative; height: 365px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__titulo { position: absolute; top: 24px; left: 304px; width: 372px; height: 34px; margin: 0; font-size: 25px; font-weight: 700; line-height: 34px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__cols { position: absolute; top: 81px; left: 22px; grid-template-columns: repeat(3, 264px); gap: 72px; width: 936px; max-width: none; height: 284px; margin: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col { position: relative; width: 264px; height: 284px; font-size: 15px; line-height: normal; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col:nth-child(3) { transform: translateX(11px); } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__encabezado { position: absolute; top: 0; left: 0; width: 264px; height: 46px; padding: 0 0 4px; margin: 0; border-bottom-width: 6px; font-size: 25px; font-weight: 700; line-height: 35px; letter-spacing: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__accesos { position: absolute; top: 65px; left: 0; width: 301px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__accesos > li:first-child { height: 34px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__accesos > li:first-child > a { font-size: 19px; font-weight: 400; line-height: 34px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__accesos .nota { width: 301px; margin: 14px 0 0 13px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__accesos .nota h2 { margin: 0; font-size: 15px; font-weight: 700; line-height: 21px; white-space: nowrap; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col:nth-child(2) > p:nth-child(2) { position: absolute; top: 65px; left: 0; width: 264px; margin: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col:nth-child(2) > p:nth-child(2) a:first-child { display: block; font-size: 20px; line-height: 28px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col:nth-child(2) > p:nth-child(2) a:last-child { display: block; margin-top: 5px; font-size: 15px; line-height: 21px; white-space: nowrap; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__col:nth-child(2) > p:nth-child(3) { position: absolute; top: 146px; left: 22px; width: 220px; margin: 0; font-size: 20px; line-height: 28px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__social { position: absolute; top: 65px; left: 62px; width: 140px; height: 38px; gap: 13px; margin: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__logo { position: absolute; top: 146px; left: 14px; width: 237px; margin: 0; } body.orbital-pm-site:not(.pm-legacy-document) .pm-footer__base { position: absolute; right: 0; bottom: 6px; left: 0; margin: 0; border-bottom-width: 6px; } /* Portada: 980 px de hero y las tres secciones en y=267/759/1168. */ body.page-id-21 .pm-main { min-height: 1458px; padding-bottom: 53px; } body.page-id-21 .pm-hero { margin-top: 3px; } body.page-id-21 .pm-separador { border-top-width: 6px; margin-top: 31px; margin-bottom: 24px; } body.page-id-21 .pm-main > section.pm-shell + .pm-separador { margin-bottom: 36px; } body.page-id-21 .pm-main > section.pm-shell:not(.pm-convenios) { padding-bottom: 52px; } body.page-id-21 .pm-main > section.pm-shell:not(.pm-convenios) .pm-titulo { width: 447px; font-size: 33px; padding: 7px 20px; } body.page-id-21 .pm-convenios { position: relative; grid-template-columns: 456px 420px; gap: 39px; } body.page-id-21 .pm-convenios::before { content: ""; position: absolute; top: -42px; right: calc(50% - 50vw); bottom: -60px; left: calc(50% - 50vw); z-index: -1; background: #fff; } body.page-id-21 .pm-convenios .pm-titulo { width: 456px; font-size: 33px; padding: 7px 20px; margin-bottom: 39px; text-align: center; } body.page-id-21 .pm-convenios .pm-caja { min-height: 376px; padding: 44px 40px; line-height: 1.75; } body.page-id-21 .pm-convenios .pm-carrusel { max-width: 378px; } /* Quiénes Somos usa un lienzo principal más ancho que el hero. */ body.page-id-129 .pm-main > .pm-shell { width: min(1088px, calc(100% - 40px)); } body.page-id-129 .pm-titulo { width: 467px; text-align: center; } body.page-id-129 .pm-cols { grid-template-columns: 467px 477px; gap: 31px; } body.orbital-pm-site.page-id-129:not(.pm-legacy-document) .pm-caja { padding: 9px 14px 8px; } body.page-id-129 .pm-caja p { margin-bottom: 24px; } /* Cajas de especialidad: 503 px + media a la derecha, como el Wix. */ body:is(.page-id-131, .page-id-132) .pm-cols { grid-template-columns: 503px 445px; gap: 32px; } body:is(.page-id-131, .page-id-132) .pm-titulo { min-width: 503px; text-align: center; } /* Los tres mapas sí son contenido visible del Wix. Se ubican sobre el alto ya calibrado de cada lienzo para conservar tanto su coordenada como el alto total de página. */ body:is(.page-id-131, .page-id-132, .page-id-136, .page-id-138) .pm-mapa--ubicacion { position: absolute; left: 0; margin: 0; } body:is(.page-id-131, .page-id-132) .pm-mapa--ubicacion::before { content: ""; position: absolute; top: -7px; left: 50%; width: 100vw; height: 6px; transform: translateX(-50%); background: var(--pm-lima); pointer-events: none; } body.page-id-131 .pm-mapa--ubicacion { top: 520px; } body.page-id-131 .pm-mapa--ubicacion iframe { height: 326px; } body.page-id-132 .pm-mapa--ubicacion { top: 531px; } body.page-id-132 .pm-mapa--ubicacion iframe { height: 367px; } body.page-id-136 .pm-mapa--ubicacion { top: 613px; } body.page-id-136 .pm-mapa--ubicacion iframe { height: 307px; } body.page-id-138 .pm-mapa--ubicacion { top: 556px; } body.page-id-138 .pm-mapa--ubicacion iframe { height: 307px; } /* En estas dos páginas el Wix pasa del mapa al pie sin separador verde. Se conserva el grosor para no desplazar el contenido del pie. */ body:is(.page-id-131, .page-id-136, .page-id-138) .pm-footer { border-top-color: transparent; } /* El mapa de Ortodoncia termina justo donde comienza el separador del pie. Los 7 px retirados del lienzo se devuelven al fondo del pie para mantener intacto el alto total de 1568 px. */ body.page-id-132 .pm-footer { padding-bottom: 13px; } /* Convenios: la imagen de 405 px gobierna el alto de cada fila. */ body:is(.page-id-137, .page-id-138) .pm-carrusel:not(.pm-carrusel--pago) { max-width: 405px; } body.orbital-pm-site.page-id-137:not(.pm-legacy-document) .pm-caja { padding: 18px 24px; font-size: 16px; line-height: 1.45; } body.page-id-137 .pm-flechas li { margin-bottom: 14px; } /* Términos era mucho más compacto que los artículos comerciales. */ body.orbital-pm-site.page-id-143:not(.pm-legacy-document) .pm-articulo { max-width: 940px; font-size: 15px; line-height: 1.5; } body.orbital-pm-site.page-id-143:not(.pm-legacy-document) .pm-articulo p { font-size: 15px; line-height: 1.5; margin-bottom: 18px; } body.orbital-pm-site.page-id-133:not(.pm-legacy-document) .pm-articulo { line-height: 1.35; } body.orbital-pm-site.page-id-134:not(.pm-legacy-document) .pm-articulo { line-height: 1.52; } /* Altos de sección originales. Mantienen el aire del Wix y el hueco del bloque de ejemplo eliminado de Servicios. */ body.page-id-129 .pm-main { min-height: 1153px; } body.page-id-130 .pm-main { min-height: 2468px; } body.page-id-131 .pm-main { min-height: 865px; } body.page-id-132 .pm-main { min-height: 917px; } body.page-id-133 .pm-main { min-height: 2808px; } body.page-id-134 .pm-main { min-height: 4360px; } body.page-id-136 .pm-main { min-height: 960px; } body.page-id-137 .pm-main { min-height: 1118px; } body.page-id-138 .pm-main { min-height: 911px; } body.page-id-139 .pm-main { min-height: 593px; padding-bottom: 16px; } body.page-id-140 .pm-main { min-height: 683px; } body.page-id-142 .pm-main { min-height: 5672px; } body.page-id-143 .pm-main { min-height: 2233px; } /* El artículo original conserva 179 px más de aire antes del pie. */ body.single-post .pm-post__comentarios { margin-bottom: 283px; } /* Urgencia no usa header/footer compartidos. El Wix reservaba este espacio para una lámina vacía; se replica sólo el hueco, no el contenido. */ body.page-id-135 .pm-urgencia__servicios { min-height: 980px; } } @media (max-width: 900px) { .pm-mapa--ubicacion iframe { height: 300px; } } /* En pantallas estrechas los CTA dejan de ser flotantes para que nunca tapen formularios, texto ni controles del carrusel. En escritorio conservan la posición exacta del Wix. */ @media (max-width: 560px) { body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes { display: grid; gap: 10px; padding: 18px 20px; border-top: 4px solid var(--pm-lima); background: #fff; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes .pm-flotante-agenda, body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes .pm-flotante-wsp { position: static; inset: auto; width: min(100%, 300px); max-width: none; height: 46px; margin: 0 auto; padding: 0 18px; justify-content: center; font-size: 14px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes .pm-flotante-agenda { border-radius: 12px; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes .pm-flotante-wsp { gap: 10px; border-radius: 23px; letter-spacing: .18em; } body.orbital-pm-site:not(.pm-legacy-document) .pm-flotantes .pm-flotante-wsp svg { width: 32px; height: 32px; margin-left: 6px; } }