@charset "UTF-8";
/* Fuente del icono de WhatsApp: la misma que usa el plugin QLW en el original
   (woff embebido en base64, glifo \e900). */
@font-face{font-family:"qlwapp-whatsapp";src:url(data:application/x-font-woff;charset=utf-8;base64,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) format("woff");font-weight:400;font-style:normal}
.qlwapp-whatsapp-icon { font-family: "qlwapp-whatsapp" !important; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.qlwapp-whatsapp-icon::before { content: "\e900"; }

/* ==========================================================================
   cermax.cl — hoja de estilos del sitio estático
   Réplica del diseño de www.cermax.cl (WordPress + Divi) en HTML/CSS propio.
   Valores tomados del sitio en producción (estilos computados, viewport 1440).
   ========================================================================== */

/* --- reset mínimo --- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, figure, form { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img { max-width: 100%; height: auto; border: 0; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
a { text-decoration: none; }

/* --- tipografías de iconos (archivos locales) --- */
@font-face { font-family: "FontAwesome"; src: url("../fonts/fa-solid-900.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "FontAwesome"; src: url("../fonts/fa-regular-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "ETmodules"; src: url("../fonts/modules.ttf") format("truetype"); font-weight: normal; font-style: normal; font-display: block; }

.ico-fa { font-family: "FontAwesome"; font-weight: 900; font-style: normal; font-variant: normal; text-transform: none; speak: none; }
.ico-fa-4 { font-family: "FontAwesome"; font-weight: 400; font-style: normal; }
.ico-et { font-family: "ETmodules"; font-weight: normal; font-style: normal; font-variant: normal; text-transform: none; speak: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* --- base --- */
body {
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7em;
  color: #666;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
#page-container { overflow-x: hidden; }

/* --- contenedores (filas Divi: 80% / máx 1080px) --- */
.row { width: 80%; max-width: 1080px; margin: 0 auto; position: relative; padding: 27px 0; }
.row-88 { width: 88%; }

/* ===========================  HEADER  =========================== */
.site-header { background: #fff; padding: 3px 0; margin-top: -9px; position: relative; z-index: 10; }
.header-inner {
  width: 80%; max-width: 2560px; margin: 0 auto;
  padding: 16px 0 4px;
  display: flex; align-items: flex-start; justify-content: space-between;
  min-height: 96px;
}
.brand { flex: 0 0 22.75%; max-width: 22.75%; }
.brand img { width: 259px; height: auto; display: block; margin: -4px 0 -7px; }
.main-nav { flex: 0 0 48.5%; max-width: 48.5%; margin-top: 20px; }
.main-nav ul { display: flex; flex-wrap: wrap; justify-content: center; }
.main-nav li { padding: 0 11px; }
.main-nav a {
  display: inline-block; padding-bottom: 8px;
  font-size: 14px; font-weight: 500; line-height: 14px;
  text-transform: uppercase; color: #0063f4;
  transition: opacity .2s ease;
}
.main-nav a:hover { opacity: .7; }
.header-contact { flex: 0 0 22.75%; max-width: 22.75%; }

/* Barra de contacto móvil: el original la muestra a <=767px (fila de dos blurb
   mitad y mitad, encima del logo). Medido en cermax.cl a 390px:
   icono FA 23px #0063f4 + texto 14px/500 #333, line-height 14px. */
.header-contact-mobile { display: none; }
@media (max-width: 767px) {
  .header-contact { display: none; }
  .header-contact-mobile {
    display: flex; width: 91%; margin: 0 auto; padding: 12px 0 0;
    align-items: flex-start;
  }
  .header-contact-mobile .hc-row { flex: 0 0 50%; max-width: 50%; margin-bottom: 0; gap: 24px; }
  .header-contact-mobile .hc-row + .hc-row { margin-top: -4px; }
  .header-contact-mobile .hc-icon { font-size: 23px; }
  .header-contact-mobile .hc-text { font-size: 14px; line-height: 14px; }
}
.hc-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 9px; }
.hc-icon { font-size: 23px; line-height: 1; color: #0063f4; }
.hc-text { font-size: 17px; font-weight: 500; line-height: 17px; color: #333; }
.nav-toggle { display: none; }
.mobile-nav { display: none; }

/* ===========================  HERO  =========================== */
.sec-hero {
  position: relative;
  padding: 116px 0 177px;
  background-color: #fff;
  background-image: linear-gradient(180deg, rgba(0,0,0,0.41) 0%, rgba(0,0,0,0.57) 100%), url("../wp-content/uploads/2022/08/x-ray-of-teeth.jpg");
  background-image: linear-gradient(180deg, rgba(0,0,0,0.41) 0%, rgba(0,0,0,0.57) 100%), -webkit-image-set(url("../wp-content/uploads/2022/08/x-ray-of-teeth.webp") type("image/webp"), url("../wp-content/uploads/2022/08/x-ray-of-teeth.jpg") type("image/jpeg"));
  background-image: linear-gradient(180deg, rgba(0,0,0,0.41) 0%, rgba(0,0,0,0.57) 100%), image-set(url("../wp-content/uploads/2022/08/x-ray-of-teeth.webp") type("image/webp"), url("../wp-content/uploads/2022/08/x-ray-of-teeth.jpg") type("image/jpeg"));
  background-repeat: no-repeat, no-repeat;
  background-position: right 0 top, right 0 top;
  background-size: auto, cover;
  color: #fff;
  text-align: center;
}
.hero-title { font-size: 49px; font-weight: 600; line-height: 135%; text-transform: uppercase; color: #fff; margin-bottom: 9px; }
.hero-title strong { font-weight: 700; }
.hero-sub { font-size: 38px; font-weight: 600; font-style: italic; line-height: 135%; color: #fff; }
.hero-sub span { font-style: italic; }

/* divisor diagonal inferior (SVG azul del diseño original) */
.divider-bottom {
  position: absolute; left: 0; right: 0; bottom: 0; height: 55px; width: 100%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSI1NXB4IiB2aWV3Qm94PSIwIDAgMTI4MCAxNDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzAwNjNmNCI+PHBhdGggZD0iTTAgMHYxNDBoMTI4MEwwIDB6Ii8+PC9nPjwvc3ZnPg==");
  background-size: 100% 55px; background-repeat: no-repeat;
  margin-bottom: -1px; pointer-events: none; z-index: 1;
}

/* ===========================  FRANJA AZUL (5 beneficios)  =========================== */
.sec-strip { background-color: #0063f4; padding: 20px 0 74px; }
.strip-list { display: flex; flex-wrap: wrap; }
.strip-list > li {
  width: 15.6%; margin-right: 5.5%;
  text-align: center;
  font-size: 16px; font-weight: 500; line-height: 1.8em; color: #fff;
}
.strip-list > li:last-child { margin-right: 0; }
.strip-icon { display: block; font-size: 73px; line-height: 1; color: #fff; margin-bottom: 22px; }
.strip-text p { line-height: 1.8em; }
.strip-text strong, .strip-text b { font-weight: 700; }

/* ===========================  SERVICIOS  =========================== */
.sec-services { padding: 20px 0 82px; background: #fff; }
.svc-head { padding: 0; }
.svc-kicker { font-size: 49px; font-weight: 600; line-height: 135%; text-transform: uppercase; color: #0063f4; text-align: center; margin-bottom: 9px; }
.svc-kicker strong { font-weight: 700; }
.svc-sub { font-size: 38px; font-weight: 600; font-style: italic; line-height: 135%; color: #0063f4; text-align: center; }
.cards { display: flex; flex-wrap: wrap; }
.card { width: 29.6667%; margin-right: 5.5%; margin-bottom: 54px; }
.card:nth-last-child(-n+3) { margin-bottom: 0; }
.card:nth-child(3n) { margin-right: 0; }
.card-img { margin-bottom: 3px; }
.card-img img { width: 100%; height: auto; display: block; border-radius: 10%; }
.card-title { font-size: 30px; font-weight: 600; line-height: 135%; color: #0063f4; text-align: center; margin-bottom: 7px; }
.card-title em { font-style: italic; }
.card-title strong { font-weight: 700; }
.card-title b { font-weight: 900; }
.card-desc { font-size: 16px; font-weight: 500; line-height: 23.8px; color: #000; }

/* ===========================  CTA ORDEN  =========================== */
.sec-orden {
  padding: 137px 0 130px;
  background-color: #fff;
  background-image: linear-gradient(180deg, rgba(0,0,0,0.58) 0%, rgba(0,0,0,0.67) 99%), url("../wp-content/uploads/2022/08/confianza-scaled-1.jpg");
  background-image: linear-gradient(180deg, rgba(0,0,0,0.58) 0%, rgba(0,0,0,0.67) 99%), -webkit-image-set(url("../wp-content/uploads/2022/08/confianza-scaled-1.webp") type("image/webp"), url("../wp-content/uploads/2022/08/confianza-scaled-1.jpg") type("image/jpeg"));
  background-image: linear-gradient(180deg, rgba(0,0,0,0.58) 0%, rgba(0,0,0,0.67) 99%), image-set(url("../wp-content/uploads/2022/08/confianza-scaled-1.webp") type("image/webp"), url("../wp-content/uploads/2022/08/confianza-scaled-1.jpg") type("image/jpeg"));
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center top;
  background-size: auto, cover;
  text-align: center;
}
.orden-title { font-size: 49px; font-weight: 600; line-height: 135%; color: #fff; text-align: center; }
.orden-title em { font-style: italic; }
.orden-title strong { font-weight: 700; }
.btn-wrap { text-align: center; margin-top: 27px; }

/* ===========================  BOTONES  =========================== */
.btn {
  position: relative;
  display: inline-block;
  font-size: 20px; font-weight: 600; line-height: 1.7em;
  padding: 6px 20px;
  border: 2px solid transparent;
  border-radius: 100px;
  text-align: center;
  transition: all .2s ease;
}
.btn-outline-light { color: #fff; border-color: #fff; background: transparent; }
.btn-outline-light:hover { background: rgba(255,255,255,.15); }
.btn-outline-blue { color: #0063f4; border-color: #0063f4; background: transparent; }
.btn-outline-blue:hover { background: rgba(0,99,244,.08); }
.btn-black {
  color: #fff; background: #000; border-color: #000;
  font-size: 27px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase;
  padding: 8.1px 27px;
}
.btn-black:hover { background: #333; border-color: #333; }
/* icono del botón — igual que el original (Divi):
   en reposo el icono está oculto (opacity 0) y el texto queda centrado;
   al pasar el mouse aparece y el padding pasa a 14/40 para darle lugar. */
.has-icon { padding-right: 20px; }
.has-icon::after {
  content: attr(data-icon);
  font-family: "FontAwesome"; font-weight: 900; font-style: normal;
  font-size: 20px; line-height: 1;
  position: absolute; top: 50%; right: 20px; transform: translateY(-50%);
  opacity: 0; transition: opacity .2s ease;
  pointer-events: none;
}
.has-icon:hover { padding-left: 14px; padding-right: 40px; }
.has-icon:hover::after { opacity: 1; }

/* ===========================  RESERVAS  =========================== */
.sec-reservas {
  padding: 60px 0 108px;
  background-color: #fff;
  background-image: linear-gradient(180deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.17) 100%), url("../wp-content/uploads/2022/08/Sin-titulo-4-scaled-1.jpg");
  background-image: linear-gradient(180deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.17) 100%), -webkit-image-set(url("../wp-content/uploads/2022/08/Sin-titulo-4-scaled-1.webp") type("image/webp"), url("../wp-content/uploads/2022/08/Sin-titulo-4-scaled-1.jpg") type("image/jpeg"));
  background-image: linear-gradient(180deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.17) 100%), image-set(url("../wp-content/uploads/2022/08/Sin-titulo-4-scaled-1.webp") type("image/webp"), url("../wp-content/uploads/2022/08/Sin-titulo-4-scaled-1.jpg") type("image/jpeg"));
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center top;
  background-size: auto, cover;
  color: #fff;
}
.reservas-grid { display: flex; flex-wrap: wrap; }
.reservas-col { width: 47.25%; margin-right: 5.5%; }
.reservas-left { background: #0063f4; padding: 9px 20px 50px; }
.reservas-col:last-child { margin-right: 0; }
.res-title { font-size: 49px; font-weight: 600; line-height: 135%; color: #fff; margin-bottom: 11px; }
.res-title strong { font-weight: 700; }
.res-intro { font-size: 18px; font-weight: 500; line-height: 1.8em; color: #fff; margin-bottom: 27.36px; }
.res-intro strong { font-weight: 700; }
.res-intro em { font-style: italic; }

.contact-form { width: 100%; max-width: 470px; margin-bottom: 27.36px; }
.contact-form .field { margin-bottom: 14px; position: relative; }
.field-row { display: flex; gap: 14px; margin-bottom: 14px; }
.field-textarea { margin-bottom: 7px !important; }
.contact-form .field-half { flex: 1 1 0; width: auto; margin-bottom: 0; }

.contact-form .field::after { content: ""; display: table; clear: both; }
.contact-form .input {
  width: 100%;
  padding: 16px;
  font-family: inherit; font-size: 14px; font-weight: 400; line-height: normal;
  color: #333; background: #fff;
  border: 0 solid #bbb; border-radius: 0;
  -webkit-appearance: none;
}
.contact-form textarea.input { resize: vertical; }
.contact-form .input::placeholder { color: #999; opacity: 1; }
.field-honeypot { position: absolute !important; left: -9999px; }
.field-submit { margin-bottom: 0; margin-top: -7.27px; text-align: right; }
.field-submit .btn { height: 62px; padding: 0 27px; display: inline-flex; align-items: center; justify-content: center; }
.form-msg { margin: 0 0 27px; padding: 12px 16px; border-radius: 4px; font-size: 16px; font-weight: 600; }
.form-msg.is-ok { background: #128c7e; color: #fff; font-weight: 600; text-align: center; border-radius: 14px 14px 14px 4px; box-shadow: 0 1px 2px rgba(0,0,0,.15); padding: 14px 18px; }
.form-msg.is-err { background: rgba(255,255,255,.9); color: #a11; }
.legal { font-size: 12px; font-weight: 500; line-height: 1.6em; text-align: center; color: #fff; }

.reservas-contact { padding-top: 0; }
.contact-title { font-size: 30px; font-weight: 600; color: #0063f4; line-height: 0.98em; margin: 0 0 17px; }
.contact-title em { font-style: italic; }
.contact-list li { display: table; width: 100%; margin-bottom: 13px; }
.contact-list li:last-child { margin-bottom: 0; }
.c-icon { display: table-cell; width: 32px; font-size: 32px; line-height: 1em; vertical-align: top; color: #0063f4; padding-right: 15px; }
.c-text { display: table-cell; vertical-align: top; font-size: 18px; font-weight: 500; line-height: 1.5em; color: #000; }
.reservas-contact .c-text { color: #000; }
.contact-list .c-text p { margin: 0; }

/* ===========================  FOOTER  =========================== */
.site-footer { background: rgba(0,0,0,.79); padding: 25px 0 70px; }
.footer-grid { display: flex; flex-wrap: wrap; }
.footer-col { width: 29.6667%; margin-right: 5.5%; }
.footer-col:last-child { margin-right: 0; }
.footer-logo img { width: 100%; max-width: 320px; height: auto; display: block; }
.footer-links p { text-align: center; margin-bottom: 14px; }
.footer-links a { color: #fff; font-size: 14px; font-weight: 500; }
.footer-links a:hover { text-decoration: underline; }
.footer-contact .c-text { font-size: 16px; font-weight: 500; line-height: 1.5em; color: #fff; }

.site-footer .row { padding: 10px 0 27px; }
.footer-contact .c-text p { margin: 0; }

/* ===========================  BOTÓN FLOTANTE WHATSAPP  =========================== */
#qlwapp { position: fixed; right: 0; bottom: 0; width: 430px; z-index: 9999999; pointer-events: none; font-size: 18px; }
#qlwapp .qlwapp-container { display: flex; flex-direction: column; }
.qlwapp-toggle {
  display: inline-flex; align-items: center; justify-content: center; margin: 24px 20px 24px auto;
  height: 40px; padding: 12px 24px; border-radius: 50px; white-space: nowrap;
  background: #25d366; color: #fff; text-decoration: none;
  font-size: 18px; font-weight: 500; line-height: 23.8px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06), 0 2px 32px rgba(0,0,0,.16);
  pointer-events: auto;
  transition: filter .2s ease;
}
.qlwapp-toggle:hover { filter: brightness(1.05); }
.qlwapp-icon { display: block; width: 18px; height: 18px; line-height: 18px; font-size: 18px; margin: 0 12px 0 0; pointer-events: none; }
.qlwapp-text { display: block; padding: 0; font-size: 18px; line-height: 23.8px; font-weight: 500; white-space: nowrap; }
.qlwapp-close { display: none; }

/* ===========================  RESPONSIVE  =========================== */
@media (max-width: 980px) {
  .sec-hero { padding-top: 100px; padding-bottom: 121px; }
  .main-nav { display: none; }
  .header-inner { align-items: center; }
  .brand { flex: 1 1 auto; max-width: none; }
  .brand img { width: 259px; }
  .nav-toggle {
    display: block; width: 44px; height: 40px; position: relative;
    border: 0; background: transparent;
  }
  .nav-toggle .bars, .nav-toggle .bars::before, .nav-toggle .bars::after {
    display: block; position: absolute; left: 8px; right: 8px; height: 3px;
    background: #0063f4; border-radius: 2px; content: "";
  }
  .nav-toggle .bars { top: 18px; }
  .nav-toggle .bars::before { top: -9px; }
  .nav-toggle .bars::after { top: 9px; }
  .mobile-nav { display: none; }
  .mobile-nav.is-open { display: block; border-top: 1px solid #eee; }
  .mobile-nav ul { padding: 12px 0; }
  .mobile-nav li { text-align: center; }
  .mobile-nav a {
    display: block; padding: 10px 0; font-size: 15px; font-weight: 600;
    text-transform: uppercase; color: #0063f4;
  }
  /* columnas se apilan */
  .strip-list > li { width: 47.25%; margin-right: 5.5%; margin-bottom: 24px; }
  .strip-list > li:nth-child(2n) { margin-right: 0; }
  .card, .footer-col { width: 47.25%; }
  .card:nth-child(3n) { margin-right: 5.5%; }
  .card:nth-child(2n) { margin-right: 0; }
  .footer-col:nth-child(2n) { margin-right: 0; }
  .reservas-col { width: 100%; margin-right: 0; }
  .reservas-contact { padding-top: 40px; }
  .contact-form { max-width: none; width: 100%; }
}
@media (max-width: 767px) {
  .sec-hero { padding-top: 0; padding-bottom: 9px; }
  .hero-title { font-size: 32px; }
  .hero-sub { font-size: 22px; margin-bottom: 17px !important; }
  .row-88 { width: 62%; }
  .header-inner { width: 91%; padding: 12px 0 8px; min-height: 0; }
  .brand img { width: 185px; }
  .strip-icon { font-size: 60px; }
  .svc-kicker { font-size: 32px; }
  .svc-sub { font-size: 22px; }
  .card-title { font-size: 24px; }
  .orden-title { font-size: 32px; }
  .res-title { font-size: 32px; }
  .card, .strip-list > li, .footer-col { width: 100%; margin-right: 0; }
  .contact-form .field-half { float: none; width: 100%; }
  /* medido en el original a 390px: los botones con icono bajan a 17px y padding 17
     (el "Reservar" negro no cambia: sigue en 27px) */
  .has-icon { font-size: 17px; padding: 5px 17px; }
  /* el original no cambia el botón en móvil: mantiene 20px a la derecha y 24px abajo */
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

#form-reserva textarea { height: 150px; }

/* tarjetas 8 y 9: line-height 29.4px (medido en el original) */
.card:nth-child(8) .card-title, .card:nth-child(9) .card-title { line-height: 29.4px; }

/* ===========================  CONSENTIMIENTOS (Ley 21.719)  =========================== */
/* el formulario vive sobre el panel azul: texto claro y enlace blanco subrayado */
.field-help { display: block; margin-top: 6px; font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.88); }
.field-consents { margin: 6px 0 18px; border: 0; padding: 0; min-width: 0; }
.field-consents > .field-consent:last-child { margin-bottom: 0; }
.field-consent { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 14px; }
.field-consent input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 3px 0 0; accent-color: #0063f4; }
.field-consent label { font-size: 14px; line-height: 1.5; color: #fff; }
.field-consent label a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.field-consent label a:hover { text-decoration-thickness: 2px; }
.field-consent input:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* ===========================  ACCESIBILIDAD (v24)  =========================== */
/* Enlace de salto: oculto hasta recibir foco con el teclado. */
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 1000;
  padding: 12px 18px; background: #0063f4; color: #fff;
  font-size: 16px; font-weight: 600; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; outline: 2px solid #fff; outline-offset: -4px; }
main:focus { outline: none; }

/* Foco visible en todo lo interactivo (solo teclado, no mouse). */
a:focus-visible, button:focus-visible, .input:focus-visible,
.nav-toggle:focus-visible, .qlwapp-toggle:focus-visible {
  outline: 2px solid #0063f4; outline-offset: 2px;
}
/* Sobre fondos azul y negro el contorno azul no se ve: se usa blanco. */
.sec-strip a:focus-visible, .sec-strip button:focus-visible,
.sec-orden a:focus-visible, .sec-orden button:focus-visible,
.sec-reservas a:focus-visible, .sec-reservas button:focus-visible,
.sec-reservas .input:focus-visible,
.btn-black:focus-visible, .site-footer a:focus-visible {
  outline: 2px solid #fff; outline-offset: 2px;
}
/* Teléfono y correo clicables dentro de los bloques de contacto: mismo color que el texto. */
.hc-text a, .c-text a { color: inherit; }
.hc-text a:hover, .c-text a:hover { text-decoration: underline; text-underline-offset: 2px; }
/* Campos a 16px solo en móvil: evita el zoom automático de iOS al enfocar. */
@media (max-width: 767px) {
  .contact-form .input { font-size: 16px; }
}