.elementor-4563 .elementor-element.elementor-element-564aaee{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS *//* ================================================================
   CALLORANGE.COM · LOCKSMITH IN TEMPE — HOME PREVIEW (pág. 4568)
   Hoja consolidada · reemplaza ~73 KB de parches acumulados
   ----------------------------------------------------------------
   REGLAS DE MARCA
   · Naranja #F5831F · Naranja oscuro #E06A00 · Azul tinta #14142B
   · Gris texto #6B7280 · Tipografías Outfit/Sora + Inter
   · JAMÁS verde en ningún estado
   · Botón naranja → hover blanco con texto naranja
     Botón blanco  → hover naranja/azul con texto blanco
   · Nada depende de JavaScript (el sitio elimina <script> al guardar)
   ================================================================ */

/* ---------- 0. TOKENS Y ANIMACIONES ---------- */
:root{
  --co-o:#F5831F; --co-o6:#E06A00; --co-navy:#14142B; --co-ink:#0E0E1F;
  --co-gray:#6B7280; --co-e:cubic-bezier(.23,1,.32,1);
}
@keyframes coReveal{ from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }
@keyframes coUpIn{ from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:none} }
@keyframes coWkIn{ from{opacity:0;transform:translateY(24px) scale(.985)} to{opacity:1;transform:none} }
@keyframes coCardIn{ from{opacity:0;transform:translateY(26px) scale(.985)} to{opacity:1;transform:none} }
@keyframes coCbarIn{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
@keyframes coIcoIn{ from{opacity:0;transform:translateY(9px) scale(.82) rotate(-6deg)} to{opacity:1;transform:none} }
@keyframes coOrangePulse{ 0%,100%{transform:scale(1) rotate(0)} 32%{transform:scale(1.18) rotate(-7deg)} 58%{transform:scale(.95) rotate(5deg)} }
@keyframes coOrangeBob{ 0%,100%{transform:translateY(0) rotate(0)} 30%{transform:translateY(-5px) rotate(-8deg)} 65%{transform:translateY(2px) rotate(5deg)} }
@keyframes coHalo{ 0%{transform:scale(.86);opacity:.65} 70%{transform:scale(1.22);opacity:0} 100%{opacity:0} }

/* ---------- 1. VISIBILIDAD GARANTIZADA + ENTRADAS SIN JS ----------
   Estos bloques quedaban en opacity:0 esperando un IntersectionObserver
   que el sitio borró. Base visible + animación scroll-driven opcional. */
.co-trust__wrap, .co-neighborhoods .co-hood-card, .co-rv__card,
.co-faq__item, .co-faq__media, .co-map__card, .coico,
.co-ee2__photo, .co-ee2__rating, .co-ee2__card, .co-ee2__stats,
.co-ee2__chips span, .co-wk__t, .co-cbar__i{
  opacity:1 !important; transform:none;
}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .co-trust__wrap, .co-neighborhoods .co-hood-card, .co-rv__card,
    .co-faq__item, .co-faq__media{
      animation:coReveal .6s var(--co-e) both !important;
      animation-timeline:view() !important; animation-range:entry 0% cover 30% !important; }
    .co-ee2__photo, .co-ee2__rating, .co-ee2__card, .co-ee2__stats{
      animation:coUpIn .85s var(--co-e) both !important;
      animation-timeline:view() !important; animation-range:entry 0% cover 26% !important; }
    .co-ee2__chips span{ animation:coUpIn .7s var(--co-e) both !important;
      animation-timeline:view() !important; animation-range:entry 6% cover 30% !important; }
    .co-wk__t{ animation:coWkIn .8s var(--co-e) both;
      animation-timeline:view(); animation-range:entry 0% cover 28%; }
    .co-map__card{ animation:coCardIn .8s var(--co-e) both;
      animation-timeline:view(); animation-range:entry 0% cover 30%; }
    .co-cbar__i{ animation:coCbarIn .6s var(--co-e) both;
      animation-timeline:view(); animation-range:entry 0% cover 22%; }
    .coico{ animation:coIcoIn .7s var(--co-e) both;
      animation-timeline:view(); animation-range:entry 5% cover 32%; }
  }
}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation:none !important; } }

/* ---------- 2. REGLA GLOBAL: JAMÁS VERDE ---------- */
.co-fs__toggle, .co-fs__det > summary, .co-fs__chip{
  background:linear-gradient(135deg,var(--co-o) 0%,#D96A0A 100%) !important; color:#fff !important; }
.co-fs__toggle *, .co-fs__det > summary *, .co-fs__chip *{ color:#fff !important; }
.co-fs__toggle svg{ stroke:#fff !important; }
.co-fs__kicker, .co-dist-label{ color:var(--co-o) !important; }
.co-cov__live, .co-cov__live *{ color:var(--co-o) !important; }
.co-cov__live{ background:rgba(245,131,31,.16) !important; border-color:rgba(245,131,31,.4) !important; }
.co-cov__live::before, .co-cov__live span:first-child{ background:var(--co-o) !important; }
.co-rv__ava{ background:linear-gradient(135deg,var(--co-o),#D96A0A) !important; color:#fff !important; }
.co-rv__ava:nth-of-type(2n){ background:linear-gradient(135deg,#2B2B52,var(--co-navy)) !important; }
.co-ft__badges > *{ color:var(--co-o) !important; border-color:rgba(245,131,31,.4) !important;
  background:rgba(245,131,31,.10) !important; }

/* ---------- 3. REGLA GLOBAL DE BOTONES ---------- */
.co-hero__cta, .co-frm__btn, .co-wk__cta, .co-aio__cta, .co-how__cta,
.co-fs__toggle, .co-fs__det > summary, .co-rv__all, .co-ft__callbtn,
.co-ft__cta--out a, button[type=submit], input[type=submit]{
  transition:background .22s ease, color .22s ease, border-color .22s ease,
             transform .2s var(--co-e), box-shadow .26s !important; }
/* naranja → hover blanco, texto naranja */
.co-hero__cta:hover, .co-frm__btn:hover, .co-wk__cta:hover, .co-aio__cta:hover,
.co-how__cta:hover, .co-fs__toggle:hover, .co-fs__det > summary:hover,
button[type=submit]:hover, input[type=submit]:hover{
  background:#fff !important; background-image:none !important; color:var(--co-o) !important;
  border:2px solid var(--co-o) !important; transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(245,131,31,.34) !important; }
.co-hero__cta:hover *, .co-frm__btn:hover *, .co-wk__cta:hover *, .co-aio__cta:hover *,
.co-how__cta:hover *, .co-fs__toggle:hover *, .co-fs__det > summary:hover *,
button[type=submit]:hover *, input[type=submit]:hover *{ color:var(--co-o) !important; }
.co-hero__cta:hover svg, .co-frm__btn:hover svg, .co-wk__cta:hover svg,
.co-fs__toggle:hover svg, button[type=submit]:hover svg{ stroke:var(--co-o) !important; fill:none !important; }
/* blanco → hover naranja/azul, texto blanco */
.co-rv__all{ background:#fff !important; color:var(--co-navy) !important; }
.co-rv__all *{ color:var(--co-navy) !important; }
.co-rv__all:hover{ background:var(--co-o) !important; background-image:none !important;
  transform:translateY(-3px); box-shadow:0 20px 40px rgba(245,131,31,.42) !important; }
.co-rv__all:hover *{ color:#fff !important; }
.co-ft__cta--out a, .co-ft__callbtn{ background:#fff !important; color:var(--co-navy) !important; }
.co-ft__cta--out a *, .co-ft__callbtn *{ color:var(--co-navy) !important; }
.co-ft__cta--out a:hover, .co-ft__callbtn:hover{ background:var(--co-navy) !important;
  transform:translateY(-3px) scale(1.05); box-shadow:0 22px 44px rgba(0,0,0,.4) !important; }
.co-ft__cta--out a:hover *, .co-ft__callbtn:hover *{ color:#fff !important; }
.co-ft__cta--out a:hover svg, .co-ft__callbtn:hover svg{ stroke:#fff !important; }

/* ---------- 4. LA NARANJA ANIMADA EN CADA EYEBROW ---------- */
.co-hero__top::before, .co-trust__ctx > span:first-child::before,
.co-fs__ey::before, .co-mq__ey::before, .co-aio__ey::before,
.co-how__eyebrow::before, .co-about__eyebrow::before, .co-eeat__eyebrow::before,
.co-work__eyebrow::before, .co-cov__top::before, .co-rv__ey::before,
.co-map__eyebrow::before, .co-faq__eyebrow::before{
  content:"" !important; display:inline-block !important; vertical-align:-.16em !important;
  width:1.1em !important; height:1.1em !important; margin:0 .5em 0 0 !important;
  background:url(https://callorange-locksmith-tempe.com/wp-content/uploads/sites/259/2017/05/orange-icon.png) center/contain no-repeat !important;
  animation:coOrangePulse 2.8s var(--co-e) infinite;
  filter:drop-shadow(0 2px 7px rgba(245,131,31,.5)); }
.co-hero__top, .co-trust__ctx > span:first-child, .co-fs__ey, .co-mq__ey, .co-aio__ey,
.co-how__eyebrow, .co-about__eyebrow, .co-eeat__eyebrow, .co-work__eyebrow,
.co-cov__top, .co-rv__ey, .co-map__eyebrow, .co-faq__eyebrow{
  display:inline-flex !important; align-items:center !important; flex-direction:row !important; }
/* nunca donde no toca */
.co-rv__top::before, .co-rv__card::before, .co-rv__ava::before,
.co-hd__nav::before, .co-fs__kicker::before, .co-how__badge::before,
.co-about__badge::before, .co-fs__chip::before, .co-trust__ctx::before{ content:none !important; }
.co-trust__ctx{ display:block !important; text-align:center; }
.co-trust__dot, .co-lk__dot{ display:none !important; }
.co-hero__top img.emoji, [class*="eyebrow"] img.emoji, [class*="kicker"] img.emoji,
.co-rv__top img.emoji, .co-cov__top img.emoji, .co-trust__ctx img.emoji{ display:none !important; }

/* ---------- 5. HEADER BLANCO + STICKY + MEGA MENÚS ----------
   El overflow-x:hidden en html/body rompe position:sticky. No usarlo. */
html, body{ overflow-x:visible !important; }
.elementor-4568 > .elementor-element-60a3737{ position:sticky !important; top:0 !important; z-index:300 !important; }
body.admin-bar .elementor-4568 > .elementor-element-60a3737{ top:32px !important; }
@media (max-width:782px){ body.admin-bar .elementor-4568 > .elementor-element-60a3737{ top:46px !important; } }
.elementor-element-60a3737, .elementor-element-44964ce{ overflow:visible !important; }

.co-hd{ position:relative !important; background:#FFFFFF !important;
  border-bottom:1px solid rgba(20,20,43,.08); box-shadow:0 6px 26px rgba(20,20,43,.10); }
.co-hd__logo img{ height:clamp(42px,4.4vw,58px); width:auto; }
.co-hd__nav a{ position:relative; color:var(--co-navy) !important; }
.co-hd nav.co-hd__nav > a:hover, .co-hd .co-hd__item > a:hover,
.co-hd nav.co-hd__nav > a:focus-visible, .co-hd .co-hd__item > a:focus-visible,
.co-hd nav.co-hd__nav > a:hover *, .co-hd .co-hd__item > a:hover *{ color:var(--co-o) !important; }
.co-hd__nav a::after{ background:var(--co-o) !important; }
.co-hd__nav a + a{ border-left-color:rgba(20,20,43,.12) !important; }
.co-hd .co-hd__phone, .co-hd .co-hd__phone *, .co-hd a[href^="tel"], .co-hd a[href^="tel"] *{
  color:var(--co-navy) !important; }
.co-hd__phone:hover, .co-hd__phone:hover *{ color:var(--co-o) !important; }
.co-hd__phone__ic{ background:rgba(245,131,31,.14) !important; border-color:rgba(245,131,31,.35) !important; }
.co-hd__phone__ic svg{ stroke:var(--co-o) !important; fill:none !important; }
.co-hd__burger span{ background:var(--co-navy) !important; }

.co-hd__nav{ position:static !important; }
.co-hd, .co-hd__in{ position:relative; }
.co-hd__item{ position:static; display:inline-flex; align-items:center; }
.co-mega{ position:absolute; left:0; right:0; top:100%;
  background:linear-gradient(180deg,var(--co-navy) 0%,var(--co-ink) 100%);
  border-top:2px solid rgba(245,131,31,.55); box-shadow:0 34px 70px rgba(0,0,0,.45);
  padding:clamp(22px,2.4vw,34px) 0 0; opacity:0; visibility:hidden; transform:translateY(-10px);
  transition:opacity .26s var(--co-e), transform .3s var(--co-e), visibility .26s; z-index:60; }
.co-hd__item:hover > .co-mega, .co-hd__item:focus-within > .co-mega, .co-mega:hover{
  opacity:1; visibility:visible; transform:translateY(0); }
.co-hd__item:hover > a .cv{ transform:rotate(180deg); }
.co-mega__in{ max-width:1180px; margin:0 auto; padding:0 16px clamp(20px,2.2vw,28px);
  display:grid; grid-template-columns:1.35fr .85fr; gap:clamp(18px,2.2vw,34px); align-items:start; }
.co-mega__grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; }
.co-mega__it{ display:flex; align-items:flex-start; gap:13px; padding:11px 12px; border-radius:14px;
  text-decoration:none !important; text-transform:none !important; letter-spacing:0 !important;
  transition:background .2s, transform .22s var(--co-e); }
.co-mega__it::after{ display:none !important; }
.co-mega__it:hover{ background:rgba(255,255,255,.06); transform:translateX(3px); }
.co-mega a, .co-mega a *, .co-mega__it, .co-mega__it *{ color:#fff !important; }
.co-mega__it i{ color:rgba(255,255,255,.6) !important; font-style:normal; font-size:12.5px; line-height:1.35; }
.co-mega__it:hover i{ color:rgba(255,255,255,.85) !important; }
.co-mega__tx{ display:grid; gap:2px; min-width:0; }
.co-mega__tx b{ font-family:"Outfit",sans-serif; font-weight:700; font-size:14.5px; line-height:1.25; }
.co-mega__ic{ flex:none; width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
  background:linear-gradient(135deg, rgba(245,131,31,.30), rgba(245,131,31,.14)) !important;
  border:1px solid rgba(245,131,31,.45) !important; color:#FFA34D !important; transition:background .22s, color .22s; }
.co-mega__ic svg{ width:21px; height:21px; }
.co-mega__it:hover .co-mega__ic{ background:linear-gradient(135deg,var(--co-o),#D96A0A) !important;
  color:#fff !important; border-color:transparent !important; }
.co-mega__fig{ position:relative; display:block; border-radius:16px; overflow:hidden; padding:0 !important;
  border:1px solid rgba(255,255,255,.12); background:var(--co-navy); text-decoration:none !important; }
.co-mega__fig::after{ display:none !important; }
.co-mega__fig img{ width:100% !important; height:284px !important; object-fit:cover !important; display:block !important;
  transition:transform .7s var(--co-e); }
.co-mega__fig:hover img{ transform:scale(1.06); }
.co-mega__fig span{ position:absolute; left:0; right:0; bottom:0; padding:26px 16px 14px; color:#fff;
  font-size:12.5px; font-weight:700; line-height:1.4; text-transform:none; letter-spacing:0;
  background:linear-gradient(0deg, rgba(8,8,18,.92), transparent); }
.co-mega__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 22px;
  border-top:1px solid rgba(255,255,255,.12); max-width:1180px; margin:0 auto; padding:14px 16px 18px; }
.co-mega__b, .co-mega__b *{ font-size:12px; color:rgba(255,255,255,.62) !important;
  text-transform:none; letter-spacing:0; display:inline-flex; align-items:center; gap:6px; }
.co-mega__b em{ font-style:normal; font-weight:800; color:var(--co-o) !important; font-size:14px; }
.co-mega__all, .co-mega__all *{ color:var(--co-o) !important; }
.co-mega__all{ margin-left:auto; font-family:"Outfit",sans-serif; font-weight:800; font-size:13px;
  text-decoration:none !important; text-transform:none !important; letter-spacing:0 !important;
  display:inline-flex; align-items:center; gap:7px; }
.co-mega__all::after{ display:none !important; }
.co-mega__all span{ display:inline-block; transition:transform .25s var(--co-e); }
.co-mega__all:hover span{ transform:translateX(4px); }
@media (max-width:1024px){ .co-mega{ display:none !important; } }

/* ---------- 6. HERO + VIDEO MUX + BARRA DE CONFIANZA ---------- */
.co-hero__video{ display:block !important; opacity:1 !important; position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; z-index:-2; border:0; pointer-events:none; background:transparent; }
.co-hero__vwrap{ display:none !important; }
.co-hero__poster{ z-index:-3 !important; background-position:center 32% !important; }
@media (prefers-reduced-motion:reduce){ .co-hero__video{ display:none !important; } }
.co-cbar{ background:linear-gradient(180deg,var(--co-navy) 0%,var(--co-ink) 100%);
  border-top:2px solid rgba(245,131,31,.55); position:relative; z-index:3; margin-top:-1px; }
.co-cbar__in{ max-width:1180px; margin:0 auto; padding:clamp(18px,2.2vw,26px) 16px;
  display:grid; grid-template-columns:repeat(5,1fr); }
.co-cbar__i{ text-align:center; padding:2px 12px; }
.co-cbar__i + .co-cbar__i{ border-left:1px solid rgba(255,255,255,.16); }
.co-cbar .co-cbar__i strong{ display:inline-flex !important; align-items:center !important; gap:8px !important;
  white-space:nowrap !important; font-family:"Outfit","Sora",sans-serif; font-weight:800;
  font-size:clamp(17px,2vw,25px); line-height:1.12; color:var(--co-o); letter-spacing:-.02em; }
.co-cbar .co-cbar__i strong span.co-cbar__st{ display:inline !important; margin:0 !important;
  font-size:.55em !important; letter-spacing:.08em !important; line-height:1 !important; color:var(--co-o) !important; }
.co-cbar__i span{ display:block; margin-top:5px; font-size:clamp(11px,1.05vw,13px);
  color:rgba(255,255,255,.72); line-height:1.35; }
@media (max-width:860px){ .co-cbar__in{ grid-template-columns:repeat(3,1fr); row-gap:18px; }
  .co-cbar__i:nth-child(3n+1){ border-left:0; }
  .co-cbar__i:nth-child(n+4){ border-top:1px solid rgba(255,255,255,.14); padding-top:16px; } }
@media (max-width:520px){ .co-cbar__in{ grid-template-columns:repeat(2,1fr); }
  .co-cbar__i:nth-child(odd){ border-left:0; }
  .co-cbar__i:last-child{ grid-column:1 / -1; border-left:0; } }

/* ---------- 7. TRUST SIGNALS (primera sección) ---------- */
.co-trust{ padding-block:clamp(58px,7.5vw,104px) !important; border-top:0 !important; }
.co-trust__ctx > span:first-child{ font-size:clamp(12px,1.15vw,14px) !important; letter-spacing:.2em !important; }
.co-trust h2.co-trust__h{ font-family:"Outfit","Sora",sans-serif; font-weight:800;
  font-size:clamp(20px,3.3vw,44px) !important; line-height:1.08 !important; letter-spacing:-.02em;
  text-align:center !important; margin:14px auto 0 !important; max-width:none !important; }
.co-trust h2.co-trust__h span.co-tl{ display:block !important; white-space:nowrap !important; color:var(--co-navy) !important; }
.co-trust h2.co-trust__h span.co-tl span.co-hl{ color:var(--co-o) !important; display:inline !important; white-space:nowrap !important; }
@media (max-width:560px){ .co-trust h2.co-trust__h span.co-tl,
  .co-trust h2.co-trust__h span.co-tl span.co-hl{ white-space:normal !important; } }
.co-trust__wrap{ margin-top:clamp(22px,2.6vw,34px) !important; }
.co-trust__chip, .co-trust__score{ background:var(--co-navy) !important; border-color:var(--co-navy) !important;
  color:#fff !important; box-shadow:0 10px 24px rgba(20,20,43,.22) !important;
  transition:transform .25s var(--co-e), box-shadow .3s; }
.co-trust__chip *, .co-trust__score *{ color:#fff !important; }
.co-trust__chip:hover, .co-trust__score:hover{ transform:translateY(-3px) scale(1.03);
  box-shadow:0 16px 32px rgba(20,20,43,.3) !important; }
.co-trust__num{ color:var(--co-o) !important; }
.co-trust__chip small, .co-trust__score > div:last-child, .co-trust__stars{
  color:var(--co-o) !important; letter-spacing:.06em; font-size:13px; }

/* ---------- 8. SERVICES ---------- */
.co-fs__det{ margin-top:auto; align-self:flex-start; display:flex; flex-direction:column-reverse; align-items:flex-start; }
.co-fs__det > summary{ list-style:none; cursor:pointer; margin-top:22px; }
.co-fs__det > summary::-webkit-details-marker{ display:none; }
.co-fs__det > summary::marker{ content:""; }
.co-fs__det > summary .le{ display:none; }
.co-fs__det[open] > summary .mo{ display:none; }
.co-fs__det[open] > summary .le{ display:inline; }
.co-fs__det[open] > summary svg{ transform:rotate(180deg); }
.co-fs__det[open] .co-fs__more{ max-height:2000px; opacity:1; margin-top:11px; }

/* ---------- 9. MARQUEES ---------- */
.co-mq__lane, .co-rv__lane{ -webkit-mask-image:none !important; mask-image:none !important; }
.co-mq--car .co-brand{ background:var(--co-navy) !important; border-color:var(--co-navy) !important;
  box-shadow:0 10px 22px rgba(20,20,43,.2) !important; }
.co-mq--car .co-brand, .co-mq--car .co-brand *{ color:#fff !important; }
.co-mq--lock .co-lk{ background:#fff !important; border-color:rgba(255,255,255,.9) !important;
  box-shadow:0 10px 22px rgba(0,0,0,.35) !important; }
.co-mq--lock .co-lk, .co-mq--lock .co-lk *{ color:var(--co-navy) !important; }

/* ---------- 10. QUICK ANSWER (AI Overviews) ---------- */
.co-aio__facts > *{ transition:transform .28s var(--co-e), box-shadow .3s, border-color .3s; }
.co-aio__facts > *:hover{ transform:translateY(-4px) scale(1.03); box-shadow:0 16px 34px rgba(20,20,43,.16); }
.co-aio__facts > *:hover .ic{ transform:scale(1.1) rotate(-5deg); }

/* ---------- 11. ICONOS LINE-ART ---------- */
[class*="co-"] .ic{ display:grid !important; place-items:center !important; transition:transform .3s var(--co-e); }
[class*="co-"] .ic > svg{ width:58% !important; height:58% !important; display:block !important;
  stroke:#fff !important; stroke-width:1.75 !important; stroke-linecap:round !important; stroke-linejoin:round !important; }
[class*="co-"] .ic > svg *:not([fill="currentColor"]):not([fill="#fff"]):not([fill="#FFF"]){ fill:none !important; }
[class*="co-"] .ic > svg [fill="currentColor"]{ fill:#fff !important; stroke:none !important; }
.co-how__num, .co-eeat__ic{ display:grid !important; place-items:center; position:relative; overflow:visible; }
.coico{ width:54%; height:54%; display:block; color:#fff; overflow:visible;
  transition:transform .38s var(--co-e), filter .38s; }
.co-eeat__ic .coico{ width:52%; height:52%; }
.co-eeat__card:hover .coico, .co-how__step:hover .coico{
  transform:translateY(-4px) scale(1.09) rotate(-3deg); filter:drop-shadow(0 6px 14px rgba(0,0,0,.28)); }
.co-how__num::after, .co-eeat__ic::after{ content:""; position:absolute; inset:-10%; border-radius:inherit;
  border:1.5px solid rgba(245,131,31,.45); opacity:0; }
.co-eeat__card:hover .co-eeat__ic::after, .co-how__step:hover .co-how__num::after{
  animation:coHalo 1.1s var(--co-e) infinite; }

/* ---------- 12. WHY CHOOSE US (bento) ---------- */
.co-ee2 .co-eeat__wrap{ max-width:1180px; margin:0 auto; padding:clamp(52px,7vw,92px) 16px; }
.co-ee2 .co-eeat__head{ text-align:center; max-width:780px; margin:0 auto clamp(26px,3.5vw,40px); }
.co-ee2__h2{ margin:10px 0 12px; font-size:clamp(27px,4vw,44px); line-height:1.12;
  letter-spacing:-.015em; color:var(--co-navy); }
.co-ee2__h2 span{ color:var(--co-o); }
.co-ee2 .co-eeat__intro{ color:var(--co-gray); font-size:clamp(15px,1.45vw,17px); line-height:1.65; margin:0; }
.co-ee2__bento{ display:grid; grid-template-columns:1.22fr 1fr; gap:clamp(14px,1.6vw,20px); align-items:stretch; }
.co-ee2__photo{ position:relative; margin:0; border-radius:24px; overflow:hidden; min-height:420px;
  box-shadow:0 30px 70px rgba(20,20,43,.24); }
.co-ee2__photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.02); transition:transform .9s var(--co-e); }
.co-ee2__photo:hover img{ transform:scale(1.07); }
.co-ee2__photo::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(9,9,20,.92) 6%, rgba(9,9,20,.45) 46%, rgba(9,9,20,.06) 82%); }
.co-ee2__photo figcaption{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:clamp(20px,2.4vw,30px); }
.co-ee2__stat{ display:flex; align-items:baseline; gap:12px; }
.co-ee2__stat strong{ font-size:clamp(46px,6vw,72px); line-height:.92; color:var(--co-o);
  letter-spacing:-.03em; text-shadow:0 6px 26px rgba(245,131,31,.4); }
.co-ee2__stat span{ color:#fff; font-size:clamp(14px,1.3vw,16px); line-height:1.3; font-weight:700; }
.co-ee2__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.co-ee2__chips span{ font-size:12.5px; font-weight:700; color:#fff; padding:7px 13px; border-radius:999px;
  background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.26); }
.co-ee2__side{ display:grid; grid-template-rows:auto 1fr 1fr; gap:clamp(14px,1.6vw,20px); }
.co-ee2__rating{ display:flex; align-items:center; gap:16px; text-decoration:none; padding:clamp(18px,2vw,24px);
  border-radius:20px; background:linear-gradient(135deg,var(--co-o),#D96A0A); color:#fff;
  box-shadow:0 20px 44px rgba(245,131,31,.34); transition:transform .3s var(--co-e), box-shadow .3s; }
.co-ee2__rating, .co-ee2__rating *, .co-ee2__rating:hover, .co-ee2__rating:hover *{ color:#fff !important; }
.co-ee2__rating:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 26px 56px rgba(245,131,31,.46); }
.co-ee2__num{ font-size:clamp(38px,4.4vw,52px); line-height:1; font-weight:800; letter-spacing:-.03em; }
.co-ee2__rtx{ display:grid; gap:3px; font-size:13.5px; }
.co-ee2__stars{ letter-spacing:.14em; font-size:15px; }
.co-ee2__card{ background:var(--co-navy) !important; border:1px solid rgba(255,255,255,.10) !important;
  border-radius:20px; padding:clamp(18px,2vw,24px); box-shadow:0 18px 40px rgba(20,20,43,.28) !important;
  transition:transform .3s var(--co-e), box-shadow .3s, border-color .3s; }
.co-ee2__card:hover{ transform:translateY(-4px); border-color:rgba(245,131,31,.4) !important; }
.co-ee2__card h3{ margin:0 0 6px; font-size:clamp(17px,1.7vw,20px); color:#fff !important; }
.co-ee2__card p{ margin:0; color:rgba(255,255,255,.72) !important; font-size:14.5px; line-height:1.6; }
.co-ee2__ic{ display:grid; place-items:center; width:52px; height:52px; border-radius:15px; margin-bottom:12px;
  background:rgba(245,131,31,.16) !important; color:var(--co-o) !important; }
.co-ee2__ic .coico{ width:26px; height:26px; color:var(--co-o); }
.co-ee2__stats{ margin-top:clamp(14px,1.6vw,20px); background:var(--co-navy); border-radius:22px;
  padding:clamp(20px,2.2vw,28px) 10px; display:grid; grid-template-columns:repeat(4,1fr);
  box-shadow:0 24px 56px rgba(20,20,43,.24); }
.co-ee2__stats > div{ text-align:center; padding:4px 12px; }
.co-ee2__stats > div + div{ border-left:1px solid rgba(255,255,255,.15); }
.co-ee2__stats strong{ display:block; font-size:clamp(20px,2.4vw,29px); color:var(--co-o);
  letter-spacing:-.02em; line-height:1.1; }
.co-ee2__stats span{ display:block; margin-top:5px; font-size:12.5px; color:rgba(255,255,255,.7); }
@media (max-width:900px){ .co-ee2__bento{ grid-template-columns:1fr; } .co-ee2__photo{ min-height:320px; }
  .co-ee2__side{ grid-template-rows:auto auto auto; } .co-ee2__stats{ grid-template-columns:repeat(2,1fr); row-gap:20px; }
  .co-ee2__stats > div:nth-child(3){ border-left:0; }
  .co-ee2__stats > div:nth-child(n+3){ border-top:1px solid rgba(255,255,255,.15); padding-top:18px; } }
@media (max-width:520px){ .co-ee2__stats{ grid-template-columns:1fr; }
  .co-ee2__stats > div + div{ border-left:0; border-top:1px solid rgba(255,255,255,.15); padding-top:16px; } }

/* ---------- 13. OUR WORK (mosaico) ---------- */
.co-wk .co-work__wrap{ max-width:1180px; margin:0 auto; padding:clamp(52px,7vw,96px) 16px; }
.co-wk .co-work__head{ text-align:center; max-width:760px; margin:0 auto clamp(26px,3vw,40px); }
.co-wk__h2{ margin:10px 0 12px; font-family:"Outfit","Sora",sans-serif; font-weight:800;
  font-size:clamp(28px,4.2vw,48px); line-height:1.1; letter-spacing:-.018em; color:var(--co-navy); }
.co-wk__h2 span{ color:var(--co-o); }
.co-wk__sub{ margin:0; color:var(--co-gray); font-size:clamp(15px,1.4vw,17px); line-height:1.6; }
.co-wk__grid{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:152px;
  gap:clamp(10px,1.2vw,16px); max-width:1180px; margin-inline:auto; }
.co-wk__t{ position:relative; display:block; overflow:hidden; border-radius:18px; text-decoration:none;
  background:var(--co-navy); box-shadow:0 14px 34px rgba(20,20,43,.16);
  transition:transform .42s var(--co-e), box-shadow .42s; }
.co-wk__t img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .85s var(--co-e); }
.co-wk__t::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(8,8,18,.92) 4%, rgba(8,8,18,.42) 42%, rgba(8,8,18,.02) 74%); }
.co-wk__t:hover{ transform:translateY(-5px); box-shadow:0 26px 54px rgba(20,20,43,.3); }
.co-wk__t:hover img{ transform:scale(1.07); }
.co-wk__t *, .co-wk__t:hover *{ color:#fff !important; }
.co-wk__meta i{ color:rgba(255,255,255,.74) !important; }
.co-wk__chip{ position:absolute; top:12px; left:12px; z-index:2; font-family:"Outfit",sans-serif;
  font-weight:800; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  padding:6px 11px; border-radius:999px; background:rgba(245,131,31,.92);
  box-shadow:0 6px 16px rgba(245,131,31,.4); }
.co-wk__meta{ position:absolute; left:0; right:0; bottom:0; z-index:2; display:grid; gap:3px; padding:16px 16px 15px; }
.co-wk__meta b{ font-family:"Outfit",sans-serif; font-weight:800; line-height:1.2; font-size:clamp(14.5px,1.35vw,18px); }
.co-wk__meta i{ font-style:normal; font-size:12.5px; line-height:1.35; }
.co-wk__go{ position:absolute; top:12px; right:12px; z-index:2; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  opacity:0; transform:translate(-4px,4px); transition:opacity .3s, transform .35s var(--co-e), background .25s; }
.co-wk__go svg{ width:15px; height:15px; }
.co-wk__t:hover .co-wk__go{ opacity:1; transform:none; background:var(--co-o); border-color:transparent; }
.co-wk__t--1{ grid-column:span 3; grid-row:span 2; }
.co-wk__t--2, .co-wk__t--3, .co-wk__t--8, .co-wk__t--9{ grid-column:span 3; grid-row:span 1; }
.co-wk__t--4, .co-wk__t--5, .co-wk__t--6{ grid-column:span 2; grid-row:span 2; }
.co-wk__t--7{ grid-column:span 3; grid-row:span 2; }
.co-wk__t--10{ grid-column:span 6; grid-row:span 1; }
.co-wk__foot{ display:flex; justify-content:center; margin-top:clamp(22px,2.6vw,34px); }
.co-wk__cta{ display:inline-flex; align-items:center; gap:10px; text-decoration:none;
  font-family:"Outfit",sans-serif; font-weight:800; font-size:15px; color:#fff;
  background:linear-gradient(135deg,var(--co-o),#D96A0A); padding:15px 28px; border-radius:14px;
  box-shadow:0 18px 38px rgba(245,131,31,.34); }
.co-wk__cta span{ display:inline-block; transition:transform .25s var(--co-e); }
.co-wk__cta:hover span{ transform:translateX(5px); }
@media (max-width:900px){ .co-wk__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:170px; }
  .co-wk__t--1,.co-wk__t--7{ grid-column:span 2; grid-row:span 2; }
  .co-wk__t--2,.co-wk__t--3,.co-wk__t--8,.co-wk__t--9,.co-wk__t--10{ grid-column:span 2; grid-row:span 1; }
  .co-wk__t--4,.co-wk__t--5,.co-wk__t--6{ grid-column:span 1; grid-row:span 1; } }
@media (max-width:520px){ .co-wk__grid{ grid-template-columns:1fr; grid-auto-rows:200px; }
  .co-wk__t{ grid-column:span 1 !important; grid-row:span 1 !important; }
  .co-wk__t--1,.co-wk__t--7{ grid-row:span 2 !important; } }

/* ---------- 14. SERVICE AREAS + ZIP ---------- */
.co-neighborhoods h2{ font-family:"Outfit","Sora",sans-serif !important; font-weight:800 !important;
  font-size:clamp(30px,4.4vw,50px) !important; line-height:1.1 !important; letter-spacing:-.018em !important;
  color:var(--co-navy) !important; margin-bottom:14px !important; }
.co-neighborhoods h2 span{ color:var(--co-o) !important; }
.co-dist-label{ font-size:clamp(17px,1.9vw,22px) !important; font-weight:800 !important; }
.co-cov__ic{ background:none !important; box-shadow:none !important; border:0 !important;
  width:auto !important; height:auto !important; padding:0 !important; display:inline-flex !important; }
.co-cov__orange{ width:clamp(46px,4vw,64px) !important; height:auto !important; display:block;
  animation:coOrangeBob 3.2s var(--co-e) infinite; filter:drop-shadow(0 6px 18px rgba(245,131,31,.55)); }
.co-cov__zip::after{ content:none !important; }
.co-cov__zip{ overflow:visible !important; justify-content:center !important; text-align:center; }
.co-cov__zipn{ justify-content:center !important; }
.co-cov__zipn a, .co-cov__zipn > *{ background:transparent !important; border:0 !important; }
.co-cov__top{ position:relative; overflow:hidden; isolation:isolate; }
.co-cov__top::after{ content:""; position:absolute; top:-190px; right:-140px; width:560px; height:560px;
  z-index:-1; pointer-events:none;
  background:
    radial-gradient(circle, transparent 0 92px, rgba(245,131,31,.16) 92px 93px, transparent 94px),
    radial-gradient(circle, transparent 0 148px, rgba(245,131,31,.12) 148px 149px, transparent 150px),
    radial-gradient(circle, transparent 0 204px, rgba(245,131,31,.09) 204px 205px, transparent 206px),
    radial-gradient(circle, transparent 0 260px, rgba(245,131,31,.06) 260px 261px, transparent 262px); }
.co-cov__top::before{ content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:46px 46px; }

/* ---------- 15. CARRUSEL DE RESEÑAS (4 páginas, sin JS) ---------- */
.co-rv2{ position:relative; max-width:1180px; margin:clamp(22px,2.6vw,34px) auto 0; padding:0 16px; }
.co-rv2__r{ position:absolute; opacity:0; pointer-events:none; width:0; height:0; }
.co-rv2__vp{ overflow:hidden; }
.co-rv2__track{ display:flex; width:100%; transition:transform .62s var(--co-e); }
.co-rv2__page{ flex:0 0 100%; display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,1.6vw,22px); padding:4px 0; }
#corv-1:checked ~ .co-rv2__vp .co-rv2__track{ transform:translateX(0%); }
#corv-2:checked ~ .co-rv2__vp .co-rv2__track{ transform:translateX(-100%); }
#corv-3:checked ~ .co-rv2__vp .co-rv2__track{ transform:translateX(-200%); }
#corv-4:checked ~ .co-rv2__vp .co-rv2__track{ transform:translateX(-300%); }
.co-rv2 .co-rv__card{ height:100%; margin:0 !important; min-width:0; }
.co-rv2__nav{ display:none; align-items:center; justify-content:center;
  gap:clamp(16px,2vw,28px); margin-top:clamp(20px,2.4vw,30px); }
#corv-1:checked ~ .co-rv2__nav--1, #corv-2:checked ~ .co-rv2__nav--2,
#corv-3:checked ~ .co-rv2__nav--3, #corv-4:checked ~ .co-rv2__nav--4{ display:flex; }
.co-rv2__ar{ flex:none; width:48px; height:48px; border-radius:50%; display:grid; place-items:center;
  background:#fff; color:var(--co-navy); cursor:pointer; border:1px solid rgba(255,255,255,.16);
  box-shadow:0 12px 26px rgba(0,0,0,.34);
  transition:transform .2s var(--co-e), background .22s, color .22s, box-shadow .25s; }
.co-rv2__ar svg{ width:20px; height:20px; }
.co-rv2__ar:hover{ background:var(--co-o); color:#fff; transform:translateY(-2px) scale(1.06);
  box-shadow:0 18px 34px rgba(245,131,31,.4); }
.co-rv2__ar:active{ transform:scale(.94); }
.co-rv2__mid{ display:grid; justify-items:center; gap:11px; min-width:190px; }
.co-rv2__count{ font-family:"Outfit",sans-serif; font-weight:700; font-size:13.5px; color:rgba(255,255,255,.72); }
.co-rv2__count em{ font-style:normal; color:var(--co-o); }
.co-rv2__dots{ display:flex; gap:8px; }
.co-rv2__dot{ cursor:pointer; padding:5px 2px; display:block; }
.co-rv2__dot span{ display:block; width:26px; height:4px; border-radius:4px; background:rgba(255,255,255,.22);
  transition:background .25s, width .3s var(--co-e); }
.co-rv2__dot:hover span{ background:rgba(255,255,255,.42); }
.co-rv2__dot.is-on span{ background:var(--co-o); width:38px; }
.co-rv__summary{ transition:transform .3s var(--co-e), box-shadow .32s; }
.co-rv__summary:hover{ transform:translateY(-4px) scale(1.03); box-shadow:0 22px 46px rgba(0,0,0,.42); }
.co-rv__sum-stars{ color:var(--co-o) !important; }
@media (max-width:900px){ .co-rv2__page{ grid-template-columns:1fr; } .co-rv2__mid{ min-width:150px; } }

/* ---------- 16. CONTACTO ---------- */
.co-map{ position:relative; isolation:isolate; overflow:hidden; width:100% !important; max-width:none !important;
  padding-block:clamp(48px,5vw,80px) !important; }
.co-map::before{ content:""; position:absolute; inset:0; z-index:-2;
  background:url(https://image.mux.com/dhsmsaXfFl7ZXdk0201XrEh01mA8QmtoCsbPhX65T6HV00s/thumbnail.webp?time=3&width=1920) center 45%/cover no-repeat; }
.co-map::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(115deg, rgba(12,12,26,.78) 0%, rgba(12,12,26,.60) 45%, rgba(12,12,26,.42) 100%); }
.co-map__head h2, .co-map__head h3, .co-map__head p{ color:#fff !important; }
.co-map__eyebrow{ color:var(--co-o) !important; }
.co-map__card{ background:rgba(16,16,34,.72) !important; border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 28px 66px rgba(0,0,0,.46) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
.co-map__card *:not(input):not(textarea):not(select){ color:#fff !important; }
.co-map__card [class*="label"], .co-map__card [class*="ttl"], .co-map__card [class*="__k"]{
  color:rgba(255,255,255,.72) !important; }
.co-map__card a{ color:#FFD9B0 !important; }
.co-map__card a:hover{ color:var(--co-o) !important; }
.co-map__card input:not([type=submit]), .co-map__card textarea, .co-map__card select{
  background:rgba(255,255,255,.07) !important; border:1px solid rgba(255,255,255,.24) !important;
  color:#fff !important; border-radius:12px !important; padding:11px 13px !important;
  width:100% !important; font-size:15px !important;
  transition:border-color .2s, box-shadow .2s, background .2s; }
.co-map__card input::placeholder, .co-map__card textarea::placeholder{ color:rgba(255,255,255,.62) !important; }
.co-map__card input:not([type=submit]):hover, .co-map__card textarea:hover{ background:rgba(255,255,255,.11) !important; }
.co-map__card input:not([type=submit]):focus, .co-map__card textarea:focus{
  background:rgba(255,255,255,.13) !important; border-color:var(--co-o) !important;
  box-shadow:0 0 0 3px rgba(245,131,31,.32) !important; outline:none !important; }
.co-map__card input[readonly], .co-map__card input[type=hidden]{ display:none !important; }
.co-ci__ic{ background:rgba(245,131,31,.16) !important; }
.co-ci__ic, .co-ci__ic svg, .co-ci__ic *{ color:var(--co-o) !important; stroke:var(--co-o) !important; }
.co-ci__map{ min-height:260px; border-radius:16px; overflow:hidden;
  border:1px solid rgba(255,255,255,.16); background:var(--co-ink); }
.co-ci__map iframe{ filter:grayscale(.25) contrast(1.05); }
.co-frm__btn{ background:linear-gradient(135deg,var(--co-o),var(--co-o6)) !important; color:#fff !important;
  border:0 !important; border-radius:14px !important; box-shadow:0 16px 34px rgba(245,131,31,.4) !important; }
.co-frm__btn *{ color:#fff !important; }

/* ---------- 17. FAQ (details nativo, uno abierto a la vez) ---------- */
.co-faq{ width:100% !important; max-width:none !important; }
.co-faq__item > summary{ list-style:none; cursor:pointer; }
.co-faq__item > summary::-webkit-details-marker{ display:none; }
.co-faq__item > summary::marker{ content:""; }
.co-faq__btn > .co-faq__q{ flex:1; min-width:0; margin:0; font:inherit; color:inherit; }
.co-faq__item[open]{ border-color:var(--co-o); border-left-color:var(--co-o);
  background:var(--co-orange-050,#FFF6EC); box-shadow:0 14px 32px rgba(245,131,31,.16); }
.co-faq__item[open] > .co-faq__btn{ color:var(--co-o6); }
.co-faq__item[open] .co-faq__ic{ background:var(--co-o); color:#fff; transform:rotate(45deg); }
.co-faq__item[open] .co-faq__panel{ grid-template-rows:1fr; }
.co-faq__item:not([open]):hover{ border-color:#F3D2B4; }

/* ---------- 18. FOOTER + CTA SEPARADO ---------- */
.co-ft{ width:100% !important; max-width:none !important; margin:0 !important;
  border:0 !important; box-shadow:none !important; border-radius:0 !important; padding-bottom:0 !important; }
.co-ft > *:last-child{ margin-bottom:0 !important; }
.co-ft__cta--out{ position:relative; z-index:2; max-width:1180px; width:calc(100% - 32px);
  margin:0 auto clamp(38px,4vw,60px) !important; border-radius:22px !important;
  box-shadow:0 26px 60px rgba(245,131,31,.28) !important; }
.co-ft__colh{ color:var(--co-o) !important; letter-spacing:.14em; }
/* mini naranja solo en las columnas de enlaces (Contact y redes ya traen icono) */
.co-ft__main > *:nth-child(2) a, .co-ft__main > *:nth-child(3) a{
  position:relative; padding-left:26px; display:inline-block;
  transition:color .2s, padding-left .22s var(--co-e); }
.co-ft__main > *:nth-child(2) a::before, .co-ft__main > *:nth-child(3) a::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:15px; height:15px; background:url(https://callorange-locksmith-tempe.com/wp-content/uploads/sites/259/2017/05/orange-icon.png) center/contain no-repeat;
  opacity:.75; transition:opacity .22s, transform .28s var(--co-e); }
.co-ft__main > *:nth-child(2) a:hover, .co-ft__main > *:nth-child(3) a:hover{
  color:var(--co-o) !important; padding-left:30px; }
.co-ft__main > *:nth-child(2) a:hover::before, .co-ft__main > *:nth-child(3) a:hover::before{
  opacity:1; transform:translateY(-50%) scale(1.2) rotate(-10deg); }
.co-ft__main > *:nth-child(1) a::before, .co-ft__main > *:nth-child(4) a::before{ content:none !important; }
.co-ft__main > *:nth-child(1) a, .co-ft__main > *:nth-child(4) a{ padding-left:0 !important; }

/* ---------- 19. ADORNOS DE FONDO (estilo Albuquerque, solo una zona) ---------- */
.co-how, .co-rv, .co-ft, .co-mq--lock, .co-cov, .co-wk, .co-eeat, .co-faq{ position:relative; isolation:isolate; }
.co-how::before, .co-rv::before, .co-ft::before, .co-mq--lock::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.17) 1.4px, transparent 1.5px), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='600' viewBox='0 0 1200 600' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-width='1' opacity='0.07'%3E%3Cpath d='M-40 470C180 400 340 300 560 300s380 100 700 40'/%3E%3Cpath d='M-40 510C180 440 340 340 560 340s380 100 700 40'/%3E%3Cpath d='M-40 550C180 480 340 380 560 380s380 100 700 40'/%3E%3Cpath d='M-40 430C180 360 340 260 560 260s380 100 700 40'/%3E%3C/g%3E%3C/svg%3E");
  background-size:26px 26px, 100% 100%; background-position:0 0, center bottom;
  background-repeat:repeat, no-repeat;
  -webkit-mask-image:radial-gradient(78% 66% at 10% 6%, #000 0%, rgba(0,0,0,.5) 44%, transparent 76%);
  mask-image:radial-gradient(78% 66% at 10% 6%, #000 0%, rgba(0,0,0,.5) 44%, transparent 76%); }
.co-ft::before{ -webkit-mask-image:radial-gradient(85% 90% at 88% 12%, #000 0%, rgba(0,0,0,.45) 46%, transparent 78%);
  mask-image:radial-gradient(85% 90% at 88% 12%, #000 0%, rgba(0,0,0,.45) 46%, transparent 78%); }
.co-wk::before, .co-eeat::before, .co-faq::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:radial-gradient(rgba(20,20,43,.10) 1.3px, transparent 1.4px); background-size:26px 26px;
  -webkit-mask-image:radial-gradient(70% 58% at 92% 6%, #000 0%, rgba(0,0,0,.45) 44%, transparent 74%);
  mask-image:radial-gradient(70% 58% at 92% 6%, #000 0%, rgba(0,0,0,.45) 44%, transparent 74%); }

/* ---------- 20. FULL WIDTH ---------- */
.elementor-element:has(> .elementor-widget-container > .co-faq),
.elementor-element:has(> .elementor-widget-container > .co-ft),
.elementor-element:has(> .elementor-widget-container > .co-map){
  width:100% !important; max-width:none !important;
  padding-left:0 !important; padding-right:0 !important; margin:0 !important; }
/* fin */


/* ---------- 21. AJUSTES FINALES ---------- */
/* icono del telefono en naranja oscuro para que resalte en el header blanco */
.co-hd__phone__ic{ background:rgba(194,94,18,.14) !important; border:1px solid rgba(194,94,18,.4) !important; }
.co-hd__phone__ic svg, .co-hd__phone__ic svg *{ stroke:#C25E12 !important; fill:none !important; }
.co-hd__phone:hover .co-hd__phone__ic{ background:#C25E12 !important; border-color:#C25E12 !important; }
.co-hd__phone:hover .co-hd__phone__ic svg{ stroke:#fff !important; }

/* footer: la naranja como item flex, jamas encima del texto, y solo cambia de color */
.co-ft__main > *:nth-child(2) a, .co-ft__main > *:nth-child(3) a{
  display:inline-flex !important; align-items:center !important; gap:10px !important;
  padding-left:0 !important; transition:color .2s ease !important; }
.co-ft__main > *:nth-child(2) a::before, .co-ft__main > *:nth-child(3) a::before{
  content:"" !important; position:static !important; transform:none !important;
  flex:none !important; width:15px !important; height:15px !important;
  background:url(https://callorange-locksmith-tempe.com/wp-content/uploads/sites/259/2017/05/orange-icon.png) center/contain no-repeat !important; opacity:.8; transition:opacity .2s ease !important; }
.co-ft__main > *:nth-child(2) a:hover, .co-ft__main > *:nth-child(3) a:hover{
  color:var(--co-o) !important; padding-left:0 !important; }
.co-ft__main > *:nth-child(2) a:hover::before, .co-ft__main > *:nth-child(3) a:hover::before{
  opacity:1; transform:none !important; }


/* ---------- 22. LIMPIEZA FINAL ---------- */
/* fuera la cuadricula: ensuciaba el fondo detras de la naranja */
.co-cov__top::before{ content:none !important; }
/* la naranja del ZIP, limpia y sin halo */
.co-cov__orange{ filter:none !important; background:transparent !important; }

/* telefono del header: el icono NUNCA se pierde al pasar el cursor */
.co-hd__phone__ic{ background:rgba(194,94,18,.12) !important; border:1px solid rgba(194,94,18,.35) !important;
  transition:background .22s ease, border-color .22s ease, transform .22s var(--co-e) !important; }
.co-hd__phone__ic svg, .co-hd__phone__ic svg *{ stroke:#C25E12 !important; fill:none !important; }
.co-hd__phone:hover .co-hd__phone__ic{ background:rgba(194,94,18,.22) !important;
  border-color:#C25E12 !important; transform:scale(1.08); }
.co-hd__phone:hover .co-hd__phone__ic svg,
.co-hd__phone:hover .co-hd__phone__ic svg *{ stroke:#C25E12 !important; fill:none !important; }


/* ---------- 23. ZIP: rejilla pareja 5x2 en vez de 8+2 ---------- */
.co-cov__grid{ display:grid !important; grid-template-columns:repeat(5,1fr) !important;
  gap:12px !important; justify-content:stretch !important; align-items:stretch; }
.co-cov__grid > .co-cov__zip{ width:auto !important; min-width:0 !important; margin:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important; }
@media (max-width:980px){ .co-cov__grid{ grid-template-columns:repeat(4,1fr) !important; } }
@media (max-width:720px){ .co-cov__grid{ grid-template-columns:repeat(3,1fr) !important; } }
@media (max-width:460px){ .co-cov__grid{ grid-template-columns:repeat(2,1fr) !important; } }


/* ---------- 24. Mega About: 3 destinos, una sola columna ---------- */
.co-mega--about .co-mega__grid{ grid-template-columns:1fr !important; align-content:start; gap:8px !important; }
.co-mega--about .co-mega__in{ grid-template-columns:1fr .8fr !important; }


/* FIX GLOBAL BOTÓN HERO — el texto es un nodo suelto, necesita text-fill-color */
a.co-hero__cta{ -webkit-text-fill-color:currentColor; }
a.co-hero__cta:hover, .co-hero a.co-hero__cta:hover{ background:#fff !important; background-image:none !important; color:var(--co-o) !important; -webkit-text-fill-color:var(--co-o) !important; border:2px solid var(--co-o) !important; }
a.co-hero__cta:hover svg, a.co-hero__cta:hover path{ stroke:var(--co-o) !important; }


/* ===== STICKY HEADER — máxima especificidad, siempre al final ===== */
body .elementor .elementor-element.elementor-element-60a3737{ position:sticky !important; top:0 !important; z-index:300 !important; }
body.admin-bar .elementor .elementor-element.elementor-element-60a3737{ top:32px !important; }
@media (max-width:782px){ body.admin-bar .elementor .elementor-element.elementor-element-60a3737{ top:46px !important; } }
html, body{ overflow-x:visible !important; }


/* ===== LUNES 10 — icono del teléfono + viñetas de servicios ===== */
/* Círculo del teléfono en naranja del logo, sólido, para que contraste en el header blanco */
.co-hd__phone__ic{ background:#F5831F !important; border:1px solid #F5831F !important;
  box-shadow:0 6px 16px rgba(245,131,31,.35) !important; }
.co-hd__phone__ic svg, .co-hd__phone__ic svg *{ stroke:#FFFFFF !important; fill:none !important; }
.co-hd__phone:hover .co-hd__phone__ic{ background:#C25E12 !important; border-color:#C25E12 !important;
  transform:scale(1.08); box-shadow:0 10px 22px rgba(194,94,18,.45) !important; }
.co-hd__phone:hover .co-hd__phone__ic svg{ stroke:#FFFFFF !important; }

/* Listas de servicios: mini naranja como viñeta, igual que en el footer */
.co-fs__list li > svg{ display:none !important; }
.co-fs__list li{ display:flex !important; align-items:center !important; gap:10px !important; }
.co-fs__list li::before{ content:"" !important; flex:none !important;
  width:15px !important; height:15px !important;
  background:url(https://callorange-locksmith-tempe.com/wp-content/uploads/sites/259/2017/05/orange-icon.png) center/contain no-repeat !important;
  opacity:.82; transition:opacity .2s ease, transform .28s cubic-bezier(.23,1,.32,1); }
.co-fs__list li:hover::before{ opacity:1; transform:scale(1.2) rotate(-8deg); }
.co-fs__list li a{ transition:color .2s ease; }


/* ===== LUNES 10b — teléfono hover con contraste + lista sin enlaces ===== */
.co-hd__phone:hover .co-hd__phone__ic{ background:#14142B !important; border-color:#14142B !important; transform:scale(1.08); box-shadow:0 10px 22px rgba(20,20,43,.35) !important; }
.co-hd .co-hd__phone:hover .co-hd__phone__ic svg, .co-hd .co-hd__phone:hover .co-hd__phone__ic svg *{ stroke:#FFFFFF !important; fill:none !important; color:#FFFFFF !important; }
.co-hd .co-hd__phone__ic svg, .co-hd .co-hd__phone__ic svg *{ stroke:#FFFFFF !important; fill:none !important; color:#FFFFFF !important; }
/* la lista solo nombra servicios, no es navegación */
.co-fs__list li .co-fs__item{ color:inherit !important; text-decoration:none !important; cursor:default; }
.co-fs__list li:hover .co-fs__item{ color:var(--co-o) !important; }


/* ===== LUNES 10c — hover fichas ZIP ===== */
.co-cov__zip{ cursor:default; }
.co-cov__zip:hover{ transform:translateY(-4px) !important; border-color:var(--co-o,#F5831F) !important; background:rgba(245,131,31,.10) !important; box-shadow:0 12px 26px rgba(245,131,31,.22) !important; }
.co-cov__zip:hover .co-cov__zipn{ color:var(--co-o,#F5831F) !important; }



/* ===== MEGA MENU CLARO (10 ago) ===== */
.co-mega{ background:linear-gradient(180deg,#FFFFFF 0%,#F6F7FB 100%) !important; border-top:2px solid #F5831F !important; border-bottom:1px solid rgba(20,20,43,.10) !important; box-shadow:0 26px 54px rgba(20,20,43,.16) !important; }
.co-mega a, .co-mega a *, .co-mega__it, .co-mega__it *{ color:#14142B !important; }
.co-mega .co-mega__tx b{ color:#14142B !important; }
.co-mega .co-mega__it i{ color:#6B7280 !important; }
.co-mega .co-mega__it:hover i{ color:#3C4250 !important; }
.co-mega .co-mega__it:hover{ background:rgba(245,131,31,.10) !important; }
.co-mega .co-mega__ic{ background:linear-gradient(135deg,rgba(245,131,31,.18),rgba(245,131,31,.07)) !important; border:1px solid rgba(245,131,31,.42) !important; color:#C25E12 !important; box-shadow:none !important; }
.co-mega .co-mega__ic svg, .co-mega .co-mega__ic svg *{ stroke:currentColor !important; fill:none !important; }
.co-mega .co-mega__it:hover .co-mega__ic{ background:linear-gradient(135deg,#F5831F,#D96A0A) !important; border-color:transparent !important; color:#FFFFFF !important; box-shadow:0 8px 18px rgba(245,131,31,.30) !important; }
.co-mega .co-mega__fig{ border:1px solid rgba(20,20,43,.12) !important; background:#E9ECF3 !important; box-shadow:0 12px 26px rgba(20,20,43,.12) !important; }
.co-mega .co-mega__fig span, .co-mega .co-mega__fig span *{ color:#FFFFFF !important; }
.co-mega .co-mega__foot{ border-top:1px solid rgba(20,20,43,.10) !important; }
.co-mega .co-mega__b, .co-mega .co-mega__b *{ color:#6B7280 !important; }
.co-mega .co-mega__b em{ color:#C25E12 !important; }
.co-mega .co-mega__all, .co-mega .co-mega__all *{ color:#C25E12 !important; }
.co-mega .co-mega__all:hover, .co-mega .co-mega__all:hover *{ color:#F5831F !important; }


/* ===== HEADER GLOBAL sticky + full width ===== */
#co-site-header{ position:sticky !important; top:0 !important; z-index:300 !important; width:100% !important; max-width:none !important; }
body.admin-bar #co-site-header{ top:32px !important; }
#co-site-header > .e-con-inner{ max-width:none !important; width:100% !important; padding:0 !important; }
#co-site-header .elementor-widget-html{ width:100% !important; }
html,body{ overflow-x:visible !important; }

/* sync */

/* ===== MEGA ICON NARANJA ===== */
.co-mega .co-mega__ic{ color:#F5831F !important; }
.co-mega .co-mega__ic svg, .co-mega .co-mega__ic svg *{ stroke:#F5831F !important; color:#F5831F !important; fill:none !important; }
.co-mega .co-mega__it:hover .co-mega__ic{ background:linear-gradient(135deg,#F5831F,#D96A0A) !important; border-color:transparent !important; }
.co-mega .co-mega__it:hover .co-mega__ic svg, .co-mega .co-mega__it:hover .co-mega__ic svg *{ stroke:#FFFFFF !important; color:#FFFFFF !important; }


/* ===== MEGA ICON v2 — caja naranja, icono blanco (como el telefono) ===== */
.co-mega .co-mega__ic{ background:linear-gradient(135deg,#F5831F,#E06A00) !important; border:1px solid transparent !important; color:#FFFFFF !important; box-shadow:0 8px 18px rgba(245,131,31,.28) !important; }
.co-mega .co-mega__ic svg, .co-mega .co-mega__ic svg *{ stroke:#FFFFFF !important; color:#FFFFFF !important; fill:none !important; }
.co-mega .co-mega__it:hover .co-mega__ic{ background:#14142B !important; box-shadow:0 8px 18px rgba(20,20,43,.32) !important; }
.co-mega .co-mega__it:hover .co-mega__ic svg, .co-mega .co-mega__it:hover .co-mega__ic svg *{ stroke:#FFFFFF !important; color:#FFFFFF !important; }/* End custom CSS */