/* ====================================================================
   GOOGLE ADS PAGE - PREMIUM DESIGN SYSTEM
   🔵 BLUE TO PURPLE GRADIENT PALETTE
   ==================================================================== */

:root {
    --primary: #4F46E5;
    --primary-dark: #4338CA;
    --primary-light: #6366F1;
    --secondary: #0F172A;
    --secondary-light: #1E293B;
    --accent: #8B5CF6;
    --white: #ffffff;
    --gray-50: #F8FAFC;
    --gray-100: #F1F5F9;
    --gray-200: #E2E8F0;
    --gray-300: #CBD5E1;
    --gray-700: #334155;
    --gray-800: #1E293B;
    --gray-900: #0F172A;
    --font-display: Space Grotesk, sans-serif;
    --font-body: Space Grotesk, sans-serif;
    --section-padding: 120px;
    --container-width: 1280px;
    --shadow-sm: 0 2px 8px rgba(0,0,0,.08);
    --shadow-md: 0 4px 16px rgba(0,0,0,.12);
    --shadow-lg: 0 8px 32px rgba(0,0,0,.16);
    --shadow-xl: 0 16px 64px rgba(0,0,0,.24);
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
}

*{margin:0;padding:0;box-sizing:border-box}

body{
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.7;
    color: var(--gray-200);
    background: var(--secondary);
    overflow-x: hidden;
}

.container-ads{
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 32px;
}

/* ===== HERO ===== */
.ads-hero{
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: var(--section-padding) 0;
    background: linear-gradient(135deg,#0F172A 0%,#1E293B 50%,#0F172A 100%);
    overflow: hidden;
}

.ads-hero-mesh{
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 30%, rgba(79,70,229,.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(139,92,246,.10) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(79,70,229,.05) 0%, transparent 70%);
    filter: blur(60px);
    z-index: 1;
}

.ads-hero-inner{
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    opacity: 1;
    transform: none;
}

.ads-hero-content{
    display: flex;
    flex-direction: column;
    gap: 32px;
    animation: heroFadeRight .7s ease-out both;
}

.ads-hero-visual{
    position: relative;
    animation: heroFadeLeft .7s ease-out .1s both;
}

@keyframes heroFadeRight{
    from{opacity:0;transform:translateX(-30px)}
    to{opacity:1;transform:translateX(0)}
}
@keyframes heroFadeLeft{
    from{opacity:0;transform:translateX(30px)}
    to{opacity:1;transform:translateX(0)}
}

.ads-badge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: rgba(79,70,229,.1);
    border: 1px solid rgba(79,70,229,.3);
    border-radius: 100px;
    backdrop-filter: blur(10px);
    width: fit-content;
    animation: float 3s ease-in-out infinite;
}

.badge-pulse{
    width:8px;height:8px;
    background:var(--primary);
    border-radius:50%;
    animation:pulse 2s ease-in-out infinite;
}

.ads-badge-text{font-size:14px;font-weight:600;color:var(--white)}

.ads-hero-title{
    font-family: var(--font-display);
    font-size: clamp(2.2rem,5vw,3.2rem);
    font-weight: 900;
    line-height: 1.1;
    color: var(--white);
    letter-spacing: -0.02em;
}

.ads-title-gradient{
    display:block;
    background: linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    animation: gradient-shift 3s ease infinite;
}

.ads-hero-desc{
    font-size:1.2rem;
    line-height:1.8;
    color:var(--gray-300);
    max-width:540px;
}

.ads-cta-group{display:flex;gap:16px;flex-wrap:wrap;align-items:center}

/* ===== TRUST BADGES ===== */
.ads-trust-badges{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:8px;
}

.trust-badge-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 16px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.1);
    border-radius:12px;
    backdrop-filter:blur(10px);
    text-decoration:none;
    transition:all .3s ease;
    flex:1;
    min-width:160px;
}

.trust-badge-link:hover{
    background:rgba(255,255,255,.06);
    border-color:rgba(79,70,229,.3);
    transform:translateY(-2px);
}

.trust-badge-link img{
    width:36px;height:36px;object-fit:contain;flex-shrink:0;
}

.trust-badge-stars{font-size:11px;letter-spacing:1px;margin-bottom:2px}
.trust-badge-text{font-size:12px;color:var(--gray-300);line-height:1.3}

/* Google Partner badge — SVG is self-contained, no text needed */
.trust-badge-partner{
    padding:10px 14px;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
}

/* ===== BUTTONS ===== */
.btn-ads,.btn-ads-outline{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:18px 40px;
    font-family:var(--font-body);
    font-size:1rem;
    font-weight:700;
    text-decoration:none;
    border-radius:12px;
    overflow:hidden;
    transition:all var(--transition-base);
    cursor:pointer;
    border:none;
    white-space:nowrap;
}

.btn-ads{
    background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
    color:var(--white);
    box-shadow:0 8px 24px rgba(79,70,229,.3);
}
.btn-ads:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(79,70,229,.5)}
.btn-ads::before{
    content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
    transition:left .5s ease;
}
.btn-ads:hover::before{left:100%}

.btn-ads-outline{
    background:rgba(79,70,229,.05);
    color:var(--white);
    border:2px solid rgba(79,70,229,.3);
    backdrop-filter:blur(10px);
}
.btn-ads-outline:hover{background:rgba(79,70,229,.1);border-color:var(--primary);transform:translateY(-2px)}

.btn-ads-content{position:relative;z-index:2}

/* Ultraform button wrapper - inherits button style */
.btn-ads-wrap .ultraform_button_container,
.btn-ads-wrap form,
.btn-ads-wrap button,
.btn-ads-wrap input[type="submit"]{
    all:unset;
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:18px 40px;
    font-family:var(--font-body);
    font-size:1rem;
    font-weight:700;
    border-radius:12px;
    overflow:hidden;
    transition:all var(--transition-base);
    cursor:pointer;
    background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
    color:var(--white);
    box-shadow:0 8px 24px rgba(79,70,229,.3);
}
.btn-ads-wrap button:hover,
.btn-ads-wrap input[type="submit"]:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 32px rgba(79,70,229,.5);
}

/* ===== HERO VISUAL ===== */
.ads-media-container{
    position:relative;
    border-radius:24px;
    overflow:hidden;
}

.ads-media-glow{
    position:absolute;top:-20%;left:-20%;width:140%;height:140%;
    filter:blur(60px);z-index:-1;
    animation:glow-pulse 4s ease-in-out infinite;
}

.ads-hero-img{
    width:100%;height:auto;display:block;
    border-radius:24px;
    box-shadow:var(--shadow-xl);
    object-fit:cover;
}

.ads-media-overlay{
    position:absolute;inset:0;pointer-events:none;
}

/* ===== SECTION COMMON ===== */
.section-label{
    display:inline-block;
    padding:8px 20px;
    background:rgba(79,70,229,.1);
    border:1px solid rgba(79,70,229,.3);
    border-radius:100px;
    color:var(--primary);
    font-size:14px;font-weight:700;
    text-transform:uppercase;letter-spacing:1px;
    margin-bottom:24px;
}

.section-title{
    font-family:var(--font-display);
    font-size:clamp(2rem,4vw,2.75rem);
    font-weight:900;
    line-height:1.2;
    color:var(--white);
    margin-bottom:20px;
}

.section-desc{
    font-size:1.1rem;
    line-height:1.8;
    color:var(--gray-300);
    max-width:680px;
    margin:0 auto;
}

.section-header-center{
    text-align:center;
    max-width:760px;
    margin:0 auto 72px;
}

.section-header-center .section-title{margin-bottom:16px}

/* ===== WHY SECTION ===== */
.ads-why{
    padding:var(--section-padding) 0;
    background:var(--secondary-light);
}

.ads-why-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
    gap:28px;
    margin-top:20px;
}

.ads-why-card{
    padding:36px 32px;
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    backdrop-filter:blur(10px);
    transition:all var(--transition-base);
    position:relative;
    overflow:hidden;
}

.ads-why-card::before{
    content:'';position:absolute;top:0;left:0;width:100%;height:3px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    transform:scaleX(0);
    transition:transform var(--transition-base);
}

.ads-why-card:hover::before{transform:scaleX(1)}
.ads-why-card:hover{
    transform:translateY(-8px);
    background:rgba(255,255,255,.05);
    border-color:var(--primary);
    box-shadow:0 16px 48px rgba(79,70,229,.2);
}

.ads-why-icon{
    width:52px;height:52px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,var(--primary),var(--primary-dark));
    border-radius:14px;
    color:var(--white);
    margin-bottom:20px;
    box-shadow:0 8px 24px rgba(79,70,229,.3);
    font-size:24px;
}

.ads-why-title{
    font-family:var(--font-display);
    font-size:1.2rem;font-weight:700;
    color:var(--white);margin-bottom:10px;
}

.ads-why-desc{font-size:.975rem;line-height:1.7;color:var(--gray-300)}

/* ===== PLATFORMS / SERVICES - TABBED ===== */
.ads-platforms{
    padding:var(--section-padding) 0;
    background:var(--secondary);
}

.ads-services-tabs{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:0;
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    overflow:hidden;
    min-height:480px;
}

/* Tab list on the left */
.ads-tabs-nav{
    display:flex;
    flex-direction:column;
    background:rgba(255,255,255,.02);
    border-right:1px solid rgba(255,255,255,.08);
    padding:8px;
    gap:4px;
}

.ads-tab-btn{
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 20px;
    background:none;
    border:none;
    border-radius:14px;
    cursor:pointer;
    text-align:left;
    transition:all var(--transition-base);
    font-family:var(--font-body);
    color:var(--gray-300);
    font-size:.95rem;
    font-weight:500;
    position:relative;
}

.ads-tab-btn:hover{
    background:rgba(79,70,229,.08);
    color:var(--white);
}

.ads-tab-btn.active{
    background:rgba(79,70,229,.15);
    color:var(--white);
    font-weight:700;
    border:1px solid rgba(79,70,229,.3);
}

.ads-tab-btn.active::before{
    content:'';
    position:absolute;
    left:0;top:50%;transform:translateY(-50%);
    width:3px;height:60%;
    background:linear-gradient(to bottom,var(--primary),var(--accent));
    border-radius:0 2px 2px 0;
}

.tab-btn-icon{
    width:36px;height:36px;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
    background:rgba(79,70,229,.1);
    border-radius:10px;
    overflow:hidden;
}

.tab-btn-icon img{width:22px;height:22px;object-fit:contain}
.tab-btn-icon svg{width:20px;height:20px;color:var(--primary)}

.tab-btn-label{line-height:1.3}

/* Tab panel on the right */
.ads-tabs-panels{
    position:relative;
    overflow:hidden;
}

.ads-tab-panel{
    display:none;
    grid-template-columns:1fr 1fr;
    gap:0;
    height:100%;
    animation:tabFadeIn .35s ease both;
}

.ads-tab-panel.active{display:grid}

@keyframes tabFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.tab-panel-image{
    position:relative;
    overflow:hidden;
    background:rgba(79,70,229,.05);
}

.tab-panel-image img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
    transition:transform var(--transition-slow);
}

.ads-tab-panel:hover .tab-panel-image img{transform:scale(1.03)}

.tab-panel-image-placeholder{
    width:100%;height:100%;min-height:320px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,rgba(79,70,229,.12),rgba(139,92,246,.08));
}

.tab-panel-image-placeholder svg{width:64px;height:64px;opacity:.3;color:var(--primary)}

.tab-panel-content{
    padding:44px 40px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:20px;
}

.tab-panel-num{
    font-family:var(--font-display);
    font-size:3rem;font-weight:900;
    color:rgba(79,70,229,.12);line-height:1;
}

.tab-panel-title{
    font-family:var(--font-display);
    font-size:1.6rem;font-weight:800;
    color:var(--white);line-height:1.25;
}

.tab-panel-tagline{
    font-size:.9rem;font-weight:600;
    color:var(--primary);letter-spacing:.3px;
}

.tab-panel-desc{
    font-size:1rem;line-height:1.75;
    color:var(--gray-300);
}

.platform-cta-wrap{
    margin-top:60px;text-align:center;
}

/* Mobile tabs: accordion-style */
.ads-services-tabs-mobile{display:none}

.mobile-service-item{
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    overflow:hidden;
    transition:border-color var(--transition-base);
}

.mobile-service-item.open{border-color:rgba(79,70,229,.35)}

.mobile-service-header{
    width:100%;padding:20px 24px;
    background:none;border:none;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    cursor:pointer;text-align:left;
    font-family:var(--font-body);font-size:1rem;font-weight:600;color:var(--white);
}

.mobile-service-header-left{display:flex;align-items:center;gap:12px}

.mobile-service-icon{
    width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(79,70,229,.1);border-radius:10px;
    overflow:hidden;flex-shrink:0;
}

.mobile-service-icon img{width:22px;height:22px;object-fit:contain}

.mobile-chevron{
    width:24px;height:24px;
    display:flex;align-items:center;justify-content:center;
    color:var(--primary);
    transition:transform var(--transition-base);flex-shrink:0;
}

.mobile-service-item.open .mobile-chevron{transform:rotate(180deg)}

.mobile-service-body{
    max-height:0;overflow:hidden;
    transition:max-height .4s ease,padding .4s ease;
    padding:0 24px;
}

.mobile-service-item.open .mobile-service-body{max-height:800px;padding:0 24px 24px}

.mobile-service-img{
    width:100%;
    border-radius:12px;
    margin-bottom:16px;
    object-fit:cover;
    max-height:220px;
    display:block;
}

.mobile-service-img-placeholder{
    width:100%;height:160px;
    border-radius:12px;
    background:linear-gradient(135deg,rgba(79,70,229,.12),rgba(139,92,246,.08));
    display:flex;align-items:center;justify-content:center;
    margin-bottom:16px;
}

.mobile-service-tagline{
    font-size:.85rem;font-weight:600;
    color:var(--primary);margin-bottom:8px;
}

.mobile-service-desc{
    font-size:.925rem;line-height:1.7;
    color:var(--gray-300);
}

/* ===== CASE STUDIES ===== */
.ads-cases{
    padding:var(--section-padding) 0;
    background:var(--secondary-light);
}

.cases-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
    gap:28px;
}

.case-card{
    position:relative;
    border-radius:24px;
    overflow:hidden;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    cursor:pointer;
    transition:all var(--transition-base);
    text-decoration:none;
    display:block;
}

.case-card:hover{
    transform:translateY(-8px);
    border-color:var(--primary);
    box-shadow:0 20px 56px rgba(79,70,229,.2);
}

.case-thumb{
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
    display:block;
    transition:transform var(--transition-slow);
}

.case-card:hover .case-thumb{transform:scale(1.04)}

.case-thumb-placeholder{
    width:100%;
    aspect-ratio:16/9;
    background:linear-gradient(135deg,rgba(79,70,229,.15) 0%,rgba(139,92,246,.1) 100%);
    display:flex;align-items:center;justify-content:center;
}

.case-thumb-placeholder svg{width:48px;height:48px;color:rgba(79,70,229,.4)}

.case-body{padding:28px}

.case-badge{
    display:inline-block;
    padding:5px 14px;
    background:rgba(79,70,229,.12);
    border:1px solid rgba(79,70,229,.25);
    border-radius:100px;
    color:var(--primary);
    font-size:12px;font-weight:700;
    text-transform:uppercase;letter-spacing:.8px;
    margin-bottom:14px;
}

.case-title{
    font-family:var(--font-display);
    font-size:1.25rem;font-weight:700;
    color:var(--white);margin-bottom:10px;line-height:1.35;
}

.case-excerpt{font-size:.925rem;line-height:1.65;color:var(--gray-300);margin-bottom:20px}

.case-stats{
    display:flex;gap:16px;flex-wrap:wrap;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.07);
}

.case-stat{display:flex;flex-direction:column;gap:4px}

.case-stat-val{
    font-family:var(--font-display);
    font-size:1.4rem;font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

.case-stat-lbl{font-size:.8rem;color:var(--gray-300);font-weight:500}

.case-arrow{
    position:absolute;top:20px;right:20px;
    width:40px;height:40px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(79,70,229,.12);
    border:1px solid rgba(79,70,229,.25);
    border-radius:50%;
    color:var(--primary);
    opacity:0;transform:translateY(6px);
    transition:all var(--transition-base);
}

.case-card:hover .case-arrow{opacity:1;transform:translateY(0)}

/* ===== PROCESS SECTION ===== */
.ads-process{
    padding:var(--section-padding) 0;
    background:var(--secondary);
}

.process-steps{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:24px;
    position:relative;
}

.process-step{
    position:relative;
    padding:36px 28px;
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    transition:all var(--transition-base);
}

.process-step:hover{
    transform:translateY(-6px);
    border-color:var(--primary);
    box-shadow:0 16px 40px rgba(79,70,229,.15);
}

.step-number{
    font-family:var(--font-display);
    font-size:3rem;font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    line-height:1;margin-bottom:16px;
}

.step-title{
    font-family:var(--font-display);
    font-size:1.1rem;font-weight:700;
    color:var(--white);margin-bottom:10px;
}

.step-desc{font-size:.925rem;line-height:1.65;color:var(--gray-300)}

/* ===== TESTIMONIALS - REDESIGNED ===== */
.ads-testimonials{
    padding:var(--section-padding) 0;
    background:var(--secondary-light);
    overflow:hidden;
}

/* Desktop: show 4, slider */
.testi-slider-wrapper{
    position:relative;
}

.testi-slider-track{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    transition:transform .5s cubic-bezier(.25,.46,.45,.94);
}

/* When more than 4, enable sliding */
.testi-slider-outer{
    overflow:hidden;
    position:relative;
}

.testimonial-card{
    padding:32px 28px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    backdrop-filter:blur(10px);
    transition:all var(--transition-base);
    display:flex;flex-direction:column;gap:20px;
    flex-shrink:0;
}

.testimonial-card:hover{
    transform:translateY(-4px);
    border-color:var(--primary);
    box-shadow:0 12px 40px rgba(79,70,229,.18);
}

.testimonial-stars{font-size:16px;letter-spacing:2px;margin-bottom:2px}

.testimonial-text{
    font-size:.975rem;line-height:1.75;
    color:var(--gray-200);font-style:italic;
    flex:1;
    /* Clamp to 4 lines */
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.testimonial-text.expanded{
    display:block;
    -webkit-line-clamp:unset;
}

.testi-read-more{
    background:none;border:none;
    color:var(--primary);
    font-size:.85rem;font-weight:600;
    cursor:pointer;
    padding:0;
    text-align:left;
    transition:color var(--transition-fast);
    font-family:var(--font-body);
    margin-top:-10px;
}

.testi-read-more:hover{color:var(--accent)}

.testimonial-author{display:flex;align-items:center;gap:14px}

.author-avatar{
    width:48px;height:48px;border-radius:50%;overflow:hidden;
    border:2px solid rgba(79,70,229,.3);flex-shrink:0;
}

.author-avatar img{width:100%;height:100%;object-fit:cover}

.author-avatar-placeholder{
    width:48px;height:48px;border-radius:50%;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    display:flex;align-items:center;justify-content:center;
    font-family:var(--font-display);font-size:1.1rem;font-weight:700;color:var(--white);
    flex-shrink:0;
}

.author-name{
    font-family:var(--font-display);
    font-size:.95rem;font-weight:700;color:var(--white);
}

.author-role{font-size:.825rem;color:var(--gray-300)}

/* Slider controls */
.testi-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin-top:40px;
}

.testi-btn{
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(79,70,229,.1);
    border:1px solid rgba(79,70,229,.25);
    border-radius:50%;
    color:var(--primary);
    cursor:pointer;
    transition:all var(--transition-base);
}

.testi-btn:hover{background:rgba(79,70,229,.2);border-color:var(--primary)}
.testi-btn:disabled{opacity:.3;cursor:not-allowed}

.testi-dots{
    display:flex;gap:8px;
}

.testi-dot{
    width:8px;height:8px;
    border-radius:50%;
    background:rgba(79,70,229,.3);
    cursor:pointer;
    transition:all var(--transition-base);
    border:none;
}

.testi-dot.active{
    background:var(--primary);
    width:24px;
    border-radius:4px;
}

/* Mobile testimonials: 1 at a time */
.testi-mobile-slider{
    display:none;
}

/* ===== FAQ SECTION ===== */
.ads-faq{
    padding:var(--section-padding) 0;
    background:var(--secondary);
}

.faq-list{
    max-width:820px;margin:0 auto;
    display:flex;flex-direction:column;gap:16px;
}

.faq-item{
    background:rgba(255,255,255,.02);
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    overflow:hidden;
    transition:border-color var(--transition-base);
}

.faq-item.open{border-color:rgba(79,70,229,.35)}

.faq-question{
    width:100%;
    padding:24px 28px;
    background:none;border:none;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    cursor:pointer;
    text-align:left;
    font-family:var(--font-body);
    font-size:1.05rem;font-weight:600;color:var(--white);
    transition:color var(--transition-base);
}

.faq-question:hover{color:var(--primary)}

.faq-icon{
    flex-shrink:0;
    width:28px;height:28px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(79,70,229,.1);
    border-radius:50%;color:var(--primary);
    transition:transform var(--transition-base),background var(--transition-base);
}

.faq-item.open .faq-icon{transform:rotate(45deg);background:var(--primary);color:var(--white)}

.faq-answer{
    max-height:0;overflow:hidden;
    transition:max-height .4s ease,padding .4s ease;
    padding:0 28px;
}

.faq-item.open .faq-answer{max-height:400px;padding:0 28px 24px}

.faq-answer p{font-size:.975rem;line-height:1.75;color:var(--gray-300)}

/* ===== FINAL CTA ===== */
.ads-final-cta{
    padding:var(--section-padding) 0;
    background:var(--secondary-light);
    position:relative;overflow:hidden;
}

.ads-cta-mesh{
    position:absolute;inset:0;
    background:
        radial-gradient(circle at 30% 50%,rgba(79,70,229,.18) 0%,transparent 60%),
        radial-gradient(circle at 70% 50%,rgba(139,92,246,.12) 0%,transparent 60%);
    filter:blur(80px);
}

.ads-cta-box{
    position:relative;z-index:2;
    text-align:center;
    max-width:800px;margin:0 auto;
    padding:80px 60px;
    background:rgba(255,255,255,.03);
    border:2px solid rgba(79,70,229,.3);
    border-radius:32px;
    backdrop-filter:blur(20px);
    box-shadow:0 24px 64px rgba(0,0,0,.4);
}

.ads-cta-icon{
    display:inline-flex;align-items:center;justify-content:center;
    width:80px;height:80px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-radius:20px;color:var(--white);
    margin-bottom:32px;
    box-shadow:0 16px 40px rgba(79,70,229,.4);
}

.ads-cta-title{
    font-family:var(--font-display);
    font-size:clamp(1.75rem,3.5vw,2.75rem);
    font-weight:900;color:var(--white);
    margin-bottom:20px;line-height:1.2;
}

.ads-cta-desc{
    font-size:1.15rem;line-height:1.8;
    color:var(--gray-300);margin-bottom:36px;
}

.ads-cta-btns{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;align-items:center}

/* ===== SCROLL INDICATOR ===== */
.scroll-indicator{
    position:absolute;bottom:40px;left:50%;transform:translateX(-50%);
    display:flex;flex-direction:column;align-items:center;gap:12px;
    color:var(--gray-300);font-size:12px;text-transform:uppercase;letter-spacing:2px;
    z-index:10;animation:bounce 2s ease-in-out infinite;
}

.scroll-line{width:2px;height:40px;background:linear-gradient(to bottom,var(--primary),transparent)}

/* ===== ANIMATIONS ===== */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}
@keyframes gradient-shift{0%,100%{filter:hue-rotate(0deg)}50%{filter:hue-rotate(20deg)}}
@keyframes glow-pulse{0%,100%{opacity:.6}50%{opacity:1}}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(10px)}}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
    :root{--section-padding:80px}
    .ads-hero-inner{grid-template-columns:1fr;gap:48px}
    .ads-hero-visual{order:-1}
    .ads-hero-content{gap:24px}
    @keyframes heroFadeRight{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
    @keyframes heroFadeLeft{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

    /* Services tabs: stack */
    .ads-services-tabs{
        grid-template-columns:240px 1fr;
    }
    .ads-tab-panel{
        grid-template-columns:1fr;
    }
    .tab-panel-image{
        display:none;
    }
    .tab-panel-content{
        padding:36px 32px;
    }

    /* Testimonials: 2 at a time on tablet */
    .testi-slider-track{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:768px){
    :root{--section-padding:56px}
    .container-ads{padding:0 20px}

    /* Hero */
    .ads-hero{min-height:auto;padding:80px 0 60px}
    .ads-hero-title{font-size:1.9rem}
    .ads-hero-desc{font-size:.975rem;max-width:100%}
    .ads-cta-group{flex-direction:column;align-items:stretch;gap:12px}
    .btn-ads,.btn-ads-outline{width:100%;padding:16px 28px;text-align:center}
    .ads-trust-badges{gap:10px}
    .trust-badge-link{min-width:0;flex:1 1 calc(50% - 5px)}
    .scroll-indicator{display:none}

    /* Why grid */
    .ads-why-grid{grid-template-columns:1fr;gap:16px}
    .ads-why-card{padding:28px 24px}

    /* Services: hide desktop tabs, show mobile accordion */
    .ads-services-tabs{display:none}
    .ads-services-tabs-mobile{
        display:flex;
        flex-direction:column;
        gap:12px;
    }

    /* Cases grid */
    .cases-grid{grid-template-columns:1fr;gap:16px}

    /* Process */
    .process-steps{grid-template-columns:1fr;gap:16px}
    .process-step{padding:28px 24px}

    /* Testimonials mobile */
    .testi-slider-outer{display:none}
    .testi-controls{display:none}
    .testi-mobile-slider{
        display:block;
        position:relative;
    }
    .testi-mobile-track{
        display:flex;
        transition:transform .4s ease;
    }
    .testi-mobile-card{
        min-width:100%;
        padding-right:0;
    }
    .testi-mobile-card .testimonial-card{
        margin:0;
    }
    .testi-mobile-controls{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:12px;
        margin-top:28px;
    }

    /* CTA */
    .ads-cta-box{padding:44px 24px}
    .section-title{font-size:1.65rem}
    .section-desc{font-size:1rem}
    .section-header-center{margin-bottom:44px}

    /* FAQ */
    .faq-question{padding:20px 20px;font-size:.975rem}
    .faq-answer{padding:0 20px}
    .faq-item.open .faq-answer{padding:0 20px 20px}
}

@media(max-width:480px){
    :root{--section-padding:40px}
    .container-ads{padding:0 16px}
    .ads-hero-title{font-size:1.65rem}
    .ads-cta-box{padding:32px 18px}
    .trust-badge-link{flex:1 1 100%}
    .ads-cta-icon{width:60px;height:60px}
    .ads-cta-icon svg{width:28px;height:28px}
}

@media(prefers-reduced-motion:reduce){
    *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}