@charset "utf-8";
/* ============================================================
   색상 시안 — <html data-theme="..."> 로 전환
   ------------------------------------------------------------
   A안 sage   : 중성 먹색 + 세이지 그린  (style.css 의 :root 기본값)
   B안 navy   : 딥 네이비 + 황동(앰버)
   C안 ivory  : 아이보리 + 딥 그린 (밝은 배경)

   확정되면 content.json 의 event.theme 에 값을 넣으면 됩니다.
   ============================================================ */

/* ───────── 키비주얼 반영 : 화이트 + 딥 네이비 (기본값) ─────────
   전달받은 키비주얼에서 추출한 색
     바탕 #ffffff / 연블루 면 #e9f1f8 / 제목 #0c3658 / 강조 #425d98
   ------------------------------------------------------------- */
:root[data-theme="kv"]{
  --brand:        #425d98;   /* 키비주얼 영문 타이포 블루 */
  --brand-ink:    #ffffff;
  --ink:          #0c3658;   /* 키비주얼 제목 네이비 */

  --bg:           #ffffff;
  --bg-soft:      #f2f7fb;
  --bg-card:      #ffffff;
  --bg-card-2:    #f4f8fc;

  --tx:           #0c3658;
  --tx-sub:       #4c6a88;
  --tx-dim:       #8296ae;

  --line:         rgba(12,54,88,.13);
  --line-2:       rgba(12,54,88,.24);

  --fill:         rgba(66,93,152,.055);
  --fill-2:       rgba(66,93,152,.09);
  --fill-3:       rgba(66,93,152,.04);
  --grid:         rgba(12,54,88,.05);

  --brand-a08:    rgba(66,93,152,.07);
  --brand-a12:    rgba(66,93,152,.11);
  --brand-a20:    rgba(66,93,152,.20);
  --brand-a40:    rgba(66,93,152,.40);

  --warn:         #9a6a0e;
  --danger:       #b3372f;
  --warn-a08:     rgba(154,106,14,.09);
  --warn-a24:     rgba(154,106,14,.26);
  --danger-a10:   rgba(179,55,47,.08);
  --danger-a30:   rgba(179,55,47,.28);
  --danger-tx:    #8f2b24;

  --veil-1:       rgba(255,255,255,.0);
  --veil-2:       rgba(255,255,255,.0);
  --veil-3:       rgba(255,255,255,.0);

  --float:        rgba(255,255,255,.90);
  --float-solid:  rgba(255,255,255,.98);
  --dim:          rgba(12,54,88,.45);
  --shadow:       rgba(12,54,88,.16);
}

/* ───────── B안 : 네이비 + 황동 ───────── */
:root[data-theme="navy"]{
  --brand:        #d9a356;
  --brand-ink:    #241704;

  --bg:           #0c1118;
  --bg-soft:      #101722;
  --bg-card:      #131c28;
  --bg-card-2:    #18232f;

  --tx:           #eef2f7;
  --tx-sub:       #9aa6b5;
  --tx-dim:       #65717f;

  --line:         rgba(255,255,255,.09);
  --line-2:       rgba(255,255,255,.17);

  --fill:         rgba(255,255,255,.055);
  --fill-2:       rgba(255,255,255,.08);
  --fill-3:       rgba(0,0,0,.22);
  --grid:         rgba(255,255,255,.032);

  --brand-a08:    rgba(217,163,86,.09);
  --brand-a12:    rgba(217,163,86,.14);
  --brand-a20:    rgba(217,163,86,.24);
  --brand-a40:    rgba(217,163,86,.44);

  --veil-1:       rgba(12,17,24,.74);
  --veil-2:       rgba(12,17,24,.36);
  --veil-3:       rgba(12,17,24,.56);

  --float:        rgba(12,17,24,.80);
  --float-solid:  rgba(16,23,34,.98);
  --dim:          rgba(4,7,11,.80);
  --shadow:       rgba(0,0,0,.55);
}

/* ───────── C안 : 아이보리 + 딥 그린 (밝은 배경) ───────── */
:root[data-theme="ivory"]{
  --brand:        #1f6b50;
  --brand-ink:    #ffffff;

  --bg:           #f5f3ee;
  --bg-soft:      #edeae3;
  --bg-card:      #ffffff;
  --bg-card-2:    #f3f1ea;

  --tx:           #191b1a;
  --tx-sub:       #545b57;
  --tx-dim:       #868d88;

  --line:         rgba(25,27,26,.12);
  --line-2:       rgba(25,27,26,.22);

  --fill:         rgba(25,27,26,.045);
  --fill-2:       rgba(25,27,26,.07);
  --fill-3:       rgba(25,27,26,.035);
  --grid:         rgba(25,27,26,.045);

  --brand-a08:    rgba(31,107,80,.07);
  --brand-a12:    rgba(31,107,80,.11);
  --brand-a20:    rgba(31,107,80,.20);
  --brand-a40:    rgba(31,107,80,.42);

  --warn:         #a86a12;
  --danger:       #b3372f;
  --warn-a08:     rgba(168,106,18,.09);
  --warn-a24:     rgba(168,106,18,.26);
  --danger-a10:   rgba(179,55,47,.08);
  --danger-a30:   rgba(179,55,47,.28);
  --danger-tx:    #8f2b24;

  --veil-1:       rgba(245,243,238,.80);
  --veil-2:       rgba(245,243,238,.45);
  --veil-3:       rgba(245,243,238,.62);

  --float:        rgba(245,243,238,.86);
  --float-solid:  rgba(252,251,248,.98);
  --dim:          rgba(25,27,26,.45);
  --shadow:       rgba(25,27,26,.18);
}

/* 밝은 테마에서만 달라지는 소소한 처리 */
:root[data-theme="ivory"] .hero__title-lg{ color:var(--tx); }
:root[data-theme="ivory"] .hero__canvas{ opacity:.5; }
:root[data-theme="ivory"] .hd__logo-img path[stroke],
:root[data-theme="ivory"] .sv-hd__logo path[stroke]{ stroke:var(--brand); }
:root[data-theme="ivory"] .surveybox img,
:root[data-theme="ivory"] .qr-card__qr img{ background:#fff; }
:root[data-theme="ivory"] .formcard,
:root[data-theme="ivory"] .infocard,
:root[data-theme="ivory"] .tl__body,
:root[data-theme="ivory"] .contactbox,
:root[data-theme="ivory"] .hero__status{
  box-shadow:0 1px 2px rgba(25,27,26,.05), 0 6px 18px rgba(25,27,26,.04);
}
