/* CYBER SPACE — мобильная оптимизация (все страницы) */

/* ——— Базовые правила ——— */
html {
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

img,
svg {
  max-width: 100%;
  height: auto;
}

video:not(.hero-video) {
  max-width: 100%;
  height: auto;
}

button,
a,
input,
select,
textarea,
[tabindex="0"] {
  touch-action: manipulation;
}

/* iOS: не зумит при фокусе на полях */
input,
select,
textarea {
  font-size: max(16px, 1rem);
}

/* ——— Шапка (оверлей) ——— */
@media (max-width: 900px) {
  .nav-brand {
    flex: none;
    max-width: none;
  }

  .nav-brand-logo {
    height: clamp(44px, 11vw, 64px);
    max-width: min(240px, 54vw);
  }

  .nav-toggle {
    flex-shrink: 0;
  }
}

@media (max-width: 380px) {
  .nav-brand-logo {
    height: clamp(44px, 13vw, 60px);
    max-width: min(240px, 62vw);
  }
}

/* ——— Hero (главная) ——— */
@media (max-width: 640px) {
  .hero {
    min-height: 100svh;
    padding-top: calc(var(--nav-total) + 1.5rem);
    padding-bottom: max(2rem, var(--safe-bottom));
  }

  .hero--video {
    align-items: flex-end;
  }

  .hero h1 {
    font-size: clamp(1.85rem, 9vw, 2.65rem);
    line-height: 1.08;
  }

  .hero-lead {
    font-size: 0.95rem;
    max-width: none;
    margin-bottom: 1.5rem;
  }

  .hero-actions {
    flex-direction: column;
    width: 100%;
    gap: 0.75rem;
  }

  .hero-actions a,
  .hero-actions button {
    width: 100%;
  }

  .btn-primary,
  .btn-ghost {
    width: 100%;
    justify-content: center;
  }

  .hero-video-fade {
    height: clamp(180px, 42vh, 320px);
  }
}

@media (max-width: 640px) and (max-height: 700px) {
  .hero--video {
    min-height: auto;
    padding-bottom: max(1.5rem, var(--safe-bottom));
  }
}

/* ——— Секции и сетка ——— */
@media (max-width: 640px) {
  .section {
    padding-top: clamp(2rem, 6vw, 3rem);
    padding-bottom: clamp(2rem, 6vw, 3.5rem);
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .section-header {
    margin-bottom: 2rem;
  }

  .section-title {
    font-size: clamp(1.45rem, 6vw, 1.85rem);
  }

  .section-desc {
    font-size: 0.92rem;
  }

  .section-stats {
    margin-top: clamp(-3.5rem, -8vh, -4.5rem);
    padding-top: clamp(3rem, 10vw, 4.5rem);
  }

  .stat-strip {
    padding: 1.15rem 0.85rem;
    gap: 0.75rem;
  }

  .stat-num {
    font-size: clamp(1.35rem, 5.5vw, 1.75rem);
  }

  .stat-label {
    font-size: 0.72rem;
    line-height: 1.35;
  }

  .builds-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .build-card-body {
    padding: 1.15rem;
  }

  .build-specs {
    font-size: 0.85rem;
  }

  a.btn-card,
  .btn-card {
    display: flex;
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }

  .cta-band {
    padding: 1.75rem 1rem;
    text-align: center;
  }

  .cta-band .btn-primary {
    width: 100%;
  }
}

/* ——— Подвал ——— */
@media (max-width: 640px) {
  .site-footer {
    padding: 2rem max(0.85rem, var(--safe-left)) max(2rem, var(--safe-bottom)) max(0.85rem, var(--safe-right));
  }

  .footer-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1.25rem;
  }

  .footer-links {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
  }

  .footer-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--touch-min);
    padding: 0.5rem 0.75rem;
    font-size: 0.68rem;
    border-radius: var(--radius);
    border: 1px solid transparent;
  }

  .footer-links a:active {
    border-color: var(--border);
    background: rgba(37, 99, 235, 0.08);
  }
}

/* ——— Комплектующие ——— */
@media (max-width: 640px) {
  .components-hero {
    padding-top: calc(var(--nav-total) + 1.75rem);
    padding-bottom: 1.5rem;
  }

  .components-hero h1 {
    font-size: clamp(1.65rem, 7vw, 2.25rem);
  }

  .components-lead {
    font-size: 0.92rem;
  }

  .comp-section {
    margin-bottom: 2.25rem;
  }

  .comp-cat-title {
    font-size: 0.95rem;
    flex-wrap: wrap;
  }

  .components-actions {
    text-align: center;
  }

  .components-back {
    width: 100%;
  }
}

/* ——— Калькулятор ——— */
@media (max-width: 640px) {
  .calc-hero {
    padding-top: calc(var(--nav-total) + 1.5rem);
    padding-bottom: 1.25rem;
  }

  .calc-hero h1 {
    font-size: clamp(1.5rem, 7vw, 2rem);
  }

  .calc-lead {
    font-size: 0.9rem;
  }

  .calc-main {
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .calc-panel {
    padding: 1.1rem;
  }

  .calc-brand-tab,
  .calc-market-btn {
    font-size: 0.58rem;
    padding: 0.7rem 0.5rem;
  }

  .calc-field select {
    font-size: 16px;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .calc-pc-case {
    min-height: 300px;
    max-width: 100%;
  }

  .pc-slot-name {
    font-size: 0.52rem;
    -webkit-line-clamp: 3;
  }

  .calc-summary {
    padding: 1.25rem;
  }

  .calc-summary-list {
    max-height: none;
  }

  .calc-summary-total {
    font-size: clamp(1.45rem, 6vw, 1.85rem);
  }

  .calc-wa-btn,
  .calc-back {
    width: 100%;
  }
}

@media (max-width: 380px) {
  .calc-pc-stage {
    padding: 0.75rem;
  }

  .calc-pc-case {
    min-height: 260px;
    padding: 0.5rem;
  }

  .pc-slot--gpu {
    min-height: 48px;
  }
}

/* ——— Страница товара ——— */
@media (max-width: 640px) {
  .buy-wrap {
    padding-top: calc(var(--nav-total) + 1.5rem);
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .buy-header {
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .buy-brand .nav-brand-logo {
    height: clamp(52px, 13vw, 76px);
    max-width: min(290px, 60vw);
  }

  .product-title {
    font-size: clamp(1.65rem, 8vw, 2.25rem);
  }

  .product-info {
    padding: 1.25rem !important;
  }

  .product-image img {
    min-height: 220px;
    max-height: min(65vh, 480px);
  }

  .specs-list li {
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.65rem 0;
  }

  .spec-label {
    min-width: 0;
    font-size: 0.65rem;
  }

  .spec-value {
    font-size: 0.88rem;
    word-break: break-word;
  }

  .buy-footer {
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .footer-nav-btn {
    flex: 1 1 100%;
  }

  .back-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ——— О нас ——— */
@media (max-width: 640px) {
  .about-hero {
    min-height: auto;
    padding-top: calc(var(--nav-total) + 1.5rem);
    padding-bottom: 2rem;
  }

  .about-hero h1 {
    font-size: clamp(1.55rem, 7vw, 2.1rem);
  }

  .values-grid-about {
    grid-template-columns: 1fr;
  }

  .team-grid-about {
    grid-template-columns: 1fr;
  }

  .about-cta-actions {
    flex-direction: column;
    width: 100%;
  }

  .about-cta-actions a {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  .about-section-block .stat-strip {
    margin-bottom: 2rem;
  }
}

/* ——— Отзывы ——— */
@media (max-width: 640px) {
  .otz-main {
    padding-left: max(0.85rem, var(--safe-left));
    padding-right: max(0.85rem, var(--safe-right));
  }

  .otz-title {
    font-size: clamp(1.45rem, 7vw, 2rem);
  }

  .review-card {
    padding: 1rem;
  }

  .review-header {
    gap: 0.75rem;
  }

  .review-photos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .otz-back-wrap .otz-back {
    width: 100%;
    justify-content: center;
  }
}

/* ——— Альбомная ориентация ——— */
@media (max-height: 500px) and (orientation: landscape) {
  .hero--video .hero-copy {
    padding-bottom: 0.5rem;
  }

  .hero h1 {
    font-size: clamp(1.5rem, 5vh, 2rem);
    margin-bottom: 0.5rem;
  }

  .hero-lead {
    margin-bottom: 1rem;
    font-size: 0.88rem;
  }
}

/* ——— Очень узкие экраны (iPhone SE, старые Android) ——— */
@media (max-width: 360px) {
  .hero-badge {
    font-size: 0.52rem;
    letter-spacing: 0.12em;
    padding: 0.3rem 0.6rem;
  }

  .build-price {
    font-size: 0.95rem;
  }

  .discount-pill {
    display: block;
    margin: 0.35rem 0 0;
    width: fit-content;
  }
}