
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/inter-v20-latin-regular.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/inter-v20-latin-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/inter-v20-latin-600.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/inter-v20-latin-700.woff2') format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/sora-v20-latin-700.woff2') format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/sora-v20-latin-800.woff2') format('woff2')}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
.skip-link {
  position: absolute; left: 16px; top: -48px; z-index: 200;
  background: #fff; color: #000; padding: 0.75rem 1rem;
  border-radius: 10px; font-weight: 800; transition: top 0.2s ease;
}
.skip-link:focus { top: 16px; }
:focus-visible {
  outline: 3px solid rgba(255,140,0,0.55);
  outline-offset: 3px;
  border-radius: 8px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-weight:400;background-color:#ffffff;color:#1a1d29;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;overflow-x:hidden}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font:inherit}
h1,h2,h3,h4,h5,h6,.section-title,.how-title,.cta-banner h3,.project-section h2,.testimonials-title h2,.number-label,.contact-sec-title h2,.footer-col h4,.portfolio-overlay h3,.testimonial-author,.contact-info-value,.info-value,.step-card h3,.value-card h4,.nav-cta,.how-badge,.contact-sec-label{font-family:'Sora','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700}
.section-title,.how-title,.how-badge,.contact-sec-title h2,.testimonials-title h2,.project-section h2,.cta-banner h3,.portfolio-overlay h3,.testimonial-author,.number-label,.footer-col h4,.step-card h3{font-weight:800}
:root{--neon-orange:#ff6e00;--neon-orange-alt:#ff6e00;--neon-blue:#005bcf;--navy:#00214c;--bg-darker:#f5f7fa;--bg-dark:#ffffff;--bg-black:#00214c;--card-bg:#ffffff;--card-border:rgba(0,33,76,0.12)}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--bg-dark)}
::-webkit-scrollbar-thumb{background:var(--neon-orange);border-radius:4px}
.header{position:fixed;top:0;left:0;right:0;z-index:50;background:#ffffff;border-bottom:1px solid rgba(0,33,76,0.08);box-shadow:0 1px 3px rgba(0,33,76,0.05);transition:transform .25s ease}.header.header-hidden{transform:translateY(-100%)}
.header-nav{max-width:96rem;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between;height:5rem}
@media (min-width:640px){.header-nav{height:7rem;padding:0 1.5rem}}
@media (min-width:768px){.header-nav{height:9rem;padding:0 2rem}}
.header-logo{display:flex;align-items:center}
.header-logo img{width:auto;height:2.5rem}
@media (min-width:640px){.header-logo img{height:3rem}}
@media (min-width:768px){.header-logo img{height:3.5rem}}
.nav-links{display:none;align-items:center;gap:1.5rem;flex-wrap:wrap}
@media (min-width:768px){.nav-links{display:flex}}
.nav-links a{color:#d1d5db;font-size:0.875rem;font-weight:500;transition:color 0.2s;white-space:nowrap}
.nav-links a:hover{color:var(--neon-orange)}
.nav-cta{padding:0.58rem 1rem;background:var(--neon-orange);color:#000;font-weight:800;border-radius:0.6rem;font-size:0.875rem;transition:background 0.2s}
.nav-cta:hover{background:#e66d00}
.mobile-menu-btn{display:flex;align-items:center;justify-content:center;color:#fff}
.mobile-menu-btn svg{width:40px;height:40px;display:block}
@media (min-width:768px){.mobile-menu-btn{display:none}}
.mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#ffffff;z-index:100;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:2rem}
.mobile-menu.active{display:flex}
.mobile-menu a{color:#fff;font-size:1.25rem;font-weight:600;text-align:center}
.mobile-menu a:hover{color:var(--neon-orange)}
.mobile-close{position:absolute;top:1.5rem;right:1.5rem;color:#fff;font-size:2rem}
.section{padding:5rem 1rem}
@media (min-width:640px){.section{padding:5rem 1.5rem}}
@media (min-width:1024px){.section{padding:5rem 2rem}}
.section-inner{max-width:96rem;margin:0 auto}
.text-orange{color:var(--neon-orange)}
.bg-darker{background:var(--bg-darker)}
.bg-dark{background:var(--bg-dark)}
.bg-black{background:var(--bg-black)}
.footer{background:var(--bg-black);border-top:1px solid rgba(255,255,255,0.06);padding:4rem 1rem 2rem}
.footer-inner{max-width:96rem;margin:0 auto;display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:768px){.footer-inner{grid-template-columns:2fr 1fr 1fr 1fr 1fr}}
.footer-brand p{color:#f0f0f0;font-size:0.875rem;line-height:1.7;margin-top:1rem}
.footer-brand img{height:3rem;width:auto;margin-bottom:0.75rem}
@media (min-width:768px){.footer-brand img{height:3.5rem}}
.footer-col h3{color:#fff;font-weight:700;font-size:0.875rem;margin-bottom:1rem}
.footer-col a,.footer-col p{color:#f0f0f0;font-size:0.875rem;display:block;margin-bottom:0.5rem}
.footer-col a:hover{color:var(--neon-orange)}
.footer-bottom{max-width:96rem;margin:2rem auto 0;padding-top:2rem;border-top:1px solid rgba(255,255,255,0.06);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
.footer-bottom p,.footer-bottom a{color:#f0f0f0;font-size:0.8125rem}
.footer-bottom a:hover{color:var(--neon-orange)}
.footer-legal{display:flex;gap:1.5rem}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:rgba(10,10,10,0.98);border-top:2px solid var(--neon-orange);padding:1.5rem 1rem;z-index:9998;box-shadow:0 -4px 20px rgba(0,0,0,0.5);display:block;opacity:1;transition:opacity 0.4s ease,transform 0.4s ease;transform:translateY(0)}
.cookie-banner.hidden{opacity:0;transform:translateY(100%)}
.cookie-banner-inner{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:1.25rem;align-items:center}
@media (min-width:768px){.cookie-banner-inner{flex-direction:row;justify-content:space-between;align-items:center}}
.cookie-banner-text{flex:1;color:#f0f0f0;font-size:0.9375rem;line-height:1.6;text-align:center}
@media (min-width:768px){.cookie-banner-text{text-align:left;padding-right:1rem}}
.cookie-banner-text a{color:var(--neon-orange);text-decoration:underline;font-weight:600;transition:color 0.2s}
.cookie-banner-text a:hover{color:#ff9d2e}
.cookie-banner-buttons{display:flex;flex-wrap:wrap;gap:0.75rem;justify-content:center}
.cookie-btn{padding:0.75rem 1.5rem;border-radius:0.5rem;font-weight:600;font-size:0.875rem;cursor:pointer;transition:all 0.3s ease;border:none;font-family:'Inter',sans-serif}
.cookie-btn-reject{background:#fff;border:2px solid #fff;color:#00214c}
.cookie-btn-reject:hover{background:#e5e7eb;border-color:#e5e7eb;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.cookie-btn-essential{background:rgba(255,255,255,0.1);color:#fff;border:2px solid rgba(255,255,255,0.2)}
.cookie-btn-essential:hover{background:rgba(255,255,255,0.15);border-color:rgba(255,255,255,0.3)}
.cookie-btn-accept{background:var(--neon-orange);color:#000;border:2px solid var(--neon-orange)}
.cookie-btn-accept:hover{background:#e66d00;border-color:#e66d00;transform:translateY(-2px);box-shadow:0 4px 12px rgba(255,140,0,0.3)}
@media (max-width:640px){.cookie-banner{padding:1.25rem 1rem}.cookie-btn{flex:1;min-width:120px;text-align:center}}
#whatsapp-float-btn{position:fixed;bottom:20px;right:20px;width:60px;height:60px;background-color:#25D366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:9997;box-shadow:0 4px 12px rgba(0,0,0,0.3);transition:all 0.3s ease;text-decoration:none;padding:0;will-change:transform}
#whatsapp-float-btn:hover{transform:scale(1.1);box-shadow:0 6px 16px rgba(0,0,0,0.4);background-color:#128C7E}
#whatsapp-float-btn svg{width:32px;height:32px;fill:#fff}
@media (max-width:768px){#whatsapp-float-btn{width:56px;height:56px;bottom:15px;right:15px}#whatsapp-float-btn svg{width:28px;height:28px}}
@media (max-width:480px){#whatsapp-float-btn{width:52px;height:52px;bottom:12px;right:12px}#whatsapp-float-btn svg{width:26px;height:26px}}
/* ===== ESTILOS ESPECÍFICOS PARA PÁGINAS LEGALES ===== */
.legal-hero{position:relative;min-height:22vh;display:flex;align-items:center;justify-content:center;background: #ffffff;padding:8rem 1rem 2.5rem}
@media (min-width:768px){.legal-hero{padding-top:10.5rem}}
.legal-hero-content{text-align:center;max-width:48rem;margin:0 auto}
.legal-hero h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.1;margin-bottom:1rem}
.legal-hero h1 .highlight{color:var(--neon-orange)}
.legal-hero p{font-size:clamp(1rem,2vw,1.125rem);color:#f0f0f0;max-width:42rem;margin:0 auto;line-height:1.625}
.legal-content{padding:4rem 1rem 6rem}
@media (min-width:640px){.legal-content{padding:5rem 1.5rem 7rem}}
.legal-container{max-width:800px;margin:0 auto}
.legal-container h2{font-size:clamp(1.5rem,3vw,2rem);color:var(--neon-orange);margin:3rem 0 1rem;padding-bottom:0.5rem;border-bottom:2px solid rgba(255,140,0,0.2)}
.legal-container h3{font-size:1.25rem;color:#fff;margin:2rem 0 0.75rem}
.legal-container p{color:#f0f0f0;margin-bottom:1rem;line-height:1.7}
.legal-container ul{color:#f0f0f0;margin:1rem 0 1rem 1.5rem;list-style:disc}
.legal-container li{margin-bottom:0.5rem;line-height:1.6}
.legal-container a{color:var(--neon-orange);transition:color 0.2s;overflow-wrap:anywhere}
.legal-container a:hover{text-decoration:underline;color:#ff9d2e}
.legal-container strong{color:#fff}
.back-link{display:inline-flex;align-items:center;gap:0.5rem;color:var(--neon-orange);font-weight:600;font-size:0.9375rem;margin-bottom:2rem;transition:gap 0.2s}
.back-link:hover{gap:0.75rem;text-decoration:underline}
.last-updated{color:#888;font-size:0.875rem;margin-bottom:2rem;display:block}

/* ===== UNIFICACIÓN PYMEWEBAPP 2026 ===== */
.btn-whatsapp{display:inline-flex;align-items:center;justify-content:center;gap:0.75rem;max-width:100%;line-height:1.25;text-align:center;box-shadow:0 10px 24px rgba(37,211,102,0.28)}
.btn-whatsapp svg{flex:0 0 auto}
@media (max-width:640px){.btn-whatsapp{width:100%;max-width:22rem;padding:0.9rem 1.15rem;font-size:0.98rem;gap:0.5rem}.btn-whatsapp svg{width:1.2rem;height:1.2rem}}
#whatsapp-float-btn{background:#25D366!important;box-shadow:0 10px 24px rgba(37,211,102,0.32),0 6px 18px rgba(0,0,0,0.35)!important;transition:transform 0.25s ease,box-shadow 0.25s ease,background 0.25s ease!important}
#whatsapp-float-btn:hover{transform:translateY(-2px) scale(1.08)!important;background:#1ebe5d!important;box-shadow:0 14px 30px rgba(37,211,102,0.4),0 10px 24px rgba(0,0,0,0.42)!important}
@media (max-width:768px){#whatsapp-float-btn{width:58px!important;height:58px!important;bottom:16px!important;right:16px!important}#whatsapp-float-btn svg{width:29px!important;height:29px!important}}
@media (max-width:480px){#whatsapp-float-btn{width:56px!important;height:56px!important;bottom:14px!important;right:14px!important}#whatsapp-float-btn svg{width:28px!important;height:28px!important}}
@media (max-width:640px){.hero,.legal-hero{padding-top:7.5rem}.footer-legal{flex-direction:column;gap:0.75rem}.pricing-card,.extra-card,.cost-card{border-radius:16px}.pricing-card{padding:2rem 1.25rem}.price-amount{font-size:3rem}}

:root{--neon-orange:#ff6e00}
/* ===== HEADER ID?NTICO A LA HOME ===== */
.header{position:fixed;top:0;left:0;right:0;z-index:50;background:#ffffff;border-bottom:1px solid rgba(0,33,76,0.08);box-shadow:0 1px 3px rgba(0,33,76,0.05);transition:transform .25s ease}.header.header-hidden{transform:translateY(-100%)}
.header-nav{max-width:96rem;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between;height:5rem}
@media (min-width:640px){.header-nav{height:7rem;padding:0 1.5rem}}
@media (min-width:768px){.header-nav{height:9rem;padding:0 2rem}}
.header-logo{display:flex;align-items:center}
.header-logo img{width:auto;height:2.5rem}
@media (min-width:640px){.header-logo img{height:3rem}}
@media (min-width:768px){.header-logo img{height:3.5rem}}
.nav-links{display:none;align-items:center;gap:1.5rem;flex-wrap:wrap}
@media (min-width:768px){.nav-links{display:flex}}
.nav-links a{color:#d1d5db;font-size:0.875rem;font-weight:500;transition:color 0.2s;white-space:nowrap}
.nav-links a:hover{color:var(--neon-orange)}

.nav-cta:hover{background:#e66d00;color:#000}
.mobile-menu-btn{display:flex;align-items:center;justify-content:center;color:#fff}
.mobile-menu-btn svg{width:40px;height:40px;display:block}
@media (min-width:768px){.mobile-menu-btn{display:none}}
.mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#ffffff;z-index:100;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:2rem}
.mobile-menu.active{display:flex}
.mobile-menu a{color:#fff;font-size:1.25rem;font-weight:600;text-align:center}
.mobile-menu a:hover{color:var(--neon-orange)}
.mobile-close{position:absolute;top:1.5rem;right:1.5rem;color:#fff;font-size:2rem}


.btn-wa,.btn-whatsapp,.whatsapp-big{background:var(--o,#ff8c00)!important;color:#000!important;box-shadow:0 10px 24px rgba(255,140,0,.26)!important;border-color:var(--o,#ff8c00)!important}
.btn-wa:hover,.btn-whatsapp:hover,.whatsapp-big:hover{background:#ff9f1c!important;color:#000!important}
.btn-wa svg,.btn-whatsapp svg,.whatsapp-big svg{display:none!important}

/* Ajustes globales PymeWebApp: cabecera sólida, CTAs de contacto y modal WhatsApp */
.mobile-menu{background:#ffffff!important}
.nav-links{background:transparent!important}
.topbar,.menu-panel{background:#050505!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.btn-whatsapp,.whatsapp-big,.button.whatsapp,.whatsapp,.btn-wa{background:var(--neon-orange,#ff8c00)!important;background-image:none!important;color:#050505!important;border-color:var(--neon-orange,#ff8c00)!important;box-shadow:0 10px 26px rgba(255,140,0,.22)!important}
.btn-whatsapp svg,.whatsapp-big svg,.button.whatsapp svg,.whatsapp svg,.btn-wa svg{display:none!important}

/* ===== PYMEWEBAPP 2.0 - TEMA CLARO (override final) ===== */
body{background:#ffffff!important;color:#1a1d29!important}
.topbar,.menu-panel{background:transparent!important}
.nav-links a{color:#00214c!important}
.nav-cta{color:#000!important}
.mobile-menu-btn{color:#00214c!important}
.mobile-menu{background:#ffffff!important}
.mobile-menu a{color:#00214c!important}
.mobile-close{color:#00214c!important}
.nav-dropdown{position:relative}
.nav-dropdown-trigger{display:inline-flex;align-items:center;gap:4px}
.nav-caret{transition:transform 0.2s ease}
.nav-dropdown:hover .nav-caret,.nav-dropdown:focus-within .nav-caret{transform:rotate(180deg)}
.nav-dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:0.6rem;background:#ffffff;border:1px solid rgba(0,33,76,0.12);border-radius:12px;padding:0.5rem;min-width:200px;display:none;flex-direction:column;gap:0.15rem;box-shadow:0 20px 50px rgba(0,33,76,0.14);z-index:50}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu,.nav-dropdown-menu:hover{display:flex}
.nav-dropdown-menu a{color:#00214c!important;padding:0.6rem 0.8rem!important;border-radius:8px;font-size:0.85rem!important;white-space:nowrap}
.nav-dropdown-menu a:hover{background:rgba(255,110,0,0.1)}
.legal-hero{background:#ffffff!important}
.legal-hero p{color:#4b5566!important}
.legal-container h3{color:#00214c!important}
.legal-container p,.legal-container ul{color:#4b5566!important}
.legal-container strong{color:#00214c!important}
.last-updated{color:#6b7280!important}
.footer{background:#00214c!important}
.footer-brand p{color:rgba(255,255,255,0.75)!important}
.footer-col a,.footer-col p{color:rgba(255,255,255,0.75)!important}
.footer-bottom p,.footer-bottom a{color:rgba(255,255,255,0.65)!important}
.cookie-banner{background:rgba(0,33,76,0.98)!important}
.cookie-banner-text{color:rgba(255,255,255,0.85)!important}
.mobile-menu{overflow-y:auto!important;justify-content:flex-start!important;padding-top:5.5rem!important;padding-bottom:2.5rem!important;gap:1.1rem!important}
.nav-dropdown-menu::before{content:"";position:absolute;top:-0.6rem;left:0;right:0;height:0.6rem}
