@import url(silvia/colors.scss);

/* title and subtitle */
#title-block-header {
  margin-bottom: 0px;
}

/* see all links — SRH-style */
.about-links.subtitle {
  font-family: "Montserrat";
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--spc-secondary);
}

/* social links: block of links */
.about-entity .about-links {
  justify-content: center !important;
  column-gap: 0.15em !important;
  font-size: 1.3em !important;
}

/* social links: individual links */
.about-entity .about-link {
  padding: 0.25em 0.25em !important;
  border: none !important;
  transition: transform 0.2s ease;
}

.about-entity .about-link:hover {
  transform: scale(1.2);
}

/* about area — SRH-style with gradient and orange left border */
.about-entity {
  background-color: var(--spc-bg-1);
  padding: 3em 0em 3em 0em !important;
  margin: 0em 2em 0em 2em;
  border-radius: 8px;
  border-left: 5px solid var(--spc-secondary);
}

/* ================================================
   iPad (≤1024px)
   ================================================ */
@media screen and (max-width: 1024px) {
  .about-entity {
    margin: 0em 1em;
  }

  .about-entity .about-links {
    font-size: 1.2em !important;
  }
}

/* ================================================
   Tablet (≤768px)
   ================================================ */
@media screen and (max-width: 768px) {
  .about-entity {
    margin: 0em 0.75em;
    padding: 2em 0em !important;
  }

  .about-entity .about-links {
    font-size: 1.1em !important;
  }
}

/* ================================================
   Mobile (≤576px)
   ================================================ */
@media screen and (max-width: 576px) {
  /* social links: block of links */
  .about-entity .about-links {
    font-size: 1em !important;
  }

  /* about area */
  .about-entity {
    margin: 0em 0em;
    padding: 1.5em 0em !important;
  }

  /* tighter text */
  .about-contents {
    font-size: 0.95em;
  }

  /* see all links */
  .about-links.subtitle {
    font-size: 0.85em;
  }

  /* restrict oversized template images on mobile */
  .about-image {
    max-width: 100% !important;
  }
  .about-image img {
    max-width: 100% !important;
    height: auto !important;
  }
}