/* ============================================================
   Design Tokens – ECCベストワン岐阜長良校
   ============================================================ */
:root {
  /* Colors */
  --color-primary:        #1A8A4A;
  --color-primary-dark:   #146638;
  --color-primary-light:  #2EAA70;
  --color-primary-bg:     #EDFBF3;

  --color-navy:           #0F4A28;
  --color-navy-dark:      #082E18;
  --color-navy-light:     #1A6B3A;

  --color-yellow:         #FFC840;
  --color-yellow-light:   #FFE099;

  --color-green:          #2EAA70;
  --color-green-light:    #EDFBF3;

  --color-bg:             #F7FBF8;
  --color-bg-gray:        #F2F6F3;
  --color-bg-blue:        #EEF7F2;

  --color-text:           #222222;
  --color-text-sub:       #666666;
  --color-text-light:     #999999;

  --color-border:         #E8E4DF;
  --color-white:          #FFFFFF;

  /* Typography */
  --font-base:   'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
  --font-en:     'Poppins', 'Helvetica Neue', Arial, sans-serif;

  --text-xs:    0.75rem;   /* 12px */
  --text-sm:    0.875rem;  /* 14px */
  --text-base:  1rem;      /* 16px */
  --text-md:    1.125rem;  /* 18px */
  --text-lg:    1.25rem;   /* 20px */
  --text-xl:    1.5rem;    /* 24px */
  --text-2xl:   1.875rem;  /* 30px */
  --text-3xl:   2.25rem;   /* 36px */
  --text-4xl:   3rem;      /* 48px */

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-bold:    700;
  --weight-black:   900;

  --leading-tight:  1.3;
  --leading-normal: 1.7;
  --leading-loose:  2.0;

  /* Spacing */
  --space-1:   0.25rem;  /*  4px */
  --space-2:   0.5rem;   /*  8px */
  --space-3:   0.75rem;  /* 12px */
  --space-4:   1rem;     /* 16px */
  --space-5:   1.25rem;  /* 20px */
  --space-6:   1.5rem;   /* 24px */
  --space-7:   1.75rem;  /* 28px */
  --space-8:   2rem;     /* 32px */
  --space-10:  2.5rem;   /* 40px */
  --space-12:  3rem;     /* 48px */
  --space-16:  4rem;     /* 64px */
  --space-20:  5rem;     /* 80px */
  --space-24:  6rem;     /* 96px */
  --space-32:  8rem;     /* 128px */

  /* Section padding */
  --section-py-sm: 3rem;
  --section-py:    5rem;
  --section-py-lg: 7rem;

  /* Container */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1200px;
  --container-px:  1.25rem;

  /* Radius */
  --radius-sm:  0.375rem;
  --radius-md:  0.75rem;
  --radius-lg:  1.25rem;
  --radius-xl:  2rem;
  --radius-full: 9999px;

  /* Shadow */
  --shadow-sm:  0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md:  0 4px 16px rgba(0,0,0,.10);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.12);
  --shadow-card: 0 2px 12px rgba(0,0,0,.08);
  --shadow-green:  0 4px 20px rgba(26,138,74,.25);

  /* Transition */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;

  /* Z-index */
  --z-header: 100;
  --z-cta:     90;
  --z-modal:  200;
}

/* ---- Material Symbols 共通設定 ---- */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  flex-shrink: 0;
}

/* filled variant */
.bst-icon--fill {
  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* サイズユーティリティ */
.bst-icon--xs  { font-size: 1rem;    }
.bst-icon--sm  { font-size: 1.25rem; }
.bst-icon--md  { font-size: 1.5rem;  }
.bst-icon--lg  { font-size: 2rem;    }
.bst-icon--xl  { font-size: 2.5rem;  }
.bst-icon--2xl { font-size: 3rem;    }
.bst-icon--3xl { font-size: 3.5rem;  }
