.author-media-wrapper {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid var(--p);
    flex-shrink: 0;
    background: #000;
  }
  .author-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 90%;
    border-radius: 50%;
    display: block;
  }
  .author-photo-fallback {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 90%;
    border-radius: 50%;
  }
  @media (max-width: 768px) {
    .author-media-wrapper {
      margin: 0 auto 1rem;
    }
  }
  
  main.container { max-width: 800px; margin: 0 auto; padding: 1rem; line-height: 1.8; }
    h1 { font-size: 2.2rem; margin: 2rem 0 1.5rem; text-align: center; color: var(--p); }
    .article-date { text-align: center; color: #888; font-size: 1rem; margin-bottom: 2rem; font-style: italic; }
    h2 { font-size: 1.8rem; margin: 3rem 0 1.2rem; text-align: center; color: var(--p); padding-bottom: 0.5rem; border-bottom: 2px solid var(--pl); }
    p { margin-bottom: 1.4rem; font-size: 1.05rem; }
    ul.products { background: rgba(233,30,99,0.05); padding: 1.2rem; border-radius: 12px; margin: 1.8rem 0; }
    div.intro, div.conclusion { font-size: 1.1rem; line-height: 1.9; margin: 2rem 0; padding: 1.5rem; background: var(--card); border-left: 4px solid var(--p); border-radius: 8px; }
    div.table-of-contents { background: var(--card); padding: 2rem; border-radius: 16px; margin: 3rem 0; text-align: center; box-shadow: 0 6px 20px var(--sh); }
    div.table-of-contents ul { display: flex; flex-direction: column; gap: 0.8rem; align-items: center; list-style: none; padding: 0; max-width: 600px; margin: 0 auto; }
    div.table-of-contents a { display: block; width: 100%; max-width: 500px; padding: 1rem 1.5rem; background: var(--grad); color: #fff !important; font-weight: 600; text-decoration: none; border-radius: 50px; box-shadow: 0 4px 12px rgba(233,30,99,.3); transition: all .3s; }
    div.table-of-contents a:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(233,30,99,.4); }
    #faq + .subsection-content p { margin-bottom: 1.8rem; padding: 1rem 1.2rem; background: var(--card); border-radius: 10px; border-left: 4px solid var(--p); box-shadow: 0 2px 8px var(--sh); }
    #faq + .subsection-content p strong { display: block; margin-bottom: 0.6rem; font-size: 1.1rem; color: var(--p); }
    .article-figure {
      margin: 2.5rem 0;
      text-align: center;
    }
    .hero-figure {
      margin-bottom: 3rem;
    }
    .article-image {
      max-width: 100%;
      height: auto;
      display: block;
      margin: 0 auto;
      border-radius: 8px;
      box-shadow: 0 6px 20px rgba(0,0,0,0.1);
    }
    .hero-image {
      border-radius: 12px;
    }
    .image-caption {
      font-size: 0.9rem;
      color: #666;
      margin-top: 0.8rem;
      font-style: italic;
      max-width: 700px;
      margin-left: auto;
      margin-right: auto;
      padding: 0 1rem;
    }
    .author-box { background: var(--card); border-radius: 16px; padding: 2rem; margin: 3rem 0 2rem; box-shadow: 0 6px 20px var(--sh); border: 1px solid var(--b); }
    .author-inner { display: flex; gap: 1.5rem; align-items: flex-start; }
    .author-photo { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; border: 4px solid var(--p); }
    .author-name { font-size: 1.5rem; margin: 0 0 0.5rem; color: var(--p); }
    .author-social a { width: 40px; height: 40px; background: var(--p); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; transition: .3s; }
    .author-social a:hover { background: #c2185b; transform: translateY(-3px); }
    @media (max-width: 768px) {
      .author-inner { flex-direction: column; text-align: center; }
      .author-photo { margin: 0 auto 1rem; }
    }
	
	.author-other-articles {
    margin-top: 1.4rem;
    font-size: 0.98rem;
    text-align: center;
    color: #444;
    border-top: 1px solid #eee;
    padding-top: 1rem;
  }

  .other-articles-link {
    color: var(--accent, #c2185b);
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
  }

  .other-articles-link:hover,
  .other-articles-link:focus {
    color: var(--accent-dark, #a11248);
    text-decoration: underline;
  }

  @media (max-width: 768px) {
    .author-other-articles {
      margin-top: 1.2rem;
      padding-top: 0.9rem;
    }
  }
  
  
    .recent-articles-section {
    margin: var(--recent-section-margin, 2.5rem 0 1.5rem);
    padding: var(--recent-section-padding, 1.5rem);
    background: var(--recent-bg, #f9f9f9);
    border-radius: var(--recent-border-radius, 8px);
  }
  .recent-articles-section h3 {
    margin: 0 0 1.2rem;
    font-size: 1.25rem;
    color: var(--text-heading, #222);
  }
  .recent-articles {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .recent-item {
    margin-bottom: var(--recent-item-gap, 1.1rem);
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--recent-border, #eee);
  }
  .recent-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .meta {
    font-size: 0.875rem;
    color: var(--text-muted, #666);
    margin-bottom: 0.4rem;
  }
  .meta time {
    font-weight: 500;
  }
  .meta .by {
    margin-left: 0.7rem;
  }
  .recent-item .title {
    display: block;
    font-weight: 600;
    color: var(--text-link, #c2185b);
    text-decoration: none;
    line-height: 1.35;
  }
  .recent-item .title:hover,
  .recent-item .title:focus {
    text-decoration: underline;
    color: var(--text-link-hover, #a11248);
  }
  .article-byline {
    margin: 0.6rem 0 1.8rem;
    font-size: 1.05rem;
    color: #555;
    font-style: normal;
    text-align: center;           /* or center if preferred */
  }

  .article-byline .author-link {
    color: var(--accent, #c2185b);
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
  }

  .article-byline .author-link:hover,
  .article-byline .author-link:focus {
    color: var(--accent-dark, #a11248);
    text-decoration: underline;
  }
  
    .recent-articles-section {
    margin: var(--recent-section-margin, 2.5rem 0 1.5rem);
    padding: var(--recent-section-padding, 1.5rem);
    background: var(--recent-bg, #f9f9f9);
    border-radius: var(--recent-border-radius, 8px);
  }
  .recent-articles-section h3 {
    margin: 0 0 1.2rem;
    font-size: 1.25rem;
    color: var(--text-heading, #222);
  }
  .recent-articles {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .recent-item {
    margin-bottom: var(--recent-item-gap, 1.1rem);
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--recent-border, #eee);
  }
  .recent-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .meta {
    font-size: 0.875rem;
    color: var(--text-muted, #666);
    margin-bottom: 0.4rem;
  }
  .meta time {
    font-weight: 500;
  }
  .meta .by {
    margin-left: 0.7rem;
  }
  .recent-item .title {
    display: block;
    font-weight: 600;
    color: var(--text-link, #c2185b);
    text-decoration: none;
    line-height: 1.35;
  }
  .recent-item .title:hover,
  .recent-item .title:focus {
    text-decoration: underline;
    color: var(--text-link-hover, #a11248);
  }