/* Layout, readability and public portfolio refinements. */
html { scroll-padding-top: 100px; }
#site-content:focus { outline: none; }
.skip-link { position: fixed; z-index: 200; top: 12px; left: 12px; padding: 14px 20px; background: #fff; color: #111; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
:focus-visible { outline: 2px solid #e8b3bc; outline-offset: 5px; }
img { max-width: 100%; }
.gallery-item { margin-left: 0; margin-right: 0; min-width: 0; }
.gallery-caption strong, .project-head h1 { overflow-wrap: anywhere; }
.gallery-caption span b, .mobile-nav a span { color: #d77887; }
.footer-bottom { color: #aaa; font-size: 11px; }
.footer-bottom button, .studio-access { min-height: 44px; }
.studio-access { display: inline-flex; align-items: center; font-size: 12px; color: #bcbcbc; }
.text-link { max-width: 100%; white-space: normal; overflow-wrap: anywhere; line-height: 1.6; }
.text-link svg, .primary-cta svg, .secondary-cta svg { flex-shrink: 0; }
.digital-main > *, .digital-identity-body > *, .contact-body > * { min-width: 0; }
.contact-form input, .contact-form select, .contact-form textarea { font-size: 16px; line-height: 1.5; }
.contact-form label { font-size: 13px; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #96969b; }
.form-end p { color: #aaa; font-size: 12px; }
.form-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.form-status { font-size: 14px; }
.website-visit { margin-top: 20px; min-height: 44px; }
.website-main-link { margin: 25px 0; }
.project-description { white-space: pre-line; }
.project-head h1 { font-size: clamp(45px, 8.5vw, 130px); }
.digital-work { padding: 100px clamp(25px, 7.5vw, 145px); background: #101116; scroll-margin-top: 90px; }
.digital-work .section-heading { margin-bottom: 60px; }
.digital-showcase-cover { margin-bottom: 60px; background: #1a1b20; }
.digital-showcase-cover img { display: block; width: 100%; max-height: 700px; object-fit: contain; }
.error-page { min-height: 100svh; padding: clamp(100px, 15vh, 180px) max(24px, 8vw); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 30px; background: #101012; }
.error-page h1 { font-family: 'Barlow Condensed', sans-serif; font-size: clamp(64px, 15vw, 180px); margin: 0; }
.error-page p { color: #bbb; max-width: 48ch; }
.error-links { display: flex; gap: 30px; flex-wrap: wrap; align-items: center; }
.error-page pre { max-width: 100%; overflow: auto; font-size: 12px; }
@media(max-width: 1100px) {
  html { scroll-padding-top: 80px; }
  .hero-title-wrap h1 { font-size: clamp(48px, 14vw, 110px); }
  .page-intro h1 { font-size: clamp(48px, 13.5vw, 110px); overflow-wrap: normal; }
  .digital-identity h1, .digital-main h2 { font-size: clamp(44px, 13.4vw, 100px); }
  .section-cta h2, .digital-future h2 { font-size: clamp(43px, 12vw, 96px); overflow-wrap: normal; }
  .digital-work { padding: 80px 24px; }
  .contact-title h1 { font-size: clamp(56px, 14vw, 100px); }
  .contact-form input, .contact-form select, .contact-form textarea { padding: 14px; }
  .secondary-cta { min-height: 44px; }
  .category-filter button { min-height: 44px; }
  .gallery-caption strong { font-size: clamp(25px, 7vw, 38px); }
  .project-head h1 { font-size: clamp(42px, 11vw, 85px); }
  .digital-identity { height: auto; min-height: 700px; gap: 45px; }
}
@media(max-width: 390px) {
  .hero-title-wrap h1 { font-size: clamp(43px, 14vw, 55px); }
  .page-intro h1 { font-size: clamp(43px, 13.4vw, 52px); }
  .section-heading h2, .featured-section h2, .editorial-statement h2, .digital-about h2 { font-size: 52px; }
  .section-cta h2 { font-size: 43px; }
  .primary-cta { gap: 16px; }
}
@media(max-width: 600px) {
  .detail-copy h3 { font-size: clamp(44px, 14vw, 64px); }
  .live-approach h2 { font-size: clamp(44px, 13vw, 65px); }
}