@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url("assets/fonts/InterVariable.woff2") format("woff2"); }
/* One readable type scale across all pages, including transition previews. */
:root {
  --type-family: 'Inter', Arial, sans-serif;
  --type-body: 16px;
  --type-label: 12px;
  --type-meta: 14px;
  --type-muted: #b0b8ac;
}
:root body { font-family: var(--type-family); font-size: var(--type-body); line-height: 1.65; font-weight: 400; }
:root button, :root input, :root textarea, :root select { font-family: var(--type-family); }
:root .menu-button { min-height: 44px; font-size: 14px; line-height: 1.4; font-weight: 500; letter-spacing: .025em; text-transform: none; }
:root .eyebrow { font-family: var(--type-family); font-size: 12px; line-height: 1.5; font-weight: 500; letter-spacing: .075em; color: #b7bfb2; }
:root .intro h1 { font: 500 clamp(36px,4.4vw,60px)/1.12 var(--type-family); letter-spacing: -.035em; }
:root .intro-copy p { font: 400 17px/1.8 var(--type-family); color: #d7ddd2; }
:root .text-link { font: 500 14px/1.5 var(--type-family); letter-spacing: .015em; text-transform: none; }
:root .footer-column small { color: #c8cfc1; font: 500 12px/1.5 var(--type-family); letter-spacing: .06em; }
:root .footer-column span, :root .footer-column a { font: 400 14px/1.7 var(--type-family); }
:root .footer-brand .footer-enquire { font: 500 14px/1.5 var(--type-family); letter-spacing: .015em; text-transform: none; }
:root .footer-copyright, :root .contact-page-footer p, :root .about-page-footer p, :root .services-page-footer p, :root .projects-footer p { font: 400 11px/1.6 var(--type-family); letter-spacing: .025em; text-transform: none; color: #b8c1b1; }
:root .hero-slide figcaption { font: 400 13px/1.5 var(--type-family); letter-spacing: .045em; }
:root .hero-slide figcaption span:first-child { font-size: 17px; font-weight: 500; letter-spacing: .025em; }
:root .menu-link { font: 400 clamp(38px,4.5vw,64px)/1.12 var(--type-family); letter-spacing: -.035em; }
:root .menu-sub-link { font: 500 clamp(18px,1.6vw,24px)/1.5 var(--type-family); letter-spacing: 0; }
:root .menu-foot { font: 400 12px/1.5 var(--type-family); letter-spacing: .045em; color: #c4cdbd; }
:root .page-hero h1, :root .services-title h1 { font: 500 clamp(50px,6.2vw,84px)/1.08 var(--type-family); letter-spacing: -.04em; }
:root .page-hero p { font: 400 18px/1.7 var(--type-family); color: #c8d0c1; }
:root .services-intro-copy { max-width: 72ch; font: 400 clamp(18px,1.6vw,22px)/1.75 var(--type-family); letter-spacing: 0; color: #e0e5da; }
:root .services-item h2 { font: 500 clamp(25px,2.2vw,32px)/1.25 var(--type-family); letter-spacing: -.02em; }
:root .services-item p { font: 400 16px/1.8 var(--type-family); color: #cdd6c5; }
:root .services-index { font: 500 12px/1.5 var(--type-family); letter-spacing: .04em; color: #c2cdb7; }
:root .about-story h1 { font: 500 clamp(44px,5.1vw,76px)/1.08 var(--type-family); letter-spacing: -.035em; }
:root .about-story-copy p { font: 400 17px/1.8 var(--type-family); color: #e5eade; }
:root .about-philosophy h2, :root .about-awards h2 { font: 500 clamp(34px,3.5vw,50px)/1.15 var(--type-family); letter-spacing: -.03em; }
:root .about-philosophy-copy p { font: 400 16px/1.8 var(--type-family); color: #cbd4c3; }
:root .about-philosophy-copy .about-principles { font: 500 clamp(18px,1.5vw,22px)/1.65 var(--type-family); letter-spacing: 0; color: #edf0e8; }
:root .about-award h3 { font: 500 18px/1.5 var(--type-family); letter-spacing: .005em; }
:root .about-award-project { font: 400 16px/1.5 var(--type-family); color: #cdd6c5; }
:root .about-award-year { font: 400 15px/1.5 var(--type-family); color: #b3bea8; }
:root .contact-page .contact-details small, :root .enquiry-field label { color: #bcc6b2; font: 500 12px/1.5 var(--type-family); letter-spacing: .015em; text-transform: none; }
:root .contact-page .contact-details p, :root .contact-page .contact-details a { font: 400 16px/1.65 var(--type-family); }
:root .enquiry-field input, :root .enquiry-field textarea { font: 400 16px/1.65 var(--type-family); }
:root .enquiry-field input::placeholder, :root .enquiry-field textarea::placeholder { color: #a4af9a; }
:root .enquiry-action button { font: 500 14px/1.5 var(--type-family); letter-spacing: .015em; text-transform: none; }
:root .enquiry-note, :root .enquiry-status { font: 400 13px/1.65 var(--type-family); color: #b0bba6; }
:root .portfolio-heading h1, :root .project-back-link { font: 500 clamp(30px,3vw,42px)/1.2 var(--type-family); letter-spacing: -.03em; }
:root .portfolio-status { font: 400 14px/1.5 var(--type-family); letter-spacing: 0; color: #b8c4ac; }
:root .portfolio-filter-toggle, :root .portfolio-selected button, :root .portfolio-clear { min-height: 40px; padding: 7px 15px; font: 500 13px/1.5 var(--type-family); letter-spacing: 0; }
:root .portfolio-filter-panel legend { font: 500 12px/1.5 var(--type-family); letter-spacing: .04em; color: #c2cdb8; }
:root .portfolio-filter-option { min-height: 44px; font: 400 15px/1.5 var(--type-family); }
:root .portfolio-filter-option input { width: 18px; height: 18px; }
:root .portfolio-filter-option span:last-child { color: #b2bfa7; font-size: 13px; }
:root .portfolio-caption h2, :root .portfolio-caption h3 { font: 500 17px/1.4 var(--type-family); letter-spacing: -.01em; }
:root .portfolio-year { font: 400 14px/1.5 var(--type-family); }
:root .portfolio-tag { padding: 3px 9px; font: 400 12px/1.4 var(--type-family); color: #d0dac7; }
:root .project-meta-strip h1 { font: 500 clamp(19px,1.7vw,24px)/1.35 var(--type-family); letter-spacing: -.015em; }
:root .project-meta-strip p { font: 400 15px/1.6 var(--type-family); }
:root .project-photo-count { font: 500 12px/1.5 var(--type-family); letter-spacing: .045em; }
:root .project-overview h2, :root .project-related-heading h2 { font: 500 clamp(28px,3vw,40px)/1.2 var(--type-family); letter-spacing: -.025em; }
:root .project-description { font: 400 16px/1.8 var(--type-family); }
:root .project-facts dt { font: 500 12px/1.6 var(--type-family); letter-spacing: .01em; text-transform: none; color: #bdc9b2; }
:root .project-facts dd { font: 400 15px/1.6 var(--type-family); }
:root .project-related-heading > a, :root .project-related-return > a { font: 500 14px/1.5 var(--type-family); color: #bdc9b2; }
@media (max-width: 700px) {
  :root .intro h1 { font-size: 36px; }
  :root .intro-copy p, :root .about-story-copy p { font-size: 16px; }
  :root .page-hero h1, :root .services-title h1 { font-size: 50px; }
  :root .about-story h1 { font-size: clamp(40px,9vw,56px); }
  :root .menu-link { font-size: clamp(34px,9vw,46px); }
  :root .menu-sub-link { font-size: 18px; }
  :root .portfolio-heading h1, :root .project-back-link { font-size: 30px; }
  :root .portfolio-caption h2, :root .portfolio-caption h3 { font-size: 16px; }
  :root .project-meta-strip p { font-size: 14px; }
  :root .about-award h3 { font-size: 16px; }
  :root .about-award-project { font-size: 15px; }
}