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

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

:root {
  --pad-x: clamp(16px,6vw,120px);
  --gap-m: clamp(16px,3vw,40px);
	
  --fs-hero: clamp(36px,6vw,68px);
  --fs-lead: clamp(18px,2.2vw,32px);
  --fs-ttl: clamp(30px,3vw,42px);
  --fs-body: clamp(14px,1.6vw,16px);
	
  --bg: #f2fbf2;
  --panel: #ffffff;
  --panel-2: #ffffff;

  --text: #070b12;
  --muted: #3e4c62;
  --line: rgba(7, 11, 18, 0.16);

  --brand: #2f9f63;
  --brand-strong: #7fbf7f; 
  --brand-strong-2: #6fb96f;
  --brand-dark: #1f6d41;


  --shadow: 0 22px 55px rgba(7, 11, 18, 0.22);
  --shadow-soft: 0 16px 32px rgba(7, 11, 18, 0.18);


  --radius: 12px;
  --radius-lg: 14px;

  --container: 1180px;
  --pad: clamp(16px, 2.2vw, 28px);

  --step--1: clamp(0.86rem, 0.82rem + 0.2vw, 0.95rem);
  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.1rem);
  --step-1: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  --step-2: clamp(1.6rem, 1.25rem + 1.2vw, 2.2rem);
  --step-3: clamp(2rem, 1.5rem + 2vw, 3rem);
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  line-height: 1.85;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  overflow-x: hidden;
}

img {
  display: block;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

p {
  margin: 0;
  font-size: var(--step-0);
}

h1,
h2,
h3 {
  margin: 0;
  line-height: 1.25;
}

b {
  font-weight: 800;
}

:focus-visible {
  outline: 3px solid rgba(47, 159, 99, 0.55);
  outline-offset: 3px;
  border-radius: 10px;
}


.skip-link {
  position: absolute;
  left: -9999px;
  top: 10px;
  z-index: 9999;
  background: #ffffff;
  color: #000000;
  padding: 10px 12px;
  border-radius: 10px;
  box-shadow: var(--shadow-soft);
}

.skip-link:focus {
  left: 10px;
}

.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 650ms ease, transform 750ms ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.html,body{
  overflow-x: hidden;
}