/* ==========================================================
   Responsive — 1440 / 1200 / 1024 / 768 / 480 / 375
   ========================================================== */
.pc-only { display: inline; }

@media (min-width: 1440px) {
  :root { --container: 1280px; }
}

/* ---------- ≤1200 : nav gets tighter ---------- */
@media (max-width: 1200px) {
  .nav { gap: 10px; }
  .nav__link { padding: 8px 8px; font-size: 14px; }
  .nav__link::after { left: 8px; right: 8px; }
  .hero__inner { gap: 40px; }
}

/* ---------- ≤1024 : hamburger menu ---------- */
@media (max-width: 1024px) {
  :root { --header-h: 72px; }
  .header__inner { height: 72px; }
  .brand__mark { width: 56px; }
  .topbar { display: none; }
  .site-header { backdrop-filter: none; background: #fff; } /* backdrop-filter would trap the fixed nav */
  .hamburger { display: block; z-index: 102; }
  .header__inner { gap: 12px; }
  .nav { position: fixed; inset: 72px 0 0 0; background: #fff; flex-direction: column; align-items: stretch; gap: 0; padding: 12px 24px 32px; overflow-y: auto; transform: translateX(100%); visibility: hidden; transition: transform .35s var(--ease), visibility .35s; }
  .nav.is-open { transform: none; visibility: visible; }
  .nav__list { flex-direction: column; gap: 0; }
  .nav__link { padding: 16px 4px; font-size: 16px; border-bottom: 1px solid var(--border-color); }
  .nav__link::after { display: none; }
  .nav__cta { margin-top: 24px; padding: 16px; font-size: 16px; }
  body.nav-open { overflow: hidden; }
  .brand__text small { display: block; }

  .section { padding: 90px 0; }
  .hero { padding: 50px 0 80px; }
  .hero__inner { grid-template-columns: 1fr; gap: 50px; }
  .hero__content { text-align: center; }
  .hero__lead { margin: 0 auto; }
  .hero__actions, .hero__points { justify-content: center; }
  .hero__visual { max-width: 720px; margin: 0 auto; width: 100%; }
  .hero__card { left: 16px; }

  .about__inner { gap: 50px; }
  .services__grid, .works__grid, .testimonials__grid { grid-template-columns: repeat(2, 1fr); }
  .why__grid { grid-template-columns: repeat(2, 1fr); }
  .faq__inner { grid-template-columns: 1fr; gap: 40px; }
  .section-head--left { text-align: center; }
  .contact__inner { grid-template-columns: 1fr; gap: 50px; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .worries__list { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}

/* ---------- ≤768 : tablet ---------- */
@media (max-width: 768px) {
  .pc-only { display: none; }
  body { font-size: 15px; padding-bottom: 64px; }
  .section { padding: 72px 0; }
  .section-head { margin-bottom: 40px; }

  .stats__grid { grid-template-columns: repeat(2, 1fr); row-gap: 24px; padding: 28px 8px; }
  .stat:nth-child(2) { border-right: 0; }
  .stat__num { font-size: 32px; }

  .about__inner { grid-template-columns: 1fr; }
  .about__exp { right: 12px; bottom: -20px; }
  .ba-grid, .pkg-grid { grid-template-columns: 1fr; gap: 26px; }
  .contact-band { padding: 20px 0 72px; }
  .contact-band--tight { padding: 64px 0; }
  .contact-band--green { padding: 56px 0; }
  .contact-band__cols { flex-direction: column; gap: 18px; }
  .contact-band__sep { display: none; }

  .process__list { grid-template-columns: 1fr; gap: 0; max-width: 460px; margin: 0 auto; }
  .process__list::before { top: 20px; bottom: 20px; left: 42px; right: auto; width: 2px; height: auto; background: repeating-linear-gradient(180deg, var(--primary-color) 0 8px, transparent 8px 16px); }
  .step { display: grid; grid-template-columns: 84px 1fr; column-gap: 20px; text-align: left; padding: 0 0 28px; }
  .step__icon { grid-row: 1 / span 3; margin: 0; }
  .step__num { align-self: end; }

  .cta { padding: 60px 0; }
  .cta__inner { flex-direction: column; text-align: center; }
  .cta__actions { justify-content: center; }

  .contact-form { padding: 28px 22px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .map__frame { height: 300px; }

  .to-top { bottom: 80px; right: 16px; width: 44px; height: 44px; }
  .mobile-bar { display: grid; grid-template-columns: repeat(3, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; height: 64px; box-shadow: 0 -4px 16px rgba(0,0,0,.1); }
  .mobile-bar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 12px; font-weight: 700; color: #fff; }
  .mobile-bar svg { font-size: 22px; }
  .mobile-bar__tel { background: var(--dark-color); }
  .mobile-bar__line { background: #06c755; }
  .mobile-bar__mail { background: var(--primary-color); }
}

/* ---------- ≤480 : mobile ---------- */
@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .header__inner { height: 68px; }
  :root { --header-h: 68px; }
  .nav { inset: 68px 0 0 0; }
  .brand__mark { width: 48px; }
  .brand__text strong { font-size: 21px; }

  .hero { padding: 36px 0 70px; }
  .hero__lead { font-size: 15px; }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }
  .hero__card { position: relative; left: auto; bottom: auto; margin: -22px 12px 0; }
  .ba__handle { width: 44px; height: 44px; }
  .ba__label { top: 10px; font-size: 11px; padding: 4px 9px; }
  .ba__label--before { left: 10px; }
  .ba__label--after { right: 10px; }

  .services__grid, .works__grid, .testimonials__grid, .why__grid { grid-template-columns: 1fr; }
  .worries__list { grid-template-columns: 1fr; gap: 20px; }
  .service-card { padding: 28px 24px; }
  .check-list { grid-template-columns: 1fr; }
  .ba-card__body { padding: 20px; }
  .pkg__body { padding: 22px 20px 24px; }
  .contact-band__box { padding: 28px 16px; }
  .contact-band__tel-icon { width: 48px; height: 48px; font-size: 24px; border-radius: 12px; }
  .contact-band__tel { gap: 10px; }
  .contact-band__line img { width: 68px; height: 68px; }
  .contact-band__hours { font-size: 14px; padding: 4px 12px; }
  .lang-switch__btn { padding: 5px 9px; font-size: 12px; }
  .why-card { padding: 32px 26px; }
  .faq-item__q { padding: 18px 16px; font-size: 14.5px; }
  .faq-item__a p { padding: 0 16px 18px 42px; }
  .cta__tel strong { font-size: 26px; }
  .cta__actions .btn { width: 100%; }
  .footer__grid { grid-template-columns: 1fr; gap: 34px; }
  .footer__bottom-inner { flex-direction: column; text-align: center; align-items: center; }
}

/* ---------- ≤375 ---------- */
@media (max-width: 375px) {
  .hero__title { font-size: 32px; }
  .stat__num { font-size: 28px; }
  .stat__label { font-size: 12px; }
  .btn--lg { padding: 15px 22px; font-size: 15px; }
  .brand__text small { display: none; }
}
