/* ============================================================
   homepage.css — Visual polish only for default.html
   Rules here: NO layout changes. No display, position, width,
   height, float, or overflow overrides. Only colors, fonts,
   borders, shadows, transitions, and hover effects.
   ============================================================ */

/* ── BANNER: dark overlay + typography refinement ─────────── */

/* Banner overlay removed */

.banner1_text1 strong {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,0.55) !important;
  letter-spacing: -0.3px !important;
}

.banner1_text2 strong {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(0,0,0,0.45) !important;
}


/* ── SECTION 2 (sec2Bg) — About + Newsletter ──────────────── */
.sec2Bg {
  background: #f7f9ff !important;
}

/* Newsletter card: rich navy gradient with decorative glow */
.newsletter {
  background: linear-gradient(135deg, #1a3a73 0%, #102649 100%) !important;
  box-shadow: 0 12px 40px rgba(16,38,73,0.32) !important;
  border-radius: 35px !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  position: relative !important;
}

/* Decorative radial glow in top-right corner */
.newsletter::before {
  content: '' !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  width: 260px !important;
  height: 260px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at top right, rgba(199,35,42,0.22) 0%, transparent 65%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Ensure article content sits above the decorative layer */
.newsletter > div {
  position: relative !important;
  z-index: 1 !important;
}

.newsletter article {
  border-bottom-color: rgba(255,255,255,0.12) !important;
  position: relative !important;
}

/* Replace old JPG email icon with clean SVG envelope */
.newsletter article::after {
  content: '' !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 90' fill='none'%3E%3Crect x='3' y='3' width='134' height='84' rx='12' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.32)' stroke-width='2.5'/%3E%3Cpath d='M3 18L70 55L137 18' stroke='rgba(255,255,255,0.45)' stroke-width='2.5' stroke-linejoin='round' fill='none'/%3E%3Cline x1='3' y1='87' x2='45' y2='48' stroke='rgba(255,255,255,0.15)' stroke-width='1.5'/%3E%3Cline x1='137' y1='87' x2='95' y2='48' stroke='rgba(255,255,255,0.15)' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat !important;
  width: 120px !important;
  height: 80px !important;
  opacity: 1 !important;
}
.sloderControl { display: none;}
/* Replace old small JPG email icon in form with SVG envelope */
.newsletter-form form::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33 27' fill='none'%3E%3Crect x='1.5' y='1.5' width='30' height='24' rx='4' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.55)' stroke-width='1.5'/%3E%3Cpolyline points='1.5,6 16.5,17 31.5,6' stroke='rgba(255,255,255,0.6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") center / contain no-repeat !important;
  background-color: transparent !important;
  opacity: 1 !important;
}

/* Tagline badge above the heading */
.newsletter article h1::before {
  content: '✦  Stay in the loop' !important;
  display: block !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  color: rgba(255,255,255,0.45) !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
}

.newsletter article h1 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
  font-size: 26px !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
}

.newsletter-form input[type=text] {
  background: transparent !important;
  color: #fff !important;
  border: none !important;
  transition: none !important;
  font-size: 15px !important;
}

.newsletter-form input[type=text]:focus {
  background: transparent !important;
  border: none !important;
  outline: none !important;
}

.newsletter-form input[type=text]::placeholder {
  color: rgba(255,255,255,0.48) !important;
}

.newsletter-form input[type=submit] {
  background: linear-gradient(135deg, #c7232a 0%, #8b0000 100%) !important;
  border-radius: 0 0 35px 0 !important;
  transition: all 260ms ease !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.newsletter-form input[type=submit]:hover {
  background: linear-gradient(135deg, #e02a31 0%, #a31318 100%) !important;
  box-shadow: 0 4px 18px rgba(199,35,42,0.45) !important;
}

/* About: heading improvement */
.right-box h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 800 !important;
  color: #1a3a73 !important;
}

.right-box p {
  color: #4a5568 !important;
  line-height: 1.78 !important;
}

/* "21 Years" badge — fix the broken layout:
   Original h1 was 137px font in a 140px container (always clipped).
   We fix height, font sizes, and span overflow. */
.right-box aside {
  background: linear-gradient(135deg, #1a3a73 0%, #22468a 100%) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 28px rgba(26,58,115,0.28) !important;
  height: auto !important;
  min-height: 110px !important;
  padding: 20px 24px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.right-box aside h1 {
  font-size: 72px !important;
  font-weight: 900 !important;
  color: #fff !important;
  line-height: 1 !important;
  padding: 0 !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.2) !important;
}

.right-box aside h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,0.9) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  line-height: 1.4 !important;
  padding: 0 !important;
  display: inline-block !important;
}

/* Book icon — keep it inside the badge, no negative overflow */
.right-box aside span {
  position: static !important;
  width: 56px !important;
  height: auto !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}

.right-box aside span img {
  width: 56px !important;
  height: auto !important;
  opacity: 0.85 !important;
  border-radius: 6px !important;
}

/* Clients slider container */
.clients {
  border-radius: 50px !important;
  box-shadow: 0 2px 18px rgba(0,0,0,0.10) !important;
}

.partners h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  color: #1a3a73 !important;
  font-weight: 700 !important;
}

.partners h2 span {
  color: #c7232a !important;
}

/* Client logos: full color/clarity at all times (see modern.css for the
   card sizing) — no more default desaturation, per client request for
   better logo visibility. */
.partners_slider li figure img,
.partners_slider li img {
  filter: none !important;
  opacity: 1 !important;
}


/* ── SECTION 3 (sec3Bg) — Profile / Services ─────────────── */

/* Left panel: brand navy gradient + diagonal illustration lines */
.sec3Bg-left {
  background:#3a3d71;
    ),
    repeating-linear-gradient(
      35deg,
      transparent 0px,
      transparent 60px,
      rgba(0,191,165,0.04) 60px,
      rgba(0,191,165,0.04) 61px
    ),
    linear-gradient(150deg, #814672 0%, #782d4b 100%) !important;
  position: relative !important;
}

/* Profile card: remove box, blend content with panel background */
.sec3Bg .text-center article {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.sec3Bg .text-center h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 800 !important;
  color: #fff !important;
}

.sec3Bg .text-center p {
  color: rgba(255,255,255,0.78) !important;
}

.sec3Bg .text-center a {
  background: linear-gradient(135deg, #c7232a, #8b0000) !important;
  border-radius: 6px !important;
  transition: all 250ms ease !important;
  box-shadow: 0 4px 14px rgba(199,35,42,0.35) !important;
  font-style: normal !important;
}

.sec3Bg .text-center a:hover {
  background: linear-gradient(135deg, #e02a31, #a31318) !important;
  box-shadow: 0 6px 20px rgba(199,35,42,0.5) !important;
}

/* Right panel: navy gradient (previously red — changed for contrast
   against the plum left panel and to differentiate it from the "Know
   More" CTA button, which is the only remaining red accent). */
.sec3Bg-right {
  background: #7d4270 !important;
}

.sec3Bg .text-center2 h5 {
  color: rgba(255,255,255,0.55) !important;
  letter-spacing: 3px !important;
  font-weight: 700 !important;
  font-size: 10px !important;
}

.sec3Bg .text-center2 h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
}

/* Service tiles: subtle gradient base + border + hover */
.sec3Bg .text-center2 ul li {
  background: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  border-radius: 12px !important;
  transition: all 280ms ease !important;
}

.sec3Bg .text-center2 ul li:hover {
  background: linear-gradient(135deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.08) 100%) !important;
  border-color: rgba(255,255,255,0.45) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25) !important;
  transform: translateY(-3px) !important;
}

.sec3Bg .text-center2 ul li p {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,0.9) !important;
}


/* ── SECTION 4 (sec4Bg) — Featured In + Leadership ──────── */
.sec4Bg {
  background: linear-gradient(170deg, #f8faff 0%, #edf2fb 45%, #f4f7fd 100%) !important;
}

/* Featured In card */
.clients2 {
  border-radius: 25px !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.08) !important;
}

.partners_slider2 li figure img,
.partners_slider2 li img {
  filter: grayscale(60%) opacity(0.65) !important;
  transition: filter 300ms ease !important;
}

.partners_slider2 li:hover figure img,
.partners_slider2 li:hover img {
  filter: grayscale(0%) opacity(1) !important;
}

/* Leadership heading */
.leadership-left h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 800 !important;
  color: #1a3a73 !important;
}

.leadership-left h3 {
  color: #c7232a !important;
}

/* Leadership list items */
.leadership-left ul li {
  transition: padding-left 220ms ease !important;
  color: #4a5568 !important;
  line-height: 1.7 !important;
}

.leadership-left ul li:hover {
  padding-left: 108px !important;
}

/* Step numbers — clean navy rounded-square (replaces red circles) */
.leadership-left ul li span {
  background: linear-gradient(135deg, #1a3a73 0%, #22468a 100%) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(26,58,115,0.25) !important;
  width: 52px !important;
  height: 52px !important;
  line-height: 52px !important;
  border-radius: 14px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  transition: all 280ms ease !important;
}

.leadership-left ul li:hover span {
  background: linear-gradient(135deg, #c7232a 0%, #8b0000 100%) !important;
  box-shadow: 0 6px 20px rgba(199,35,42,0.3) !important;
  transform: translateY(-2px) !important;
  border-color: transparent !important;
}

/* Leadership right — use multiply blend to dissolve white PNG bg on light sec4Bg */
.leadership-right img {
  mix-blend-mode: multiply !important;
  box-shadow: none !important;
}

/* ── SECONDARY NEWSLETTER — "Get bite-sized growth hacks" ──── */
/* This element is position:absolute — do NOT touch margin/width/height */
.news2.newsletter {
  background: linear-gradient(135deg, #1a3a73 0%, #102649 55%, #8b0000 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 12px 45px rgba(10,22,50,0.38) !important;
  border-radius: 35px !important;
}

/* Decorative glow for news2 — positioned bottom-left for variety */
.news2.newsletter::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 220px !important;
  height: 220px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at bottom left, rgba(255,255,255,0.06) 0%, transparent 65%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.news2.newsletter article {
  border-bottom-color: rgba(255,255,255,0.12) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Same modern SVG envelope icon for news2 */
.news2.newsletter article::after {
  content: '' !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 90' fill='none'%3E%3Crect x='3' y='3' width='134' height='84' rx='12' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.32)' stroke-width='2.5'/%3E%3Cpath d='M3 18L70 55L137 18' stroke='rgba(255,255,255,0.45)' stroke-width='2.5' stroke-linejoin='round' fill='none'/%3E%3Cline x1='3' y1='87' x2='45' y2='48' stroke='rgba(255,255,255,0.15)' stroke-width='1.5'/%3E%3Cline x1='137' y1='87' x2='95' y2='48' stroke='rgba(255,255,255,0.15)' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat !important;
  width: 120px !important;
  height: 80px !important;
  opacity: 1 !important;
}

.news2.newsletter article h1::before {
  content: '✦  Stay in the loop' !important;
  display: block !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  color: rgba(255,255,255,0.4) !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
}

.news2.newsletter article h1 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
  font-size: 26px !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
  padding: 40px 55px 22px 55px !important;
}

.news2 .newsletter-form input[type=submit] {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* Input field inside dark newsletter */
.news2 .newsletter-form input[type=text] {
  background: transparent !important;
  color: #fff !important;
  border: none !important;
  border-bottom: 2px solid rgba(255,255,255,0.38) !important;
  transition: border-color 250ms ease !important;
  font-size: 15px !important;
}

.news2 .newsletter-form input[type=text]::placeholder {
  color: rgba(255,255,255,0.48) !important;
}

.news2 .newsletter-form input[type=text]:focus {
  background: transparent !important;
  border-bottom-color: rgba(255,255,255,0.8) !important;
  outline: none !important;
}

.news2 .newsletter-form form::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33 27' fill='none'%3E%3Crect x='1.5' y='1.5' width='30' height='24' rx='4' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.55)' stroke-width='1.5'/%3E%3Cpolyline points='1.5,6 16.5,17 31.5,6' stroke='rgba(255,255,255,0.6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") center / contain no-repeat !important;
  background-color: transparent !important;
  opacity: 1 !important;
}

.news2 .newsletter-form input[type=submit] {
  background: linear-gradient(135deg, #c7232a 0%, #8b0000 100%) !important;
  border-radius: 0 0 35px 0 !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  transition: all 260ms ease !important;
}

.news2 .newsletter-form input[type=submit]:hover {
  background: linear-gradient(135deg, #e02a31 0%, #a31318 100%) !important;
  box-shadow: 0 4px 18px rgba(199,35,42,0.45) !important;
}


/* ── DONN MEDIA SECTION ──────────────────────────────────── */
.improving-lives {
  background: linear-gradient(160deg, #2e2e2e 0%, #1a3a73 100%) !important;
  border-top: none !important;
  border-bottom: none !important;
  padding: 60px 0 !important;
  margin: 0 !important;
}

.improving-lives h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: -0.02em !important;
}

.improving-lives h3 {
  color: rgba(255,255,255,0.55) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
}

/* Descriptive text on dark bg */
.sharinghappiness p {
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.75 !important;
}

.sharinghappiness p i {
  color: rgba(255,255,255,0.82) !important;
}

/* Amazon logo — invert to white on dark bg */
.sharinghappiness aside img,
.improving-lives aside img {
  filter: brightness(0) invert(1) !important;
  opacity: 0.75 !important;
}

/* Card containers — transparent, no rect box */
.sharinghappiness ul li {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: transform 320ms ease !important;
}

.sharinghappiness ul li:hover {
  transform: translateY(-6px) !important;
}

/* Hide connector line between cards */
.improving-lives ul li::after {
  display: none !important;
}

/* Circular images — glow ring + depth shadow */
.sharinghappiness ul li > img {
  border-radius: 50% !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,0.18), 0 12px 40px rgba(0,0,0,0.5) !important;
  transition: box-shadow 320ms ease, transform 320ms ease !important;
}

.sharinghappiness ul li:hover > img {
  box-shadow: 0 0 0 6px rgba(255,255,255,0.38), 0 18px 55px rgba(0,0,0,0.6) !important;
  transform: scale(1.03) !important;
}

/* Play icon area */
.sharinghappiness ul li .play-icon {
  text-align: center !important;
}

.sharinghappiness ul li .play-icon a img {
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 0.9 !important;
  transition: opacity 260ms ease, transform 260ms ease !important;
}

.sharinghappiness ul li:hover .play-icon a img {
  opacity: 1 !important;
  transform: scale(1.12) !important;
}

/* Card title label */
.sharinghappiness ul li .play-icon p {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #fff !important;
  letter-spacing: 0.01em !important;
  margin-top: 10px !important;
}


/* ── VIDEO SECTION (sec7Bg) ──────────────────────────────── */
.sec7Bg-left {
  background-image:
    repeating-linear-gradient(
      -55deg,
      transparent 0px,
      transparent 28px,
      rgba(255,255,255,0.03) 28px,
      rgba(255,255,255,0.03) 29px
    ),
    repeating-linear-gradient(
      35deg,
      transparent 0px,
      transparent 60px,
      rgba(0,191,165,0.04) 60px,
      rgba(0,191,165,0.04) 61px
    ),
    url('../images/video.jpg') !important;
  background-size: auto, auto, cover !important;
  background-position: 0 0, 0 0, top right !important;
  background-repeat: repeat, repeat, no-repeat !important;
}

.sec7Bg .text-center h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
}

.sec7Bg .text-center h2 span {
  color: rgba(255,255,255,0.8) !important;
}

/* Play button hover glow */
.sec7Bg .text-center aside a img {
  transition: transform 280ms ease, filter 280ms ease !important;
}

.sec7Bg .text-center aside a:hover img {
  transform: scale(1.12) !important;
  filter: drop-shadow(0 4px 18px rgba(199,35,42,0.6)) !important;
}


/* ── AWARDS SECTION (ytr) ────────────────────────────────── */
.ytr .book {
  background-image: url("../images/enquireyBg2.jpg") !important;
  background-position: top left !important;
  background-repeat: no-repeat !important;
}

.ytr .book h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
}

.ytr .book article .book-text p strong {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}

.ytr .book article .book-text p {
  line-height: 1.6 !important;
}

.ytr .book a.left {
  color: rgba(255,255,255,0.85) !important;
  text-decoration: underline !important;
  transition: color 200ms ease !important;
}

.ytr .book a.left:hover {
  color: #fff !important;
}

/* Blog column */
.ytr ul {
  box-shadow: 0 2px 14px rgba(0,0,0,0.12) !important;
}

.hero-slide ul.blog li h3 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
}

.hero-slide ul.blog li h3 span {
  font-weight: 500 !important;
}

/* Solutions cards */
.sec5Bg .solutions article:first-child {
  background: #fff !important;
}

.sec5Bg .solutions article:last-child {
  background: #3d3d3d !important;
}

.sec5Bg .solutions article h3 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
}

.sec5Bg .solutions article a {
  transition: color 200ms ease !important;
  font-weight: 600 !important;
}


/* ── GLOBAL TYPOGRAPHY REFINEMENTS ──────────────────────── */
/* Section headings that use h2 across the page */
.sec2Bg h2,
.sec4Bg h2 {
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
}

.sec2Bg h2 span,
.sec4Bg h2 span {
  color: #97080e !important;
}


/* ── RESPONSIVE SAFETY ───────────────────────────────────── */
/* These only adjust decorative/visual properties at smaller screens */
@media screen and (max-width: 900px) {
  .newsletter {
    border-radius: 16px !important;
  }

  .clients {
    border-radius: 20px !important;
  }

  .sec3Bg .text-center2 ul li:hover {
    transform: none !important;
  }

  .sharinghappiness ul li:hover {
    transform: none !important;
  }

  /* 21 years badge at small screens */
  .right-box aside {
    flex-wrap: wrap !important;
    padding: 16px !important;
    gap: 10px !important;
  }

  .right-box aside h1 {
    font-size: 56px !important;
  }

  .right-box aside span {
    display: none !important;
  }

  /* Leadership: cancel hover shift on touch/tablet */
  .leadership-left ul li:hover {
    padding-left: 100px !important;
  }

  .leadership-left ul li:hover span {
    transform: none !important;
  }
}

@media screen and (max-width: 768px) {
  /* Donn Media dark bg — keep text legible at mobile widths */
  .improving-lives h2 {
    font-size: 22px !important;
  }

  .improving-lives h3 {
    font-size: 14px !important;
  }

  /* Ensure card media text stays white on dark bg */
  .sharinghappiness ul li .play-icon p {
    font-size: 12px !important;
  }

  /* news2 at mobile */
  .news2.newsletter {
    border-radius: 16px !important;
  }
  .newsletter-form input[type=submit] {
  background: linear-gradient(135deg, #c7232a 0%, #8b0000 100%) !important;
  border-radius: 0 0 0px 0 !important;
  transition: all 260ms ease !important;
  font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}
}

@media screen and (max-width: 480px) {
  /* At very small screens, underline input shouldn't have border-radius from modern.css */
  .newsletter-form input[type=text],
  .news2 .newsletter-form input[type=text] {
    border-radius: 0 !important;
    border-bottom: 2px solid rgba(255,255,255,0.38) !important;
  }
}