/* ============================================================
   HANGRYS — グローバルスタイル
   ============================================================ */

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

html, body {
  background: var(--bg-base);
  color: var(--fg-1);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  min-height: 100%;
}

img, video { display: block; max-width: 100%; }

ul, ol { list-style: none; }

a { color: var(--hangrys-red); text-decoration: none; }
a:hover { color: var(--hangrys-red-hover); }

button { cursor: pointer; border: none; background: none; color: inherit; font: inherit; }

::selection { background: var(--hangrys-red); color: #fff; }

/* ---- タイポグラフィクラス ---- */
.h-display { font-family: var(--font-display); font-weight: var(--w-black); font-size: 5.25em; line-height: 1.02; letter-spacing: var(--track-tight); color: var(--fg-1); }
.h1 { font-family: var(--font-display); font-weight: 800; font-size: 3em; line-height: 1.08; letter-spacing: var(--track-tight); }
.h2 { font-family: var(--font-display); font-weight: 800; font-size: 2.25em; line-height: 1.15; letter-spacing: var(--track-tight); }
.h3 { font-family: var(--font-display); font-weight: 700; font-size: 1.75em; line-height: 1.25; }
.h4 { font-family: var(--font-sans); font-weight: 700; font-size: 1.375em; line-height: 1.3; }
.eyebrow { font-family: var(--font-sans); font-weight: 700; font-size: 0.75em; letter-spacing: var(--track-jp-tag); text-transform: uppercase; color: var(--hangrys-red); }
.tagline { font-family: var(--font-hand); font-weight: 400; font-size: 1.375em; color: var(--fg-1); }
.p, p { font-family: var(--font-sans); font-weight: 400; font-size: 1em; line-height: 1.65; color: var(--fg-1); }
.p-sm { font-size: 0.85em; line-height: 1.55; color: var(--fg-2); }
.meta { font-size: 0.75em; color: var(--fg-3); letter-spacing: var(--track-jp-tag); }
.mono, code, kbd { font-family: var(--font-mono); font-size: 0.85em; }

/* ---- コンテナ ---- */
.container {
  width: 100%;
  padding-inline: 10vw;
}
@media (max-width: 900px) {
  .container { padding-inline: 5vw; }
}

/* ---- スクリーンリーダー専用 ---- */
.screen-reader-text {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}
