/* A quieter frame around the expressive work. */
.hero-landscape svg { opacity: .12; }
.proof-intro { padding-block: 30px; }
.proof-intro>a { padding-block: 25px; }
.benefits { padding-block: 70px 38px; }
.benefits-heading { align-items: end; grid-template-columns: 1.45fr 1fr; gap: 7%; }
.benefits-heading>p { padding-bottom: 4px; max-width: 375px; }
.client-case { padding-block: 55px 85px; }
.case-project { padding: 30px 30px 16px; background: #eae1d6; }
.case-heading { margin-bottom: 37px; }
.case-bottom { margin-top: 29px; }
.header .desktop-nav a { transition: color .2s; }
.header .desktop-nav a:hover { color: var(--clay); }
.contact-copy { position: static; grid-column: 1; grid-row: 1; }
.contact-paper { grid-column: 2; grid-row: 1 / span 2; }
.contact-support { grid-column: 1; grid-row: 2; }
.contact-layout { row-gap: 0; }
.form-fallback { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-top: 12px; }
.form-fallback a { display: inline-flex; align-items: center; min-height: 44px; color: var(--clay); font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.form-fallback[hidden] { display: none; }
.quick-restart { display: block; min-height: 44px; margin-top: 20px; padding: 6px 0; color: var(--clay); background: none; text-decoration: underline; text-underline-offset: 4px; font-size: 14px; }
.quick-success .quick-restart+.button { margin-top: 9px; }
@media(max-width:900px) {
  .benefits-heading { grid-template-columns: 1fr; gap: 20px; }
  .benefits-heading>p { max-width: 550px; padding-bottom: 0; }
}
@media(max-width:800px) {
  .contact-layout { grid-template-columns: minmax(0,1fr); row-gap: 30px; }
  .contact-copy,.contact-paper,.contact-support { grid-column: 1; grid-row: auto; min-width: 0; }
  .contact-paper { max-width: none; }
  .contact-support .contact-next { margin-top: 0; }
}
@media(max-width:640px) {
  .proof-intro { padding-block: 20px 10px; }
  .proof-intro>a { padding-block: 20px; }
  .benefits { padding-block: 45px 22px; }
  .benefits-heading { gap: 18px; }
  .benefits-heading>p { font-size: 16px; line-height: 1.65; }
  .client-case { padding-block: 37px 60px; }
  .case-heading { margin-bottom: 28px; }
  .case-project { padding: 16px 16px 8px; }
  .case-bottom { margin-top: 25px; }
}
@media(max-width:480px) {
  .header-actions>.button { display: none; }
  .header .brand { font-size: 25px; gap: 9px; }
  .header .brand img { width: 32px; }
  .header .menu-toggle { width: 44px; height: 44px; }
  .header .menu-toggle span { margin-inline: auto; }
}

/* Keep the studio lettering for display; use a quieter face for practical details. */
.delivery-items h3, .case-delivery h3, .contact-next h3,
.faq-items details>summary, .form-field label {
  font-family: system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: -.018em;
  line-height: 1.35;
}
.delivery-items p, .case-delivery p, .faq-items details>div>p, .contact-next p {
  font-family: system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
  max-inline-size: 60ch;
}
.faq-items details>summary { gap: 1rem; padding-block: 1.15rem; }
.faq-items details>summary span { flex-shrink: 0; }
.delivery-items h3 { margin-block-end: .5rem; }
@media(max-width:640px) {
  .delivery-heading, .benefits-heading { row-gap: .85rem; }
  .faq-items details>summary { font-size: 1rem; }
}

.client-case .case-numbers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,1.6vw,22px);margin:8px 0 28px}
.client-case .case-numbers dd{font-size:clamp(32px,4.2vw,68px);letter-spacing:-.065em}
.client-case .case-numbers dt{font-size:clamp(12px,1.1vw,15px);line-height:1.35}
/* Gallery spread: a print and its accompanying customer note. */
.client-case .case-layout{background:#f1eae0;border-block:1px solid #ded2c2;padding:clamp(18px,3vw,44px);gap:clamp(24px,4vw,56px)}
.client-case .case-project{padding:0;background:transparent}
.client-case .case-story{display:block;min-width:0}
.client-case .case-quote blockquote{font-size:clamp(21px,2vw,30px);line-height:1.38;text-wrap:pretty}
.client-case .case-numbers{border-bottom:1px solid #d8cabb;padding-bottom:22px}
.client-case .case-quote{border:0;padding:0}
.client-case .case-numbers dt{font:normal .83rem/1.4 Arial,sans-serif;color:#594638}
.faq .faq-items details>summary{font:400 clamp(18px,1.55vw,23px)/1.4 'Studio Serif',Georgia,serif;letter-spacing:0}
.industry-benefit .industry-benefit-copy h3{font:500 clamp(19px,1.65vw,24px)/1.35 'Helvetica Neue',Arial,sans-serif;letter-spacing:-.018em;text-wrap:balance}
.industry-showcase .industry-footnote{font:400 13px/1.5 'Helvetica Neue',Arial,sans-serif}

/* Phone in header + footer SEO links */
.header-actions{display:flex;align-items:center;gap:22px}
.header-phone{font-size:15px;color:var(--ink);text-decoration:none;white-space:nowrap;border-bottom:1px solid transparent;transition:border-color .2s,color .2s}
.header-phone:hover{color:var(--clay);border-color:currentColor}
.header-phone-label{opacity:.65}
@media(max-width:900px){.header-actions{gap:12px}.header-phone-label{display:none}.header-phone{font-size:14px}}
@media(max-width:420px){.header-phone{display:none}}
.footer-seo{display:flex;flex-wrap:wrap;gap:10px 28px;padding:18px 0 4px;font-size:14px}
.footer-seo a{color:inherit;opacity:.75;text-decoration:none}
.footer-seo a:hover{opacity:1;text-decoration:underline}