/* Reveal */
.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.js .reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  :root { --wrap: min(100% - 40px, 760px); }
  .nav__links { display: none; }
  .nav-toggle { display: grid; }
  .nav__links.is-open {
    position: fixed;
    top: 82px;
    right: 0;
    left: 0;
    display: flex;
    height: calc(100vh - 82px);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 30px 20px;
    background: var(--ink);
  }
  .nav__links.is-open > a {
    padding: 20px 4px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    font-family: var(--display);
    font-size: 28px;
    text-transform: uppercase;
  }
  .nav__links.is-open .nav__phone { margin-top: 10px; }
  .nav__links.is-open .nav__cta {
    justify-content: center;
    margin-top: 20px;
    border: 0;
    font-family: var(--body);
    font-size: 16px;
    text-transform: none;
  }
  .hero { min-height: auto; }
  .hero__grid { grid-template-columns: 1fr; gap: 54px; }
  .hero h1 { max-width: 850px; }
  .hero__visual { min-height: 440px; }
  .plan-card { inset: 15px 5% 45px 12%; }
  .services__head, .references__head { display: block; }
  .services__head h2, .references__head h2 { margin-bottom: 24px; }
  .about__grid { grid-template-columns: 1fr; gap: 40px; }
  .about__intro { position: static; }
  .about__copy { padding-top: 0; }
  .faq__grid { grid-template-columns: 1fr; gap: 42px; }
  .faq__intro { position: static; }
  .contact__grid { grid-template-columns: 1fr; align-items: start; }
  .contact-card { min-width: 0; width: min(100%, 470px); }
  .contact-form { width: 100%; }
}

@media (max-width: 680px) {
  :root { --wrap: calc(100% - 32px); }
  .section { padding: 76px 0; }
  .nav { min-height: 74px; }
  .brand__mark { width: 38px; height: 38px; }
  .brand__text { font-size: 21px; }
  .nav__links.is-open { top: 74px; height: calc(100vh - 74px); }
  .hero { padding: 132px 0 76px; }
  .hero::before { inset: 74px 0 0; background-size: 40px 40px; }
  .hero h1 { font-size: clamp(4rem, 23vw, 6.4rem); }
  .hero__visual { min-height: 350px; }
  .plan-card { inset: 25px 0 36px 12%; }
  .site-stamp { right: -4px; width: 94px; height: 94px; font-size: 12px; }
  .hero-stat { min-width: 180px; padding: 20px 22px; }
  .hero-stat strong { font-size: 52px; }
  .promise__inner { grid-template-columns: 1fr; gap: 10px; padding: 26px 0; }
  .promise__place { padding: 0; border: 0; }
  .services__head { margin-bottom: 38px; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 290px; padding: 28px; }
  .service-card__number { margin-bottom: 55px; }
  .traits { grid-template-columns: 1fr; }
  .trait { min-height: auto; }
  .faq-item summary { padding: 25px 50px 25px 0; }
  .faq-item p { padding-right: 0; }
  .project-grid { grid-template-columns: 1fr; grid-template-rows: 380px repeat(2, 220px); }
  .project-card:first-child { grid-row: auto; }
  .project-card { padding: 22px; }
  .project-card__label { align-items: flex-start; flex-direction: column; gap: 2px; }
  .project-lightbox { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .project-lightbox__inner { max-height: calc(100dvh - 24px); }
  .project-lightbox__image { max-height: calc(100dvh - 76px); }
  .refs-note { align-items: flex-start; flex-direction: column; }
  .contact-card { padding: 28px 24px; }
  .contact-form { padding: 28px 22px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-field--full { grid-column: auto; }
  .contact-form__footer { align-items: stretch; flex-direction: column; }
  .form-submit { width: 100%; }
  .form-note { text-align: left; }
  .footer__top, .footer__bottom { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}