/* volquetasmontevideo.com: base del rediseño estilo pintor.uy (23/10/2026), tomada de sanitariosmoviles.uy (mismo motor).
   Se carga después de style.css y solo pisa lo visual: no cambia textos, títulos ni enlaces.
   Oswald 700 en mayúsculas para títulos, menú y botones; Open Sans para el texto; botones rectángulo de radio 8; raya roja bajo los H2;
   tablas con encabezado gris oscuro; FAQ en tarjetas; pie gris oscuro. Paleta del logo: gris oscuro #2B2B2E, rojo #D7262B (#A81C20). Sin blur. */

/* Fuentes locales. "Barlow Condensed" y "Host Grotesk" apuntan a Oswald y Open Sans para que todo style.css las tome sin reescribirlo. */
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/oswald-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/oswald-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("../fonts/oswald-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("../fonts/oswald-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("../fonts/open-sans-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("../fonts/open-sans-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Host Grotesk"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("../fonts/open-sans-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Host Grotesk"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("../fonts/open-sans-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --f: "Open Sans", "Helvetica Neue", Arial, sans-serif;
  --f-titulos: Oswald, "Arial Narrow", sans-serif;
  --pri: #2B2B2E; --pri-2: #1B1B1D; --acento: #D7262B; --acento-2: #A81C20;
  --texto: #111827; --texto-2: #4B5563; --borde: #E5E7EB;
  --fondo-2: #F5F5F5; --fondo-3: #F9FAFB; --nota: #FFF9D6;
  --radio: 8px; --sombra: 0 6px 24px rgba(43,43,46,.10);
  --fs-xs: .8125rem;
  --fs-sm: clamp(.875rem, .85rem + .1vw, .9375rem);
  --fs-base: clamp(1rem, .96rem + .15vw, 1.0625rem);
  --fs-lg: clamp(1.0625rem, .99rem + .3vw, 1.25rem);
  --fs-h3: clamp(1.25rem, 1.15rem + .4vw, 1.5rem);
  --fs-h2: clamp(1.625rem, 1.35rem + 1.1vw, 2.25rem);
  --fs-h1: clamp(2rem, 1.55rem + 1.9vw, 3.125rem);
  --fs-h1-home: clamp(2.125rem, 1.5rem + 2.6vw, 3.5rem);
  --fs-btn: clamp(1rem, .95rem + .2vw, 1.125rem);
  --alto-topbar: 0px;
  --alto-header: 64px;
}
@media (min-width: 860px) { :root { --alto-topbar: 38px; } }
@media (min-width: 1100px) { :root { --alto-header: 80px; } }

body { font-family: var(--f); font-size: var(--fs-base); line-height: 1.65; color: var(--texto); }
h1, h2, h3 { font-family: var(--f-titulos); text-transform: uppercase; font-weight: 700; letter-spacing: .015em; text-wrap: balance; }
.container { max-width: 1180px; padding-left: 16px; padding-right: 16px; }
@media (min-width: 700px) { .container { padding-left: 28px; padding-right: 28px; } }

/* ===== Botones: rectángulo de radio 8, Oswald en mayúsculas. El de presupuesto va en rojo con letra blanca (como la franja del logo). ===== */
.header__cta, .hero__btn-primary, .hero__btn-secondary, .servicios__cta-btn, .servicio-card__btn, .pasos__cta-btn,
.quienes-somos__btn, .faq__cta-btn, .contacto-home__wa, .contacto-home__submit, .footer__wa, .btn, .mobile-menu__wsp, .mobile-menu__tel {
  border-radius: var(--radio) !important;
  font-family: var(--f-titulos) !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .04em !important;
  font-size: var(--fs-btn) !important; line-height: 1.2;
  box-shadow: none !important;
}
.hero__btn-primary, .servicios__cta-btn, .pasos__cta-btn, .quienes-somos__btn, .faq__cta-btn, .contacto-home__wa, .footer__wa, .header__cta, .btn--primary {
  background: var(--acento) !important; color: #fff !important; border: 2px solid var(--acento) !important;
  padding: .8em 1.3em !important; transform: none !important;
}
.hero__btn-primary:hover, .servicios__cta-btn:hover, .pasos__cta-btn:hover, .quienes-somos__btn:hover, .faq__cta-btn:hover,
.contacto-home__wa:hover, .footer__wa:hover, .header__cta:hover, .btn--primary:hover {
  background: var(--acento-2) !important; border-color: var(--acento-2) !important; color: #fff !important; transform: none !important;
}
.hero__btn-secondary { background: transparent !important; color: #fff !important; border: 2px solid #fff !important; padding: .8em 1.3em !important; }
.hero__btn-secondary:hover { background: #fff !important; color: var(--pri) !important; }
.servicio-card__btn { background: var(--pri) !important; color: #fff !important; }
.servicio-card__btn:hover { background: var(--pri-2) !important; }
.contacto-home__submit { background: var(--pri) !important; color: #fff !important; border: 2px solid var(--pri) !important; }
.contacto-home__submit:hover { background: var(--pri-2) !important; }
.header__cta { padding: .55em 1.1em !important; font-size: 1.05rem !important; }

/* Topbar, header y hero: pasaron a cabecera.css y hero.css (diseño de pintor.uy, 23/10/2026). */

/* Migas debajo del hero */
.migas { background: #fff; border-bottom: 1px solid var(--borde); }
.migas__list { font-size: var(--fs-xs); }
.migas__list [aria-current] { color: var(--pri); }

/* ===== Secciones: fondos alternados y raya roja bajo el H2 ===== */
.servicios, .zona-texto, .secciones, .reviews-strip, .pasos, .quienes-somos, .diferenciadores, .zonas-home, .faq, .contacto-home, .respuesta {
  padding-top: clamp(40px, 5vw, 72px) !important; padding-bottom: clamp(40px, 5vw, 72px) !important;
}
.servicios { background: #F5F5F5 !important; } /* */
.zona-texto, .secciones { background: #fff !important; }
.reviews-strip { background: var(--fondo-3) !important; }
.pasos { background: #fff !important; }
.quienes-somos { background: var(--fondo-3) !important; }
.diferenciadores { background: #fff !important; }
.zonas-home { background: var(--fondo-3) !important; }
.faq { background: #fff !important; }
.contacto-home { background: var(--fondo-3) !important; }

.servicios__title, .pasos__title, .quienes-somos__title, .diferenciadores__title, .zonas-home__title, .faq__title,
.contacto-home__title, .zona-texto__title, .secciones__h2, .reviews-strip__heading h2, .reviews-strip__title, .relacionados__title {
  font-family: var(--f-titulos) !important; font-size: var(--fs-h2) !important; line-height: 1.1 !important;
  text-transform: uppercase !important; letter-spacing: .015em !important; color: var(--pri) !important; font-weight: 700 !important;
}
.relacionados__title { font-size: var(--fs-h3) !important; }
.servicios__title::after, .pasos__title::after, .quienes-somos__title::after, .diferenciadores__title::after, .zonas-home__title::after,
.faq__title::after, .contacto-home__title::after, .zona-texto__title::after, .secciones__h2::after, .reviews-strip__heading h2::after, .reviews-strip__title::after {
  content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: var(--acento); margin-top: 14px;
}
.pasos__header, .diferenciadores__header, .servicios__header { text-align: left !important; margin-left: 0 !important; }
.pasos__title::after, .diferenciadores__title::after, .servicios__title::after { margin-left: 0; }
.secciones__h3, .pasos__step-title, .dif-item__title {
  font-family: var(--f-titulos) !important; text-transform: uppercase !important; letter-spacing: .02em !important; color: var(--pri) !important; font-weight: 700 !important;
}
.servicios__lead, .pasos__lead, .diferenciadores__lead, .zonas-home__lead, .faq__lead, .contacto-home__lead, .quienes-somos__lead, .quienes-somos__text,
.zona-texto p, .secciones p, .secciones__lista li, .dif-item__desc, .pasos__desc {
  font-family: var(--f) !important; color: var(--texto-2);
}
.servicios__lead, .pasos__lead, .diferenciadores__lead, .zonas-home__lead, .faq__lead, .contacto-home__lead { font-size: var(--fs-lg) !important; max-width: 760px; }
.secciones a, .zona-texto a, .quienes-somos a:not(.quienes-somos__btn), .faq__a a, .zonas-home__otras a { color: var(--pri) !important; }

/* Listas con punto gris oscuro */
.secciones__lista { list-style: none !important; padding-left: 0 !important; }
.secciones__lista > li { position: relative; padding-left: 1.35em !important; }
.secciones__lista > li::before { content: "" !important; position: absolute; left: .15em; top: .68em; width: 7px; height: 7px; border-radius: 2px; background: var(--pri); }
.secciones__lista > li > i:first-child { display: none; }

/* Tablas: marco redondeado, encabezado gris oscuro, filas alternadas */
.secciones__tabla-wrap { border: 1px solid var(--borde) !important; border-radius: 12px !important; overflow-x: auto; background: #fff; }
.secciones__tabla { border-collapse: collapse; width: 100%; font-size: var(--fs-sm); }
.secciones__tabla th { background: var(--pri) !important; color: #fff !important; font-family: var(--f-titulos) !important; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; padding: 12px 14px !important; border: 0 !important; }
.secciones__tabla td { padding: 12px 14px !important; border: 0 !important; border-bottom: 1px solid var(--borde) !important; }
.secciones__tabla tbody tr:nth-child(even) { background: var(--fondo-3); }
.secciones__tabla td:first-child { font-weight: 700; color: var(--texto); }

/* Notas y tarjetas de secciones */
.secciones__nota { background: var(--nota) !important; border: 0 !important; border-left: 4px solid var(--acento) !important; border-radius: 10px !important; }
.secciones__card { background: #fff; border: 1px solid var(--borde) !important; border-radius: 14px !important; box-shadow: 0 4px 14px rgba(43,43,46,.06) !important; position: relative; overflow: hidden; }
.secciones__card::after { content: ""; position: absolute; left: 0; bottom: 0; height: 4px; width: 44px; background: var(--acento); border-radius: 0 2px 0 0; }

/* ===== Servicios (home): tarjetas con foto, raya roja que crece ===== */
.servicio-card { border-radius: 14px !important; box-shadow: 0 4px 14px rgba(43,43,46,.10) !important; transition: transform .2s ease, box-shadow .2s ease; }
.servicio-card:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(43,43,46,.20) !important; }
.servicio-card::before { content: ""; position: absolute; left: 0; bottom: 0; height: 4px; width: 44px; background: var(--acento); z-index: 3; transition: width .3s ease; }
.servicio-card:hover::before { width: 100%; }
.servicio-card::after { background: linear-gradient(0deg, rgba(20,20,20,.9) 0%, rgba(20,20,20,.45) 55%, rgba(20,20,20,.1) 100%) !important; }
.servicio-card__title { font-family: var(--f-titulos) !important; text-transform: uppercase; letter-spacing: .02em; }

/* ===== Pasos: línea de tiempo con ícono en círculo gris ===== */
.pasos__icon { background: var(--fondo-2) !important; color: var(--pri) !important; border-color: #fff !important; outline-color: var(--pri) !important; }
.pasos__item:not(:last-child)::after { background: #E9B8BA !important; }

/* ===== Diferenciadores: tarjetas blancas con ícono en círculo gris y raya roja ===== */
.dif-item {
  position: relative; background: #fff; border: 1px solid var(--borde); border-radius: 14px; padding: 22px 20px 24px !important;
  box-shadow: 0 4px 14px rgba(43,43,46,.06); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.dif-item::after { content: ""; position: absolute; left: 0; bottom: 0; height: 4px; width: 44px; background: var(--acento); border-radius: 0 2px 0 0; transition: width .3s ease; }
.dif-item:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(43,43,46,.14); border-color: #E9B8BA; }
.dif-item:hover::after { width: 100%; }
.dif-item__icon { background: var(--fondo-2) !important; border-radius: 50% !important; width: 72px !important; height: 72px !important; display: grid !important; place-items: center; color: var(--pri) !important; }

/* ===== Quiénes somos ===== */
.quienes-somos__img { border-radius: 12px !important; box-shadow: 0 18px 40px rgba(17,24,39,.12) !important; }

/* ===== Reseñas ===== */
.review-card { font-family: var(--f) !important; border-radius: 12px !important; border-color: var(--borde) !important; }
.review-card__author h3 { font-family: var(--f) !important; }
.review-card__avatar { background: var(--fondo-2) !important; color: var(--pri) !important; }

/* ===== Zonas: chips blancos con borde, hover gris oscuro ===== */
.zonas-home__chip { border-radius: var(--radio) !important; border: 1px solid var(--borde) !important; background: #fff !important; font-family: var(--f) !important; font-weight: 600 !important; color: var(--texto) !important; }
.zonas-home__chip i { color: var(--pri) !important; }
.zonas-home__chip:hover { background: var(--pri) !important; border-color: var(--pri) !important; color: #fff !important; }
.zonas-home__chip:hover i { color: var(--acento) !important; }

/* ===== Preguntas frecuentes: tarjetas con + que gira a × ===== */
.faq__list { gap: 10px !important; max-width: 820px; }
.faq__item { border: 1px solid var(--borde) !important; border-radius: 12px !important; background: #fff !important; box-shadow: none !important; transition: border-color .2s, box-shadow .2s; }
.faq__item[open] { border-color: #E9B8BA !important; box-shadow: var(--sombra) !important; }
.faq__q { font-family: var(--f) !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: var(--fs-base) !important; color: var(--texto) !important; }
.faq__item summary:hover .faq__q { color: var(--pri) !important; }
.faq__icon { background: none !important; color: var(--pri) !important; border: 0 !important; width: auto !important; height: auto !important; font-size: 1.4em !important; }
.faq__a p { color: var(--texto-2) !important; font-family: var(--f) !important; }
.faq__cta { justify-content: flex-start !important; }

/* ===== Respuesta (landings): tarjeta blanca montada con filete gris oscuro ===== */
.respuesta { background: var(--fondo-3) !important; }
.respuesta__inner { background: #fff; border-radius: 12px; border-top: 4px solid var(--pri); box-shadow: 0 18px 40px rgba(17,24,39,.10); padding: clamp(20px, 3vw, 32px) !important; }
.respuesta__confianza i { color: var(--pri) !important; }

/* ===== Contacto ===== */
.contacto-home__form { background: #fff !important; border: 1px solid var(--borde) !important; border-top: 4px solid var(--pri) !important; border-radius: 12px !important; box-shadow: var(--sombra) !important; }
.contacto-home__form-title { font-family: var(--f-titulos) !important; text-transform: uppercase; color: var(--pri) !important; }
.contacto-home__input, .contacto-home__textarea { border: 1px solid #C9D3DC !important; border-radius: 8px !important; font-family: var(--f) !important; }
.contacto-home__input:focus, .contacto-home__textarea:focus { border-color: var(--pri) !important; box-shadow: 0 0 0 3px rgba(43,43,46,.14) !important; }
.contacto-home__datos i { color: var(--pri) !important; }

/* ===== Relacionados ===== */
.relacionados__list a { color: var(--pri) !important; text-decoration-color: rgba(43,43,46,.3) !important; }

/* ===== Footer: gris oscuro del logo, títulos Oswald ===== */
.footer { background: var(--pri) !important; color: #C9CED6 !important; padding-top: clamp(40px, 5vw, 64px) !important; font-size: var(--fs-sm); }
.footer h2, .footer h3, .footer__col-title, .footer__title, .footer [class*="__title"] {
  font-family: var(--f-titulos) !important; text-transform: uppercase; letter-spacing: .04em; color: #fff !important;
}
.footer a { color: #C9CED6; }
.footer a:hover { color: #fff; text-decoration-color: var(--acento); }
.footer__tagline { color: #C9CED6 !important; }

/* WhatsApp flotante sin cambios de color (verde) */

/* ===== Menú de celular ===== */
.mobile-menu__nav a, .mobile-link { font-family: var(--f-titulos) !important; text-transform: uppercase; letter-spacing: .03em; }
.mobile-menu__wsp { background: var(--acento) !important; color: var(--pri) !important; }

@media (prefers-reduced-motion: reduce) {
  .servicio-card, .dif-item, .servicio-card::before, .dif-item::after, .site-top { transition: none; }
  .servicio-card:hover, .dif-item:hover { transform: none; }
}
