/* ==========================================================================
   RESMA V2 — responsive layer
   Breakpoints: 1180 · 1024 (drawer navigation) · 820 · 600 · 400
   On small screens the glass is made more opaque and less blurred so text
   contrast stays high and scrolling stays smooth.
   ========================================================================== */

@media (max-width: 1180px) {
  .brand__text { display: none; }
  .nav__link { padding-inline: 11px; }
  .bento__item, .bento__item--wide { grid-column: span 6; }
  .tiles--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .detail { grid-template-columns: minmax(0, 1fr) 330px; }
  .footer__grid { grid-template-columns: 1.3fr 1fr 1fr; }
  .footer__grid > :last-child { grid-column: 1 / -1; }
  .footer__contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 32px; }
}

@media (max-width: 1024px) {
  :root { --header-h: 76px; }
  .nav,
  .header-actions > .btn { display: none; }
  .nav-toggle { display: grid; }
  .brand__text { display: block; }

  .hero { min-height: 0; padding-bottom: 130px; align-items: flex-start; }
  .hero__inner { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .hero__card { justify-self: start; max-width: 520px; }
  .hero__scroll { display: none; }
  .page-hero h1 { max-width: 18ch; }

  .feature { grid-template-columns: minmax(0, 1fr); }
  .feature__media { min-height: 0; height: clamp(220px, 46vw, 380px); }
  .explorer__panel { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .explorer__panel .icon-lg { font-size: 4.5rem; }
  .detail { grid-template-columns: minmax(0, 1fr); }
  .facts { position: static; order: -1; }
  .contact-grid { grid-template-columns: minmax(0, 1fr); }
  .split > .c-4, .split > .c-5, .split > .c-6, .split > .c-7, .split > .c-8 { grid-column: span 12; }
  .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .expert-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .footer__grid > :first-child { grid-column: 1 / -1; }
  .duo { max-width: 620px; }
  .js [data-reveal="left"], .js [data-reveal="right"] { transform: translateY(36px); }
  .js [data-reveal="left"].is-in, .js [data-reveal="right"].is-in { transform: none; }
}

@media (max-width: 820px) {
  :root {
    --glass-blur: blur(12px) saturate(1.3);
    --glass-fill: linear-gradient(145deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.07));
  }
  .header-bar { background: linear-gradient(145deg, rgba(44, 46, 53, 0.78), rgba(30, 32, 38, 0.72)); }
  .expert-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .era { grid-template-columns: minmax(0, 1fr); }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gallery__item, .gallery__item--wide { grid-column: span 1; aspect-ratio: 4 / 3; }
  .gallery__item--wide { grid-column: span 2; aspect-ratio: 16 / 9; }
  .gallery__cap { transform: none; inset: auto 8px 8px 8px; padding: 9px 12px; font-size: 0.76rem; }
  .gallery__cap small { display: none; }
  .tiles--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tiles--3, .tiles--2 { grid-template-columns: minmax(0, 1fr); }
  .span-5, .span-7 { grid-column: span 12; }
  .prog-grid .prog-card--flagship { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "title" "sub" "meta" "more"; }
  .prog-card--flagship h3 { margin-bottom: 8px; }
  .prog-card--flagship .prog-card__sub { margin-bottom: 24px; }
  .prog-card--flagship .prog-card__more { margin-top: 22px; }
  .lightbox__stage { padding: 76px 12px 8px; }
  .lightbox__prev { left: 10px; top: auto; bottom: 84px; margin: 0; }
  .lightbox__next { right: 10px; top: auto; bottom: 84px; margin: 0; }
  /* timeline turns vertical */
  .timeline { grid-template-columns: minmax(0, 1fr); padding: 0 0 0 40px; gap: 32px; }
  .timeline::before { left: 8px; right: auto; top: 6px; bottom: 6px; width: 2px; height: auto; transform: scaleY(0); transform-origin: top; background: linear-gradient(var(--coral), var(--gray) 70%, transparent); }
  .timeline.is-in::before { transform: scaleY(1); }
  .timeline__item::before { left: -40px; top: 4px; }
  .duo { padding-bottom: 18%; }
  .duo__badge { display: none; }
}

@media (max-width: 600px) {
  .btn { width: 100%; justify-content: space-between; }
  .btn--sm { width: auto; }
  .hero__cta, .cta__actions { flex-direction: column; align-items: stretch; }
  .hero { padding-top: calc(var(--header-h) + 24px); }
  .hero__facts strong { font-size: 2rem; }
  .bento__item, .bento__item--wide { grid-column: span 12; min-height: 0; }
  .tiles, .tiles--5 { grid-template-columns: minmax(0, 1fr); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .form { grid-template-columns: minmax(0, 1fr); }
  .form .field { grid-column: 1 / -1; }
  .footer__grid { grid-template-columns: minmax(0, 1fr); }
  .footer__contact { grid-template-columns: minmax(0, 1fr); }
  .accordion__btn { gap: 12px; }
  .accordion__btn .num { display: none; }
  .accordion__body { padding-left: clamp(18px, 2vw, 28px); }
  .cta__trio li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .direction li { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .direction .icon { transform: rotate(90deg); }
  .explorer__tab { padding: 12px 16px; }
  .carousel__btns .round-btn { width: 48px; height: 48px; }
  .search { margin-top: 84px; }
  .crumbs { font-size: 0.68rem; }
  .fab { padding-left: 16px; font-size: 0.8rem; }
  .fab-stack .to-top { width: 46px; height: 46px; }
  .tabs__list { border-radius: 24px; }
  .fig-box { width: 100%; }
}

@media (max-width: 400px) {
  :root { --gutter: 18px; }
  .brand__text { display: none; }
  .expert-grid { gap: 10px; }
  .expert__name { font-size: 0.68rem; padding: 8px 10px; left: 6px; right: 6px; bottom: 6px; }
  .gallery { gap: 8px; }
}

@media (min-width: 1700px) {
  :root { --container: 1360px; }
}

@media print {
  .site-header, .fab-stack, .mobile-nav, .curtain, .scroll-progress { display: none !important; }
  .hero, .page-hero, .theme-dark { background: #fff !important; color: #000 !important; }
}
@media (max-width: 600px) {
  .fab { padding: 0; width: 52px; height: 52px; justify-content: center; }
  .fab > span:first-child { display: none; }
  .fab .btn__icon { width: 52px; height: 52px; }
}