/* ===== Reset & Variables ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --color-bg:#FAFAF7;
  --color-text:#2C2C2C;
  --color-text-light:#5A5A5A;
  --color-text-muted:#8A8A8A;
  --color-primary:#2D6B4F;
  --color-primary-dark:#1E4D38;
  --color-primary-light:#E8F3ED;
  --color-accent:#C8956C;
  --color-accent-light:#FFF5ED;
  --color-white:#FFFFFF;
  --color-border:#E5E2DC;
  --color-card:#FFFFFF;
  --color-section-alt:#F3F1EC;
  --font-heading:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;
  --font-body:'Noto Sans JP',sans-serif;
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:20px;
  --radius-xl:28px;
  --shadow-soft:0 2px 20px rgba(0,0,0,0.04);
  --shadow-card:0 4px 30px rgba(0,0,0,0.06);
  --shadow-hover:0 8px 40px rgba(0,0,0,0.1);
  --max-w:1100px;
  --section-py:100px;
}
html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:var(--font-body);
  color:var(--color-text);
  background:var(--color-bg);
  line-height:1.85;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit;transition:all .3s ease}
ul{list-style:none}

/* ===== Utility ===== */
.container{max-width:var(--max-w);margin:0 auto;padding:0 24px}
.section-py{padding:var(--section-py) 0}
.text-center{text-align:center}

/* ===== Section titles ===== */
.section-title{
  font-family:var(--font-heading);
  font-size:clamp(1.6rem,4vw,2.2rem);
  font-weight:700;
  line-height:1.5;
  letter-spacing:-.02em;
  margin-bottom:20px;
}
.section-subtitle{
  font-size:17px;
  color:var(--color-text-light);
  line-height:1.9;
  max-width:640px;
  margin:0 auto 50px;
}
.section-label{
  display:inline-block;
  font-size:13px;
  font-weight:600;
  letter-spacing:.12em;
  color:var(--color-primary);
  background:var(--color-primary-light);
  padding:6px 18px;
  border-radius:100px;
  margin-bottom:18px;
}

/* ===== Animations ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.fade-up{animation:fadeUp .8s ease both}
.delay-1{animation-delay:.15s}
.delay-2{animation-delay:.3s}
.delay-3{animation-delay:.45s}
.delay-4{animation-delay:.6s}

/* ===== Buttons ===== */
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--color-primary);color:#fff;
  font-size:17px;font-weight:700;
  padding:17px 40px;border-radius:100px;
  box-shadow:0 4px 20px rgba(45,107,79,0.3);
  transition:all .3s ease;
  border:none;cursor:pointer;
}
.btn-primary:hover{
  background:var(--color-primary-dark);
  transform:translateY(-2px);
  box-shadow:0 6px 28px rgba(45,107,79,0.4);
}
.btn-primary svg{width:18px;height:18px;fill:currentColor}
.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;color:var(--color-primary);
  font-size:15px;font-weight:600;
  padding:14px 32px;border-radius:100px;
  border:2px solid var(--color-primary);
  transition:all .3s ease;
}
.btn-secondary:hover{background:var(--color-primary);color:#fff}
.cta-note{
  display:block;margin-top:12px;font-size:13px;
  color:var(--color-text-muted);
}

/* ===== Responsive base ===== */
@media(max-width:600px){
  :root{--section-py:70px}
  .section-title{font-size:23px}
}
