/*
 * AMKHA — capa propia sobre el sistema visual de Envolve (envolve.css).
 *
 * 1. Tokens: cada variable lee un Color o Tipografía Global de Elementor
 *    (Ajustes del sitio), con el valor de la marca como respaldo.
 * 2. Sustitutos de lo que el tema traía de fuera (fuente Flaticon, Swiper,
 *    TweenMax): iconos SVG, base de carrusel y transiciones CSS.
 * 3. Formularios de Elementor Pro vestidos como los del tema.
 * 4. Componentes nuevos: WhatsApp flotante, visor de imágenes, accesibilidad.
 */

/* ==================================================================
   1. TOKENS
   ================================================================== */
:root{
  --amk-accent:       var(--e-global-color-primary, #E15901);
  --amk-accent-text:  var(--e-global-color-accent, #C24D00);
  --amk-accent-2:     var(--e-global-color-amkacc2, #F08A3E);
  --amk-accent-dark:  var(--e-global-color-amkaccd, #A84300);
  --amk-red:          var(--e-global-color-amkred, #DC4425);
  --amk-dark:         var(--e-global-color-secondary, #2F1C15);
  --amk-dark-2:       var(--e-global-color-amkdark2, #3A2319);
  --amk-dark-3:       var(--e-global-color-amkdark3, #4F3428);
  --amk-heading:      var(--e-global-color-amkhead, #2F1C15);
  --amk-ink:          var(--e-global-color-amkink, #2A1D18);
  --amk-text:         var(--e-global-color-text, #6F625B);
  --amk-text-strong:  var(--e-global-color-amktxt2, #5A4E48);
  --amk-text-on-dark: var(--e-global-color-amktxtd, #D8C8BE);
  --amk-light:        var(--e-global-color-amklight, #FBF5F0);
  --amk-light-2:      var(--e-global-color-amklight2, #F6ECE3);
  --amk-border:       var(--e-global-color-amkborde, #EEE3DA);
  --amk-border-2:     var(--e-global-color-amkborde2, #E2D3C7);
  /* sombras tonales: el negro del tema pasa a café */
  --amk-shadow-rgb: 47, 28, 21;
  --amk-font-h: var(--e-global-typography-primary-font-family, "Fira Sans"), sans-serif;
  --amk-font-b: var(--e-global-typography-text-font-family, "Barlow"), sans-serif;
  /* degradado de marca: naranja del logo al naranja claro */
  --amk-grad: linear-gradient(90deg, var(--amk-accent) 16%, var(--amk-accent-2) 100%);
  --amk-cabecera: 0px;
}

h1,h2,h3,h4,h5,h6{ font-family:var(--amk-font-h); color:var(--amk-heading); }
::selection{ background:var(--amk-accent); color:#fff; }

/* ==================================================================
   2. ICONOS
   ================================================================== */
.amk-ico{ display:inline-block; width:1em; height:1em; vertical-align:-.125em;
  stroke-width:var(--amk-ico-trazo, 1.6); overflow:visible; }
.amk-ico--marca{ stroke:none; }
/* Iconos grandes: trazo más fino, como los de línea del tema */
.feature-block-one .icon .amk-ico, .process-block-one .icon .amk-ico,
.funfacts-section .icon .amk-ico, .contact-info-block .icon .amk-ico,
.feature-block-two .icon .amk-ico, .live-contact .icon .amk-ico,
.about-section .text-block .icon .amk-ico, .testimonial-block .icon .amk-ico,
.map-section .icon-box .amk-ico{ --amk-ico-trazo:1.3; }
/* Los iconos de biblioteca de Elementor (SVG en línea) heredan el color */
.e-font-icon-svg.amk-ico{ fill:currentColor; stroke:none; }

/* Glifos de la fuente Flaticon (no se carga) => máscaras SVG */
.map-section .owl-theme .owl-nav .owl-prev::before,
.map-section .owl-theme .owl-nav .owl-next::before,
.why-choose-us-section .single-feature-item::before{
  font-family:inherit !important; content:"" !important;
  -webkit-mask:var(--amk-mask) center / var(--amk-mask-size, 40%) no-repeat;
          mask:var(--amk-mask) center / var(--amk-mask-size, 40%) no-repeat;
  background-color:currentColor;
}
/* Banner: el ::after es el círculo con borde blanco del tema; solo se le quita
   el glifo y la flecha se pinta en el <span> del botón */
.banner-section .owl-theme .owl-nav .owl-prev::after,
.banner-section .owl-theme .owl-nav .owl-next::after{ font-family:inherit !important; content:"" !important; }
.banner-section .owl-theme .owl-nav button span{ display:block; position:absolute; left:23px; top:23px; width:24px; height:24px; z-index:2;
  background-color:#fff; -webkit-mask:var(--amk-flecha) center/100% no-repeat; mask:var(--amk-flecha) center/100% no-repeat; }
.banner-section .owl-theme .owl-nav .owl-prev span{ transform:rotate(180deg); }
:root{ --amk-flecha:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M14 6l6 6-6 6'/%3E%3C/svg%3E"); }
.map-section .owl-theme .owl-nav .owl-prev::before,
.map-section .owl-theme .owl-nav .owl-next::before{
  --amk-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M14 6l6 6-6 6'/%3E%3C/svg%3E");
  --amk-mask-size:34%;
}
.why-choose-us-section .single-feature-item::before{
  --amk-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M7.5 12.2l3 3 6-6.4'/%3E%3C/svg%3E");
  --amk-mask-size:100%;
}

/* ==================================================================
   3. CARRUSELES (sustituyen a Owl y Swiper conservando sus clases)
   ================================================================== */
/* Owl oculta el carrusel hasta montarlo, y la página saltaba al aparecer el hero
   (CLS 0,8). Se muestra el primer slide desde el primer pintado */
.owl-carousel{ display:block; }
.owl-carousel:not(.owl-loaded) > *:not(:first-child){ display:none; }
.owl-carousel .owl-stage{ display:flex; will-change:transform; }
.owl-carousel .owl-item{ flex:0 0 auto; float:none; }
.amk-editando .owl-carousel .owl-stage{ transition:none !important; }

.swiper-container{ position:relative; overflow:hidden; z-index:1; }
.swiper-wrapper{ position:relative; display:flex; width:100%; height:100%; z-index:1;
  transition-property:transform; box-sizing:content-box; will-change:transform; }
.swiper-slide{ position:relative; flex-shrink:0; width:100%; height:100%; }
.testimonial-section .swiper-nav-button{ cursor:pointer; }

/* ==================================================================
   4. ANIMACIONES DE ENTRADA (WOW sin dependencias)
   ================================================================== */
.amk-js .wow:not(.animated){ visibility:hidden; }
.amk-editando .wow, .amk-editando .wow:not(.animated){ visibility:visible !important; animation:none !important; }
@media (prefers-reduced-motion: reduce){
  .amk-js .wow:not(.animated){ visibility:visible; }
  .wow, .animated{ animation:none !important; transition:none !important; }
  .owl-carousel .owl-stage, .swiper-wrapper{ transition:none !important; }
}

/* ==================================================================
   5. PRECARGA, CABECERA Y PANEL LATERAL (antes TweenMax)
   ================================================================== */
.loader-wrap{ transition:opacity .5s ease, visibility .5s ease; }
.loader-wrap.amk-fuera{ opacity:0; visibility:hidden; }
/* La cortina se retira con transform (no mueve el layout: CLS 0) */
.loader-wrap .layer .overlay{ transition:transform 1.2s cubic-bezier(.87, 0, .13, 1); will-change:transform; }
.loader-wrap.amk-cargado .layer .overlay{ transform:translateX(100%); }
.amk-editando .loader-wrap{ display:none !important; }

.hidden-sidebar{ right:-480px; transition:right .6s cubic-bezier(.87, 0, .13, 1); }
.hidden-sidebar:not(.close-sidebar){ right:0; }
@media (max-width:480px){ .hidden-sidebar{ right:-100%; } }
.nav-overlay{ transition:opacity .5s ease; opacity:0; }
.nav-overlay.amk-visible{ display:block; opacity:1; }
.hidden-sidebar .list-style-one a{ color:inherit; }
.hidden-sidebar .amk-ico{ color:var(--amk-accent); }

/* Botones del tema que en la demo eran imágenes */
.mobile-nav-toggler, .sidemenu-nav-toggler{ background:none; border:0; padding:0; color:inherit; }
.sidemenu-nav-toggler .amk-toggler{ display:flex; align-items:center; justify-content:center;
  width:50px; height:50px; border-radius:50%; background:var(--amk-grad); color:#fff; font-size:22px;
  box-shadow:0 10px 30px rgba(var(--amk-shadow-rgb), .18); }
.mobile-nav-toggler .amk-ico{ font-size:30px; color:var(--amk-heading); }

.main-header .navigation > li > a:focus-visible,
.theme-btn:focus-visible, a:focus-visible, button:focus-visible{
  outline:2px solid var(--amk-accent); outline-offset:3px; }

/* El menú marca la sección visible (scrollspy) igual que la página actual */
.main-header .navigation > li.current > a{ color:var(--amk-accent-text); }

/* Las anclas no quedan tapadas por la cabecera fija */
[id]{ scroll-margin-top:var(--amk-cabecera); }

/* ==================================================================
   6. FORMULARIOS DE ELEMENTOR PRO con el aspecto de Envolve
   ================================================================== */
.contact-form .elementor-form .elementor-field-group{ margin-bottom:0; }
.contact-form .elementor-form .elementor-field-group .elementor-field:not(.elementor-select-wrapper):not([type=checkbox]):not([type=radio]),
.contact-form .elementor-form .elementor-field-group .elementor-select-wrapper select{
  display:block; width:100%; height:54px; min-height:54px; padding:11px 20px;
  font-family:var(--amk-font-b); font-size:15px; line-height:30px; font-weight:600;
  color:var(--amk-text); background-color:transparent;
  border:1px solid var(--amk-border); border-radius:6px; box-shadow:none;
  transition:all 300ms ease 0s; }
.contact-form .elementor-form textarea.elementor-field{ height:120px; min-height:120px; resize:vertical; }
.contact-form-section .contact-form .elementor-form .elementor-field:not(.elementor-select-wrapper):not([type=checkbox]):not([type=radio]),
.contact-form-section .contact-form .elementor-form select{ height:56px; background-color:#fff; }
.contact-form-section .contact-form .elementor-form textarea.elementor-field{ height:120px; }
.contact-form .elementor-form .elementor-field::placeholder{ color:var(--amk-text); opacity:1; }
.contact-form .elementor-form .elementor-field:focus,
.contact-form .elementor-form select:focus{ border-color:var(--amk-accent); outline:none;
  box-shadow:0 0 0 3px rgba(225, 89, 1, .14); }
.contact-form .elementor-form .elementor-select-wrapper::before{ color:var(--amk-text); font-size:12px; right:20px; }
.contact-form .elementor-form .elementor-field-type-upload .elementor-field{ height:auto; min-height:56px;
  padding:14px 20px; border-style:dashed; cursor:pointer; background:var(--amk-light); }
.contact-form .elementor-form .elementor-field-label{ font-size:14px; font-weight:600; color:var(--amk-heading); margin-bottom:6px; }
.contact-form .elementor-form .elementor-message{ font-size:15px; font-weight:500; margin-top:14px; }
.contact-form .elementor-form .elementor-message.elementor-message-success{ color:#1e7a46; }
.contact-form .elementor-form .elementor-error .elementor-field{ border-color:var(--amk-red); }
.contact-form .elementor-form .elementor-field-group .elementor-field-subgroup{ font-size:14px; }

/* El botón de envío usa el estilo de botón del tema (btn-style-one/two) */
.contact-form .elementor-form .elementor-button{
  position:relative; display:inline-block; overflow:hidden; border:0; border-radius:30px;
  padding:10px 50px; min-height:0; font-family:var(--amk-font-h); font-size:16px; line-height:30px;
  font-weight:600; text-transform:none; color:#fff; background:var(--amk-accent-text);
  box-shadow:rgba(var(--amk-shadow-rgb), .2) 0 0 50px 0; transition:all .3s ease; }
.contact-form .elementor-form .elementor-button::before{ content:""; position:absolute; inset:0;
  background:var(--amk-grad); opacity:0; transition:opacity .3s ease; z-index:0; }
.contact-form .elementor-form .elementor-button > *{ position:relative; z-index:1; }
.contact-form .elementor-form .elementor-button:hover{ background:var(--amk-dark); color:#fff; }
.contact-form .elementor-form .elementor-button:focus-visible{ outline:2px solid var(--amk-accent); outline-offset:3px; }
/* Variante clara (formulario flotante de "por qué elegirnos"): blanca con texto naranja */
.consult-form .contact-form .elementor-form .elementor-button{ background:#fff; color:var(--amk-accent-text); }
.consult-form .contact-form .elementor-form .elementor-button:hover{ background:var(--amk-accent-text); color:#fff; }
.consult-form .amk-agenda{ display:inline-flex; align-items:center; gap:8px; margin-top:10px;
  font-size:16px; font-weight:600; line-height:50px; color:var(--amk-heading); position:relative; }
.consult-form .amk-agenda::before{ content:""; position:absolute; left:2px; right:0; bottom:8px; border-bottom:2px dashed var(--amk-heading); }
.contact-form .amk-sin-form{ padding:24px; border:1px dashed var(--amk-border-2); border-radius:6px;
  color:var(--amk-text); font-size:15px; text-align:center; }

/* ==================================================================
   7. COMPONENTES PROPIOS
   ================================================================== */
/* WhatsApp flotante: visible en toda la página, como pide el brief */
.amk-whatsapp{ position:fixed; left:30px; bottom:30px; z-index:998; display:flex; align-items:center; gap:12px;
  padding:0 22px 0 0; height:58px; border-radius:30px; background:#25D366; color:#fff;
  font-family:var(--amk-font-h); font-weight:600; font-size:15px; text-decoration:none;
  box-shadow:0 12px 30px rgba(18, 140, 70, .35); transition:transform .3s ease, box-shadow .3s ease; }
.amk-whatsapp:hover{ color:#fff; text-decoration:none; transform:translateY(-3px); box-shadow:0 16px 36px rgba(18, 140, 70, .45); }
.amk-whatsapp__icono{ display:flex; align-items:center; justify-content:center; width:58px; height:58px;
  border-radius:50%; background:#1EBE5A; font-size:28px; }
.amk-whatsapp__icono::after{ content:""; position:absolute; left:0; top:0; width:58px; height:58px; border-radius:50%;
  border:2px solid #25D366; animation:amk-pulso 2.4s ease-out infinite; }
@keyframes amk-pulso{ 0%{ transform:scale(1); opacity:.7 } 100%{ transform:scale(1.6); opacity:0 } }
@media (max-width:767px){
  .amk-whatsapp{ left:16px; bottom:16px; padding:0; }
  .amk-whatsapp__texto{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce){ .amk-whatsapp__icono::after{ animation:none; } }

/* Visor de imágenes (galería de instalaciones y pie) */
.amk-visor{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center;
  padding:40px; background:rgba(var(--amk-shadow-rgb), .92); opacity:0; visibility:hidden; transition:all .3s ease; }
.amk-visor.abierto{ opacity:1; visibility:visible; }
.amk-visor img{ max-width:100%; max-height:86vh; border-radius:6px; box-shadow:0 20px 60px rgba(0,0,0,.4); }
.amk-visor__cerrar{ position:absolute; top:20px; right:24px; width:48px; height:48px; border:0; border-radius:50%;
  background:rgba(255,255,255,.1); color:#fff; font-size:22px; cursor:pointer; }
.amk-visor__cerrar:hover{ background:var(--amk-accent); }

.amk-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Contenedores de Elementor que alojan una sección: sin márgenes propios */
/* El relleno de 10 px lo pone cada contenedor (editable en Elementor), como el gap de la demo */
.e-con.amk-seccion{ gap:0 !important; }
.e-con.amk-seccion > .e-con-inner{ gap:0 !important; max-width:none !important; }
.amk-seccion > .elementor-widget{ width:100%; }

/* Pie: el logotipo es claro sobre fondo café */
.main-footer .footer-logo img{ max-height:70px; width:auto; }

/* Velo del slider: las fotos de la cocina son claras y el texto es blanco */
.banner-carousel .slide-item .image-layer::after{ content:""; position:absolute; inset:0; background-color:rgba(36, 21, 15, .62); }
.banner-carousel .slide-item .image-layer{ background-size:cover; background-position:center; }

/* La demo usa un glifo de fuente que alarga la línea a 28 px; el icono SVG no */
.header-top .contact-info li{ min-height:28px; display:flex; align-items:center; }

/* ==================================================================
   8. AJUSTES DE LAS SECCIONES
   ================================================================== */
/* Botones de volver arriba: en la demo eran <div>, aquí <button> accesibles */
.scroll-to-top, .scroll-to-top-two{ border:0; font:inherit; }
.scroll-to-top{ display:none; }
.scroll-to-top.amk-visible{ display:block; }
/* (el tema ya gira el botón -90°: el icono no se gira) */
.scroll-to-top-two{ background:none; color:inherit; padding:0; cursor:pointer; }

/* Formularios: el diseño usa marcadores; las etiquetas siguen para lectores de
   pantalla. La del adjunto se ve, porque un selector de archivo no tiene marcador */
.contact-form .elementor-field-group > .elementor-field-label{ position:absolute !important; width:1px; height:1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.contact-form .elementor-field-type-upload > .elementor-field-label,
.contact-form .elementor-field-type-date > .elementor-field-label{ position:static !important; width:auto; height:auto;
  clip:auto; white-space:normal; }

/* Tarjetas con enlace en toda su superficie */
.feature-block-two .inner-box{ position:relative; }
.amk-enlace-extendido{ color:inherit; }
.amk-enlace-extendido::after{ content:""; position:absolute; inset:0; z-index:2; }
.amk-enlace-tarjeta{ display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-weight:600; color:var(--amk-accent-text); }
.amk-enlace-tarjeta:hover{ color:var(--amk-accent-dark); text-decoration:none; }

/* Iconos dentro de botones y enlaces */
.theme-btn .btn-title i, .main-footer .link-btn .theme-btn i{ display:inline-flex; margin-right:8px; vertical-align:-2px; }
.amk-ico-boton{ margin-right:8px; }
.rating .amk-media{ clip-path:inset(0 50% 0 0); }

/* Nosotros: la insignia es un icono dentro del círculo de 130 px (37 px en la demo)
   y la "firma" admite un logotipo, limitado al alto de la firma original */
.about-section .logo img{ width:46px; height:auto; vertical-align:middle; }
.about-section .author-box .signature img{ max-height:60px; width:auto; }

/* Equivalente al .page-wrapper{overflow:hidden} de la demo: recorta por los lados
   lo que sobresale a propósito (carril de imágenes de la filosofía, figura del CTA),
   sin cortar los solapamientos verticales entre secciones */
.amk-onepage .elementor[data-elementor-type="wp-page"]{ overflow-x:clip; }

/* ==================================================================
   9. CORRECCIONES TRAS LA REVISIÓN VISUAL DE LA FASE 3
   ================================================================== */
/* Grosor de los iconos de línea según su tamaño: en la demo, los iconos grandes
   son de trazo fino (~2 px), y el trazo de un SVG escala con su tamaño */
.process-block-one .icon .amk-ico, .feature-block-two .icon .amk-ico, .live-contact .icon .amk-ico{ --amk-ico-trazo:.65; }
.funfacts-section .icon .amk-ico, .contact-info-block .icon .amk-ico, .testimonial-block .icon .amk-ico,
.about-section .text-block .icon .amk-ico, .map-section .icon-box .amk-ico{ --amk-ico-trazo:1; }

/* Por qué elegirnos: el check era un glifo de fuente, sin caja propia */
.why-choose-us-section .single-feature-item::before{ width:50px; height:50px; }

/* Servicios: el tema fija line-height:54px para frases de una línea; con textos
   más largos se conserva el mismo alto por línea única y el salto queda natural */
.pricing-block .lower-content ul li{ line-height:1.5; padding-top:13.5px; padding-bottom:13.5px; }
.pricing-block .lower-content ul li i .amk-ico{ vertical-align:-3px; }
.pricing-section .wrapper-box .row{ align-items:stretch; }
.pricing-section .pricing-block .inner-box{ height:100%; }

/* Cifras: tarjetas de igual altura */
.fact-counter .row{ align-items:stretch; }
.fact-counter .counter-column .inner{ height:100%; }

/* Filosofía: Elementor carga la fuente swiper-icons y añade su propia flecha */
.testimonial-section .swiper-button-next::after, .testimonial-section .swiper-button-prev::after{ display:none; }
.testimonial-section .swiper-button-next, .testimonial-section .swiper-button-prev{ position:absolute; border:0; cursor:pointer; }
.testimonial-section .swiper-button-next{ right:0; } .testimonial-section .swiper-button-prev{ left:0; }
/* El panel se ajusta a su caja (en la demo, la foto naranja casaba con el color de fondo) */
.testimonial-section .testimonial-content{ background-size:cover; background-position:center; }

/* Contacto: iconos del tamaño de las imágenes de la demo y correos largos que no se salen */
.contact-info-block .icon{ font-size:50px; line-height:1; color:var(--amk-accent); }
.contact-info-block ul li, .contact-info-block ul li a{ overflow-wrap:anywhere; }
/* Tarjeta de WhatsApp: velo para que el texto blanco se lea sobre la foto clara */
.contact-form-section .live-contact .image{ position:relative; }
.contact-form-section .live-contact .image::after{ content:""; position:absolute; inset:0; border-radius:6px;
  background:linear-gradient(180deg, rgba(36,21,15,.15) 0%, rgba(36,21,15,.55) 40%, rgba(36,21,15,.92) 100%); }
.contact-form-section .live-contact .content{ z-index:2; }

/* Pie: las miniaturas se generan a 2x para retina y se muestran al tamaño de la demo */
.instagram-widget .wrapper-box .image img{ width:85px; height:75px; object-fit:cover; }

/* ==================================================================
   10. CONTRASTE AA (auditado con _build/qa/contraste.mjs)
   La demo pone texto blanco sobre su acento con 3,38:1. Con el naranja del
   logo serían 3,73:1. Donde hay texto blanco sobre naranja se usa el naranja
   oscuro (4,82:1); el del logo sigue en gráficos, iconos y cifras grandes.
   ================================================================== */
.main-header .header-top .text span,
.btn-style-one,
.pricing-block.active .lower-content h5,
.pricing-block.active .lower-content h5::before,
.pricing-block.active .lower-content h5::after,
.cases-section .case-block-one .read-more-btn a,
.map-section .contact-info .inner-box{ background-color:var(--amk-accent-text); }
.btn-style-one{ background-image:none; }

/* Naranja sobre café: el claro (6,48:1) */
.main-header .header-top .text a,
.main-footer .logo-widget .link-btn .theme-btn{ color:var(--amk-accent-2); }

/* Filosofía: el fondo sólido de cada diapositiva tapaba el degradado del panel */
.testimonial-section .testimonial-block, .testimonial-section .testimonial-block .inner-box{ background-color:transparent; }
.testimonial-section .testimonial-content{ background-color:var(--amk-accent-text); }

/* Pestaña inactiva y cifras de las tarjetas de servicios */
.pricing-section .tab-btn-style-one .nav-link:not(.active){ color:var(--amk-text); }
.pricing-block .top-content .price{ color:var(--amk-accent-dark); }

/* WhatsApp: el icono es la marca (exento); la etiqueta va sobre un verde que cumple AA */
.amk-whatsapp{ background:#1B7F4B; box-shadow:0 12px 30px rgba(17, 94, 55, .35); }
.amk-whatsapp:hover{ background:#156B3E; }

/* Formulario flotante: Elementor estira el botón a su columna (50 %); con los 50 px
   de relleno lateral del tema el texto se partía en dos líneas */
.consult-form .contact-form .elementor-form .elementor-button{ padding:10px 28px; white-space:nowrap; }

/* Base de Swiper que el tema cargaba aparte: el carril se centra en su columna y,
   con margin-right:0 del tema, queda pegado al panel con la imagen anterior a la izquierda */
.swiper-container{ margin-left:auto; margin-right:auto; }

/* Contacto: tarjetas de igual altura */
.contact-details-section .row{ align-items:stretch; }
.contact-details-section .contact-info-block .inner-box{ height:calc(100% - 30px); }

/* Consentimiento: casilla y texto en la misma línea */
.contact-form .elementor-field-type-acceptance .elementor-field-subgroup{ display:flex; align-items:flex-start; }
.contact-form .elementor-field-type-acceptance .elementor-field-option{ display:flex; align-items:flex-start; gap:8px; }
.contact-form .elementor-field-type-acceptance input[type=checkbox]{ flex:0 0 auto; width:16px; height:16px; min-height:0; padding:0; margin:4px 0 0; accent-color:var(--amk-accent-text); }
.contact-form .elementor-field-type-acceptance label{ font-size:14px; line-height:1.5; color:var(--amk-text); }

/* Ficha del mapa: un solo tono (el contenedor exterior también) */
.map-section .contact-info{ background-color:var(--amk-accent-text); }

/* Editor: las tarjetas sobre el pie montan 90 px arriba y abajo y su caja quedaba
   en 2 px, imposible de seleccionar. Solo en el editor se anulan esos márgenes */
.amk-editando .feature-section-two{ margin-top:0; margin-bottom:0; }

/* ==================================================================
   11. NAVEGACIÓN Y ACCESIBILIDAD
   ================================================================== */
/* "Ir al contenido": Hello lo estilaba en su CSS (apagado); visible al recibir el foco */
.skip-link.screen-reader-text:focus{ position:fixed !important; top:12px; left:12px; z-index:1000000;
  width:auto; height:auto; clip:auto; overflow:visible; padding:12px 22px; border-radius:30px;
  background:var(--amk-dark); color:#fff; font-weight:600; text-decoration:none; box-shadow:0 10px 30px rgba(0,0,0,.25); }

/* WhatsApp abajo a la derecha (el "volver arriba" del tema queda encima) y aire
   al final del pie para que el botón no tape el texto */
.amk-whatsapp{ left:auto; right:30px; }
.scroll-to-top{ right:42px; bottom:110px; }
.main-footer .footer-bottom{ padding-bottom:70px; }
@media (max-width:767px){ .amk-whatsapp{ right:16px; left:auto; } .scroll-to-top{ right:18px; bottom:90px; } }

/* Página 404 */
.amk-error{ position:relative; padding:110px 0 120px; text-align:center; background:var(--amk-light); }
.amk-error__cifra{ font-family:var(--amk-font-h); font-weight:800; font-size:160px; line-height:1;
  background-image:url(../img/trama-lineas.svg); -webkit-background-clip:text; background-clip:text;
  color:transparent; margin-bottom:10px; }
.amk-error .sec-title h1{ font-size:40px; line-height:1.2em; font-weight:700; padding-bottom:30px; letter-spacing:-.5px; margin:0; }
.amk-error .sec-title .text-decoration{ margin:0 auto; }
.amk-error .btn-box .theme-btn{ margin:0 10px 12px; }
.amk-error__accesos{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 28px; padding:0; margin:30px 0 0; }
.amk-error__accesos a{ color:var(--amk-heading); font-weight:600; }
.amk-error__accesos a:hover{ color:var(--amk-accent-text); }
@media (max-width:767px){ .amk-error__cifra{ font-size:110px; } .amk-error .sec-title h1{ font-size:30px; } }

/* ==================================================================
   12. MÓVIL
   ================================================================== */
@media (max-width:767px){
  /* Los saltos de línea de los párrafos están pensados para escritorio; en móvil
     dejarían palabras sueltas. Los títulos conservan los suyos */
  .text br, .hint br, .bottom-content .text br{ display:none; }
  /* Firma de Nosotros: símbolo y nombre sin montarse */
  .about-section .author-box{ gap:14px; }
  .about-section .author-info{ margin-left:0; }
  .about-section .author-box .signature img{ max-height:44px; }
  /* Mapa: en la demo la ficha lo tapa entero en móvil; aquí va encima de la ficha */
  .map-section .map-outer{ position:relative; height:300px; }
  .map-section .google-map iframe{ height:300px !important; }
}

/* Logotipo del menú móvil: proporción original (el tema fija un ancho) */
.mobile-menu .nav-logo img{ width:auto; height:auto; max-width:220px; }

/* Logo del panel lateral: conserva su proporción */
.hidden-sidebar .wrapper-box .logo img{ width:auto; height:auto; max-width:100%; max-height:50px; }

/* Enlaces dentro de texto: no se distinguen solo por color (WCAG 1.4.1) */
.main-header .header-top .top-left .text a{ text-decoration:underline; text-underline-offset:3px; }

/* Misión / Visión / Valores en tablet y móvil: el tema esconde las flechas por
   debajo de 1139 px y el contenido del brief quedaría inalcanzable sin autoplay
   (p. ej. con «reducir movimiento»). Se muestran en el flujo, bajo el texto. */
.testimonial-section .testimonial-content{ touch-action:pan-y; }
@media only screen and (max-width: 1139px){
  .testimonial-section .testimonial-content .swiper-nav-button{ display:block !important; position:relative; left:auto; bottom:auto; width:120px; height:60px; margin-top:28px; }
  .testimonial-section .testimonial-content .swiper-nav-button .swiper-button-next,
  .testimonial-section .testimonial-content .swiper-nav-button .swiper-button-prev{ width:60px; height:60px; top:0; margin:0; }
  .testimonial-section .swiper-nav-button::after{ top:10px; }
}
