
@media (max-width: 1279px) {
  .passport__grid, .dossier__grid { grid-template-columns: 1fr; }
  .passport__vis { width: 100%; max-width: none; min-height: clamp(480px, 70vw, 700px); }
  .request__grid { grid-template-columns: 1fr; gap: 56px; }
}

@media (max-width: 1023px) {
  .hdr__controls { display: contents; }
  .hdr__nav { position: fixed; inset: 0; z-index: 118; flex-direction: column; justify-content: center;
    align-items: flex-start; gap: 8px; padding: 96px var(--pad) 40px;
    background: rgba(7, 9, 9, .97); visibility: hidden; opacity: 0;
    transition: opacity var(--dur), visibility var(--dur); }
  .hdr__nav.is-open { visibility: visible; opacity: 1; }
  .hdr__nav a { font-family: var(--font-display); font-size: clamp(30px, 7vw, 44px);
    color: var(--paper); padding: 8px 0; }
  .hdr__nav .hdr__order { color: var(--cyan); }
  .hdr__cta { display: none; }
  .hdr__burger { display: grid; gap: 6px; padding: 12px 6px; margin-left: auto; z-index: 121; }
  .hdr__burger span { display: block; width: 24px; height: 1.5px; background: var(--paper);
    transition: rotate var(--dur), translate var(--dur); }
  .hdr__burger[aria-expanded="true"] span:nth-child(1) { rotate: 45deg; translate: 0 3.75px; }
  .hdr__burger[aria-expanded="true"] span:nth-child(2) { rotate: -45deg; translate: 0 -3.75px; }

  
  .hero__photo img { right: -30%; top: 0; width: 130%; height: 62%;
    -webkit-mask-image: radial-gradient(140% 100% at 60% 30%, #000 40%, transparent 82%);
    mask-image: radial-gradient(140% 100% at 60% 30%, #000 40%, transparent 82%); }
  .hero__photo::after { background: linear-gradient(0deg, var(--black-0) 34%, transparent 60%),
    linear-gradient(180deg, var(--black-0) 4%, transparent 26%); }
  .hero__anno--1, .hero__anno--2 { display: none; }
  .hero__filament, .fil-hub { display: none; }
  .hdr__nav .hdr__nav-cta { display: block; color: var(--cyan); }
  .hero__spec { position: static; margin: 26px var(--pad) 40px; order: 4; }
  .hero__content { padding-top: 0; }
  h1 { font-size: clamp(46px, 11vw, 76px); }

  .atlas__head { grid-template-columns: 1fr; align-items: start; }
  .specimen, .specimen--flip { grid-template-columns: 1fr; gap: 30px; }
  .specimen--flip .specimen__figure { order: 0; }
  .specimen--flip .specimen__data { order: 0; justify-self: start; }
  .specimen__index { position: static; margin-bottom: 6px; }
  .specimen__figure img { max-height: 52vh; }

  
  .tf__track { gap: clamp(44px, 7vh, 72px); }
  .tf__step, .tf__step:nth-child(even) { grid-template-columns: 1fr; gap: 20px; align-items: start; direction: ltr; }
  .tf__frame { height: clamp(240px, 40vh, 360px); }

  .supply__strip { grid-template-columns: 1fr 1fr; }
  .supply__head h2 { font-size: clamp(46px, 7.2vw, 68px); }
  .supply__strip figure:nth-child(3) { display: none; }
  .supply__strip img { height: clamp(220px, 34vh, 380px); }

  .person__grid { grid-template-columns: 1fr; }
  .person__photo { min-height: 54vh; }
  .person__photo::after { background: linear-gradient(0deg, var(--white-0) 2%, transparent 30%); }

  .stm__head { grid-template-columns: 1fr; }
  .footer { grid-template-columns: 1fr; }
  .footer__retail { text-align: left; }
}

@media (max-width: 767px) {
  :root { --pad: 20px; }
  body { font-size: 16.5px; }
  h2 { font-size: clamp(32px, 9vw, 44px); }
  .btn { width: 100%; }
  .hero__cta { gap: 12px; }
  .hero__anno--1 { top: 9%; max-width: 180px; }
  .specimen__act .btn { width: 100%; }
  .specimen__act { gap: 18px; }
  .passport__rows { grid-template-columns: 1fr; }
  .passport__tabs { gap: 5px; }
  .passport__tabs button { padding: 9px 12px; font-size: 11px; }
  .supply__strip { grid-template-columns: 1fr; }
  .supply__head h2 { font-size: clamp(36px, 9vw, 52px); line-height: 1.08; }
  .supply__title-line { white-space: normal; }
  .supply__strip figure:nth-child(2) { display: none; }
  .doc-stack { min-height: 480px; }
  .doc-stack button { width: 78%; }
  .doc-stack button:nth-child(2) { left: 18%; }
  .doc-stack button:nth-child(3) { left: 8%; top: 40%; }
  .stm__chain i { width: 14px; margin: 0 6px; }
  .stm__label { position: static; display: block; margin: 14px var(--pad) 0; }
  .person__body { padding-inline: var(--pad); }
  .request { padding-top: 90px; }
  .request__ring { right: -30%; top: 1%; width: 90vw; opacity: .6; }
  .cookie { left: 12px; right: 12px; max-width: none; }
  .hero__spec { border-left-color: rgba(185, 164, 106, .4); }
}

@media (min-width: 1500px) {
  .specimen { column-gap: 110px; }
  .tf__axis li { max-width: 52ch; }
}
