/* BustAI — shared responsive foundation
   Phone ≤640 | Tablet 641–1024 | PC 1025–1919 | TV ≥1920
*/

:root {
  --bp-phone: 640px;
  --bp-tablet: 1024px;
  --bp-pc: 1919px;
  --page-pad-x: clamp(1rem, 3vw, 2.5rem);
  --page-pad-y: clamp(1.25rem, 4vh, 3rem);
  --content-max: min(1248px, calc(100% - 2 * var(--page-pad-x)));
  --tap-min: 44px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --fluid-h1: clamp(2rem, 5vw + 1rem, 5.5rem);
  --fluid-h2: clamp(1.5rem, 3.5vw + 0.5rem, 3.5rem);
  --fluid-body: clamp(0.9375rem, 0.4vw + 0.85rem, 1.125rem);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
  min-width: 0;
}

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

/* Touch targets */
@media (hover: none) and (pointer: coarse) {
  button,
  [role="button"],
  a.btn,
  .btn-primary,
  .btn-secondary,
  .nav-mobile,
  .icon-btn {
    min-height: var(--tap-min);
  }
}

/* Phone */
@media (max-width: 640px) {
  :root {
    --page-pad-x: 1rem;
    --content-max: min(100%, calc(100% - 2rem));
  }
}

/* Tablet */
@media (min-width: 641px) and (max-width: 1024px) {
  :root {
    --page-pad-x: clamp(1.25rem, 3.5vw, 2rem);
  }
}

/* PC */
@media (min-width: 1025px) and (max-width: 1919px) {
  :root {
    --page-pad-x: clamp(1.5rem, 4vw, 3.5rem);
  }
}

/* TV / ultra-wide */
@media (min-width: 1920px) {
  :root {
    --page-pad-x: clamp(2rem, 5vw, 6rem);
    --content-max: min(1600px, calc(100% - 2 * var(--page-pad-x)));
    --fluid-h1: clamp(3.5rem, 4vw, 7rem);
    --fluid-h2: clamp(2.25rem, 2.5vw, 4.5rem);
    --fluid-body: clamp(1.05rem, 0.35vw + 0.9rem, 1.35rem);
  }

  html {
    font-size: 112.5%;
  }
}

@media (min-width: 2560px) {
  :root {
    --content-max: min(1800px, calc(100% - 2 * var(--page-pad-x)));
  }

  html {
    font-size: 125%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}