/**
 * IMABI design tokens
 * @see blogs/ima-bi/design/imabi_design_spec.md §3
 */

:root {
	/* Background */
	--imabi-bg-base: #fafaf8;
	--imabi-bg-surface: #ffffff;
	--imabi-bg-subtle: #f3f0ed;
	--imabi-bg-muted: #ece8e4;

	/* Text */
	--imabi-text-primary: #333333;
	--imabi-text-secondary: #666666;
	--imabi-text-muted: #888888;

	/* Border and accent */
	--imabi-border: #e5e0db;
	--imabi-accent: #8b9e8b;

	/* Primary CTA */
	--imabi-cta-bg: #7a9478;
	--imabi-cta-bg-hover: #6b8569;
	--imabi-cta-text: #ffffff;

	/* Secondary CTA */
	--imabi-cta-secondary-bg: #ffffff;
	--imabi-cta-secondary-border: #7a9478;
	--imabi-cta-secondary-text: #5c735a;

	/* LINE green (icons/small UI only) */
	--imabi-line-green: #06c755;

	/* Notice box */
	--imabi-notice-bg: #fff8ee;
	--imabi-notice-border: #e8d4b8;
	--imabi-notice-text: #6b5b4f;

	/* PR / disclosure */
	--imabi-pr-bg: #f5f5f5;
	--imabi-pr-border: #dddddd;

	/* Point box */
	--imabi-point-bg: #f7f9f6;

	/* Layout spacing */
	--imabi-space-page-x: 16px;
	--imabi-space-page-x-min: 14px;
	--imabi-space-section: 48px;
	--imabi-space-article-section: 32px;
	--imabi-space-card: 16px;
	--imabi-radius: 8px;
	--imabi-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06);
	--imabi-content-max: 720px;

	/* Typography (mobile-first) */
	--imabi-font-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
	--imabi-fs-body: 16px;
	--imabi-fs-lead: 16px;
	--imabi-fs-h1: 22px;
	--imabi-fs-h2: 20px;
	--imabi-fs-h3: 18px;
	--imabi-fs-h4: 16px;
	--imabi-fs-caption: 13px;
	--imabi-fs-cta-title: 17px;
	--imabi-fs-cta-btn: 15px;
	--imabi-fs-disclosure: 12px;
	--imabi-lh-body: 1.8;
	--imabi-lh-heading: 1.6;
	--imabi-lh-cta-title: 1.5;
	--imabi-lh-cta-btn: 1.4;

	/* Buttons */
	--imabi-btn-min-height: 48px;
	--imabi-btn-padding-x: 20px;
	--imabi-btn-gap: 8px;

	/* Image aspect ratios */
	--imabi-ratio-hero: 16 / 9;
	--imabi-ratio-card: 16 / 9;
	--imabi-ratio-product: 1 / 1;
}

@media (min-width: 768px) {
	:root {
		--imabi-fs-h1: 26px;
		--imabi-fs-h2: 22px;
	}
}