/* ==========================================================================
   Clean and Shine — componentes
   Complemento de cas-diseno.css: usa sus mismos tokens y su misma
   convención de tonos. Aquí vive lo que no es estructura de sección —
   formulario de citas, bloques de contacto, cinta de valores — más el
   puente con Woodmart para que la tienda se sienta del mismo sitio.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Tonos sueltos
   .cas-seccion trae tono + espaciado + ancho. Cuando el contenedor lo pone
   Elementor (porque adentro van widgets de Woodmart), sólo hace falta el
   tono: eso es .cas-tono.
   -------------------------------------------------------------------------- */
.cas-tono{
  --fondo:var(--cas-blanco);
  --texto:var(--cas-texto-c);
  --texto-2:var(--cas-texto2-c);
  --sup:var(--cas-superficie-c);
  --borde:var(--cas-borde-c);
  --sombra:0 1px 3px rgba(20,20,23,.06),0 8px 24px rgba(20,20,23,.05);
  background:var(--fondo);
  color:var(--texto);
  font-family:var(--cas-cuerpo);
}
.cas-tono--hueso{--fondo:var(--cas-hueso);--sup:var(--cas-blanco)}
.cas-tono--oscuro{
  --fondo:var(--cas-negro);
  --texto:var(--cas-texto-o);
  --texto-2:var(--cas-texto2-o);
  --sup:var(--cas-superficie-o);
  --borde:var(--cas-borde-o);
  --sombra:none;
}

/* --------------------------------------------------------------------------
   Cinta de valores
   -------------------------------------------------------------------------- */
.cas-cinta{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:14px 34px;margin:0;
  font-size:12px;font-weight:700;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--texto-2);
}
.cas-cinta span{display:inline-flex;align-items:center;gap:34px}
.cas-cinta span::after{content:"·";color:var(--cas-oro)}
.cas-cinta span:last-child::after{display:none}

/* --------------------------------------------------------------------------
   Tarjeta de servicio con foto (portada)
   -------------------------------------------------------------------------- */
.cas-tarjeta--servicio{padding:0;overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s ease,transform .2s ease}
.cas-tarjeta--servicio:hover{border-color:var(--cas-oro);transform:translateY(-2px)}
.cas-tarjeta__foto{display:block;height:180px;background-size:cover;background-position:center;background-color:var(--cas-negro-2)}
.cas-tarjeta__cuerpo{display:flex;flex-direction:column;gap:10px;padding:26px;flex:1}
.cas-tarjeta__num{font-family:var(--cas-display);font-size:13px;letter-spacing:2px;color:var(--cas-oro)}
.cas-tarjeta__titulo{font-family:var(--cas-display);font-size:22px;line-height:1.1;text-transform:uppercase;letter-spacing:.5px;color:var(--texto);margin:0}
.cas-tarjeta__texto{font-size:15px;color:var(--texto-2);margin:0;flex:1}
.cas-tarjeta__pie{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:auto;padding-top:14px;border-top:1px solid var(--borde);
  font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--cas-oro);
}

/* --------------------------------------------------------------------------
   Contacto
   -------------------------------------------------------------------------- */
.cas-contacto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:56px;align-items:start}
.cas-contacto__datos{display:flex;flex-direction:column;gap:26px}
.cas-dato-contacto{display:flex;gap:16px;align-items:flex-start}
.cas-dato-contacto__icono{
  flex:0 0 auto;width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--cas-oro);color:var(--cas-oro);
}
.cas-dato-contacto__icono svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cas-dato-contacto h3{font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--texto-2);margin:0 0 5px 0}
.cas-dato-contacto p{margin:0;font-size:17px;color:var(--texto);line-height:1.5}
.cas-dato-contacto a:hover{color:var(--cas-oro)}
.cas-caja{background:var(--sup);border:1px solid var(--borde);border-radius:8px;padding:36px;box-shadow:var(--sombra)}

/* --------------------------------------------------------------------------
   Formularios: citas y Contact Form 7
   -------------------------------------------------------------------------- */
.cas-form{display:grid;gap:22px}
.cas-campo{display:flex;flex-direction:column;gap:8px}
.cas-campo > label,
.cas-campo__titulo{
  font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--texto-2);
}
.cas-form__fila{display:grid;grid-template-columns:1fr 1fr;gap:22px}

.cas-seccion input[type=text],
.cas-seccion input[type=tel],
.cas-seccion input[type=email],
.cas-seccion input[type=date],
.cas-seccion select,
.cas-seccion textarea{
  width:100%;padding:14px 16px;background:var(--fondo);
  border:1px solid var(--borde);border-radius:4px;
  color:var(--texto);font-family:var(--cas-cuerpo);font-size:16px;line-height:1.4;
  transition:border-color .2s ease;
}
.cas-seccion input:focus,
.cas-seccion select:focus,
.cas-seccion textarea:focus{outline:none;border-color:var(--cas-oro)}
.cas-seccion textarea{min-height:120px;resize:vertical}
.cas-seccion ::placeholder{color:var(--texto-2);opacity:.75}

/* Opciones tipo tarjeta: servicio y tipo de vehículo */
.cas-opciones{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}
.cas-opcion{position:relative;display:block}
.cas-opcion input{position:absolute;opacity:0;width:0;height:0}
.cas-opcion span{
  display:flex;flex-direction:column;gap:4px;height:100%;
  padding:16px 18px;background:var(--sup);border:1px solid var(--borde);border-radius:6px;
  cursor:pointer;font-size:15px;font-weight:600;color:var(--texto);
  transition:border-color .2s ease,box-shadow .2s ease;
}
.cas-opcion span small{font-size:13px;font-weight:400;color:var(--texto-2)}
.cas-opcion input:checked + span{border-color:var(--cas-oro);box-shadow:inset 0 0 0 1px var(--cas-oro)}
.cas-opcion input:focus-visible + span{outline:2px solid var(--cas-oro);outline-offset:2px}

/* Rejilla de horas */
.cas-horarios{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}
.cas-horario{position:relative;display:block}
.cas-horario input{position:absolute;opacity:0;width:0;height:0}
.cas-horario span{
  display:block;padding:12px 8px;text-align:center;
  background:var(--sup);border:1px solid var(--borde);border-radius:4px;cursor:pointer;
  font-size:15px;font-weight:600;color:var(--texto);transition:all .2s ease;
}
.cas-horario input:checked + span{background:var(--cas-oro);border-color:var(--cas-oro);color:#0A0A0B}
.cas-horario input:disabled + span{opacity:.3;cursor:not-allowed;text-decoration:line-through}
.cas-horario input:focus-visible + span{outline:2px solid var(--cas-oro);outline-offset:2px}
.cas-horarios__vacio{grid-column:1/-1;margin:0;font-size:15px;color:var(--texto-2)}

.cas-form__nota{font-size:14px;color:var(--texto-2);margin:0}
.cas-form__aviso:empty{display:none}
.cas-form__error{
  padding:14px 16px;border-radius:4px;font-size:15px;
  background:rgba(190,45,45,.09);border:1px solid rgba(190,45,45,.35);color:#C0392B;
}
.cas--oscuro .cas-form__error{color:#E8837B}
.cas-form__ok{
  padding:14px 16px;border-radius:4px;font-size:15px;
  background:rgba(46,125,50,.1);border:1px solid rgba(46,125,50,.35);color:#2E7D32;
}

/* Panel de confirmación */
.cas-agendar__ok .cas-titulo{margin-top:6px}
.cas-boton-wa{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:17px 34px;border-radius:4px;border:1px solid #25D366;background:#25D366;color:#08331A;
  font-size:15px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  transition:background .2s ease,border-color .2s ease;
}
.cas-boton-wa:hover{background:#1EBE5B;border-color:#1EBE5B;color:#08331A}

/* Contact Form 7 dentro de una caja del sistema */
.wpcf7-form p{margin:0 0 18px 0}
.wpcf7-form label{
  display:block;font-size:12px;font-weight:700;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--texto-2);margin-bottom:8px;
}
.wpcf7-form input[type=submit]{
  padding:17px 34px;background:var(--cas-oro);color:#0A0A0B;border:0;border-radius:4px;
  font-family:var(--cas-cuerpo);font-size:15px;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;cursor:pointer;transition:background .2s ease;
}
.wpcf7-form input[type=submit]:hover{background:var(--cas-oro-claro)}
.wpcf7-not-valid-tip{color:#C0392B;font-size:13px}
.wpcf7-response-output{
  margin:18px 0 0 0!important;border-radius:4px;font-size:14px;
  border-color:var(--borde)!important;color:var(--texto);
}

/* Sólo para lectores de pantalla */
.cas-solo-lectores{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

/* --------------------------------------------------------------------------
   Puente con Woodmart / WooCommerce
   La tienda la sigue manejando Woodmart: grids, carruseles, filtros,
   carrito y checkout son suyos. Esto sólo alinea tipografía y color.
   -------------------------------------------------------------------------- */
.woocommerce-page,
.woocommerce{font-family:var(--cas-cuerpo)}

.wd-el-title .title,
.woodmart-title .title,
.woocommerce-products-header__title,
.wd-page-title .entry-title,
.wd-products-tabs .wd-nav-tabs > li > a > span{
  font-family:var(--cas-display);font-weight:400;
  text-transform:uppercase;letter-spacing:.6px;
}

/* Botones de acción de la tienda con el dorado de marca */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce .single_add_to_cart_button.button,
.woocommerce .checkout-button.button{
  background-color:var(--cas-oro);color:#0A0A0B;
  border-radius:4px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .single_add_to_cart_button.button:hover,
.woocommerce .checkout-button.button:hover{background-color:var(--cas-oro-claro);color:#0A0A0B}

.product-labels .label-item{background:var(--cas-oro);color:#0A0A0B;font-weight:700;letter-spacing:1px}
.wd-product .wd-add-btn > a:hover,
.wd-buttons .wd-action-btn > a:hover{color:var(--cas-oro)}
.wd-breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover{color:var(--cas-oro-oscuro)}

/* Productos de Woodmart dentro de un bloque oscuro */
.cas-tono--oscuro .wd-product .wd-entities-title a,
.cas-tono--oscuro .wd-product .price,
.cas-tono--oscuro .wd-product .price bdi,
.cas-tono--oscuro .wd-el-title .title{color:var(--cas-texto-o)}
.cas-tono--oscuro .wd-product .wd-entities-title a:hover{color:var(--cas-oro-claro)}
.cas-tono--oscuro .wd-product{border-color:var(--cas-borde-o)}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width:1024px){
  .cas-contacto{grid-template-columns:1fr;gap:40px}
}
@media (max-width:767px){
  .cas-form__fila{grid-template-columns:1fr}
  .cas-caja{padding:24px 20px}
  .cas-cinta{gap:10px 20px;letter-spacing:1.8px}
  .cas-cinta span{gap:20px}
  .cas-boton-wa{width:100%}
}

/* Encabezado de sección alineado a la izquierda (el centrado ya está
   definido en cas-diseno.css como .cas-encabezado--centro). */
.cas-encabezado{margin-bottom:56px}
@media (max-width:767px){.cas-encabezado{margin-bottom:36px}}

/* --------------------------------------------------------------------------
   Pie de página
   -------------------------------------------------------------------------- */
.cas-pie{
  background:var(--cas-negro);
  color:var(--cas-texto-o);
  font-family:var(--cas-cuerpo);
  padding:72px 0 56px;
}
.cas-pie__grid{
  display:grid;gap:48px;
  grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
}
.cas-pie__marca img{width:84px;height:auto;margin-bottom:20px}
.cas-pie__marca p{margin:0 0 18px;color:var(--cas-texto-o);font-size:15.5px;line-height:1.6;max-width:340px}
.cas-pie__redes{display:flex;flex-wrap:wrap;gap:18px}
.cas-pie__redes a{
  font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--cas-oro);text-decoration:none;
}
.cas-pie__redes a:hover{color:var(--cas-oro-claro)}
.cas-pie__col h3{
  font-family:var(--cas-display);font-weight:400;font-size:15px;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--cas-oro);margin:0 0 18px;
}
.cas-pie__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.cas-pie__col a{color:var(--cas-texto-o);text-decoration:none;font-size:15px;transition:color .2s ease}
.cas-pie__col a:hover{color:var(--cas-oro)}
.cas-pie__horario{
  margin:22px 0 0;padding-top:18px;border-top:1px solid var(--cas-borde-o);
  font-size:14px;color:var(--cas-texto2-o);line-height:1.7;
}
@media (max-width:1024px){
  .cas-pie__grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media (max-width:767px){
  .cas-pie{padding:52px 0 40px}
  .cas-pie__grid{grid-template-columns:1fr;gap:32px}
}

/* --------------------------------------------------------------------------
   Páginas de secciones a sangre completa
   Woodmart envuelve el contenido en <main class="container">, que impone
   ancho máximo y padding lateral. En las páginas armadas con secciones eso
   sobra: cada sección ya trae su propio .cas-wrap centrado.
   -------------------------------------------------------------------------- */
.cas-pagina-secciones .main-page-wrapper{padding-top:0!important;padding-bottom:0!important}
.cas-pagina-secciones #main-content.container,
.cas-pagina-secciones .content-layout-wrapper.container,
.cas-pagina-secciones .wd-content-layout.container{
  max-width:100%!important;width:100%!important;
  padding-left:0!important;padding-right:0!important;
  margin-left:0;margin-right:0;
}
.cas-pagina-secciones .site-content{margin-bottom:0!important}

/* --------------------------------------------------------------------------
   Bloque de tienda en la portada
   Pestañas de categoría + carrusel de Woodmart. Aquí no se venden precios:
   se invita a explorar. El precio y el botón de compra están en la ficha y
   en la tienda, que es a donde manda el botón de abajo.
   -------------------------------------------------------------------------- */
/* La ficha de producto es la misma de la tienda: imagen, marca, nombre,
   precio y botón de agregar al carrito. No se le quita nada — que el
   visitante pueda comprar desde la portada es justo el objetivo. */

/* Pestañas de categoría en forma de pastilla, como los filtros de la tienda */
.cas-tienda .wd-nav-tabs{gap:10px;justify-content:center;flex-wrap:wrap}
.cas-tienda .wd-nav-tabs > li > a{
  padding:9px 20px;border:1px solid var(--borde);border-radius:100px;
  background:var(--fondo);
  font-family:var(--cas-cuerpo);font-size:13px;font-weight:700;
  letter-spacing:1.2px;text-transform:uppercase;color:var(--texto-2);
  transition:all .2s ease;
}
.cas-tienda .wd-nav-tabs > li > a::after,
.cas-tienda .wd-nav-tabs > li > a::before{display:none!important}
.cas-tienda .wd-nav-tabs > li > a:hover{border-color:var(--cas-oro);color:var(--texto)}
.cas-tienda .wd-nav-tabs > li.wd-active > a,
.cas-tienda .wd-nav-tabs > li.active > a{
  background:var(--cas-oro);border-color:var(--cas-oro);color:#0A0A0B;
}

.cas-tienda-cta{display:flex;justify-content:center;margin-top:8px}
.cas-tienda-cta__cat{text-transform:uppercase}

@media (max-width:767px){
  .cas-tienda .wd-nav-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .cas-tienda .wd-nav-tabs::-webkit-scrollbar{display:none}
  .cas-tienda .wd-nav-tabs > li{flex:0 0 auto}
  .cas-tienda-cta .cas-boton-oro{width:100%}
}

/* --------------------------------------------------------------------------
   Pie a sangre completa
   Woodmart mete el bloque del pie en un .container con ancho máximo y
   padding. El pie ya trae su propio .cas-wrap centrado, así que ese
   contenedor sobra: sin esto el bloque negro queda flotando con márgenes
   blancos a los lados.
   -------------------------------------------------------------------------- */
.wd-footer .main-footer,
.wd-footer .container.main-footer{
  max-width:100%!important;width:100%!important;
  padding-top:0!important;padding-bottom:0!important;
  padding-left:0!important;padding-right:0!important;
  margin:0!important;
}

/* Barra de copyright: en negro, para que no corte el pie con una franja
   blanca. Antes quedaba desprendida del bloque de arriba. */
.wd-footer .wd-copyrights{
  background:var(--cas-negro);border-top:1px solid var(--cas-borde-o);
  color:var(--cas-texto2-o);font-family:var(--cas-cuerpo);font-size:14px;
}
.wd-footer .wd-copyrights a{color:var(--cas-oro)}
.wd-footer .wd-copyrights a:hover{color:var(--cas-oro-claro)}

/* --------------------------------------------------------------------------
   Contenido de las páginas de secciones, sin el encajonado del tema
   -------------------------------------------------------------------------- */
.cas-pagina-secciones .wd-page-content,
.cas-pagina-secciones .main-page-wrapper{
  padding-top:0!important;padding-bottom:0!important;
  margin-top:0!important;margin-bottom:0!important;
}
.cas-pagina-secciones #main-content,
.cas-pagina-secciones .content-layout-wrapper{
  padding-top:0!important;padding-bottom:0!important;
  margin-top:0!important;margin-bottom:0!important;
}

/* El horario va un punto más apagado que los enlaces: es dato de apoyo,
   no navegación. */
.cas-pie__horario{color:var(--cas-texto2-o)}

/* Woodmart aplica su propio color-scheme-dark sobre el pie y pisa los
   colores del bloque. Se le gana en el mismo terreno. */
.wd-footer.color-scheme-dark .cas-pie a,
.wd-footer .cas-pie__col a{color:var(--cas-texto-o)}
.wd-footer.color-scheme-dark .cas-pie a:hover,
.wd-footer .cas-pie__col a:hover{color:var(--cas-oro)}
.wd-footer .cas-pie__col h3{color:var(--cas-oro)}
.wd-footer .cas-pie__redes a{color:var(--cas-oro)}
.wd-footer .cas-pie__redes a:hover{color:var(--cas-oro-claro)}

/* Woodmart escribe un CSS dinámico en línea, después de esta hoja, que
   pinta .wd-footer de blanco. Se le gana con más especificidad para que
   el pie sea negro de borde a borde y no quede un marco blanco. */
body .wd-footer.footer-container{
  background-color:var(--cas-negro)!important;
  background-image:none!important;
}

/* Fichas de producto más compactas en la portada: las fotos vienen con
   proporciones muy distintas y sin un alto fijo cada tarjeta crecía a lo
   que midiera su imagen. Con esto entran dos filas sin que la sección se
   vuelva larguísima. */
.cas-tienda .wd-product .product-image-link{
  aspect-ratio:1/1;overflow:hidden;display:block;
}
.cas-tienda .wd-product .product-image-link img{
  width:100%;height:100%;object-fit:contain;
}

/* El pie de la última sección topa con el pie del sitio: sin franja blanca
   entre el CTA y el footer. */
.cas-pagina-secciones .wd-page-content > .container:last-child,
.cas-pagina-secciones main#main-content{padding-bottom:0!important;margin-bottom:0!important}
.wd-footer .main-footer > p{margin:0!important}
.wd-footer .main-footer > p:empty{display:none}

/* --------------------------------------------------------------------------
   Sección "Cómo funciona" con foto de fondo
   El degradado va en el atributo style desde el shortcode; aquí solo lo
   que hace que se sienta viva: la foto queda fija mientras se hace
   scroll, y las tarjetas de métrica se vuelven de vidrio para que la foto
   se siga leyendo detrás.
   -------------------------------------------------------------------------- */
.cas-escalera--foto{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;   /* paralaje suave al hacer scroll */
  position:relative;
  overflow:hidden;
}

/* Brillo dorado que respira, muy tenue. Da sensación de superficie pulida
   sin distraer de la lectura. */
.cas-escalera--foto::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 85% 30%,rgba(204,155,18,.16) 0%,transparent 60%);
  animation:cas-brillo 9s ease-in-out infinite alternate;
}
@keyframes cas-brillo{
  from{opacity:.45}
  to{opacity:1}
}
.cas-escalera--foto > .cas-wrap{position:relative;z-index:2}

/* Tarjetas de vidrio sobre la foto */
.cas-escalera--foto .cas-metrica{
  background:rgba(10,10,11,.55);
  border-color:rgba(255,255,255,.14);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  transition:border-color .25s ease,transform .25s ease;
}
.cas-escalera--foto .cas-metrica:hover{
  border-color:var(--cas-oro);
  transform:translateY(-3px);
}
.cas-escalera--foto .cas-parrafo{color:#DEDEE2}

/* iOS no maneja bien background-attachment:fixed y el móvil no necesita
   paralaje: se deja la foto quieta y sin animación. */
@media (max-width:1024px){
  .cas-escalera--foto{background-attachment:scroll}
}
@media (prefers-reduced-motion:reduce){
  .cas-escalera--foto::after{animation:none;opacity:.6}
}

/* --------------------------------------------------------------------------
   FAQ con fondo vivo
   El bloque es texto sobre plano y se veía como un rectángulo vacío. En
   una sección clara no sirve una foto: taparía la lectura. Se resuelve
   con tres capas hechas solo con CSS, sin imágenes ni peso extra:
     1. una trama de puntos muy tenue que da textura
     2. dos luces doradas que se desplazan despacio
     3. las preguntas responden al cursor y a la apertura
   -------------------------------------------------------------------------- */
.cas-faq--textura{position:relative;overflow:hidden;isolation:isolate}

/* 1. Trama de puntos */
.cas-faq--textura::before{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:radial-gradient(circle,rgba(20,20,23,.16) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(120% 90% at 50% 40%,#000 25%,transparent 78%);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 40%,#000 25%,transparent 78%);
}

/* 2. Dos luces doradas que se mueven en bucle */
.cas-faq--textura::after{
  content:"";position:absolute;inset:-25%;z-index:-1;pointer-events:none;
  background:
    radial-gradient(38% 44% at 22% 28%,rgba(204,155,18,.20) 0%,transparent 62%),
    radial-gradient(34% 40% at 80% 72%,rgba(204,155,18,.13) 0%,transparent 60%);
  animation:cas-faq-luces 20s ease-in-out infinite alternate;
}
@keyframes cas-faq-luces{
  from{transform:translate3d(-3%,-2%,0) scale(1)}
  to{transform:translate3d(4%,3%,0) scale(1.12)}
}

/* 3. Las preguntas dejan de ser una lista plana */
.cas-faq--textura .cas-faq-lista{border-top:0}
.cas-faq--textura .cas-faq-item{
  border:1px solid var(--borde);border-radius:8px;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  margin-bottom:12px;padding:0 22px;
  transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.cas-faq--textura .cas-faq-item:last-child{margin-bottom:0}
.cas-faq--textura .cas-faq-item:hover{
  border-color:var(--cas-oro);
  box-shadow:0 6px 22px rgba(20,20,23,.08);
  transform:translateY(-1px);
}
.cas-faq--textura .cas-faq-item[open]{
  border-color:var(--cas-oro);
  box-shadow:0 10px 30px rgba(20,20,23,.10);
  background:rgba(255,255,255,.92);
}
.cas-faq--textura .cas-faq-item[open] summary{color:var(--cas-oro-oscuro)}
.cas-faq--textura .cas-faq-item p{padding-right:34px}

/* En tono oscuro las tarjetas se invierten */
.cas--oscuro.cas-faq--textura::before{
  background-image:radial-gradient(circle,rgba(255,255,255,.10) 1px,transparent 1px);
}
.cas--oscuro.cas-faq--textura .cas-faq-item{background:rgba(23,23,27,.72)}
.cas--oscuro.cas-faq--textura .cas-faq-item[open]{background:rgba(23,23,27,.92)}
.cas--oscuro.cas-faq--textura .cas-faq-item[open] summary{color:var(--cas-oro)}

@media (prefers-reduced-motion:reduce){
  .cas-faq--textura::after{animation:none}
  .cas-faq--textura .cas-faq-item{transition:none}
}
@media (max-width:767px){
  .cas-faq--textura .cas-faq-item{padding:0 16px}
  .cas-faq--textura .cas-faq-item p{padding-right:0}
}

/* --------------------------------------------------------------------------
   Botones flotantes: agendar cita y WhatsApp
   Fijos abajo a la derecha. En reposo son dos círculos; al pasar el cursor
   se abren y muestran la etiqueta, para que no tapen contenido mientras
   nadie los está usando.
   -------------------------------------------------------------------------- */
.cas-flotantes{
  position:fixed;right:20px;bottom:24px;z-index:9990;
  display:flex;flex-direction:column;gap:12px;align-items:flex-end;
  font-family:var(--cas-cuerpo);
}

.cas-flotante{
  display:flex;align-items:center;gap:0;
  height:56px;padding:0;border-radius:100px;
  text-decoration:none;overflow:hidden;
  box-shadow:0 6px 20px rgba(10,10,11,.28);
  transition:gap .25s ease,padding .25s ease,box-shadow .25s ease,transform .2s ease;
}
.cas-flotante:hover,.cas-flotante:focus-visible{
  gap:12px;padding-right:22px;
  box-shadow:0 10px 28px rgba(10,10,11,.36);
  transform:translateY(-2px);
}
.cas-flotante:focus-visible{outline:3px solid var(--cas-oro-claro);outline-offset:3px}

.cas-flotante__icono{
  flex:0 0 auto;width:56px;height:56px;
  display:flex;align-items:center;justify-content:center;
}
.cas-flotante__icono svg{
  width:26px;height:26px;
  fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
/* El logo de WhatsApp es de relleno, no de trazo */
.cas-flotante__wa-svg{fill:currentColor!important;stroke:none!important}

.cas-flotante__texto{
  max-width:0;opacity:0;white-space:nowrap;
  font-size:14px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  transition:max-width .25s ease,opacity .2s ease;
}
.cas-flotante:hover .cas-flotante__texto,
.cas-flotante:focus-visible .cas-flotante__texto{max-width:200px;opacity:1}

.cas-flotante--cita{background:var(--cas-oro);color:#0A0A0B}
.cas-flotante--cita:hover{background:var(--cas-oro-claro);color:#0A0A0B}
.cas-flotante--wa{background:#25D366;color:#07331A}
.cas-flotante--wa:hover{background:#1EBE5B;color:#07331A}

/* Pulso muy tenue en WhatsApp para que se note sin molestar */
.cas-flotante--wa::before{
  content:"";position:absolute;inset:0;border-radius:100px;
  box-shadow:0 0 0 0 rgba(37,211,102,.55);
  animation:cas-pulso 2.8s ease-out infinite;
}
.cas-flotante{position:relative}
@keyframes cas-pulso{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}
  70%{box-shadow:0 0 0 14px rgba(37,211,102,0)}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}
}

@media (prefers-reduced-motion:reduce){
  .cas-flotante::before{animation:none}
  .cas-flotante{transition:none}
}

/* Móvil: círculos algo más chicos y levantados por encima de la barra
   inferior de Woodmart, que si no los tapa. */
@media (max-width:767px){
  .cas-flotantes{right:14px;bottom:18px;gap:10px}
  .cas-flotante,.cas-flotante__icono{height:52px}
  .cas-flotante__icono{width:52px}
  .cas-flotante__texto{display:none}
  .cas-flotante:hover,.cas-flotante:focus-visible{padding-right:0;gap:0}
}
body.sticky-toolbar-on .cas-flotantes{bottom:calc(18px + var(--wd-sticky-toolbar-h,54px))}
@media (min-width:768px){
  body.sticky-toolbar-on .cas-flotantes{bottom:24px}
}

/* --------------------------------------------------------------------------
   Contact Form 7 dentro de una caja del sistema
   CF7 arma cada campo como <p><label>…</label><br><span><input></span></p>.
   Ese <br> más el gap del contenedor flex daba doble separación: por eso
   el formulario se veía tan aireado. Aquí se neutraliza el <br>, se
   define la rejilla de dos columnas que usa el formulario y se arregla
   el select, al que el tema le imponía un alto que cortaba el texto.
   -------------------------------------------------------------------------- */

/* Rejilla de campos */
.wpcf7-form .cas-campos{display:grid;gap:0 18px;grid-template-columns:1fr}
.wpcf7-form .cas-campos--2{grid-template-columns:1fr 1fr}
.wpcf7-form .cas-campos--3{grid-template-columns:repeat(3,1fr)}

/* Un campo = etiqueta arriba, control abajo. Sin flex ni gap extra. */
.wpcf7-form .cas-campo{
  display:block!important;
  margin:0 0 18px!important;
  gap:0!important;
}
.wpcf7-form .cas-campo > br{display:none}

.wpcf7-form .cas-campo > label,
.wpcf7-form > p > label{
  display:block;margin:0 0 7px;
  font-size:11.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--texto-2);line-height:1.4;
}

.wpcf7-form .wpcf7-form-control-wrap{display:block;width:100%}

/* Controles: mismo alto y mismo aire en todos */
.wpcf7-form input[type=text],
.wpcf7-form input[type=tel],
.wpcf7-form input[type=email],
.wpcf7-form input[type=date],
.wpcf7-form select,
.wpcf7-form textarea{
  width:100%;max-width:100%;box-sizing:border-box;
  min-height:50px;height:auto;
  padding:13px 16px;
  background:var(--fondo);
  border:1px solid var(--borde);border-radius:4px;
  color:var(--texto);font-family:var(--cas-cuerpo);font-size:16px;line-height:1.4;
  transition:border-color .2s ease;
}
.wpcf7-form textarea{min-height:130px;resize:vertical}
.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus{outline:none;border-color:var(--cas-oro)}

/* El select traía un alto fijo del tema que cortaba la opción por la
   mitad. Se le quita la flecha nativa y se dibuja una propia. */
.wpcf7-form select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:42px;cursor:pointer;
  background-image:
    linear-gradient(45deg,transparent 50%,currentColor 50%),
    linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 22px) calc(50% + 1px),calc(100% - 16px) calc(50% + 1px);
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
}
.wpcf7-form select option{color:#16161A;background:#fff}

/* Botón de envío */
.wpcf7-form .wpcf7-submit,
.wpcf7-form input[type=submit]{
  min-height:0;width:auto;margin-top:4px;
  padding:16px 34px;
  background:var(--cas-oro);color:#0A0A0B;border:0;border-radius:4px;
  font-family:var(--cas-cuerpo);font-size:14px;font-weight:700;
  letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;
  transition:background .2s ease;
}
.wpcf7-form .wpcf7-submit:hover{background:var(--cas-oro-claro)}

/* El último campo antes del botón no necesita el margen de abajo */
.wpcf7-form > p:last-of-type{margin-bottom:0}
.wpcf7-form .wpcf7-spinner{margin:0 0 0 12px;vertical-align:middle}

@media (max-width:600px){
  .wpcf7-form .cas-campos--2,
  .wpcf7-form .cas-campos--3{grid-template-columns:1fr}
  .wpcf7-form .wpcf7-submit{width:100%}
}

/* --------------------------------------------------------------------------
   El bloque de contacto envuelve el formulario en .cas-form--contacto, que
   es una rejilla del sistema. CF7 ya maneja su propio espaciado con los <p>
   de cada campo, así que aquí la rejilla estorba: se anula.
   -------------------------------------------------------------------------- */
.cas-form--contacto{display:block!important;gap:0!important}
.cas-form--contacto .wpcf7{margin:0}

/* Refuerzo del select: sin esto el navegador le calcula un alto propio y
   corta la opción por la mitad. */
.wpcf7-form select,
select.wpcf7-select{
  min-height:50px!important;
  height:auto!important;
  line-height:1.4!important;
  padding:13px 42px 13px 16px!important;
  font-size:16px;
  color:var(--texto,#16161A);
}

/* --------------------------------------------------------------------------
   Hero con pase de fondos
   Tres fotos superpuestas que se funden entre sí en bucle, cada una con un
   zoom lentísimo (Ken Burns) para que la imagen nunca esté del todo quieta.
   Encima va el velo degradado que mantiene legible el texto, y un paralaje
   suave que sigue el cursor.
   -------------------------------------------------------------------------- */
.cas-hero--pase{position:relative;overflow:hidden;background-image:none}

.cas-hero__fondos{
  position:absolute;inset:0;z-index:0;
  /* el paralaje del cursor entra por estas dos variables */
  transform:translate3d(calc(var(--cas-mx,0) * -14px),calc(var(--cas-my,0) * -10px),0);
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}

.cas-hero__fondo{
  position:absolute;inset:-3%;
  background-size:cover;background-position:center;
  opacity:0;
  animation:cas-pase 21s linear infinite,cas-zoom 21s ease-in-out infinite;
  animation-delay:calc(var(--i) * 7s);
}
@keyframes cas-pase{
  0%     {opacity:0}
  3%     {opacity:1}
  30%    {opacity:1}
  36%    {opacity:0}
  100%   {opacity:0}
}
@keyframes cas-zoom{
  0%   {transform:scale(1.06)}
  36%  {transform:scale(1.14)}
  100% {transform:scale(1.06)}
}

/* Velo: mismo degradado lateral que usa el hero de una sola foto */
.cas-hero__velo{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,
    rgba(10,10,11,.94) 0%,
    rgba(10,10,11,.72) 45%,
    rgba(10,10,11,.35) 100%);
}
.cas-hero--pase > .cas-wrap{position:relative;z-index:2}

/* Sin animación para quien la tenga desactivada: se deja la primera foto fija */
@media (prefers-reduced-motion:reduce){
  .cas-hero__fondo{animation:none;opacity:0;transform:scale(1.02)}
  .cas-hero__fondo:first-child{opacity:1}
  .cas-hero__fondos{transition:none;transform:none!important}
}

/* En móvil no hay cursor y el pase largo gasta batería: se acorta el
   recorrido del zoom y se anula el paralaje. */
@media (max-width:767px){
  .cas-hero__fondos{transform:none!important}
  .cas-hero__fondo{inset:0}
}

/* --------------------------------------------------------------------------
   Selects del sitio (formulario de citas y cualquier otro dentro de una
   sección). Mismo problema que tenía el de contacto: sin alto propio el
   navegador se lo calcula y corta la opción por la mitad. Se les fija un
   alto mínimo igual al de los inputs y se les dibuja la flecha, que al
   quitar la apariencia nativa desaparece.
   -------------------------------------------------------------------------- */
.cas-seccion select{
  min-height:50px;
  height:auto;
  line-height:1.4;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding:13px 42px 13px 16px;
  cursor:pointer;
  background-image:
    linear-gradient(45deg,transparent 50%,currentColor 50%),
    linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 22px) calc(50% + 1px),calc(100% - 16px) calc(50% + 1px);
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
}
.cas-seccion select option{color:#16161A;background:#fff}

/* Deshabilitado: mientras no se elige fecha, el campo de hora no aplica */
.cas-seccion select:disabled{
  opacity:.6;cursor:not-allowed;
  background-color:var(--sup);
}

/* El aviso de horas va pegado al campo, no suelto */
.cas-form__aviso-horas{
  margin:8px 0 0;font-size:14px;color:var(--texto-2);
}
.cas-form__aviso-horas[hidden]{display:none}

/* --------------------------------------------------------------------------
   Mapa de la ubicación
   El iframe de Google viene en blanco y con sus propios colores; se le pone
   marco del sistema y se lo desatura un poco para que no grite al lado del
   resto de la página.
   -------------------------------------------------------------------------- */
.cas-mapa{
  position:relative;
  height:var(--cas-mapa-alto,440px);
  border:1px solid var(--borde);
  border-radius:8px;
  overflow:hidden;
  box-shadow:var(--sombra);
  background:var(--sup);
}
.cas-mapa iframe{
  display:block;width:100%;height:100%;border:0;
  filter:grayscale(.35) contrast(1.05);
  transition:filter .3s ease;
}
.cas-mapa:hover iframe{filter:none}

@media (max-width:767px){
  .cas-mapa{height:min(var(--cas-mapa-alto,440px),320px)}
  .cas-mapa iframe{filter:none}
}

/* ==========================================================================
   Correcciones solicitadas por el cliente — agosto 2026
   ========================================================================== */

/* --- 4. Comparativa: la columna de procesos era ilegible ------------------
   Las etiquetas salían en Anton, que es condensada y pensada para títulos
   grandes; a 14px se empastan. Pasan a Barlow, que es la de lectura, con
   más interlineado y sin cortar a una sola línea. */
.cas-tabla tbody th{
  font-family:var(--cas-cuerpo)!important;
  font-size:15px;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  line-height:1.35;
  white-space:normal;      /* antes nowrap: forzaba la columna a lo ancho */
  min-width:230px;
  padding-top:14px;
  padding-bottom:14px;
}
/* Las cabeceras de nivel sí conservan la display, pero se les da aire */
.cas-tabla thead th{line-height:1.3;padding-top:18px;padding-bottom:14px}
.cas-tabla thead th span{margin-bottom:6px}

/* --- 5. Contador de productos en la barra de categorías ------------------
   Refuerzo de la opción del tema, por si algún widget la vuelve a pintar. */
.wd-nav-product-cat .nav-link-count,
.wd-nav-product-cat.has-product-count .nav-link-count{display:none!important}

/* --- 17. Botones flotantes sobre el carrito ------------------------------
   Tapaban el subtotal y "Finalizar compra" del carrito lateral. Cuando hay
   un panel lateral abierto (carrito, cuenta, filtros) se apartan. */
/* Woodmart no marca el body: pone .wd-opened en el propio panel y
   .wd-close-side-opened en la capa que lo cubre. Un observador del child
   theme traduce eso a una clase en el body, que es lo que se puede usar
   desde aquí. */
body.cas-lateral-abierto .cas-flotantes{
  opacity:0;
  visibility:hidden;
  transform:translateX(24px);
  pointer-events:none;
  transition:opacity .2s ease,transform .25s ease,visibility .2s;
}
/* En carrito y checkout no estorban: ahí el visitante ya está comprando */
body.woocommerce-cart .cas-flotantes,
body.woocommerce-checkout .cas-flotantes{display:none}

/* --------------------------------------------------------------------------
   Checkout y carrito
   Los campos de WooCommerce viven fuera de .cas-seccion, así que no heredan
   el sistema. Se alinean aquí para que el proceso de compra no parezca de
   otro sitio.
   -------------------------------------------------------------------------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout .select2-container .select2-selection--single{
  font-family:var(--cas-cuerpo);
  font-size:15.5px;
  border-radius:4px;
  border-color:var(--cas-borde-c);
  min-height:48px;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
  border-color:var(--cas-oro);
  outline:none;
}
.woocommerce form .form-row label{
  font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--cas-texto2-c);margin-bottom:6px;
}
.woocommerce form .form-row .required{color:var(--cas-oro-oscuro);text-decoration:none}

/* Referencia de entrega: es el campo que de verdad ubica una casa aquí,
   así que se le da altura para escribir de corrido. */
.cas-campo-referencia textarea{min-height:96px!important;resize:vertical}
.cas-campo-referencia .description,
.woocommerce form .form-row .description{
  font-size:13.5px;color:var(--cas-texto2-c);margin-top:6px;
}

/* Títulos del checkout con la display de marca */
.woocommerce-checkout h3,
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
.woocommerce-checkout-review-order h3,
.cart_totals h2{
  font-family:var(--cas-display);font-weight:400;
  text-transform:uppercase;letter-spacing:.5px;
}

/* Opciones de entrega: que se lean como una elección, no como letra chica */
.woocommerce-checkout #shipping_method li{
  padding:10px 0;font-size:15.5px;
}
.woocommerce-checkout #shipping_method label{
  text-transform:none;letter-spacing:0;font-size:15.5px;font-weight:600;
  color:var(--cas-texto-c);
}

/* --------------------------------------------------------------------------
   Barra de anclas con siete niveles
   Estaba pensada para cinco: cada acceso ocupaba lo que midiera su nombre y
   con siete el último se salía del ancho, escondido tras un scroll que casi
   nadie usa. Ahora los siete se reparten el ancho en partes iguales y el
   nombre baja a dos líneas cuando hace falta.
   -------------------------------------------------------------------------- */
@media (min-width:1025px){
  .cas-anclas__lista{overflow:visible}
  .cas-anclas .cas-ancla{
    flex:1 1 0;
    min-width:0;
    padding:16px 14px;
    gap:9px;
    font-size:13px;
    line-height:1.25;
    white-space:normal;   /* antes nowrap: forzaba una sola línea muy ancha */
    align-items:center;
  }
  .cas-anclas .cas-ancla__num{font-size:17px;flex:0 0 auto}
}

/* Abajo de 1025 se conserva el desplazamiento lateral, que ahí sí es
   el gesto natural, pero con una pista de que hay más a la derecha. */
@media (max-width:1024px){
  .cas-anclas__lista{
    -webkit-overflow-scrolling:touch;
    mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
  }
  .cas-anclas .cas-ancla{padding:18px 18px;font-size:13.5px}
}

/* ---------------------------------------------------------------------------
   Consulta de cita por folio
   -------------------------------------------------------------------------*/

.cas-form--consulta{max-width:640px;margin:0 auto;}

.cas-consulta__aviso{
	max-width:640px;
	margin:22px auto 0;
	text-align:center;
}

.cas-consulta{
	max-width:640px;
	margin:28px auto 0;
	text-align:center;
}

/* La pastilla de estado: dorada por defecto, verde si ya quedó cerrada,
   apagada si se canceló. */
.cas-consulta__estado{
	display:inline-block;
	background:var(--cas-oro);
	color:var(--cas-negro);
	font-family:var(--cas-display);
	font-size:.8rem;
	letter-spacing:.12em;
	text-transform:uppercase;
	padding:8px 18px;
	border-radius:100px;
	margin:0 0 18px;
}

.cas-consulta__estado--confirmada{background:#1F9D55;color:#fff;}
.cas-consulta__estado--atendida{background:#2C3338;color:#fff;}
.cas-consulta__estado--cancelada{background:#B32D2E;color:#fff;}

.cas-consulta__cuando{
	font-family:var(--cas-display);
	font-size:clamp(1.5rem,4vw,2.1rem);
	line-height:1.2;
	text-transform:uppercase;
	margin:0 0 6px;
}

.cas-consulta__cuando span{
	display:block;
	font-size:.55em;
	color:var(--cas-oro-oscuro);
}

.cas-consulta__nota{
	font-size:1rem;
	line-height:1.6;
	margin:0 0 6px;
	opacity:.85;
}

.cas-consulta__datos{
	margin:24px 0 0;
	padding:20px 0 0;
	border-top:1px solid rgba(0,0,0,.1);
	text-align:left;
}

.cas-consulta__datos > div{
	display:flex;
	justify-content:space-between;
	gap:16px;
	padding:10px 0;
	border-bottom:1px solid rgba(0,0,0,.07);
}

.cas-consulta__datos dt{
	font-size:.72rem;
	letter-spacing:.1em;
	text-transform:uppercase;
	opacity:.6;
	margin:0;
}

.cas-consulta__datos dd{margin:0;font-weight:600;text-align:right;}

.cas--oscuro .cas-consulta__datos,
.cas--oscuro .cas-consulta__datos > div{border-color:rgba(255,255,255,.14);}

.cas-consulta .cas-boton-wa{margin-top:22px;}

@media (max-width:560px){
	.cas-consulta__datos > div{flex-direction:column;gap:4px;}
	.cas-consulta__datos dd{text-align:left;}
}

/* La consulta es una sola tarjeta: se centra entera, no solo la caja. */
.cas-form--consulta{text-align:center;}

.cas-form--consulta .cas-form__fila{
	text-align:left;
	justify-content:center;
}

/* El botón no necesita ocupar todo el ancho del formulario. */
.cas-form--consulta .cas-boton-oro{
	min-width:220px;
	margin-top:6px;
}

/* El título del mensaje de estado, encima del texto. */
.cas-consulta__titulo{
	font-family:var(--cas-display);
	font-size:clamp(1.25rem,3vw,1.7rem);
	line-height:1.2;
	text-transform:uppercase;
	color:var(--cas-oro-oscuro);
	margin:0 0 8px;
}

.cas--oscuro .cas-consulta__titulo{color:var(--cas-oro);}

/* ---------------------------------------------------------------------------
   Servicio a domicilio en el formulario de cita
   -------------------------------------------------------------------------*/

.cas-domicilio{
	border-left:3px solid var(--cas-oro);
	padding-left:18px;
	margin-top:4px;
}

.cas-domicilio__aviso{
	font-size:.95rem;
	line-height:1.55;
	margin:0 0 16px;
	opacity:.9;
}

.cas-domicilio__aviso strong{color:var(--cas-oro-oscuro);}
.cas--oscuro .cas-domicilio__aviso strong{color:var(--cas-oro);}

@media (max-width:600px){
	.cas-domicilio{padding-left:14px;}
}