/* Premium Styles for Impulso Digital - Light Theme */
:root {
    --primary-gradient: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);
    --light-bg: #ffffff;
    --light-surface: #f8fafc;
    --light-border: #e2e8f0;
    --text-main: #0f172a;
    --text-muted: #64748b;
}

body {
    background-color: var(--light-bg);
    color: var(--text-main);
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    scroll-behavior: smooth;
}

/* Glassmorphism Effect - Light Mode */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(226, 232, 240, 0.8);
}

.glass-dark {
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Premium Button Gradient */
.btn-premium {
    background: var(--primary-gradient);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.btn-premium:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -10px #6366f1;
}

/* Service Card Hover */
.service-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid var(--light-border);
}

.service-card:hover {
    border-color: #6366f1;
    transform: translateY(-8px);
    background: rgba(99, 102, 241, 0.05);
}

/* Portfolio Image Hover */
.portfolio-item {
    overflow: hidden;
    position: relative;
}

.portfolio-item img {
    transition: transform 0.5s ease;
}

.portfolio-item:hover img {
    transform: scale(1.1);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--light-bg);
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.reveal {
    opacity: 0;
    transition: all 0.8s ease-out;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-up {
    animation: fadeIn 0.8s ease-out forwards;
}

/* V2: ajustes responsivos sin modificar la composición de escritorio */
html,body{max-width:100%;} img,svg,video{max-width:100%;} .grid > *{min-width:0}
.hero-eyebrow{display:inline-block}
.wa-float{transition:opacity .28s ease,transform .28s ease,visibility .28s ease;}
.wa-float.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(16px)}
.wa-symbol{width:32px;height:32px;color:#fff}
/* El footer mantiene el carácter oscuro de la marca */
.footer-main{display:grid;grid-template-columns:1.3fr .7fr .85fr 1.15fr;gap:clamp(20px,3vw,54px);align-items:start;padding-bottom:40px}
.footer-brand p{color:#c4c9db;font-size:14px;line-height:1.7;max-width:245px;margin-top:14px}
.footer-links,.footer-contact{display:flex;flex-direction:column;align-items:flex-start;gap:11px}
.footer-main h3{font-size:15px;font-weight:750;margin-bottom:9px;color:#fff}
.footer-links a,.footer-contact a,.footer-contact span{color:#c4c9db;font-size:14px;text-decoration:none;transition:color .2s}
.footer-links a:hover,.footer-contact a:hover{color:#a998ff}
.social-pair{display:flex;gap:20px;align-items:flex-start}
.social-action{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;color:white;text-decoration:none;min-width:92px;transition:transform .25s}
.social-action:hover,.social-action:focus-visible{transform:translateY(-6px)}
.social-orb{height:70px;width:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 0 0 7px rgba(255,255,255,.035),0 10px 25px rgba(0,0,0,.3);transition:box-shadow .25s,transform .25s}
.social-orb svg{height:35px;width:35px;color:white}
.whatsapp-action .social-orb{background:linear-gradient(145deg,#32ee80,#02a944)}
.instagram-action .social-orb{background:linear-gradient(35deg,#ffbf40,#f04465 45%,#c62cf2 70%,#5345ef)}
.whatsapp-action:hover .social-orb,.whatsapp-action:focus-visible .social-orb{box-shadow:0 0 24px #25d36685}
.instagram-action:hover .social-orb,.instagram-action:focus-visible .social-orb{box-shadow:0 0 24px #b93aff8c}
.social-action strong{font-size:13px;margin-top:5px}.social-action small{font-size:11px;color:#b9c1d5}
.footer-bottom{border-top:1px solid #ffffff1c;padding-top:22px;font-size:12px;color:#aab2c6}
/* Revelación por tarjeta al llegar a pantalla: no bloquea desplazamiento */
.process-card{position:relative;transition:opacity .45s ease,transform .45s ease,border-color .45s ease,box-shadow .45s ease;}
.process-card.is-pending{opacity:.48;transform:translateY(16px)}
.process-card.is-revealed{opacity:1;transform:translateY(0);border-color:#8574f088;box-shadow:inset 3px 0 0 #8b5cf6,0 10px 28px #0405153d}
@media(max-width:767px){
  .hero-eyebrow{font-size:clamp(9px,2.35vw,12px)!important;letter-spacing:.015em!important;line-height:1.35;white-space:nowrap;max-width:100%;font-weight:800;padding:7px 10px;border-radius:99px;background:linear-gradient(100deg,#5266fa12,#ad45ff12);border:1px solid #8262e32c}
  .stats-grid{gap:10px!important}.stats-grid>div{padding:clamp(10px,3vw,18px)!important;min-width:0}
  .stats-grid .text-sm{font-size:clamp(9px,2.45vw,12px)!important;letter-spacing:.045em!important;overflow-wrap:anywhere;line-height:1.45}
  .stat-positioning{font-size:clamp(9px,2.35vw,11px)!important;letter-spacing:0!important;white-space:normal}
  .wa-float{width:52px!important;height:52px!important;right:15px!important;bottom:calc(18px + env(safe-area-inset-bottom,0px))!important}
  .wa-symbol{width:27px;height:27px}
  .footer-main{grid-template-columns:1fr 1fr;gap:32px 22px;text-align:left}
  .footer-brand{grid-column:1/-1;text-align:center;display:flex;flex-direction:column;align-items:center}
  .footer-brand p{max-width:300px}.footer-social{grid-column:1/-1;text-align:center}
  .social-pair{justify-content:center;gap:30px}.footer-bottom{text-align:center}
}
@media(max-width:370px){.hero-eyebrow{font-size:9px!important;padding:7px 5px}}
@media(prefers-reduced-motion:reduce){.process-card,.wa-float,.social-action,.social-orb{transition:none!important}.process-card.is-pending{opacity:1;transform:none}}

/* V2.2: Restore the site's white/lavender palette for the methodology only. */
.process-light{background:radial-gradient(ellipse at 82% 18%,#ece3ff 0%,transparent 48%),linear-gradient(145deg,#faf9ff 0%,#f6f3ff 55%,#f1f2ff 100%)!important;color:#111827!important}
.process-light .text-indigo-300{color:#7553e7!important}
.process-light .text-slate-300{color:#555d73!important}
.process-light .process-card{background:rgba(255,255,255,.91)!important;border:1px solid #ddd7f5!important;color:#151a30!important;box-shadow:0 8px 28px rgba(91,67,160,.07)}
.process-light .process-card.is-revealed{border-color:#a18bf3!important;box-shadow:inset 3px 0 0 #8b5cf6,0 14px 30px rgba(91,67,160,.13)}
.process-light .process-card.is-pending{opacity:.48}
/* Only wide desktop: initially show six service cards. Mobile behavior stays untouched. */
@media(min-width:1024px){
  #servicios:not(.desktop-expanded) .desktop-extra-service{display:none!important}
  #servicios.desktop-expanded .desktop-extra-service{display:flex!important;animation:serviceDesktopReveal .38s ease-out both}
}
@keyframes serviceDesktopReveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#servicios.desktop-expanded .desktop-extra-service{animation:none!important}}

/* V2.3: approved mobile eyebrow with violet side strokes, not a capsule. */
@media(max-width:767px){
 .hero-eyebrow{display:flex!important;align-items:center;justify-content:center;gap:9px;width:100%;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;font-size:clamp(9px,2.45vw,11px)!important;letter-spacing:.025em!important;white-space:nowrap!important;color:#6450db!important}
 .hero-eyebrow::before,.hero-eyebrow::after{content:"";display:block;flex:1 1 14px;max-width:42px;height:1.5px;background:linear-gradient(90deg,transparent,#8065ec)}
 .hero-eyebrow::after{background:linear-gradient(90deg,#8065ec,transparent)}
 .wa-float{bottom:calc(15px + env(safe-area-inset-bottom,0px))!important;right:14px!important;width:48px!important;height:48px!important}
}
@media(max-width:390px){.hero-eyebrow{gap:5px;font-size:9px!important}.hero-eyebrow::before,.hero-eyebrow::after{max-width:18px}}
.process-card{will-change:opacity,transform;transition:opacity .32s ease,transform .38s ease,border-color .38s ease,box-shadow .38s ease!important}
.process-card.is-pending{opacity:.38!important;transform:translateY(12px) scale(.985)!important;filter:saturate(.75)}
.process-card.is-revealed{opacity:1!important;transform:translateY(0) scale(1)!important;filter:none;box-shadow:inset 3px 0 0 #8b5cf6,0 14px 30px rgba(91,67,160,.13)!important}
@media(prefers-reduced-motion:reduce){.process-card.is-pending{opacity:1!important;transform:none!important;filter:none!important}}
/* Contain decorative overflow without disabling browser zoom. */
#inicio,#metodologia{overflow-x:clip}
html,body{overflow-x:clip}

/* V2.4 — WhatsApp official source asset provided by site owner */
.wa-float{background:transparent!important;box-shadow:none!important;isolation:isolate}
.wa-float .wa-symbol{display:block;width:100%!important;height:100%!important;object-fit:contain;filter:drop-shadow(0 5px 10px rgba(0,0,0,.14))}
.whatsapp-action .social-orb{background:transparent!important;box-shadow:none!important}
.wa-footer-logo{width:70px;height:70px;max-width:none;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.24))}
@media(max-width:767px){
.hero-eyebrow{display:flex!important;align-items:center;justify-content:center;gap:8px;max-width:100%;width:100%;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;letter-spacing:.015em!important;font-size:clamp(9px,2.3vw,12px)!important;white-space:nowrap!important}
.hero-eyebrow:before,.hero-eyebrow:after{content:"";display:block;min-width:10px;max-width:40px;flex:1;height:2px;background:linear-gradient(90deg,#4565f6,#aa48e9)}
.wa-float{width:54px!important;height:54px!important;right:16px!important;bottom:calc(18px + env(safe-area-inset-bottom,0px))!important}
}
/* Keep natural pinch zoom; avoid decorative content pushing the viewport sideways. */
html,body{max-width:100%;overflow-x:clip}
#inicio,#metodologia{overflow-x:clip}