/* ═══════════════════════════════════════════════════════════════════
   YogiSolution — Responsive layer (mobile-first; min-width breakpoints)
   ≥ 600px  large phones / small tablets
   ≥ 768px  tablets
   ≥ 960px  small laptops (desktop navigation)
   ≥ 1200px desktops
   ═══════════════════════════════════════════════════════════════════ */

/* ── Small phones ── */
@media (max-width: 380px) {
  :root { --gutter: 16px; }
  .btn--lg { padding-inline: 20px; }
  .hero__title { font-size: 2.3rem; }
  .btn-row .btn { width: 100%; }
}

/* ── Phones: compact hero visual ── */
@media (max-width: 599.98px) {
  .hero__visual { min-height: 450px; margin-inline: -4px; }
  .mock--browser { right: 0; height: 230px; transform: none; }
  .mock--code { width: 84%; top: 136px; }
  .mock--code pre { font-size: .66rem; }
  .mock--vitals { width: 70%; top: 272px; left: 0; padding: 12px; }
  .ring { width: 44px; height: 44px; }
  .chip-float--b { display: none; }
  .chip-float--a { right: 4px; top: -16px; }
  .mock__cards i { height: 44px; }
  .section-head--split .link-arrow { margin-top: 4px; }
}

@media (min-width: 600px) {
  :root { --gutter: 28px; }
  .grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stack-group:last-child { grid-column: 1 / -1; }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .field--full { grid-column: 1 / -1; }
  .contact-form-wrap { padding: 36px; }
  .process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cta-card { padding: 56px 40px; }
  .svc-hero { grid-template-columns: auto 1fr; gap: 28px; }
  .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  :root { --section: 72px; }
  .hero { padding: 44px 0 60px; }
  .hero__visual { min-height: 540px; max-width: 640px; width: 100%; margin-inline: auto; }
  .mock--code { top: 168px; }
  .mock--vitals { top: 336px; width: 54%; }
  .page-hero { padding: 32px 0 40px; }

  .timeline { gap: 28px; }
  .timeline::before { left: 50%; transform: translateX(-1px); }
  .timeline__item { grid-template-columns: 1fr 64px 1fr; gap: 28px; }
  .timeline__num { grid-column: 2; width: 64px; height: 64px; font-size: 1rem; }
  .timeline__item:nth-child(odd) .timeline__card { grid-column: 1; grid-row: 1; text-align: right; }
  .timeline__item:nth-child(odd) .timeline__card { flex-direction: row-reverse; }
  .timeline__item:nth-child(even) .timeline__card { grid-column: 3; grid-row: 1; }
  .timeline__item .timeline__num { grid-row: 1; }
}

/* ── Desktop navigation ── */
@media (min-width: 960px) {
  :root { --header-h: 76px; }
  .nav-toggle { display: none; }
  .site-nav, .site-nav.is-open {
    position: static; display: flex; align-items: center; gap: 28px;
    padding: 0; background: none; border: 0; animation: none;
  }
  .site-nav ul { display: flex; gap: 4px; }
  .site-nav a:not(.btn) {
    position: relative; padding: 8px 14px; border: 0; border-radius: 999px;
    font-size: .95rem; font-weight: 500;
  }
  .site-nav a:not(.btn):hover { background: rgba(255,255,255,.04); }
  .site-nav a[aria-current="page"] { color: var(--text); background: rgba(118,101,255,.14); }
  .site-nav__cta { margin: 0; width: auto; }

  .hero { padding: 52px 0 72px; }
  .hero__inner { grid-template-columns: 1.05fr .95fr; gap: 40px; }
  .hero__visual { min-height: 540px; max-width: none; }
  .mock--browser { height: 320px; }
  .mock--code { top: 168px; }
  .mock--vitals { top: 336px; width: 54%; }

  .intro__inner { grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: start; }
  .grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .service-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stack-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .stack-group { grid-column: span 2; }
  .stack-group:nth-child(4) { grid-column: span 3; }
  .stack-group:last-child { grid-column: span 3; }

  .founder { grid-template-columns: .85fr 1.15fr; gap: 56px; }
  .founder__media { max-width: none; }

  .svc-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 44px; }
  .svc-aside { position: sticky; top: calc(var(--header-h) + 24px); }
  .process { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

  .contact-layout { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; }

  .site-footer__grid { grid-template-columns: 1.6fr 1fr 1.3fr 1.2fr; gap: 40px; }
}

@media (min-width: 1200px) {
  :root { --gutter: 32px; }
  .hero__title { font-size: 4.25rem; }
  .card { padding: 28px; }
  .wa-float { right: 28px; bottom: 28px; }
}

/* ── Hover-capable devices only: avoid sticky hover on touch ── */
@media (hover: none) {
  .card--feature:hover, .card--link:hover, .project-card:hover, .service-item a:hover { transform: none; }
}

/* ── Print ── */
@media print {
  .site-header, .site-footer, .wa-float, .cta-section, .hero__visual { display: none !important; }
  body { background: #fff; color: #000; }
  .prose, .muted, .card p { color: #222; }
}

/* ═══════════ v2 responsive ═══════════ */
@media (max-width: 699.98px) {
  .journey { --jr-art: min(64vw, 30vh); --jr-w: 74vw; --jr-gap: 4vw; --jr-node: 14px; }
  .ys-motion .jr-step p { font-size: .9rem; -webkit-line-clamp: 3; }
  .ys-motion .jr-progress { right: 50%; transform: translateX(50%); }
  .ys-motion .journey__lead { display: none; }
  .ys-motion .jr-device__screen { aspect-ratio: 4 / 3.4; }
  .ys-motion .jr-code { font-size: .62rem; padding: 5% 5%; }
  .jr-site__nav span { width: 44%; }
  .hero-founder { right: 2%; top: -18px; }
  .store-empty { flex-direction: column; text-align: center; }
}
@media (min-width: 600px) {
  .check-list--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .type-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .type-tile a { flex-direction: column; }
  .type-tile__art { width: auto; aspect-ratio: 16 / 10; }
  .type-tile:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .type-tile:last-child:nth-child(odd) .type-tile__art { aspect-ratio: 16 / 6; }
}
@media (min-width: 960px) {
  .type-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .type-tile { grid-column: span 2; }
  .type-tile:nth-child(-n+2) { grid-column: span 3; }
  .type-tile:nth-child(-n+2) .type-tile__art { aspect-ratio: 16 / 8; }
  .type-tile:last-child:nth-child(odd) { grid-column: span 2; }
  .type-tile:last-child:nth-child(odd) .type-tile__art { aspect-ratio: 16 / 10; }
  .item-hero { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 48px; }
  .ys-motion .journey__head .journey__title { font-size: clamp(2rem, 3.2vw, 2.7rem); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-founder { animation: none; }
}
/* Static Journey (reduced motion / no JS) on phones: compact rows */
@media (max-width: 599.98px) {
  html:not(.ys-motion) .jr-step { display: flex; align-items: stretch; }
  html:not(.ys-motion) .jr-step__art { flex: none; width: 112px; aspect-ratio: auto; }
  html:not(.ys-motion) .jr-step__copy { padding: 12px 14px; }
}