/* Import Zen Maru Gothic from Google Fonts with full Japanese support */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700;900&display=swap');

/* Import Inter for additional support */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@700&display=swap');

/* Base Reset & Defaults */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { font-size: 16px; line-height: 1.6; color: #333; background-color: #ffffff; }
body { min-height: 100vh; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { opacity: 0.8; }

/* CSS Variables */
:root {
  --s-font-668eef4d: Lato;
  --s-font-748e7e97: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
  --s-font-93950333: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
  --s-font-578eec21: Montserrat;
  --s-font-5994cfb7: Inter;
  --s-font-79827415: Outfit;

  /* Color & semantic tokens (moved from common.css to centralize) */
  --primary-color: #ED6C00;
  --secondary-color: #ff4500;
  --text-color: #3A3A3A;
  --gray-bg: #f8f8f8;
  --font-family: var(--s-font-748e7e97);

  /* Font Size Tokens */
  /* 小さい文字の可読性向上を目的に最小値を確保 */
  --fs-xs: clamp(14px, 0.9rem, 15px);   /* 旧: 11-14px 想定 */
  --fs-sm: 16px;                        /* 旧: 16px */
  --fs-md: clamp(18px, 1.125rem, 19px); /* 旧: 18px */
  --fs-lg: clamp(20px, 1.25rem, 22px);  /* 旧: 20-22px */
  --fs-xl: clamp(24px, 1.5rem, 26px);   /* 旧: 24-26px */
  --fs-2xl: clamp(28px, 1.75rem, 30px); /* 旧: 28-30px */
  --fs-3xl: clamp(32px, 2rem, 34px);    /* 旧: 32-34px */
  --fs-4xl: clamp(40px, 2.5rem, 42px);  /* 旧: 40-42px */
}

/* Apply Zen Maru Gothic to body and general elements */
body {
  font-family: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif !important;
  font-weight: 400;
  line-height: 1.6;
  font-feature-settings: "palt";
}

/* Ensure all text elements use Zen Maru Gothic */
h1, h2, h3, h4, h5, h6, p, a, div, span, li, td, th, button, input, select, textarea, label {
  font-family: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif !important;
}

/* Override STUDIO specific classes */
.text, .sd, .appear, .link, .frame, .image {
  font-family: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif !important;
}

/* Override any elements using CSS variables */
[class*="text"], [class*="sd"] {
  font-family: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif !important;
}

/* Force override for elements with inline styles */
[style*="font-family"] {
  font-family: 'Zen Maru Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif !important;
}