:root{--black:#0a0a0a;--dark:#111111;--dark-2:#1a1a1a;--dark-3:#222222;--accent:#C2F08E;--accent-dark:#a8e060;--accent-glow:rgba(194,240,142,.15);--white:#fff;--gray:#888;--gray-light:#ccc;--text:#e0e0e0;--radius:16px;--radius-sm:10px;--transition:all .3s cubic-bezier(.4,0,.2,1)}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',system-ui,sans-serif;background:var(--black);color:var(--text);overflow-x:hidden;line-height:1.6}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--dark)}::-webkit-scrollbar-thumb{background:var(--accent);border-radius:3px}
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:20px 60px;display:flex;align-items:center;justify-content:space-between;background:rgba(10,10,10,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(194,240,142,.08);transition:var(--transition)}
.navbar.scrolled{padding:14px 60px;background:rgba(10,10,10,.97)}
.nav-logo{font-size:28px;font-weight:800;color:var(--white);text-decoration:none;letter-spacing:-1px}.nav-logo span{color:var(--accent)}
.nav-links{display:flex;align-items:center;gap:40px;list-style:none}.nav-links a{color:var(--gray-light);text-decoration:none;font-size:15px;transition:var(--transition)}.nav-links a:hover{color:var(--accent)}
.nav-cta{background:var(--accent)!important;color:var(--black)!important;padding:12px 24px!important;border-radius:var(--radius-sm)!important;font-weight:700!important}
.nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:5px;background:none;border:none}.nav-burger span{width:24px;height:2px;background:var(--white);border-radius:2px;display:block;transition:var(--transition)}
.hero{min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding:120px 60px 80px}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 60% 40%,rgba(194,240,142,.06) 0%,transparent 60%),radial-gradient(ellipse 40% 40% at 20% 80%,rgba(194,240,142,.04) 0%,transparent 50%)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(194,240,142,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(194,240,142,.03) 1px,transparent 1px);background-size:60px 60px}
.hero-content{position:relative;z-index:2;max-width:1200px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(194,240,142,.1);border:1px solid rgba(194,240,142,.2);color:var(--accent);padding:8px 16px;border-radius:100px;font-size:13px;font-weight:500;letter-spacing:.5px;margin-bottom:28px}
.hero-badge::before{content:'';width:6px;height:6px;background:var(--accent);border-radius:50%;animation:pulse 2s infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.hero-title{font-size:clamp(48px,6vw,80px);font-weight:800;line-height:1.05;letter-spacing:-2px;color:var(--white);margin-bottom:24px}
.hero-title .highlight{color:var(--accent)}
.hero-subtitle{font-size:20px;color:var(--gray);line-height:1.6;margin-bottom:40px;max-width:480px}.hero-subtitle strong{color:var(--gray-light)}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:var(--black);padding:16px 32px;border-radius:var(--radius-sm);font-size:16px;font-weight:700;text-decoration:none;border:none;cursor:pointer;transition:var(--transition)}
.btn-primary:hover{background:var(--accent-dark);transform:translateY(-2px);box-shadow:0 16px 40px rgba(194,240,142,.25)}
.btn-secondary{display:inline-flex;align-items:center;gap:10px;background:transparent;color:var(--white);padding:16px 32px;border-radius:var(--radius-sm);font-size:16px;font-weight:600;text-decoration:none;border:1px solid rgba(255,255,255,.15);cursor:pointer;transition:var(--transition)}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.hero-image{position:relative;display:flex;justify-content:center;align-items:center}
.hero-photo-container{position:relative;width:580px;height:720px}
.hero-photo-placeholder{width:100%;height:100%;border-radius:24px;background:linear-gradient(135deg,var(--dark-2) 0%,var(--dark-3) 100%);border:1px solid rgba(194,240,142,.15);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--gray);text-align:center;padding:40px;position:relative;overflow:hidden}
.hero-photo-placeholder::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at center,rgba(194,240,142,.05) 0%,transparent 60%)}
.hero-photo-placeholder .photo-icon{font-size:64px;opacity:.3;position:relative}
.hero-photo-placeholder p{opacity:.5;font-size:14px;position:relative}
.hero-photo-placeholder strong{color:var(--accent);opacity:.7;font-size:16px;position:relative}
.hero-float-card{position:absolute;background:rgba(26,26,26,.95);backdrop-filter:blur(10px);border:1px solid rgba(194,240,142,.15);border-radius:14px;padding:14px 20px;display:flex;align-items:center;gap:12px;white-space:nowrap}
.hero-float-card-1{bottom:60px;left:-40px;animation:float 4s ease-in-out infinite}
.hero-float-card-2{top:60px;right:-40px;animation:float 4s ease-in-out infinite 2s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.float-icon{width:40px;height:40px;background:var(--accent-glow);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;border:1px solid rgba(194,240,142,.15)}
.float-text strong{display:block;color:var(--white);font-size:14px;font-weight:600}.float-text span{color:var(--gray);font-size:12px}
.hero-stats{display:flex;gap:40px;margin-top:50px;padding-top:40px;border-top:1px solid rgba(255,255,255,.06)}
.stat-item strong{display:block;font-size:36px;font-weight:800;color:var(--accent);letter-spacing:-1px;line-height:1}.stat-item span{font-size:13px;color:var(--gray)}
section{padding:100px 60px}.container{max-width:1200px;margin:0 auto}
.section-tag{display:inline-block;color:var(--accent);font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px}
.section-title{font-size:clamp(36px,4vw,54px);font-weight:800;color:var(--white);letter-spacing:-1.5px;line-height:1.1;margin-bottom:20px}
.section-subtitle{font-size:18px;color:var(--gray);max-width:560px;line-height:1.7}
.about{background:var(--dark)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.about-main-box{background:var(--dark-2);border:1px solid rgba(194,240,142,.1);border-radius:24px;padding:50px 40px;position:relative;overflow:hidden}
.about-main-box::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.about-quote{font-size:28px;font-weight:700;color:var(--white);line-height:1.3;letter-spacing:-.5px;margin-bottom:24px}.about-quote span{color:var(--accent)}
.about-method{display:flex;flex-direction:column;gap:16px;margin-top:32px}
.method-item{display:flex;align-items:center;gap:14px;padding:14px 20px;background:rgba(194,240,142,.04);border-radius:10px;border:1px solid rgba(194,240,142,.08);transition:var(--transition)}
.method-item:hover{background:rgba(194,240,142,.08);border-color:rgba(194,240,142,.2)}
.method-emoji{font-size:22px;width:44px;height:44px;background:var(--dark-3);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.method-item strong{display:block;color:var(--white);font-size:15px;margin-bottom:2px}.method-item span{color:var(--gray);font-size:13px}
.about-content{display:flex;flex-direction:column;gap:32px}
.about-text p{font-size:17px;color:var(--gray);line-height:1.8;margin-bottom:16px}.about-text strong{color:var(--gray-light)}
.about-pillars{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pillar{padding:20px;background:var(--dark-2);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);transition:var(--transition)}
.pillar:hover{border-color:rgba(194,240,142,.2);transform:translateY(-2px)}
.pillar-icon{font-size:24px;margin-bottom:10px;display:block}.pillar strong{display:block;color:var(--white);font-size:15px;margin-bottom:4px}.pillar span{color:var(--gray);font-size:13px;line-height:1.5}
.services{background:var(--black)}
.services-header{text-align:center;max-width:600px;margin:0 auto 70px}
.services-header .section-subtitle{margin:0 auto}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.services-grid-row2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:24px}
.service-card{background:var(--dark);border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:36px 30px;transition:var(--transition);position:relative;overflow:hidden}
.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:0;transition:var(--transition)}
.service-card:hover{border-color:rgba(194,240,142,.15);transform:translateY(-6px);box-shadow:0 24px 60px rgba(0,0,0,.4)}
.service-card:hover::before{opacity:1}
.service-icon{width:56px;height:56px;background:var(--accent-glow);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:24px;border:1px solid rgba(194,240,142,.15)}
.service-card h3{font-size:20px;font-weight:700;color:var(--white);margin-bottom:12px;letter-spacing:-.3px}
.service-card p{font-size:15px;color:var(--gray);line-height:1.7}
.service-tag{display:inline-block;margin-top:20px;padding:5px 12px;background:rgba(194,240,142,.08);color:var(--accent);border-radius:100px;font-size:12px;font-weight:500}
.packs{background:var(--dark);position:relative;overflow:hidden}
.packs::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:800px;height:800px;background:radial-gradient(ellipse,rgba(194,240,142,.04) 0%,transparent 60%);pointer-events:none}
.packs-header{text-align:center;max-width:600px;margin:0 auto 70px}
.packs-header .section-subtitle{margin:0 auto}
.packs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
.pack-card{background:var(--dark-2);border:1px solid rgba(255,255,255,.06);border-radius:24px;padding:40px 36px;position:relative;transition:var(--transition);display:flex;flex-direction:column;overflow:hidden}
.pack-card:hover{transform:translateY(-8px);box-shadow:0 32px 80px rgba(0,0,0,.4)}

/* Imagen de fondo de cada pack */
.pack-bg-img {
    position: absolute;
    top: 0;
    right: 0;
    width: 55%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    opacity: 0.45;
    z-index: 0;
    pointer-events: none;
    /* gradiente que funde la foto hacia la izquierda */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.7) 35%, black 100%);
    mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.7) 35%, black 100%);
    transition: opacity .4s;
}
.pack-card:hover .pack-bg-img {
    opacity: 0.6;
}
/* Todo el contenido del pack queda sobre la imagen */
.pack-card > *:not(.pack-bg-img) {
    position: relative;
    z-index: 1;
}
.pack-card.featured{border-color:rgba(194,240,142,.3);background:linear-gradient(135deg,rgba(194,240,142,.05) 0%,var(--dark-2) 100%);transform:scale(1.04);box-shadow:0 0 80px rgba(194,240,142,.08)}
.pack-card.featured:hover{transform:scale(1.04) translateY(-8px)}
.pack-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--accent);color:var(--black);font-size:12px;font-weight:700;padding:6px 18px;border-radius:100px;letter-spacing:.5px;white-space:nowrap}
.pack-icon{font-size:42px;margin-bottom:20px;display:block}
.pack-title{font-size:13px;font-weight:600;color:var(--accent);letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
.pack-name{font-size:32px;font-weight:800;color:var(--white);letter-spacing:-1px;margin-bottom:6px}
.pack-tagline{font-size:15px;color:var(--gray);margin-bottom:32px;line-height:1.5}
.pack-features{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:36px;flex:1}
.pack-features li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:var(--gray-light);line-height:1.4}
.pack-features li::before{content:"¹3";color:var(--accent);font-weight:700;flex-shrink:0;margin-top:1px}
.pack-for{padding:14px 18px;background:rgba(194,240,142,.04);border:1px solid rgba(194,240,142,.1);border-radius:10px;margin-bottom:24px}
.pack-for strong{display:block;color:var(--accent);font-size:11px;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px}.pack-for span{color:var(--gray);font-size:14px}
.pack-cta{display:block;text-align:center;padding:16px;border-radius:var(--radius-sm);font-size:15px;font-weight:700;text-decoration:none;transition:var(--transition);cursor:pointer;border:none}
.pack-cta-primary{background:var(--accent);color:var(--black)}
.pack-cta-primary:hover{background:var(--accent-dark);box-shadow:0 8px 30px rgba(194,240,142,.3);transform:translateY(-1px)}
.pack-cta-secondary{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.15)!important}
.pack-cta-secondary:hover{border-color:var(--accent)!important;color:var(--accent)}
.results{background:var(--black)}
.results-header{text-align:center;max-width:600px;margin:0 auto 50px}
.results-header .section-subtitle{margin:0 auto}

/* Carrusel de marcas dentro de Resultados */
.results-brands-wrapper {
    width: calc(100% + 120px);
    margin: 0 -60px 70px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}
.results-brands-track {
    display: flex;
    align-items: center;
    gap: 24px;
    width: max-content;
    animation: brandScrollReverse 35s linear infinite;
}
.results-brands-track:hover { animation-play-state: paused; }
@keyframes brandScrollReverse {
    0%   { transform: translateX(-50%); }
    100% { transform: translateX(0); }
}
@media(max-width:640px) {
    .results-brands-wrapper { width: calc(100% + 40px); margin: 0 -20px 50px; }
    .brand-logo-item { width: 260px; height: 160px; }
}
.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.metric-card{background:var(--dark);border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:36px 30px;text-align:center;transition:var(--transition)}
.metric-card:hover{border-color:rgba(194,240,142,.15);transform:translateY(-4px)}
.metric-number{font-size:52px;font-weight:800;color:var(--accent);letter-spacing:-2px;line-height:1;margin-bottom:8px}
.metric-label{font-size:14px;color:var(--gray)}
.contact{background:var(--dark)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:16px}
.contact-option{display:flex;align-items:flex-start;gap:18px;padding:20px 24px;background:var(--dark-2);border:1px solid rgba(255,255,255,.06);border-radius:16px;text-decoration:none;transition:var(--transition);cursor:pointer}
.contact-option:hover{border-color:rgba(194,240,142,.2);transform:translateX(4px)}
.contact-option-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.green-bg{background:rgba(37,211,102,.12)}.blue-bg{background:rgba(0,122,255,.12)}.orange-bg{background:rgba(255,149,0,.12)}.accent-bg{background:var(--accent-glow)}.red-bg{background:rgba(255,59,48,.12)}
.contact-option-text strong{display:block;color:var(--white);font-size:15px;margin-bottom:3px}
.contact-option-text span{color:var(--gray);font-size:13px;line-height:1.5}
.contact-form-box{background:var(--dark-2);border:1px solid rgba(255,255,255,.06);border-radius:24px;padding:48px 40px}
.contact-form-box h3{font-size:26px;font-weight:700;color:var(--white);letter-spacing:-.5px;margin-bottom:8px}
.contact-form-box>p{color:var(--gray);font-size:15px;margin-bottom:36px}
.form-group{margin-bottom:20px}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--gray-light);margin-bottom:8px;letter-spacing:.3px}
.form-group input,.form-group select,.form-group textarea{width:100%;background:var(--dark-3);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:14px 18px;color:var(--white);font-size:15px;font-family:inherit;transition:var(--transition);outline:none;-webkit-appearance:none;appearance:none}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:rgba(194,240,142,.4);background:rgba(194,240,142,.03)}
.form-group textarea{resize:vertical;min-height:120px}
.form-group select option{background:var(--dark-3);color:var(--white)}
.form-submit{width:100%;padding:16px;background:var(--accent);color:var(--black);border:none;border-radius:var(--radius-sm);font-size:16px;font-weight:700;cursor:pointer;transition:var(--transition);margin-top:8px}
.form-submit:hover{background:var(--accent-dark);box-shadow:0 8px 30px rgba(194,240,142,.25);transform:translateY(-1px)}
.upsell{background:var(--black);text-align:center;position:relative;overflow:hidden}
.upsell-collab {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 0 auto 28px;
}
.upsell-collab-name {
    font-size: 36px;
    font-weight: 800;
    color: var(--white);
    letter-spacing: -1px;
    line-height: 1;
}
.upsell-collab-dot {
    color: var(--accent);
}
.upsell-collab-plus {
    font-size: 28px;
    font-weight: 800;
    color: var(--accent);
    line-height: 1;
}
.upsell-collab-logo {
    height: 36px;
    width: auto;
    object-fit: contain;
    object-position: center;
    opacity: 0.95;
    filter: brightness(1.1);
    display: block;
}
.upsell-inner{background:linear-gradient(135deg,rgba(194,240,142,.06) 0%,rgba(10,10,10,0) 60%);border:1px solid rgba(194,240,142,.1);border-radius:32px;padding:80px 60px;position:relative}
.upsell-inner::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:300px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.upsell h2{font-size:clamp(36px,4vw,54px);font-weight:800;color:var(--white);letter-spacing:-1.5px;margin-bottom:20px}
.upsell h2 span{color:var(--accent)}
.upsell p{font-size:18px;color:var(--gray);max-width:520px;margin:0 auto 40px;line-height:1.7}
.upsell-features{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.upsell-feature{display:flex;align-items:center;gap:8px;color:var(--gray-light);font-size:15px}
.upsell-feature::before{content:"¹3";color:var(--accent);font-weight:700}
footer{background:var(--dark);border-top:1px solid rgba(255,255,255,.06);padding:60px}
.footer-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px}
.footer-logo{font-size:28px;font-weight:800;color:var(--white);letter-spacing:-1px;text-decoration:none}
.footer-logo span{color:var(--accent)}
.footer-brand p{color:var(--gray);font-size:14px;line-height:1.7;margin-top:16px;max-width:280px}
.footer-col h4{color:var(--white);font-size:14px;font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:20px}
.footer-col a{display:block;color:var(--gray);text-decoration:none;font-size:14px;margin-bottom:12px;transition:var(--transition)}
.footer-col a:hover{color:var(--accent)}
.footer-bottom{max-width:1200px;margin:40px auto 0;padding-top:30px;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center}
.footer-bottom p{color:var(--gray);font-size:14px}
.whatsapp-float{position:fixed;bottom:32px;right:32px;z-index:999;width:60px;height:60px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;text-decoration:none;box-shadow:0 8px 30px rgba(37,211,102,.4);transition:var(--transition);animation:wabounce 3s ease-in-out infinite 5s}
.whatsapp-float:hover{transform:scale(1.1);box-shadow:0 12px 40px rgba(37,211,102,.5)}
@keyframes wabounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.mobile-menu{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(10,10,10,.98);backdrop-filter:blur(20px);z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1)}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a{color:var(--white);text-decoration:none;font-size:28px;font-weight:700;letter-spacing:-.5px;transition:var(--transition)}
.mobile-menu a:hover{color:var(--accent)}
.mobile-menu-close{position:absolute;top:28px;right:30px;background:none;border:none;color:var(--white);font-size:32px;cursor:pointer}
@media(max-width:1024px){.navbar,.navbar.scrolled{padding:20px 30px}.hero{padding:120px 30px 80px}section{padding:80px 30px}footer{padding:60px 30px}.hero-content{grid-template-columns:1fr;gap:60px}.hero-photo-container{width:100%;max-width:520px;height:620px;margin:0 auto}.hero-image{order:-1}.about-grid{grid-template-columns:1fr;gap:50px}.services-grid{grid-template-columns:repeat(2,1fr)}.services-grid-row2{grid-template-columns:repeat(2,1fr)}.packs-grid{grid-template-columns:1fr;max-width:500px;margin:0 auto}.pack-card.featured{transform:none}.pack-card.featured:hover{transform:translateY(-8px)}.clients-grid{grid-template-columns:repeat(4,1fr)}.metrics-grid{grid-template-columns:repeat(2,1fr)}.contact-grid{grid-template-columns:1fr;gap:50px}.footer-inner{grid-template-columns:1fr 1fr;gap:40px}.nav-links{display:none}.nav-burger{display:flex}}
@media(max-width:640px){.navbar,.navbar.scrolled{padding:16px 20px}.hero{padding:100px 20px 60px}section{padding:60px 20px}footer{padding:50px 20px}.hero-stats{flex-direction:column;gap:20px}.services-grid{grid-template-columns:1fr}.services-grid-row2{grid-template-columns:1fr}.clients-grid{grid-template-columns:repeat(3,1fr);gap:12px}.metrics-grid{grid-template-columns:1fr 1fr}.footer-inner{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:12px;text-align:center}.about-pillars{grid-template-columns:1fr}.upsell-inner{padding:50px 24px}.contact-form-box{padding:36px 24px}.hero-float-card{display:none}.hero-photo-container{height:500px}}

/* HERO VIDEO FONDO */.brand-logo-item {
    flex-shrink: 0;
    width: 420px;
    height: 240px;
    background: transparent;
    border: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: transform .3s;
}

.brand-logo-item:hover {
    transform: scale(1.06);
}

.brand-logo-item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 12px;
    filter: grayscale(40%) brightness(1.1);
    transition: filter .3s;
}

.brand-logo-item:hover img {
    filter: grayscale(0%) brightness(1.25);
}

@keyframes brandScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* HERO VIDEO FONDO */
.hero-video-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
    opacity: 0.55;
}

/* Overlay: oscurece y funde los bordes con el fondo */
.hero-video-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        /* fade top y bottom */
        linear-gradient(to bottom, var(--black) 0%, transparent 25%, transparent 70%, var(--black) 100%),
        /* fade izquierda y derecha */
        linear-gradient(to right, var(--black) 0%, transparent 20%, transparent 80%, var(--black) 100%),
        /* overlay oscuro central para legibilidad */
        rgba(10, 10, 10, 0.45);
    pointer-events: none;
}

/* Hero centrado (modo video-fondo) */
.hero-content--centered {
    grid-template-columns: 1fr !important;
    max-width: 700px !important;
    text-align: left;
    margin-left: 0 !important;
}

.hero-content--centered .hero-subtitle {
    margin-left: 0;
    margin-right: auto;
}

.hero-content--centered .hero-actions {
    justify-content: flex-start;
}

.hero-content--centered .hero-stats {
    justify-content: flex-start;
}

/* FontAwesome icon styles */
.service-icon i,
.method-emoji i,
.pillar-icon i,
.contact-option-icon i,
.pack-icon i,
.client-emoji i {
    font-size: inherit;
    line-height: 1;
}
.service-icon i { font-size: 24px; color: var(--accent); }
.method-emoji i { font-size: 20px; color: var(--accent); }
.pillar-icon i  { font-size: 22px; color: var(--accent); }
.contact-option-icon i { font-size: 20px; color: var(--accent); }
.pack-icon i { font-size: 36px; color: var(--accent); }
.client-emoji i { font-size: 26px; color: var(--gray); }
.btn-primary i, .btn-secondary i, .form-submit i, .pack-cta i { font-size: 15px; }
.fa-brands.fa-whatsapp { color: #25D366 !important; }
.contact-option-icon.green-bg i { color: #25D366; }
.whatsapp-float i { font-size: 28px; color: #fff; }

/* ===== BADGE CARDS FLOTANTES ===== */
.hero-badge-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(17, 17, 17, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(194, 240, 142, 0.18);
    border-radius: 14px;
    padding: 12px 18px;
    white-space: nowrap;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
    z-index: 10;
}

.badge-card-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(194, 240, 142, 0.12);
    border: 1px solid rgba(194, 240, 142, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.badge-card-icon i {
    font-size: 16px;
    color: var(--accent);
}

.badge-card-text strong {
    display: block;
    color: var(--white);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

.badge-card-text span {
    color: var(--gray);
    font-size: 11px;
    letter-spacing: 0.2px;
}

/* Posiciones de cada cartelito */
.card-top-right {
    top: 40px;
    right: -50px;
    animation: floatCard 5s ease-in-out infinite;
}

.card-bottom-left {
    bottom: 60px;
    left: -50px;
    animation: floatCard 5s ease-in-out infinite 1.5s;
}

.card-mid-right {
    top: 48%;
    right: -55px;
    transform: translateY(-50%);
    animation: floatCardMid 5s ease-in-out infinite 3s;
}

@keyframes floatCard {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-8px); }
}
@keyframes floatCardMid {
    0%, 100% { transform: translateY(-50%); }
    50%       { transform: translateY(calc(-50% - 8px)); }
}

/* Tablet: mover adentro para que no se corten */
@media (max-width: 1200px) {
    .card-top-right  { right: -20px; }
    .card-bottom-left { left: -20px; }
    .card-mid-right  { right: -20px; }
}

/* En mobile ocultar los laterales que se salgan */
@media (max-width: 640px) {
    .card-top-right  { top: 16px; right: 10px; }
    .card-bottom-left { bottom: 16px; left: 10px; }
    .card-mid-right  { display: none; }
}