/* All local and regional pages. Keep brand colour for actions and small accents. */
.zone-refresh {
    --site-ink: #242824;
    --site-muted: #60665f;
    --site-paper: #fff7ee;
    --site-line: #e6dfd5;
    --primary-color: var(--site-ink);
    --text-color: var(--site-muted);
    --text-muted: var(--site-muted);
    --secondary-color: var(--site-paper);
    --divider-color: var(--site-line);
    --radius-card: 12px;
    --sp-section: 76px;
    color: var(--site-muted);
}
.zone-refresh .container { max-width: 1240px; }
.zone-refresh .topbar { background: var(--site-paper); border-bottom: 1px solid var(--site-line); padding: 6px 0; }
.zone-refresh .topbar-contact-info { gap: 24px; }
.zone-refresh .topbar-contact-info li { font-size: 12px; font-weight: 400; }
.zone-refresh .topbar-contact-info li i { display: none; }
.zone-refresh .topbar-contact-info a { font-weight: 600; }
.zone-refresh .topbar-social-links { display: none; }
.zone-refresh .topbar-contact-info .topbar-item--address { margin-left: auto; }
.zone-refresh .topbar-contact-info { width: 100%; }
.zone-refresh .main-header { animation: none; box-shadow: none; }
.zone-refresh .navbar { padding: 18px 0; }
.zone-refresh .navbar-brand img { height: 42px !important; width: auto; }
.zone-refresh .btn-default { border-radius: 8px; font-size: 15px; font-weight: 600; box-shadow: none; }
.zone-refresh .btn-default::after { border-radius: 8px; }
.zone-refresh .btn-default.btn-whatsapp-soft { color: var(--site-ink); border: 1px solid #969c93; background: transparent !important; }
.zone-refresh .btn-default.btn-whatsapp-soft::after { background: var(--site-ink) !important; }
.zone-refresh .btn-default.btn-whatsapp-soft:hover { color: #fff; border-color: var(--site-ink); }
.zone-refresh .section-title h2 span { color: inherit; }
.zone-refresh .section-eyebrow { color: var(--accent-text); letter-spacing: .08em; }
.zone-refresh .section-title h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.2; letter-spacing: -.035em; }
.zone-refresh .section-title h2::before, .zone-refresh .section-title h3::before { display: none; }
.zone-refresh .section-title h3 { padding-left: 0; }
.zone-refresh .light-bg-section { background: var(--site-paper); }
.zone-refresh .call-float { display: none; }
.zone-refresh .scroll-top { width: 40px; height: 40px; color: var(--site-ink); background: #fff; border: 1px solid var(--site-line); border-radius: 8px; box-shadow: none; }
.zone-refresh .scroll-top i { color: inherit; }
.zone-refresh a:focus-visible, .zone-refresh button:focus-visible, .zone-refresh summary:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 4px; }
/* Breadcrumb: a compact trail, with the current locality highlighted. */
/* A local font keeps the trail on the same rows before and after Onest loads. */
.zone-refresh .zone-breadcrumb { background: #fff; font-family: Arial, sans-serif; }
.zone-refresh .zone-breadcrumb ol { display: flex; align-items: center; flex-wrap: wrap; gap: 0; list-style: none; margin: 0 auto; padding-top: 16px; padding-bottom: 12px; }
.zone-refresh .zone-breadcrumb li { display: flex; align-items: center; font-size: 13px; line-height: 1.4; }
.zone-refresh .zone-breadcrumb li + li::before { content: ''; width: 5px; height: 5px; margin: 0 15px; border-top: 1px solid #84877f; border-right: 1px solid #84877f; transform: rotate(45deg); }
.zone-refresh .zone-breadcrumb a { display: inline-flex; align-items: center; min-height: 36px; color: #575d55; }
.zone-refresh .zone-breadcrumb a:hover { color: var(--accent-text); }
.zone-refresh .zone-breadcrumb [aria-current] span { padding: 6px 12px; background: #ffedda; border-radius: 6px; color: #8d3e14; font-weight: 650; }

/* Hero: a photographic composition, with a clear price and contact hierarchy. */
.zone-refresh .zone-page .zone-hero { padding: 28px 0 64px; background: #fff; text-align: left; }
.zone-refresh .zone-hero::before { display: none; }
.zone-refresh .zone-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: center; gap: 76px; }
.zone-refresh .zone-eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 16px; color: var(--accent-text); font-size: 11px; font-weight: 700; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; }
.zone-refresh .zone-eyebrow > span { width: 8px; height: 8px; flex-shrink: 0; background: #ee862b; border-radius: 50%; }
.zone-refresh .zone-hero h1 { margin: 0; max-width: 19ch; color: var(--site-ink); font-size: clamp(38px, 3.8vw, 54px); font-weight: 700; line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.zone-refresh .zone-hero__location { color: var(--accent-text); white-space: normal; overflow-wrap: anywhere; }
.zone-refresh .zone-hero__qualifier:not(:empty) { display: block; margin-top: 12px; font-size: .46em; line-height: 1.3; letter-spacing: -.01em; font-weight: 500; color: var(--site-muted); }
.zone-refresh .zone-intro { max-width: 51ch; margin: 24px 0 28px; font-size: 17px; line-height: 1.7; color: var(--site-muted); }
.zone-refresh .zone-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.zone-refresh .zone-actions .btn-default { padding: 0 24px; min-height: 54px; }
.zone-refresh .zone-hero__assurance { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 8px; margin: 17px 0 0; font-size: 12px; line-height: 1.6; color: var(--site-muted); }
.zone-refresh .zone-hero__assurance i { color: var(--accent-text); }
.zone-refresh .zone-hero__visual { position: relative; padding: 0 0 28px; isolation: isolate; }
.zone-refresh .zone-hero__visual::before { content: ''; position: absolute; z-index: -1; inset: 28px -14px 0 28px; border-radius: 20px 84px 20px 20px; background: #ed872a; }
.zone-refresh .zone-hero__photo { position: relative; margin: 0; height: 464px; overflow: hidden; border-radius: 16px 80px 16px 16px; background: #d1d8c9; }
.zone-refresh .zone-hero__photo > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 34%; }
.zone-refresh .zone-hero__photo figcaption { position: absolute; top: 24px; left: 24px; display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; background: #242824; border-radius: 8px; color: #fff; font-size: 12px; line-height: 1.5; }
.zone-refresh .zone-hero__photo figcaption strong { font-size: 14px; font-weight: 600; }
.zone-refresh .zone-hero__price { position: absolute; left: -30px; right: 30px; bottom: 7px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; background: #fff; border: 1px solid #eee5da; border-left: 4px solid #ed872a; border-radius: 10px; box-shadow: 0 10px 34px #29230f12; }
.zone-refresh .zone-hero__price > div { display: flex; flex-direction: column; gap: 6px; }
.zone-refresh .zone-hero__price span { color: var(--site-muted); font-size: 12px; line-height: 1.3; }
.zone-refresh .zone-hero__price strong { color: var(--site-ink); font-size: 34px; font-weight: 700; line-height: 1; letter-spacing: -.04em; }
.zone-refresh .zone-hero__price p { margin: 0; color: var(--site-muted); font-size: 12px; line-height: 1.6; }
/* La nota del «desde» enlaza /precios, que explica de qué depende el precio.
   El nowrap es lo que la deja en un renglón: el inline-block solo no alcanza,
   y a 360 px se partía en «Cómo se arma el / precio» con la tarjeta 19 px más
   alta sobre la foto. El inline-block le da una sola caja al ::after táctil. */
.zone-refresh .zone-hero__price-link { display: inline-block; white-space: nowrap; color: var(--accent-text); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.zone-refresh .zone-hero__price-link:hover { color: var(--site-ink); }
.zone-refresh .zone-jump { border-top: 1px solid var(--site-line); border-bottom: 1px solid var(--site-line); background: var(--site-paper); }
.zone-refresh .zone-jump .container { display: flex; align-items: center; gap: 44px; overflow-x: auto; }
.zone-refresh .zone-jump a { display: inline-flex; align-items: center; flex-shrink: 0; gap: 20px; min-height: 62px; color: var(--site-ink); font-size: 14px; font-weight: 600; line-height: 1.5; }
.zone-refresh .zone-jump a span { color: var(--accent-text); font-size: 20px; }
.zone-refresh .zone-jump a:hover { color: var(--accent-text); }
.zone-refresh .zone-page [id] { scroll-margin-top: 112px; }

/* Two visual entries into the services, followed by the complete local content. */
.zone-refresh .zone-treatments { padding: 60px 0 56px; border-bottom: 1px solid var(--site-line); }
.zone-refresh .zone-section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; margin-bottom: 28px; }
.zone-refresh .zone-section-heading .zone-eyebrow { margin-bottom: 10px; }
.zone-refresh .zone-section-heading h2 { font-size: 32px; line-height: 1.2; letter-spacing: -.035em; }
.zone-refresh .zone-section-heading > p { margin: 0; color: var(--site-muted); font-size: 14px; line-height: 1.7; }
.zone-refresh .zone-treatment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.zone-refresh .zone-treatment { display: grid; grid-template-columns: 38% minmax(0, 1fr); overflow: hidden; border: 1px solid var(--site-line); border-radius: 12px; background: #fff; transition: border-color .2s; }
.zone-refresh .zone-treatment:hover { border-color: var(--accent-text); }
.zone-refresh .zone-treatment > img { width: 100%; height: 100%; min-height: 196px; object-fit: cover; }
.zone-refresh .zone-treatment__copy { padding: 26px; display: flex; flex-direction: column; align-items: flex-start; }
.zone-refresh .zone-treatment__copy h3 { font-size: 23px; line-height: 1.25; letter-spacing: -.02em; margin-bottom: 10px; }
.zone-refresh .zone-treatment__copy p { font-size: 14px; line-height: 1.65; color: var(--site-muted); margin: 0 0 20px; }
.zone-refresh .zone-treatment__copy > span { display: flex; align-items: center; gap: 20px; margin-top: auto; color: var(--accent-text); font-size: 13px; line-height: 1.5; font-weight: 650; }
.zone-refresh .zone-other-treatments { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; margin-top: 20px; font-size: 13px; line-height: 1.6; }
.zone-refresh .zone-other-treatments > span { color: var(--site-muted); }
.zone-refresh .zone-other-treatments a { padding: 8px 0; color: var(--site-ink); text-decoration: underline; text-decoration-color: #d8bc9e; text-underline-offset: 5px; }
.zone-refresh .zone-other-treatments a span { margin-left: 6px; color: var(--accent-text); }
.zone-refresh .zone-page .page-service-single { padding: 64px 0; }
.zone-refresh .zone-layout { display: grid; grid-template-columns: minmax(0, 780px) minmax(240px, 1fr); gap: 70px; align-items: start; }
.zone-refresh .zone-page .service-entry { margin: 0; }
.zone-refresh .zone-page .service-content { margin-bottom: 0; }
.zone-refresh .zone-page .service-content h2 { font-size: 28px; line-height: 1.25; letter-spacing: -.025em; margin: 46px 0 18px; padding-left: 18px; border-left: 3px solid #ed872a; }
.zone-refresh .zone-page .service-content h2:first-child { margin-top: 0; }
.zone-refresh .zone-page .service-content p { font-size: 16px; line-height: 1.85; margin-bottom: 18px; }
.zone-refresh .zone-page .service-content > p:first-of-type { font-size: 18px; line-height: 1.75; color: #3c433b; }
.zone-refresh .zone-page .service-content a { color: var(--accent-text); text-decoration: underline; text-underline-offset: 3px; }
.zone-refresh .zone-section { padding-top: 36px; margin-top: 44px; border-top: 1px solid var(--site-line); }
.zone-refresh .zone-section > h2, .zone-refresh .zone-page .page-single-faqs .section-title h2 { font-size: 27px; line-height: 1.3; letter-spacing: -.025em; margin-bottom: 24px; }
.zone-refresh .zone-page h2 span { color: var(--accent-text); }
.zone-refresh .zone-coverage { padding: 30px; background: var(--site-paper); border: 1px solid var(--site-line); border-radius: 12px; }
.zone-refresh .zone-neighboring-coverage { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--site-line); }
.zone-refresh .zone-neighboring-coverage h3 { font-size: 19px; line-height: 1.4; margin-bottom: 10px; }
.zone-refresh .zone-neighboring-coverage p { font-size: 14px; line-height: 1.7; }
.zone-refresh .zone-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; gap: 0 24px; }
.zone-refresh .zone-links li { border-bottom: 1px solid var(--site-line); }
.zone-refresh .zone-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 12px 0; color: var(--site-ink); font-size: 14px; line-height: 1.5; }
.zone-refresh .zone-links a::after { content: '↗'; color: var(--accent-text); }
.zone-refresh .zone-links a:hover { color: var(--accent-text); }
.zone-refresh .zone-sidebar { position: sticky; top: 112px; padding: 28px; background: var(--site-paper); border-radius: 12px; }
.zone-refresh .zone-sidebar h2 { margin: 0 0 14px; font-size: 18px; line-height: 1.4; letter-spacing: -.02em; }
.zone-refresh .zone-sidebar h2:not(:first-child) { margin-top: 28px; }
.zone-refresh .zone-sidebar > .zone-eyebrow + h2 { margin-top: 0; }
.zone-refresh .zone-sidebar .zone-links { grid-template-columns: 1fr; }
.zone-refresh .zone-sidebar .zone-links a { font-size: 13px; }
.zone-refresh .zone-sidebar .zone-eyebrow { font-size: 10px; }
.zone-refresh .zone-page .page-single-faqs { margin-top: 44px; }
.zone-refresh .zone-page .accordion-summary { font-size: 16px; line-height: 1.55; padding: 20px 40px 20px 0; color: var(--site-ink); }
.zone-refresh .zone-page [open] > .accordion-summary { color: var(--accent-text); }
.zone-refresh .zone-page .accordion-body { padding: 0 30px 22px 0; }
.zone-refresh .zone-page .accordion-body p { font-size: 15px; line-height: 1.75; margin: 0; }
.zone-refresh .zone-page .accordion-item { border-color: var(--site-line); }
.zone-refresh .zone-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; counter-reset: zone-point; }
.zone-refresh .zone-points > div { counter-increment: zone-point; }
.zone-refresh .zone-points > div::before { content: '0' counter(zone-point); display: block; margin-bottom: 12px; font-size: 13px; line-height: 1.5; color: var(--accent-text); font-weight: 650; }
.zone-refresh .zone-points h3 { font-size: 17px; line-height: 1.4; margin-bottom: 8px; }
.zone-refresh .zone-points p { font-size: 14px; line-height: 1.7; margin: 0; }
.zone-refresh .zone-map summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--site-ink); }
.zone-refresh .zone-map summary::after { content: '+'; margin-left: auto; font-size: 22px; color: var(--accent-text); }
.zone-refresh .zone-map[open] summary::after { content: '−'; }
.zone-refresh .zone-map .ratio { margin-top: 20px; }
.zone-refresh .zone-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.zone-refresh .zone-gallery img { width: 100%; height: auto; border-radius: 8px; }
.zone-refresh .zone-bottom-cta { background: var(--site-paper); border-top: 3px solid #ed872a; padding: 50px 0; }
.zone-refresh .zone-bottom-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.zone-refresh .zone-bottom-cta h2 { max-width: 650px; margin: 0 0 12px; font-size: 30px; line-height: 1.25; letter-spacing: -.025em; }
.zone-refresh .zone-bottom-cta p { max-width: 66ch; margin: 0; font-size: 15px; }
.zone-refresh .zone-bottom-cta .zone-actions { flex-shrink: 0; }
/* Enlace de texto a la página de empresas, debajo de los botones de contacto.
   En bloque de línea para que no se corte en dos renglones. */
.zone-refresh .zone-bottom-cta p.zone-bottom-cta__business { margin-top: 20px; }
.zone-refresh .zone-bottom-cta__business a { display: inline-block; color: var(--accent-text); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.zone-refresh .zone-bottom-cta__business a:hover { color: var(--site-ink); }
/* Footer: one neutral surface, one legal line, no repeated badges. */
.zone-refresh .site-footer { padding: 54px 0 22px; background: var(--site-paper); border-top: 1px solid var(--site-line); color: var(--site-muted); }
.zone-refresh .site-footer::before, .zone-refresh .site-footer::after { display: none; }
.zone-refresh .site-footer__grid { display: grid; grid-template-columns: 1.4fr .7fr 1fr 1.15fr; gap: 48px; margin-bottom: 36px; }
.zone-refresh .site-footer a { color: var(--site-ink); }
.zone-refresh .site-footer a:hover { color: var(--accent-text); }
.zone-refresh .site-footer__brand img { width: 155px; height: auto; margin-bottom: 18px; }
.zone-refresh .site-footer__brand p { max-width: 34ch; margin: 0 0 12px; font-size: 14px; line-height: 1.7; }
.zone-refresh .site-footer__brand .site-footer__location { font-size: 12px; }
.zone-refresh .site-footer__social { display: flex; gap: 4px; }
.zone-refresh .site-footer__social a { display: grid; place-items: center; min-width: 36px; min-height: 36px; font-size: 17px; }
.zone-refresh .site-footer__column .site-footer__heading { margin: 4px 0 18px; font-size: 14px; line-height: 1.5; font-weight: 650; }
.zone-refresh .site-footer__column ul { list-style: none; padding: 0; margin: 0; }
.zone-refresh .site-footer__column li { margin-bottom: 4px; }
.zone-refresh .site-footer__column li a { display: inline-flex; align-items: center; min-height: 36px; font-size: 14px; line-height: 1.5; }
.zone-refresh .site-footer__contact > a { display: block; width: fit-content; padding: 6px 0; font-size: 13px; line-height: 1.5; }
.zone-refresh .site-footer__contact .site-footer__phone { font-size: 19px; font-weight: 650; padding-top: 0; }
.zone-refresh .site-footer__contact p { font-size: 12px; line-height: 1.5; margin: 3px 0 12px; }
.zone-refresh .site-footer .footer-legal { padding-top: 20px; border-color: var(--site-line); color: var(--site-muted); font-size: 12px; line-height: 1.7; }
.zone-refresh .site-footer .footer-legal p { max-width: none; margin: 0; }
.zone-refresh .site-footer .footer-legal a { color: var(--site-muted); }
.zone-refresh .site-footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 12px; font-size: 12px; line-height: 1.6; }
.zone-refresh .site-footer__bottom p { margin: 0; }
.zone-refresh .site-footer__bottom a { display: inline-flex; align-items: center; min-height: 32px; }


@media (max-width: 1199.98px) {
    .zone-refresh .zone-hero__grid { gap: 48px; }
    .zone-refresh .zone-hero__photo { height: 420px; }
    .zone-refresh .zone-hero__price { left: -18px; right: 18px; padding: 18px; }
    .zone-refresh .zone-hero__price strong { font-size: 30px; }
    .zone-refresh .zone-treatment__copy { padding: 22px; }
    .zone-refresh .zone-layout { gap: 40px; }
    .zone-refresh .zone-bottom-cta .zone-actions { flex-direction: column; }
}
@media (max-width: 991.98px) {
    .zone-refresh .container { padding-left: 24px; padding-right: 24px; }
    .zone-refresh .topbar-contact-info { gap: 4px 18px; }
    .zone-refresh .topbar-contact-info .topbar-item--mail, .zone-refresh .topbar-contact-info .topbar-item--address { display: none; }
    .zone-refresh .navbar { padding: 14px 0; }
    /* Reserve the space used by SlickNav before its button is mounted. */
    .zone-refresh .navbar-toggle { width: 44px; height: 44px; flex-shrink: 0; }
    .zone-refresh .slicknav_btn { background: transparent; border: 1px solid var(--site-line); }
    .zone-refresh .slicknav_icon-bar { background-color: var(--site-ink); }
    .zone-refresh .slicknav_menu { background: #fff; border-bottom: 1px solid var(--site-line); }
    .zone-refresh .slicknav_nav li a { color: var(--site-ink); border-color: var(--site-line); }
    .zone-refresh .slicknav_nav .nav-cta { border-radius: 8px !important; font-size: 14px; }
    .zone-refresh .slicknav_nav .nav-cta--call { background: var(--accent-text); color: #fff; }
    .zone-refresh .slicknav_nav .nav-cta--wa { background: #fff; color: var(--site-ink); border: 1px solid #969c93; }
    .zone-refresh .zone-hero__grid { gap: 32px; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
    .zone-refresh .zone-hero h1 { font-size: 38px; }
    .zone-refresh .zone-hero__photo { height: 390px; border-top-right-radius: 64px; }
    .zone-refresh .zone-hero__photo figcaption { top: 16px; left: 16px; padding: 9px 12px; }
    .zone-refresh .zone-hero__price p { display: none; }
    .zone-refresh .zone-intro { font-size: 16px; }
    .zone-refresh .zone-actions .btn-default { padding: 0 18px; font-size: 14px; }
    .zone-refresh .zone-hero__contact .zone-actions { flex-direction: column; }
    .zone-refresh .zone-hero__assurance { font-size: 11px; }
    .zone-refresh .zone-treatment-grid { gap: 16px; }
    .zone-refresh .zone-treatment { grid-template-columns: minmax(0, 1fr); }
    .zone-refresh .zone-treatment > img { height: 160px; min-height: 0; }
    .zone-refresh .zone-layout { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .zone-refresh .zone-sidebar { position: static; }
    .zone-refresh .zone-sidebar .zone-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .zone-refresh .zone-bottom-cta-inner { align-items: flex-start; flex-direction: column; }
    .zone-refresh .zone-bottom-cta .zone-actions { flex-direction: row; }
    .zone-refresh .site-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
    .zone-refresh .site-footer__brand { grid-column: 1 / -1; }
    .zone-refresh .site-footer__brand p { max-width: 50ch; }
    .zone-refresh .mobile-cta-bar__inner { padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)); gap: 8px; background: #fff; border-top: 1px solid var(--site-line); box-shadow: none; }
    .zone-refresh .mobile-cta-bar__btn { min-height: 44px; border-radius: 6px; font-size: 14px; }
    .zone-refresh .mobile-cta-bar__wa { background: #fff; border: 1px solid #969c93; color: var(--site-ink); }
    .zone-refresh .mobile-cta-bar__wa:hover { background: var(--site-paper); color: var(--site-ink); }
    .zone-refresh .scroll-top { bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
    body.zone-refresh { padding-bottom: calc(61px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 767.98px) {
    .zone-refresh { --sp-section: 48px; }
    .zone-refresh .container { padding-left: 20px; padding-right: 20px; }
    .zone-refresh .topbar { padding: 6px 0; }
    .zone-refresh .topbar-contact-info { justify-content: space-between; gap: 3px 12px; }
    /* Piso de 12 px en el teléfono (MobileTypographyTest). El topbar queda en
       su tamaño de escritorio, que todavía entra en un renglón a 320 px: a 13
       el horario baja a un segundo renglón y empuja el hero 22 px. */
    .zone-refresh .topbar-contact-info li, .zone-refresh .topbar-contact-info li.topbar-item--phone a { font-size: 12px; line-height: 1.5; }
    .zone-refresh .navbar-brand img { height: 36px !important; }
    .zone-refresh .zone-breadcrumb ol { padding-top: 10px; padding-bottom: 8px; }
    .zone-refresh .zone-breadcrumb li { font-size: 12px; }
    .zone-refresh .zone-breadcrumb li + li::before { margin: 0 10px; }
    .zone-refresh .zone-breadcrumb [aria-current] span { padding: 5px 9px; }
    .zone-refresh .zone-page .zone-hero { padding: 16px 0 30px; }
    .zone-refresh .zone-page [id] { scroll-margin-top: 24px; }
    .zone-refresh .zone-hero__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
    .zone-refresh .zone-hero__copy { display: contents; }
    .zone-refresh .zone-hero__heading { order: 1; margin-bottom: 24px; }
    .zone-refresh .zone-eyebrow, .zone-refresh .zone-sidebar .zone-eyebrow { font-size: 12px; }
    .zone-refresh .zone-eyebrow { margin-bottom: 12px; }
    .zone-refresh .zone-hero h1 { font-size: 36px; max-width: 20ch; }
    .zone-refresh .zone-hero__qualifier:not(:empty) { margin-top: 8px; font-size: 18px; }
    .zone-refresh .zone-hero__visual { order: 2; margin: 0 8px 0 0; padding-bottom: 25px; }
    .zone-refresh .zone-hero__visual::before { inset: 16px -8px 9px 16px; border-radius: 12px 58px 12px 12px; }
    .zone-refresh .zone-hero__photo { height: 225px; border-radius: 12px 52px 12px 12px; }
    .zone-refresh .zone-hero__photo > img { object-position: 50% 24%; }
    .zone-refresh .zone-hero__photo figcaption { display: none; }
    /* Precio (124 px) + nota (111, lo que mide el enlace sin cortarse) piden
       245 con este hueco: entran en un renglón desde 357 px. El hueco es sólo
       un mínimo, space-between reparte el resto, así que de 375 para arriba la
       tarjeta queda igual que con 18. Si algún día no entran (un monto más
       largo, otra fuente), la nota baja entera bajo el precio en lugar de
       desbordar la tarjeta. */
    .zone-refresh .zone-hero__price { left: 14px; right: 14px; bottom: 3px; flex-wrap: wrap; gap: 4px 10px; padding: 13px 16px; border-left-width: 3px; }
    .zone-refresh .zone-hero__price > div { gap: 3px; }
    /* La tarjeta es la única excepción al piso de 12 px: va sobre la foto y
       su alto lo fija ZoneLayoutStabilityTest. «Tratamientos desde» a 12 px
       ya parte la fila a 344 px (la tarjeta pasa de 76 a 123 px), así que
       agrandar su letra pide rediseñar el hero, no subir la fuente. */
    .zone-refresh .zone-hero__price strong { font-size: 28px; }
    .zone-refresh .zone-hero__price span { font-size: 11px; }
    .zone-refresh .zone-hero__price p { display: block; font-size: 10px; }
    .zone-refresh .zone-intro { order: 3; margin: 24px 0 22px; font-size: 15px; line-height: 1.7; }
    .zone-refresh .zone-hero__contact { order: 4; }
    .zone-refresh .zone-hero__contact .zone-actions { flex-direction: row; flex-wrap: nowrap; gap: 8px; }
    .zone-refresh .zone-hero__contact .zone-actions .btn-default { padding: 0 14px; min-height: 50px; font-size: 12px; }
    .zone-refresh .zone-hero__contact .zone-actions > a:first-child { flex-grow: 1; }
    /* A 12 px entra en un renglón desde 360 px; más angosto se parte en dos. */
    .zone-refresh .zone-hero__assurance { font-size: 12px; gap: 5px; margin-top: 12px; }
    .zone-refresh .zone-jump .container { gap: 26px; }
    .zone-refresh .zone-jump a { min-height: 54px; gap: 12px; font-size: 12px; }
    .zone-refresh .zone-treatments { padding: 36px 0; }
    .zone-refresh .zone-section-heading { display: block; margin-bottom: 22px; }
    .zone-refresh .zone-section-heading h2 { font-size: 28px; }
    .zone-refresh .zone-section-heading > p { margin-top: 12px; font-size: 13px; }
    .zone-refresh .zone-section-heading > p br { display: none; }
    .zone-refresh .zone-treatment-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .zone-refresh .zone-treatment { grid-template-columns: 30% minmax(0, 1fr); }
    .zone-refresh .zone-treatment > img { height: 100%; min-height: 180px; }
    .zone-refresh .zone-treatment__copy { padding: 20px 18px; }
    .zone-refresh .zone-treatment__copy h3 { font-size: 21px; }
    .zone-refresh .zone-treatment__copy p { font-size: 13px; margin-bottom: 16px; }
    .zone-refresh .zone-treatment__copy > span { font-size: 12px; gap: 10px; }
    .zone-refresh .zone-other-treatments { gap: 4px 16px; font-size: 12px; }
    .zone-refresh .zone-other-treatments > span { width: 100%; }
    .zone-refresh .zone-page .page-service-single { padding: 36px 0; }
    .zone-refresh .zone-page .service-content h2 { font-size: 24px; margin-top: 36px; padding-left: 14px; }
    .zone-refresh .zone-page .service-content p { font-size: 16px; line-height: 1.75; }
    .zone-refresh .zone-page .service-content > p:first-of-type { font-size: 17px; }
    .zone-refresh .zone-section > h2, .zone-refresh .zone-page .page-single-faqs .section-title h2 { font-size: 25px; }
    .zone-refresh .zone-coverage { padding: 22px; }
    .zone-refresh .zone-points { gap: 24px; grid-template-columns: 1fr; }
    .zone-refresh .zone-sidebar { padding: 24px; }
    .zone-refresh .zone-bottom-cta { padding: 36px 0; }
    .zone-refresh .zone-bottom-cta h2 { font-size: 26px; }
    .zone-refresh .zone-bottom-cta .zone-actions { width: 100%; flex-direction: column; }
    .zone-refresh .site-footer { padding: 36px 0 20px; }
    .zone-refresh .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; margin-bottom: 28px; }
    .zone-refresh .site-footer__brand, .zone-refresh .site-footer__contact { grid-column: 1 / -1; }
    .zone-refresh .site-footer__column .site-footer__heading { margin-bottom: 10px; }
    .zone-refresh .site-footer__column li a { min-height: 40px; }
    .zone-refresh .site-footer__contact > a { min-height: 40px; }
    .zone-refresh .site-footer__bottom { align-items: flex-start; flex-direction: column; gap: 4px; }
}
@media (max-width: 359.98px) {
    /* Con el monto a 24 px la fila de la tarjeta entra hasta 340 px (344, la
       pantalla exterior de los plegables, queda igual que a 375). Más angosto,
       la nota pasa abajo. */
    .zone-refresh .zone-hero__price strong { font-size: 24px; }
}

/* Objetivo táctil móvil (2026-10): piso de 44 px en encabezado, migas, enlaces
   sueltos y pie de zonas, servicios y empresas. Donde la caja no puede crecer
   sin mover el diseño, el área se amplía con el ::after invisible del patrón
   P3 de custom.css. Medido con elementFromPoint, no sólo con la caja: un
   ::after que pisa al vecino le quita el área en vez de sumarla, así que en
   las listas apiladas lo que cuenta es el paso entre renglones (44 px).
   Lo mide tests/Browser/MobileTouchTargetsTest.php. */
@media (max-width: 991.98px) {
    .zone-refresh .navbar-brand,
    .zone-refresh .zone-breadcrumb a,
    .zone-refresh .zone-other-treatments a,
    .zone-refresh .site-footer__column li a,
    .zone-refresh .site-footer__bottom a,
    .zone-refresh .business-breadcrumb a,
    .zone-refresh .business-text-link,
    .zone-refresh .business-services a,
    .zone-refresh .service-hub__breadcrumb a,
    .zone-refresh .service-hub__registration,
    .zone-refresh .service-hub__offer-note a,
    .zone-refresh .service-hub__business a,
    .zone-refresh .zone-bottom-cta__business a,
    .zone-refresh .zone-hero__price-link { position: relative; }
    .zone-refresh .navbar-brand::after,
    .zone-refresh .zone-breadcrumb a::after,
    .zone-refresh .zone-other-treatments a::after,
    .zone-refresh .site-footer__column li a::after,
    .zone-refresh .site-footer__bottom a::after,
    .zone-refresh .business-breadcrumb a::after,
    .zone-refresh .business-text-link::after,
    .zone-refresh .business-services a::after,
    .zone-refresh .service-hub__breadcrumb a::after,
    .zone-refresh .service-hub__registration::after,
    .zone-refresh .service-hub__offer-note a::after,
    .zone-refresh .service-hub__business a::after,
    .zone-refresh .zone-bottom-cta__business a::after,
    .zone-refresh .zone-hero__price-link::after { content: ''; position: absolute; inset: -13px -8px; }
    /* El enlace a precios de la tarjeta del hero va a 10 px con renglón de 16:
       con el inset común quedaba en 42. Hacia abajo llega justo al borde de la
       tarjeta, y hacia arriba sólo pisa texto. */
    .zone-refresh .zone-hero__price-link::after { inset: -14px -8px; }
    /* El primer paso de la miga es sólo el ícono de la casa (14 px de ancho)
       y el chevrón del paso siguiente, rotado, le tapaba el borde derecho. */
    .zone-refresh .zone-breadcrumb li:first-child a::after { inset: -13px -17px; }
    .zone-refresh .zone-breadcrumb li + li::before { pointer-events: none; }
    /* Los servicios de empresas miden 17 px de alto y el «Inicio» de su miga 27
       de ancho: con el inset común quedaban en 43. */
    .zone-refresh .business-breadcrumb a::after,
    .zone-refresh .business-services a::after { inset: -14px -9px; }
    /* Redes y contacto: el paso era 40 px (36 + 4 de separación, 40 sin
       separación), así que cada uno se quedaba con 40 aunque se ampliara. */
    .zone-refresh .site-footer__social { gap: 0; }
    .zone-refresh .site-footer__social a { min-width: 44px; min-height: 44px; }
    .zone-refresh .site-footer__contact > a { min-height: 44px; }
    /* El logo del pie es un <a> en línea: su caja medía el renglón (21 px) y
       no la imagen de 48 px que se ve y se toca. */
    .zone-refresh .site-footer__brand > a { display: inline-block; }
    /* Enlaces dentro de los párrafos del contenido (localidades vecinas,
       servicios, inscripción). Siguen en línea para que el texto corte igual:
       el padding vertical de un elemento en línea no cuenta para el alto del
       renglón, así que agranda el área táctil sin mover nada; el horizontal
       se compensa con el margen negativo. */
    .zone-refresh .service-single-content .service-content p a { padding: 12px 2px; margin: 0 -2px; }
}

@media (max-width: 575px) {
    /* Una columna: 28 px de renglón + 14 de separación daban 42 por servicio. */
    .zone-refresh .business-services ul { row-gap: 16px; }
}
