/* スマホドクター 香住ヶ丘6丁目店 — Design tokens (per spec v1.0) */
:root {
  /* Colors */
  --color-primary: #D70D19;
  --color-primary-dark: #B00914;
  --color-primary-light: #FDEAEA;
  --color-text: #333333;
  --color-text-light: #666666;
  --color-gray-light: #F6F6F6;
  --color-gray-border: #EEEEEE;
  --color-bg: #FFFFFF;
  --color-bg-alt: #F8F9FA;
  --color-danger: #D64545;
  --color-line: #06C755;

  /* Typography */
  --font-body: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "YuGothic", "Yu Gothic", Meiryo, Arial, sans-serif;
  --font-heading: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "YuGothic", "Yu Gothic", Meiryo, Arial, sans-serif;
  --font-catch: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "YuGothic", "Yu Gothic", Meiryo, Arial, sans-serif;

  /* Font sizes: SP by default; PC via media query on consumers */
  --fs-body: 16px;
  --fs-h1: 28px;
  --fs-h2: 22px;
  --fs-h3: 18px;
  --fs-catch: 32px;
  --fs-small: 14px;
  --line-height: 1.8;
  --letter-spacing: 0.05em;

  /* Spacing */
  --section-gap: 60px;
  --container-max: 1080px;
  --container-pad: 20px;
  --card-gap: 16px;
  --card-pad: 20px;
  --btn-pad: 16px 32px;
  --radius: 8px;

  /* Shadows */
  --shadow-card: 0 2px 8px rgba(0,0,0,0.08);
  --shadow-card-hover: 0 6px 16px rgba(0,0,0,0.12);
}

/* PC overrides — applied by parent wrapper, not by viewport */
.viewport-pc {
  --fs-h1: 36px;
  --fs-h2: 28px;
  --fs-h3: 22px;
  --fs-catch: 48px;
  --section-gap: 100px;
  --container-pad: 40px;
  --card-gap: 24px;
  --card-pad: 32px;
  --btn-pad: 18px 40px;
  --radius: 12px;
}
