/* Avalúos en Tijuana: capa de movimiento y acabados modernos */
:root{
  --avt-navy:#003D6E; --avt-deep:#00213B; --avt-night:#030B3B;
  --avt-gold:#F1BC5C; --avt-gold-2:#F7A30A; --avt-ink:#0B1B2E;
  --avt-surface:#F3F6FA; --avt-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- HERO ---------- */
.avt-hero{position:relative; overflow:hidden; isolation:isolate}
.avt-hero::after{
  content:""; position:absolute; inset:-30%; z-index:0; pointer-events:none;
  background:
    radial-gradient(38% 38% at 20% 30%, rgba(241,188,92,.22), transparent 70%),
    radial-gradient(40% 40% at 80% 70%, rgba(24,101,163,.45), transparent 70%),
    radial-gradient(30% 30% at 60% 15%, rgba(255,255,255,.08), transparent 70%);
  animation:avtDrift 18s ease-in-out infinite alternate;
}
.avt-hero > .e-con-inner, .avt-hero > .elementor-element{position:relative; z-index:2}
@keyframes avtDrift{
  0%{transform:translate3d(-4%,-2%,0) rotate(0deg)}
  50%{transform:translate3d(3%,4%,0) rotate(8deg)}
  100%{transform:translate3d(5%,-3%,0) rotate(-6deg)}
}
.avt-hero-sub .elementor-heading-title{
  background:linear-gradient(90deg,#F1BC5C 0%,#FFE3A8 40%,#F7A30A 60%,#F1BC5C 100%);
  background-size:220% auto; -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; animation:avtShine 6s linear infinite;
}
@keyframes avtShine{to{background-position:220% center}}
.avt-divider{display:block; width:72px; height:3px; margin:0 auto; border-radius:3px;
  background:linear-gradient(90deg,transparent,#F1BC5C,transparent);}

/* ---------- BOTONES ---------- */
.avt-btn .elementor-button{position:relative; overflow:hidden;
  transition:transform .35s var(--avt-ease), box-shadow .35s var(--avt-ease), background-color .3s, color .3s !important}
.avt-btn .elementor-button::after{
  content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-20deg); transition:left .7s var(--avt-ease);
}
.avt-btn .elementor-button:hover{transform:translateY(-3px); box-shadow:0 14px 30px -10px rgba(241,188,92,.55)}
.avt-btn .elementor-button:hover::after{left:140%}
.avt-btn-ghost .elementor-button:hover{box-shadow:0 14px 30px -12px rgba(255,255,255,.35)}

/* ---------- TARJETAS ---------- */
.avt-card{position:relative; overflow:hidden; will-change:transform;
  transition:transform .5s var(--avt-ease), box-shadow .5s var(--avt-ease) !important;
  transform-style:preserve-3d}
.avt-card::before{content:""; position:absolute; left:0; top:0; height:4px; width:100%; z-index:3;
  background:linear-gradient(90deg,var(--avt-gold),var(--avt-gold-2));
  transform:scaleX(0); transform-origin:left; transition:transform .55s var(--avt-ease)}
.avt-card:hover{box-shadow:0 34px 60px -24px rgba(0,33,59,.40) !important}
.avt-card:not(.avt-tilting):hover{transform:translateY(-10px)}
.avt-card:hover::before{transform:scaleX(1)}
.avt-card .elementor-icon{transition:transform .6s var(--avt-ease), background-color .4s, color .4s, fill .4s !important}
.avt-card:hover .elementor-icon{transform:scale(1.08)}
.avt-card .elementor-icon-box-title a, .avt-card .elementor-icon-box-title span{transition:color .3s}

/* ---------- PASOS ---------- */
.avt-steps{position:relative}
.avt-steps::before{content:""; position:absolute; left:52px; top:40px; bottom:40px; width:2px;
  background:linear-gradient(180deg,rgba(241,188,92,0),rgba(241,188,92,.85) 15%,rgba(241,188,92,.85) 85%,rgba(241,188,92,0));}
.avt-step{position:relative; z-index:1; border-radius:14px;
  transition:transform .45s var(--avt-ease), background-color .45s, border-color .45s !important}
.avt-step:hover{transform:translateX(8px); background-color:rgba(255,255,255,.09) !important; border-color:rgba(241,188,92,.55) !important}
.avt-step .elementor-icon{transition:transform .5s var(--avt-ease), box-shadow .5s !important}
.avt-step:hover .elementor-icon{transform:scale(1.1); box-shadow:0 0 0 8px rgba(241,188,92,.15)}

/* ---------- LOGO Y FOTOS ---------- */
.avt-float img{animation:avtFloat 7s ease-in-out infinite}
@keyframes avtFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.avt-logo-panel{position:relative; overflow:hidden}
.avt-logo-panel::after{content:""; position:absolute; width:340px; height:340px; right:-120px; bottom:-140px; border-radius:50%;
  background:radial-gradient(circle, rgba(241,188,92,.28), transparent 65%); animation:avtPulse 8s ease-in-out infinite; pointer-events:none}
@keyframes avtPulse{0%,100%{transform:scale(1); opacity:.8}50%{transform:scale(1.15); opacity:1}}
.avt-frame{position:relative}
.avt-frame::before{content:""; position:absolute; top:28px; left:28px; right:-18px; bottom:-18px; border:2px solid var(--avt-gold);
  border-radius:20px; z-index:0; transition:transform .6s var(--avt-ease)}
.avt-frame:hover::before{transform:translate(-10px,-10px)}
.avt-frame .elementor-widget-container, .avt-frame img{position:relative; z-index:1}
.avt-frame img{border-radius:20px; box-shadow:0 30px 60px -25px rgba(0,33,59,.45); transition:transform .8s var(--avt-ease)}
.avt-frame:hover img{transform:scale(1.02)}
.avt-why .elementor-widget-icon-box{transition:transform .4s var(--avt-ease)}
.avt-why .elementor-widget-icon-box:hover{transform:translateX(6px)}
.avt-link .elementor-button{background:transparent !important}
.avt-link .elementor-button .elementor-button-icon{transition:transform .35s var(--avt-ease)}
.avt-link .elementor-button:hover .elementor-button-icon{transform:translateX(6px)}

/* ---------- TARJETAS OSCURAS (Mision / Vision) ---------- */
.avt-card-dark{backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px)}
.avt-card-dark:hover{box-shadow:0 34px 70px -28px rgba(0,0,0,.55) !important; border-color:rgba(241,188,92,.55) !important}
.avt-card-dark .elementor-heading-title{transition:color .3s}
.avt-card-dark:hover .elementor-heading-title{color:var(--avt-gold) !important}

/* ---------- LISTA CLARA ---------- */
.avt-step-light{transition:transform .45s var(--avt-ease), border-color .45s, box-shadow .45s !important}
.avt-step-light:hover{transform:translateX(8px); border-color:var(--avt-gold) !important; box-shadow:0 20px 40px -24px rgba(0,33,59,.35) !important}
.avt-step-light .elementor-icon{transition:transform .5s var(--avt-ease) !important}
.avt-step-light:hover .elementor-icon{transform:scale(1.08)}

/* ---------- CITA ---------- */
.avt-quote{position:relative; overflow:hidden}
.avt-quote::after{content:"\201C"; position:absolute; right:18px; top:-30px; font-family:Poppins,sans-serif; font-size:220px; line-height:1;
  color:rgba(241,188,92,.18); pointer-events:none; animation:avtFloat 8s ease-in-out infinite}

/* ---------- MAPA ---------- */
.avt-map{border-radius:20px; overflow:hidden; box-shadow:0 30px 60px -25px rgba(0,33,59,.45)}
.avt-map iframe{display:block; filter:saturate(.85) contrast(1.05); transition:filter .6s}
.avt-map:hover iframe{filter:none}

/* ---------- ENCABEZADO Y MENU (todo el sitio) ---------- */
#masthead{position:relative; z-index:50; background:#fff; box-shadow:0 12px 30px -20px rgba(0,33,59,.45)}
#masthead::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px; pointer-events:none;
  background:linear-gradient(90deg,#003D6E 0%,#F1BC5C 30%,#F7A30A 50%,#F1BC5C 70%,#003D6E 100%);
  background-size:200% 100%; animation:avtLine 9s linear infinite}
@keyframes avtLine{to{background-position:200% 0}}
#masthead .elementor-widget-image img{transition:transform .5s var(--avt-ease)}
#masthead .elementor-widget-image:hover img{transform:scale(1.04)}
@media (min-width:1025px){
  #masthead .elementskit-navbar-nav{display:flex; align-items:center; gap:8px}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link{
    font-family:Poppins,sans-serif !important; font-weight:500 !important; font-size:14px !important; letter-spacing:1.4px;
    text-transform:uppercase; color:#003D6E !important; line-height:1.2 !important; height:auto !important;
    padding:11px 20px !important; border-radius:6px; position:relative;
    transition:background-color .3s, color .3s, transform .3s var(--avt-ease), box-shadow .3s}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link::after{content:""; position:absolute; left:20px; right:20px; bottom:5px; height:2px;
    background:#F1BC5C; transform:scaleX(0); transform-origin:center; transition:transform .35s var(--avt-ease)}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link:hover{background:#EEF3F9; transform:translateY(-2px)}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link:hover::after,
  #masthead .elementskit-navbar-nav > li.current-menu-item > a.ekit-menu-nav-link::after{transform:scaleX(1)}
  #masthead .elementskit-navbar-nav > li.current-menu-item > a.ekit-menu-nav-link{font-weight:600 !important}
  /* Contacto como boton dorado */
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link[href$="/contacto/"]{
    background:linear-gradient(120deg,#F1BC5C,#F7A30A); color:#030B3B !important; font-weight:600 !important; margin-left:10px;
    box-shadow:0 10px 22px -12px rgba(247,163,10,.8)}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link[href$="/contacto/"]::after{display:none}
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link[href$="/contacto/"]:hover{background:#003D6E; color:#fff !important; box-shadow:0 12px 24px -12px rgba(0,33,59,.7)}
}
@media (max-width:1024px){
  #masthead .elementskit-navbar-nav > li > a.ekit-menu-nav-link{font-family:Poppins,sans-serif !important; color:#003D6E !important}
  #masthead .elementskit-navbar-nav > li.current-menu-item > a.ekit-menu-nav-link{color:#F7A30A !important}
}

/* ---------- FRANJA CTA Y FOOTER (todo el sitio) ---------- */
.avt-cta{position:relative; overflow:hidden; transition:transform .5s var(--avt-ease), box-shadow .5s var(--avt-ease) !important}
.avt-cta::after{content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; pointer-events:none;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.35),transparent); transform:skewX(-20deg); animation:avtSweep 7s ease-in-out infinite}
@keyframes avtSweep{0%,60%{left:-60%}100%{left:130%}}
.avt-cta:hover{transform:translateY(-6px); box-shadow:0 40px 70px -30px rgba(0,0,0,.55) !important}
.avt-footer{position:relative; overflow:hidden}
.avt-footer::before{content:""; position:absolute; width:520px; height:520px; right:-160px; top:-120px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(24,101,163,.35), transparent 65%)}
.avt-footer > .e-con-inner, .avt-footer > .elementor-element{position:relative; z-index:1}
.avt-footer .elementor-icon-list-item{transition:transform .35s var(--avt-ease)}
.avt-footer .elementor-icon-list-item:hover{transform:translateX(5px)}
.avt-footer a{transition:color .3s}\n.avt-footer .elementor-widget-image img{border-radius:10px; box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.avt-footer .avt-credit a{color:#B2E6FF !important}
.avt-footer .avt-credit a:hover{color:#F1BC5C !important}
/* ---------- MOVIMIENTO REDUCIDO ---------- */
@media (prefers-reduced-motion: reduce){
  .avt-hero::after, .avt-hero-sub .elementor-heading-title, .avt-float img, .avt-logo-panel::after, .avt-quote::after, #masthead::after, .avt-cta::after{animation:none !important}
  .avt-card, .avt-step, .avt-step-light, .avt-frame img, .avt-btn .elementor-button{transition:none !important; transform:none !important}
  .elementor-invisible{visibility:visible !important}
  .animated{animation:none !important}
}
@media (max-width:767px){
  .avt-steps::before{left:42px}
  .avt-frame::before{top:16px; left:16px; right:-10px; bottom:-10px}
}
