/* ---------------------------------------------------
   ABOUT PAGE SPECIFIC STYLES
--------------------------------------------------- */

/* Specific overrides for about page */

/* Dotted line decorations after sections */
/* Short dotted lines (for sections 1-3) */
.about-item:nth-child(1) span::after {
  content: '676767676767';
}
.about-item:nth-child(2) span::after {
  content: '676767676767676767676767666';
}
.about-item:nth-child(3) span::after {
  content: '676767676767677';
}
.about-item:nth-child(4) span::after {
  content: '6767676767676666';
}

/* =======================================================
   RESPONSIVE STYLES
======================================================= */
/* -----------------------------------------------------
   LARGE SCREENS (1201px+)
----------------------------------------------------- */
/* Base styles above apply to large screens */

/* -----------------------------------------------------
  TABLETS (769px-1180px)
----------------------------------------------------- */
@media (min-width: 769px) and (max-width: 1180px) {
  .about-item:nth-child(1) span::after {
    content: '676767677';
  }
  .about-item:nth-child(2) span::after {
    content: '67676767676767';
  }
  .about-item:nth-child(3) span::after {
    content: '676767666776767';
  }
  .about-item:nth-child(4) span::after {
    content: '67676767';
  }
}

/* -----------------------------------------------------
  TABLETS PORTRAIT (769px-1380px and portrait)
----------------------------------------------------- */
@media (min-width: 769px) and (max-width: 1380px) and (orientation: portrait) {
  /* Ensure all text is consistent with landscape mode */
  .about-item p {
    font-size: 24px !important;
  }
}
/* ---------------------------------------------------
   MOBILE STYLES
--------------------------------------------------- */
@media (max-width: 768px), (orientation: landscape) and (max-width: 932px) {
  /* Mobile-specific styles for about page */
  .about-item:nth-child(1) span::after {
    content: '67676767';
  }
  .about-item:nth-child(2) span::after {
    content: '67676767';
  }
  .about-item:nth-child(3) span::after {
    content: '67676767';
  }
  .about-item:nth-child(4) span::after {
    content: '67676766';
  }
}
