/* =============================================
   ADAIGO — Responsive CSS  |  v4.0
   Breakpoints: 4K → 320px
============================================= */

/* =============================================
   4K / ULTRA-WIDE  (1920px+)
============================================= */
@media (min-width: 1920px) {
   .container-xl { max-width: 1600px; }
   .hero-title { font-size: clamp(3.5rem, 4.5vw, 5.5rem); }
   .section-title { font-size: clamp(2.4rem, 3vw, 3.6rem); }
   .blob-1 { width: 900px; height: 900px; }
   .blob-2 { width: 700px; height: 700px; }
   .blob-3 { width: 500px; height: 500px; }
   .process-grid { grid-template-columns: repeat(4, 1fr); }
   .hero-card { padding: 20px 24px; }
   .testimonial-slider .testi-card { padding: 44px 40px; }
}

/* =============================================
   LARGE DESKTOP  (1400px – 1919px)
============================================= */
@media (min-width: 1400px) and (max-width: 1919px) {
   .container-xl { max-width: 1360px; }
   .hero-title { font-size: clamp(3rem, 4vw, 4.5rem); }
}

/* =============================================
   DESKTOP  (1200px – 1399px)
============================================= */
@media (min-width: 1200px) and (max-width: 1399px) {
   .hero-title { font-size: clamp(2.8rem, 3.5vw, 3.8rem); }
   .hero-card { padding: 14px 18px; }
   .hero-card-1 { top: 4%; right: -5%; }
   .hero-card-2 { top: 42%; right: -8%; }
   .hero-card-3 { bottom: 4%; left: 2%; }
   .blob-1 { width: 540px; height: 540px; }
   .blob-2 { width: 420px; height: 420px; }
   .process-grid::before { left: 10%; width: 80%; }
}

/* =============================================
   LAPTOP / SMALL DESKTOP  (992px – 1199px)
============================================= */
@media (min-width: 992px) and (max-width: 1199px) {
   .hero-section { padding: 130px 0 90px; }
   .hero-title { font-size: clamp(2.4rem, 3vw, 3.2rem); }
   .hero-card { padding: 12px 16px; }
   .hc-val { font-size: 1.1rem; }

   .blob-1 { width: 440px; height: 440px; top: -120px; right: -80px; }
   .blob-2 { width: 360px; height: 360px; bottom: -100px; left: -90px; }
   .blob-3 { width: 260px; height: 260px; }

   .process-grid { gap: 20px; }
   .process-grid::before { display: none; }
   .ps-icon { width: 60px; height: 60px; font-size: 1.3rem; }

   .why-img-main { height: 340px; }
   .service-card { padding: 28px 22px; }
   .stats-section .stat-num { font-size: 2.6rem; }
   .testi-card { padding: 28px 24px; }
}

/* =============================================
   TABLET  (768px – 991px)
============================================= */
@media (max-width: 991px) {

   /* Blobs */
   .blob-1 { width: 320px; height: 320px; top: -80px; right: -60px; }
   .blob-2 { width: 260px; height: 260px; bottom: -60px; left: -60px; }
   .blob-3 { display: none; }

   /* Hero */
   .hero-section { padding: 120px 0 70px; text-align: center; }
   .hero-title { font-size: clamp(2.2rem, 5vw, 3rem); }
   .hero-desc { font-size: 1rem; max-width: 540px; margin-left: auto; margin-right: auto; }
   .hero-btns { justify-content: center; }
   .hero-stats { justify-content: center; }
   .h-stat-divider { display: none; }
   .hero-scroll-hint { display: none; }

   /* Section */
   .section-title { font-size: clamp(1.9rem, 4.5vw, 2.6rem); }
   .section-sub { font-size: 0.96rem; }
   .section-pad { padding: 70px 0; }

   /* Marquee */
   .marquee-strip { padding: 14px 0; }
   .marquee-track span { font-size: 0.85rem; padding: 0 18px; }

   /* Services */
   .service-card { padding: 26px 20px; }

   /* Why section */
   .why-visual { display: none; }
   .wf-item { padding: 18px; }

   /* Process */
   .process-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
   .process-grid::before { display: none; }
   .ps-connector { display: none; }
   .ps-num { font-size: 3rem; }
   .ps-icon { width: 64px; height: 64px; font-size: 1.4rem; }

   /* Stats */
   .stats-section { padding: 60px 0; }
   .stat-num { font-size: 2.6rem; }
   .stat-item { padding: 24px 16px; }

   /* Work */
   .work-filter { flex-wrap: wrap; gap: 8px; }
   .wf-btn { padding: 8px 18px; font-size: 0.88rem; }

   /* Testimonials */
   .testi-card { padding: 28px 22px; }
   .testi-text { font-size: 0.95rem; }

   /* CTA */
   .cta-section { padding: 70px 0; }
   .cta-inner h2 { font-size: clamp(1.8rem, 4vw, 2.4rem); }
   .cta-btns { flex-direction: column; align-items: center; }
   .btn-white-adaigo, .btn-outline-light-adaigo { width: 100%; max-width: 320px; text-align: center; }

   /* Contact */
   .contact-form-card { padding: 32px 24px; }
   .contact-info-list { gap: 16px; }

   /* Page Hero */
   .page-hero { padding: 120px 0 70px; }
   .page-hero-title { font-size: clamp(2rem, 5vw, 2.8rem); }
   .page-hero-sub { font-size: 1rem; }

   /* About page */
   .team-grid { grid-template-columns: repeat(2, 1fr); }
   .values-grid { grid-template-columns: repeat(2, 1fr); }
   .awards-strip { gap: 24px; flex-wrap: wrap; justify-content: center; }

   /* Services page */
   .services-overview-grid { grid-template-columns: repeat(2, 1fr); }
   .pricing-grid { grid-template-columns: 1fr; max-width: 440px; margin-left: auto; margin-right: auto; }

   /* Work page */
   .results-showcase { grid-template-columns: repeat(2, 1fr); }

   /* Footer */
   .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
   .footer-brand { grid-column: 1 / -1; }
}

/* =============================================
   MOBILE LARGE  (576px – 767px)
============================================= */
@media (max-width: 767px) {

   /* Typography */
   .hero-title { font-size: clamp(1.9rem, 6vw, 2.6rem); }
   .section-title { font-size: clamp(1.7rem, 5.5vw, 2.2rem); }
   .section-pad { padding: 60px 0; }

   /* Hero */
   .hero-section { padding: 110px 0 60px; }
   .hero-badge { font-size: 0.78rem; padding: 6px 14px; }
   .hero-desc { font-size: 0.95rem; }
   .hero-btns { flex-direction: column; align-items: center; gap: 14px !important; }
   .btn-primary-adaigo, .btn-outline-adaigo { width: 100%; max-width: 300px; text-align: center; justify-content: center; }
   .hero-stats { flex-direction: row; justify-content: space-around; gap: 0 !important; }
   .h-stat p { font-size: 0.8rem; }
   .h-stat-num { font-size: 1.8rem; }

   /* Process */
   .process-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
   .ps-num { font-size: 2.6rem; }
   .ps-icon { width: 56px; height: 56px; font-size: 1.2rem; }
   .process-step h4 { font-size: 1rem; }
   .process-step p { font-size: 0.88rem; }

   /* Stats */
   .stat-num { font-size: 2.2rem; }
   .stat-item p { font-size: 0.85rem; }
   .stat-icon { width: 44px; height: 44px; font-size: 1.1rem; }

   /* Services */
   .service-card { padding: 24px 18px; }
   .sc-features { display: none; }

   /* Why */
   .wf-item { flex-direction: column; align-items: flex-start; gap: 10px; }

   /* Work */
   .wc-img { height: 190px; }
   .wc-body { padding: 18px; }

   /* Testimonials */
   .testi-card { padding: 24px 18px; }
   .ta-avatar { width: 44px; height: 44px; font-size: 0.8rem; }

   /* CTA */
   .cta-section { padding: 60px 0; }
   .cta-inner h2 { font-size: clamp(1.6rem, 5vw, 2.1rem); }
   .cta-inner p { font-size: 0.95rem; }
   .cta-note { font-size: 0.85rem; }

   /* Contact */
   .contact-form-card { padding: 28px 20px; }
   .contact-form-card h3 { font-size: 1.4rem; }
   .ci-item { gap: 12px; }
   .ci-icon { width: 42px; height: 42px; font-size: 1rem; }

   /* Page Hero */
   .page-hero { padding: 110px 0 60px; }
   .page-hero-title { font-size: clamp(1.8rem, 6vw, 2.4rem); }
   .page-hero-sub { font-size: 0.95rem; max-width: 100%; }

   /* About page */
   .team-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
   .values-grid { grid-template-columns: 1fr; }
   .mission-vision-grid { grid-template-columns: 1fr; gap: 24px; }
   .mv-card { padding: 28px 24px; }

   /* Services page */
   .services-overview-grid { grid-template-columns: 1fr; }
   .pricing-card { padding: 32px 24px; }
   .faq-item { padding: 16px; }

   /* Work page */
   .results-showcase { grid-template-columns: 1fr 1fr; gap: 16px; }
   .rs-item { padding: 24px 16px; }
   .rs-num { font-size: 2rem; }

   /* Footer */
   .footer-grid { grid-template-columns: 1fr; gap: 36px; }
   .footer-brand { text-align: center; }
   .footer-social { justify-content: center; }
   .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
}

/* =============================================
   MOBILE SMALL  (< 576px)
============================================= */
@media (max-width: 575px) {

   /* Hero */
   .hero-section { padding: 100px 0 50px; }
   .hero-title { font-size: clamp(1.7rem, 7.5vw, 2.2rem); line-height: 1.25; }
   .hero-stats { gap: 0 !important; justify-content: space-evenly; }
   .h-stat-num { font-size: 1.6rem; }
   .h-stat p { font-size: 0.75rem; }

   /* Blobs */
   .blob-1 { width: 220px; height: 220px; top: -60px; right: -40px; }
   .blob-2 { width: 180px; height: 180px; bottom: -40px; left: -40px; }

   /* Buttons */
   .btn-primary-adaigo, .btn-outline-adaigo { font-size: 0.88rem; padding: 12px 22px; }
   .btn-lg-adaigo { padding: 14px 28px; font-size: 0.95rem; }

   /* Section */
   .section-title { font-size: clamp(1.55rem, 7vw, 2rem); }
   .section-tag { font-size: 0.72rem; padding: 5px 14px; }
   .section-pad { padding: 52px 0; }

   /* Services */
   .sc-icon { width: 50px; height: 50px; font-size: 1.2rem; }
   .sc-title { font-size: 1.1rem; }

   /* Process */
   .process-grid { grid-template-columns: 1fr; max-width: 360px; margin-left: auto; margin-right: auto; }
   .ps-num { font-size: 2.2rem; }

   /* Stats */
   .stat-num { font-size: 2rem; }

   /* Work */
   .wf-btn { padding: 7px 14px; font-size: 0.83rem; }
   .wc-img { height: 170px; }
   .work-filter-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
   .work-filter { flex-wrap: nowrap; min-width: max-content; gap: 8px; }

   /* Testimonials */
   .testi-text { font-size: 0.92rem; }

   /* CTA */
   .cta-inner h2 { font-size: clamp(1.5rem, 7vw, 1.9rem); }
   .cta-badge { font-size: 0.78rem; padding: 6px 14px; }

   /* Contact */
   .contact-form-card { padding: 24px 16px; border-radius: 16px; }
   .form-group-adaigo label { font-size: 0.85rem; }
   .form-group-adaigo input,
   .form-group-adaigo select,
   .form-group-adaigo textarea { font-size: 0.9rem; padding: 12px 14px; }

   /* Page Hero */
   .page-hero { padding: 100px 0 52px; }
   .page-hero-title { font-size: clamp(1.6rem, 7vw, 2.1rem); }

   /* About */
   .team-card { padding: 20px 16px; }
   .team-avatar { width: 72px; height: 72px; font-size: 1.4rem; }
   .team-name { font-size: 1rem; }

   /* Services */
   .pricing-badge { font-size: 0.7rem; padding: 5px 12px; top: -12px; }
   .pricing-price { font-size: 2.2rem; }

   /* Work results */
   .results-showcase { grid-template-columns: 1fr 1fr; gap: 12px; }
   .rs-item { padding: 18px 12px; }
   .rs-num { font-size: 1.75rem; }
   .rs-label { font-size: 0.8rem; }
}

/* =============================================
   TINY MOBILE  (< 400px)
============================================= */
@media (max-width: 399px) {

   .hero-title { font-size: clamp(1.5rem, 9vw, 1.9rem); }
   .hero-desc { font-size: 0.9rem; }
   .hero-stats { flex-direction: column; align-items: center; gap: 12px !important; }

   .blob-1 { width: 160px; height: 160px; }
   .blob-2 { width: 130px; height: 130px; }

   .section-title { font-size: clamp(1.4rem, 8.5vw, 1.8rem); }
   .section-pad { padding: 44px 0; }

   .process-grid { grid-template-columns: 1fr; }
   .ps-icon { width: 50px; height: 50px; font-size: 1.1rem; }

   .stat-num { font-size: 1.8rem; }
   .stat-icon { width: 40px; height: 40px; font-size: 1rem; }

   .wf-btn { padding: 6px 12px; font-size: 0.8rem; }
   .wc-img { height: 150px; }

   .contact-form-card { padding: 20px 14px; }
   .testi-card { padding: 20px 14px; }
   .ta-avatar { width: 38px; height: 38px; font-size: 0.75rem; }

   .cta-inner h2 { font-size: clamp(1.3rem, 8vw, 1.7rem); }
   .btn-white-adaigo, .btn-outline-light-adaigo { font-size: 0.85rem; padding: 12px 20px; }

   .team-grid { grid-template-columns: 1fr; max-width: 280px; margin-left: auto; margin-right: auto; }
   .results-showcase { grid-template-columns: 1fr; max-width: 280px; margin-left: auto; margin-right: auto; }
}

/* =============================================
   LANDSCAPE MOBILE
============================================= */
@media (max-height: 500px) and (min-width: 600px) and (orientation: landscape) {

   .hero-section { padding: 90px 0 40px; min-height: auto; }
   .hero-title { font-size: clamp(1.6rem, 4vw, 2.2rem); }
   .hero-desc { margin-top: 12px !important; font-size: 0.9rem; }
   .hero-btns { margin-top: 20px !important; }
   .hero-stats { margin-top: 16px !important; gap: 16px !important; }

   .blob-1 { width: 200px; height: 200px; }
   .blob-2 { width: 160px; height: 160px; }

   #mobileDrawer { max-height: 90vh; overflow-y: auto; }
   .drawer-nav a { padding: 8px 0; font-size: 1.1rem; }

   .page-hero { padding: 90px 0 40px; }
}

/* =============================================
   HEADER — RESPONSIVE
============================================= */
@media (max-width: 991px) {
   #mainHeader { padding: 12px 0; }
   .header-inner { padding: 0 20px; }
   .nav-links { display: none; }
   .header-cta { display: none; }
   #mobileMenuBtn { display: flex; }
   .header-logo { font-size: 1.4rem; }
}

@media (max-width: 575px) {
   #mainHeader { padding: 10px 0; }
   .header-inner { padding: 0 16px; }
   .header-logo { font-size: 1.25rem; }
}

/* =============================================
   MOBILE DRAWER
============================================= */
@media (max-width: 991px) {
   #mobileDrawer {
      width: 300px;
      max-width: 85vw;
   }
   .drawer-nav a {
      padding: 12px 0;
      font-size: 1.1rem;
   }
   .drawer-bottom { padding: 24px; }
   .drawer-bottom .btn-primary-adaigo { width: 100%; text-align: center; }
}

/* =============================================
   PRINT
============================================= */
@media print {
   #mainHeader, #mobileDrawer, #mobileOverlay,
   .cta-section, .clients-section, .testimonials-section,
   .hero-scroll-hint, .marquee-strip, .hero-btns,
   .footer-social { display: none !important; }

   body { font-size: 12pt; color: #000; background: #fff; }
   .hero-section, .page-hero { padding: 40px 0; min-height: auto; background: none !important; }
   .section-pad { padding: 30px 0; }
   .hero-title, .section-title, .page-hero-title { color: #000 !important; }
   .text-gradient { background: none !important; -webkit-background-clip: initial !important; color: #FF4D00 !important; }
   .service-card, .testi-card, .work-card, .contact-form-card { box-shadow: none; border: 1px solid #ddd; }
   a { color: #000; text-decoration: underline; }
   .btn-primary-adaigo, .btn-outline-adaigo { border: 1px solid #000; color: #000; background: none; box-shadow: none; }
}