/* ================================================================
   CABY NGO — Bold Redesign v2
   Colors: Navy #0D1B6B · Teal #00B4D8 · Green #4CAF50 · White
   ================================================================ */

/* ── 1. Custom Properties ── */
:root {
  --navy:         #0D1B6B;
  --navy-dark:    #071042;
  --navy-mid:     #142380;
  --teal:         #00B4D8;
  --teal-dark:    #007FA0;
  --teal-light:   #40D0F0;
  --teal-ultra:   #D0F3FB;
  --green:        #4CAF50;
  --green-dark:   #388E3C;
  --white:        #ffffff;
  --light:        #F5F8FF;
  --gray-50:      #F9FAFB;
  --gray-100:     #F3F4F6;
  --gray-200:     #E5E7EB;
  --gray-400:     #9CA3AF;
  --gray-500:     #6B7280;
  --gray-700:     #374151;
  --gray-900:     #111827;

  --font-head:    'Poppins', 'Segoe UI', sans-serif;
  --font-body:    'Inter', 'Open Sans', sans-serif;

  --shadow-sm:    0 2px 8px rgba(0,0,0,.08);
  --shadow-md:    0 8px 30px rgba(13,27,107,.14);
  --shadow-lg:    0 20px 60px rgba(13,27,107,.20);
  --shadow-xl:    0 30px 80px rgba(13,27,107,.28);

  --radius-sm:    4px;
  --radius-md:    10px;
  --radius-lg:    18px;
  --radius-full:  9999px;

  --transition:   0.3s cubic-bezier(0.4,0,0.2,1);
  --container:    1240px;
  --section-py:   96px;
}

/* ── 2. Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.75;
  color: var(--gray-700);
  background: var(--white);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--teal); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--teal-dark); }

h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-head);
  color: var(--navy);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 1rem;
}
h1 { font-size: clamp(2.2rem, 5vw, 3.75rem); }
h2 { font-size: clamp(1.8rem, 4vw, 2.875rem); }
h3 { font-size: clamp(1.3rem, 3vw, 2rem); }
h4 { font-size: 1.3rem; }
h5 { font-size: 1.125rem; }

p { margin-bottom: 1.25rem; }
p:last-child { margin-bottom: 0; }
ul, ol { list-style: none; }

::selection { background: var(--teal); color: #fff; }

/* ── 3. Container ── */
.caby-wrap {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: 28px;
}

/* ── 4. TOP BAR ── */
#caby-topbar {
  background: var(--navy-dark);
  color: rgba(255,255,255,.7);
  font-size: 13px;
  font-family: var(--font-body);
  height: 42px;
  position: relative;
  z-index: 1001;
}

#caby-topbar .caby-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.caby-topbar-left {
  display: flex;
  align-items: center;
  gap: 24px;
}

.caby-topbar-left a {
  color: rgba(255,255,255,.72);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  transition: color var(--transition);
}

.caby-topbar-left a:hover { color: var(--teal-light); }
.caby-topbar-left a i { color: var(--teal); font-size: 12px; }

.caby-topbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.caby-topbar-right a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.65);
  font-size: 12px;
  transition: all var(--transition);
}

.caby-topbar-right a:hover {
  background: var(--teal);
  border-color: var(--teal);
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 767px) { #caby-topbar { display: none; } }

/* ── 5. MAIN HEADER — Navy bold bar ── */
#caby-header {
  background: var(--navy);
  position: sticky;
  top: 0;
  z-index: 1000;
  transition: background var(--transition), box-shadow var(--transition);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

#caby-header.scrolled {
  background: var(--navy-dark);
  box-shadow: 0 4px 32px rgba(7,16,66,.45);
}

.caby-header-inner {
  display: flex;
  align-items: center;
  gap: 36px;
  height: 80px;
}

/* Logo */
.caby-logo-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}

.caby-logo-img {
  height: 50px;
  width: auto;
  object-fit: contain;
  filter: brightness(1.1);
}

.caby-logo-text { display: flex; flex-direction: column; line-height: 1.15; }

.caby-site-name {
  font-family: var(--font-head);
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--white);
  letter-spacing: -.02em;
}

.caby-site-tagline {
  font-size: 10px;
  font-weight: 500;
  color: var(--teal-light);
  text-transform: uppercase;
  letter-spacing: .1em;
}

/* Navigation */
.caby-main-nav { flex: 1; display: flex; justify-content: center; }

.caby-nav-menu {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
}

.caby-nav-menu > li { position: relative; }

.caby-nav-menu > li > a {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 10px 11px;
  font-family: var(--font-head);
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(255,255,255,.82);
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  border-radius: var(--radius-sm);
  transition: color var(--transition), background var(--transition);
  text-decoration: none;
  position: relative;
}

.caby-nav-menu > li > a::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 20px;
  height: 2px;
  background: var(--teal);
  border-radius: 2px;
  transition: transform var(--transition);
}

.caby-nav-menu > li > a:hover,
.caby-nav-menu > li.current-menu-item > a,
.caby-nav-menu > li.current_page_item > a {
  color: var(--white) !important;
  background: rgba(255,255,255,.08);
}

.caby-nav-menu > li > a:hover::after,
.caby-nav-menu > li.current-menu-item > a::after,
.caby-nav-menu > li.current_page_item > a::after {
  transform: translateX(-50%) scaleX(1);
}

/* Dropdown indicator */
.caby-nav-menu > li.menu-item-has-children > a > .caby-arrow,
.caby-nav-menu > li.menu-item-has-children > a::before {
  content: '\f107';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 10px;
  margin-left: 2px;
  transition: transform var(--transition);
}

/* Dropdowns */
.caby-nav-menu > li > .sub-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 230px;
  background: var(--white);
  border-top: 3px solid var(--teal);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all var(--transition);
  z-index: 999;
  list-style: none;
  padding: 10px 0;
}

.caby-nav-menu > li:hover > .sub-menu,
.caby-nav-menu > li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.caby-nav-menu > li .sub-menu li a {
  display: block;
  padding: 10px 22px;
  color: var(--gray-700);
  font-size: 14px;
  font-weight: 500;
  transition: all var(--transition);
}

.caby-nav-menu > li .sub-menu li a:hover {
  color: var(--teal);
  background: var(--teal-ultra);
  padding-left: 28px;
}

/* Header Actions */
.caby-header-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.caby-donate-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 24px;
  background: var(--teal);
  color: var(--white) !important;
  font-family: var(--font-head);
  font-size: 14px;
  font-weight: 700;
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all var(--transition);
  box-shadow: 0 4px 16px rgba(0,180,216,.4);
  white-space: nowrap;
  letter-spacing: .02em;
}

.caby-donate-btn:hover {
  background: var(--white);
  color: var(--navy) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,180,216,.5);
}

/* Hamburger */
.caby-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  cursor: pointer;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  transition: background var(--transition);
  width: 46px;
  height: 46px;
}

.caby-hamburger:hover { background: rgba(255,255,255,.22); }

.caby-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: transform var(--transition), opacity var(--transition);
}

.caby-hamburger.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.caby-hamburger.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.caby-hamburger.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

@media (max-width: 1024px) {
  .caby-hamburger { display: flex; }
  .caby-main-nav { display: none; }
}

@media (max-width: 480px) {
  .caby-logo-text { display: none; }
  .caby-donate-btn { padding: 9px 16px; font-size: 13px; }
  .caby-header-inner { height: 68px; gap: 16px; }
}

/* ── 6. MOBILE DRAWER ── */
.caby-mobile-drawer {
  position: fixed;
  top: 0;
  right: -100%;
  width: min(340px, 92vw);
  height: 100%;
  background: var(--navy);
  z-index: 9999;
  transition: right 0.38s cubic-bezier(0.4,0,0.2,1);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.caby-mobile-drawer.open { right: 0; }

.caby-drawer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: var(--navy-dark);
}

.caby-drawer-top .caby-logo-img { height: 42px; }

.caby-drawer-close {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  cursor: pointer;
  color: var(--white);
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition);
}

.caby-drawer-close:hover { background: rgba(255,255,255,.25); }

.caby-mobile-menu { padding: 12px 0; flex: 1; }

.caby-mobile-menu li { border-bottom: 1px solid rgba(255,255,255,.06); }

.caby-mobile-menu li a {
  display: block;
  padding: 15px 24px;
  color: rgba(255,255,255,.82);
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 600;
  transition: all var(--transition);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.caby-mobile-menu li a:hover,
.caby-mobile-menu li.current-menu-item > a {
  color: var(--teal-light);
  background: rgba(255,255,255,.05);
  padding-left: 32px;
}

.caby-mobile-menu .sub-menu { background: rgba(0,0,0,.2); }
.caby-mobile-menu .sub-menu li a {
  padding-left: 40px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}

.caby-drawer-donate {
  margin: 20px 24px 28px;
  justify-content: center;
  font-size: 15px;
}

.caby-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(7,16,66,.7);
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition);
  backdrop-filter: blur(3px);
}

.caby-drawer-overlay.visible { opacity: 1; pointer-events: all; }

/* ── 7. BOSA HEADER KILL — completely hide original Bosa header ── */
#masthead.site-header,
.site-header.header-one,
.top-header,
.bottom-header,
.bosa-header,
.bosa-main-header { display: none !important; }

/* ── 8. HERO CAROUSEL — Full-bleed, container-fluid ── */

/* Force first Elementor section to be full-width */
.elementor-section.elementor-top-section:first-of-type {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.elementor-section.elementor-top-section:first-of-type > .elementor-container {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
}

.elementor-section.elementor-top-section:first-of-type .elementor-column {
  padding: 0 !important;
  margin: 0 !important;
}

.elementor-section.elementor-top-section:first-of-type .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

/* SINA banner slider full-bleed */
.sina-banner-slider,
.sina-banner-slider.owl-carousel {
  min-height: 680px !important;
  width: 100% !important;
  max-width: 100% !important;
}

.sina-slider-content {
  min-height: 680px !important;
  background-size: cover !important;
  background-position: center center !important;
  position: relative;
  display: flex !important;
  align-items: center;
}

.sina-overlay {
  background: linear-gradient(
    110deg,
    rgba(7,16,66,.92) 0%,
    rgba(13,27,107,.75) 45%,
    rgba(0,127,160,.4) 100%
  ) !important;
}

.sina-banner-container {
  position: relative;
  z-index: 2;
  padding: 100px 80px !important;
  max-width: 860px;
}

.sina-banner-title {
  font-family: var(--font-head) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .2em !important;
  color: var(--teal-light) !important;
  margin-bottom: 18px !important;
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid rgba(64,208,240,.4);
  border-radius: var(--radius-full);
  background: rgba(0,180,216,.12);
}

.sina-banner-subtitle {
  font-family: var(--font-head) !important;
  font-size: clamp(2.2rem, 5.5vw, 4rem) !important;
  font-weight: 800 !important;
  color: var(--white) !important;
  line-height: 1.12 !important;
  margin-bottom: 22px !important;
  text-shadow: 0 2px 20px rgba(0,0,0,.3);
}

.sina-banner-desc {
  font-family: var(--font-body) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,.85) !important;
  line-height: 1.75 !important;
  margin-bottom: 40px !important;
  max-width: 580px;
}

.sina-pbtn, .sina-sbtn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 15px 34px !important;
  border-radius: var(--radius-full) !important;
  font-family: var(--font-head) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all var(--transition) !important;
  margin-right: 14px !important;
  margin-bottom: 14px !important;
}

.sina-pbtn {
  background: var(--teal) !important;
  color: var(--white) !important;
  box-shadow: 0 6px 24px rgba(0,180,216,.45) !important;
}

.sina-pbtn:hover {
  background: var(--white) !important;
  color: var(--navy) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 32px rgba(0,180,216,.55) !important;
}

.sina-sbtn {
  background: rgba(255,255,255,.1) !important;
  color: var(--white) !important;
  border: 2px solid rgba(255,255,255,.5) !important;
  backdrop-filter: blur(6px) !important;
}

.sina-sbtn:hover {
  background: var(--white) !important;
  color: var(--navy) !important;
  border-color: var(--white) !important;
}

/* OWL carousel nav & dots */
.owl-dots {
  position: absolute;
  bottom: 32px;
  left: 80px;
  margin: 0 !important;
  display: flex;
  gap: 6px;
}

.owl-dot span {
  background: rgba(255,255,255,.35) !important;
  width: 28px !important;
  height: 4px !important;
  border-radius: 4px !important;
  margin: 0 !important;
  transition: all var(--transition) !important;
}

.owl-dot.active span {
  background: var(--teal) !important;
  width: 44px !important;
}

.owl-nav { display: flex; gap: 10px; }

.owl-nav .owl-prev,
.owl-nav .owl-next {
  background: rgba(255,255,255,.12) !important;
  color: var(--white) !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  border: 2px solid rgba(255,255,255,.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  transition: all var(--transition) !important;
  backdrop-filter: blur(6px) !important;
}

.owl-nav .owl-prev:hover,
.owl-nav .owl-next:hover {
  background: var(--teal) !important;
  border-color: var(--teal) !important;
  transform: scale(1.08) !important;
}

@media (max-width: 767px) {
  .sina-banner-container { padding: 60px 24px 90px !important; }
  .sina-slider-content,
  .sina-banner-slider.owl-carousel { min-height: 520px !important; }
  .owl-dots { left: 24px; bottom: 22px; }
}

/* ================================================================
   BODY CONTENT — Sections 9+
   ================================================================ */

/* ── 9. ELEMENTOR SECTION LAYOUT ── */
.elementor-section { position: relative; overflow: visible; }

/* Section container */
.elementor-section .elementor-container {
  max-width: var(--container) !important;
}

/* All non-hero sections get generous vertical space */
.elementor-top-section:not(:first-of-type) {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

/* Alternate section backgrounds — subtle but creates visual rhythm */
.elementor-top-section:nth-child(even):not(:first-child) {
  background-color: var(--light) !important;
}

/* Full-width stretch sections keep their own bg */
.elementor-section-stretched { max-width: 100% !important; }

/* ── 10. SECTION HEADINGS — Dramatic treatment ── */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--font-head) !important;
}

/* H2 section titles */
.elementor-widget-heading .elementor-heading-title[tag="h2"],
.elementor-widget-heading h2.elementor-heading-title {
  color: var(--navy) !important;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  position: relative;
}

/* H3 titles */
.elementor-widget-heading .elementor-heading-title[tag="h3"],
.elementor-widget-heading h3.elementor-heading-title {
  color: var(--navy) !important;
  font-size: clamp(1.3rem, 2.5vw, 1.75rem) !important;
  font-weight: 700 !important;
}

/* Overline / eyebrow labels (small colored text above headings) */
.elementor-widget-heading .elementor-heading-title[tag="h6"],
.elementor-widget-heading h6.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title[tag="p"] {
  color: var(--teal) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .18em !important;
  display: inline-block;
  padding: 5px 16px;
  background: var(--teal-ultra);
  border-radius: var(--radius-full);
  margin-bottom: 14px;
}

/* Divider line */
.elementor-widget-divider .elementor-divider-separator {
  border-color: var(--teal) !important;
}

/* Paragraph text */
.elementor-widget-text-editor { color: var(--gray-700) !important; font-size: 16px; line-height: 1.8; }

/* ── 11. ICON BOXES — Complete redesign ── */
.elementor-widget-icon-box {
  height: 100%;
}

.elementor-widget-icon-box .elementor-icon-box-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  padding: 0 !important;
  box-shadow: 0 2px 20px rgba(13,27,107,.07);
  border: 1px solid rgba(13,27,107,.06);
  transition: transform var(--transition), box-shadow var(--transition);
}

/* Colored top gradient stripe */
.elementor-widget-icon-box .elementor-icon-box-wrapper::before {
  content: '';
  display: block;
  height: 5px;
  background: linear-gradient(90deg, var(--teal) 0%, var(--navy) 100%);
  flex-shrink: 0;
}

.elementor-widget-icon-box .elementor-icon-box-wrapper:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 50px rgba(13,27,107,.16);
}

/* Icon circle */
.elementor-widget-icon-box .elementor-icon-box-icon {
  padding: 28px 28px 0 !important;
}

.elementor-widget-icon-box .elementor-icon {
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  background: var(--teal-ultra) !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: var(--teal) !important;
  font-size: 26px !important;
  transition: background var(--transition), color var(--transition);
}

.elementor-widget-icon-box .elementor-icon-box-wrapper:hover .elementor-icon {
  background: var(--navy) !important;
  color: var(--white) !important;
}

/* Icon box text content */
.elementor-widget-icon-box .elementor-icon-box-content {
  padding: 18px 28px 30px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.elementor-widget-icon-box .elementor-icon-box-title {
  color: var(--navy) !important;
  font-family: var(--font-head) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  line-height: 1.3;
}

.elementor-widget-icon-box .elementor-icon-box-description {
  color: var(--gray-500) !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  flex: 1;
}

/* ── 12. COUNTER WIDGET — Giant bold numbers ── */
.elementor-widget-counter { text-align: center; }

.elementor-counter {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px;
  position: relative;
}

/* Giant decorative ring behind the number */
.elementor-counter::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(0,180,216,.07);
  z-index: 0;
}

.elementor-counter-number-wrapper {
  position: relative;
  z-index: 1;
  font-family: var(--font-head) !important;
  font-size: clamp(3rem, 5.5vw, 4.5rem) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  margin-bottom: 12px !important;
}

.elementor-counter .elementor-counter-number-prefix,
.elementor-counter .elementor-counter-number,
.elementor-counter .elementor-counter-number-suffix {
  color: var(--teal) !important;
}

.elementor-counter .elementor-counter-title {
  position: relative;
  z-index: 1;
  font-family: var(--font-head) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: var(--gray-500) !important;
}

/* Counter on dark navy section backgrounds */
.elementor-section[style*="background-color: rgb(7"] .elementor-counter .elementor-counter-title,
.elementor-section[style*="background-color: rgb(13, 27"] .elementor-counter .elementor-counter-title,
.elementor-section[style*="#0D1B6B"] .elementor-counter .elementor-counter-title,
.elementor-section[style*="#071042"] .elementor-counter .elementor-counter-title {
  color: rgba(255,255,255,.6) !important;
}

/* ── 13. IMAGE WIDGET — Zoom + shadow ── */
.elementor-widget-image .elementor-image {
  overflow: hidden;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
}

.elementor-widget-image img {
  border-radius: var(--radius-md) !important;
  transition: transform 0.65s ease !important;
  display: block;
  width: 100%;
}

.elementor-widget-image .elementor-image:hover img {
  transform: scale(1.05);
}

/* ── 14. TESTIMONIAL WIDGET — Bold quote cards ── */
.elementor-testimonial-wrapper {
  background: var(--white) !important;
  border-radius: var(--radius-lg) !important;
  padding: 44px 36px 36px !important;
  box-shadow: var(--shadow-md) !important;
  border: none !important;
  border-left: none !important;
  position: relative;
  overflow: hidden;
}

/* Giant decorative quotation mark */
.elementor-testimonial-wrapper::before {
  content: '\201C';
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 120px;
  color: var(--teal);
  opacity: 0.1;
  position: absolute;
  top: -10px;
  left: 16px;
  line-height: 1;
  z-index: 0;
}

/* Teal top accent */
.elementor-testimonial-wrapper::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--teal), var(--navy));
}

.elementor-testimonial-content {
  color: var(--gray-700) !important;
  font-size: 17px !important;
  font-style: italic !important;
  line-height: 1.8 !important;
  position: relative;
  z-index: 1;
  margin-bottom: 20px !important;
}

.elementor-testimonial-meta { position: relative; z-index: 1; }
.elementor-testimonial-name { color: var(--navy) !important; font-family: var(--font-head) !important; font-weight: 700 !important; font-size: 16px !important; }
.elementor-testimonial-job { color: var(--teal) !important; font-size: 13px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .05em; }

.elementor-testimonial-image img {
  border-radius: 50% !important;
  border: 3px solid var(--teal) !important;
  width: 56px !important;
  height: 56px !important;
  object-fit: cover;
}

/* ── 15. ACCORDION ── */
.elementor-accordion-item {
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius-md) !important;
  margin-bottom: 10px !important;
  overflow: hidden;
}

.elementor-accordion .elementor-tab-title {
  color: var(--navy) !important;
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  background: var(--white) !important;
  padding: 18px 24px !important;
  transition: background var(--transition), color var(--transition);
}

.elementor-accordion .elementor-tab-title:hover { background: var(--light) !important; }

.elementor-accordion .elementor-tab-title.elementor-active {
  color: var(--white) !important;
  background: var(--navy) !important;
}

.elementor-accordion .elementor-accordion-icon { color: var(--teal) !important; }
.elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon { color: var(--teal-light) !important; }

.elementor-accordion .elementor-tab-content { padding: 20px 24px !important; color: var(--gray-700) !important; border-top: 1px solid var(--gray-200); }

/* ── 16. PROGRESS BARS ── */
.elementor-progress-bar { background: var(--teal) !important; border-radius: var(--radius-full) !important; }
.elementor-progress-wrapper { border-radius: var(--radius-full) !important; background: var(--gray-200) !important; }
.elementor-progress-percentage { color: var(--navy) !important; font-family: var(--font-head) !important; font-weight: 700 !important; }

/* ── 17. ELEMENTOR BUTTONS ── */
.elementor-button {
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
  border-radius: var(--radius-full) !important;
  letter-spacing: .03em !important;
  transition: all var(--transition) !important;
}

.elementor-button:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(0,0,0,.18) !important; }

.elementor-button.elementor-button-primary,
a.elementor-button.elementor-button-primary {
  background: var(--teal) !important;
  color: var(--white) !important;
}

.elementor-button.elementor-button-primary:hover { background: var(--navy) !important; color: var(--white) !important; }

/* ── 18. BLOG / POST CARDS ── */
.elementor-posts .elementor-post {
  background: var(--white) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden;
  box-shadow: 0 2px 20px rgba(13,27,107,.07) !important;
  border: 1px solid rgba(13,27,107,.06) !important;
  transition: all var(--transition) !important;
}

.elementor-posts .elementor-post:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: transparent !important;
}

.elementor-posts .elementor-post__thumbnail { overflow: hidden; }
.elementor-posts .elementor-post__thumbnail img { transition: transform 0.65s ease !important; }
.elementor-posts .elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.06) !important; }

.elementor-posts .elementor-post__text { padding: 24px !important; }

.elementor-posts .elementor-post__title a {
  color: var(--navy) !important;
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  line-height: 1.35;
}

.elementor-posts .elementor-post__title a:hover { color: var(--teal) !important; }

.elementor-posts .elementor-post__excerpt p { color: var(--gray-500) !important; font-size: 15px !important; line-height: 1.7 !important; }

.elementor-posts .elementor-post__read-more {
  color: var(--teal) !important;
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: gap var(--transition), color var(--transition);
}

.elementor-posts .elementor-post__read-more:hover { color: var(--navy) !important; gap: 10px !important; }

.elementor-posts .elementor-post-date,
.elementor-posts .elementor-post__meta-data { color: var(--teal-dark) !important; font-size: 13px !important; font-weight: 600 !important; }

/* SINA Blog widget */
.sina-blogpost .sina-post-content {
  background: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 2px 20px rgba(13,27,107,.07);
  border: 1px solid rgba(13,27,107,.06);
  transition: all var(--transition);
}

.sina-blogpost .sina-post-content:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); border-color: transparent; }

.sina-blogpost .sina-post-img { overflow: hidden; }
.sina-blogpost .sina-post-img img { transition: transform 0.65s ease; }
.sina-blogpost .sina-post-content:hover .sina-post-img img { transform: scale(1.06); }

.sina-blogpost .sina-post-title a { color: var(--navy) !important; font-family: var(--font-head) !important; font-weight: 700; }
.sina-blogpost .sina-post-title a:hover { color: var(--teal) !important; }

/* ── 19. INNER PAGE HERO (from page.php / single.php) ── */
.caby-inner-hero {
  background-color: var(--navy-dark);
  background-image: var(--page-img);
  background-size: cover;
  background-position: center;
  min-height: 360px;
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

/* Gradient overlay on top of image */
.caby-inner-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(7,16,66,.90) 0%,
    rgba(13,27,107,.80) 50%,
    rgba(0,127,160,.55) 100%
  );
}

/* Decorative circle accent */
.caby-inner-hero::after {
  content: '';
  position: absolute;
  right: -60px;
  bottom: -60px;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  border: 60px solid rgba(0,180,216,.06);
  pointer-events: none;
}

.caby-inner-hero .caby-wrap {
  position: relative;
  z-index: 2;
  padding-top: 88px;
  padding-bottom: 60px;
  width: 100%;
}

.caby-page-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(0,180,216,.18);
  border: 1px solid rgba(0,180,216,.35);
  color: var(--teal-light);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
  padding: 5px 14px;
  border-radius: var(--radius-full);
  margin-bottom: 16px;
  font-family: var(--font-head);
}

.caby-inner-hero-title {
  color: var(--white) !important;
  font-family: var(--font-head) !important;
  font-size: clamp(2rem, 4.5vw, 3.25rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  margin-bottom: 18px !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.25);
}

.caby-inner-hero-breadcrumb {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: rgba(255,255,255,.55);
  font-family: var(--font-body);
}

.caby-inner-hero-breadcrumb a {
  color: rgba(255,255,255,.8);
  transition: color var(--transition);
}

.caby-inner-hero-breadcrumb a:hover { color: var(--teal-light); }

.caby-breadcrumb-sep { opacity: .4; }

/* Post category pills in hero */
.caby-post-categories a {
  display: inline-block;
  padding: 4px 14px;
  background: rgba(0,180,216,.18);
  border: 1px solid rgba(0,180,216,.35);
  color: var(--teal-light) !important;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  border-radius: var(--radius-full);
  margin: 0 4px 12px 0;
  font-family: var(--font-head);
}

/* Post meta in hero */
.caby-post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  color: rgba(255,255,255,.6);
  font-size: 14px;
  margin-top: 10px;
}

.caby-post-meta span { display: inline-flex; align-items: center; gap: 6px; }
.caby-post-meta i { color: var(--teal); }

/* ── 20. INNER PAGE CONTENT AREA ── */
#content.site-content { padding: 0 !important; }
.site-main { padding: 0 !important; }

.caby-inner-content {
  padding: 80px 0 96px;
  background: var(--white);
}

.caby-inner-grid { width: 100%; }

.caby-inner-main {
  max-width: 880px;
  margin: 0 auto;
}

/* ── 21. PAGE ENTRY TYPOGRAPHY ── */
.caby-page-entry {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.88;
  color: var(--gray-700);
}

.caby-page-entry > * + * { margin-top: 1.5em; }

.caby-page-entry h1,
.caby-page-entry h2,
.caby-page-entry h3,
.caby-page-entry h4 {
  font-family: var(--font-head);
  color: var(--navy);
  margin-top: 2em;
  margin-bottom: .6em;
  line-height: 1.25;
}

.caby-page-entry h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  border-left: 5px solid var(--teal);
  padding-left: 18px;
}

.caby-page-entry h3 { font-size: clamp(1.2rem, 2.5vw, 1.5rem); }

.caby-page-entry a { color: var(--teal); border-bottom: 1px solid rgba(0,180,216,.3); transition: color var(--transition), border-color var(--transition); }
.caby-page-entry a:hover { color: var(--navy); border-color: var(--navy); }

.caby-page-entry img {
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  margin: 2em 0;
  width: 100%;
}

.caby-page-entry blockquote {
  margin: 2em 0;
  padding: 28px 36px;
  background: var(--teal-ultra);
  border-left: 5px solid var(--teal);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-size: 18px;
  font-style: italic;
  color: var(--navy);
  position: relative;
}

.caby-page-entry blockquote::before {
  content: '\201C';
  font-family: Georgia, serif;
  font-size: 80px;
  color: var(--teal);
  opacity: .25;
  position: absolute;
  top: 0;
  left: 12px;
  line-height: 1;
}

.caby-page-entry ul { list-style: none; padding: 0; }
.caby-page-entry ul li {
  padding-left: 22px;
  position: relative;
  margin-bottom: .5em;
}
.caby-page-entry ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 11px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--teal);
}

.caby-page-entry ol { list-style: decimal; padding-left: 1.5em; }
.caby-page-entry ol li { margin-bottom: .5em; }

.caby-page-entry table { width: 100%; border-collapse: collapse; margin: 2em 0; }
.caby-page-entry th { background: var(--navy); color: var(--white); padding: 12px 16px; text-align: left; font-family: var(--font-head); font-size: 14px; }
.caby-page-entry td { padding: 12px 16px; border-bottom: 1px solid var(--gray-200); }
.caby-page-entry tr:nth-child(even) td { background: var(--gray-50); }

/* ── 22. POST NAVIGATION ── */
.caby-post-nav { margin-top: 3.5em; padding-top: 2em; border-top: 1px solid var(--gray-200); }

.caby-post-nav .nav-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.caby-post-nav .nav-links a {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 20px 22px;
  background: var(--light);
  border-radius: var(--radius-md);
  transition: all var(--transition);
  border: 1px solid var(--gray-200);
  text-decoration: none !important;
}

.caby-post-nav .nav-previous a { border-left: 4px solid var(--teal); }
.caby-post-nav .nav-next a { border-right: 4px solid var(--teal); text-align: right; }

.caby-post-nav .nav-links a:hover {
  background: var(--navy);
  border-color: var(--navy);
}

.caby-nav-dir {
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--teal);
}

.caby-nav-title {
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.3;
}

.caby-post-nav .nav-links a:hover .caby-nav-dir,
.caby-post-nav .nav-links a:hover .caby-nav-title { color: var(--white) !important; }

@media (max-width: 600px) { .caby-post-nav .nav-links { grid-template-columns: 1fr; } }

/* ── 22b. ARCHIVE / CATEGORY PAGE ── */

/* Hero banner */
.caby-arch-hero {
  background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 55%, var(--navy-mid) 100%);
  padding: 100px 0 80px;
  position: relative;
  overflow: hidden;
}

.caby-arch-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 80% 50%, rgba(0,180,216,.12) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 10% 80%, rgba(76,175,80,.08) 0%, transparent 60%);
  pointer-events: none;
}

/* Animated floating dots */
.caby-arch-hero-bg { position: absolute; inset: 0; pointer-events: none; }
.caby-arch-hero-dot {
  position: absolute;
  border-radius: 50%;
  opacity: .08;
  animation: archFloat 8s ease-in-out infinite;
}
.dot-1 { width: 320px; height: 320px; background: var(--teal); top: -80px; right: -60px; animation-delay: 0s; }
.dot-2 { width: 200px; height: 200px; background: var(--green); bottom: -60px; left: 15%; animation-delay: 3s; }
.dot-3 { width: 140px; height: 140px; background: var(--teal-light); top: 30%; left: 5%; animation-delay: 6s; }

@keyframes archFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-22px) scale(1.04); }
}

.caby-arch-hero-content { position: relative; z-index: 2; max-width: 700px; }

.caby-arch-hero-title {
  color: var(--white) !important;
  font-size: clamp(2.4rem, 5vw, 3.6rem) !important;
  font-weight: 800 !important;
  margin: 14px 0 18px !important;
  line-height: 1.1 !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.3);
}

.caby-arch-hero-desc {
  color: rgba(255,255,255,.72);
  font-size: 18px;
  line-height: 1.75;
  margin-bottom: 28px;
}

.caby-arch-hero-meta {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  color: rgba(255,255,255,.55);
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-head);
  text-transform: uppercase;
  letter-spacing: .06em;
}

.caby-arch-hero-meta span { display: inline-flex; align-items: center; gap: 7px; }
.caby-arch-hero-meta i { color: var(--teal); }

/* Breadcrumb bar */
.caby-arch-breadcrumb-bar {
  background: rgba(13,27,107,.06);
  border-bottom: 1px solid rgba(13,27,107,.08);
  padding: 13px 0;
}

.caby-arch-breadcrumb {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--gray-500);
  font-family: var(--font-body);
}

.caby-arch-breadcrumb a {
  color: var(--navy);
  font-weight: 500;
  transition: color var(--transition);
}
.caby-arch-breadcrumb a:hover { color: var(--teal); }
.caby-arch-breadcrumb .caby-breadcrumb-sep { font-size: 10px; color: var(--gray-400); }

/* Page body */
.caby-arch-body { padding: 72px 0 96px; background: var(--gray-50); }

/* ── FEATURED POST ── */
.caby-arch-featured {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  margin-bottom: 72px;
  border: 1px solid rgba(13,27,107,.06);
  min-height: 440px;
}

.caby-arch-featured-img {
  position: relative;
  overflow: hidden;
}

.caby-arch-featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s ease;
}

.caby-arch-featured:hover .caby-arch-featured-img img {
  transform: scale(1.06);
}

/* "Featured" badge */
.caby-arch-badge {
  position: absolute;
  top: 20px;
  left: 20px;
  background: linear-gradient(90deg, var(--teal), var(--teal-dark));
  color: var(--white);
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 6px 14px;
  border-radius: var(--radius-full);
  box-shadow: 0 4px 16px rgba(0,180,216,.4);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.caby-arch-featured-body {
  padding: 44px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
}

/* Category pills */
.caby-arch-featured-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }

.caby-arch-cat-pill {
  display: inline-block;
  padding: 4px 14px;
  border-radius: var(--radius-full);
  background: var(--teal-ultra);
  color: var(--teal-dark) !important;
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .09em;
  transition: all var(--transition);
}

.caby-arch-cat-pill:hover {
  background: var(--teal);
  color: var(--white) !important;
}

.caby-arch-featured-title {
  font-size: clamp(1.5rem, 3vw, 2.1rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin-bottom: 18px !important;
}

.caby-arch-featured-title a { color: var(--navy) !important; text-decoration: none; transition: color var(--transition); }
.caby-arch-featured-title a:hover { color: var(--teal) !important; }

.caby-arch-featured-excerpt {
  color: var(--gray-500);
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 28px;
}

.caby-arch-featured-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: auto;
  padding-top: 24px;
  border-top: 1px solid var(--gray-200);
}

.caby-arch-post-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--gray-500);
  font-family: var(--font-body);
}

.caby-arch-meta-author { display: inline-flex; align-items: center; gap: 8px; }

.caby-arch-avatar {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  object-fit: cover;
  border: 2px solid var(--teal-ultra);
}

.caby-arch-post-meta i { color: var(--teal); margin-right: 4px; }
.caby-arch-post-meta strong { color: var(--navy); font-weight: 600; }

/* Read button */
.caby-arch-read-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  color: var(--white) !important;
  font-family: var(--font-head);
  font-size: 14px;
  font-weight: 700;
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all var(--transition);
  box-shadow: 0 4px 20px rgba(0,180,216,.35);
  white-space: nowrap;
}

.caby-arch-read-btn i { transition: transform var(--transition); }
.caby-arch-read-btn:hover {
  background: linear-gradient(135deg, var(--navy), var(--navy-mid));
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(13,27,107,.35);
  color: var(--white) !important;
}
.caby-arch-read-btn:hover i { transform: translateX(4px); }

/* ── SECTION DIVIDER ── */
.caby-arch-section-head { margin-bottom: 40px; }

.caby-arch-section-title {
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  color: var(--navy) !important;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 !important;
}

.caby-arch-section-title::before,
.caby-arch-section-title::after {
  content: '';
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, var(--teal) 0%, rgba(0,180,216,.1) 100%);
  border-radius: 2px;
}

.caby-arch-section-title::before { flex: 0 0 40px; }

.caby-arch-section-title span {
  padding: 0 8px;
  white-space: nowrap;
}

/* ── CARD GRID ── */
.caby-arch-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 64px;
}

.caby-arch-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(13,27,107,.07);
  border: 1px solid rgba(13,27,107,.05);
  display: flex;
  flex-direction: column;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.caby-arch-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(0,180,216,.15);
}

.caby-arch-card-img-wrap {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--navy);
  flex-shrink: 0;
}

.caby-arch-card-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s ease;
}

.caby-arch-card:hover .caby-arch-card-img-wrap img { transform: scale(1.08); }

.caby-arch-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(7,16,66,.55) 0%, transparent 50%);
  transition: opacity var(--transition);
}

.caby-arch-card:hover .caby-arch-card-overlay { opacity: .7; }

/* Category label on image */
.caby-arch-card-cat {
  position: absolute;
  bottom: 14px;
  left: 14px;
  background: rgba(0,180,216,.92);
  color: var(--white);
  font-family: var(--font-head);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 4px 12px;
  border-radius: var(--radius-full);
  backdrop-filter: blur(6px);
}

/* Placeholder when no image */
.caby-arch-card-no-img {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.2);
  font-size: 48px;
}

/* Card body */
.caby-arch-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0;
}

.caby-arch-card-meta {
  display: flex;
  gap: 14px;
  font-size: 12px;
  color: var(--gray-400);
  font-weight: 600;
  font-family: var(--font-head);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 12px;
}

.caby-arch-card-meta i { color: var(--teal); margin-right: 3px; }

.caby-arch-card-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  margin-bottom: 12px !important;
}

.caby-arch-card-title a { color: var(--navy) !important; text-decoration: none; transition: color var(--transition); }
.caby-arch-card-title a:hover { color: var(--teal) !important; }

.caby-arch-card-excerpt {
  color: var(--gray-500);
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 20px;
  flex: 1;
}

.caby-arch-card-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 700;
  color: var(--teal) !important;
  text-decoration: none;
  transition: gap var(--transition), color var(--transition);
  margin-top: auto;
}

.caby-arch-card-link i { transition: transform var(--transition); }
.caby-arch-card-link:hover { color: var(--navy) !important; }
.caby-arch-card-link:hover i { transform: translateX(4px); }

/* Accented left border on hover */
.caby-arch-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  background: linear-gradient(to bottom, var(--teal), var(--navy));
  border-radius: var(--radius-lg) 0 0 var(--radius-lg);
  transition: width 0.3s ease;
}

.caby-arch-card { position: relative; }
.caby-arch-card:hover::before { width: 4px; }

/* ── PAGINATION ── */
.caby-arch-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 20px;
}

.caby-arch-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 16px;
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 14px;
  font-weight: 700;
  background: var(--white);
  color: var(--navy) !important;
  border: 2px solid var(--gray-200);
  text-decoration: none;
  transition: all var(--transition);
}

.caby-arch-pagination .page-numbers:hover {
  background: var(--teal);
  border-color: var(--teal);
  color: var(--white) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,180,216,.35);
}

.caby-arch-pagination .page-numbers.current {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white) !important;
  box-shadow: 0 4px 16px rgba(13,27,107,.35);
}

.caby-arch-pagination .page-numbers.dots {
  border: none;
  background: transparent;
  color: var(--gray-400) !important;
}

/* ── EMPTY STATE ── */
.caby-arch-empty {
  text-align: center;
  padding: 96px 24px;
}

.caby-arch-empty i {
  font-size: 64px;
  color: var(--gray-200);
  margin-bottom: 24px;
  display: block;
}

.caby-arch-empty h3 {
  color: var(--navy);
  margin-bottom: 12px;
}

.caby-arch-empty p {
  color: var(--gray-500);
  margin-bottom: 32px;
}

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .caby-arch-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .caby-arch-hero { padding: 72px 0 60px; }
  .caby-arch-featured { grid-template-columns: 1fr; min-height: auto; }
  .caby-arch-featured-img { aspect-ratio: 16 / 9; height: auto; }
  .caby-arch-featured-body { padding: 28px 28px 32px; }
  .caby-arch-featured-footer { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 600px) {
  .caby-arch-grid { grid-template-columns: 1fr; }
  .caby-arch-hero-title { font-size: 2rem !important; }
  .caby-arch-body { padding: 48px 0 72px; }
}

/* ── 23. BOSA BREADCRUMBS on non-Canvas pages ── */
.breadcrumb-wrap {
  background: var(--navy-dark) !important;
  padding: 14px 0 !important;
  border: none !important;
  margin: 0 !important;
}

.breadcrumb-wrap .breadcrumbs {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.5) !important;
}

.breadcrumb-wrap .breadcrumbs a { color: rgba(255,255,255,.75) !important; }
.breadcrumb-wrap .breadcrumbs a:hover { color: var(--teal-light) !important; }

/* Bosa page title block (Bosa inner pages without page.php override) */
.page-header {
  background: var(--navy) !important;
  padding: 64px 0 52px !important;
  text-align: left;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,180,216,.12) 0%, transparent 60%);
}

.page-header .page-title {
  color: var(--white) !important;
  font-family: var(--font-head) !important;
  font-size: clamp(1.8rem, 4vw, 2.8rem) !important;
  position: relative;
  z-index: 1;
}

.wrap-detail-page { padding: 72px 0 !important; }

/* ── 24. GLOBAL BUTTONS ── */
.button-primary, .wp-block-button .wp-block-button__link {
  background: var(--teal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-full) !important;
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
  transition: all var(--transition) !important;
}

.button-primary:hover { background: var(--navy) !important; transform: translateY(-2px) !important; }

input[type=submit], input[type=button], button[type=submit] {
  background: var(--teal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  transition: background var(--transition) !important;
}

input[type=submit]:hover { background: var(--navy) !important; }

/* ── 25. FOOTER ── */
#caby-footer { font-family: var(--font-body); }

.caby-footer-top {
  background: var(--navy-dark);
  padding: 88px 0 64px;
  position: relative;
  overflow: hidden;
}

.caby-footer-top::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--teal) 0%, var(--navy-mid) 50%, var(--green) 100%);
}

.caby-footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.3fr;
  gap: 52px;
}

@media (max-width: 1024px) { .caby-footer-grid { grid-template-columns: 1fr 1fr; gap: 44px; } }
@media (max-width: 640px) { .caby-footer-grid { grid-template-columns: 1fr; gap: 36px; } }

.caby-footer-logo { height: 56px; width: auto; margin-bottom: 20px; filter: brightness(1.1); }

.caby-footer-brand-col p {
  color: rgba(255,255,255,.58);
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 26px;
}

.caby-footer-social { display: flex; gap: 10px; flex-wrap: wrap; }

.caby-footer-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.58);
  font-size: 14px;
  transition: all var(--transition);
}

.caby-footer-social a:hover {
  background: var(--teal);
  border-color: var(--teal);
  color: var(--white);
  transform: translateY(-3px);
}

.caby-footer-heading {
  color: var(--white) !important;
  font-family: var(--font-head) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 24px !important;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--teal);
  display: block;
}

.caby-footer-links { list-style: none; margin: 0; padding: 0; }
.caby-footer-links li { margin-bottom: 11px; }

.caby-footer-links a {
  color: rgba(255,255,255,.58);
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all var(--transition);
}

.caby-footer-links a::before {
  content: '›';
  color: var(--teal);
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
}

.caby-footer-links a:hover { color: var(--teal-light); padding-left: 4px; }

.caby-footer-contact { list-style: none; margin: 0 0 28px; padding: 0; }

.caby-footer-contact li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  color: rgba(255,255,255,.58);
  font-size: 15px;
}

.caby-footer-contact li i { color: var(--teal); font-size: 16px; margin-top: 3px; flex-shrink: 0; }
.caby-footer-contact li span a { color: rgba(255,255,255,.58); transition: color var(--transition); }
.caby-footer-contact li span a:hover { color: var(--teal-light); }

.caby-footer-donate-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  background: var(--teal);
  color: var(--white) !important;
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 700;
  border-radius: var(--radius-full);
  transition: all var(--transition);
  box-shadow: 0 4px 16px rgba(0,180,216,.35);
}

.caby-footer-donate-btn:hover {
  background: var(--white);
  color: var(--navy) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,180,216,.45);
}

.caby-footer-bottom {
  background: rgba(0,0,0,.35);
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 22px 0;
}

.caby-footer-bottom .caby-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}

.caby-footer-bottom p { color: rgba(255,255,255,.4); font-size: 13px; margin: 0; }
.caby-footer-bottom p strong { color: rgba(255,255,255,.6); }

.caby-footer-bottom-nav { display: flex; gap: 22px; }

.caby-footer-bottom-nav a {
  color: rgba(255,255,255,.4);
  font-size: 13px;
  transition: color var(--transition);
}

.caby-footer-bottom-nav a:hover { color: var(--teal-light); }

@media (max-width: 640px) {
  .caby-footer-bottom .caby-wrap { flex-direction: column; text-align: center; }
}

/* ── 26. BACK-TO-TOP ── */
#caby-back-top {
  position: fixed;
  bottom: 32px;
  right: 32px;
  width: 48px;
  height: 48px;
  background: var(--navy);
  color: var(--white);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-md);
  opacity: 0;
  transform: translateY(20px);
  transition: all var(--transition);
  z-index: 999;
}

#caby-back-top.visible { opacity: 1; transform: translateY(0); }
#caby-back-top:hover { background: var(--teal); transform: translateY(-4px); }

#back-to-top a { background: var(--navy) !important; color: var(--white) !important; border-radius: 50% !important; border-color: var(--navy) !important; }
#back-to-top a:hover { background: var(--teal) !important; border-color: var(--teal) !important; }

/* ── 27. FORMS ── */
input[type=text]:focus, input[type=email]:focus,
input[type=url]:focus, input[type=password]:focus,
textarea:focus, select:focus {
  border-color: var(--teal) !important;
  box-shadow: 0 0 0 3px rgba(0,180,216,.12) !important;
  outline: none;
}

.search-form .search-button,
.wp-block-search .search-button { background: var(--teal) !important; color: #fff !important; }

.comment-form input[type=submit] { background: var(--teal) !important; }
.comment-form input[type=submit]:hover { background: var(--navy) !important; }

/* ── 28. SIDEBAR & WIDGETS ── */
.widget-title {
  font-family: var(--font-head) !important;
  color: var(--navy) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  border-bottom: 3px solid var(--teal);
  padding-bottom: 10px;
  margin-bottom: 22px !important;
  display: block;
}

.page-numbers a:hover { background: var(--teal) !important; border-color: var(--teal) !important; color: #fff !important; }
.page-numbers .current { background: var(--navy) !important; border-color: var(--navy) !important; color: #fff !important; }

/* WooCommerce */
.woocommerce .button, .woocommerce button.button,
.woocommerce a.button, .woocommerce input.button {
  background: var(--teal) !important; color: #fff !important; border-radius: var(--radius-full) !important;
}
.woocommerce .button:hover { background: var(--navy) !important; }

/* ── 29. RESPONSIVE ── */
@media (max-width: 767px) {
  :root { --section-py: 64px; }
  .elementor-top-section:not(:first-of-type) { padding-top: 64px !important; padding-bottom: 64px !important; }
  .caby-footer-top { padding: 56px 0 44px; }
  .caby-inner-content { padding: 56px 0 72px; }
  .caby-inner-hero .caby-wrap { padding-top: 72px; padding-bottom: 48px; }
  .owl-dots { left: 24px; bottom: 22px; }
}

@media (max-width: 480px) {
  :root { --section-py: 48px; }
  #caby-back-top { bottom: 20px; right: 20px; width: 42px; height: 42px; }
  .elementor-counter-number-wrapper { font-size: 2.5rem !important; }
}

/* ── 30. PRELOADER & MISC ── */
#site-preloader { display: none !important; }
::selection { background: var(--teal); color: #fff; }

/* ── 31. SCROLL REVEAL ── */
.caby-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .65s ease, transform .65s ease;
}

.caby-reveal.caby-revealed { opacity: 1; transform: none; }
.caby-reveal[data-delay="1"] { transition-delay: .1s; }
.caby-reveal[data-delay="2"] { transition-delay: .2s; }
.caby-reveal[data-delay="3"] { transition-delay: .3s; }
.caby-reveal[data-delay="4"] { transition-delay: .4s; }

/* ── Inner page: reduce top-padding on first Elementor section (hero already provides spacing) ── */
/* Exclude pages that have their own hero section (caby-el-hero-section) */
body:not(.home) .elementor-top-section:first-of-type:not(.caby-el-hero-section) {
  padding-top: 56px !important;
  padding-bottom: 80px !important;
}

/* Homepage first section stays zero (it is the carousel) */
body.home .elementor-top-section:first-of-type {
  padding: 0 !important;
}

/* ════════════════════════════════════════════════════════
   29. ELEMENTOR CUSTOM SECTION STYLES
   (About Us · Strategic Plan · Home enhancements)
   ════════════════════════════════════════════════════════ */

/* ── Hero section shared ── */
.caby-el-hero-section .elementor-widget-heading .elementor-heading-title em {
  font-style: normal;
  color: #40D0F0;
}

.caby-el-hero-section .elementor-container { position: relative; z-index: 2; }

/* ── Stats strip ── */
.caby-el-stats-strip .elementor-counter-number {
  font-family: var(--font-head) !important;
  font-weight: 900 !important;
  color: #40D0F0 !important;
}

.caby-el-stats-strip .elementor-counter-title {
  font-family: var(--font-head) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-size: 11px !important;
  color: rgba(255,255,255,.5) !important;
}

.caby-el-stats-strip .elementor-col-25 {
  border-right: 1px solid rgba(255,255,255,.07);
}

.caby-el-stats-strip .elementor-col-25:last-child { border-right: none; }

/* ── Who We Are — photo styling ── */
.caby-el-who-section .elementor-widget-image img {
  height: 520px !important;
  object-fit: cover !important;
  object-position: center top;
}

/* ── Mission section ── */
.caby-el-mission-section .elementor-icon-box-wrapper {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: var(--radius-lg) !important;
  padding: 28px 20px !important;
  transition: all var(--transition) !important;
}

.caby-el-mission-section .elementor-icon-box-wrapper:hover {
  background: rgba(255,255,255,.11) !important;
  transform: translateY(-6px);
}

.caby-el-mission-section .elementor-icon i {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  border-radius: 50%;
  width: 60px !important;
  height: 60px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  color: #fff !important;
}

/* ── Impact strip ── */
.caby-el-impact-strip .elementor-counter-number {
  font-family: var(--font-head) !important;
  font-weight: 900 !important;
  color: #ffffff !important;
  font-size: 48px !important;
}

.caby-el-impact-strip .elementor-counter-title { color: rgba(255,255,255,.7) !important; }

/* ── Vision section image ── */
.caby-el-vision-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
  transition: transform 0.7s ease !important;
}
.caby-el-vision-section .elementor-widget-image img:hover { transform: scale(1.03); }

/* ── Core values section ── */
.caby-el-values-section .elementor-icon-box-wrapper {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: var(--radius-lg) !important;
  padding: 36px 24px !important;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}

.caby-el-values-section .elementor-icon-box-wrapper::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--teal), var(--green));
}

.caby-el-values-section .elementor-icon-box-wrapper:hover {
  background: rgba(255,255,255,.09) !important;
  transform: translateY(-8px);
  border-color: rgba(0,180,216,.3) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.3);
}

/* ── Approach section ── */
.caby-el-approach-section .elementor-icon-box-wrapper {
  background: var(--white) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius-lg) !important;
  padding: 40px 32px !important;
  height: 100%;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}

.caby-el-approach-section .elementor-icon-box-wrapper::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--teal), var(--navy));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.caby-el-approach-section .elementor-icon-box-wrapper:hover::before { transform: scaleX(1); }
.caby-el-approach-section .elementor-icon-box-wrapper:hover {
  box-shadow: var(--shadow-lg) !important;
  transform: translateY(-4px);
}

/* ── Team section ── */
.caby-el-team-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  height: 340px !important;
  object-fit: cover !important;
  object-position: center top;
  box-shadow: var(--shadow-md) !important;
  transition: transform 0.7s ease !important;
}

.caby-el-team-section .elementor-widget-image img:hover { transform: scale(1.04); }

/* ── CTA section ── */
.caby-el-cta-section { position: relative; overflow: hidden; }

.caby-el-cta-section::before {
  content: '';
  position: absolute;
  bottom: -100px; left: 50%;
  transform: translateX(-50%);
  width: 800px; height: 800px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(0,180,216,.08) 0%, transparent 70%);
  pointer-events: none;
}

.caby-el-cta-section .elementor-button {
  margin: 6px !important;
}

/* ── Strategic Plan specific ── */
.caby-el-quote-section .elementor-text-editor blockquote {
  margin: 0 auto !important;
  max-width: 820px !important;
}

.caby-el-context-section .elementor-icon-box-wrapper {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px 20px !important;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}

.caby-el-context-section .elementor-icon-box-wrapper:hover {
  background: rgba(255,255,255,.09) !important;
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,.3);
}

.caby-el-axes-section .elementor-icon-box-wrapper {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: var(--radius-lg) !important;
  padding: 28px 16px !important;
  text-align: center !important;
  transition: all var(--transition) !important;
}

.caby-el-axes-section .elementor-icon-box-wrapper:hover {
  background: rgba(0,180,216,.10) !important;
  transform: translateY(-8px);
  border-color: rgba(0,180,216,.3) !important;
}

.caby-el-axes-section .elementor-icon-box-icon { margin-bottom: 16px !important; }

.caby-el-axes-section .elementor-icon {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  border-radius: 50%;
  width: 56px !important; height: 56px !important;
  display: flex !important; align-items: center; justify-content: center;
  box-shadow: 0 8px 24px rgba(0,180,216,.35);
  margin: 0 auto;
}

.caby-el-axes-section .elementor-icon i { color: #fff !important; font-size: 20px !important; }

.caby-el-objectives-section .elementor-icon-box-wrapper {
  background: var(--white) !important;
  border: 1px solid var(--gray-200) !important;
  border-left: 4px solid var(--teal) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px 24px !important;
  height: 100%;
  transition: all var(--transition) !important;
}

.caby-el-objectives-section .elementor-icon-box-wrapper:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md) !important;
  border-left-color: var(--navy) !important;
}

.caby-el-impact-section .elementor-counter-number {
  font-family: var(--font-head) !important;
  font-weight: 900 !important;
  color: #40D0F0 !important;
  font-size: 52px !important;
}

.caby-el-impact-section .elementor-counter-title {
  color: rgba(255,255,255,.55) !important;
  font-family: var(--font-head) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.caby-el-themes-section .elementor-icon-box-wrapper {
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius-lg) !important;
  padding: 40px 28px !important;
  text-align: center !important;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}

.caby-el-themes-section .elementor-icon-box-wrapper::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, var(--navy-dark), var(--navy));
  opacity: 0;
  transition: opacity var(--transition);
}

.caby-el-themes-section .elementor-icon-box-wrapper:hover::after { opacity: 1; }
.caby-el-themes-section .elementor-icon-box-wrapper:hover * { position: relative; z-index: 1; color: rgba(255,255,255,.8) !important; }
.caby-el-themes-section .elementor-icon-box-wrapper:hover .elementor-icon-box-title * { color: #ffffff !important; }
.caby-el-themes-section .elementor-icon-box-wrapper:hover .elementor-icon i { color: var(--teal-light) !important; }

.caby-el-banner-section .elementor-widget-heading .elementor-heading-title {
  font-style: italic !important;
}

/* ── Focus cards on Strategic Plan ── */
.caby-el-focus-section .elementor-icon-box-wrapper {
  background: var(--white) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius-lg) !important;
  padding: 40px 32px !important;
  height: 100%;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}

.caby-el-focus-section .elementor-icon-box-wrapper::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--navy), var(--teal));
}

.caby-el-focus-section .elementor-icon-box-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg) !important;
  border-color: rgba(0,180,216,.2) !important;
}

/* ── Monitoring section image ── */
.caby-el-monitoring-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
  height: 420px !important;
  object-fit: cover !important;
  object-position: center top;
  transition: transform 0.7s ease !important;
}

.caby-el-monitoring-section .elementor-widget-image img:hover { transform: scale(1.03); }

.caby-el-monitoring-section .elementor-icon-list-icon i { color: var(--green) !important; }
.caby-el-monitoring-section .elementor-icon-list-text { color: var(--gray-700) !important; font-size: 15px !important; }

/* ════════════════════════════════════════════════════════
   29b. ELEMENTOR ABOUT US — DESIGN POLISH
   (Floating shapes, photo frames, vision rings, general lift)
   ════════════════════════════════════════════════════════ */

/* Hero: animated floating blobs via pseudo-elements */
.caby-el-hero-section { position: relative; overflow: hidden; }
.caby-el-hero-section::before {
  content: '';
  position: absolute;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: var(--teal);
  opacity: .07;
  top: -130px; right: -110px;
  animation: auFloat 9s ease-in-out infinite;
  z-index: 0; pointer-events: none;
}
.caby-el-hero-section::after {
  content: '';
  position: absolute;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: var(--green);
  opacity: .06;
  bottom: 70px; left: 4%;
  animation: auFloat 12s ease-in-out infinite;
  animation-delay: 3.5s;
  z-index: 0; pointer-events: none;
}
/* keep content above blobs */
.caby-el-hero-section .elementor-container { position: relative; z-index: 2; }

/* Who We Are: photo frame with teal accent block */
.caby-el-who-section .elementor-widget-image { position: relative; }
.caby-el-who-section .elementor-widget-image::before {
  content: '';
  position: absolute;
  width: 80%; height: 80%;
  background: linear-gradient(135deg, var(--teal), var(--navy));
  bottom: -22px; right: -22px;
  z-index: -1;
  border-radius: var(--radius-lg);
  opacity: .18;
}
.caby-el-who-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
  transition: transform 0.7s ease !important;
}
.caby-el-who-section .elementor-widget-image img:hover { transform: scale(1.02); }

/* Vision rings widget wrapper */
.caby-au-vision-rings {
  position: relative;
  width: 340px; height: 340px;
  margin: 0 auto;
}

/* Impact strip counter alignment */
.caby-el-impact-strip .elementor-column { display: flex; align-items: center; }

/* Stats strip: counter number size */
.caby-el-stats-strip .elementor-counter-number-wrapper {
  display: flex; align-items: baseline; justify-content: center; gap: 2px;
}

/* Image polish: research, advocacy, monitoring photos */
.caby-el-objectives-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
  transition: transform 0.7s ease !important;
  height: 480px !important;
  object-fit: cover !important;
  object-position: center top;
}
.caby-el-objectives-section .elementor-widget-image img:hover { transform: scale(1.03); }

/* Team section: image polish already in Section 29 — add name/role polish */
.caby-el-team-section .elementor-widget-heading .elementor-heading-title {
  margin-top: 12px !important;
}

/* Approach cards: icon circle */
.caby-el-approach-section .elementor-icon {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark)) !important;
  border-radius: 50% !important;
  width: 60px !important; height: 60px !important;
  display: flex !important; align-items: center; justify-content: center;
  box-shadow: 0 8px 24px rgba(0,180,216,.3) !important;
  margin-bottom: 8px;
}
.caby-el-approach-section .elementor-icon i { color: #fff !important; font-size: 22px !important; }

/* Mission section icon circle */
.caby-el-mission-section .elementor-icon {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark)) !important;
  border-radius: 50% !important;
  width: 64px !important; height: 64px !important;
  display: flex !important; align-items: center; justify-content: center;
  box-shadow: 0 8px 24px rgba(0,180,216,.35) !important;
}
.caby-el-mission-section .elementor-icon i { font-size: 24px !important; }

/* Values section: enhance card top accent */
.caby-el-values-section .elementor-icon {
  background: linear-gradient(135deg, rgba(0,180,216,.15), rgba(0,180,216,.05)) !important;
  border-radius: 50% !important;
  width: 64px !important; height: 64px !important;
  display: flex !important; align-items: center; justify-content: center;
  border: 1px solid rgba(0,180,216,.25) !important;
  margin-bottom: 8px;
}

/* Focus section icon circle */
.caby-el-focus-section .elementor-icon {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark)) !important;
  border-radius: 50% !important;
  width: 60px !important; height: 60px !important;
  display: flex !important; align-items: center; justify-content: center;
  box-shadow: 0 8px 24px rgba(0,180,216,.25) !important;
}
.caby-el-focus-section .elementor-icon i { color: #fff !important; font-size: 22px !important; }

/* CTA section: light blob */
.caby-el-cta-section::after {
  content: '';
  position: absolute;
  bottom: -100px; left: 50%; transform: translateX(-50%);
  width: 700px; height: 700px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(0,180,216,.07) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Text visibility in dark-background sections (About Us + Strategic Plan) ──
   Sections with bg=#071042 or bg-image+overlay have no inline text colors set,
   so text inherits the light body color and becomes invisible. Force white/light. */

/* Body text in dark sections */
.caby-el-values-section  .elementor-text-editor *,
.caby-el-mission-section .elementor-text-editor *,
.caby-el-context-section .elementor-text-editor *,
.caby-el-axes-section    .elementor-text-editor *,
.caby-el-impact-section  .elementor-text-editor *,
.caby-el-banner-section  .elementor-text-editor *,
.caby-el-cta-section     .elementor-text-editor * { color: rgba(255,255,255,.82) !important; }

/* Headings inside text-editors → pure white */
.caby-el-values-section  .elementor-text-editor h2,
.caby-el-values-section  .elementor-text-editor h3,
.caby-el-mission-section .elementor-text-editor h2,
.caby-el-mission-section .elementor-text-editor h3,
.caby-el-context-section .elementor-text-editor h2,
.caby-el-context-section .elementor-text-editor h3,
.caby-el-axes-section    .elementor-text-editor h2,
.caby-el-axes-section    .elementor-text-editor h3,
.caby-el-impact-section  .elementor-text-editor h2,
.caby-el-impact-section  .elementor-text-editor h3,
.caby-el-cta-section     .elementor-text-editor h2,
.caby-el-cta-section     .elementor-text-editor h3,
.caby-el-cta-section     .elementor-text-editor h4 { color: #ffffff !important; }

/* Standalone heading widgets in dark sections */
.caby-el-values-section  .elementor-heading-title,
.caby-el-mission-section .elementor-heading-title,
.caby-el-context-section .elementor-heading-title,
.caby-el-axes-section    .elementor-heading-title,
.caby-el-impact-section  .elementor-heading-title,
.caby-el-cta-section     .elementor-heading-title { color: #ffffff !important; }

/* Section tags in dark sections → teal pill (restore from dark override) */
.caby-el-values-section  .caby-sp-section-tag,
.caby-el-mission-section .caby-sp-section-tag,
.caby-el-context-section .caby-sp-section-tag,
.caby-el-axes-section    .caby-sp-section-tag,
.caby-el-impact-section  .caby-sp-section-tag,
.caby-el-cta-section     .caby-sp-section-tag {
  color: #40D0F0 !important;
  background: rgba(0,180,216,.14) !important;
  border-color: rgba(0,180,216,.3) !important;
}

/* Icon-box text in dark sections (mission, values, context, axes) */
.caby-el-values-section  .elementor-icon-box-title *,
.caby-el-mission-section .elementor-icon-box-title *,
.caby-el-context-section .elementor-icon-box-title * { color: #ffffff !important; }
.caby-el-values-section  .elementor-icon-box-description,
.caby-el-mission-section .elementor-icon-box-description,
.caby-el-context-section .elementor-icon-box-description { color: rgba(255,255,255,.62) !important; }

/* CTA buttons stay styled via inline HTML — just ensure link text is visible */
.caby-el-cta-section .elementor-text-editor a { opacity: 1; }

/* ── Explicit section backgrounds (CSS-class driven, independent of Elementor cache) ──
   Without this, sections may render transparent if Elementor's element-ID CSS hasn't
   been regenerated yet (e.g. after a cache clear via CLI). */

/* Dark navy sections */
.caby-el-stats-strip     { background-color: #040d42 !important; }
.caby-el-values-section  { background-color: var(--navy-dark) !important; }
.caby-el-context-section { background-color: var(--navy-dark) !important; }
.caby-el-axes-section    { background-color: var(--navy-dark) !important; }
.caby-el-impact-section  { background-color: var(--navy-dark) !important; }

/* CTA section: match footer exactly — navy-dark bg + teal gradient top accent */
.caby-el-cta-section {
  background-color: var(--navy-dark) !important;
  position: relative;
  overflow: hidden;
}
.caby-el-cta-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  width: 100%; height: 4px;
  background: linear-gradient(90deg, var(--teal) 0%, var(--navy-mid) 50%, var(--green) 100%);
  border-radius: 0;
  transform: none;
  bottom: auto;
  z-index: 1;
}

/* Light sections */
.caby-el-who-section        { background-color: #ffffff !important; }
.caby-el-vision-section     { background-color: #ffffff !important; }
.caby-el-team-section       { background-color: #ffffff !important; }
.caby-el-focus-section      { background-color: #ffffff !important; }
.caby-el-objectives-section { background-color: #f8f9fa !important; }
.caby-el-approach-section   { background-color: #f8f9fa !important; }
.caby-el-themes-section     { background-color: #f8f9fa !important; }

/* Teal impact strip */
.caby-el-impact-strip {
  background: linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%) !important;
}

/* ── Container: mirror .caby-wrap inside every caby-el section ── */
[class*="caby-el-"] > .elementor-container {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ════════════════════════════════════════════════════════
   30. HOME PAGE ARTISTIC ENHANCEMENTS
   ════════════════════════════════════════════════════════ */

/* ── Sina carousel slider ── */
body.home .sina_banner_slider .sina-slide-content-wrap {
  background: linear-gradient(120deg, rgba(7,16,66,.88) 0%, rgba(13,27,107,.7) 50%, rgba(0,127,160,.45) 100%) !important;
}

body.home .sina_banner_slider .sina-title h2,
body.home .sina_banner_slider .sina-title h1 {
  font-family: var(--font-head) !important;
  font-weight: 900 !important;
  text-shadow: 0 3px 24px rgba(0,0,0,.4) !important;
}

body.home .sina_banner_slider .sina-desc {
  font-family: var(--font-body) !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
  color: rgba(255,255,255,.85) !important;
}

body.home .sina_banner_slider .sina-btn-wrap .elementor-button,
body.home .sina_banner_slider a.elementor-button {
  border-radius: var(--radius-full) !important;
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
  padding: 14px 32px !important;
  box-shadow: 0 8px 28px rgba(0,180,216,.4) !important;
  transition: all var(--transition) !important;
}

body.home .sina_banner_slider a.elementor-button:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 40px rgba(0,180,216,.55) !important;
}

/* ── Home sections general ── */
body.home .elementor-section:not(:first-of-type) {
  position: relative;
}

/* Headings on home page */
body.home .elementor-widget-heading .elementor-heading-title {
  font-family: var(--font-head) !important;
  line-height: 1.2 !important;
}

/* Body text */
body.home .elementor-widget-text-editor p {
  font-family: var(--font-body) !important;
  line-height: 1.8 !important;
}

/* ── Home icon boxes ── */
body.home .elementor-icon-box-wrapper {
  border-radius: var(--radius-lg) !important;
  transition: all var(--transition) !important;
}

body.home .elementor-icon-box-wrapper:hover { transform: translateY(-6px); }

/* ── EAEL Info boxes ── */
body.home .eael-info-box {
  border-radius: var(--radius-lg) !important;
  overflow: hidden;
  transition: all var(--transition) !important;
  box-shadow: var(--shadow-sm) !important;
}

body.home .eael-info-box:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* ── Home buttons ── */
body.home .elementor-button {
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
  transition: all var(--transition) !important;
}

body.home .elementor-button:hover { transform: translateY(-2px) !important; }

/* ── Home images ── */
body.home .elementor-widget-image:not(.sina_banner_slider *) img {
  transition: transform 0.7s ease !important;
}

body.home .elementor-widget-image:not(.sina_banner_slider *):hover img { transform: scale(1.05); }

/* ── Section separators ── */
body.home .elementor-section + .elementor-section {
  position: relative;
}

/* ── Make dark navy sections artistic ── */
body.home .elementor-section[data-settings*='"background_color":"#0D1B6B"'],
body.home .elementor-section[data-settings*='"background_color":"#071042"'] {
  position: relative;
  overflow: hidden;
}

/* Subtle teal glow at bottom of dark sections */
body.home .elementor-section[style*="background-color: rgb(7, 16, 66)"]::after,
body.home .elementor-section[style*="background-color: rgb(13, 27, 107)"]::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 600px; height: 300px;
  background: radial-gradient(ellipse, rgba(0,180,216,.07) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Sina blog post cards ── */
body.home .sina-blogpost .sina-post-content {
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  box-shadow: 0 4px 24px rgba(13,27,107,.09) !important;
  border: 1px solid rgba(13,27,107,.06) !important;
  transition: all var(--transition) !important;
}

body.home .sina-blogpost .sina-post-content:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--shadow-lg) !important;
}

body.home .sina-blogpost .sina-post-img { overflow: hidden !important; }
body.home .sina-blogpost .sina-post-img img { transition: transform 0.7s ease !important; }
body.home .sina-blogpost .sina-post-content:hover .sina-post-img img { transform: scale(1.07) !important; }

/* ── Section top-line accent for key sections ── */
.caby-el-who-section::before,
.caby-el-focus-section::before,
.caby-el-approach-section::before,
.caby-el-team-section::before,
.caby-el-objectives-section::before,
.caby-el-themes-section::before,
.caby-el-monitoring-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--teal) 0%, rgba(0,180,216,.0) 100%);
}

.caby-el-who-section,
.caby-el-focus-section,
.caby-el-approach-section,
.caby-el-team-section,
.caby-el-objectives-section,
.caby-el-themes-section,
.caby-el-monitoring-section { position: relative; }

/* ════════════════════════════════════════════════════════
   27. ABOUT US PAGE
   ════════════════════════════════════════════════════════ */

/* ── Hero ── */
.caby-au-hero {
  min-height: 640px;
  background-image: var(--au-hero-img);
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}

.caby-au-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(150deg, rgba(7,16,66,.93) 0%, rgba(13,27,107,.80) 50%, rgba(0,127,160,.55) 100%);
  z-index: 1;
}

.caby-au-hero-shapes { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.caby-au-shape {
  position: absolute;
  border-radius: 50%;
  opacity: .06;
  animation: auFloat 9s ease-in-out infinite;
}
.au-s1 { width: 500px; height: 500px; background: var(--teal); top: -120px; right: -100px; animation-delay: 0s; }
.au-s2 { width: 280px; height: 280px; background: var(--green); bottom: 80px; left: 5%; animation-delay: 3.5s; }
.au-s3 { width: 160px; height: 160px; background: var(--white); top: 40%; right: 30%; animation-delay: 6s; }
@keyframes auFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-26px) scale(1.05); }
}

.caby-au-hero-content {
  position: relative;
  z-index: 2;
  padding-top: 120px;
  padding-bottom: 60px;
  max-width: 780px;
}

.caby-au-hero-title {
  font-family: var(--font-head) !important;
  font-size: clamp(2.6rem, 5.5vw, 4.2rem) !important;
  font-weight: 900 !important;
  color: var(--white) !important;
  line-height: 1.08 !important;
  margin: 16px 0 22px !important;
  text-shadow: 0 3px 20px rgba(0,0,0,.35);
}

.caby-au-hero-title em { font-style: normal; color: var(--teal-light); }

.caby-au-hero-sub {
  color: rgba(255,255,255,.78);
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 32px;
  max-width: 640px;
}

.caby-au-hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }

.caby-au-hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 30px;
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all var(--transition);
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  color: var(--white) !important;
  box-shadow: 0 6px 24px rgba(0,180,216,.4);
}

.caby-au-hero-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 36px rgba(0,180,216,.5);
  color: var(--white) !important;
}

.caby-au-hero-btn--ghost {
  background: rgba(255,255,255,.10);
  border: 2px solid rgba(255,255,255,.28);
  box-shadow: none;
  backdrop-filter: blur(6px);
}

.caby-au-hero-btn--ghost:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.55);
  box-shadow: none;
}

/* Hero bottom stat strip */
.caby-au-hero-stats {
  position: relative;
  z-index: 2;
  background: rgba(7,16,66,.80);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(0,180,216,.2);
}

.caby-au-hero-stats-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 0;
}

.caby-au-hstat {
  padding: 24px 20px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,.07);
}
.caby-au-hstat:last-child { border-right: none; }

.caby-au-hstat span {
  display: block;
  font-family: var(--font-head);
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  font-weight: 900;
  color: var(--teal-light);
  line-height: 1;
  margin-bottom: 5px;
}

.caby-au-hstat em {
  display: block;
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-family: var(--font-head);
}

/* ── Who We Are ── */
.caby-au-who { padding: 104px 0; background: var(--white); }

.caby-au-who-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 80px;
  align-items: center;
}

/* Photo frame with decorative accent */
.caby-au-photo-wrap {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: visible;
}

.caby-au-photo-wrap img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  display: block;
  box-shadow: var(--shadow-xl);
  position: relative;
  z-index: 2;
  transition: transform 0.8s ease;
}

.caby-au-photo-wrap:hover img { transform: scale(1.02); }

/* Decorative offset accent square */
.caby-au-photo-accent {
  position: absolute;
  bottom: -20px;
  left: -20px;
  width: 55%;
  height: 55%;
  background: linear-gradient(135deg, var(--teal), var(--navy));
  border-radius: var(--radius-lg);
  z-index: 1;
  opacity: .18;
}

/* Floating badge */
.caby-au-photo-tag {
  position: absolute;
  top: 28px;
  right: -24px;
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: var(--shadow-md);
  z-index: 3;
  border-left: 4px solid var(--teal);
}

.caby-au-photo-tag i { font-size: 22px; color: var(--teal); }
.caby-au-photo-tag strong { display: block; font-family: var(--font-head); font-size: 15px; color: var(--navy); font-weight: 800; }
.caby-au-photo-tag span { display: block; font-size: 12px; color: var(--gray-500); font-weight: 500; }

.caby-au-who-text .caby-sp-section-tag { margin-bottom: 18px; }

.caby-au-who-text h2 { font-size: clamp(1.8rem, 3vw, 2.5rem) !important; margin-bottom: 20px !important; }

.caby-au-who-text p { color: var(--gray-500); font-size: 16px; line-height: 1.85; margin-bottom: 16px; }

.caby-au-who-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.caby-au-who-badges span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 18px;
  background: var(--light);
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 600;
  color: var(--navy);
  transition: all var(--transition);
}

.caby-au-who-badges span:hover { background: var(--navy); color: var(--white); }
.caby-au-who-badges i { color: var(--teal); font-size: 12px; }
.caby-au-who-badges span:hover i { color: var(--teal-light); }

/* ── Mission Section ── */
.caby-au-mission {
  padding: 104px 0;
  position: relative;
  overflow: hidden;
  background: var(--navy-dark);
}

.caby-au-mission-bg {
  position: absolute;
  inset: 0;
  background-image: var(--au-mission-img);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.caby-au-mission-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(7,16,66,.94) 0%, rgba(13,27,107,.88) 60%, rgba(0,127,160,.75) 100%);
}

.caby-au-mission-inner { position: relative; z-index: 2; }

.caby-au-mission-head { text-align: center; margin-bottom: 56px; }
.caby-au-mission-head h2 { color: var(--white) !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; margin-bottom: 14px !important; }
.caby-au-mission-head p { color: rgba(255,255,255,.65); font-size: 17px; max-width: 580px; margin: 0 auto; }

.caby-au-mission-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.caby-au-mission-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-align: center;
  transition: all var(--transition);
  position: relative;
  overflow: hidden;
}

.caby-au-mission-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--teal), var(--green));
}

.caby-au-mission-card:hover {
  background: rgba(255,255,255,.11);
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(0,0,0,.4);
}

.caby-au-mc-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 22px;
  color: var(--white);
  box-shadow: 0 8px 24px rgba(0,180,216,.35);
  transition: transform var(--transition);
}

.caby-au-mission-card:hover .caby-au-mc-icon { transform: scale(1.15) rotate(8deg); }

.caby-au-mission-card h4 { color: var(--white) !important; font-size: 1.05rem !important; margin-bottom: 12px !important; }
.caby-au-mission-card p { color: rgba(255,255,255,.55); font-size: 14px; line-height: 1.7; margin: 0; }

/* ── Impact Strip ── */
.caby-au-impact-strip {
  background: linear-gradient(90deg, var(--teal-dark) 0%, var(--teal) 50%, var(--navy-mid) 100%);
  padding: 56px 0;
}

.caby-au-impact-inner {
  display: flex;
  align-items: center;
  gap: 64px;
  flex-wrap: wrap;
}

.caby-au-impact-text { flex: 1; min-width: 280px; }
.caby-au-impact-text h3 { color: var(--white) !important; font-size: clamp(1.4rem, 2.5vw, 1.9rem) !important; margin-bottom: 10px !important; }
.caby-au-impact-text p { color: rgba(255,255,255,.78); font-size: 15px; line-height: 1.7; margin: 0; }

.caby-au-impact-stats {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}

.caby-au-istat { text-align: center; }

.caby-au-istat strong {
  display: block;
  font-family: var(--font-head);
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1;
  margin-bottom: 6px;
}

.caby-au-istat span {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: rgba(255,255,255,.65);
  font-family: var(--font-head);
  max-width: 120px;
  display: block;
}

/* ── Vision ── */
.caby-au-vision { padding: 104px 0; background: var(--white); }

.caby-au-vision-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: center;
}

.caby-au-vision-text .caby-sp-section-tag { margin-bottom: 18px; }
.caby-au-vision-text h2 { font-size: clamp(1.8rem, 3vw, 2.4rem) !important; margin-bottom: 18px !important; }
.caby-au-vision-text p { color: var(--gray-500); font-size: 16px; line-height: 1.85; margin-bottom: 28px; }

.caby-au-vision-quote {
  padding: 24px 28px;
  background: var(--teal-ultra);
  border-left: 4px solid var(--teal);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-style: italic;
  color: var(--navy);
  font-size: 16px;
  line-height: 1.75;
  margin: 0;
  position: relative;
}

.caby-au-vision-quote i { color: var(--teal); margin-right: 8px; opacity: .6; }

/* Vision rings diagram */
.caby-au-vision-visual { display: flex; justify-content: center; }

.caby-au-vision-rings { position: relative; width: 340px; height: 340px; }

.caby-au-vring {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: ringPulse 4s ease-in-out infinite;
}

.caby-au-vring--outer {
  width: 340px; height: 340px;
  border: 2px solid rgba(0,180,216,.15);
  animation-delay: 0s;
}

.caby-au-vring--mid {
  width: 240px; height: 240px;
  border: 2px solid rgba(0,180,216,.25);
  background: rgba(0,180,216,.04);
  animation-delay: 0.5s;
}

.caby-au-vring--inner {
  width: 140px; height: 140px;
  background: linear-gradient(135deg, var(--navy), var(--navy-mid));
  border: none;
  box-shadow: 0 0 60px rgba(13,27,107,.35), inset 0 0 40px rgba(0,180,216,.15);
  font-size: 52px;
  color: var(--teal);
  animation-delay: 1s;
}

@keyframes ringPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.03); }
}

/* Orbiting word labels */
.caby-au-vision-words {
  position: absolute;
  inset: 0;
  animation: wordsRotate 20s linear infinite;
}

.caby-au-vision-words span {
  position: absolute;
  top: 50%;
  left: 50%;
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--teal);
  background: var(--white);
  border: 1px solid rgba(0,180,216,.3);
  padding: 4px 12px;
  border-radius: var(--radius-full);
  transform-origin: 0 0;
  transform: rotate(var(--a)) translateX(155px) rotate(calc(-1 * var(--a)));
  white-space: nowrap;
}

@keyframes wordsRotate { to { transform: rotate(360deg); } }

/* ── Core Values ── */
.caby-au-values {
  padding: 104px 0;
  background: var(--navy);
  position: relative;
  overflow: hidden;
}

.caby-au-values-bg {
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%2300B4D8' fill-opacity='0.04'%3E%3Cpath d='M0 0h40v40H0V0zm40 40h40v40H40V40z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.caby-au-values-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.caby-au-value-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  padding: 40px 28px 32px;
  position: relative;
  overflow: hidden;
  transition: all var(--transition);
}

.caby-au-value-card:hover {
  background: rgba(255,255,255,.09);
  transform: translateY(-8px);
  border-color: rgba(0,180,216,.3);
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}

.caby-au-vc-num {
  position: absolute;
  top: 12px;
  right: 18px;
  font-family: var(--font-head);
  font-size: 56px;
  font-weight: 900;
  color: rgba(255,255,255,.04);
  line-height: 1;
}

.caby-au-vc-icon {
  width: 60px;
  height: 60px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--white);
  margin-bottom: 22px;
  box-shadow: 0 8px 24px rgba(0,180,216,.35);
  transition: transform var(--transition);
}

.caby-au-value-card:hover .caby-au-vc-icon { transform: rotate(8deg) scale(1.1); }

.caby-au-value-card h3 { color: var(--white) !important; font-size: 1.2rem !important; margin-bottom: 12px !important; }
.caby-au-value-card p { color: rgba(255,255,255,.5); font-size: 14px; line-height: 1.75; margin-bottom: 20px; }

.caby-au-vc-bar {
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--teal) 0%, rgba(0,180,216,.1) 100%);
  width: 40%;
  transition: width var(--transition);
}

.caby-au-value-card:hover .caby-au-vc-bar { width: 70%; }

/* ── Our Approach ── */
.caby-au-approach { padding: 104px 0; background: var(--gray-50); }

.caby-au-approach-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
}

.caby-au-approach-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-right: none;
  padding: 44px 36px;
  position: relative;
  transition: all var(--transition);
  overflow: hidden;
}

.caby-au-approach-card:last-child { border-right: 1px solid var(--gray-200); }
.caby-au-approach-card:first-child { border-radius: var(--radius-lg) 0 0 var(--radius-lg); }
.caby-au-approach-card:last-child { border-radius: 0 var(--radius-lg) var(--radius-lg) 0; }

.caby-au-approach-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--teal), var(--navy));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.caby-au-approach-card:hover::before { transform: scaleX(1); }
.caby-au-approach-card:hover { box-shadow: var(--shadow-lg); z-index: 2; transform: translateY(-4px); }

.caby-au-appr-step {
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--teal);
  margin-bottom: 18px;
}

.caby-au-appr-icon {
  width: 68px;
  height: 68px;
  border-radius: var(--radius-md);
  background: var(--light);
  border: 2px solid var(--gray-200);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: var(--navy);
  margin-bottom: 22px;
  transition: all var(--transition);
}

.caby-au-approach-card:hover .caby-au-appr-icon {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white);
  transform: rotate(-5deg);
}

.caby-au-approach-card h4 { font-size: 1.15rem !important; margin-bottom: 14px !important; }
.caby-au-approach-card p { color: var(--gray-500); font-size: 15px; line-height: 1.8; margin: 0; }

/* Connector arrow between cards */
.caby-au-appr-connector {
  position: absolute;
  right: -16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 32px;
  height: 32px;
  background: var(--teal);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-size: 11px;
  box-shadow: 0 4px 12px rgba(0,180,216,.4);
}

/* ── Photo Parallax Strip ── */
.caby-au-photo-strip {
  height: 400px;
  background-image: var(--au-strip-img);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
  display: flex;
  align-items: center;
}

.caby-au-photo-strip-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(7,16,66,.90) 0%, rgba(0,127,160,.70) 100%);
}

.caby-au-strip-content {
  position: relative;
  z-index: 2;
  max-width: 680px;
}

.caby-au-strip-quote-icon { font-size: 40px; color: var(--teal); opacity: .6; margin-bottom: 14px; display: block; }

.caby-au-strip-content h3 {
  color: var(--white) !important;
  font-size: clamp(1.4rem, 2.8vw, 2rem) !important;
  font-style: italic;
  line-height: 1.4 !important;
  margin-bottom: 14px !important;
}

.caby-au-strip-content p { color: rgba(255,255,255,.65); font-size: 15px; margin: 0; font-family: var(--font-head); font-weight: 600; letter-spacing: .03em; }

/* ── Team ── */
.caby-au-team { padding: 104px 0; background: var(--white); }

.caby-au-team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.caby-au-team-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  transition: all var(--transition);
}

.caby-au-team-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); border-color: rgba(0,180,216,.15); }

.caby-au-team-photo {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 4;
}

.caby-au-team-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.8s ease;
}

.caby-au-team-card:hover .caby-au-team-photo img { transform: scale(1.07); }

.caby-au-team-photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(7,16,66,.85) 0%, rgba(7,16,66,.1) 60%, transparent 100%);
  opacity: 0;
  transition: opacity var(--transition);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 24px;
}

.caby-au-team-card:hover .caby-au-team-photo-overlay { opacity: 1; }

.caby-au-team-social { display: flex; gap: 10px; }

.caby-au-team-social a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.25);
  color: var(--white) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  transition: all var(--transition);
  backdrop-filter: blur(4px);
}

.caby-au-team-social a:hover { background: var(--teal); border-color: var(--teal); transform: translateY(-3px); }

.caby-au-team-info { padding: 24px 26px; background: var(--white); }

.caby-au-team-info h4 { font-size: 1.1rem !important; margin-bottom: 4px !important; color: var(--navy) !important; }

.caby-au-team-role {
  display: inline-block;
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--teal);
  margin-bottom: 12px;
}

.caby-au-team-info p { color: var(--gray-500); font-size: 14px; line-height: 1.7; margin: 0; }

/* ── CTA Section ── */
.caby-au-cta {
  padding: 104px 0;
  background: var(--navy-dark);
  position: relative;
  overflow: hidden;
}

.caby-au-cta-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 90% at 50% 110%, rgba(0,180,216,.10) 0%, transparent 60%);
  pointer-events: none;
}

.caby-au-cta-inner { position: relative; z-index: 1; }

.caby-au-cta-text { max-width: 620px; margin-bottom: 56px; }
.caby-au-cta-text h2 { color: var(--white) !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; margin-bottom: 16px !important; }
.caby-au-cta-text p { color: rgba(255,255,255,.65); font-size: 17px; line-height: 1.75; }

.caby-au-cta-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.caby-au-cta-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--radius-lg);
  padding: 40px 32px;
  transition: all var(--transition);
  position: relative;
  overflow: hidden;
}

.caby-au-cta-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--teal), var(--green));
}

.caby-au-cta-card:hover { background: rgba(255,255,255,.10); transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,.35); }

.caby-au-cta-card--accent {
  background: linear-gradient(160deg, var(--teal-dark), var(--teal));
  border-color: transparent;
}

.caby-au-cta-card--accent::before { background: rgba(255,255,255,.3); }
.caby-au-cta-card--accent:hover { background: linear-gradient(160deg, var(--teal), var(--teal-light)); }

.caby-au-cta-card > i {
  font-size: 36px;
  color: var(--teal);
  margin-bottom: 18px;
  display: block;
  transition: transform var(--transition);
}

.caby-au-cta-card--accent > i { color: var(--white); }
.caby-au-cta-card:hover > i { transform: scale(1.15) rotate(5deg); }

.caby-au-cta-card h4 { color: var(--white) !important; font-size: 1.15rem !important; margin-bottom: 10px !important; }
.caby-au-cta-card p { color: rgba(255,255,255,.6); font-size: 14px; line-height: 1.7; margin-bottom: 22px; }

.caby-au-cta-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 700;
  color: var(--teal-light) !important;
  text-decoration: none;
  transition: gap var(--transition), color var(--transition);
}

.caby-au-cta-card--accent .caby-au-cta-link { color: rgba(255,255,255,.9) !important; }
.caby-au-cta-link i { transition: transform var(--transition); }
.caby-au-cta-link:hover { gap: 12px; color: var(--white) !important; }
.caby-au-cta-link:hover i { transform: translateX(4px); }

/* ── ABOUT US RESPONSIVE ── */
@media (max-width: 1200px) {
  .caby-au-mission-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-au-values-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1024px) {
  .caby-au-who-grid { grid-template-columns: 1fr; gap: 60px; }
  .caby-au-photo-wrap img { height: 420px; }
  .caby-au-photo-tag { right: 16px; }
  .caby-au-vision-grid { grid-template-columns: 1fr; }
  .caby-au-vision-visual { margin-top: 40px; }
  .caby-au-approach-grid { grid-template-columns: 1fr; }
  .caby-au-approach-card { border-right: 1px solid var(--gray-200); border-bottom: none; border-radius: 0; }
  .caby-au-approach-card:first-child { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
  .caby-au-approach-card:last-child { border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
  .caby-au-appr-connector { display: none; }
  .caby-au-team-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-au-cta-cards { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .caby-au-hero-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .caby-au-mission-grid { grid-template-columns: 1fr; }
  .caby-au-values-grid { grid-template-columns: 1fr; }
  .caby-au-impact-inner { flex-direction: column; gap: 36px; }
  .caby-au-team-grid { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
  .caby-au-photo-strip { background-attachment: scroll; height: auto; padding: 64px 0; }
  .caby-au-vision-rings { width: 260px; height: 260px; }
  .caby-au-vring--outer { width: 260px; height: 260px; }
  .caby-au-vring--mid { width: 180px; height: 180px; }
  .caby-au-vring--inner { width: 100px; height: 100px; font-size: 36px; }
  .caby-au-vision-words span { transform: rotate(var(--a)) translateX(115px) rotate(calc(-1 * var(--a))); }
}

@media (max-width: 600px) {
  .caby-au-hero-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .caby-au-hero-actions { flex-direction: column; }
  .caby-au-impact-stats { flex-direction: column; gap: 24px; }
}

/* ════════════════════════════════════════════════════════
   28. STRATEGIC PLAN PAGE
   ════════════════════════════════════════════════════════ */

/* ── Hero ── */
.caby-sp-hero {
  min-height: 620px;
  background-image: var(--sp-hero-img);
  background-size: cover;
  background-position: center top;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding-bottom: 0;
}

.caby-sp-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(7,16,66,.92) 0%,
    rgba(13,27,107,.85) 45%,
    rgba(0,127,160,.60) 100%
  );
  z-index: 1;
}

/* Floating decorative shapes */
.caby-sp-hero-shapes { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.caby-sp-shape {
  position: absolute;
  border-radius: 50%;
  opacity: .06;
  animation: spFloat 10s ease-in-out infinite;
}
.caby-sp-shape.s1 { width: 420px; height: 420px; background: var(--teal); top: -100px; right: -80px; animation-delay: 0s; }
.caby-sp-shape.s2 { width: 260px; height: 260px; background: var(--green); bottom: 60px; left: 8%; animation-delay: 4s; }
.caby-sp-shape.s3 { width: 180px; height: 180px; background: var(--white); top: 35%; right: 25%; animation-delay: 7s; }
@keyframes spFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-24px) rotate(5deg); }
}

.caby-sp-hero-inner {
  position: relative;
  z-index: 2;
  padding-top: 110px;
  padding-bottom: 56px;
}

.caby-sp-hero-text { max-width: 720px; }

.caby-sp-hero-title {
  font-family: var(--font-head) !important;
  font-size: clamp(2.4rem, 5.5vw, 4rem) !important;
  font-weight: 900 !important;
  color: var(--white) !important;
  line-height: 1.08 !important;
  margin: 16px 0 20px !important;
  text-shadow: 0 3px 20px rgba(0,0,0,.35);
}

.caby-sp-hero-title em {
  font-style: normal;
  color: var(--teal-light);
  display: block;
}

.caby-sp-hero-sub {
  color: rgba(255,255,255,.82);
  font-size: 19px;
  line-height: 1.6;
  margin-bottom: 24px;
}

.caby-sp-hero-focus {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
}

.caby-sp-hero-focus span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.20);
  color: rgba(255,255,255,.88);
  padding: 7px 16px;
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 600;
  backdrop-filter: blur(6px);
}

.caby-sp-hero-focus i { color: var(--teal-light); }

/* Hero stat strip (at bottom, inside .caby-wrap) */
.caby-sp-hero-stats {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: rgba(7,16,66,.75);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(0,180,216,.25);
}

.caby-sp-stat {
  padding: 26px 20px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,.08);
}
.caby-sp-stat:last-child { border-right: none; }

.caby-sp-stat-num {
  display: block;
  font-family: var(--font-head);
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 900;
  color: var(--teal-light);
  line-height: 1;
  margin-bottom: 6px;
}

.caby-sp-stat-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,.55);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-family: var(--font-head);
}

/* ── Vision Quote Strip ── */
.caby-sp-quote-strip {
  background: linear-gradient(90deg, var(--navy) 0%, var(--navy-mid) 100%);
  padding: 56px 0;
}

.caby-sp-quote {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 28px;
  align-items: start;
  max-width: 860px;
  margin: 0 auto;
}

.caby-sp-quote-icon {
  font-size: 48px;
  color: var(--teal);
  opacity: .6;
  line-height: 1;
  margin-top: -8px;
}

.caby-sp-quote p {
  font-size: 20px;
  font-style: italic;
  color: rgba(255,255,255,.88);
  line-height: 1.75;
  margin-bottom: 12px;
}

.caby-sp-quote cite {
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 700;
  color: var(--teal);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-style: normal;
}

/* ── Section head shared ── */
.caby-sp-section-head {
  text-align: center;
  margin-bottom: 56px;
}

.caby-sp-section-head h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
  margin-bottom: 12px !important;
}

.caby-sp-section-head p {
  color: var(--gray-500);
  font-size: 17px;
  max-width: 600px;
  margin: 0 auto;
}

.caby-sp-section-head--light h2 { color: var(--white) !important; }
.caby-sp-section-head--light p { color: rgba(255,255,255,.65); }

.caby-sp-section-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(13,27,107,.07);
  border: 1px solid rgba(13,27,107,.12);
  color: var(--navy);
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  padding: 6px 16px;
  border-radius: var(--radius-full);
  margin-bottom: 18px;
}

.caby-sp-section-tag--teal {
  background: rgba(0,180,216,.12);
  border-color: rgba(0,180,216,.25);
  color: var(--teal);
}

/* ── Intro Split ── */
.caby-sp-intro { padding: 96px 0; background: var(--white); }

.caby-sp-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: center;
}

.caby-sp-intro-text .caby-sp-section-tag { margin-bottom: 18px; }

.caby-sp-intro-text h2 {
  font-size: clamp(1.8rem, 3vw, 2.4rem) !important;
  margin-bottom: 20px !important;
}

.caby-sp-intro-text p { color: var(--gray-500); font-size: 16px; line-height: 1.8; margin-bottom: 16px; }

.caby-sp-intro-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.caby-sp-intro-tags span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 16px;
  background: var(--light);
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 13px;
  font-weight: 600;
  color: var(--navy);
}

.caby-sp-intro-tags i { color: var(--green); }

/* Photo frame with floating badge */
.caby-sp-photo-frame {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-xl);
}

.caby-sp-photo-frame img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  display: block;
  border-radius: var(--radius-lg);
  transition: transform 0.8s ease;
}

.caby-sp-photo-frame:hover img { transform: scale(1.04); }

.caby-sp-photo-badge {
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  background: linear-gradient(90deg, var(--navy-dark), var(--navy));
  padding: 16px 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.caby-sp-photo-badge i { font-size: 20px; color: var(--teal); }
.caby-sp-photo-badge strong { font-size: 22px; font-family: var(--font-head); color: var(--white); font-weight: 800; }
.caby-sp-photo-badge span { font-size: 12px; color: rgba(255,255,255,.6); font-family: var(--font-head); text-transform: uppercase; letter-spacing: .06em; }

/* ── Context / Stats ── */
.caby-sp-context {
  padding: 96px 0;
  position: relative;
  background: var(--navy-dark);
  overflow: hidden;
}

.caby-sp-context-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 80% at 90% 50%, rgba(0,180,216,.08) 0%, transparent 60%),
    radial-gradient(ellipse 50% 70% at 5% 80%, rgba(76,175,80,.06) 0%, transparent 50%);
  pointer-events: none;
}

.caby-sp-context-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.caby-sp-ctx-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-align: center;
  transition: all var(--transition);
  position: relative;
  overflow: hidden;
}

.caby-sp-ctx-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--ctx-c, var(--teal));
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.caby-sp-ctx-card:hover {
  background: rgba(255,255,255,.09);
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,.3);
}

.caby-sp-ctx-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  border: 2px solid var(--ctx-c, var(--teal));
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 22px;
  color: var(--ctx-c, var(--teal));
  transition: all var(--transition);
}

.caby-sp-ctx-card:hover .caby-sp-ctx-icon {
  background: var(--ctx-c, var(--teal));
  color: var(--white);
  transform: rotateY(180deg);
}

.caby-sp-ctx-big {
  font-family: var(--font-head);
  font-size: clamp(2.4rem, 4vw, 3.4rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1;
  margin-bottom: 14px;
}

.caby-sp-ctx-big span {
  font-size: 60%;
  color: var(--ctx-c, var(--teal));
}

.caby-sp-ctx-card p {
  color: rgba(255,255,255,.55);
  font-size: 14px;
  line-height: 1.65;
  margin: 0;
}

/* ── Photo Banner ── */
.caby-sp-photo-banner {
  height: 420px;
  background-image: var(--sp-banner-img);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
  display: flex;
  align-items: center;
}

.caby-sp-photo-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(7,16,66,.88) 0%, rgba(0,127,160,.70) 100%);
}

.caby-sp-banner-text {
  position: relative;
  z-index: 2;
  max-width: 700px;
}

.caby-sp-banner-text h3 {
  color: var(--white) !important;
  font-size: clamp(1.4rem, 3vw, 2.1rem) !important;
  font-style: italic;
  line-height: 1.4 !important;
  margin-bottom: 18px !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.3);
}

.caby-sp-banner-text p { color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.7; margin: 0; }

/* ── Focus Areas ── */
.caby-sp-focus { padding: 96px 0; background: var(--white); }

.caby-sp-focus-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

.caby-sp-focus-card {
  padding: 40px 36px 36px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--gray-200);
  background: var(--white);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
  transition: all var(--transition);
}

.caby-sp-focus-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--navy), var(--teal));
}

.caby-sp-focus-card--featured {
  background: linear-gradient(160deg, var(--navy-dark) 0%, var(--navy) 100%);
  border-color: transparent;
  box-shadow: var(--shadow-lg);
  transform: translateY(-10px);
}

.caby-sp-focus-card--featured::before {
  background: linear-gradient(90deg, var(--teal), var(--teal-light));
}

.caby-sp-focus-card--featured h3,
.caby-sp-focus-card--featured p { color: rgba(255,255,255,.9) !important; }

.caby-sp-focus-card--featured .caby-sp-focus-list li { color: rgba(255,255,255,.75); }
.caby-sp-focus-card--featured .caby-sp-focus-list i { color: var(--teal-light); }

.caby-sp-focus-card:hover:not(.caby-sp-focus-card--featured) {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(0,180,216,.2);
}

.caby-sp-focus-art {
  width: 70px;
  height: 70px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  margin-bottom: 24px;
  transition: transform var(--transition);
}

.caby-sp-focus-art--navy { background: rgba(13,27,107,.08); color: var(--navy); }
.caby-sp-focus-art--teal { background: rgba(0,180,216,.12); color: var(--teal); }
.caby-sp-focus-art--green { background: rgba(76,175,80,.10); color: var(--green); }

.caby-sp-focus-card:hover .caby-sp-focus-art { transform: rotateY(180deg) scale(1.1); }

.caby-sp-focus-card h3 {
  font-size: 1.25rem !important;
  margin-bottom: 14px !important;
  color: var(--navy) !important;
}

.caby-sp-focus-card p { color: var(--gray-500); font-size: 15px; line-height: 1.75; margin-bottom: 22px; }

.caby-sp-focus-list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.caby-sp-focus-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: var(--gray-700);
  font-family: var(--font-body);
}

.caby-sp-focus-list li::before { display: none; }
.caby-sp-focus-list i { color: var(--green); font-size: 12px; flex-shrink: 0; }

/* ── Five-Axis Model ── */
.caby-sp-axes {
  padding: 96px 0;
  position: relative;
  background: var(--navy-dark);
  overflow: hidden;
}

.caby-sp-axes-bg {
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2300B4D8' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.caby-sp-axes-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.caby-sp-axis-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  padding: 32px 24px 28px;
  text-align: center;
  position: relative;
  transition: all var(--transition);
  overflow: hidden;
}

.caby-sp-axis-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 0;
  background: linear-gradient(to top, rgba(0,180,216,.15), transparent);
  transition: height 0.4s ease;
}

.caby-sp-axis-card:hover { background: rgba(255,255,255,.09); transform: translateY(-8px); border-color: rgba(0,180,216,.3); }
.caby-sp-axis-card:hover::after { height: 100%; }

.caby-sp-axis-num {
  font-family: var(--font-head);
  font-size: 52px;
  font-weight: 900;
  color: rgba(255,255,255,.04);
  line-height: 1;
  position: absolute;
  top: 8px;
  right: 16px;
}

.caby-sp-axis-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
  font-size: 20px;
  color: var(--white);
  box-shadow: 0 8px 24px rgba(0,180,216,.35);
  transition: transform var(--transition);
}

.caby-sp-axis-card:hover .caby-sp-axis-icon { transform: scale(1.15) rotate(5deg); }

.caby-sp-axis-card h4 {
  color: var(--white) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
  line-height: 1.35 !important;
}

.caby-sp-axis-card p {
  color: rgba(255,255,255,.5);
  font-size: 13px;
  line-height: 1.65;
  margin: 0;
}

/* ── Photo + Text Split Section ── */
.caby-sp-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 540px;
}

.caby-sp-split-photo {
  background-image: var(--sp-split-img);
  background-size: cover;
  background-position: center;
  position: relative;
}

.caby-sp-split-photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 60%, var(--white) 100%);
}

.caby-sp-split-text {
  background: var(--white);
  display: flex;
  align-items: center;
}

.caby-sp-split-text-inner {
  padding: 72px 64px;
}

.caby-sp-split-text-inner h2 {
  font-size: clamp(1.5rem, 2.8vw, 2.1rem) !important;
  margin-bottom: 20px !important;
}

.caby-sp-split-text-inner p { color: var(--gray-500); font-size: 16px; line-height: 1.8; margin-bottom: 14px; }

.caby-sp-split-stats {
  display: flex;
  gap: 32px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--gray-200);
}

.caby-sp-split-stats div { text-align: center; }

.caby-sp-split-stats strong {
  display: block;
  font-family: var(--font-head);
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--teal);
  line-height: 1;
  margin-bottom: 6px;
}

.caby-sp-split-stats span {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--gray-400);
  font-family: var(--font-head);
}

/* ── Strategic Objectives ── */
.caby-sp-objectives { padding: 96px 0; background: var(--gray-50); }

.caby-sp-obj-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.caby-sp-obj-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  display: flex;
  gap: 20px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  border-left: 4px solid var(--teal);
  transition: all var(--transition);
  align-items: flex-start;
}

.caby-sp-obj-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-left-color: var(--navy);
}

.caby-sp-obj-num {
  font-family: var(--font-head);
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--teal);
  line-height: 1;
  flex-shrink: 0;
  transition: color var(--transition);
}

.caby-sp-obj-card:hover .caby-sp-obj-num { color: var(--navy); }

.caby-sp-obj-body h4 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin-bottom: 10px !important;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.caby-sp-obj-body h4 i { color: var(--teal); font-size: 13px; }

.caby-sp-obj-body p { color: var(--gray-500); font-size: 14px; line-height: 1.7; margin-bottom: 14px; }

.caby-sp-obj-target {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 700;
  color: var(--teal-dark);
  font-family: var(--font-head);
  background: var(--teal-ultra);
  padding: 6px 12px;
  border-radius: var(--radius-sm);
}

.caby-sp-obj-target i { font-size: 11px; }

/* ── Impact Counters ── */
.caby-sp-impact {
  padding: 96px 0;
  position: relative;
  background: var(--navy);
  overflow: hidden;
}

.caby-sp-impact-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 15% 50%, rgba(76,175,80,.06) 0%, transparent 60%),
    radial-gradient(ellipse 50% 70% at 85% 50%, rgba(0,180,216,.08) 0%, transparent 55%);
  pointer-events: none;
}

.caby-sp-impact-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 32px;
  position: relative;
  z-index: 1;
}

.caby-sp-impact-item { text-align: center; }

.caby-sp-impact-ring {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
  position: relative;
  transition: all var(--transition);
  box-shadow: 0 0 0 8px rgba(255,255,255,.03);
}

.caby-sp-impact-ring::before {
  content: '';
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(13,27,107,.3);
}

.caby-sp-impact-ring--teal { border-color: rgba(0,180,216,.4); background: rgba(0,180,216,.08); }
.caby-sp-impact-ring--green { border-color: rgba(76,175,80,.4); background: rgba(76,175,80,.08); }

.caby-sp-impact-item:hover .caby-sp-impact-ring {
  transform: scale(1.08);
  box-shadow: 0 0 40px rgba(0,180,216,.25), 0 0 0 8px rgba(0,180,216,.05);
}

.caby-sp-impact-ring span {
  font-family: var(--font-head);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 900;
  color: var(--white);
}

.caby-sp-impact-item p {
  color: rgba(255,255,255,.55);
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0;
  font-family: var(--font-head);
}

/* ── Cross-Cutting Themes ── */
.caby-sp-themes { padding: 96px 0; background: var(--white); }

.caby-sp-themes-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.caby-sp-theme-card {
  padding: 40px 28px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--gray-200);
  text-align: center;
  transition: all var(--transition);
  position: relative;
  overflow: hidden;
}

.caby-sp-theme-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, var(--navy-dark), var(--navy));
  opacity: 0;
  transition: opacity var(--transition);
  z-index: 0;
}

.caby-sp-theme-card:hover { border-color: transparent; box-shadow: var(--shadow-lg); }
.caby-sp-theme-card:hover::after { opacity: 1; }
.caby-sp-theme-card:hover .caby-sp-theme-icon,
.caby-sp-theme-card:hover h4,
.caby-sp-theme-card:hover p { position: relative; z-index: 1; }
.caby-sp-theme-card:hover .caby-sp-theme-icon { background: rgba(0,180,216,.2) !important; color: var(--teal-light) !important; }
.caby-sp-theme-card:hover h4 { color: var(--white) !important; }
.caby-sp-theme-card:hover p { color: rgba(255,255,255,.65) !important; }

.caby-sp-theme-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--light);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 24px;
  color: var(--navy);
  transition: all var(--transition);
  position: relative;
  z-index: 1;
}

.caby-sp-theme-card h4 { font-size: 1.05rem !important; margin-bottom: 12px !important; position: relative; z-index: 1; transition: color var(--transition); }
.caby-sp-theme-card p { color: var(--gray-500); font-size: 14px; line-height: 1.7; margin: 0; position: relative; z-index: 1; transition: color var(--transition); }

/* ── Monitoring ── */
.caby-sp-monitoring {
  padding: 96px 0;
  background: var(--gray-50);
}

.caby-sp-monitoring-inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 72px;
  align-items: center;
}

.caby-sp-monitoring-text .caby-sp-section-tag { margin-bottom: 18px; }
.caby-sp-monitoring-text h2 { font-size: clamp(1.6rem, 3vw, 2.2rem) !important; margin-bottom: 16px !important; }
.caby-sp-monitoring-text p { color: var(--gray-500); font-size: 16px; line-height: 1.8; margin-bottom: 24px; }

.caby-sp-monitoring-list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.caby-sp-monitoring-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  color: var(--gray-700);
  line-height: 1.6;
}

.caby-sp-monitoring-list li::before { display: none; }
.caby-sp-monitoring-list i { color: var(--green); font-size: 15px; margin-top: 3px; flex-shrink: 0; }

.caby-sp-monitoring-photo {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-xl);
}

.caby-sp-monitoring-photo img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
  transition: transform 0.8s ease;
}

.caby-sp-monitoring-photo:hover img { transform: scale(1.04); }

/* ── CTA ── */
.caby-sp-cta {
  padding: 96px 0;
  position: relative;
  background: var(--navy-dark);
  overflow: hidden;
  text-align: center;
}

.caby-sp-cta-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 100% at 50% 100%, rgba(0,180,216,.12) 0%, transparent 60%);
  pointer-events: none;
}

.caby-sp-cta-inner { position: relative; z-index: 1; max-width: 680px; margin: 0 auto; }

.caby-sp-cta-icon {
  font-size: 56px;
  color: var(--teal);
  margin-bottom: 28px;
  display: block;
  animation: ctaPulse 3s ease-in-out infinite;
}

@keyframes ctaPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.1); opacity: .8; }
}

.caby-sp-cta-inner h2 {
  color: var(--white) !important;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
  margin-bottom: 18px !important;
}

.caby-sp-cta-inner p { color: rgba(255,255,255,.65); font-size: 17px; line-height: 1.75; margin-bottom: 40px; }

.caby-sp-cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

.caby-sp-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 36px;
  border-radius: var(--radius-full);
  font-family: var(--font-head);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: all var(--transition);
  letter-spacing: .02em;
}

.caby-sp-cta-btn--primary {
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  color: var(--white) !important;
  box-shadow: 0 8px 30px rgba(0,180,216,.4);
}

.caby-sp-cta-btn--primary:hover {
  background: linear-gradient(135deg, var(--teal-light), var(--teal));
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(0,180,216,.5);
  color: var(--white) !important;
}

.caby-sp-cta-btn--outline {
  background: transparent;
  color: var(--white) !important;
  border: 2px solid rgba(255,255,255,.3);
}

.caby-sp-cta-btn--outline:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.6);
  transform: translateY(-3px);
  color: var(--white) !important;
}

/* ── STRATEGIC PLAN RESPONSIVE ── */
@media (max-width: 1200px) {
  .caby-sp-axes-grid { grid-template-columns: repeat(3, 1fr); }
  .caby-sp-context-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-impact-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 1024px) {
  .caby-sp-intro-grid { grid-template-columns: 1fr; gap: 48px; }
  .caby-sp-photo-frame img { height: 380px; }
  .caby-sp-focus-grid { grid-template-columns: 1fr; }
  .caby-sp-focus-card--featured { transform: translateY(0); }
  .caby-sp-obj-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-monitoring-inner { grid-template-columns: 1fr; }
  .caby-sp-monitoring-photo img { height: 320px; }
  .caby-sp-themes-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-split { grid-template-columns: 1fr; }
  .caby-sp-split-photo { height: 340px; }
  .caby-sp-split-photo-overlay { background: linear-gradient(to bottom, transparent 40%, var(--white) 100%); }
  .caby-sp-split-text-inner { padding: 48px 32px; }
}

@media (max-width: 768px) {
  .caby-sp-hero-stats { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-axes-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-impact-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-obj-grid { grid-template-columns: 1fr; }
  .caby-sp-photo-banner { background-attachment: scroll; height: auto; padding: 64px 0; }
  .caby-sp-quote { grid-template-columns: 1fr; }
  .caby-sp-quote-icon { font-size: 36px; margin-bottom: 12px; }
}

@media (max-width: 600px) {
  .caby-sp-hero-stats { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-axes-grid { grid-template-columns: 1fr; }
  .caby-sp-context-grid { grid-template-columns: 1fr; }
  .caby-sp-themes-grid { grid-template-columns: 1fr; }
  .caby-sp-impact-grid { grid-template-columns: repeat(2, 1fr); }
  .caby-sp-hero-focus { flex-direction: column; }
}

/* ================================================================
   Section 32 -- Homepage Redesign (.caby-hm-*)
   Bold Geometric Impact design | May 2026
   ================================================================ */

/* -- 32a. Mission Intro (dark navy, centered) -- */
.caby-hm-intro {
  background: var(--navy-dark) !important;
  position: relative;
  overflow: hidden;
}
.caby-hm-intro > .elementor-container { position: relative; z-index: 2; }
.caby-hm-intro::before {
  content: "";
  position: absolute;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,180,216,.18) 0%, transparent 70%);
  top: -200px; right: -150px;
  pointer-events: none; z-index: 1;
}
.caby-hm-intro::after {
  content: "";
  position: absolute;
  width: 400px; height: 400px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(76,175,80,.12) 0%, transparent 70%);
  bottom: -120px; left: -100px;
  pointer-events: none; z-index: 1;
}
.caby-hm-intro .elementor-heading-title {
  color: #ffffff !important;
  font-size: clamp(2.2rem, 5vw, 3.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
}
.caby-hm-intro .elementor-widget-text-editor p,
.caby-hm-intro .elementor-text-editor * { color: rgba(255,255,255,.82) !important; font-size: 1.18rem !important; line-height: 1.75 !important; }
.caby-hm-eyebrow {
  display: inline-block;
  background: rgba(0,180,216,.18);
  border: 1px solid rgba(0,180,216,.4);
  color: #40D0F0 !important;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 6px 18px;
  border-radius: 100px;
  margin-bottom: 28px;
}
.caby-hm-intro-divider {
  width: 72px; height: 4px;
  background: linear-gradient(90deg, var(--teal), var(--green));
  border-radius: 4px;
  margin: 28px auto 0;
}
.caby-hm-btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  background: linear-gradient(135deg, var(--teal), var(--teal-dark)) !important;
  color: #fff !important;
  font-weight: 700 !important;
  padding: 15px 36px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  font-size: 1rem !important;
  box-shadow: 0 8px 28px rgba(0,180,216,.4) !important;
  transition: transform .2s, box-shadow .2s !important;
}
.caby-hm-btn-primary:hover { transform: translateY(-2px) !important; box-shadow: 0 14px 36px rgba(0,180,216,.55) !important; }
.caby-hm-btn-outline {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,.45) !important;
  font-weight: 600 !important;
  padding: 13px 34px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  font-size: 1rem !important;
  transition: border-color .2s, background .2s !important;
}
.caby-hm-btn-outline:hover { border-color: rgba(255,255,255,.9) !important; background: rgba(255,255,255,.08) !important; }
.caby-hm-btn-row { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; margin-top: 40px; }

/* -- 32b. Programs (light, 4 cards) -- */
.caby-hm-programs { background: #ffffff !important; border-top: 4px solid var(--gray-100); }
.caby-hm-programs .elementor-heading-title { color: #071042 !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; font-weight: 800 !important; }
.caby-hm-programs .elementor-text-editor p { color: #4B5563 !important; font-size: 1.08rem !important; line-height: 1.75 !important; }
.caby-hm-programs .elementor-text-editor p { color: var(--gray-500) !important; }
.caby-hm-prog-card {
  background: #fff;
  border-radius: 20px;
  padding: 40px 32px;
  text-align: center;
  box-shadow: 0 4px 24px rgba(7,16,66,.06);
  border-top: 5px solid var(--teal);
  transition: transform .25s, box-shadow .25s;
  height: 100%;
}
.caby-hm-prog-card:hover { transform: translateY(-6px); box-shadow: 0 16px 48px rgba(7,16,66,.12); }
.caby-hm-prog-card--green  { border-top-color: var(--green); }
.caby-hm-prog-card--gold   { border-top-color: #F59E0B; }
.caby-hm-prog-card--purple { border-top-color: #8B5CF6; }
.caby-hm-prog-icon {
  width: 72px; height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(0,180,216,.12), rgba(0,180,216,.06));
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 24px;
  font-size: 2rem;
  color: var(--teal-dark);
}
.caby-hm-prog-card--green  .caby-hm-prog-icon { background: linear-gradient(135deg, rgba(76,175,80,.14), rgba(76,175,80,.06)); color: var(--green-dark); }
.caby-hm-prog-card--gold   .caby-hm-prog-icon { background: linear-gradient(135deg, rgba(245,158,11,.14), rgba(245,158,11,.06)); color: #B45309; }
.caby-hm-prog-card--purple .caby-hm-prog-icon { background: linear-gradient(135deg, rgba(139,92,246,.14), rgba(139,92,246,.06)); color: #6D28D9; }
.caby-hm-prog-title { font-size: 1.2rem; font-weight: 700; color: var(--navy-dark); margin-bottom: 12px; }
.caby-hm-prog-desc  { font-size: .95rem; color: var(--gray-500); line-height: 1.65; }

/* -- 32c. Impact strip (teal gradient, 4 counters) -- */
.caby-hm-impact { background: linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%) !important; }
.caby-hm-impact .elementor-heading-title { color: #fff !important; }
.caby-hm-impact .elementor-text-editor * { color: rgba(255,255,255,.85) !important; }
.caby-hm-stat {
  text-align: center;
  padding: 32px 20px;
  background: rgba(255,255,255,.10);
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(6px);
}
.caby-hm-stat-num {
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  font-weight: 900;
  color: #fff;
  line-height: 1;
  display: block;
  margin-bottom: 8px;
}
.caby-hm-stat-label {
  font-size: .9rem; font-weight: 600;
  color: rgba(255,255,255,.80);
  letter-spacing: .04em; text-transform: uppercase;
}

/* -- 32d. Our Story (white, 2-col) -- */
.caby-hm-story { background: #ffffff !important; }
.caby-hm-story .elementor-heading-title { color: var(--navy-dark) !important; font-weight: 800 !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; }
.caby-hm-story .elementor-text-editor * { color: var(--gray-700) !important; line-height: 1.8 !important; }
.caby-hm-story-tag {
  display: inline-block;
  background: rgba(0,180,216,.10);
  border: 1px solid rgba(0,180,216,.3);
  color: var(--teal-dark) !important;
  font-size: .78rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: 5px 16px; border-radius: 100px; margin-bottom: 20px;
}
.caby-hm-story-quote {
  border-left: 4px solid var(--teal);
  padding: 16px 24px;
  background: var(--light);
  border-radius: 0 12px 12px 0;
  margin: 28px 0;
  font-style: italic;
  color: var(--navy-dark) !important;
  font-size: 1.08rem;
}
.caby-hm-story-divider {
  width: 56px; height: 4px;
  background: linear-gradient(90deg, var(--teal), var(--green));
  border-radius: 4px; margin: 24px 0;
}

/* -- 32e. Focus Areas (dark navy, 3 bold cards) -- */
.caby-hm-focus { background: var(--navy-dark) !important; }
.caby-hm-focus .elementor-heading-title { color: #fff !important; font-weight: 800 !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; }
.caby-hm-focus .elementor-text-editor * { color: rgba(255,255,255,.75) !important; }
.caby-hm-focus-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  padding: 40px 32px;
  position: relative; overflow: hidden;
  transition: border-color .25s, background .25s;
}
.caby-hm-focus-card::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--teal), var(--green));
  border-radius: 20px 20px 0 0;
}
.caby-hm-focus-card:hover { border-color: rgba(0,180,216,.3); background: rgba(0,180,216,.06); box-shadow: 0 0 40px rgba(0,180,216,.10); }
.caby-hm-focus-icon {
  width: 64px; height: 64px; border-radius: 16px;
  background: rgba(0,180,216,.14);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem; margin-bottom: 24px; color: var(--teal-light);
}
.caby-hm-focus-title { font-size: 1.25rem; font-weight: 700; color: #fff; margin-bottom: 12px; }
.caby-hm-focus-desc  { font-size: .95rem; color: rgba(255,255,255,.70); line-height: 1.65; }

/* -- 32f. News Teaser (light gray, 3 cards) -- */
.caby-hm-news { background: var(--gray-100) !important; }
.caby-hm-news .elementor-heading-title { color: #071042 !important; font-weight: 800 !important; font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important; }
.caby-hm-news .elementor-text-editor * { color: #4B5563 !important; font-size: 1.08rem !important; }
.caby-hm-news-card {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(7,16,66,.07);
  transition: transform .25s, box-shadow .25s;
}
.caby-hm-news-card:hover { transform: translateY(-5px); box-shadow: 0 16px 48px rgba(7,16,66,.13); }
.caby-hm-news-thumb { height: 210px; background: var(--navy-mid); overflow: hidden; }
.caby-hm-news-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.caby-hm-news-card:hover .caby-hm-news-thumb img { transform: scale(1.05); }
.caby-hm-news-body { padding: 28px 24px; }
.caby-hm-news-cat { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal-dark); margin-bottom: 10px; }
.caby-hm-news-title { font-size: 1.05rem; font-weight: 700; color: var(--navy-dark); line-height: 1.4; margin-bottom: 10px; }
.caby-hm-news-excerpt { font-size: .9rem; color: var(--gray-500); line-height: 1.6; margin-bottom: 18px; }
.caby-hm-news-link { font-size: .88rem; font-weight: 700; color: var(--teal-dark); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }

/* -- 32g. Homepage CTA (dark navy) -- */
.caby-hm-cta {
  background: var(--navy-dark) !important;
  text-align: center;
  position: relative; overflow: hidden;
}
.caby-hm-cta::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--teal) 0%, var(--navy-mid) 50%, var(--green) 100%);
}
.caby-hm-cta > .elementor-container { position: relative; z-index: 2; }
.caby-hm-cta .elementor-heading-title { color: #fff !important; font-size: clamp(1.8rem, 4vw, 3rem) !important; font-weight: 800 !important; }
.caby-hm-cta .elementor-text-editor * { color: rgba(255,255,255,.80) !important; font-size: 1.12rem !important; }

/* -- 32h. Homepage responsive -- */
@media (max-width: 1024px) {
  .caby-hm-photo-frame img { height: 360px; }
}
@media (max-width: 768px) {
  .caby-hm-btn-row { flex-direction: column; align-items: center; }
}


/* -- 32i. Photo gallery strip -- */
.caby-hm-gallery { background: #000 !important; padding: 0 !important; }
.caby-hm-gallery > .elementor-container { max-width: 100% !important; padding: 0 !important; }
.caby-hm-gallery .elementor-widget-wrap { padding: 0 !important; }
.caby-hm-gallery .elementor-widget-html { padding: 0 !important; }

/* -- 32j. Photo frame in story section -- */
.caby-hm-photo-frame {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(7,16,66,.18);
}

/* ================================================================
   Section 33 — Programs / Gallery / Focus Grid Classes
   (replace old inline-style grids for responsive control)
   ================================================================ */

/* ── Programs wrap ── */
.caby-prg-wrap { max-width: 1100px; margin: 0 auto; }

/* Programs featured card */
.caby-prg-featured {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 8px 40px rgba(7,16,66,.10);
  border-top: 6px solid #CE1126;
  overflow: hidden;
  margin-bottom: 28px;
}
.caby-prg-feat-img { overflow: hidden; height: 280px; }
.caby-prg-feat-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.caby-prg-featured:hover .caby-prg-feat-img img { transform: scale(1.04); }
.caby-prg-feat-body {
  padding: 40px 36px;
  display: flex; flex-direction: column; justify-content: center;
}

/* Programs 4-card grid */
.caby-prg-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* ── Gallery grid ── */
.caby-gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}
.caby-gallery-item {
  position: relative;
  overflow: hidden;
  height: 320px;
}
.caby-gallery-item img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .5s;
}
.caby-gallery-item:hover img { transform: scale(1.06); }
.caby-gallery-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(7,16,66,.75) 0%, transparent 55%);
}
.caby-gallery-caption {
  position: absolute; bottom: 16px; left: 16px; right: 16px;
  color: #fff; font-size: .82rem; font-weight: 600; margin: 0;
}

/* ── Focus cards grid ── */
.caby-focus-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  max-width: 1100px;
  margin: 0 auto;
}

/* ================================================================
   Section 34 — Shooting Star & Homepage Animations
   ================================================================ */

/* Shooting star element */
.caby-shooting-star {
  position: fixed;
  width: 160px; height: 2px;
  background: linear-gradient(to right, transparent 0%, rgba(252,209,22,.7) 50%, #fff 100%);
  border-radius: 2px;
  pointer-events: none;
  z-index: 9998;
  transform-origin: left center;
  animation: cabyStarFly 1.4s ease-out forwards;
}
.caby-shooting-star::after {
  content: '';
  position: absolute; right: 0; top: 50%;
  transform: translateY(-50%);
  width: 5px; height: 5px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 0 8px 3px rgba(252,209,22,.9);
}
@keyframes cabyStarFly {
  0%  { opacity: 0;   transform: rotate(-30deg) translateX(0); }
  8%  { opacity: 1; }
  85% { opacity: .8; }
  100%{ opacity: 0;   transform: rotate(-30deg) translateX(520px); }
}

/* Floating particle for dark sections */
.caby-particle {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  animation: cabyParticleFloat linear infinite;
  opacity: 0;
}
@keyframes cabyParticleFloat {
  0%   { transform: translateY(0) scale(1);   opacity: 0; }
  10%  { opacity: .6; }
  90%  { opacity: .3; }
  100% { transform: translateY(-200px) scale(.4); opacity: 0; }
}

/* Eyebrow pill pulse on load */
.caby-hm-eyebrow {
  animation: cabyEyebrowPulse 2.5s ease-in-out 0.5s 3;
}
@keyframes cabyEyebrowPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,180,216,0); }
  50%       { box-shadow: 0 0 0 6px rgba(0,180,216,.2); }
}

/* Divider animated gradient shimmer */
.caby-hm-intro-divider, .caby-hm-story-divider {
  background-size: 200% 100%;
  animation: cabyDividerShimmer 3s linear infinite;
}
@keyframes cabyDividerShimmer {
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}

/* ================================================================
   Section 35 — Mobile Responsiveness (full site)
   ================================================================ */

/* Global: prevent horizontal scroll */
html, body { overflow-x: hidden !important; }

/* ── Tablet (≤ 1024px) ── */
@media (max-width: 1024px) {
  .elementor-container { padding-left: 24px !important; padding-right: 24px !important; }

  /* Reduce section padding */
  .caby-hm-intro.elementor-section { padding: 80px 0 !important; }
  .caby-hm-programs.elementor-section, .caby-hm-story.elementor-section,
  .caby-hm-focus.elementor-section, .caby-hm-news.elementor-section,
  .caby-hm-cta.elementor-section { padding: 80px 0 !important; }
  .caby-hm-impact.elementor-section { padding: 70px 0 !important; }

  /* Gallery 2x2 on tablet */
  .caby-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .caby-gallery-item { height: 260px; }

  /* Programs 4 cards → 2x2 */
  .caby-prg-cards { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ── Mobile (≤ 767px) ── */
@media (max-width: 767px) {
  body { overflow-x: hidden !important; }

  /* Container horizontal padding */
  .elementor-container { padding-left: 16px !important; padding-right: 16px !important; }

  /* Sections: reduce vertical padding */
  .caby-hm-intro.elementor-section  { padding: 70px 0 !important; }
  .caby-hm-programs.elementor-section, .caby-hm-story.elementor-section,
  .caby-hm-focus.elementor-section,  .caby-hm-news.elementor-section,
  .caby-hm-cta.elementor-section     { padding: 56px 0 !important; }
  .caby-hm-impact.elementor-section  { padding: 50px 0 !important; }
  .caby-hm-gallery.elementor-section { padding: 0 !important; }

  /* Intro heading */
  .caby-hm-intro .elementor-heading-title { font-size: 2.1rem !important; }

  /* Buttons: stack vertically */
  .caby-hm-btn-row { flex-direction: column; align-items: center; gap: 12px; }
  .caby-hm-btn-primary, .caby-hm-btn-outline {
    width: 100% !important; max-width: 300px !important;
    justify-content: center !important; text-align: center !important;
  }

  /* Programs featured card: stack vertically */
  .caby-prg-featured { grid-template-columns: 1fr !important; }
  .caby-prg-feat-img { height: 220px !important; }
  .caby-prg-feat-body { padding: 28px 24px !important; }

  /* Programs 4 cards: 2x2 on mobile */
  .caby-prg-cards { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }

  /* Gallery: 2x2 on mobile */
  .caby-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .caby-gallery-item { height: 200px !important; }

  /* Focus: 1 column */
  .caby-focus-grid { grid-template-columns: 1fr !important; gap: 16px !important; }

  /* Photo frame */
  .caby-hm-photo-frame { border-radius: 16px; }
  .caby-hm-photo-frame img { height: 260px !important; }

  /* Stats: Elementor columns auto-stack at ≤767px */
  .caby-hm-stat { margin: 6px 0; }
  .caby-hm-stat-num { font-size: 2.8rem !important; }

  /* News cards auto-stack via Elementor columns */
  .caby-hm-news-thumb { height: 180px; }

  /* Inner page banner */
  .inner-banner-wrap { padding: 50px 20px !important; }
  .inner-banner-wrap .page-title,
  .inner-banner-wrap h1 { font-size: 2rem !important; }

  /* Other inner-page sections */
  .caby-el-hero-section.elementor-section,
  .caby-el-mission-section.elementor-section,
  .caby-el-values-section.elementor-section,
  .caby-el-cta-section.elementor-section { padding: 60px 0 !important; }

  /* General typography scale */
  h1 { font-size: 2rem !important; }
  h2 { font-size: 1.7rem !important; }

  /* Tables */
  .entry-content table { display: block; overflow-x: auto; }

  /* Prevent long words/URLs breaking layout */
  .entry-content, .elementor-text-editor { word-break: break-word; overflow-wrap: break-word; }

  /* SINA carousel height on mobile (already handled in post-75.css but reinforce) */
  .sina-slider-content { height: auto !important; min-height: 520px; }
}

/* ── Small phone (≤ 480px) ── */
@media (max-width: 480px) {
  .caby-prg-cards { grid-template-columns: 1fr !important; }
  .caby-gallery-grid { grid-template-columns: 1fr !important; }
  .caby-gallery-item { height: 220px !important; }
  .caby-hm-intro .elementor-heading-title { font-size: 1.85rem !important; }
  .caby-hm-stat-num { font-size: 2.4rem !important; }
  .caby-hm-prog-card { padding: 28px 20px; }
  .caby-hm-focus-card { padding: 28px 20px; }
  .caby-hm-news-body { padding: 20px 16px; }

  /* Programs featured card image */
  .caby-prg-feat-img { height: 180px !important; }

  /* Top bar on phones - hide less important items */
  .top-header .header-contact ul li:not(:first-child) { display: none; }
}