/* ═══════════════════════════════════════════════
   Balaji Media — Main Stylesheet
   ═══════════════════════════════════════════════ */

/* ─── Reset & Variables ─── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{
    --color-primary:#0A0A0A;
    --color-secondary:#EF4444;
    --color-tertiary:#FAFAFA;
    --bg:#FAFAFA;
    --surface:#F5F5F5;
    --surface-raised:#E5E5E5;
    --text-primary:#0A0A0A;
    --text-secondary:#525252;
    --text-tertiary:#A3A3A3;
    --border-subtle:#E5E5E5;
    --border-medium:#D4D4D4;
    --border-strong:#0A0A0A;
    --font-display:'Archivo Black',Impact,'Arial Black',sans-serif;
    --font-body:'Work Sans',-apple-system,'Segoe UI',Helvetica,sans-serif;
    --space-xs:4px;
    --space-sm:8px;
    --space-md:16px;
    --space-lg:24px;
    --space-xl:32px;
    --space-2xl:48px;
    --space-3xl:64px;
    --space-4xl:96px
}
body{font-family:var(--font-body);font-size:16px;line-height:1.7;color:var(--text-primary);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);font-weight:400;color:var(--text-primary)}
.overline{font-size:11px;font-weight:700;line-height:1.4;letter-spacing:.12em;text-transform:uppercase}
.container{max-width:1200px;margin:0 auto;padding:0 var(--space-lg)}
:focus-visible{outline:none;box-shadow:0 0 0 2px #FAFAFA,0 0 0 4px #0A0A0A}
section{padding:var(--space-2xl) 0}
@media(max-width:768px){section{padding:var(--space-xl) 0}}

/* ─── Buttons ─── */
.btn{
    display:inline-flex;align-items:center;justify-content:center;
    font-family:var(--font-body);font-size:14px;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;
    padding:10px 24px;border-radius:0;cursor:pointer;
    transition:background .15s,color .15s,border-color .15s;
    text-decoration:none;line-height:1
}
.btn-primary{background:var(--color-primary);color:var(--color-tertiary);border:2px solid var(--color-primary)}
.btn-primary:hover{background:var(--color-secondary);border-color:var(--color-secondary)}
.btn-secondary{background:transparent;color:var(--text-primary);border:2px solid var(--color-primary)}
.btn-secondary:hover{background:var(--color-primary);color:var(--color-tertiary)}
.btn-lg{padding:14px 32px;font-size:16px}

/* ─── Navbar ─── */
.navbar{
    position:fixed;top:0;left:0;right:0;z-index:100;
    padding:var(--space-md) var(--space-lg);
    background:#FAFAFA;
    border-bottom:2px solid var(--border-strong);
    display:flex;align-items:center;justify-content:space-between;
    transition:background .25s;
}
.navbar-brand{display:flex;align-items:center;gap:var(--space-sm);text-decoration:none}
.navbar-logo{width:40px;height:40px;object-fit:contain;display:block}
.navbar-brand-text{font-family:var(--font-display);font-size:20px;letter-spacing:-.02em;color:var(--text-primary)}
.navbar-brand-text span{color:var(--color-secondary)}
.navbar-links{display:flex;gap:var(--space-xl);align-items:center}
.navbar-links a{
    text-decoration:none;font-size:14px;font-weight:600;color:var(--text-secondary);
    letter-spacing:.02em;padding:4px 0;
    border-bottom:2px solid transparent;transition:border-color .15s,color .15s,opacity .15s
}
.navbar-links a:hover{color:var(--text-primary);border-bottom-color:var(--border-strong)}
.navbar-links a.active{color:var(--text-primary);border-bottom:3px solid var(--color-secondary)}

/* scrolled navbar */
.navbar.scrolled{background:#EF4444;border-bottom-color:#EF4444}
.navbar.scrolled .navbar-brand-text{color:#FFFFFF}
.navbar.scrolled .navbar-brand-text span{color:#0A0A0A}
.navbar.scrolled .navbar-links a{color:#FFFFFF;opacity:.95}
.navbar.scrolled .navbar-links a:hover{color:#0A0A0A;border-bottom-color:#0A0A0A}
.navbar.scrolled .navbar-logo{filter:invert(1) brightness(2);mix-blend-mode:normal}
.navbar.scrolled .navbar-cta{background:#0A0A0A;color:#FFFFFF;border-color:#0A0A0A}

.navbar-cta{
    font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    padding:8px 20px;background:#0A0A0A;color:#FFFFFF;
    border:2px solid #0A0A0A;text-decoration:none;
    transition:background .15s,color .15s
}
.navbar-cta:hover{background:#EF4444;border-color:#EF4444;color:#FFFFFF}
.mobile-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px}
.mobile-toggle span{display:block;width:24px;height:2px;background:var(--text-primary);transition:transform .2s}
@media(max-width:768px){
    .navbar-links{display:none}
    .mobile-toggle{display:flex}
    .navbar-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg);border-bottom:2px solid var(--border-strong);padding:var(--space-lg);gap:var(--space-md)}
    .navbar-links.open a{font-size:16px}
}

/* ═══════════ HERO SLIDER ═══════════ */
.hero-wrapper{
    position:relative;
    padding-top:80px;
    overflow:hidden;
    background:var(--bg)
}
.hero-viewport{
    overflow:hidden;
    position:relative;
    transform:translate3d(0,0,0);
    perspective:1000px
}
.hero-track{
    display:flex;
    transition:transform .6s cubic-bezier(.16,1,.3,1);
    will-change:transform
}
.hero-slide{
    flex:0 0 100%;
    min-height:70vh;
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden
}
.hero-slide{background:var(--bg)}

/* Base gradient layer — static */
.hero-slide::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    background:
        linear-gradient(135deg, rgba(239,68,69,0.02) 0%, transparent 50%),
        linear-gradient(225deg, rgba(10,10,10,0.02) 0%, transparent 50%),
        var(--bg);
    opacity:1
}

/* Animated gradient mesh */
.hero-slide::after{
    content:'';
    position:absolute;
    inset:-100px;
    z-index:0;
    background:
        radial-gradient(ellipse 60% 50% at 20% 30%, rgba(239,68,69,0.08) 0%, transparent 60%),
        radial-gradient(ellipse 50% 60% at 80% 70%, rgba(10,10,10,0.05) 0%, transparent 60%),
        radial-gradient(ellipse 40% 40% at 50% 50%, rgba(239,68,69,0.03) 0%, transparent 70%);
    opacity:0;
    transform:scale(1.2);
    transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1);
    will-change:opacity,transform;
    pointer-events:none
}
.hero-slide.active::after{
    opacity:1;
    transform:scale(1)
}

/* Animated grid lines */
.hero-slide .grid-bg{
    position:absolute;
    inset:0;
    z-index:0;
    background-image:
        linear-gradient(var(--border-subtle) 1px, transparent 1px),
        linear-gradient(90deg, var(--border-subtle) 1px, transparent 1px);
    background-size:80px 80px;
    opacity:0;
    transform:translateY(40px);
    transition:opacity .6s cubic-bezier(.16,1,.3,1) .1s, transform .6s cubic-bezier(.16,1,.3,1) .1s;
    will-change:opacity,transform;
    mask-image:linear-gradient(to bottom, transparent 0%, black 30%, black 70%, transparent 100%)
}
.hero-slide.active .grid-bg{
    opacity:.15;
    transform:translateY(0)
}

/* Slide background image */
.slide-bg{
    position:absolute;
    inset:0;
    z-index:0;
    background-size:cover;
    background-position:center;
    opacity:.25;
    transition:opacity .8s ease;
    pointer-events:none;
    filter:grayscale(40%) brightness(.7);
}
.hero-slide.active .slide-bg{opacity:.32}

/* Moving accent line */
.hero-slide .accent-line{
    position:absolute;
    left:var(--space-lg);
    top:50%;
    transform:translateY(-50%) scaleX(0);
    width:60px;
    height:3px;
    background:var(--color-secondary);
    transform-origin:left center;
    z-index:1;
    transition:transform .6s cubic-bezier(.16,1,.3,1) .2s;
    will-change:transform
}
.hero-slide.active .accent-line{
    transform:translateY(-50%) scaleX(1)
}

/* Floating geometric shapes */
.hero-slide .shape{
    position:absolute;
    border:2px solid rgba(239,68,69,0.15);
    opacity:0;
    transition:opacity .5s ease .4s, transform .8s cubic-bezier(.16,1,.3,1) .4s;
    will-change:opacity,transform;
    pointer-events:none
}
.hero-slide.active .shape{opacity:1}
.hero-slide .shape-1{width:120px;height:120px;top:10%;right:8%;border-radius:0;transform:rotate(15deg) scale(0.5)}
.hero-slide.active .shape-1{transform:rotate(15deg) scale(1)}
.hero-slide .shape-2{width:80px;height:80px;bottom:15%;left:5%;border-radius:50%;transform:rotate(-30deg) scale(0.5)}
.hero-slide.active .shape-2{transform:rotate(-30deg) scale(1)}
.hero-slide .shape-3{width:200px;height:1px;top:60%;right:10%;background:linear-gradient(90deg,transparent,rgba(239,68,69,0.3),transparent);transform:scaleX(0);transform-origin:right center}
.hero-slide.active .shape-3{transform:scaleX(1);transition-delay:.5s}
.hero-slide .shape-4{width:1px;height:150px;left:8%;top:30%;background:linear-gradient(180deg,transparent,rgba(239,68,69,0.2),transparent);transform:scaleY(0);transform-origin:bottom center}
.hero-slide.active .shape-4{transform:scaleY(1);transition-delay:.6s}
@media(max-width:768px){
    .hero-slide::after{inset:-60px}
    .hero-slide .shape-1{width:80px;height:80px;top:5%;right:5%}
    .hero-slide .shape-2{width:50px;height:50px;bottom:10%;left:3%}
    .hero-slide .shape-3{width:120px;top:55%}
    .hero-slide .accent-line{left:var(--space-md);width:40px}
}

/* Glow animation */
@keyframes pulse-glow{
    0%,100%{text-shadow:0 0 26px rgba(239,68,69,.55),0 0 60px rgba(239,68,69,.18),0 0 100px rgba(239,68,69,.08)}
    50%{text-shadow:0 0 36px rgba(239,68,69,.75),0 0 80px rgba(239,68,69,.25),0 0 130px rgba(239,68,69,.12)}
}
@keyframes pulse-glow-mobile{
    0%,100%{text-shadow:0 0 16px rgba(239,68,69,.5),0 0 36px rgba(239,68,69,.15)}
    50%{text-shadow:0 0 24px rgba(239,68,69,.7),0 0 50px rgba(239,68,69,.25)}
}

/* Slide content */
.hero-slide .content{
    position:relative;
    z-index:1;
    padding:var(--space-4xl) var(--space-lg);
    max-width:1200px;
    margin:0 auto;
    width:100%
}
.hero-slide .label{
    font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
    color:var(--color-secondary);margin-bottom:var(--space-lg);
    opacity:0;transform:translateY(20px);
    transition:opacity .6s ease .1s,transform .6s ease .1s;
    will-change:opacity,transform
}
.hero-slide.active .label{opacity:1;transform:translateY(0);transition-delay:.15s}

.hero-slide h1{
    font-family:var(--font-display);
    font-size:clamp(48px,8vw,96px);
    line-height:1.0;
    letter-spacing:-.04em;
    color:var(--text-primary);
    max-width:900px;
    opacity:0;transform:translateX(-30px);
    transition:opacity .6s ease .2s,transform .6s ease .2s;
    will-change:opacity,transform;
    animation:pulse-glow 3.5s ease-in-out infinite
}
.hero-slide.active h1{opacity:1;transform:translateX(0)}
.hero-slide h1 .accent{
    color:var(--color-secondary);
    display:block;
    text-shadow:0 0 32px rgba(239,68,69,.65),0 0 80px rgba(239,68,69,.2),0 4px 24px rgba(239,68,69,.1)
}

.hero-slide .desc{
    font-size:18px;line-height:1.65;color:var(--text-secondary);
    max-width:560px;margin-top:var(--space-xl);
    border-left:4px solid var(--color-secondary);padding-left:var(--space-lg);
    opacity:0;transform:translateX(-20px);
    transition:opacity .6s ease .3s,transform .6s ease .3s;
    will-change:opacity,transform
}
.hero-slide.active .desc{opacity:1;transform:translateX(0);transition-delay:.25s}

.hero-slide .actions{
    margin-top:var(--space-2xl);
    display:flex;gap:var(--space-md);flex-wrap:wrap;
    opacity:0;transform:translateY(20px);
    transition:opacity .5s ease .4s,transform .5s ease .4s;
    will-change:opacity,transform
}
.hero-slide.active .actions{opacity:1;transform:translateY(0);transition-delay:.35s}

/* Mobile overrides */
@media(max-width:768px){
    .hero-slide h1{
        font-size:clamp(48px,11vw,84px);
        animation:pulse-glow-mobile 3.5s ease-in-out infinite
    }
    .hero-slide .desc{font-size:15px;max-width:100%}
    .hero-slide{min-height:65vh}
    .hero-slide::after{inset:-50px}
    .hero-slide .content{padding:var(--space-2xl) var(--space-md)}
    .hero-controls{gap:var(--space-md);padding:var(--space-lg) 0}
    .hero-dot{width:10px;height:10px}
    .hero-arrow{padding:6px 12px;font-size:16px}
}

/* Hero controls */
.hero-controls{
    display:flex;justify-content:center;align-items:center;
    gap:var(--space-lg);padding:var(--space-xl) 0;
    border-top:2px solid var(--border-subtle)
}
.hero-dots{display:flex;gap:var(--space-sm)}
.hero-dot{
    width:12px;height:12px;border:2px solid var(--border-strong);
    background:var(--bg);cursor:pointer;padding:0;
    transition:background .2s,border-color .2s
}
.hero-dot.active{background:var(--color-primary);border-color:var(--color-primary)}
.hero-dot:hover{background:var(--surface-raised)}
.hero-arrow{
    background:none;border:2px solid var(--border-medium);
    padding:8px 16px;cursor:pointer;font-size:18px;
    color:var(--text-primary);
    transition:background .15s,color .15s,border-color .15s;line-height:1
}
.hero-arrow:hover{background:var(--color-primary);color:var(--color-tertiary);border-color:var(--color-primary)}
.hero-counter{font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--text-tertiary);min-width:40px;text-align:center}

/* Scroll to continue */
.scroll-indicator{position:absolute;left:50%;bottom:95px;transform:translateX(-50%);z-index:20;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none}
.scroll-indicator .mouse{width:22px;height:34px;border:2px solid var(--border-strong);border-radius:12px;padding:5px}
.scroll-indicator .wheel{width:4px;height:8px;background:var(--text-tertiary);border-radius:2px;margin:0 auto;animation:scroll-wheel 1.4s ease-in-out infinite}
.scroll-indicator span{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-tertiary);background:rgba(250,250,250,0.7);padding:4px 8px}
@keyframes scroll-wheel{0%{opacity:.35;transform:translateY(0)}100%{opacity:1;transform:translateY(10px)}}

/* ─── STRIP ─── */
.strip{
    display:grid;grid-template-columns:repeat(4,1fr);
    border-top:2px solid var(--border-strong);border-bottom:2px solid var(--border-strong)
}
.strip-item{padding:var(--space-xl) var(--space-lg);text-align:center;border-right:2px solid var(--border-subtle)}
.strip-item:last-child{border-right:none}
.strip-number{font-family:var(--font-display);font-size:38px;letter-spacing:-.02em;color:var(--color-secondary)}
.strip-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-tertiary);margin-top:var(--space-xs)}
@media(max-width:768px){
    .strip{grid-template-columns:repeat(2,1fr)}
    .strip-item:nth-child(2){border-right:none}
    .strip-item:nth-child(1),.strip-item:nth-child(2){border-bottom:2px solid var(--border-subtle)}
}

/* ─── Sections Shared ─── */
.section-header{margin-bottom:var(--space-3xl)}
.section-header .overline{color:var(--color-secondary);margin-bottom:var(--space-sm)}
.section-header h2{font-family:var(--font-display);font-size:clamp(32px,5vw,56px);line-height:1.05;letter-spacing:-.03em}
.section-header p{font-size:18px;color:var(--text-secondary);max-width:560px;margin-top:var(--space-md)}

/* ─── Services ─── */
.services-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg)}
.service-card{border:2px solid var(--border-subtle);padding:var(--space-xl);transition:border-color .2s;background:var(--bg)}
.service-card:hover{border-color:var(--border-strong)}
.service-card.elevated{border-top:4px solid var(--color-secondary);border-left:2px solid var(--border-subtle);border-right:2px solid var(--border-subtle);border-bottom:2px solid var(--border-subtle)}
.service-card .icon{font-size:32px;margin-bottom:var(--space-md)}
.service-card h3{font-family:var(--font-display);font-size:24px;letter-spacing:-.01em;margin-bottom:var(--space-md)}
.service-card p{color:var(--text-secondary);margin-bottom:var(--space-md)}
.service-card ul{list-style:none;padding:0}
.service-card li{padding:8px 0;border-bottom:1px solid var(--border-subtle);font-size:14px;color:var(--text-primary)}
.service-card li:last-child{border-bottom:none}
.service-card li .highlight{font-weight:600;color:var(--color-primary)}
.service-card .partner-link{display:inline-block;margin-top:var(--space-md);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--color-secondary);text-decoration:none;border-bottom:2px solid var(--color-secondary);padding-bottom:2px}
.service-card .partner-link:hover{color:var(--text-primary);border-bottom-color:var(--text-primary)}
@media(max-width:768px){.services-grid{grid-template-columns:1fr}}

/* ─── Pull Quote ─── */
.pull-quote{border-left:4px solid var(--color-secondary);padding:var(--space-md) var(--space-lg);margin:var(--space-2xl) 0;background:var(--surface)}
.pull-quote p{font-size:20px;line-height:1.65;font-style:italic;font-weight:500}
.pull-quote cite{display:block;margin-top:var(--space-sm);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary);font-style:normal}

/* ═══════════ MSO SLIDER ═══════════ */
.mso-section{
    overflow:hidden;
    border-top:2px solid var(--border-strong);
    border-bottom:2px solid var(--border-strong);
    padding:var(--space-3xl) 0
}
.mso-header{
    display:flex;justify-content:space-between;align-items:flex-end;
    margin-bottom:var(--space-2xl);flex-wrap:wrap;gap:var(--space-md)
}
.mso-header .overline{color:var(--color-secondary)}
.mso-viewport{overflow:hidden;position:relative}
.mso-track{
    display:flex;gap:var(--space-lg);
    transition:transform .5s cubic-bezier(.22,1,.36,1);
    will-change:transform
}
.mso-card{
    flex:0 0 calc(25% - var(--space-lg) * 0.75);
    border:2px solid var(--border-subtle);
    padding:var(--space-xl) var(--space-md);
    text-align:center;
    transition:border-color .2s;
    background:var(--bg)
}
.mso-card:hover{border-color:var(--border-strong)}
.mso-card .logo-box{
    width:72px;height:72px;margin:0 auto var(--space-md);
    border:2px solid var(--border-medium);
    display:flex;align-items:center;justify-content:center;
    font-family:var(--font-display);font-size:24px;color:var(--text-primary);
    transition:border-color .2s
}
.mso-card:hover .logo-box{border-color:var(--border-strong)}
.mso-card .name{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-primary)}
.mso-card .subs{font-size:11px;color:var(--text-tertiary);margin-top:4px;font-weight:500}
.mso-controls{display:flex;align-items:center;justify-content:center;gap:var(--space-lg);margin-top:var(--space-xl)}
.mso-arrow{
    background:none;border:2px solid var(--border-medium);
    padding:8px 16px;cursor:pointer;font-size:18px;
    color:var(--text-primary);
    transition:background .15s,color .15s,border-color .15s;line-height:1
}
.mso-arrow:hover{background:var(--color-primary);color:var(--color-tertiary);border-color:var(--color-primary)}
.mso-arrow:disabled{opacity:.25;cursor:default;background:none;color:var(--text-tertiary);border-color:var(--border-subtle)}
.mso-dots{display:flex;gap:var(--space-sm)}
.mso-dot{width:12px;height:12px;border:2px solid var(--border-strong);background:var(--bg);cursor:pointer;padding:0;transition:background .2s,border-color .2s}
.mso-dot.active{background:var(--color-primary);border-color:var(--color-primary)}
.mso-dot:hover{background:var(--surface-raised)}
@media(max-width:768px){.mso-card{flex:0 0 calc(50% - var(--space-lg)*0.5);min-width:140px}}

/* ─── Partnership Block ─── */
.partnership-block{border:2px solid var(--border-subtle);padding:var(--space-2xl);display:flex;gap:var(--space-2xl);align-items:flex-start}
.partnership-block .content{flex:1}
.partnership-block .overline{color:var(--color-secondary)}
.partnership-block h2{font-family:var(--font-display);font-size:38px;line-height:1.1;letter-spacing:-.02em;margin-top:var(--space-sm)}
.partnership-block p{font-size:16px;color:var(--text-secondary);margin-top:var(--space-md);max-width:600px}
.partnership-block .emblem{width:120px;height:120px;border:2px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;font-size:40px;flex-shrink:0}
@media(max-width:768px){.partnership-block{flex-direction:column-reverse}.partnership-block .emblem{width:80px;height:80px;font-size:28px}}

/* ─── About ─── */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3xl);align-items:center}
.about-text p{color:var(--text-secondary);margin-top:var(--space-md)}
.about-text p strong{color:var(--text-primary)}
.about-visual{aspect-ratio:1;border:2px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.about-visual svg{width:100%;height:100%;padding:var(--space-lg)}
.about-badge{position:absolute;bottom:-2px;right:-2px;background:var(--color-secondary);color:var(--color-tertiary);padding:10px 20px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--color-secondary)}
@media(max-width:768px){.about-grid{grid-template-columns:1fr}}

/* ─── Contact ─── */
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}
.contact-card{border:2px solid var(--border-subtle);padding:var(--space-xl);transition:border-color .2s}
.contact-card:hover{border-color:var(--border-strong)}
.contact-card .emoji{font-size:24px;margin-bottom:var(--space-md);display:block}
.contact-card h4{font-family:var(--font-display);font-size:18px;letter-spacing:-.01em;margin-bottom:var(--space-xs)}
.contact-card p{font-size:14px;color:var(--text-secondary)}
.contact-card .note{font-size:12px;color:var(--text-tertiary);margin-top:4px}
@media(max-width:768px){.contact-grid{grid-template-columns:1fr}}

/* ─── Form ─── */
.form-section{margin-top:var(--space-3xl);border:2px solid var(--border-subtle);padding:var(--space-xl)}
.form-group{margin-bottom:var(--space-md)}
.form-group label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-primary);margin-bottom:6px}
.form-group input,.form-group textarea,.form-group select{width:100%;height:44px;background:var(--bg);border:2px solid var(--border-medium);border-radius:0;padding:8px 14px;font-family:var(--font-body);font-size:14px;color:var(--text-primary);transition:border-color .15s}
.form-group textarea{height:auto;min-height:100px;resize:vertical}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-tertiary)}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--border-strong);box-shadow:0 0 0 2px #FAFAFA,0 0 0 4px #0A0A0A;outline:none}

/* ─── Footer ─── */
.footer{
    border-top:2px solid var(--border-strong);
    padding:var(--space-xl) var(--space-lg);
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-md);
    position:relative;
    isolation:isolate;
}
.footer::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    background:
        radial-gradient(ellipse 55% 45% at 15% 50%, rgba(239,68,69,0.18) 0%, transparent 60%),
        radial-gradient(ellipse 45% 55% at 85% 30%, rgba(10,10,10,0.08) 0%, transparent 55%),
        radial-gradient(ellipse 35% 35% at 50% 80%, rgba(239,68,69,0.12) 0%, transparent 70%);
    opacity:1;
    pointer-events:none;
    transform:translateZ(0)
}
.footer>*{position:relative;z-index:1}
.footer-brand{font-family:var(--font-display);font-size:16px}
.footer-brand span{color:var(--color-secondary)}
.footer-links{display:flex;gap:var(--space-lg);list-style:none}
.footer-links a{font-size:12px;font-weight:600;color:var(--text-tertiary);text-decoration:none;letter-spacing:.02em}
.footer-links a:hover{color:var(--text-primary)}
.footer-phone{font-size:13px;color:var(--text-tertiary);font-weight:500;letter-spacing:.02em}
.footer-copy{font-size:12px;color:var(--text-tertiary)}
@media(max-width:768px){.footer{flex-direction:column;text-align:center}}

/* ─── Scroll Animations ─── */
.fade-in{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.fade-in.visible{opacity:1;transform:translateY(0)}
.fade-in-left{opacity:0;transform:translateX(-30px);transition:opacity .6s ease,transform .6s ease}
.fade-in-left.visible{opacity:1;transform:translateX(0)}
.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}

/* ─── WhatsApp FAB ─── */
.whatsapp-fab{
    position:fixed;
    bottom:24px;
    right:24px;
    z-index:999;
    width:56px;
    height:56px;
    background:#25D366;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 16px rgba(37,211,102,0.4);
    transition:transform .2s,box-shadow .2s;
    text-decoration:none
}
.whatsapp-fab:hover{
    transform:scale(1.1);
    box-shadow:0 6px 24px rgba(37,211,102,0.5)
}
@media(max-width:768px){
    .whatsapp-fab{
        bottom:16px;
        right:16px;
        width:52px;
        height:52px;
        box-shadow:0 4px 20px rgba(37,211,102,0.5)
    }
}

/* ─── Testimonials ─── */
.testimonials-section{
    padding:var(--space-4xl) 0;
    background:var(--surface);
    border-top:2px solid var(--border-strong);
    border-bottom:2px solid var(--border-strong)
}
.testimonials-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--space-lg);
    margin-top:var(--space-2xl)
}
.testimonial-card{
    border:2px solid var(--border-subtle);
    padding:var(--space-xl);
    background:var(--bg);
    display:flex;
    flex-direction:column;
    transition:border-color .2s
}
.testimonial-card:hover{border-color:var(--border-strong)}
.testimonial-card .stars{
    font-size:14px;
    letter-spacing:2px;
    margin-bottom:var(--space-md);
    color:var(--color-secondary)
}
.testimonial-card blockquote{
    font-size:15px;
    line-height:1.7;
    color:var(--text-primary);
    flex:1;
    font-style:normal;
    quotes:none
}
.testimonial-card blockquote::before{content:'"'}
.testimonial-card blockquote::after{content:'"'}
.testimonial-card .author{
    margin-top:var(--space-lg);
    padding-top:var(--space-md);
    border-top:1px solid var(--border-subtle)
}
.testimonial-card .author-name{
    font-size:13px;
    font-weight:700;
    color:var(--text-primary);
    letter-spacing:.02em
}
.testimonial-card .author-role{
    font-size:11px;
    color:var(--text-tertiary);
    margin-top:2px;
    letter-spacing:.02em
}
@media(max-width:900px){
    .testimonials-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
    .testimonials-grid{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
    .fade-in,.fade-in-left{opacity:1;transform:none}
    .hero-track{transition:none}
    .mso-track{transition:none}
}