/* Made by Codex · 2026-09-26 · from: "Include Instagram and TikTok" · session 01a0de73-8781-76e2-9e1a-17ace1b2bbce */
/* Made by Codex · 2026-09-26 · from: "put her niches on the top menu bar" · session 01a0de73-8781-76e2-9e1a-17ace1b2bbce */
.portfolio-intro { padding-block: clamp(48px, 7vw, 96px); }
.portfolio-intro h1 { max-width: 14ch; font-size: clamp(2.75rem, 6vw, 5rem); line-height: 1.02; letter-spacing: -.035em; font-weight: 500; }
.portfolio-intro p { max-width: 58ch; margin-top: 24px; font-size: 1.1rem; line-height: 1.55; }
.portfolio-text-link { display: inline-block; margin-top: 20px; padding-block: 12px; text-decoration: underline; text-underline-offset: 4px; line-height: 1.5; }
.portfolio-section { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 2fr); align-items: start; gap: 48px; padding-block: 64px; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.portfolio-section-copy h2 { font-size: clamp(2rem, 3vw, 3rem); letter-spacing: -.03em; line-height: 1.08; font-weight: 500; }
.portfolio-section-copy p { max-width: 30ch; margin-top: 16px; color: #454545; line-height: 1.5; }
.portfolio-posts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.portfolio-single { grid-template-columns: minmax(0, 1fr); max-width: 480px; }
.portfolio-post { display: block; min-width: 0; }
.portfolio-post img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; background: var(--soft); }
.portfolio-post h3 { margin-top: 20px; font-size: 1.3rem; font-weight: 600; letter-spacing: -.02em; }
.portfolio-post p { margin-top: 8px; color: #454545; line-height: 1.5; }
.portfolio-post-action { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; text-decoration: underline; text-underline-offset: 4px; font-size: .95rem; }
.portfolio-post:hover .portfolio-post-action { text-decoration-thickness: 2px; }
@media (max-width: 900px) {
  .portfolio-section { grid-template-columns: 1fr; gap: 28px; padding-block: 48px; }
  .portfolio-section-copy p { max-width: 55ch; }
}
@media (max-width: 560px) {
  .portfolio-posts { grid-template-columns: 1fr; gap: 36px; }
  .portfolio-post img { max-height: 520px; }
}