/* ==========================================================================
   DANDALIN SAUKI LIMITED — RESPONSIVE STYLESHEET
   Phase: Desktop/Laptop Polish Only (min-width: 1024px)
   Target Review Width: 1200px
   ========================================================================== */

/* Mobile & Tablet default fallbacks (preserving existing behavior below 1024px) */
.tablet-text-link {
  display: none !important;
}

@media (max-width: 1024px) {
  .btn-group-responsive {
    display: flex;
    flex-direction: row;
    width: 100%;
  }

  .who-we-are-cards-grid {
    grid-template-columns: 1fr;
  }

  .what-we-do-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ecosystem-nodes-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .pillars-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .pillars-5-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 639px) {
  .what-we-do-grid {
    grid-template-columns: 1fr;
  }

  .ecosystem-nodes-grid {
    grid-template-columns: 1fr;
  }

  .pillars-grid {
    grid-template-columns: 1fr;
  }

}

/* ==========================================================================
   TABLET — HOMEPAGE RESPONSIVE POLISH
   768px–1024px (Scoped 768px Responsive Layout)
   ========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {

  /* TABLET TEXT LINKS — Simple, elegant text-link style (no fill, no border) */
  .tablet-text-link {
    display: inline-flex !important;
    align-items: center;
    gap: 0.35rem;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0.25rem 0 !important;
    color: var(--color-primary) !important;
    font-weight: var(--font-weight-semibold);
    font-size: 0.825rem;
    text-decoration: none;
    transition: color var(--transition-fast), transform var(--transition-fast);
    white-space: nowrap;
    cursor: pointer;
  }

  .tablet-text-link:hover {
    color: var(--color-primary-hover) !important;
    text-decoration: underline;
    transform: translateX(2px);
  }

  .tablet-text-link:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
  }

  /* 1. GLOBAL TABLET SPACING & RHYTHM */
  .section {
    padding-block: 1.35rem; /* Compact vertical section padding */
  }

  .section-header {
    margin-bottom: 0.75rem;
  }

  /* 2. HERO SECTION — TABLET */
  .hero-section {
    padding-top: 0.85rem;
    padding-bottom: 1rem;
  }

  .hero-grid {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 1.25rem;
    align-items: center;
  }

  .hero-content {
    max-width: 100%;
  }

  .hero-badge-pill {
    margin-bottom: 0.4rem;
    font-size: 0.65rem;
    padding: 0.25rem 0.6rem;
  }

  .hero-headline {
    font-size: 1.95rem;
    line-height: 1.15;
    margin-bottom: 0.5rem;
  }

  .hero-description {
    font-size: 0.825rem;
    line-height: 1.45;
    margin-bottom: 0.75rem;
    max-width: 100%;
  }

  .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    width: auto;
    gap: 0.5rem;
    justify-content: flex-start;
  }

  .btn-group-responsive.justify-center {
    justify-content: center !important;
  }

  .btn-group-responsive .btn {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: 0.4rem 0.8rem !important;
    font-size: 0.775rem !important;
  }

  main#mainContent > section#hero .btn-group-responsive > a:nth-of-type(1) {
    width: 186.44px !important;
  }

  main#mainContent > section#hero .btn-group-responsive > a:nth-of-type(2) {
    width: 115.3464px !important;
  }

  .hero-visual {
    justify-content: center;
  }

  .hero-visual-card {
    max-width: 440px;
    padding: 0.5rem;
  }

  /* SVG text sizing for crystal clear readability on tablet */
  .hero-svg-wrapper svg text {
    font-size: 12.5px !important;
  }

  /* 3. WHO WE ARE SECTION — TABLET */
  #who-we-are {
    padding-block: 1.35rem;
  }

  .who-we-are-header-row {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0.75rem;
  }

  .who-we-are-eyebrow-container {
    text-align: center;
    width: 100%;
    margin-bottom: 0;
  }

  .who-we-are-eyebrow-container .h2 {
    text-align: center !important;
    font-size: 1.55rem;
    margin-bottom: 0;
  }

  .who-we-are-top-link {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-flex !important;
  }

  .who-we-are-bottom-btn-wrap {
    display: none !important;
  }

  .who-we-are-grid {
    grid-template-columns: 2.05fr 1fr;
    gap: 2.5rem;
    align-items: start;
  }

  .who-we-are-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .who-we-are-content .h2,
  .who-we-are-content .h3 {
    text-align: left !important;
    font-size: 1.25rem;
    margin-bottom: 0.45rem;
  }

  .who-we-are-content p {
    font-size: 0.825rem;
    line-height: 1.45;
  }

  .who-we-are-right {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    align-items: center;
    width: 100%;
  }

  .who-we-are-cards-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.6rem !important;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .who-we-are-card {
    padding: 0.75rem 0.5rem;
    min-height: auto;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-inline: auto;
    margin-top: 25px !important;
    width: 100%;
  }

  .who-we-are-card .card-icon {
    width: 32px;
    height: 32px;
    margin-inline: auto;
    margin-bottom: 0.35rem;
  }

  .who-we-are-card .card-icon svg {
    width: 16px;
    height: 16px;
  }

  .who-we-are-card .h3 {
    text-align: center;
    font-size: 0.85rem;
    margin-bottom: 0.2rem;
  }

  .who-we-are-card p {
    text-align: center;
    font-size: 0.725rem;
    line-height: 1.35;
  }

  /* 4. WHAT WE DO SECTION — TABLET */
  #what-we-do {
    padding-block: 1.35rem;
  }

  .what-we-do-header {
    margin-bottom: 0.75rem;
    text-align: center;
  }

  .what-we-do-header .eyebrow {
    display: block;
    text-align: center;
  }

  .what-we-do-header .h2 {
    text-align: center;
    font-size: 1.55rem;
    margin-bottom: 0;
  }

  .what-we-do-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0.5rem;
  }

  .what-we-do-card {
    padding: 0.75rem 0.45rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
  }

  .what-we-do-card .card-icon {
    width: 32px;
    height: 32px;
    margin-inline: auto;
    margin-bottom: 0.35rem;
  }

  .what-we-do-card .card-icon svg {
    width: 16px;
    height: 16px;
  }

  .what-we-do-card .card-title {
    text-align: center;
    font-size: 0.825rem;
    margin-bottom: 0.2rem;
  }

  .what-we-do-card .card-body {
    text-align: center;
  }

  .what-we-do-card .card-body p {
    text-align: center;
    font-size: 0.7rem;
    line-height: 1.35;
  }

  .what-we-do-card .card-footer {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: auto;
    padding-top: 0.35rem;
  }

  .what-we-do-card .btn-text {
    font-size: 0.7rem;
    padding: 0.2rem 0.4rem;
  }

  /* 5. PRODUCT SHOWCASE SECTION — TABLET */
  #products {
    padding-block: 1.35rem;
  }

  .product-showcase-header {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0.75rem;
  }

  .product-header-text {
    text-align: center;
    width: 100%;
  }

  .product-header-text .eyebrow {
    text-align: center !important;
    display: block !important;
    margin-inline: auto !important;
  }

  .product-header-text .h2 {
    text-align: center !important;
    font-size: 1.55rem;
    margin-bottom: 0;
  }

  .product-top-link {
    position: absolute;
    right: 0;
    bottom: 0;
    display: inline-flex !important;
  }

  .product-showcase-card {
    padding: 0.95rem;
    margin-top: 0.4rem;
  }

  .product-showcase-inner-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
  }

  .product-main-content {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .product-badges-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.35rem !important;
    margin-bottom: 0.35rem !important;
  }

  .badge-clx {
    color: #9a9a2e !important;
  }

  .badge-clx, .badge-active {
    font-size: 0.6rem !important;
    padding: 0.15rem 0.4rem !important;
    white-space: nowrap !important;
  }

  .product-main-content .h2 {
    font-size: 26px !important;
    color: #0c3279 !important;
    margin-bottom: 0.2rem !important;
  }

  .product-main-content .eyebrow-sub {
    font-size: 12px !important;
  }

  .product-main-content .lead-text {
    font-size: 15px !important;
    line-height: 1.4 !important;
    margin-bottom: 0.5rem !important;
  }

  .product-target-pills {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.25rem !important;
    width: 100% !important;
    margin-top: 0.2rem !important;
  }

  .target-pill {
    padding: 0.15rem 0.35rem !important;
    font-size: 0.6rem !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
    border-width: 1px !important;
  }

  .product-main-explore-btn {
    display: none !important;
  }

  .clx-visit-card-btn {
    top: 0.85rem !important;
    right: 0.85rem !important;
  }

  .product-detail-column {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.5rem !important;
    width: 100% !important;
    height: 223px !important;
  }

  .product-detail-box {
    flex: 1 1 50% !important;
    width: 152px !important;
    height: 150px !important;
    margin-top: 75px !important;
    padding: 0.55rem 0.6rem !important;
  }

  .product-detail-title {
    font-size: 0.75rem !important;
    margin-bottom: 0.25rem !important;
  }

  .product-detail-box p {
    font-size: 0.7rem !important;
    line-height: 1.35 !important;
  }

  /* 6. DIGITAL ECOSYSTEM SECTION — TABLET */
  #ecosystem {
    padding-block: 1.35rem;
  }

  .ecosystem-header-row {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0.75rem;
  }

  .ecosystem-header-text {
    text-align: center;
    width: 100%;
  }

  .ecosystem-header-text .eyebrow {
    text-align: center !important;
    display: block !important;
    margin-inline: auto !important;
  }

  .ecosystem-header-text .h2 {
    text-align: center !important;
    font-size: 1.55rem;
    margin-bottom: 0;
  }

  .ecosystem-top-link {
    position: absolute;
    right: 0;
    bottom: 0;
    display: inline-flex !important;
  }

  .ecosystem-bottom-btn-wrap {
    display: none !important;
  }

  .ecosystem-nodes-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) .ecosystem-nodes-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  /* All 5 cards visible in ONE SINGLE HORIZONTAL ROW on tablet */
  .ecosystem-nodes-grid .ecosystem-node-card,
  .ecosystem-nodes-grid .ecosystem-node-card:nth-child(1),
  .ecosystem-nodes-grid .ecosystem-node-card:nth-child(2),
  .ecosystem-nodes-grid .ecosystem-node-card:nth-child(3),
  .ecosystem-nodes-grid .ecosystem-node-card:nth-child(4),
  .ecosystem-nodes-grid .ecosystem-node-card:nth-child(5) {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    height: 100% !important;
    padding: 0.75rem 0.35rem !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-node-icon,
  .ecosystem-nodes-grid .ecosystem-node-card .card-icon {
    order: 1 !important;
    margin-inline: auto !important;
    margin-bottom: 0.3rem !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-node-icon svg,
  .ecosystem-nodes-grid .ecosystem-node-card .card-icon svg {
    width: 14px !important;
    height: 14px !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-node-title,
  .ecosystem-nodes-grid .ecosystem-node-card .h4,
  .ecosystem-nodes-grid .ecosystem-node-card .h3,
  .ecosystem-nodes-grid .ecosystem-node-card h3,
  .ecosystem-nodes-grid .ecosystem-node-card h4 {
    order: 2 !important;
    font-size: 0.775rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.25rem !important;
    font-weight: 700 !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-node-product {
    order: 2 !important;
    font-size: 0.625rem !important;
    margin-bottom: 0.2rem !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card p,
  .ecosystem-nodes-grid .ecosystem-node-card .text-xs,
  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-node-desc {
    order: 3 !important;
    font-size: 0.675rem !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
    color: var(--color-text-muted) !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .badge,
  .ecosystem-node-card .badge {
    order: 4 !important;
    font-size: 0.55rem !important;
    padding: 0.15rem 0.35rem !important;
    white-space: nowrap !important;
    margin-inline: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .ecosystem-nodes-grid .ecosystem-node-card .ecosystem-sub-connector,
  .ecosystem-node-card .ecosystem-sub-connector {
    order: 5 !important;
    margin-top: 0.35rem !important;
    margin-inline: auto !important;
    font-size: 0.6rem !important;
    padding: 0.15rem 0.35rem !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }

  /* 7. OUR VALUE PILLARS SECTION — TABLET */
  #why-dandalin-sauki {
    padding-block: 1.35rem;
  }

  .pillars-header-row {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0.75rem;
  }

  .pillars-header-text {
    text-align: center;
    width: 100%;
  }

  .pillars-header-text .eyebrow {
    text-align: center !important;
    display: block !important;
    margin-inline: auto !important;
  }

  .pillars-header-text .h2 {
    text-align: center !important;
    font-size: 1.55rem;
    margin-bottom: 0;
  }

  .pillars-top-link {
    position: absolute;
    right: 0;
    bottom: 0;
    display: inline-flex !important;
  }

  .pillars-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0.6rem !important;
  }

  /* Hide Accessible card (2nd card) on tablet 768px presentation */
  .pillars-grid .pillar-card:nth-child(2) {
    display: none !important;
  }

  .pillar-card {
    padding: 0.75rem 0.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
  }

  .pillar-number {
    text-align: center;
    font-size: 0.6rem;
    margin-bottom: 0.2rem;
  }

  .pillar-title {
    text-align: center;
    font-size: 0.825rem;
    margin-bottom: 0.25rem;
  }

  .pillar-desc {
    text-align: center;
    font-size: 0.7rem;
    line-height: 1.35;
  }

  /* 8. FINAL CTA BANNER — TABLET */
  #contact-cta {
    padding-block: 1.25rem;
    display: flex;
    justify-content: center;
  }

  #contact-cta .cta-banner,
  .cta-banner {
    max-width: 580px !important;
    width: 100% !important;
    margin-inline: auto !important;
    padding: 1.35rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .cta-banner-title,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 25.8px !important;
    margin-bottom: 0.4rem;
    text-align: center !important;
    margin-inline: auto !important;
  }

  .cta-banner-desc,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13.8px !important;
    line-height: 1.45;
    margin-bottom: 0.75rem;
    max-width: 52ch;
    text-align: center !important;
    margin-inline: auto !important;
  }

  #contact-cta .cta-banner .btn-group-responsive,
  .cta-banner .btn-group-responsive,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    margin-inline: auto !important;
    width: auto !important;
    max-width: 100% !important;
    gap: 0.75rem !important;
  }

  #contact-cta .cta-banner .btn,
  .cta-banner .btn,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) .btn,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) a {
    width: auto !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding: 0.45rem 0.9rem !important;
    font-size: 13.4px !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    font-size: 13.4px !important;
  }

  /* 9. FOOTER — TABLET 3 CARDS HORIZONTALLY IN ONE LINE */
  .site-footer {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
  }

  .footer-col-brand {
    display: none !important;
  }

  .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 1rem !important;
    margin-bottom: 1rem !important;
    align-items: start !important;
  }

  .footer-col-company {
    text-align: center !important;
  }

  .footer-col-company .footer-heading {
    text-align: center !important;
    font-size: 0.725rem;
    margin-bottom: 0.4rem;
  }

  .footer-col-company .footer-links {
    align-items: center !important;
    gap: 0.3rem;
  }

  .footer-col-company .footer-link {
    font-size: 0.725rem;
    text-align: center !important;
  }

  .footer-col-products {
    text-align: center !important;
  }

  .footer-col-products .footer-heading {
    text-align: center !important;
    font-size: 0.725rem;
    margin-bottom: 0.4rem;
  }

  .footer-col-products .footer-links {
    align-items: center !important;
    gap: 0.3rem;
  }

  .footer-col-products .footer-link {
    font-size: 0.725rem;
    text-align: center !important;
  }

  .footer-col-contact {
    text-align: center !important;
  }

  .footer-col-contact .footer-heading {
    text-align: center !important;
    font-size: 0.725rem;
    margin-bottom: 0.4rem;
  }

  .footer-col-contact .footer-contact-info {
    align-items: center !important;
    gap: 0.35rem;
  }

  .footer-col-contact .footer-contact-item {
    justify-content: center !important;
    text-align: center !important;
    font-size: 0.725rem;
  }

  .footer-contact-icon {
    margin-top: 0;
  }

  /* 10. FOOTER COPYRIGHT — TABLET */
  .footer-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 0.35rem;
    padding-top: 0.75rem;
  }

  .footer-legal-links {
    order: 1;
    display: flex !important;
    justify-content: center !important;
    gap: 1.15rem;
    text-align: center !important;
  }

  .footer-legal-link {
    font-size: 0.725rem;
  }

  .copyright-text {
    order: 2;
    text-align: center !important;
    font-size: 0.725rem;
  }

  /* ==========================================================================
     ABOUT PAGE — TABLET RESPONSIVE POLISH (768px–992px)
     ========================================================================== */

  /* 1. HERO SECTION */
  .page-hero {
    padding-top: 0.85rem !important;
    padding-bottom: 0.75rem !important;
  }

  .page-hero .breadcrumbs {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0.5rem !important;
    font-size: 0.8rem !important;
  }

  /* 2. ABOUT US + OUR STORY */
  #about-story,
  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) {
    padding-block: 1.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 21.6px !important;
  }

  #about-story .about-story-grid,
  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
  }

  #about-story .about-story-card,
  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) .about-story-card {
    height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.15rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }

  #about-story .about-story-header {
    display: flex !important;
    align-items: center !important;
    gap: 0.6rem !important;
    margin-bottom: 0.75rem !important;
  }

  /* 3. WHY WE EXIST */
  #why-we-exist,
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) {
    padding-block: 1.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #why-we-exist .why-exist-grid,
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.75rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
  }

  #why-we-exist .why-exist-card,
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) .why-exist-card {
    height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1rem 0.75rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* 4. MISSION & VISION */
  .mission-vision-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
  }

  .mission-card,
  .vision-card {
    height: 100% !important;
    padding: 1.15rem 1rem !important;
  }

  /* 5. CORE VALUES */
  #our-values,
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) {
    padding-block: 1.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #our-values .values-grid,
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.75rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
  }

  #our-values .value-card,
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) .value-card {
    height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0.95rem 0.75rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #our-values .card-icon {
    width: 38px !important;
    height: 38px !important;
    margin-bottom: 0.4rem !important;
  }

  #our-values .card-title {
    font-size: 0.95rem !important;
    margin-bottom: 0.25rem !important;
  }

  #our-values .card-desc {
    font-size: 0.775rem !important;
    line-height: 1.4 !important;
  }

  /* 6. LEADERSHIP TEAM / CEO MESSAGE */
  #leadership,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) {
    padding-block: 1.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #leadership .section-header {
    margin-bottom: 1rem !important;
  }

  #leadership .ceo-message-card,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    box-shadow: 0 4px 20px rgba(5, 16, 102, 0.06) !important;
    padding: 1.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  #leadership .ceo-message-grid,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: 250px 1fr !important;
    gap: 1.35rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #leadership .ceo-profile-card,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 0.875rem !important;
    padding: 1.15rem 0.85rem !important;
    width: 100% !important;
    height: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  #leadership .ceo-portrait-wrapper,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    position: relative !important;
    width: 160px !important;
    height: 200px !important;
    max-width: 100% !important;
    margin: 0 auto 0.85rem auto !important;
    border-radius: 0.75rem !important;
    overflow: hidden !important;
    border: 3px solid #ffffff !important;
    outline: 2px solid #f8b51b !important;
    box-shadow: 0 6px 16px -2px rgba(5, 16, 102, 0.12) !important;
  }

  #leadership .ceo-portrait-img,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    display: block !important;
    border-radius: 0 !important;
  }

  #leadership .ceo-portrait-badge,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    position: absolute !important;
    bottom: 0.5rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(5, 16, 102, 0.9) !important;
    color: #ffffff !important;
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    padding: 0.2rem 0.55rem !important;
    border-radius: 9999px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
  }

  #leadership .ceo-profile-info,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    width: 100% !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #leadership .ceo-name,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: #051066 !important;
    margin: 0 0 0.2rem 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
  }

  #leadership .ceo-role,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 0.775rem !important;
    font-weight: 600 !important;
    color: #b38104 !important;
    margin: 0 0 0.15rem 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
  }

  #leadership .ceo-company,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 0.725rem !important;
    color: #64748b !important;
    margin: 0 0 0.75rem 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
  }

  #leadership .ceo-meta-divider,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    width: 100% !important;
    height: 1px !important;
    background: #e2e8f0 !important;
    margin: 0 0 0.65rem 0 !important;
  }

  #leadership .ceo-key-focus,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.45rem !important;
    text-align: left !important;
  }

  #leadership .ceo-letter-container,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #leadership .ceo-letter-headline,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) .ceo-letter-headline {
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: #051066 !important;
    line-height: 1.4 !important;
    margin: 0 0 0.75rem 0 !important;
    text-align: left !important;
  }

  #leadership .ceo-letter-paragraph,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) .ceo-letter-paragraph {
    font-size: 0.825rem !important;
    line-height: 1.55 !important;
    color: #334155 !important;
    margin: 0 0 0.6rem 0 !important;
    text-align: justify !important;
  }

  /* 7. OUR DIRECTION */
  #our-direction {
    padding-block: 1.35rem !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 14px !important;
  }

  #our-direction .direction-split-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #our-direction .direction-content,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-bottom: 0.25rem !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #our-direction .direction-desc-card,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 1.15rem 1.25rem !important;
    margin: 0 !important;
    border-radius: 0.75rem !important;
    background-color: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 16px rgba(5, 16, 102, 0.04) !important;
    box-sizing: border-box !important;
  }

  #our-direction .direction-desc-card p,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 0.84rem !important;
    line-height: 1.55 !important;
    color: #334155 !important;
    margin: 0 0 0.5rem 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 0.84rem !important;
    line-height: 1.55 !important;
    color: #334155 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #our-direction .direction-highlight-box,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 1.15rem 1.25rem !important;
    margin: 0 !important;
    border-radius: 0.75rem !important;
    background-color: rgba(15, 98, 254, 0.04) !important;
    border: 1px solid rgba(15, 98, 254, 0.18) !important;
    box-shadow: 0 4px 16px rgba(15, 98, 254, 0.04) !important;
    box-sizing: border-box !important;
  }

  #our-direction .direction-highlight-box .pillar-number,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    color: #0f62fe !important;
    margin: 0 0 0.4rem 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #our-direction .direction-highlight-box p,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 0.825rem !important;
    line-height: 1.55 !important;
    color: #475569 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #our-direction .direction-cards-grid,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  #our-direction .direction-card,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    padding: 0.95rem 0.65rem !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    background-color: #ffffff !important;
  }

  /* ==========================================================================
     PRODUCTS PAGE — TABLET RESPONSIVE POLISH (768px–1024px / 992px TARGET)
     ========================================================================== */

  /* 1. MERGED HERO & PHILOSOPHY GRID (2-COLUMN HORIZONTAL GRID) */
  .hero-philosophy-merged-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    align-items: stretch !important;
    width: 100% !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    padding-block: 0.85rem !important;
  }

  .hero-philosophy-merged-grid > section,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1),
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) {
    padding-block: 0.75rem 0.85rem !important;
    padding-inline: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .hero-philosophy-merged-grid > section .container {
    max-width: 100% !important;
    padding-inline: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .hero-philosophy-merged-grid .page-hero-header,
  .hero-philosophy-merged-grid .section-header,
  .hero-philosophy-merged-grid .container-narrow,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) .section-header,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) .section-header {
    text-align: center !important;
    margin-inline: 0 !important;
    margin-bottom: 0.5rem !important;
    padding: 0 !important;
    max-width: 100% !important;
  }

  .hero-philosophy-merged-grid h1,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) h1,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) .h1 {
    text-align: center !important;
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
    margin-bottom: 0.4rem !important;
  }

  .hero-philosophy-merged-grid h2,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) h2,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) .h2 {
    text-align: center !important;
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-top: 0 !important;
    margin-bottom: 0.4rem !important;
  }

  .hero-philosophy-merged-grid p,
  .hero-philosophy-merged-grid .lead-text,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) p,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) .lead-text,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) p,
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) .lead-text,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) .lead-text {
    text-align: justify !important;
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
    padding: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 2. PRACTICAL / ACCESSIBLE / CONNECTED CARDS (3 CARDS HORIZONTALLY IN ONE ROW) */
  .philosophy-cards-section {
    padding-block: 0.85rem 1.25rem !important;
  }

  .philosophy-cards-section .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
  }

  .philosophy-cards-section .grid-3 > .card {
    height: 100% !important;
    padding: 1rem 0.75rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .philosophy-cards-section .grid-3 > .card .card-icon {
    margin-inline: auto !important;
    margin-bottom: 0.5rem !important;
    flex-shrink: 0 !important;
  }

  .philosophy-cards-section .grid-3 > .card .h3 {
    text-align: center !important;
    margin-bottom: 0.25rem !important;
    font-size: 0.95rem !important;
  }

  .philosophy-cards-section .grid-3 > .card p {
    text-align: center !important;
    font-size: 0.775rem !important;
    line-height: 1.4 !important;
  }

  /* 3. CAMPUS LIFE EXPRESS (CLX) SHOWCASE CARD & BUTTON POSITIONING */
  #clx,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  #clx .product-showcase-card,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) {
    position: relative !important;
    padding: 1.25rem 1rem 0px !important;
  }

  #clx .product-badges-row {
    margin-bottom: 0.4rem !important;
  }

  #clx .product-badges-row,
  #clx .h1,
  #clx h2,
  #clx .lead-text {
    max-width: calc(100% - 210px) !important;
    text-align: left !important;
  }

  #clx .h1,
  #clx h1,
  #clx h2,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) .h1,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) h2 {
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.4rem !important;
  }

  #clx .lead-text,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) .lead-text {
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
  }

  #clx .card-footer {
    display: block !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    border-top: none !important;
  }

  #clx .card-footer > div:first-child {
    position: absolute !important;
    top: 1.25rem !important;
    right: 1rem !important;
    margin: 0 !important;
    z-index: 10 !important;
  }

  #clx .card-footer .btn {
    padding: 0.4rem 0.8rem !important;
    font-size: 0.775rem !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(7) > div:nth-of-type(1) > a:nth-of-type(1) {
    height: 39px !important;
    margin-top: -15px !important;
    font-size: 12.4px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  /* 4. CLX PROBLEM & SOLUTION (2 EQUAL COLUMNS - FULL WIDTH) */
  #clx .product-grid-details,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
  }

  #clx .product-detail-box,
  #clx .product-detail-box-sec,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    height: 100% !important;
    flex: 1 1 100% !important;
    padding: 0.85rem 0.75rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  #clx .product-detail-box h3,
  #clx .product-detail-box-sec h3,
  #clx .product-detail-box .h3,
  #clx .product-detail-box-sec .h3 {
    font-size: 0.95rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.35rem !important;
  }

  #clx .product-detail-box p,
  #clx .product-detail-box-sec p,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) .product-detail-box p,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) .product-detail-box-sec p {
    text-align: justify !important;
    font-size: 0.775rem !important;
    line-height: 1.45 !important;
    margin: 0 !important;
  }

  /* 5. DESIGNED FOR CAMPUS COMMUNITIES (HEADING CENTERED, 3 CARDS IN 1 ROW) */
  #clx .mt-lg {
    width: 100% !important;
    max-width: 100% !important;
  }

  #clx .mt-lg h3 {
    text-align: center !important;
    margin-bottom: 0.75rem !important;
    font-size: 1.05rem !important;
    line-height: 1.3 !important;
  }

  #clx .mt-lg .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #clx .mt-lg .grid-3 > .card,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div {
    padding: 0.75rem 0.6rem !important;
    height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #clx .mt-lg .grid-3 > .card h4 {
    font-size: 0.85rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.25rem !important;
    text-align: center !important;
  }

  #clx .mt-lg .grid-3 > .card p {
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 5.1 FIVE CORE CATEGORIES — 5 CARDS HORIZONTALLY IN ONE LINE (TABLET ONLY) */
  #clx .grid-5,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0.65rem 0.4rem !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > h4:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > h4:nth-of-type(1) {
    font-size: 16px !important;
    line-height: 18px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h2:nth-of-type(1) {
    text-align: left !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-right: 0px !important;
    width: 350px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    width: 300px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-bottom: 0px !important;
    padding-bottom: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) {
    width: 180px !important;
    margin-left: 320px !important;
    margin-top: -207px !important;
    height: 190px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) {
    width: 180px !important;
    margin-left: 160px !important;
    margin-top: -207px !important;
    height: 190px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(4) > div:nth-of-type(1) > a:nth-of-type(1) {
    font-size: 10.4px !important;
    width: 210.75px !important;
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    line-height: 35px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    margin-top: -10px !important;
  }

  /* 6. HOW CAMPUS LIFE EXPRESS WORKS (HEADING CENTERED, 4 STEPS IN 1 ROW) */
  #clx .mt-xl {
    padding-top: 1rem !important;
    margin-top: 1.25rem !important;
  }

  #clx .mt-xl h3 {
    text-align: center !important;
    margin-bottom: 0.85rem !important;
    font-size: 1.05rem !important;
    line-height: 1.3 !important;
  }

  #clx .progression-grid > .grid-4,
  #clx .progression-grid .grid-4 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
  }

  #clx .progression-step,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div {
    padding: 0.75rem 0.4rem !important;
    text-align: center !important;
    height: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  #clx .progression-step-num {
    margin-inline: auto !important;
    width: 26px !important;
    height: 26px !important;
    font-size: 0.75rem !important;
    line-height: 26px !important;
  }

  #clx .progression-step-title {
    text-align: center !important;
    margin-top: 0.3rem !important;
    font-size: 0.825rem !important;
    line-height: 1.3 !important;
  }

  #clx .progression-step p {
    text-align: center !important;
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    margin-top: 0.2rem !important;
    margin-bottom: 0 !important;
  }

  /* 7. OUR PRODUCT ROADMAP (5 CARDS IN 2 ROWS: 2 IN 1ST ROW, 3 IN 2ND ROW) */
  main#mainContent > section:nth-of-type(4) .section-header {
    text-align: center !important;
    margin-bottom: 0.6rem !important;
  }

  main#mainContent > section:nth-of-type(4) .section-header h2,
  main#mainContent > section:nth-of-type(4) .section-header .h2,
  main#mainContent > section:nth-of-type(4) h2 {
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.4rem !important;
  }

  main#mainContent > section:nth-of-type(4) .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(1),
  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(2) {
    grid-column: span 3 !important;
  }

  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(3),
  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(4),
  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(5) {
    grid-column: span 2 !important;
  }

  .product-roadmap-card {
    height: 100% !important;
    padding: 0.85rem 0.6rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .product-roadmap-header {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 0.35rem !important;
    width: 100% !important;
  }

  .product-roadmap-header span {
    font-size: 0.7rem !important;
  }

  .product-roadmap-card .h3,
  .product-roadmap-card h3 {
    text-align: center !important;
    font-size: 0.875rem !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    margin-bottom: 0.25rem !important;
  }

  .product-roadmap-card .card-desc,
  .product-roadmap-card p {
    text-align: center !important;
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
    margin: 0 !important;
  }

  /* 8. TRANSPARENT ROADMAP SECTION (4 STATUS CARDS IN ONE ROW, CENTERED) */
  main#mainContent > section:nth-of-type(5) .section-header h2,
  main#mainContent > section:nth-of-type(5) .section-header .h2,
  main#mainContent > section:nth-of-type(5) h2 {
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.4rem !important;
  }

  .status-legend-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  .status-legend-box {
    padding: 0.75rem 0.5rem !important;
    height: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .status-legend-box > div {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .status-legend-box p {
    text-align: center !important;
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    margin-top: 0.35rem !important;
    margin-bottom: 0 !important;
  }

  /* 9. ONE CONNECTED VISION / ECOSYSTEM CALLOUT (CENTERED, PROPORTIONATE) */
  .ecosystem-callout,
  main#mainContent > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    background-color: var(--color-bg-alt) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-xl, 16px) !important;
    padding: 1.25rem 1rem !important;
    text-align: center !important;
    max-width: 680px !important;
    margin-inline: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .ecosystem-callout .section-header {
    text-align: center !important;
    margin-inline: auto !important;
    margin-bottom: 0.5rem !important;
  }

  .ecosystem-callout .eyebrow {
    display: block !important;
    text-align: center !important;
    margin-bottom: 0.3rem !important;
    font-size: 0.75rem !important;
  }

  .ecosystem-callout .h2,
  .ecosystem-callout h2 {
    text-align: center !important;
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.4rem !important;
  }

  .ecosystem-callout .lead-text,
  .ecosystem-callout p {
    text-align: center !important;
    max-width: 580px !important;
    margin-inline: auto !important;
    margin-bottom: 0.85rem !important;
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
  }

  .ecosystem-callout > div:last-child,
  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .ecosystem-callout .btn,
  .ecosystem-callout a,
  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > a {
    font-size: 0.8rem !important;
    line-height: 1.3 !important;
    padding: 0.45rem 1rem !important;
  }

  /* 10. CLOSING CTA BANNER (WIDER, CENTERED, PROFESSIONAL) */
  .cta-banner,
  main#mainContent > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) {
    max-width: 680px !important;
    padding: 1.25rem 1rem !important;
    border-radius: var(--radius-xl, 16px) !important;
    text-align: center !important;
    margin-inline: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .cta-banner .eyebrow {
    text-align: center !important;
    display: block !important;
    font-size: 0.75rem !important;
  }

  .cta-banner-title,
  .cta-banner h2,
  .cta-banner .h2 {
    text-align: center !important;
    margin-bottom: 0.4rem !important;
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
  }

  .cta-banner-desc,
  .cta-banner p {
    text-align: center !important;
    max-width: 540px !important;
    margin-inline: auto !important;
    margin-bottom: 0.85rem !important;
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
  }

  .cta-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.85rem !important;
    width: 100% !important;
  }

  .cta-actions .btn,
  .cta-actions a,
  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a {
    min-width: 180px !important;
    padding-inline: 1.75rem !important;
    text-align: center !important;
  }

  /* ==========================================================================
     ECOSYSTEM PAGE — TABLET RESPONSIVE POLISH (<992px / 768px–1024px)
     ========================================================================== */

  /* 1. ECOSYSTEM PAGE TOP SECTION (HERO & INTRO) — 2 EQUAL COLUMNS HORIZONTALLY */
  .hero-intro-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(1) .hero-intro-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    align-items: start !important;
    width: 100% !important;
  }

  .hero-col-left,
  .hero-col-right {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
  }

  .hero-col-left .h1 {
    font-size: 1.75rem !important;
    line-height: 1.2 !important;
    text-align: left !important;
    margin-bottom: 0.5rem !important;
  }

  .hero-col-left .lead-text {
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
    text-align: left !important;
    margin-bottom: 0 !important;
  }

  .hero-col-right .h2 {
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
    text-align: left !important;
    margin-bottom: 0.5rem !important;
  }

  .hero-col-right .statement-text {
    font-size: 0.85rem !important;
    line-height: 1.45 !important;
    margin-bottom: 0.4rem !important;
  }

  .hero-col-right p {
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
    color: var(--color-text-muted) !important;
    margin-bottom: 0 !important;
  }

  /* 2. ECOSYSTEM ARCHITECTURE SECTION — 5 CARDS IN 1 HORIZONTAL ROW */
  .ecosystem-diagram-header,
  .ecosystem-diagram-header .h2,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) h2 {
    text-align: center !important;
    margin-inline: auto !important;
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.75rem !important;
  }

  .ecosystem-parent-node {
    margin-inline: auto !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    max-width: 320px !important;
  }

  .ecosystem-parent-title {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
  }

  .ecosystem-parent-sub {
    font-size: 0.725rem !important;
  }

  .ecosystem-nodes-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) .ecosystem-nodes-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  .ecosystem-node-card,
  .ecosystem-nodes-grid .ecosystem-node-card {
    grid-column: span 1 !important;
    width: 100% !important;
    padding: 0.85rem 0.45rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    height: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  /* Ordering for Architecture Cards: Icon -> Heading -> Description -> Badge -> Sub-connector */
  .ecosystem-node-card .ecosystem-node-icon,
  .ecosystem-node-card .card-icon {
    order: 1 !important;
    margin-inline: auto !important;
    margin-bottom: 0.35rem !important;
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
  }

  .ecosystem-node-card .h4,
  .ecosystem-node-card .h3,
  .ecosystem-node-card h3,
  .ecosystem-node-card h4 {
    order: 2 !important;
    font-size: 0.825rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.25rem !important;
    font-weight: 700 !important;
  }

  .ecosystem-node-card p,
  .ecosystem-node-card .text-xs,
  .ecosystem-node-card .ecosystem-node-desc {
    order: 3 !important;
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
    color: var(--color-text-muted) !important;
  }

  .ecosystem-node-card .badge {
    order: 4 !important;
    font-size: 0.575rem !important;
    padding: 0.15rem 0.35rem !important;
    white-space: nowrap !important;
    margin-inline: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .ecosystem-node-card .ecosystem-sub-connector,
  .ecosystem-node-card .btn {
    order: 5 !important;
    margin-top: 0.35rem !important;
    margin-inline: auto !important;
    font-size: 0.65rem !important;
  }

  /* 3. ECOSYSTEM PILLARS SECTION — 5 CARDS IN 1 HORIZONTAL ROW */
  .pillars-section .section-header,
  .pillars-section .section-header .h2,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) h2 {
    text-align: center !important;
    margin-inline: auto !important;
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.75rem !important;
  }

  .pillars-5-grid,
  .pillars-section .pillars-5-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) .pillars-5-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .pillars-5-grid > .card,
  .pillars-5-grid .pillar-card {
    grid-column: span 1 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 100% !important;
    padding: 0.95rem 0.5rem 0.85rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
  }

  /* Visual Hierarchy for Pillar Cards: 1. Icon, 2. Heading, 3. Description, 4. Badge, 5. Button */
  .pillars-5-grid .card-icon,
  .pillars-5-grid .card-icon-centered {
    order: 1 !important;
    width: 32px !important;
    height: 32px !important;
    flex-shrink: 0 !important;
    margin-inline: auto !important;
    margin-bottom: 0.4rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
  }

  .pillars-5-grid .card-icon-secondary {
    background-color: var(--color-secondary-light) !important;
    color: var(--color-secondary) !important;
  }

  .pillars-5-grid .card-icon svg {
    width: 16px !important;
    height: 16px !important;
  }

  .pillars-5-grid .h3,
  .pillars-5-grid h3 {
    order: 2 !important;
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.3rem !important;
    font-weight: 700 !important;
  }

  .pillars-5-grid p {
    order: 3 !important;
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin-bottom: 0.4rem !important;
    color: var(--color-text-muted) !important;
  }

  .pillars-5-grid .badge {
    order: 4 !important;
    font-size: 0.575rem !important;
    padding: 0.125rem 0.35rem !important;
    white-space: nowrap !important;
    margin-inline: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Pillar 5 Button (Campus Life Express) */
  .pillars-5-grid .btn,
  .pillars-5-grid .btn-sm {
    order: 5 !important;
    margin-inline: auto !important;
    align-self: center !important;
    margin-top: 0.4rem !important;
    padding: 0.3rem 0.5rem !important;
    font-size: 0.6875rem !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Ecosystem Architecture Node Cards Polish (Tablet Only) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > p:nth-of-type(1) {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > h3:nth-of-type(1) {
    margin-top: -5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(2) > p:nth-of-type(1) {
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(3) > h3:nth-of-type(1) {
    margin-top: 4px !important;
  }

  /* Ecosystem Pillars Cards Typography & Badge Polish (Tablet Only) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(1) {
    margin-top: 22px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > span:nth-of-type(1) {
    margin-top: 54px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1) {
    margin-top: 38px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > span:nth-of-type(1) {
    margin-top: 6px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    width: 300px !important;
    margin-left: 20px !important;
  }

  /* 4. HOW IT CONNECTS SECTION — 4 CARDS IN 1 HORIZONTAL ROW (ALL CONTENT CENTERED) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) .section-header,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) h2 {
    text-align: center !important;
    margin-inline: auto !important;
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.75rem !important;
  }

  .how-it-connects-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) .how-it-connects-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .how-it-connects-grid > .connect-card,
  .how-it-connects-grid > .card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    padding: 1.1rem 0.75rem !important;
    height: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .how-it-connects-grid .card-icon-centered {
    margin-inline: auto !important;
    margin-bottom: 0.4rem !important;
    width: 34px !important;
    height: 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
  }

  .how-it-connects-grid .card-icon-secondary {
    background-color: var(--color-secondary-light) !important;
    color: var(--color-secondary) !important;
  }

  .how-it-connects-grid .card-icon svg {
    width: 18px !important;
    height: 18px !important;
  }

  .how-it-connects-grid .h4,
  .how-it-connects-grid h3 {
    text-align: center !important;
    font-size: 0.9rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.3rem !important;
    font-weight: 700 !important;
  }

  .how-it-connects-grid p {
    text-align: center !important;
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
    margin-bottom: 0 !important;
    color: var(--color-text-muted) !important;
  }

  /* 5. LONG TERM VISION SECTION — H2 CENTERED, 2-COLUMN BELOW (DESCRIPTION LEFT, 2X2 CARDS RIGHT) */
  .vision-section .section-header,
  .vision-section .section-header .h2,
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) h2 {
    text-align: center !important;
    margin-inline: auto !important;
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.75rem !important;
  }

  .vision-content-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) .vision-content-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.5rem !important;
    align-items: start !important;
    margin-top: 0.5rem !important;
    width: 100% !important;
  }

  .vision-description-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    text-align: left !important;
  }

  .vision-description-col .statement-text {
    font-size: 0.85rem !important;
    line-height: 1.45 !important;
    margin-bottom: 0 !important;
  }

  .vision-description-col p {
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
    color: var(--color-text-muted) !important;
    margin-bottom: 0 !important;
  }

  .vision-content-grid .principles-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.65rem !important;
    margin-top: 0 !important;
    width: 100% !important;
  }

  .vision-content-grid .principle-card {
    padding: 0.85rem 0.65rem !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background-color: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-md) !important;
    box-sizing: border-box !important;
  }

  .vision-content-grid .principle-card .h4,
  .vision-content-grid .principle-card h3 {
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.2rem !important;
    font-weight: 700 !important;
  }

  .vision-content-grid .principle-card p {
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
  }

  /* Focused Tablet Style Adjustments (<992px) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    text-align: center !important;
    font-size: 21.6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h2:nth-of-type(1) {
    text-align: center !important;
    font-size: 18px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    text-align: justify !important;
    padding-top: 0px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 13.2px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
    padding-left: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-top: 15px !important;
    font-size: 13.2px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
    line-height: 15.6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > a:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    line-height: 20px !important;
    padding-left: 0px !important;
    padding-top: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    line-height: 20px !important;
    font-size: 13.6px !important;
    padding-top: 6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    background-color: #f6f6f6 !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    color: #08215d !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    color: #5a5d5d !important;
    font-size: 13.23px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    color: #08215d !important;
    border-width: 1px !important;
    border-style: outset !important;
    border-color: #08215d !important;
  }

  /* Ecosystem Architecture Tablet Card Adjustments (<992px) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) {
    min-height: 121.844px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(5) {
    height: 120px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 12px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 12px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  /* Footer Tablet Alignments (<992px) */
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2),
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3),
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) {
    text-align: center !important;
  }

  /* ==========================================================================
     CONTACT PAGE — TABLET RESPONSIVE POLISH (<992px / 768px–1024px)
     Scoped strictly to .contact-page for tablet view
     ========================================================================== */

  /* 1. HERO / INTRODUCTORY SECTION */
  .contact-page .contact-hero-section {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .contact-page .contact-intro-section {
    padding-top: 0.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .contact-page .contact-hero-title {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin-inline: auto !important;
    margin-bottom: 0.5rem !important;
  }

  .contact-page .contact-hero-desc {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
    max-width: 580px !important;
    margin-inline: auto !important;
    color: var(--color-text-body) !important;
  }

  /* 2. MAIN 2-COLUMN GRID (OFFICIAL CONTACT DETAILS + SEND US A MESSAGE) */
  .contact-page .contact-grid-section {
    padding-block: 1.5rem !important;
  }

  .contact-page .grid-contact {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Both Cards Matching Height & Padding */
  .contact-page .contact-details-card,
  .contact-page .contact-form-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 1.25rem 1rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--shadow-sm) !important;
    background-color: var(--color-white) !important;
    box-sizing: border-box !important;
  }

  .contact-page .contact-card-title {
    text-align: center !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 0.35rem !important;
  }

  .contact-page .contact-card-intro {
    text-align: center !important;
    font-size: 0.775rem !important;
    line-height: 1.4 !important;
    max-width: 100% !important;
    margin-bottom: 1.25rem !important;
    color: var(--color-text-muted) !important;
  }

  /* 3. OFFICIAL CONTACT DETAILS CARD — VERTICAL LEFT-ALIGNED STRUCTURE */
  .contact-page .contact-details-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
  }

  .contact-page .contact-details-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
    text-align: left !important;
  }

  /* Left & Right Columns -> All Vertical & Left Aligned */
  .contact-page .contact-col-left,
  .contact-page .contact-col-right {
    text-align: left !important;
  }

  .contact-page .contact-col-left .contact-detail-item,
  .contact-page .contact-col-right .contact-detail-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
    text-align: left !important;
  }

  .contact-page .contact-detail-icon {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
    color: var(--color-primary) !important;
  }

  .contact-page .contact-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: var(--color-text-main, #1e293b) !important;
    margin-bottom: 0.15rem !important;
    display: block !important;
  }

  .contact-page .contact-val,
  .contact-page .contact-detail-text {
    font-size: 0.75rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    word-break: break-word !important;
  }

  /* 4. SEND US A MESSAGE FORM CARD */
  .contact-page #contactForm {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.65rem !important;
  }

  .contact-page #contactForm .form-group {
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .form-row-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    width: 100% !important;
  }

  .contact-page #contactForm .form-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.25rem !important;
    color: var(--color-text-main, #334155) !important;
  }

  .contact-page #contactForm .form-control {
    font-size: 0.775rem !important;
    padding: 0.45rem 0.65rem !important;
    border-radius: var(--radius-md, 6px) !important;
    border: 1px solid var(--color-border) !important;
    background-color: var(--color-white) !important;
  }

  .contact-page #contactForm textarea.form-control {
    resize: vertical !important;
    min-height: 70px !important;
    height: 75px !important;
  }

  .contact-page #contactForm button[type="submit"] {
    margin-top: 0.35rem !important;
    padding: 0.55rem 1.15rem !important;
    font-size: 0.825rem !important;
    font-weight: 600 !important;
    border-radius: var(--radius-md, 6px) !important;
  }

  /* 5. INTERESTED IN WORKING WITH US SECTION */
  .contact-page .contact-partnership-section {
    padding-block: 1.5rem !important;
    text-align: center !important;
  }

  .contact-page .contact-partnership-title {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.4rem !important;
  }

  .contact-page .contact-partnership-desc {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    max-width: 520px !important;
    margin-inline: auto !important;
    text-align: center !important;
    color: var(--color-text-muted) !important;
  }

  .contact-page .contact-partnership-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.6rem 1.25rem !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }

  /* 6. FINAL CTA BANNER */
  .contact-page .contact-cta-section {
    padding-block: 1.5rem 2.25rem !important;
  }

  .contact-page .contact-cta-section .cta-banner {
    max-width: 720px !important;
    width: 100% !important;
    margin-inline: auto !important;
    padding: 2rem 1.5rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    text-align: center !important;
  }

  .contact-page .contact-cta-eyebrow {
    display: block !important;
    font-size: 0.725rem !important;
    letter-spacing: 0.08em !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .contact-page .contact-cta-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
  }

  .contact-page .contact-cta-desc {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    max-width: 500px !important;
    margin-inline: auto !important;
    text-align: center !important;
    margin-bottom: 1.25rem !important;
  }

  .contact-page .contact-cta-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.65rem 1.35rem !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-weight: normal !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > nav:nth-of-type(1) {
    text-align: left !important;
    padding-left: 35px !important;
    margin-left: 0px !important;
    padding-right: 550px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) {
    padding-bottom: 23px !important;
    padding-top: 23px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-top: 43px !important;
    margin-left: -25px !important;
    padding-bottom: 8.8px !important;
    margin-bottom: 0px !important;
    height: 185px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    margin-top: 43px !important;
    height: 185px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    width: 315.889px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    text-align: justify !important;
    padding-left: 2px !important;
    padding-right: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    line-height: 13px !important;
    padding-top: 1px !important;
  }

  /* Why We Exist — 3 selections horizontally in one line for tablet responsive only */
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }
}

/* ==========================================================================
   DESKTOP / LAPTOP BREAKPOINT (min-width: 1025px)
   All homepage polish modifications scoped specifically here.
   ========================================================================== */
@media (min-width: 1025px) {

  /* 1. GLOBAL HOMEPAGE SECTION SPACING & RHYTHM */
  .section {
    padding-block: 2.25rem; /* Reduced compact top/bottom section padding */
  }

  .section-header {
    margin-bottom: 1.25rem; /* Reduced space between header & section content */
  }

  /* 2. HERO SECTION — DESKTOP POLISH */
  .hero-section {
    padding-top: 1.1rem; /* Small comfortable spacing immediately below sticky header */
    padding-bottom: 1.25rem; /* Reduced bottom padding */
    margin-bottom: 0;
  }

  .hero-grid {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 2.25rem;
    align-items: center;
  }

  .hero-badge-pill {
    margin-bottom: 0.5rem;
  }

  .hero-headline {
    font-size: 2.75rem;
    line-height: 1.12;
    margin-bottom: 0.75rem;
  }

  .hero-description {
    font-size: 0.975rem;
    line-height: 1.55;
    margin-bottom: 1rem;
    max-width: 54ch;
  }

  .btn-group-responsive {
    display: flex;
    flex-direction: row;
    width: auto;
    gap: 0.6rem;
  }

  .btn-group-responsive .btn {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0.65rem 1.25rem;
    font-size: 0.85rem;
  }

  .hero-visual {
    justify-content: flex-end;
  }

  .hero-visual-card {
    max-width: 540px;
    padding: 0.6rem;
  }

  /* 3. WHO WE ARE SECTION — DESKTOP POLISH */
  #who-we-are {
    padding-block: 2.25rem;
  }

  .who-we-are-eyebrow-container {
    text-align: center;
    margin-bottom: 1.25rem;
  }

  .who-we-are-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    align-items: start;
  }

  .who-we-are-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .who-we-are-content .h2 {
    text-align: left;
    margin-bottom: 0.75rem;
  }

  .who-we-are-right {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .who-we-are-cards-grid {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }

  .who-we-are-card {
    padding: 1.15rem 1rem;
    min-height: 180px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  .who-we-are-card .card-icon {
    margin-inline: auto;
    margin-bottom: 0.65rem;
  }

  .who-we-are-card .h3 {
    text-align: center;
    font-size: 1.1rem;
    margin-bottom: 0.35rem;
  }

  .who-we-are-card p {
    text-align: center;
    font-size: 0.825rem;
    line-height: 1.5;
  }

  /* 4. WHAT WE DO SECTION — DESKTOP POLISH */
  #what-we-do {
    padding-block: 2.25rem;
  }

  .what-we-do-header {
    margin-bottom: 1.25rem;
  }

  .what-we-do-header .eyebrow {
    display: block;
    text-align: left;
  }

  .what-we-do-header .h2 {
    text-align: left;
    margin-bottom: 0;
  }

  .what-we-do-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
  }

  .what-we-do-card {
    padding: 1.15rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
  }

  .what-we-do-card .card-icon {
    margin-inline: auto;
    margin-bottom: 0.75rem;
  }

  .what-we-do-card .card-title {
    text-align: center;
    font-size: 1.05rem;
    margin-bottom: 0.4rem;
  }

  .what-we-do-card .card-body {
    text-align: center;
  }

  .what-we-do-card .card-body p {
    text-align: center;
    font-size: 0.825rem;
    line-height: 1.5;
  }

  .what-we-do-card .card-footer {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: auto;
    padding-top: 0.5rem;
  }

  /* 5. PRODUCT SHOWCASE SECTION — DESKTOP POLISH */
  #products {
    padding-block: 2.25rem;
  }

  .product-showcase-header {
    margin-bottom: 1rem;
  }

  .product-showcase-header .eyebrow {
    text-align: center;
    display: block;
    margin-inline: auto;
  }

  .product-showcase-header .h2 {
    text-align: left;
    margin-bottom: 0;
  }

  .product-showcase-card {
    padding: 1.5rem;
    margin-top: 0.75rem;
  }

  .product-showcase-inner-grid {
    grid-template-columns: 1.15fr 0.85fr;
    gap: 2rem;
    align-items: center;
  }

  .product-detail-column {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .product-detail-box {
    padding: 0.85rem 1rem;
  }

  /* 6. DIGITAL ECOSYSTEM SECTION — DESKTOP POLISH */
  #ecosystem {
    padding-block: 2.25rem;
  }

  .ecosystem-nodes-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.85rem;
  }

  .ecosystem-node-card {
    padding: 1rem 0.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
  }

  .ecosystem-node-icon {
    margin-inline: auto;
    margin-bottom: 0.5rem;
  }

  .ecosystem-node-title {
    text-align: center;
    font-size: 0.95rem;
  }

  .ecosystem-node-product {
    text-align: center;
    font-size: 0.75rem;
  }

  .ecosystem-node-desc {
    text-align: center;
    font-size: 0.775rem;
    line-height: 1.45;
  }

  /* 7. OUR VALUE PILLARS SECTION — DESKTOP POLISH */
  #why-dandalin-sauki {
    padding-block: 2.25rem;
  }

  .pillars-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.85rem;
  }

  .pillar-card {
    padding: 1.15rem 0.85rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
  }

  .pillar-number {
    text-align: center;
    margin-bottom: 0.35rem;
  }

  .pillar-title {
    text-align: center;
    font-size: 1.05rem;
    margin-bottom: 0.4rem;
  }

  .pillar-desc {
    text-align: center;
    font-size: 0.8rem;
    line-height: 1.45;
  }

  /* 8. FINAL CTA — DESKTOP POLISH */
  #contact-cta {
    padding-block: 2rem;
  }

  .cta-banner {
    padding: 2.25rem 2rem;
  }

  .cta-banner-title {
    font-size: 2.15rem;
  }

  .cta-banner-desc {
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
  }
}

/* ==========================================================================
   ABOUT PAGE — DESKTOP/LAPTOP RESPONSIVE POLISH (1024px–1200px)
   ========================================================================== */
@media (min-width: 1024px) {

  /* Page Hero & Breadcrumbs */
  .page-hero {
    padding-top: 1.5rem;
    padding-bottom: 1.75rem;
  }

  .breadcrumbs {
    margin-bottom: 0.5rem;
    font-size: 0.8rem;
  }

  .page-hero-header {
    margin-top: 0.5rem;
  }

  .page-hero-header .eyebrow {
    font-size: 0.8rem;
    letter-spacing: 0.08em;
  }

  .page-hero-header .h1 {
    font-size: 2.35rem;
    line-height: 1.18;
    max-width: 24ch;
    margin-bottom: 0.65rem;
  }

  .page-hero-header .lead-text {
    font-size: 1rem;
    line-height: 1.55;
    max-width: 58ch;
  }

  /* Company Story Section */
  .container-narrow {
    width: min(100% - (var(--space-md) * 2), 800px);
    margin-inline: auto;
  }

  .statement-text {
    font-size: 1.05rem;
    line-height: 1.55;
    margin-bottom: 0.85rem;
  }

  /* Why We Exist Section Cards */
  .grid-3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.15rem;
  }

  /* Mission & Vision Grid */
  .mission-vision-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }

  .mission-card,
  .vision-card {
    padding: 1.35rem 1.25rem;
  }

  .mission-card .h2,
  .vision-card .h2 {
    font-size: 1.45rem;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .mission-themes {
    padding-top: 0.85rem;
    margin-top: 1rem;
  }

  .theme-tag {
    font-size: 0.75rem;
    padding: 0.2rem 0.55rem;
  }

  /* Leadership Grid */
  .leadership-grid {
    grid-template-columns: 260px 1fr;
    gap: 1.75rem;
    align-items: start;
  }

  /* CEO Message Section - Tablet Adjustments */
  .ceo-message-card {
    padding: 2.25rem !important;
  }

  .ceo-message-grid {
    grid-template-columns: 280px 1fr !important;
    gap: 2rem !important;
    align-items: center !important;
  }

  .ceo-portrait-wrapper {
    width: 200px !important;
    height: 250px !important;
  }

  .leadership-image-card {
    padding: 1.25rem 1rem;
  }

  .leadership-avatar-wrapper {
    width: 140px;
    height: 140px;
    margin-bottom: 0.75rem;
  }

  .leadership-name {
    font-size: 1.05rem;
  }

  .leadership-title {
    font-size: 0.75rem;
  }

  .principles-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.85rem;
  }

  .principle-card {
    padding: 0.85rem 0.75rem;
  }

  .principle-name {
    font-size: 0.85rem;
    margin-bottom: 0.2rem;
  }

  .principle-desc {
    font-size: 0.775rem;
    line-height: 1.4;
  }

  /* Progression Grid (Horizontal Flow) */
  .progression-grid {
    gap: 0.5rem;
  }

  .progression-step {
    padding: 0.85rem 0.6rem;
  }

  .progression-step-num {
    width: 26px;
    height: 26px;
    font-size: 0.75rem;
    margin-bottom: 0.35rem;
  }

  .progression-step-title {
    font-size: 0.825rem;
  }

  .progression-arrow svg {
    width: 20px;
    height: 20px;
  }

  /* ==========================================================================
     ABOUT PAGE — TABLET 992PX TARGETED RESPONSIVE FIXES
     ========================================================================== */

  /* 1. WHY WE EXIST — TABLET 3-CARD HORIZONTAL ROW */
  #why-we-exist .why-exist-grid,
  .why-exist-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    width: 100% !important;
  }

  #why-we-exist .why-exist-card,
  .why-exist-card {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    height: 100% !important;
  }

  /* 2. CEO MESSAGE — TABLET POLISH */
  #leadership .ceo-message-card,
  .ceo-message-card {
    width: 100% !important;
    max-width: 960px !important;
    margin-inline: auto !important;
  }

  /* 3. OUR DIRECTION — TABLET 2-CARD INTRO ROW */
  #our-direction .direction-split-grid,
  .direction-split-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    gap: 1.25rem !important;
  }

  #our-direction .direction-content,
  .direction-content {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    width: 100% !important;
    margin-bottom: 0 !important;
  }

  #our-direction .direction-desc-card,
  #our-direction .direction-highlight-box,
  .direction-desc-card,
  .direction-highlight-box {
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }

  #our-direction .direction-cards-grid,
  .direction-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    width: 100% !important;
  }

  #our-direction .direction-card,
  .direction-card {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* Reference Width (1200px) Refinements */
@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }

  .hero-grid {
    grid-template-columns: 1.1fr 0.9fr;
    gap: 2.5rem;
  }

  .product-showcase-inner-grid {
    grid-template-columns: 1.2fr 0.8fr;
    gap: 2.25rem;
  }
}

/* ==========================================================================
   PRODUCTS PAGE — DESKTOP/LAPTOP RESPONSIVE POLISH (min-width: 993px)
   Strictly scoped to Desktop view; does not affect tablet/mobile breakpoints.
   ========================================================================== */
@media (min-width: 993px) {

  /* 1. MERGED HERO & PHILOSOPHY GRID (2-COLUMN HORIZONTAL GRID) */
  .hero-philosophy-merged-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2.25rem !important;
    align-items: stretch !important;
    max-width: 1200px !important;
    margin-inline: auto !important;
    padding-inline: 1.5rem !important;
    padding-block: 1.75rem !important;
  }

  .hero-philosophy-merged-grid > section {
    padding-block: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .hero-philosophy-merged-grid > section .container {
    max-width: 100% !important;
    padding-inline: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .hero-philosophy-merged-grid .page-hero-header,
  .hero-philosophy-merged-grid .section-header,
  .hero-philosophy-merged-grid .container-narrow {
    text-align: left !important;
    margin-inline: 0 !important;
    max-width: 100% !important;
  }

  .hero-philosophy-merged-grid .lead-text {
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  /* 2. PRACTICAL / ACCESSIBLE / CONNECTED CARDS (3 CARDS HORIZONTALLY IN ONE ROW) */
  .philosophy-cards-section {
    padding-block: 1.25rem 2.25rem !important;
  }

  .philosophy-cards-section .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    align-items: stretch !important;
  }

  .philosophy-cards-section .grid-3 > .card {
    height: 100% !important;
    padding: 1.6rem 1.35rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .philosophy-cards-section .grid-3 > .card .card-icon {
    margin-inline: auto !important;
    margin-bottom: 0.85rem !important;
    flex-shrink: 0 !important;
  }

  .philosophy-cards-section .grid-3 > .card .h3 {
    text-align: center !important;
    margin-bottom: 0.4rem !important;
    font-size: 1.15rem !important;
  }

  .philosophy-cards-section .grid-3 > .card p {
    text-align: center !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
  }

  /* 3. CAMPUS LIFE EXPRESS (CLX) SHOWCASE CARD & BUTTON POSITIONING */
  #clx {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }

  #clx .product-showcase-card {
    position: relative !important;
    padding: 2.25rem 2rem 0px !important;
  }

  /* Top badge, Title and Lead text left-aligned with max-width to accommodate button */
  #clx .product-badges-row {
    margin-bottom: 0.75rem !important;
  }

  #clx .product-badges-row,
  #clx .h1,
  #clx .lead-text {
    max-width: calc(100% - 290px) !important;
    text-align: left !important;
  }

  /* Position "Visit Campus Life Express ->" button at TOP RIGHT of showcase card */
  #clx .card-footer {
    display: block !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    border-top: none !important;
  }

  #clx .card-footer > div:first-child {
    position: absolute !important;
    top: 2.25rem !important;
    right: 2rem !important;
    margin: 0 !important;
    z-index: 10 !important;
  }

  /* 4. CLX PROBLEM & SOLUTION (2 EQUAL COLUMNS) */
  #clx .product-grid-details {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    margin-top: 1.75rem !important;
    margin-bottom: 2rem !important;
    align-items: stretch !important;
  }

  #clx .product-detail-box,
  #clx .product-detail-box-sec {
    height: 100% !important;
    padding: 1.35rem 1.25rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  /* 5. DESIGNED FOR CAMPUS COMMUNITIES (HEADING CENTERED, 3 CARDS IN 1 ROW) */
  #clx .mt-lg h3 {
    text-align: center !important;
    margin-bottom: 1.15rem !important;
    font-size: 1.25rem !important;
  }

  #clx .mt-lg .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    align-items: stretch !important;
  }

  #clx .mt-lg .grid-3 > .card {
    padding: 1.25rem 1.15rem !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* 6. HOW CAMPUS LIFE EXPRESS WORKS (HEADING CENTERED, 4 STEPS IN 1 ROW) */
  #clx .mt-xl {
    padding-top: 1.75rem !important;
    margin-top: 2rem !important;
  }

  #clx .mt-xl h3 {
    text-align: center !important;
    margin-bottom: 1.25rem !important;
    font-size: 1.25rem !important;
  }

  #clx .progression-grid > .grid-4,
  #clx .progression-grid .grid-4 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.15rem !important;
    width: 100% !important;
  }

  #clx .progression-step {
    padding: 1.25rem 1rem !important;
    text-align: center !important;
    height: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background-color: var(--color-bg-alt, #f8fafc) !important;
    border: 1px solid var(--color-border, #e2e8f0) !important;
    border-radius: var(--radius-md, 8px) !important;
  }

  #clx .progression-step-num {
    margin-inline: auto !important;
    width: 32px !important;
    height: 32px !important;
    font-size: 0.9rem !important;
    line-height: 32px !important;
  }

  #clx .progression-step-title {
    text-align: center !important;
    margin-top: 0.5rem !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
  }

  #clx .progression-step p {
    text-align: center !important;
    font-size: 0.8rem !important;
    margin-top: 0.25rem !important;
  }

  /* 7. OUR PRODUCT ROADMAP (5 CARDS HORIZONTALLY ON DESKTOP/LAPTOP) */
  main#mainContent > section:nth-of-type(4) .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  .product-roadmap-card {
    height: 100% !important;
    padding: 1.15rem 0.85rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .product-roadmap-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.35rem !important;
    margin-bottom: 0.6rem !important;
    width: 100% !important;
  }

  .product-roadmap-card .badge {
    font-size: 0.65rem !important;
    padding: 0.2rem 0.45rem !important;
    white-space: nowrap !important;
  }

  .product-roadmap-card .h3 {
    font-size: 1rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.35rem !important;
    line-height: 1.25 !important;
  }

  .product-roadmap-card .card-desc {
    font-size: 0.8rem !important;
    line-height: 1.45 !important;
  }

  /* 8. TRANSPARENT ROADMAP SECTION (4 STATUS CARDS IN ONE ROW, CENTERED) */
  .status-legend-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.15rem !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  .status-legend-box {
    padding: 1.25rem 1rem !important;
    height: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .status-legend-box > div {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .status-legend-box p {
    text-align: center !important;
    font-size: 0.8125rem !important;
    line-height: 1.45 !important;
    margin-top: 0.5rem !important;
  }

  /* 9. ONE CONNECTED VISION / ECOSYSTEM CALLOUT (CENTERED, PROPORTIONATE) */
  .ecosystem-callout {
    background-color: var(--color-bg-alt) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-xl, 16px) !important;
    padding: 2.5rem 2.25rem !important;
    text-align: center !important;
    max-width: 900px !important;
    margin-inline: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .ecosystem-callout .section-header {
    text-align: center !important;
    margin-inline: auto !important;
    margin-bottom: 1rem !important;
  }

  .ecosystem-callout .eyebrow {
    display: block !important;
    text-align: center !important;
    margin-bottom: 0.4rem !important;
  }

  .ecosystem-callout .h2 {
    text-align: center !important;
  }

  .ecosystem-callout .lead-text {
    text-align: center !important;
    max-width: 720px !important;
    margin-inline: auto !important;
    margin-bottom: 1.5rem !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  .ecosystem-callout > div:last-child {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  /* 10. CLOSING CTA BANNER (WIDER, CENTERED, PROFESSIONAL) */
  .cta-banner {
    max-width: 950px !important;
    padding: 2.75rem 2.25rem !important;
    border-radius: var(--radius-xl, 16px) !important;
    text-align: center !important;
    margin-inline: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .cta-banner .eyebrow {
    text-align: center !important;
    display: block !important;
  }

  .cta-banner-title {
    text-align: center !important;
    margin-bottom: 0.75rem !important;
    font-size: 1.75rem !important;
  }

  .cta-banner-desc {
    text-align: center !important;
    max-width: 660px !important;
    margin-inline: auto !important;
    margin-bottom: 1.5rem !important;
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
  }

  .cta-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1rem !important;
    width: 100% !important;
  }
}


/* ==========================================================================
   ABOUT PAGE — MOBILE RESPONSIVE POLISH (max-width: 768px)
   ========================================================================== */
@media (max-width: 768px) {

  /* GLOBAL MOBILE SAFETY & TYPOGRAPHY */
  html, body {
    overflow-x: hidden !important;
  }

  .section {
    padding-block: 1.15rem !important;
  }

  .section-header {
    margin-bottom: 0.65rem !important;
    text-align: center !important;
  }

  .section-header .h2,
  .section-header h2 {
    font-size: 1.25rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.35rem !important;
    text-align: center !important;
  }

  /* 1. HERO SECTION */
  .page-hero {
    padding-top: 0.85rem !important;
    padding-bottom: 0.75rem !important;
  }

  .page-hero .breadcrumbs {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.4rem !important;
    font-size: 0.75rem !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .page-hero-header {
    text-align: center !important;
  }

  .page-hero-header .eyebrow {
    text-align: center !important;
    display: block !important;
    margin-inline: auto !important;
  }

  .page-hero-header .h1 {
    text-align: center !important;
    font-size: 1.5rem !important;
    line-height: 1.2 !important;
    margin-inline: auto !important;
    margin-bottom: 0.4rem !important;
  }

  .page-hero-header .lead-text {
    text-align: center !important;
    font-size: 0.8125rem !important;
    line-height: 1.4 !important;
    margin-inline: auto !important;
  }

  /* 2. ABOUT US + OUR STORY */
  #about-story {
    padding-block: 1.15rem !important;
  }

  #about-story .about-story-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  #about-story .about-story-card {
    width: 100% !important;
    padding: 0.95rem 0.85rem !important;
    display: flex !important;
    flex-direction: column !important;
  }

  #about-story .about-story-header {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  #about-story .about-story-header .card-icon {
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0 !important;
  }

  #about-story .about-story-header .card-title-primary {
    font-size: 0.95rem !important;
    margin-bottom: 0 !important;
  }

  #about-story .about-story-card p {
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
  }

  /* 3. WHY WE EXIST — 1 Full Width Row + 2 Half Width Cards Row */
  #why-we-exist {
    padding-block: 1.15rem !important;
  }

  #why-we-exist .why-exist-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }

  #why-we-exist .why-exist-card {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.75rem 0.6rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  /* Card 1 (Problem) spans full width */
  #why-we-exist .why-exist-card:nth-child(1) {
    grid-column: 1 / -1 !important;
  }

  /* Cards 2 & 3 take half width each */
  #why-we-exist .why-exist-card:nth-child(2),
  #why-we-exist .why-exist-card:nth-child(3) {
    grid-column: span 1 !important;
  }

  #why-we-exist .why-exist-card .pillar-number {
    font-size: 0.6rem !important;
    margin-bottom: 0.15rem !important;
    letter-spacing: 0.5px !important;
  }

  #why-we-exist .why-exist-card .card-title {
    font-size: 0.85rem !important;
    margin-bottom: 0.2rem !important;
  }

  #why-we-exist .why-exist-card .card-desc {
    font-size: 0.75rem !important;
    line-height: 1.35 !important;
  }

  /* 4. OUR VALUES — 2 Cards per row */
  #our-values {
    padding-block: 1.15rem !important;
  }

  #our-values .values-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }

  #our-values .value-card {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.75rem 0.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  #our-values .card-icon {
    width: 30px !important;
    height: 30px !important;
    margin-bottom: 0.25rem !important;
    margin-inline: auto !important;
  }

  #our-values .card-title {
    font-size: 0.825rem !important;
    margin-bottom: 0.2rem !important;
  }

  #our-values .card-desc {
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
  }

  /* 5. CEO MESSAGE SECTION — MOBILE RESPONSIVE */
  #leadership,
  main#mainContent > section#leadership,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5),
  .ceo-message-section {
    padding-block: 2.25rem !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    position: relative !important;
  }

  #leadership > div,
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
    box-sizing: border-box !important;
  }

  .ceo-message-card {
    padding: 1.25rem 1rem !important;
    border-radius: 0.875rem !important;
    box-shadow: 0 4px 16px rgba(5, 16, 102, 0.06) !important;
  }

  .ceo-message-grid {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  .ceo-profile-card {
    padding: 1.25rem 0.85rem !important;
  }

  .ceo-portrait-wrapper {
    width: 170px !important;
    height: 215px !important;
    margin-bottom: 1rem !important;
  }

  .ceo-portrait-badge {
    font-size: 0.7rem !important;
    padding: 0.25rem 0.75rem !important;
    bottom: 0.5rem !important;
  }

  .ceo-name {
    font-size: 1.2rem !important;
  }

  .ceo-role {
    font-size: 0.825rem !important;
  }

  .ceo-company {
    font-size: 0.775rem !important;
  }

  .ceo-key-focus {
    gap: 0.5rem !important;
  }

  .ceo-focus-item {
    padding: 0.5rem 0.75rem !important;
  }

  .ceo-focus-label {
    font-size: 0.65rem !important;
  }

  .ceo-focus-val {
    font-size: 0.75rem !important;
  }

  .ceo-letter-quote-mark {
    font-size: 3.5rem !important;
    margin-bottom: -0.5rem !important;
  }

  .ceo-letter-headline {
    font-size: 1.125rem !important;
    line-height: 1.4 !important;
    margin-bottom: 1rem !important;
  }

  .ceo-letter-paragraph {
    font-size: 0.875rem !important;
    line-height: 1.65 !important;
    margin-bottom: 0.85rem !important;
  }

  .ceo-signature-text {
    font-size: 1.35rem !important;
  }

  .ceo-signoff-name {
    font-size: 0.875rem !important;
  }

  .ceo-signoff-title {
    font-size: 0.75rem !important;
  }

  /* 6. OUR DIRECTION */
  #our-direction,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) {
    padding-top: 1.25rem !important;
    padding-bottom: 2.75rem !important;
    padding-block: 1.25rem 2.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    height: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    height: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1),
  #our-direction h2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
    font-size: 1.25rem !important;
    line-height: 1.3 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-direction .direction-split-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    gap: 0.75rem !important;
    margin: 0 !important;
    height: auto !important;
  }

  #our-direction .direction-content,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    gap: 0.75rem !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-direction .direction-desc-card,
  #our-direction .direction-highlight-box {
    display: block !important;
    padding: 0.75rem 0.65rem !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    box-sizing: border-box !important;
    height: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    text-align: justify !important;
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.35rem !important;
    color: inherit !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  #our-direction .direction-content p {
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.35rem !important;
    color: inherit !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  #our-direction .direction-highlight-box .pillar-number {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 0.25rem !important;
    padding-bottom: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    text-align: justify !important;
    font-size: 0.775rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  #our-direction .direction-highlight-box p {
    font-size: 0.775rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  #our-direction .direction-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4),
  #our-direction .direction-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0.65rem 0.5rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1),
  #our-direction .direction-card-num {
    font-size: 0.75rem !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > h3,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > h3:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > h3:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > h3:nth-of-type(1),
  #our-direction .direction-card .card-title-primary,
  #our-direction .direction-card h3 {
    font-size: 0.825rem !important;
    line-height: 1.25 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > p,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1),
  #our-direction .direction-card p {
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    padding-top: 0 !important;
    text-align: center !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  /* 7. CTA BANNER */
  #contact-cta {
    padding-block: 1.15rem !important;
  }

  #contact-cta .cta-banner {
    padding: 1.15rem 0.85rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  #contact-cta .cta-banner-title {
    font-size: 1.25rem !important;
    margin-bottom: 0.35rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
  }

  #contact-cta .cta-banner-desc {
    font-size: 0.775rem !important;
    line-height: 1.35 !important;
    margin-bottom: 0.75rem !important;
    text-align: center !important;
  }

  #contact-cta .cta-banner .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    width: auto !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #contact-cta .cta-banner .btn {
    width: auto !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    min-height: 32px !important;
    padding: 0.35rem 0.75rem !important;
    font-size: 0.75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   SMALL MOBILE RESPONSIVE REFINEMENT (max-width: 480px ONLY)
   ========================================================================== */
@media (max-width: 480px) {

  /* Prevent horizontal overflow on small mobile */
  html, body {
    overflow-x: hidden;
  }

  /* 1. HOMEPAGE SECTION SPACING & RHYTHM */
  .section {
    padding-block: 1.15rem !important;
  }

  .section-header,
  .who-we-are-header-row,
  .ecosystem-header-row,
  .pillars-header-row,
  .product-showcase-header,
  .what-we-do-header {
    margin-bottom: 0.65rem !important;
  }

  /* 2. HERO SECTION — SMALL MOBILE */
  .hero-section {
    padding-top: 1rem !important;
    padding-bottom: 14.4px !important;
  }

  .hero-headline {
    font-size: 16px !important;
    line-height: 20px !important;
    margin-top: 2px !important;
    margin-bottom: 0.5rem !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    text-align: left !important;
  }

  .hero-description {
    font-size: 11px !important;
    line-height: 16px !important;
    margin-bottom: 0.85rem !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    text-align: justify !important;
  }

  .hero-badge-pill {
    margin-inline: 0 !important;
    margin-left: 3px !important;
    margin-bottom: 4px !important;
    padding: 0.2rem 0.5rem !important;
    font-size: 10px !important;
    line-height: 12px !important;
    text-align: left !important;
  }

  /* Hero CTA Buttons — Horizontally aligned on same line */
  .hero-section .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    gap: 0.35rem !important;
    justify-content: center !important;
    align-items: center !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }

  .hero-section .btn-group-responsive .btn {
    min-width: 0 !important;
    min-height: 25px !important;
    height: 25px !important;
    padding: 0.15rem 0.5rem !important;
    font-size: 11px !important;
    line-height: 12px !important;
    text-align: center !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .hero-section .btn-group-responsive .btn-primary {
    flex: 1.35 1 0% !important;
    width: 58% !important;
    max-width: 60% !important;
    height: 25px !important;
    min-height: 25px !important;
  }

  .hero-section .btn-group-responsive .btn-outline {
    flex: 1 1 0% !important;
    width: 38% !important;
    max-width: 40% !important;
  }

  /* Hero / Ecosystem Diagram — Readable text, contained inside nodes */
  .hero-visual-card {
    padding: 0.4rem !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
  }

  .hero-svg-wrapper svg text {
    font-size: 13.5px !important;
  }

  /* 3. WHO WE ARE SECTION — SMALL MOBILE */
  #who-we-are {
    padding-top: 10.4px !important;
    padding-bottom: 12px !important;
  }

  .who-we-are-header-row {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }

  .who-we-are-eyebrow-container {
    text-align: center !important;
    width: 100% !important;
  }

  .who-we-are-eyebrow-container .h2,
  .who-we-are-eyebrow-container h2 {
    text-align: center !important;
    font-size: 15px !important;
    line-height: 20px !important;
    margin-bottom: 0 !important;
  }

  .who-we-are-top-link {
    display: none !important;
  }

  .who-we-are-content .h3,
  .who-we-are-content h3 {
    text-align: left !important;
    font-size: 14px !important;
    line-height: 17px !important;
    margin-left: 6px !important;
    margin-bottom: 0.4rem !important;
    padding-bottom: 3px !important;
  }

  .who-we-are-content .lead-text,
  .who-we-are-content p:nth-of-type(1) {
    font-size: 11px !important;
    line-height: 17px !important;
    text-align: justify !important;
    margin-left: 6px !important;
    margin-right: 6px !important;
    margin-bottom: 4.4px !important;
  }

  .who-we-are-content p:nth-of-type(2) {
    font-size: 11px !important;
    line-height: 16px !important;
    text-align: justify !important;
    margin-left: 6px !important;
    margin-right: 4px !important;
    margin-bottom: 0.5rem !important;
  }

  /* Value Cards — 2 Columns horizontally on same line */
  .who-we-are-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
    height: 138.38px !important;
    padding-top: 5px !important;
    width: 294.82px !important;
    margin-left: 17px !important;
    margin-top: -2px !important;
  }

  .who-we-are-card {
    padding: 0.65rem 0.5rem !important;
    text-align: center !important;
    height: 120px !important;
  }

  .who-we-are-card:nth-child(1) {
    width: 137px !important;
    height: 120px !important;
    padding-top: 10.4px !important;
    padding-left: 8px !important;
  }

  .who-we-are-card:nth-child(2) {
    width: 136px !important;
    height: 120px !important;
    padding-bottom: 10.4px !important;
  }

  .who-we-are-card .card-icon {
    margin-bottom: 5px !important;
  }

  .who-we-are-card:nth-child(1) .card-icon {
    width: 43px !important;
    height: 23px !important;
    margin-bottom: 5px !important;
    line-height: 25px !important;
  }

  .who-we-are-card:nth-child(2) .card-icon {
    width: 41px !important;
    height: 23px !important;
    margin-bottom: 5px !important;
    margin-top: -8px !important;
  }

  .who-we-are-card .card-icon svg {
    width: 21px !important;
    height: 21px !important;
  }

  .who-we-are-card .card-title-primary,
  .who-we-are-card .h3,
  .who-we-are-card h3 {
    font-size: 12px !important;
    line-height: 17px !important;
    margin-bottom: 0.25rem !important;
  }

  .who-we-are-card p {
    font-size: 10px !important;
    text-align: center !important;
    line-height: 1.35 !important;
  }

  .who-we-are-card:nth-child(1) p {
    line-height: 13.5px !important;
  }

  .who-we-are-bottom-btn-wrap {
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-inline: auto !important;
    margin-top: 0.5rem !important;
  }

  .who-we-are-bottom-btn-wrap .btn,
  .who-we-are-bottom-btn-wrap a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important;
    min-height: 24px !important;
    width: 122.54px !important;
    padding: 0.2rem 0.65rem !important;
    padding-top: 1.2px !important;
    font-size: 11px !important;
    margin-left: 6.14px !important;
    margin-top: -24px !important;
    margin-bottom: 6px !important;
    text-align: center !important;
  }

  /* 4. WHAT WE DO SECTION — SMALL MOBILE */
  #what-we-do {
    padding-top: 10.4px !important;
    padding-bottom: 10.4px !important;
  }

  .what-we-do-header {
    text-align: center !important;
  }

  .what-we-do-header .h2,
  .what-we-do-header h2 {
    text-align: center !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }

  .what-we-do-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 320px !important;
  }

  .what-we-do-card {
    padding: 0.65rem 0.5rem !important;
  }

  .what-we-do-card:nth-child(1) {
    width: 100% !important;
    max-width: 154px !important;
    height: 191px !important;
  }

  .what-we-do-card:nth-child(1) .card-icon {
    height: 36px !important;
  }

  .what-we-do-card:nth-child(2) {
    width: 100% !important;
    max-width: 154px !important;
    height: 190px !important;
  }

  .what-we-do-card:nth-child(2) p {
    margin-top: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: -13px !important;
  }

  .what-we-do-card:nth-child(2) .card-footer a,
  .what-we-do-card:nth-child(2) .btn-text {
    width: 112px !important;
    height: 24px !important;
    font-size: 11px !important;
    line-height: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .what-we-do-card:nth-child(3) {
    width: 100% !important;
    max-width: 154px !important;
    height: 190px !important;
  }

  .what-we-do-card:nth-child(3) .card-title,
  .what-we-do-card:nth-child(3) h3 {
    margin-bottom: 4.2px !important;
    margin-top: -7px !important;
  }

  .what-we-do-card:nth-child(3) p {
    margin-bottom: -13px !important;
    margin-top: 0px !important;
    padding-bottom: 0px !important;
  }

  .what-we-do-card:nth-child(3) .card-footer a,
  .what-we-do-card:nth-child(3) .btn-text {
    height: 24px !important;
    width: 112px !important;
    font-size: 11px !important;
    line-height: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .what-we-do-card:nth-child(4) {
    width: 100% !important;
    max-width: 154px !important;
    height: 190px !important;
  }

  .what-we-do-card:nth-child(4) .card-footer a,
  .what-we-do-card:nth-child(4) .btn-text {
    height: 24px !important;
    width: 113px !important;
    font-size: 11px !important;
    line-height: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .what-we-do-card .card-title,
  .what-we-do-card h3 {
    font-size: 12px !important;
    margin-bottom: 0.2rem !important;
  }

  .what-we-do-card p {
    font-size: 10px !important;
    line-height: 1.35 !important;
  }

  .what-we-do-card:nth-child(1) .card-footer a,
  .what-we-do-card:nth-child(1) .btn-text {
    height: 24px !important;
    width: 112.3px !important;
    font-size: 11px !important;
    margin-left: 0px !important;
    margin-top: -27px !important;
    line-height: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 5. PRODUCT SHOWCASE SECTION — SMALL MOBILE */
  #products {
    padding-bottom: 11.4px !important;
  }

  .product-showcase-grid {
    height: 330.65px !important;
  }

  #products .container {
    margin-top: -13px !important;
  }

  .product-showcase-header {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  .product-header-text {
    text-align: center !important;
    width: 100% !important;
  }

  .product-header-text .h2,
  .product-header-text h2 {
    text-align: center !important;
    font-size: 15px !important;
    line-height: 20px !important;
    margin-top: 6px !important;
    margin-bottom: 16px !important;
    padding-top: 4px !important;
    padding-bottom: 2px !important;
  }

  .product-top-link {
    display: none !important;
  }

  .product-showcase-card {
    padding: 0.75rem !important;
    padding-top: 12px !important;
    padding-left: 12px !important;
    margin-top: -14px !important;
    margin-left: 3px !important;
    margin-right: -3px !important;
    height: 307px !important;
  }

  .product-main-content {
    width: 100% !important;
    max-width: 306.3px !important;
    padding-bottom: 0px !important;
  }

  .product-badges-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.35rem !important;
    align-items: center !important;
    margin-bottom: 0.35rem !important;
  }

  .badge-clx {
    font-size: 8px !important;
    padding: 0.125rem 0.35rem !important;
    padding-left: 0px !important;
    white-space: nowrap !important;
  }

  .badge-active {
    font-size: 7.5px !important;
    padding: 0.125rem 0.35rem !important;
    padding-left: 3.6px !important;
    white-space: nowrap !important;
  }

  .product-main-content .h2,
  .product-main-content h3.h2,
  .product-main-content h3 {
    font-size: 16px !important;
    margin-bottom: 2px !important;
  }

  .product-main-content .eyebrow-sub {
    font-size: 0.7rem !important;
    margin-bottom: 3.4px !important;
  }

  .product-main-content .lead-text {
    font-size: 11px !important;
    line-height: 1.35 !important;
    text-align: justify !important;
    margin-bottom: 6px !important;
  }

  .product-main-content > div.mb-sm > span {
    font-size: 9px !important;
    margin-bottom: 2px !important;
    font-weight: bold !important;
    color: #918923 !important;
  }

  .product-target-pills {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.2rem !important;
    width: 100% !important;
    max-width: 303.3px !important;
    overflow: hidden !important;
  }

  .target-pill {
    font-size: 8px !important;
    padding: 0.125rem 0.3rem !important;
    border-width: 1px !important;
    white-space: nowrap !important;
  }

  .product-main-action-row {
    margin-top: 0.5rem !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .product-main-explore-btn {
    display: none !important;
  }

  .product-main-action-row .clx-visit-btn {
    min-height: 24px !important;
    height: 24px !important;
    width: auto !important;
    max-width: 70% !important;
    padding: 0.15rem 0.5rem !important;
    font-size: 0.65rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: -279px !important;
    margin-top: -3px !important;
  }

  .product-bottom-btn-wrap {
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-inline: auto !important;
    margin-top: 0.65rem !important;
  }

  .product-bottom-btn-wrap .btn,
  .product-bottom-btn-wrap a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 23px !important;
    min-height: 23px !important;
    width: 155px !important;
    max-width: 60% !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 11.2px !important;
    border-radius: 23px !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .product-detail-column {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.5rem !important;
    width: 100% !important;
    margin-top: -12.6px !important;
    margin-bottom: 0px !important;
    height: 124.2px !important;
  }

  .product-detail-box {
    flex: 1 1 50% !important;
    width: 50% !important;
    padding: 0.5rem 0.4rem !important;
    padding-top: 8px !important;
    margin-top: 0 !important;
    height: auto !important;
  }

  .product-detail-box:nth-child(1) {
    width: 150px !important;
    margin-left: 0px !important;
    margin-top: -6px !important;
    padding-left: 6.4px !important;
    padding-top: 8px !important;
    margin-bottom: 29px !important;
  }

  .product-detail-box:nth-child(2) {
    width: 141px !important;
    margin-top: -6px !important;
    margin-bottom: 29px !important;
  }

  .product-detail-title {
    font-size: 10px !important;
    margin-bottom: 0.2rem !important;
  }

  .product-detail-box p {
    font-size: 9px !important;
    line-height: 15px !important;
    text-align: justify !important;
  }

  /* 6. DIGITAL ECOSYSTEM SECTION — SMALL MOBILE */
  .ecosystem-header-row {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  .ecosystem-header-text {
    text-align: center !important;
    width: 100% !important;
  }

  .ecosystem-header-text .h2,
  .ecosystem-header-text h2 {
    text-align: center !important;
    font-size: 15px !important;
    line-height: 20px !important;
    margin-top: -6px !important;
    margin-bottom: 5px !important;
  }

  .ecosystem-top-link {
    display: none !important;
  }

  /* Ecosystem Node Cards: Row 1 = 2 cards (CLX + Marketplace), Row 2 = 3 cards (Logistics + Property + Local Services) */
  .ecosystem-nodes-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 0.4rem !important;
  }

  .ecosystem-node-card:nth-child(1),
  .ecosystem-node-card:nth-child(2) {
    grid-column: span 3 !important;
  }

  .ecosystem-node-card:nth-child(3),
  .ecosystem-node-card:nth-child(4),
  .ecosystem-node-card:nth-child(5) {
    grid-column: span 2 !important;
  }

  .ecosystem-node-card {
    padding: 0.5rem 0.35rem !important;
    text-align: center !important;
  }

  .ecosystem-node-icon {
    width: 26px !important;
    height: 26px !important;
    margin: 0 auto 0.25rem !important;
  }

  .ecosystem-node-icon svg {
    width: 16px !important;
    height: 16px !important;
  }

  .ecosystem-node-title {
    font-size: 0.75rem !important;
    margin-bottom: 0.15rem !important;
  }

  .ecosystem-node-card:nth-child(1) .ecosystem-node-title,
  .ecosystem-node-card:nth-child(2) .ecosystem-node-title {
    font-size: 10px !important;
  }

  .ecosystem-node-card:nth-child(1) .ecosystem-node-product,
  .ecosystem-node-card:nth-child(2) .ecosystem-node-product {
    font-size: 12px !important;
  }

  .ecosystem-node-card:nth-child(1) .badge,
  .ecosystem-node-card:nth-child(2) .badge {
    font-size: 8px !important;
  }

  .ecosystem-node-card:nth-child(3) .ecosystem-node-title,
  .ecosystem-node-card:nth-child(4) .ecosystem-node-title,
  .ecosystem-node-card:nth-child(5) .ecosystem-node-title {
    font-size: 9px !important;
  }

  .ecosystem-node-card:nth-child(3) .ecosystem-node-product {
    font-size: 10px !important;
    margin-bottom: 6.2px !important;
  }

  .ecosystem-node-card:nth-child(4) .ecosystem-node-product,
  .ecosystem-node-card:nth-child(5) .ecosystem-node-product {
    font-size: 10px !important;
    margin-bottom: 5.2px !important;
  }

  .ecosystem-node-card:nth-child(3) .badge,
  .ecosystem-node-card:nth-child(4) .badge,
  .ecosystem-node-card:nth-child(5) .badge {
    font-size: 7px !important;
  }

  .ecosystem-node-product {
    font-size: 12.4px !important;
    margin-bottom: 0.2rem !important;
  }

  .ecosystem-node-desc {
    font-size: 0.65rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.3rem !important;
  }

  .ecosystem-node-card:nth-child(3) .ecosystem-node-desc,
  .ecosystem-node-card:nth-child(5) .ecosystem-node-desc {
    font-size: 9px !important;
  }

  .ecosystem-node-card:nth-child(4) .ecosystem-node-desc {
    font-size: 9px !important;
    margin-bottom: 10.8px !important;
  }

  .ecosystem-node-card:nth-child(1) .ecosystem-node-desc {
    text-align: center !important;
    margin-left: -3px !important;
    margin-right: -3px !important;
  }

  .ecosystem-node-card .badge {
    font-size: 0.55rem !important;
    padding: 0.1rem 0.25rem !important;
    white-space: nowrap !important;
  }

  .ecosystem-bottom-btn-wrap {
    margin-top: 0.65rem !important;
  }

  .ecosystem-bottom-btn-wrap .btn,
  .ecosystem-bottom-btn-wrap a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 23px !important;
    min-height: 23px !important;
    width: 155px !important;
    max-width: 60% !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 11.2px !important;
    border-radius: 23px !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  /* 6. OUR DIRECTION SECTION — SMALL MOBILE (480PX) */
  #our-direction,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) {
    padding-top: 1rem !important;
    padding-bottom: 3rem !important;
    padding-block: 1rem 3rem !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1),
  #our-direction .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    height: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1),
  #our-direction h2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.65rem !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: 1.25rem !important;
    line-height: 1.3 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-direction .direction-split-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0.75rem !important;
    height: auto !important;
  }

  #our-direction .direction-content,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    height: auto !important;
    gap: 0.75rem !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-direction .direction-desc-card,
  #our-direction .direction-highlight-box {
    display: block !important;
    padding: 0.75rem 0.65rem !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2),
  #our-direction .direction-desc-card p {
    text-align: justify !important;
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.35rem !important;
    color: inherit !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  #our-direction .direction-highlight-box .pillar-number {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 0.25rem !important;
    padding-bottom: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  #our-direction .direction-highlight-box p {
    text-align: justify !important;
    font-size: 0.775rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  #our-direction .direction-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    transform: none !important;
    overflow: visible !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4),
  #our-direction .direction-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0.65rem 0.5rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    transform: none !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > div:nth-of-type(1),
  #our-direction .direction-card-num {
    font-size: 0.75rem !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > h3,
  #our-direction .direction-card .card-title-primary,
  #our-direction .direction-card h3 {
    font-size: 0.825rem !important;
    line-height: 1.25 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > p,
  #our-direction .direction-card p {
    font-size: 0.725rem !important;
    line-height: 1.35 !important;
    padding-top: 0 !important;
    text-align: center !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    white-space: normal !important;
  }

  /* 7. OUR VALUE PILLARS SECTION — SMALL MOBILE */
  #why-dandalin-sauki {
    padding-top: 9.4px !important;
    padding-bottom: 12px !important;
  }

  .pillars-header-row {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  .pillars-header-text {
    text-align: center !important;
    width: 100% !important;
    margin-bottom: -8px !important;
  }

  .pillars-header-text .h2,
  .pillars-header-text h2 {
    text-align: center !important;
    font-size: 15px !important;
    line-height: 20px !important;
    margin-top: 4px !important;
    margin-bottom: 12px !important;
  }

  .pillars-top-link {
    display: none !important;
  }

  /* Hide Pillar 02 — Accessible completely at <=480px */
  .pillars-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
    margin-top: 4px !important;
  }

  .pillar-card:nth-child(2) {
    display: none !important;
  }

  .pillar-card {
    padding: 0.65rem 0.4rem !important;
    text-align: center !important;
  }

  .pillar-number {
    font-size: 8px !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 0.2rem !important;
  }

  .pillar-title {
    font-size: 11px !important;
    line-height: 15px !important;
    margin-bottom: 0.25rem !important;
    font-weight: 600 !important;
  }

  .pillar-desc {
    font-size: 9px !important;
    line-height: 14px !important;
    text-align: center !important;
  }

  /* 8. FINAL CTA BANNER — SMALL MOBILE */
  #contact-cta {
    padding-block: 0.75rem !important;
  }

  .cta-banner {
    padding: 1rem 0.75rem !important;
    text-align: center !important;
  }

  .cta-banner-title {
    font-size: 13px !important;
    line-height: 18px !important;
    margin-bottom: 0.35rem !important;
  }

  .cta-banner-desc {
    font-size: 10px !important;
    margin-bottom: 0.6rem !important;
    line-height: 1.35 !important;
  }

  .cta-banner .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.4rem !important;
    justify-content: center !important;
  }

  .cta-banner .btn {
    height: 24px !important;
    min-height: 24px !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 11px !important;
    line-height: 12px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 9. FOOTER RESPONSIVE LAYOUT — 3 Grid Horizontally at <=480px */
  .site-footer {
    padding-block: 1rem 0.75rem !important;
  }

  .site-footer h2,
  .site-footer .footer-heading {
    font-size: 10px !important;
    font-weight: 600 !important;
    text-align: center !important;
    margin-bottom: 0.4rem !important;
    letter-spacing: 0.3px !important;
  }

  .site-footer a,
  .site-footer .footer-link,
  .site-footer .footer-legal-link {
    font-size: 9px !important;
    line-height: 1.4 !important;
  }

  .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.5rem !important;
    margin-bottom: 0.75rem !important;
  }

  /* Hide selection (.footer-col-brand) completely in small mobile responsive */
  .footer-col-brand {
    display: none !important;
  }

  /* Footer Columns Center Aligned */
  .footer-col {
    text-align: center !important;
  }

  /* Footer Col 2: Company Quick Links */
  .footer-col-company {
    text-align: center !important;
  }

  .footer-col-company .footer-heading {
    text-align: center !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    margin-bottom: 0.4rem !important;
  }

  .footer-col-company .footer-links {
    text-align: center !important;
    font-size: 9px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0.1rem !important;
  }

  .footer-col-company .footer-links li {
    margin-bottom: 0.1rem !important;
  }

  /* Footer Col 3: Product Quick Links */
  .footer-col-products {
    text-align: center !important;
  }

  .footer-col-products .footer-heading {
    text-align: center !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    margin-bottom: 0.4rem !important;
  }

  .footer-col-products .footer-links {
    text-align: center !important;
    font-size: 9px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0.1rem !important;
  }

  .footer-col-products .footer-links li {
    margin-bottom: 0.1rem !important;
  }

  /* Footer Col 4: Contact Details */
  .footer-col-contact {
    text-align: center !important;
  }

  .footer-col-contact .footer-heading {
    text-align: center !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    margin-bottom: 0.4rem !important;
  }

  .footer-col-contact .footer-contact-info {
    text-align: center !important;
    font-size: 9px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.1rem !important;
  }

  .footer-contact-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-bottom: 0.1rem !important;
    gap: 0.1rem !important;
    font-size: 9px !important;
    line-height: 1.3 !important;
  }

  .footer-contact-item svg,
  .footer-contact-icon {
    display: none !important;
  }

  /* Footer Bottom — Legal Links then Copyright */
  .footer-bottom {
    display: flex !important;
    flex-direction: column-reverse !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding-top: 0.35rem !important;
    gap: 0.15rem !important;
    border-top: 1px solid var(--color-border-subtle) !important;
  }

  .footer-legal-links {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    gap: 0.4rem !important;
    margin-bottom: 0.1rem !important;
  }

  .footer-legal-link {
    font-size: 9px !important;
  }

  .copyright-text {
    font-size: 8.5px !important;
    text-align: center !important;
    margin-bottom: 0 !important;
    opacity: 0.8 !important;
  }

  /* Mobile Responsive Selected Styles */
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    padding-left: 28px !important;
    padding-right: 28px !important;
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) > span:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) > span:nth-of-type(1) {
    font-size: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    height: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    height: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div > .card-icon,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div > h4,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div > p {
    text-align: center !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > h4:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    margin-top: 6px !important;
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex: 1 1 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 23px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) {
    padding-bottom: 20px !important;
    padding-top: 30px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) {
    padding-bottom: 0px !important;
    padding-top: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(4) {
    text-align: justify !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) {
    height: 751.75px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 10.4px !important;
    padding-bottom: 3.6px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    padding-bottom: 4.2px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    margin-top: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    height: 230px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(3) > a:nth-of-type(1) {
    padding-left: 5.6px !important;
    padding-right: 5.6px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > a:nth-of-type(1) {
    padding-left: 0.6px !important;
    padding-right: 1.6px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(3) > a:nth-of-type(1) {
    padding-left: 2.6px !important;
    padding-right: 2.6px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 10.2px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    padding-bottom: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) {
    padding-bottom: 17px !important;
    height: 314px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    line-height: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    line-height: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    height: 130px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    height: 130px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(1) {
    padding-top: 1.6px !important;
    margin-top: 11px !important;
    padding-bottom: 0px !important;
    font-size: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > h3:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1) {
    font-size: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > span:nth-of-type(1) {
    font-size: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > h3:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > span:nth-of-type(1) {
    font-size: 10px !important;
    margin-top: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > span:nth-of-type(1) {
    font-size: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > h3:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 23px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) {
    padding-bottom: 20px !important;
    padding-top: 30px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) {
    padding-bottom: 0px !important;
    padding-top: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(4) {
    text-align: justify !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) {
    height: 751.75px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 10.4px !important;
    padding-bottom: 3.6px !important;
  }
}

/* ==========================================================================
   MOBILE ONLY SCOPED OVERRIDES (max-width: 767px)
   ========================================================================== */
@media (max-width: 767px) {
  /* 1. Global Viewport & Reset */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  *, *::before, *::after {
    box-sizing: border-box !important;
  }

  .container,
  .site-header .container,
  .footer-container,
  main .container,
  section .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    box-sizing: border-box !important;
  }

  /* 2. Section Headings & Spacing */
  .section-title,
  h2.section-title,
  .hero-title,
  .page-hero-title {
    font-size: 1.75rem !important;
    line-height: 1.25 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    text-align: center !important;
  }

  .section-intro,
  .hero-description,
  .hero-subtitle {
    font-size: 1rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .section-badge,
  .hero-badge {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .section-header {
    text-align: center !important;
    margin-bottom: 2rem !important;
  }

  /* 3. Navigation & Header */
  .site-header .nav-links {
    display: none;
  }

  .site-header .nav-links.active {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: #ffffff !important;
    padding: 1.5rem !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
    gap: 1rem !important;
    z-index: 999 !important;
  }

  .mobile-menu-toggle,
  .nav-toggle,
  .menu-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* 4. Pillar & Feature Cards Grid */
  .pillars-grid,
  .values-grid,
  .features-grid,
  .services-grid,
  .why-us-grid,
  .stats-grid,
  .focus-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    width: 100% !important;
  }

  .pillar-card,
  .feature-card,
  .value-card,
  .service-card,
  .ecosystem-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
  }

  /* Ensure card #2 and all cards are fully visible */
  .pillar-card:nth-child(2),
  .pillar-card:nth-of-type(2) {
    display: flex !important;
    visibility: visible !important;
  }

  /* 5. What We Do / Campus Life Express Card */
  .product-highlight-card,
  .clx-card,
  .hero-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.5rem !important;
    box-sizing: border-box !important;
  }

  .product-features-grid,
  .clx-features-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    width: 100% !important;
  }

  /* Hide tablet link on mobile, show CTA buttons */
  .tablet-text-link,
  .tablet-only {
    display: none !important;
  }

  .mobile-cta,
  .btn-mobile,
  .card-cta-btn,
  .clx-cta-btn {
    display: inline-flex !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  /* 6. Buttons & Action Links */
  .btn,
  .btn-primary,
  .btn-secondary,
  .btn-outline,
  .hero-buttons a,
  .cta-buttons a {
    width: 100% !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
    white-space: normal !important;
  }

  .hero-buttons,
  .cta-buttons,
  .button-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
    width: 100% !important;
  }

  /* 7. CEO Message & Leadership Grid */
  .ceo-message-layout,
  .ceo-grid,
  .leadership-grid,
  .story-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.5rem !important;
    width: 100% !important;
  }

  .ceo-image-wrapper,
  .ceo-content,
  .leadership-card {
    width: 100% !important;
    max-width: 100% !important;
  }

  .ceo-content p,
  .leadership-card p {
    text-align: left !important;
    line-height: 1.6 !important;
    font-size: 0.95rem !important;
  }

  /* 8. Footer Layout */
  .footer-grid,
  .footer-columns,
  .footer-top {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
    text-align: center !important;
  }

  .footer-col,
  .footer-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }

  .footer-social-links,
  .social-links {
    justify-content: center !important;
  }

  .footer-bottom {
    flex-direction: column !important;
    gap: 1rem !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   PRODUCTS PAGE — MOBILE RESPONSIVE POLISH (<499px ONLY)
   ========================================================================== */
@media (max-width: 499px) {

  /* 1. Global Containers & Prevent Horizontal Overflow */
  html, body {
    overflow-x: hidden !important;
  }

  /* 2. Hero & Philosophy Merged Layout (<499px) */
  .hero-philosophy-merged-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0.75rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .page-hero {
    padding-top: 0.85rem !important;
    padding-bottom: 0.4rem !important;
    text-align: center !important;
  }

  .page-hero-header h1,
  .page-hero h1 {
    font-size: 1.25rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
    text-align: center !important;
  }

  .page-hero .lead-text,
  .page-hero p {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0 !important;
  }

  /* 3. Product Philosophy Intro */
  .container-narrow p {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0.35rem !important;
  }

  /* 4. Practical / Accessible / Connected Cards (3 Cards in 1 Row) */
  .philosophy-cards-section {
    padding-block: 0.5rem 0.75rem !important;
  }

  .philosophy-cards-section .grid-3,
  .philosophy-cards-section .grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.3rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .philosophy-cards-section .card {
    padding: 0.45rem 0.25rem !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .philosophy-cards-section .card-icon {
    width: 22px !important;
    height: 22px !important;
    margin-bottom: 0.2rem !important;
  }

  .philosophy-cards-section .card-icon svg {
    width: 15px !important;
    height: 15px !important;
  }

  .philosophy-cards-section .card .h3,
  .philosophy-cards-section .card h3 {
    font-size: 0.7rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.15rem !important;
    text-align: center !important;
    font-weight: 700 !important;
  }

  .philosophy-cards-section .card p {
    font-size: 0.6rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 5. Campus Life Express (CLX) Showcase */
  #clx {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
  }

  #clx .product-showcase-card {
    padding: 0.75rem 0.6rem !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
  }

  #clx .product-badges-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 0.3rem !important;
    align-items: center !important;
    margin-bottom: 0.35rem !important;
  }

  #clx .badge {
    font-size: 0.55rem !important;
    padding: 0.125rem 0.35rem !important;
    white-space: nowrap !important;
  }

  #clx .product-badge {
    font-size: 0.6rem !important;
  }

  #clx .grid-12 h2,
  #clx .grid-12 .h1,
  #clx h2 {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.25rem !important;
  }

  #clx .lead-text {
    font-size: 11.8px !important;
    line-height: 1.35 !important;
    text-align: justify !important;
    margin-top: 0.2rem !important;
    margin-bottom: 0.4rem !important;
  }

  /* 5B. Problem & Solution (2 Equal Columns in 1 Row) */
  #clx .product-grid-details {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.35rem !important;
    width: 100% !important;
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
  }

  #clx .product-detail-box,
  #clx .product-detail-box-sec,
  #clx .product-detail-box:nth-child(1),
  #clx .product-detail-box:nth-child(2) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    padding: 0.45rem 0.35rem !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  #clx .product-detail-title {
    font-size: 0.625rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.2rem !important;
  }

  #clx .product-detail-box p {
    font-size: 0.6rem !important;
    line-height: 1.3 !important;
    text-align: justify !important;
    margin-bottom: 0.15rem !important;
  }

  #clx .product-detail-box .text-xs {
    font-size: 0.55rem !important;
    line-height: 1.2 !important;
  }

  /* 5C. Designed for Campus Communities (3 Cards in 1 Row) */
  #clx .mt-lg {
    margin-top: 0.65rem !important;
    width: 100% !important;
  }

  #clx .mt-lg h3 {
    text-align: center !important;
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
  }

  #clx .mt-lg .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.3rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #clx .mt-lg .grid-3 > .card {
    padding: 0.4rem 0.2rem !important;
    text-align: center !important;
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #clx .mt-lg .grid-3 > .card h4,
  #clx .mt-lg .grid-3 > .card .h4 {
    font-size: 0.7rem !important;
    line-height: 1.15 !important;
    margin-bottom: 0.15rem !important;
    text-align: center !important;
  }

  #clx .mt-lg .grid-3 > .card p {
    font-size: 0.575rem !important;
    line-height: 1.2 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 5D. How Campus Life Express Works (4 Progression Cards in 1 Row) */
  #clx .mt-xl {
    margin-top: 0.65rem !important;
    padding-top: 0.5rem !important;
  }

  #clx .mt-xl h3 {
    text-align: center !important;
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
  }

  #clx .progression-grid {
    display: block !important;
    width: 100% !important;
  }

  #clx .progression-grid .grid-4 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.2rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #clx .progression-step {
    padding: 0.3rem 0.15rem !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #clx .progression-step-num {
    width: 18px !important;
    height: 18px !important;
    font-size: 0.6rem !important;
    line-height: 18px !important;
    margin-bottom: 0.15rem !important;
  }

  #clx .progression-step-title {
    font-size: 0.625rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    margin-bottom: 0.1rem !important;
    text-align: center !important;
  }

  #clx .progression-step p {
    font-size: 0.525rem !important;
    line-height: 1.2 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 5E. Visit Campus Life Express Button */
  #clx .card-footer {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    margin-top: 0.6rem !important;
    padding-top: 0.45rem !important;
  }

  #clx .card-footer > div {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  #clx .card-footer .btn {
    height: 24px !important;
    min-height: 24px !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 0.6875rem !important;
    line-height: 12px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 90% !important;
  }

  /* 6. Our Product Roadmap (5 Cards in 2 Columns per Row) */
  main#mainContent > section:nth-of-type(4) .section-header {
    text-align: center !important;
    margin-bottom: 0.45rem !important;
  }

  main#mainContent > section:nth-of-type(4) .section-header h2 {
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
    text-align: center !important;
  }

  main#mainContent > section:nth-of-type(4) .grid-3 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.35rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent > section:nth-of-type(4) .grid-3 > .product-roadmap-card:nth-child(5),
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .product-roadmap-card {
    padding: 0.45rem 0.35rem !important;
    text-align: center !important;
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .product-roadmap-header {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 0.2rem !important;
    width: 100% !important;
  }

  .product-roadmap-header .badge {
    font-size: 0.55rem !important;
    padding: 0.1rem 0.25rem !important;
    white-space: nowrap !important;
  }

  .product-roadmap-card .h3,
  .product-roadmap-card h3 {
    font-size: 0.7rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    margin-bottom: 0.15rem !important;
    text-align: center !important;
  }

  .product-roadmap-card .card-desc,
  .product-roadmap-card p {
    font-size: 8.6px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 7. Transparent Roadmap (4 Cards in 2 Columns per Row) */
  main#mainContent > section:nth-of-type(5) .section-header h2 {
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
    text-align: center !important;
  }

  .status-legend-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.35rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .status-legend-box {
    padding: 0.45rem 0.35rem !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .status-legend-box .badge {
    font-size: 0.55rem !important;
    padding: 0.1rem 0.25rem !important;
    white-space: nowrap !important;
    margin-bottom: 0.2rem !important;
  }

  .status-legend-box p {
    font-size: 8.6px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 8. One Connected Vision Ecosystem Callout */
  .ecosystem-callout,
  main#mainContent > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding: 0.85rem 0.65rem !important;
    text-align: center !important;
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .ecosystem-callout .section-header {
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .ecosystem-callout .eyebrow {
    font-size: 9.4px !important;
    text-align: center !important;
    display: block !important;
    margin-bottom: 0.2rem !important;
  }

  .ecosystem-callout .h2,
  .ecosystem-callout h2,
  main#mainContent > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 14px !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .ecosystem-callout .lead-text,
  .ecosystem-callout p {
    font-size: 10.8px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    margin-bottom: 0.6rem !important;
  }

  .ecosystem-callout > div:last-child {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .ecosystem-callout .btn,
  .ecosystem-callout a {
    height: 24px !important;
    min-height: 24px !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 0.6875rem !important;
    line-height: 12px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 9. CTA Banner — Small Mobile */
  .cta-banner,
  main#mainContent > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding: 0.85rem 0.65rem !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .cta-banner .eyebrow {
    font-size: 9.4px !important;
    text-align: center !important;
    display: block !important;
    margin-bottom: 0.2rem !important;
  }

  .cta-banner-title,
  .cta-banner h2,
  .cta-banner .h2,
  main#mainContent > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 12.4px !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .cta-banner-desc,
  .cta-banner p {
    font-size: 11px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin-bottom: 0.6rem !important;
  }

  .cta-actions {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.4rem !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .cta-actions .btn,
  .cta-actions a {
    height: 24px !important;
    min-height: 24px !important;
    padding: 0.2rem 0.65rem !important;
    font-size: 0.6875rem !important;
    line-height: 12px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  /* 10. ECOSYSTEM PAGE — MOBILE RESPONSIVE POLISH (<499px) */
  main#mainContent .section {
    padding-block: 0.85rem 0.65rem !important;
  }

  /* Top Introduction Section (2 Vertical Full-Width Blocks) */
  .hero-intro-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .hero-col-left,
  .hero-col-right {
    width: 100% !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }

  .hero-col-left .h1 {
    font-size: 1.25rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
    text-align: left !important;
  }

  .hero-col-left .lead-text {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0 !important;
  }

  .hero-col-right .h2 {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
    text-align: left !important;
  }

  .hero-col-right .statement-text {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0.35rem !important;
  }

  .hero-col-right p {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0 !important;
  }

  /* Ecosystem Architecture Visual Section */
  .ecosystem-diagram-wrapper {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .ecosystem-diagram-header .h2 {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.5rem !important;
    text-align: center !important;
  }

  .ecosystem-parent-node {
    padding: 0.45rem 0.65rem !important;
    margin-inline: auto !important;
    max-width: 260px !important;
    text-align: center !important;
  }

  .ecosystem-parent-title {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-align: center !important;
  }

  .ecosystem-parent-sub {
    font-size: 0.625rem !important;
    text-align: center !important;
  }

  /* Architecture Nodes: Row 1 = Marketplace + Local Services (2 cols), Row 2 = Property + Logistics (2 cols), Row 3 = Campus Solutions (1 full-width card) */
  .ecosystem-diagram-wrapper .ecosystem-nodes-grid,
  main#mainContent .ecosystem-nodes-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .ecosystem-diagram-wrapper .ecosystem-node-card,
  main#mainContent .ecosystem-node-card {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    padding: 0.5rem 0.35rem !important;
    min-width: 0 !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }

  /* Campus Solutions (5th card / active-node) spans 2 columns (full-width) on Row 3 */
  .ecosystem-diagram-wrapper .ecosystem-node-card:nth-child(5),
  .ecosystem-diagram-wrapper .active-node,
  main#mainContent .ecosystem-node-card:nth-child(5) {
    grid-column: span 2 !important;
    width: 100% !important;
  }

  .ecosystem-node-card .badge {
    font-size: 0.55rem !important;
    padding: 0.1rem 0.3rem !important;
    white-space: nowrap !important;
    margin-bottom: 0.25rem !important;
    margin-inline: auto !important;
    display: inline-flex !important;
  }

  .ecosystem-node-card .h4,
  .ecosystem-node-card h3 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.15rem !important;
    text-align: center !important;
    font-weight: 700 !important;
  }

  .ecosystem-node-card p,
  .ecosystem-node-card .text-xs {
    font-size: 0.625rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0 !important;
  }

  /* Ecosystem Pillars Section (2 Cards per Row, Campus Solutions Full Width) */
  .pillars-section .section-header h2 {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.45rem !important;
    text-align: center !important;
  }

  .pillars-5-grid,
  .pillars-section .pillars-5-grid,
  main#mainContent .pillars-5-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-inline: 0 !important;
  }

  .pillars-5-grid > .card,
  .pillars-5-grid .pillar-card,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > .card,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > .pillar-card {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    padding: 0.55rem 0.35rem !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }

  .pillars-5-grid > .card:nth-child(5),
  .pillars-5-grid > .active-pillar-card,
  .pillars-5-grid > .pillar-card:last-child,
  main#mainContent .pillars-5-grid > .active-pillar-card,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > .active-pillar-card {
    grid-column: span 2 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .pillars-5-grid .card-icon {
    width: 26px !important;
    height: 26px !important;
    margin-inline: auto !important;
    margin-bottom: 0.25rem !important;
  }

  .pillars-5-grid .card-icon svg {
    width: 15px !important;
    height: 15px !important;
  }

  .pillars-5-grid .h3 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  .pillars-5-grid p {
    font-size: 0.625rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.3rem !important;
  }

  .pillars-5-grid .badge {
    font-size: 0.55rem !important;
    padding: 0.1rem 0.3rem !important;
    white-space: nowrap !important;
    margin-inline: auto !important;
  }

  .pillars-5-grid .btn {
    height: 22px !important;
    min-height: 22px !important;
    padding: 0.15rem 0.5rem !important;
    font-size: 0.625rem !important;
    line-height: 12px !important;
    border-radius: 20px !important;
    margin-top: 0.3rem !important;
    margin-inline: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* How It Connects Section (2 Cards per Row, Centered Content) */
  main#mainContent .how-it-connects-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent .how-it-connects-grid > .card,
  main#mainContent .how-it-connects-grid > .connect-card {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    padding: 0.55rem 0.35rem !important;
    min-width: 0 !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent .how-it-connects-grid .card-icon {
    width: 26px !important;
    height: 26px !important;
    margin-inline: auto !important;
    margin-bottom: 0.25rem !important;
  }

  main#mainContent .how-it-connects-grid .card-icon svg {
    width: 15px !important;
    height: 15px !important;
  }

  main#mainContent .how-it-connects-grid .h4 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  main#mainContent .how-it-connects-grid p {
    font-size: 0.625rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0 !important;
  }

  /* Long Term Vision Section (Stacked Paragraphs, 2 Cards per Row) */
  .vision-section .section-header h2 {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.45rem !important;
    text-align: center !important;
  }

  .vision-content-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.65rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .vision-description-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.35rem !important;
    width: 100% !important;
  }

  .vision-description-col .statement-text,
  .vision-description-col p {
    font-size: 11.8px !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin-bottom: 0 !important;
  }

  .principles-grid,
  .vision-content-grid .principles-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .principle-card,
  .vision-content-grid .principle-card {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: center !important;
    padding: 0.5rem 0.35rem !important;
    min-width: 0 !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }

  .principle-card .h4 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.15rem !important;
    text-align: center !important;
  }

  .principle-card p {
    font-size: 0.625rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* Specific Mobile <500px Element Adjustments */
  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > nav:nth-of-type(1) {
    text-align: left !important;
    padding-left: 0px !important;
    padding-right: 215px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    text-align: center !important;
    font-size: 16px !important;
    padding-top: 0px !important;
    margin-top: -6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h2:nth-of-type(1) {
    text-align: center !important;
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-bottom: 10px !important;
    padding-top: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    margin-top: -9px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    margin-top: -18px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) {
    margin-top: 2px !important;
    margin-bottom: 4px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    color: #475569 !important;
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 10px !important;
    color: #475569 !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) {
    width: 200px !important;
    margin-left: 60px !important;
  }

  /* ==========================================================================
     CONTACT PAGE — MOBILE RESPONSIVE POLISH (<499px ONLY)
     ========================================================================== */

  header#siteHeader:nth-of-type(1) {
    height: 70px !important;
  }

  header#siteHeader:nth-of-type(1) > div:nth-of-type(1) {
    width: 334.667px !important;
  }

  header#siteHeader:nth-of-type(1) > div:nth-of-type(1) > button#mobileMenuToggle:nth-of-type(1) {
    width: 40px !important;
    height: 35px !important;
    margin-right: -15px !important;
    margin-left: 0px !important;
    padding-left: 0px !important;
  }

  .contact-page {
    overflow-x: hidden !important;
  }

  .contact-page .container {
    padding-inline: 1rem !important;
    box-sizing: border-box !important;
  }

  /* 1. Hero & Intro Section */
  .contact-page .contact-hero-section {
    padding-top: 0.5rem !important;
    padding-bottom: 0.25rem !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > nav:nth-of-type(1),
  .contact-page .breadcrumbs {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0.35rem !important;
    font-size: 12px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-top: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    text-align: left !important;
  }

  .contact-page .contact-intro-section,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) {
    padding-top: 0px !important;
    padding-bottom: 10.4px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 0px !important;
  }

  .contact-page .contact-hero-title,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: bold !important;
    text-align: center !important;
    margin-inline: auto !important;
    margin-top: -5px !important;
    margin-bottom: 0px !important;
    padding-top: 0px !important;
  }

  .contact-page .contact-hero-desc,
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: 1.4 !important;
    text-align: center !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    margin-top: 0px !important;
    margin-bottom: 2.6px !important;
    padding-top: 0px !important;
    padding-inline: 0.25rem !important;
    color: var(--color-text-body) !important;
  }

  /* 2. Main Cards Stacked Vertically into 1 Column */
  .contact-page .contact-grid-section {
    padding-block: 1rem !important;
  }

  .contact-page .grid-contact {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 1rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .contact-page .contact-details-card,
  .contact-page .contact-form-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1rem 0.85rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--shadow-sm) !important;
    background-color: var(--color-white) !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  .contact-page .contact-card-title,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div#contact-form:nth-of-type(2) > h2:nth-of-type(1) {
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 0.35rem !important;
  }

  .contact-page .contact-card-intro,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    text-align: center !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    max-width: 100% !important;
    margin-bottom: 1rem !important;
    color: var(--color-text-muted) !important;
  }

  /* 3. Official Contact Details Card — Single Column Row by Row */
  .contact-page .contact-details-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
    width: 100% !important;
  }

  .contact-page .contact-details-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
    width: 100% !important;
  }

  .contact-page .contact-col-left,
  .contact-page .contact-col-right {
    text-align: left !important;
  }

  .contact-page .contact-detail-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 0.6rem !important;
    text-align: left !important;
    width: 100% !important;
  }

  .contact-page .contact-detail-icon {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
    color: var(--color-primary) !important;
  }

  .contact-page .contact-item-body {
    flex: 1 !important;
    min-width: 0 !important;
  }

  .contact-page .contact-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: var(--color-text-main, #1e293b) !important;
    margin-bottom: 0.1rem !important;
    display: block !important;
  }

  .contact-page .contact-val,
  .contact-page .contact-detail-text {
    font-size: 0.775rem !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    word-break: break-word !important;
  }

  /* 4. Send Us a Message Form Card — Vertical Fields & Full Width Inputs */
  .contact-page #contactForm {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .contact-page #contactForm .form-group {
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
  }

  /* Email Address and Phone Number Stack Vertically in 1 Column on Mobile */
  .contact-page .form-row-2 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
    width: 100% !important;
  }

  .contact-page #contactForm .form-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.25rem !important;
    color: var(--color-text-main, #334155) !important;
  }

  .contact-page #contactForm .form-control {
    width: 100% !important;
    font-size: 0.8rem !important;
    padding: 0.5rem 0.65rem !important;
    border-radius: var(--radius-md, 6px) !important;
    border: 1px solid var(--color-border) !important;
    background-color: var(--color-white) !important;
    box-sizing: border-box !important;
  }

  .contact-page #contactForm textarea.form-control {
    resize: vertical !important;
    min-height: 80px !important;
    height: 85px !important;
  }

  .contact-page #contactForm button[type="submit"] {
    width: 100% !important;
    margin-top: 0.25rem !important;
    padding: 0.65rem 1rem !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    border-radius: var(--radius-md, 6px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  /* 5. Interested in Working With Us Section */
  .contact-page .contact-partnership-section {
    padding-block: 1.25rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) {
    margin-top: -4px !important;
    margin-bottom: -6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-top: 9px !important;
  }

  .contact-page .contact-partnership-title,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .contact-page .contact-partnership-desc,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
    line-height: 1.4 !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
    color: var(--color-text-muted) !important;
    padding-inline: 0.25rem !important;
  }

  .contact-page .contact-partnership-btn,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.4rem 0.85rem !important;
    padding-top: 6px !important;
    height: 31px !important;
    width: auto !important;
    max-width: max-content !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }

  /* 6. Closing CTA Section */
  .contact-page .contact-cta-section {
    padding-block: 1.25rem 1.75rem !important;
  }

  .contact-page .contact-cta-section .cta-banner {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    padding: 1.25rem 1rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .contact-page .contact-cta-eyebrow,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(1) {
    display: block !important;
    font-size: 10px !important;
    letter-spacing: 0.08em !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    margin-bottom: 0.3rem !important;
  }

  .contact-page .contact-cta-title,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.4rem !important;
  }

  .contact-page .contact-cta-desc,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
    line-height: 1.4 !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
    margin-bottom: 1rem !important;
  }

  .contact-page .contact-cta-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.65rem 1.2rem !important;
    font-size: 0.825rem !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }
}

/* ==========================================================================
   ECOSYSTEM PAGE — DESKTOP/LAPTOP 1200PX RESPONSIVE POLISH
   Target: min-width 1024px / 1200px desktop view
   ========================================================================== */
@media (min-width: 1024px) {

  /* 1. HERO & INTRO GRID — 2 COLUMNS HORIZONTALLY */
  .hero-intro-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2.25rem !important;
    align-items: start !important;
  }

  .hero-col-left,
  .hero-col-right {
    display: flex !important;
    flex-direction: column !important;
  }

  .hero-col-left .h1 {
    font-size: 2.35rem !important;
    line-height: 1.18 !important;
    text-align: left !important;
    margin-bottom: 0.65rem !important;
  }

  .hero-col-left .lead-text {
    font-size: 1rem !important;
    line-height: 1.55 !important;
    text-align: left !important;
    margin-bottom: 0 !important;
  }

  .hero-col-right .h2 {
    font-size: 1.85rem !important;
    line-height: 1.25 !important;
    text-align: left !important;
    margin-bottom: 0.65rem !important;
  }

  .hero-col-right .statement-text {
    font-size: 1.05rem !important;
    line-height: 1.55 !important;
    margin-bottom: 0.5rem !important;
  }

  .hero-col-right p {
    font-size: 0.925rem !important;
    line-height: 1.5 !important;
    color: var(--color-text-muted) !important;
    margin-bottom: 0 !important;
  }

  /* 2. OUR DIGITAL ECOSYSTEM ARCHITECTURE DIAGRAM */
  .ecosystem-diagram-header,
  .ecosystem-diagram-header .h2 {
    text-align: center !important;
    margin-inline: auto !important;
  }

  .ecosystem-nodes-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
  }

  .ecosystem-node-card {
    padding: 1rem 0.65rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    height: 100% !important;
  }

  /* 3. ECOSYSTEM PILLARS — 5 CARDS IN ONE ROW (CENTERED VERTICAL FLEX LAYOUT) */
  .pillars-section .section-header,
  .pillars-section .section-header .h2 {
    text-align: center !important;
    margin-inline: auto !important;
  }

  .pillars-5-grid,
  .pillars-section .pillars-5-grid,
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .pillars-5-grid > .card,
  .pillars-5-grid .pillar-card {
    grid-column: span 1 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 100% !important;
    padding: 1.15rem 0.65rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
  }

  .pillars-5-grid .card-icon,
  .pillars-5-grid .card-icon-centered {
    width: 36px !important;
    height: 36px !important;
    flex-shrink: 0 !important;
    margin-inline: auto !important;
    margin-bottom: 0.5rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
  }

  .pillars-5-grid .card-icon-secondary {
    background-color: var(--color-secondary-light) !important;
    color: var(--color-secondary) !important;
  }

  .pillars-5-grid .card-icon svg {
    width: 18px !important;
    height: 18px !important;
  }

  .pillars-5-grid .h3 {
    font-size: 0.95rem !important;
    line-height: 1.3 !important;
    text-align: center !important;
    margin-bottom: 0.35rem !important;
  }

  .pillars-5-grid p {
    font-size: 0.775rem !important;
    line-height: 1.4 !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
    color: var(--color-text-muted) !important;
  }

  .pillars-5-grid .badge {
    font-size: 0.625rem !important;
    padding: 0.15rem 0.4rem !important;
    white-space: nowrap !important;
    margin-inline: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .pillars-5-grid .btn,
  .pillars-5-grid .btn-sm {
    margin-inline: auto !important;
    align-self: center !important;
    margin-top: 0.5rem !important;
    padding: 0.35rem 0.6rem !important;
    font-size: 0.725rem !important;
    white-space: nowrap !important;
    max-width: 100% !important;
  }

  /* 4. HOW IT CONNECTS — 4 CARDS IN ONE ROW (CENTERED CONTENT) */
  .how-it-connects-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.15rem !important;
    align-items: stretch !important;
  }

  .how-it-connects-grid > .connect-card,
  .how-it-connects-grid > .card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    padding: 1.35rem 1rem !important;
    height: 100% !important;
  }

  .how-it-connects-grid .card-icon-centered {
    margin-inline: auto !important;
    margin-bottom: 0.5rem !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
  }

  .how-it-connects-grid .card-icon-secondary {
    background-color: var(--color-secondary-light) !important;
    color: var(--color-secondary) !important;
  }

  .how-it-connects-grid .card-icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  .how-it-connects-grid .h4 {
    text-align: center !important;
    font-size: 1.05rem !important;
    margin-bottom: 0.35rem !important;
  }

  .how-it-connects-grid p {
    text-align: center !important;
    font-size: 0.825rem !important;
    line-height: 1.45 !important;
    margin-bottom: 0 !important;
  }

  /* 5. LONG TERM VISION — DESCRIPTION ON LEFT, 2X2 CARDS ON RIGHT */
  .vision-section .section-header,
  .vision-section .section-header .h2 {
    text-align: center !important;
    margin-inline: auto !important;
  }

  .vision-content-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 2.25rem !important;
    align-items: start !important;
    margin-top: 1rem !important;
  }

  .vision-description-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.65rem !important;
    text-align: left !important;
  }

  .vision-description-col .statement-text {
    font-size: 1.05rem !important;
    line-height: 1.55 !important;
    margin-bottom: 0 !important;
  }

  .vision-description-col p {
    font-size: 0.925rem !important;
    line-height: 1.5 !important;
    color: var(--color-text-muted) !important;
    margin-bottom: 0 !important;
  }

  .vision-content-grid .principles-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.85rem !important;
    margin-top: 0 !important;
  }

  .vision-content-grid .principle-card {
    padding: 1.15rem 0.95rem !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background-color: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-md) !important;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast) !important;
  }

  .vision-content-grid .principle-card:hover {
    border-color: var(--color-primary-subtle) !important;
    box-shadow: var(--shadow-sm) !important;
  }

  .vision-content-grid .principle-card .h4 {
    font-size: 0.95rem !important;
    margin-bottom: 0.25rem !important;
  }

  .vision-content-grid .principle-card p {
    font-size: 0.8rem !important;
    line-height: 1.4 !important;
  }
}

/* Focus Mode Style Adjustments */
main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
  text-align: center;
  margin-bottom: 16.4px;
  margin-right: 1px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h2:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
  font-weight: normal;
  text-align: justify;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
  font-weight: normal;
  font-size: 16px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
  font-size: 16px;
  text-align: justify;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
  text-align: justify;
  font-weight: normal;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
  text-align: justify;
  font-size: 16px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > h3:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > h3:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > h3:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1) {
  text-align: center;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(2) {
  padding-top: 25px;
  padding-bottom: 25px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(4) {
  padding-top: 25px;
  padding-bottom: 25px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(5) {
  padding-top: 25px;
  padding-bottom: 25px;
}

main#mainContent:nth-of-type(1) > section:nth-of-type(6) {
  padding-top: 25px;
  padding-bottom: 25px;
}

/* ==========================================================================
   CONTACT PAGE — DESKTOP/LAPTOP 1200PX RESPONSIVE POLISH
   Target: min-width 993px / 1200px desktop view
   Strictly scoped to .contact-page to avoid affecting mobile/tablet or other pages.
   ========================================================================== */
@media (min-width: 993px) {

  /* 1. HERO / INTRODUCTORY SECTION */
  .contact-page .contact-hero-section {
    padding-top: 1rem !important;
    padding-bottom: 0.5rem !important;
  }

  .contact-page .contact-intro-section {
    padding-top: 0.5rem !important;
    padding-bottom: 2rem !important;
  }

  .contact-page .contact-intro-section .section-header {
    text-align: center !important;
    margin-bottom: 0.75rem !important;
  }

  .contact-page .contact-hero-title {
    font-size: 1.85rem !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin-inline: auto !important;
  }

  .contact-page .contact-hero-desc {
    text-align: center !important;
    font-size: 1.025rem !important;
    line-height: 1.55 !important;
    max-width: 680px !important;
    margin-inline: auto !important;
    color: var(--color-text-body) !important;
  }

  /* 2. MAIN 2-COLUMN GRID (OFFICIAL CONTACT DETAILS + SEND US A MESSAGE) */
  .contact-page .contact-grid-section {
    padding-block: 2.25rem !important;
  }

  .contact-page .grid-contact {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2rem !important;
    align-items: stretch !important;
    max-width: 1200px !important;
    margin-inline: auto !important;
  }

  /* Matching Card Heights, Borders, Shadows & Padding */
  .contact-page .contact-details-card,
  .contact-page .contact-form-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 2.25rem 2rem !important;
    border-radius: var(--radius-lg, 12px) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--shadow-sm) !important;
    background-color: var(--color-white) !important;
    box-sizing: border-box !important;
  }

  .contact-page .contact-card-title {
    text-align: center !important;
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 0.5rem !important;
  }

  .contact-page .contact-card-intro {
    text-align: center !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    max-width: 480px !important;
    margin-inline: auto !important;
    margin-bottom: 1.75rem !important;
  }

  /* 3. OFFICIAL CONTACT DETAILS CARD — VERTICAL LEFT-ALIGNED STRUCTURE */
  .contact-page .contact-details-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.15rem !important;
    margin-top: 0.5rem !important;
  }

  .contact-page .contact-details-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.15rem !important;
    text-align: left !important;
  }

  /* Left & Right Columns -> All Vertical & Left Aligned */
  .contact-page .contact-col-left,
  .contact-page .contact-col-right {
    text-align: left !important;
  }

  .contact-page .contact-col-left .contact-detail-item,
  .contact-page .contact-col-right .contact-detail-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 0.75rem !important;
    text-align: left !important;
  }

  .contact-page .contact-detail-icon {
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
    color: var(--color-primary) !important;
  }

  .contact-page .contact-item-body {
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .contact-label {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: var(--color-text-main, #1e293b) !important;
    margin-bottom: 0.2rem !important;
    display: block !important;
  }

  .contact-page .contact-val,
  .contact-page .contact-detail-text {
    font-size: 0.85rem !important;
    line-height: 1.4 !important;
    margin: 0 !important;
  }

  /* 4. SEND US A MESSAGE CARD FORM LAYOUT */
  .contact-page #contactForm {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
  }

  .contact-page #contactForm .form-group {
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .form-row-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    width: 100% !important;
  }

  .contact-page #contactForm .form-label {
    font-size: 0.825rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.35rem !important;
    color: var(--color-text-main, #334155) !important;
  }

  .contact-page #contactForm .form-control {
    font-size: 0.875rem !important;
    padding: 0.65rem 0.85rem !important;
    border-radius: var(--radius-md, 8px) !important;
    border: 1px solid var(--color-border) !important;
    background-color: var(--color-white) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  }

  .contact-page #contactForm .form-control:focus {
    border-color: var(--color-primary) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
  }

  .contact-page #contactForm textarea.form-control {
    resize: vertical !important;
    min-height: 90px !important;
  }

  .contact-page #contactForm button[type="submit"] {
    margin-top: 0.5rem !important;
    padding: 0.75rem 1.5rem !important;
    font-size: 0.925rem !important;
    font-weight: 600 !important;
    border-radius: var(--radius-md, 8px) !important;
  }

  /* 5. INTERESTED IN WORKING WITH US SECTION */
  .contact-page .contact-partnership-section,
  main#mainContent:nth-of-type(1) > section:nth-of-type(4) {
    padding-top: 15px !important;
    padding-bottom: 10px !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-weight: normal !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    height: 100% !important;
    width: 100% !important;
    margin-top: 0 !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div#contact-form:nth-of-type(2) {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }

  .contact-page .contact-partnership-title {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.65rem !important;
  }

  .contact-page .contact-partnership-desc {
    font-size: 1rem !important;
    line-height: 1.55 !important;
    max-width: 620px !important;
    margin-inline: auto !important;
    text-align: center !important;
    color: var(--color-text-muted) !important;
  }

  .contact-page .contact-partnership-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.7rem 1.5rem !important;
    font-size: 0.925rem !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }

  /* 6. FINAL CTA BANNER */
  .contact-page .contact-cta-section {
    padding-block: 2.5rem 3.5rem !important;
  }

  .contact-page .contact-cta-section .cta-banner,
  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) {
    width: 750px !important;
    max-width: 1000px !important;
    margin-inline: auto !important;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
    border-radius: var(--radius-lg, 16px) !important;
    text-align: center !important;
  }

  .contact-page .contact-cta-eyebrow {
    display: block !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.08em !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
  }

  .contact-page .contact-cta-title {
    font-size: 2rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    margin-bottom: 0.75rem !important;
  }

  .contact-page .contact-cta-desc {
    font-size: 1rem !important;
    line-height: 1.55 !important;
    max-width: 580px !important;
    margin-inline: auto !important;
    text-align: center !important;
    margin-bottom: 1.75rem !important;
  }

  .contact-page .contact-cta-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.75rem 1.75rem !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    margin-inline: auto !important;
  }

  /* Footer Desktop Refinements — Logo Replacement (1200px / Desktop) */
  .site-footer .footer-col-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .site-footer .footer-col-brand .brand-text {
    display: none !important;
  }

  .site-footer .footer-brand-logo {
    display: inline-block !important;
    margin-top: 0 !important;
    margin-bottom: 0.6rem !important;
    margin-left: 0 !important;
  }

  .site-footer .footer-logo-img {
    height: 46px !important;
    width: auto !important;
    max-width: 220px !important;
    object-fit: contain !important;
    display: block !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-left: 23px !important;
  }

  .site-footer .footer-brand-desc,
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
    text-align: justify !important;
    margin-left: 0px !important;
    margin-right: 8px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
    margin-top: 0.35rem !important;
    width: 230.167px !important;
    color: var(--color-text-light) !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    display: none !important;
  }

  footer:nth-of-type(1) {
    padding-top: 38px !important;
    padding-bottom: 19px !important;
    height: 295.111px !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) {
    line-height: 25px !important;
  }

  /* Footer Bottom Desktop Layout - Legal Links on line 1 (centered), Copyright on line 2 (centered) */
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2),
  .site-footer .footer-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 0.5rem !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  .site-footer .footer-legal-links {
    order: 1 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 1.5rem !important;
    width: 100% !important;
    text-align: center !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  .site-footer .copyright-text {
    order: 2 !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* Homepage Desktop 1200px Responsive Polish */
  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    text-align: left !important;
    font-size: 36px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-weight: bold !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    margin-top: -7px !important;
    margin-right: 4px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
    margin-bottom: 8px !important;
    margin-top: -9px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  /* What We Do Section Desktop 1200px Polish */
  #what-we-do .what-we-do-header {
    text-align: center !important;
    margin-bottom: 1.25rem !important;
  }

  #what-we-do .what-we-do-header .h2 {
    text-align: center !important;
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    margin-bottom: 0 !important;
  }

  #what-we-do .what-we-do-grid,
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    width: 100% !important;
    justify-content: center !important;
    justify-items: center !important;
    align-items: center !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #what-we-do .what-we-do-card {
    padding: 1.15rem 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    height: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg, 12px) !important;
    background-color: var(--color-white) !important;
  }

  #what-we-do .what-we-do-card .card-icon {
    width: 40px !important;
    height: 40px !important;
    margin-inline: auto !important;
    margin-bottom: 0.6rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md, 8px) !important;
  }

  #what-we-do .what-we-do-card .card-icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  #what-we-do .what-we-do-card .card-title {
    text-align: center !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    margin-bottom: 0.4rem !important;
    color: var(--color-text-main) !important;
  }

  #what-we-do .what-we-do-card .card-body {
    flex: 1 1 auto !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #what-we-do .what-we-do-card .card-body p {
    text-align: center !important;
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
    color: var(--color-text-muted) !important;
    margin-bottom: 0 !important;
  }

  #what-we-do .what-we-do-card .card-footer {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    margin-top: auto !important;
    padding-top: 0.65rem !important;
  }

  #what-we-do .what-we-do-card .btn-text {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: var(--color-primary) !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(5) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  /* 4. PRODUCT SHOWCASE CARD — PROFESSIONAL DESKTOP/LAPTOP RESPONSIVE */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    background: #ffffff !important;
    border: 1px solid var(--color-border, #e2e8f0) !important;
    border-radius: var(--radius-xl, 1rem) !important;
    padding: 2.25rem 2.5rem !important;
    box-shadow: 0 4px 20px -2px rgba(5, 16, 102, 0.07), 0 2px 6px -1px rgba(0, 0, 0, 0.04) !important;
    margin-inline: auto !important;
    margin-top: 1rem !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  /* Visit CLX Button — Made Visible & Professionally Positioned at Top-Right on Desktop/Laptop */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    position: absolute !important;
    top: 2rem !important;
    right: 2.25rem !important;
    height: auto !important;
    width: auto !important;
    padding: 0.55rem 1.35rem !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    color: #051066 !important;
    background: #f8b51b !important;
    border: 1px solid #e2a210 !important;
    border-radius: 9999px !important;
    box-shadow: 0 3px 10px rgba(248, 181, 27, 0.35) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    z-index: 20 !important;
    cursor: pointer !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1):hover {
    background: #e8a50e !important;
    box-shadow: 0 4px 14px rgba(248, 181, 27, 0.45) !important;
    transform: translateY(-1px) !important;
  }

  /* Showcase Inner Grid Layout */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: 1.15fr 0.85fr !important;
    gap: 2.25rem !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Left / Main Content Column */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Badges Row */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-bottom: 0.75rem !important;
    margin-top: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    padding: 0.25rem 0.65rem !important;
    border-radius: 9999px !important;
    letter-spacing: 0.02em !important;
    margin: 0 !important;
  }

  /* Title */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 1.85rem !important;
    font-weight: 700 !important;
    color: #051066 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    margin: 0 0 0.35rem 0 !important;
  }

  /* Sub-eyebrow */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #b38104 !important;
    text-align: left !important;
    margin: 0 0 0.85rem 0 !important;
    line-height: 1.4 !important;
  }

  /* Lead Description */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 0.95rem !important;
    line-height: 1.65 !important;
    color: #475569 !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Right / Detail Column */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 1rem !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Detail Boxes (Challenge & Solution) */
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    flex: 1 1 auto !important;
    background-color: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid #051066 !important;
    border-radius: 0.75rem !important;
    padding: 1.15rem 1.35rem !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    border-left-color: #f8b51b !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: #64748b !important;
    margin-bottom: 0.35rem !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 0.875rem !important;
    line-height: 1.55 !important;
    color: #1e293b !important;
    margin: 0 !important;
    text-align: left !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > a:nth-of-type(1) {
    font-size: var(--font-size-sm) !important;
    padding: 0.45rem 0.9rem !important;
    min-height: 36px !important;
    height: auto !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  /* Why We Exist Section - Increase width & align selection to center (Desktop 1200px) */
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) {
    max-width: 1200px !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-width: 1140px !important;
    width: 100% !important;
    margin-inline: auto !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 2rem !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) {
    width: 100% !important;
    max-width: 360px !important;
    padding: 2.25rem 2rem !important;
    text-align: center !important;
    align-items: center !important;
    justify-content: center !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div > h3,
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div > p,
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div > div {
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    font-size: 14px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-top: -15px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) {
    font-size: 14px !important;
    margin-top: -15px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) {
    font-size: 14px !important;
    margin-top: -15px !important;
  }

  /* Our Direction Section - Increase width & align selection to center (Desktop 1200px) */
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) {
    max-width: 1200px !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    text-align: center !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2 {
    text-align: center !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) {
    max-width: 1140px !important;
    width: 100% !important;
    margin-inline: auto !important;
    justify-content: center !important;
    align-items: center !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    width: 100% !important;
    margin-inline: auto !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) {
    width: 100% !important;
    box-sizing: border-box !important;
    margin-inline: auto !important;
    padding: 1.75rem 2rem !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > div:nth-of-type(1) {
    margin-right: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > h3:nth-of-type(1) {
    margin-left: 0 !important;
    margin-top: 0.5rem !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    text-align: justify !important;
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 15px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    height: 130px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-bottom: 0.4px !important;
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 16.8px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 16.8px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 33px !important;
    margin-bottom: 16px !important;
    margin-top: -16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 0px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-weight: bold !important;
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(2) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(6) {
    margin-top: 2px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > h3:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
    width: 800px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    width: 100% !important;
    margin-top: 1rem !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    width: 100% !important;
    grid-column: span 12 !important;
  }
}

/* Tablet (<992px) Responsive Adjustments */
@media (max-width: 992px) {
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    width: 100% !important;
    max-width: 750px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
    justify-items: center !important;
    align-items: center !important;
  }
}

/* Tablet (700px to 992px) Responsive Adjustments */
@media (min-width: 701px) and (max-width: 991px) {
  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
    font-weight: bold !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 21px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 21px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 13px !important;
    margin-top: 0px !important;
    padding-top: 3px !important;
    padding-bottom: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 13px !important;
    padding-bottom: 10px !important;
    padding-top: 3px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    text-align: center !important;
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    text-align: center !important;
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 21px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 21px !important;
    margin-top: -6px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(1) {
    padding-left: 0px !important;
    font-weight: bold !important;
    font-size: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-weight: bold !important;
    font-size: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-size: 10px !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(3) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(4) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) {
    width: 150px !important;
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
    text-align: justify !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
    text-align: justify !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13.84px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: 12px !important;
    background-color: #ffffff !important;
    border-width: 0px !important;
    margin-top: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    margin-top: -1px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 5px !important;
    margin-top: -4px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    margin-top: 0px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    margin-bottom: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) {
    margin-top: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-align: center !important;
    padding: 1.25rem 0.625rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    padding-left: 1px !important;
    padding-right: 0px !important;
    margin-right: -47px !important;
    margin-left: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) {
    height: 262.778px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-top: 80px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) {
    margin-top: 80px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    line-height: 22px !important;
    margin-top: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    line-height: 22.2px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    height: 231.611px !important;
  }

  main#mainContent:nth-of-type(1) > section#products:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > span:nth-of-type(1) {
    margin-top: -10px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    font-size: 13px !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    height: 69.4306px !important;
    padding-top: 0px !important;
  }

  footer:nth-of-type(1) {
    height: 257.514px !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) {
    height: 205.847px !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) {
    line-height: 21px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) {
    width: 550px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) {
    font-size: 17px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(3) > rect:nth-of-type(1) {
    width: 145px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(3) > text:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(3) > text:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(2) > text:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(2) > text:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(1) > text:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(1) > text:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(5) > text:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(5) > text:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(4) > text:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > svg:nth-of-type(1) > g:nth-of-type(4) > text:nth-of-type(2) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    width: 276.778px !important;
  }

  main#mainContent:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 4.6px !important;
    padding-bottom: 4.6px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > nav:nth-of-type(1) {
    padding-right: 550px !important;
    text-align: left !important;
    padding-left: 35px !important;
  }

  /* Why We Exist — 3 selections horizontally in one line for tablet responsive only */
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }

  /* Our Direction — 4 selections horizontally in one line for tablet responsive only */
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  #our-direction .direction-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  #our-direction .direction-card,
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    padding: 0.95rem 0.65rem !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }

  /* Our Direction — 2 left cards horizontally in one line for tablet responsive only */
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  #our-direction .direction-content {
    margin-bottom: 0.25rem !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-direction .direction-desc-card,
  #our-direction .direction-highlight-box {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) {
    background-color: #ffffff !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) {
    background-color: #fefefe !important;
    width: 300px !important;
    margin-left: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    padding-top: 4px !important;
    margin-top: -34px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    padding-top: 3px !important;
    padding-left: 13px !important;
    padding-right: 10px !important;
  }

  /* Five Core Categories — 5 selections horizontally in one line for tablet responsive only */
  #clx .grid-5,
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0.65rem 0.4rem !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) > h4:nth-of-type(1) {
    font-size: 16px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > h4:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4) > h4:nth-of-type(1) {
    font-size: 16px !important;
    line-height: 18px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h2:nth-of-type(1) {
    text-align: left !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-right: 0px !important;
    width: 350px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    width: 300px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-bottom: 0px !important;
    padding-bottom: 9px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) {
    width: 180px !important;
    margin-left: 320px !important;
    margin-top: -207px !important;
    height: 190px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) {
    width: 180px !important;
    margin-left: 160px !important;
    margin-top: -207px !important;
    height: 190px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(4) > div:nth-of-type(1) > a:nth-of-type(1) {
    font-size: 10.4px !important;
    width: 210.75px !important;
    height: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    line-height: 35px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    margin-top: -10px !important;
  }

  /* Ecosystem Architecture Node Cards Polish (Tablet Only) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > p:nth-of-type(1) {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > h3:nth-of-type(1) {
    margin-top: -5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(2) > p:nth-of-type(1) {
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(3) > h3:nth-of-type(1) {
    margin-top: 4px !important;
  }

  /* Ecosystem Pillars Cards Typography & Badge Polish (Tablet Only) */
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span:nth-of-type(1) {
    margin-top: 22px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > span:nth-of-type(1) {
    margin-top: 54px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1) {
    margin-top: 38px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > span:nth-of-type(1) {
    margin-top: 6px !important;
  }
}

@media (min-width: 992px) {
  main#mainContent:nth-of-type(1) > section:nth-of-type(1) {
    height: auto !important;
    min-height: fit-content !important;
    overflow: visible !important;
  }

  .hero-section,
  .page-hero {
    height: auto !important;
    min-height: fit-content !important;
    overflow: visible !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) {
    padding-block: var(--space-2xl, 3rem) !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) {
    max-width: 1200px !important;
    width: 92% !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(5),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(7),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(8),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(9),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(10),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(11),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) {
    background-color: var(--color-white, #ffffff) !important;
    border: 1px solid var(--color-border, #e2e8f0) !important;
    border-radius: var(--radius-xl, 1rem) !important;
    padding: 1.75rem !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(13) {
    background-color: var(--color-white, #ffffff) !important;
    border: 1px solid var(--color-border, #e2e8f0) !important;
    border-radius: var(--radius-xl, 1rem) !important;
    padding: 1.75rem !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
    width: 535.458px !important;
    margin-left: 290px !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(13) > div:nth-of-type(1) {
    line-height: 19px !important;
    margin-top: 1px !important;
    height: 156.722px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(13) > div:nth-of-type(1) > p:nth-of-type(2) {
    margin-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(13) > div:nth-of-type(1) > p:nth-of-type(3) {
    margin-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(13) > div:nth-of-type(1) > p:nth-of-type(4) {
    margin-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > ul:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > ul:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(5) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > ul:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(7) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(8) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(9) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(10) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(11) > p:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) > p:nth-of-type(1) {
    text-align: justify !important;
  }

  /* Five Core Categories — 5 cards horizontally in one line on desktop/laptop */
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1),
  #clx .grid-5 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: var(--space-sm, 0.75rem) !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(5) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0.85rem 0.65rem !important;
    height: 100% !important;
  }
}

/* ==========================================================================
   TARGETED MOBILE RESPONSIVE OVERRIDES (max-width: 767px)
   ========================================================================== */
@media (max-width: 767px) {
  header#siteHeader:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) > img:nth-of-type(1),
  .site-header .brand-logo-img {
    width: 150px !important;
    height: 40px !important;
    margin-left: -35px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    text-align: justify !important;
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    text-align: left !important;
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 10px !important;
    font-weight: bold !important;
  }

  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    margin-top: -17px !important;
    padding-bottom: 6.4px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    height: 30px !important;
    margin-bottom: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#who-we-are:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#what-we-do:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(3) > a:nth-of-type(1) {
    padding-left: 0px !important;
    padding-right: 0px !important;
    height: 25px !important;
    width: 170px !important;
  }


  /* Footer horizontally in one line for mobile responsive across all webpages */
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1),
  .site-footer .footer-grid,
  footer .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    margin-bottom: 1rem !important;
    align-items: start !important;
    box-sizing: border-box !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1),
  .footer-col-brand,
  .site-footer .footer-col-brand {
    display: none !important;
  }

  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2),
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3),
  footer:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4),
  .site-footer .footer-col-company,
  .site-footer .footer-col-products,
  .site-footer .footer-col-contact,
  .footer-col-company,
  .footer-col-products,
  .footer-col-contact {
    display: flex !important;
    flex-direction: column !important;
    grid-column: span 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .site-footer .footer-heading,
  .footer-col .footer-heading {
    text-align: center !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    margin-bottom: 0.35rem !important;
  }

  .site-footer .footer-links,
  .footer-col .footer-links {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    gap: 0.2rem !important;
  }

  .site-footer .footer-link,
  .footer-col .footer-link {
    font-size: 9.5px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    display: block !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  .site-footer .footer-contact-info,
  .footer-col .footer-contact-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.25rem !important;
    width: 100% !important;
  }

  .site-footer .footer-contact-item,
  .footer-col .footer-contact-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 0.1rem !important;
    font-size: 9px !important;
    line-height: 1.3 !important;
    width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  .site-footer .footer-contact-item svg,
  .site-footer .footer-contact-icon {
    display: none !important;
  }

  /* 2x2x2 layout for Our Values (6 cards in 3 rows of 2) on Mobile */
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2),
  #our-values .values-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4),
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5),
  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(6),
  #our-values .value-card {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 11.6px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

  /* Disable CEO Strategic Focus / Philosophy block on Mobile */
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  .ceo-key-focus {
    display: none !important;
  }

  /* About Story Mobile Styles */
  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    height: 30px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 14.5px !important;
    margin-top: -12px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 14.5px !important;
    margin-top: -12px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#about-story:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  /* Why We Exist & Section Headings */
  main#mainContent:nth-of-type(1) > section#why-we-exist:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-values:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  /* Leadership Section Mobile Styles */
  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > h3:nth-of-type(1) {
    font-size: 18px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(2) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h3:nth-of-type(1) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) > strong:nth-of-type(1) {
    font-weight: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(2) > strong:nth-of-type(1) {
    font-weight: normal !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(3) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#leadership:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(4) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  /* Our Direction Section Mobile Styles */
  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#our-direction:nth-of-type(6) {
    padding-top: 2px !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    height: 740px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11.41px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    font-size: 10px !important;
  }

  /* Products page mobile overrides */
  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    padding-left: 7px !important;
    padding-right: 7px !important;
  }

  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
    width: 290px !important;
    margin-top: -12px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) {
    width: 290px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
    margin-top: 0px !important;
  }


  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > div:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    margin-top: -14px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) {
    padding-top: 10px !important;
    padding-bottom: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) {
    padding-top: 6px !important;
    padding-bottom: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) {
    margin-top: -22px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) {
    width: 200px !important;
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    width: 120px !important;
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    width: 130px !important;
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 10px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(7) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 11.4px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) {
    text-align: center !important;
    border-color: #99892d !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) {
    text-align: center !important;
    border-color: #99892d !important;
  }

  /* Disable Five Core Categories block in CLX on Mobile */
  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(4) {
    display: none !important;
  }

  main#mainContent:nth-of-type(1) > section#clx:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(5) {
    padding-top: 9px !important;
    padding-bottom: 7px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) {
    padding-top: 5px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 14px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) {
    height: 160.708px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    margin-top: -6px !important;
    margin-bottom: -16px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > a:nth-of-type(1) {
    width: 130px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(1) {
    width: 135px !important;
  }

  main#mainContent:nth-of-type(1) > section#contact-cta:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section:nth-of-type(6) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > a:nth-of-type(2) {
    width: 135px !important;
  }

  /* 2x2x1 Professional Layout for Why Dandalin Sauki on Mobile */
  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki > div:nth-of-type(1) > div:nth-of-type(2) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1),
  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2),
  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3),
  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0.875rem 0.75rem !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0.875rem 0.75rem !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > h3:nth-of-type(1) {
    font-size: 13px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#why-dandalin-sauki:nth-of-type(5) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) {
    margin-bottom: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1) {
    font-size: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4) > span:nth-of-type(1) {
    font-size: 8px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > h3:nth-of-type(1) {
    font-size: 11px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section#ecosystem:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(5) > span:nth-of-type(1) {
    font-size: 10px !important;
    margin-top: 7px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) > div:nth-of-type(1) > div:nth-of-type(1) {
    display: none !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(4) {
    display: none !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(1) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > ul:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > ul:nth-of-type(1) > li:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > ul:nth-of-type(1) > li:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) > ul:nth-of-type(1) > li:nth-of-type(3) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(2) {
    margin-bottom: 28px !important;
    padding-bottom: 0px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > ul:nth-of-type(1) > li:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > ul:nth-of-type(1) > li:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > ul:nth-of-type(1) > li:nth-of-type(3) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(3) > ul:nth-of-type(1) > li:nth-of-type(4) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(4) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(4) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(5) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(5) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > ul:nth-of-type(1) > li:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > ul:nth-of-type(1) > li:nth-of-type(2) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(6) > ul:nth-of-type(1) > li:nth-of-type(3) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(7) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(7) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(8) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(8) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(9) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(9) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(10) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(10) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(11) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(11) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) > h2:nth-of-type(1) {
    font-size: 15px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) > p:nth-of-type(1) {
    font-size: 12px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) > div:nth-of-type(1) > p:nth-of-type(1) {
    height: 14.5278px !important;
  }

  main#mainContent:nth-of-type(1) > section:nth-of-type(2) > div:nth-of-type(1) > article:nth-of-type(1) > div:nth-of-type(12) > div:nth-of-type(1) {
    height: 140.403px !important;
    padding-left: 11px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}

/* ==========================================================================
   HOMEPAGE — FINAL MOBILE FIXES (max-width: 480px ONLY)
   Appended LAST so it wins the cascade over the generic (max-width: 767px)
   rules above (e.g. `.btn { width:100%; min-height:44px }`) which were
   overriding the earlier homepage compact mobile polish.
   Scoped to homepage sections only — no desktop/tablet rules are touched.
   ========================================================================== */
@media (max-width: 480px) {

  /* ---------- 1 & 3. HERO — COMPACT SCALE, ALIGNED WITH PAGE MARGIN ---------- */
  .hero-section .hero-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
  }

  .hero-headline,
  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > h1:nth-of-type(1) {
    font-size: 1.375rem !important;
    line-height: 1.25 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
    overflow-wrap: break-word !important;
  }

  .hero-description,
  main#mainContent:nth-of-type(1) > section#hero:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > p:nth-of-type(2) {
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    overflow-wrap: break-word !important;
  }

  .hero-badge-pill {
    margin-left: 0 !important;
  }

  /* ---------- 1. HERO BUTTONS — COMPACT, CONSISTENT, VISIBLE ---------- */
  .hero-section .btn-group-responsive {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    gap: 0.5rem !important;
    justify-content: flex-start !important;
    align-items: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .hero-section .btn-group-responsive .btn,
  .hero-section .btn-group-responsive .btn-primary,
  .hero-section .btn-group-responsive .btn-outline {
    width: auto !important;
    flex: 0 1 auto !important;
    min-height: 34px !important;
    height: auto !important;
    padding: 0.45rem 0.85rem !important;
    font-size: 0.775rem !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* ---------- 4. "WHO WE ARE" HEADING — SAME AS OTHER SECTION HEADINGS ---------- */
  .who-we-are-eyebrow-container .h2,
  .who-we-are-eyebrow-container h2 {
    font-size: 15px !important;
    line-height: 20px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-align: center !important;
    margin-bottom: 0 !important;
  }

  /* ---------- 5. PRACTICAL UTILITY + LOCAL RELEVANCE — ONE ROW ---------- */
  .who-we-are-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    align-items: stretch !important;
  }

  .who-we-are-card,
  .who-we-are-card:nth-child(1),
  .who-we-are-card:nth-child(2) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 0.6rem 0.45rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .who-we-are-card .card-icon,
  .who-we-are-card:nth-child(1) .card-icon,
  .who-we-are-card:nth-child(2) .card-icon {
    width: 26px !important;
    height: 26px !important;
    margin: 0 auto 0.3rem auto !important;
    margin-top: 0 !important;
    line-height: normal !important;
  }

  .who-we-are-card .card-icon svg {
    width: 16px !important;
    height: 16px !important;
  }

  .who-we-are-card .card-title-primary,
  .who-we-are-card .h3,
  .who-we-are-card h3 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  .who-we-are-card p,
  .who-we-are-card:nth-child(1) p {
    font-size: 0.65rem !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin: 0 !important;
    overflow-wrap: break-word !important;
  }

  /* ---------- 6. LEARN ABOUT US BUTTON — COMPACT & CENTERED ---------- */
  .who-we-are-bottom-btn-wrap {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-top: 0.6rem !important;
    margin-bottom: 0 !important;
  }

  .who-we-are-bottom-btn-wrap .btn,
  .who-we-are-bottom-btn-wrap a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    max-width: 100% !important;
    min-height: 34px !important;
    height: auto !important;
    padding: 0.45rem 0.9rem !important;
    font-size: 0.775rem !important;
    margin: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* ---------- 7. GENERAL — SAFE WRAPPING ---------- */
  .hero-content *,
  .who-we-are-card * {
    min-width: 0;
  }
}
/* CLX direct-download entry point: compact, wrapping actions on small screens. */
.clx-action-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.clx-download-link {
  background: #F8B51B;
  border-color: #F8B51B;
  color: #051066;
}

.clx-download-link:hover,
.clx-download-link:focus-visible {
  background: #FFFFFF;
  border-color: #F8B51B;
  color: #0F2D74;
}

@media (max-width: 480px) {
  main#mainContent > section#hero .clx-action-group {
    flex-wrap: wrap !important;
  }

  main#mainContent > section#hero .clx-action-group > a {
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 0.45rem 0.7rem !important;
    font-size: 0.8rem !important;
  }
}