/* steven-durgarn.com: black, clean, Roboto. Scoped to .site-durgarn. */
.site-durgarn {
  margin: 0; color: #fff;
  background: linear-gradient(180deg, #171717 0%, #0a0a0a 45%, #000 100%);
  background-attachment: fixed;
  font-family: "Roboto", Arial, sans-serif; font-size: 15px; line-height: 1.55;
  -webkit-font-smoothing: antialiased;

  & *, & *::before, & *::after { box-sizing: border-box; }
  & a { color: #fff; }
  & img { max-width: 100%; display: block; }

  .sd-wrap { max-width: 1010px; margin: 0 auto; padding: 0 20px; }

  /* Social icons */
  .sd-social { display: flex; justify-content: flex-end; gap: 6px; padding-top: 10px; }
  .sd-icon { width: 45px; height: 45px; border-radius: 50%; display: grid; place-items: center; transition: transform .2s; }
  .sd-icon:hover { transform: scale(1.08); }
  .sd-icon svg { width: 22px; height: 22px; fill: #fff; }
  .sd-icon--fb { background: #3b5998; }
  .sd-icon--tw { background: #1da1f2; }
  .sd-icon--ig { background: #e62e2e; }

  /* Hero */
  .sd-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; padding-top: 70px; padding-bottom: 60px; }
  .sd-hero__photo img { width: 100%; max-width: 470px; margin-left: auto; margin-top: 30px; }
  .sd-hero__text h1 { font-size: 56px; font-weight: 700; line-height: 1.1; margin: 0 0 12px; }
  .sd-hero__text h6 { font-size: 16px; font-weight: 700; margin: 0 0 30px; letter-spacing: .02em; }
  .sd-bio p { margin: 0 0 14px; }

  /* Headings */
  .sd-h2 { font-size: 44px; font-weight: 700; margin: 0 0 30px; line-height: 1.1; }
  .sd-h3 { font-size: 22px; font-weight: 700; margin: 28px 0 14px; }
  .sd-center { text-align: center; }
  .sd-section { padding-top: 40px; padding-bottom: 50px; }

  /* Headshots */
  .sd-headshots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
  .sd-headshots img { width: 100%; aspect-ratio: 480 / 560; object-fit: cover; border: 1px solid #fff; }
  .sd-headshots a:hover img { opacity: .85; }

  /* Resume columns */
  .sd-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
  .sd-cols--info { margin-top: 50px; }
  .sd-cat { font-size: 15px; font-weight: 700; margin: 0 0 14px; }
  .sd-list { list-style: none; margin: 0 0 22px; padding: 0; }
  .sd-list li { margin: 0; }
  .sd-title { font-weight: 700; text-decoration: none; }
  a.sd-title:hover { text-decoration: underline; }

  /* Representation */
  .sd-rep__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; text-align: center; }
  .sd-agency__logo { width: 148px; height: 148px; object-fit: contain; background: #fff; margin: 0 auto 30px; }
  .sd-agency h3 { font-size: 32px; font-weight: 700; margin: 0 0 10px; }
  .sd-agency p { margin: 0; word-break: break-word; }
  .sd-agency p a { text-decoration: none; }

  /* Videos */
  .sd-video { position: relative; aspect-ratio: 16 / 9; background: #111; }
  .sd-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
  .sd-reels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }

  /* Footer */
  .sd-footer { max-width: 1010px; margin: 40px auto 0; padding: 50px 20px 60px; border-top: 1px solid #fff; text-align: center; font-size: 13px; }
  .sd-footer p { margin: 0 0 6px; }
  .sd-dev a { text-decoration: underline; margin: 0 .25rem; }

  /* Phones and tablets */
  @media (max-width: 800px) {
    .sd-hero, .sd-cols, .sd-rep__grid { grid-template-columns: 1fr; }
    .sd-hero { padding-top: 20px; }
    .sd-hero__photo img { margin: 0 auto; max-width: 340px; }
    .sd-hero__text h1 { font-size: 40px; }
    .sd-h2 { font-size: 34px; }
    .sd-headshots { grid-template-columns: repeat(2, 1fr); }
    .sd-reels { grid-template-columns: 1fr; }
  }
}