/*
Theme Name: Digital21
Theme URI: https://lsdigitalservices.com/
Description: High-converting B2B Performance Marketing & Revenue Systems child theme for LS Digital. Features a clean, high-contrast light theme design system (#F8FAFC), 9th-grade clear English, and intent-narrowed landing page templates.
Author: LS Digital Services
Author URI: https://lsdigitalservices.com/
Template: lsdigitaltheme
Version: 3.1.0
License: GNU General Public License v2 or later
Text Domain: digital21
*/

/* ==========================================================================
   DIGITAL21 LIGHT DESIGN SYSTEM TOKENS
   ========================================================================== */
:root {
  --d21-bg: #F8FAFC;
  --d21-card-bg: #FFFFFF;
  --d21-navy: #0F172A;
  --d21-blue: #2563EB;
  --d21-blue-hover: #1D4ED8;
  --d21-green: #22C55E;
  --d21-gray-medium: #64748B;
  --d21-gray-light: #94A3B8;
  --d21-border: #E2E8F0;
  --d21-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.05);
  --d21-shadow-hover: 0 20px 40px -10px rgba(15, 23, 42, 0.12);
  --d21-radius-card: 16px;
  --d21-radius-btn: 12px;
}

body {
  background-color: var(--d21-bg);
  color: var(--d21-navy);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Light Theme Utilities */
.d21-bg-light { background-color: var(--d21-bg) !important; }
.d21-bg-white { background-color: var(--d21-card-bg) !important; }
.d21-bg-navy  { background-color: var(--d21-navy) !important; color: #FFFFFF !important; }
.d21-text-navy { color: var(--d21-navy) !important; }
.d21-text-blue { color: var(--d21-blue) !important; }
.d21-text-green { color: var(--d21-green) !important; }
.d21-text-gray { color: var(--d21-gray-medium) !important; }
.d21-border { border: 1px solid var(--d21-border) !important; }

/* Buttons */
.d21-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--d21-blue);
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 1rem;
  padding: 14px 28px;
  border-radius: var(--d21-radius-btn);
  text-decoration: none;
  transition: all 0.25s ease-out;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
}
.d21-btn-primary:hover {
  background-color: var(--d21-blue-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.d21-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #FFFFFF;
  color: var(--d21-navy) !important;
  border: 1.5px solid var(--d21-border);
  font-weight: 700;
  font-size: 1rem;
  padding: 14px 28px;
  border-radius: var(--d21-radius-btn);
  text-decoration: none;
  transition: all 0.25s ease-out;
}
.d21-btn-secondary:hover {
  border-color: var(--d21-blue);
  color: var(--d21-blue) !important;
  transform: translateY(-2px);
}

/* ═══ Global Seamless Marquee ═══ */
.d21-marquee-sec {
    background: #FFFFFF;
    border-top: 1px solid #E2E8F0;
    border-bottom: 1px solid #E2E8F0;
    padding: 36px 0;
    width: 100%;
}
.d21-marquee-wrap {
    max-width: 1240px;
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    white-space: nowrap;
    position: relative;
}
.d21-marquee {
    display: flex;
    animation: d21Scroll 30s linear infinite;
}
.d21-marquee-group {
    display: flex;
    align-items: center;
    justify-content: space-around;
    min-width: 100%;
    gap: 60px;
    padding: 0 30px;
}
.d21-marquee-group img {
    height: 35px;
    width: auto;
    opacity: 0.6;
    filter: grayscale(100%);
    transition: all 0.3s ease;
    flex-shrink: 0;
}
.d21-marquee-group img:hover {
    opacity: 1;
    filter: grayscale(0%);
}
@keyframes d21Scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}