@charset "utf-8";

/* ============================================================================
   P&F bio 브랜드 토큰
   과거와미래(Past and Future) CI 에서 추출한 색을 단일 출처로 정의한다.
   로고 원본색은 딥그린 #056839 와 골드 #FFCB08 두 가지뿐이며,
   나머지 단계는 이 두 색에서 파생시킨 값이다.
   ========================================================================== */

:root {
    /* --- 로고 원본색 ------------------------------------------------------ */
    --pnf-green: #056839;   /* CI 문자 · 밀 이삭 심볼 */
    --pnf-gold:  #FFCB08;   /* CI 배지 배경 */

    /* --- 그린 계열 -------------------------------------------------------- */
    --pnf-green-900: #02361D;   /* 푸터 · 다크 섹션 배경 */
    --pnf-green-800: #04512C;   /* hover · press */
    --pnf-green-700: #056839;   /* = --pnf-green, 기본 브랜드색 */
    --pnf-green-600: #0A7E47;
    --pnf-green-500: #2E9A64;
    --pnf-green-300: #8AB9A3;
    --pnf-green-100: #DEEBE5;
    --pnf-green-050: #F2F7F4;   /* 섹션 교차 배경 */

    /* --- 골드 계열 -------------------------------------------------------- */
    --pnf-gold-600: #D9A800;    /* 골드 위 텍스트가 필요할 때의 진한 단계 */
    --pnf-gold-500: #FFCB08;    /* = --pnf-gold, 강조 면색 */
    --pnf-gold-300: #FFD845;
    --pnf-gold-100: #FFF1C2;

    /* --- 중성색 ----------------------------------------------------------- */
    --pnf-ink:      #14231B;    /* 본문 텍스트. 그린 기운이 도는 먹색 */
    --pnf-ink-sub:  #4A5A51;    /* 보조 텍스트 */
    --pnf-line:     #DCE5E0;    /* 구분선 · 카드 테두리 */
    --pnf-bg-soft:  #F4F7F5;

    /* --- 역할 토큰 -------------------------------------------------------- */
    --pnf-brand:        var(--pnf-green-700);
    --pnf-brand-hover:  var(--pnf-green-800);
    --pnf-accent:       var(--pnf-gold-500);
    --pnf-on-brand:     #FFFFFF;
    --pnf-on-accent:    var(--pnf-ink);

    /* --- 모션 이징 (메인 .pnf-btn 과 동일한 스프링 바운스) -------------------
       게시판·폼 등 pnf-main/pnf-sub 가 로드되지 않는 페이지의 버튼도
       같은 튕김을 쓰도록 토큰을 전역(pnf-tokens)에 둔다. */
    --pnf-btn-hover: #FFE06B;   /* 골드 채움 위 호버 레이어(밝은 골드) */
    --pnf-ease-back: cubic-bezier(.37,-.47,.91,.65);
    --pnf-ease-bounce: linear(0,.0486,.0959,.1418,.1864,.2297,.2717,.3125,.352,.3903,.4273,.4632,.4979,.5314,.5638,.595,.6252,.6542,.6822,.7092,.735,.7599,.7838,.8067,.8286,.8495,.8696,.8887,.9069,.9242,.9407,.9563,.9711,.9851,.9983,1.0108,1.0224,1.0334,1.0436,1.0531,1.0619,1.0701,1.0776,1.0844,1.0907,1.0963,1.1014,1.1059,1.1099,1.1133,1.1163,1.1187,1.1206,1.1221,1.1232,1.1238,1.1241,1.1239,1.1234,1.1225,1.1213,1.1197,1.1179,1.1158,1.1134,1.1108,1.1079,1.1049,1.1016,1.0982,1.0946,1.0909,1.087,1.083,1.079,1.0748,1.0707,1.0664,1.0622,1.058,1.0538,1.0496,1.0454,1.0414,1.0374,1.0335,1.0298,1.0262,1.0227,1.0195,1.0164,1.0135,1.0109,1.0085,1.0063,1.0045,1.0029,1.0017,1.0007,1.0002,1);
}

/* ----------------------------------------------------------------------------
   색 사용 규칙 (접근성)

   - --pnf-green (#056839) 은 흰 배경 대비 7.08:1 로 본문 텍스트까지 사용 가능.
   - --pnf-gold  (#FFCB08) 은 흰 배경 대비 1.51:1 로 텍스트에 절대 쓰지 않는다.
     골드는 면(배경)·아이콘·언더라인 같은 강조 요소로만 쓰고,
     골드 위 텍스트는 --pnf-ink 를 얹는다.
   - 그린 배경 위 골드는 4.68:1 이므로 큰 글자와 UI 요소에 한해 허용한다.
   -------------------------------------------------------------------------- */