/*
 * Nitrus – Widget Responsive Overrides
 */

/* ==========================================================================
   PADDING — match header left edge across all screen sizes
   ========================================================================== */

/* The header uses padding: 0 clamp(1.5rem, 5vw, 3rem)
   Elementor adds its own padding on top — we normalise it here */

.elementor-section.elementor-section-boxed > .elementor-container,
.e-con,
.e-con-inner {
  padding-left: clamp(1.5rem, 5vw, 3rem) !important;
  padding-right: clamp(1.5rem, 5vw, 3rem) !important;
}

/* Elementor widget wrap shouldn't add extra padding */
.elementor-widget-wrap {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ==========================================================================
   FOOTER TEXT — brighter and larger everywhere
   ========================================================================== */

.site-footer .footer-widget ul a,
.site-footer .footer-about__text,
.site-footer__bottom p,
.site-footer__bottom a {
  color: rgba(240, 240, 240, 0.65) !important;
  font-size: 0.9rem !important;
}

.site-footer .footer-widget h4 {
  color: rgba(240, 240, 240, 0.55) !important;
  font-size: 0.7rem !important;
}

.site-footer .footer-widget ul a:hover {
  color: var(--nitrus-accent) !important;
}

/* ==========================================================================
   GLOBAL: muted text brighter in widgets
   ========================================================================== */

.elementor-widget [style*="color:var(--color-text-muted)"],
.elementor-widget [style*="color: var(--color-text-muted)"] {
  color: rgba(240, 240, 240, 0.68) !important;
}

/* ==========================================================================
   TABLET  (max-width: 1024px)
   ========================================================================== */

@media (max-width: 1024px) {

  .elementor-widget-nitrus_split_hero [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
    gap: 2rem !important;
  }

  .elementor-widget-nitrus_testimonial_carousel [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_team_member [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_process_steps [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_portfolio_grid [style*="grid-template-columns: repeat(3"],
  .elementor-widget-nitrus_portfolio_grid [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_logo_carousel [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .elementor-widget-nitrus_pricing_table [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ==========================================================================
   MOBILE  (max-width: 768px)
   ========================================================================== */

@media (max-width: 768px) {

  /* Tighter padding on mobile to match "Home" title */
  .elementor-section.elementor-section-boxed > .elementor-container,
  .e-con,
  .e-con-inner {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

  /* ---- SPLIT HERO ---- */
  .elementor-widget-nitrus_split_hero [style*="grid-template-columns"] {
    display: flex !important;
    flex-direction: column !important;
    min-height: auto !important;
    gap: 1.5rem !important;
  }

  .elementor-widget-nitrus_split_hero [style*="aspect-ratio:4/5"] {
    order: -1 !important;
    aspect-ratio: 16/9 !important;
    border-radius: 16px !important;
  }

  .elementor-widget-nitrus_split_hero h1 {
    font-size: clamp(2.25rem, 10vw, 4rem) !important;
    margin-bottom: 1rem !important;
  }

  .elementor-widget-nitrus_split_hero p {
    font-size: 1rem !important;
    color: rgba(240, 240, 240, 0.75) !important;
    margin-bottom: 1.5rem !important;
  }

  .elementor-widget-nitrus_split_hero a[style*="border-radius:99px"] {
    display: flex !important;
    width: 100% !important;
    justify-content: center !important;
    padding: 1rem 1.5rem !important;
    font-size: 0.85rem !important;
  }

  /* ---- TESTIMONIALS ---- */
  .elementor-widget-nitrus_testimonial_carousel [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- COUNTER ---- */
  .elementor-widget-nitrus_counter [style*="grid-template-columns: repeat(4"],
  .elementor-widget-nitrus_counter [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_counter [style*="font-size:3.5rem"] {
    font-size: 2.5rem !important;
  }

  /* ---- PROCESS STEPS ---- */
  .elementor-widget-nitrus_process_steps [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- SERVICE LIST ---- */
  .elementor-widget-nitrus_service_list [style*="display:flex;align-items:flex-start"] {
    gap: 1rem !important;
  }

  .elementor-widget-nitrus_service_list h4 {
    font-size: 1.1rem !important;
  }

  .elementor-widget-nitrus_service_list p {
    font-size: 0.95rem !important;
    color: rgba(240, 240, 240, 0.7) !important;
  }

  /* ---- PORTFOLIO GRID ---- */
  .elementor-widget-nitrus_portfolio_grid [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- TEAM ---- */
  .elementor-widget-nitrus_team_member [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- PRICING TABLE ---- */
  .elementor-widget-nitrus_pricing_table [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- LOGO CAROUSEL grid ---- */
  .elementor-widget-nitrus_logo_carousel [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* ---- CASE STUDY ROW ---- */
  .elementor-widget-nitrus_case_study_row [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    direction: ltr !important;
    gap: 1.5rem !important;
    margin-bottom: 3rem !important;
  }

  .elementor-widget-nitrus_case_study_row h3 {
    font-size: clamp(1.5rem, 6vw, 2rem) !important;
  }

  /* ---- TIMELINE ---- */
  .elementor-widget-nitrus_timeline [style*="padding-left:3rem"] {
    padding-left: 2rem !important;
  }

  /* ---- TYPEWRITER ---- */
  .elementor-widget-nitrus_typewriter div {
    font-size: clamp(2.25rem, 9vw, 4rem) !important;
  }

  /* ---- GLOBAL text ---- */
  .elementor-widget p {
    font-size: 0.975rem !important;
    line-height: 1.8 !important;
    color: rgba(240, 240, 240, 0.72) !important;
  }

  /* But keep heading colours */
  .elementor-widget h1,
  .elementor-widget h2,
  .elementor-widget h3,
  .elementor-widget h4 {
    color: #ffffff !important;
  }

  /* ---- FOOTER ---- */
  .site-footer__grid {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  .site-footer__bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
  }

  .site-footer .footer-widget ul a,
  .site-footer .footer-about__text,
  .site-footer__bottom p,
  .site-footer__bottom a {
    font-size: 1rem !important;
    color: rgba(240, 240, 240, 0.7) !important;
  }
}

/* ==========================================================================
   SMALL MOBILE  (max-width: 480px)
   ========================================================================== */

@media (max-width: 480px) {

  .elementor-widget-nitrus_counter [style*="grid-template-columns"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .elementor-widget-nitrus_pricing_table [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  .elementor-widget-nitrus_split_hero h1 {
    font-size: clamp(2rem, 11vw, 3rem) !important;
  }

  .elementor-widget-nitrus_service_list [style*="padding:2rem 0"] {
    padding: 1.25rem 0 !important;
  }

  .elementor-widget-nitrus_process_steps [style*="padding:2rem"] {
    padding: 1.25rem !important;
  }
}