:root{
  --text:#e5e7eb; --muted:#9aa4b2; --line:#1f2937; --card:#111827; --accent:#7dd3fc; --cta:#22d3ee;
  --badges:#0b1220; --ok:#34d399; --warn:#f59e0b; --danger:#ef4444;

  /* ============================================
   테마 선택 - 하나만 주석 해제하세요
   (전체 사이트 컬러가 톤인톤/톤앤톤으로 함께 변경됩니다)
   ============================================ */

  /* ─── 쿨톤 (파란색 계열) ─── */

  /* 테마 1: 미드나이트 블루 (쿨톤) 1,2는 톤이 조금 다름 */
  /*--theme-bg: linear-gradient(135deg,#080a12 0%,#0e1118 50%,#080a12 100%);
  --theme-quotes: #0e1118;
  --theme-nav: rgba(8,10,18,0.85);
  --theme-nav-border: rgba(96,165,250,0.15);
  --theme-card: #0e1118;
  --theme-section-border: rgba(96,165,250,0.12);
  --theme-hl: #0e1118;
  --theme-form: #0e1118;
  --theme-form-input: #060810;
  --theme-border: rgba(96,165,250,0.2);
  --theme-lineup: linear-gradient(180deg,#0e1118 0%,#0e1118 100%);
  --theme-table: #0e1118;
  --theme-footer-border: rgba(96,165,250,0.15);
  --theme-badge: #0e1118;
  --theme-chip: #0e1118;
  --theme-step: #0e1118;
  --theme-step-border: rgba(96,165,250,0.25);
  --theme-step-dashed: rgba(96,165,250,0.2);
  --theme-privacy-bg: #0e1118;
  --theme-privacy-border: rgba(96,165,250,0.2);
  --theme-kakao-bg: #0e1118;
  --theme-kakao-border: rgba(96,165,250,0.2);
  --theme-hero-overlay: rgba(8,10,18,0.5);
  --accent: #60a5fa;
  --cta: linear-gradient(90deg, #3b82f6 0%, #60a5fa 100%);*/

  /* 테마 2: 웜 네이비 (파란색+갈색 믹스) 현재 이 버전을 사용 중임 */
  /*--theme-bg: linear-gradient(135deg,#0a0c12 0%,#10121a 50%,#0a0c12 100%);
  --theme-quotes: #10121a;
  --theme-nav: rgba(10,12,18,0.85);
  --theme-nav-border: rgba(34,211,238,0.15);
  --theme-card: #10121a;
  --theme-section-border: rgba(34,211,238,0.12);
  --theme-hl: #10121a;
  --theme-form: #10121a;
  --theme-form-input: #080a10;
  --theme-border: rgba(34,211,238,0.2);
  --theme-lineup: linear-gradient(180deg,#10121a 0%,#10121a 100%);
  --theme-table: #10121a;
  --theme-footer-border: rgba(34,211,238,0.15);
  --theme-badge: #10121a;
  --theme-chip: #10121a;
  --theme-step: #10121a;
  --theme-step-border: rgba(34,211,238,0.25);
  --theme-step-dashed: rgba(34,211,238,0.2);
  --theme-privacy-bg: #10121a;
  --theme-privacy-border: rgba(34,211,238,0.2);
  --theme-kakao-bg: #10121a;
  --theme-kakao-border: rgba(34,211,238,0.2);
  --theme-hero-overlay: rgba(10,12,18,0.5);
  --accent: #22d3ee;
  --cta: linear-gradient(90deg, #06b6d4 0%, #22d3ee 100%);*/

  /* ─── 브라운/와인 톤 ─── */

  /* 테마 3: 럭셔리 브라운 */
  /*--theme-bg: linear-gradient(135deg,#0a0806 0%,#12100c 50%,#0a0806 100%);
  --theme-quotes: #12100c;
  --theme-nav: rgba(10,8,6,0.85);
  --theme-nav-border: rgba(212,165,116,0.15);
  --theme-card: #12100c;
  --theme-section-border: rgba(212,165,116,0.12);
  --theme-hl: #12100c;
  --theme-form: #12100c;
  --theme-form-input: #080604;
  --theme-border: rgba(212,165,116,0.2);
  --theme-lineup: linear-gradient(180deg,#12100c 0%,#12100c 100%);
  --theme-table: #12100c;
  --theme-footer-border: rgba(212,165,116,0.15);
  --theme-badge: #12100c;
  --theme-chip: #12100c;
  --theme-step: #12100c;
  --theme-step-border: rgba(212,165,116,0.25);
  --theme-step-dashed: rgba(212,165,116,0.2);
  --theme-privacy-bg: #12100c;
  --theme-privacy-border: rgba(212,165,116,0.2);
  --theme-kakao-bg: #12100c;
  --theme-kakao-border: rgba(212,165,116,0.2);
  --theme-hero-overlay: rgba(10,8,6,0.5);
  --accent: #d4a574;
  --cta: linear-gradient(90deg, #c9915a 0%, #d4a574 100%);*/

  /* ─── 오렌지 톤 ─── */

  /* 테마 4: 브라이트 오렌지 (완전 밝은 오렌지) */
  /*--theme-bg: linear-gradient(135deg,#0f0908 0%,#16100c 50%,#0f0908 100%);
  --theme-quotes: #16100c;
  --theme-nav: rgba(15,9,8,0.85);
  --theme-nav-border: rgba(255,159,74,0.15);
  --theme-card: #16100c;
  --theme-section-border: rgba(255,159,74,0.12);
  --theme-hl: #16100c;
  --theme-form: #16100c;
  --theme-form-input: #0a0705;
  --theme-border: rgba(255,159,74,0.2);
  --theme-lineup: linear-gradient(180deg,#16100c 0%,#16100c 100%);
  --theme-table: #16100c;
  --theme-footer-border: rgba(255,159,74,0.15);
  --theme-badge: #16100c;
  --theme-chip: #16100c;
  --theme-step: #16100c;
  --theme-step-border: rgba(255,159,74,0.25);
  --theme-step-dashed: rgba(255,159,74,0.2);
  --theme-privacy-bg: #16100c;
  --theme-privacy-border: rgba(255,159,74,0.2);
  --theme-kakao-bg: #16100c;
  --theme-kakao-border: rgba(255,159,74,0.2);
  --theme-hero-overlay: rgba(15,9,8,0.5);
  --accent: #ff9f4a;
  --cta: linear-gradient(90deg, #ff8c2a 0%, #ffaa55 100%);*/

  /* ─── 오렌지 톤 (로고 기반) ─── */

  /* 테마 5: 시그니처 오렌지-차콜 (톤인톤, 다크 럭셔리) */
  /*--theme-bg: linear-gradient(135deg,#070605 0%,#0f0d0b 45%,#070605 100%);
  --theme-quotes: #0f0d0b;
  --theme-nav: rgba(7,6,5,0.88);
  --theme-nav-border: rgba(233,93,34,0.15);
  --theme-card: #11100e;
  --theme-section-border: rgba(233,93,34,0.12);
  --theme-hl: #0f0d0b;
  --theme-form: #11100e;
  --theme-form-input: #0b0908;
  --theme-border: rgba(233,93,34,0.2);
  --theme-lineup: linear-gradient(180deg,#11100e 0%,#0f0d0b 100%);
  --theme-table: #11100e;
  --theme-footer-border: rgba(233,93,34,0.15);
  --theme-badge: #0f0d0b;
  --theme-chip: #0f0d0b;
  --theme-step: #0f0d0b;
  --theme-step-border: rgba(233,93,34,0.25);
  --theme-step-dashed: rgba(233,93,34,0.2);
  --theme-privacy-bg: #0f0d0b;
  --theme-privacy-border: rgba(233,93,34,0.2);
  --theme-kakao-bg: #0f0d0b;
  --theme-kakao-border: rgba(233,93,34,0.2);
  --theme-hero-overlay: rgba(7,6,5,0.55);

  --accent: #e95d22;
  --cta: linear-gradient(90deg, #e95d22 0%, #f59e0b 100%);*/

  /* ─── 오렌지 톤 (밝은 시그니처) ─── */
  /* 테마 5: 브라이트 오렌지-차콜 (톤인톤, 다크 but 밝음) */
  /*--theme-bg: linear-gradient(135deg,#0c0a08 0%,#15110d 45%,#0c0a08 100%);
  --theme-quotes: #15110d;
  --theme-nav: rgba(12,10,8,0.88);
  --theme-nav-border: rgba(255,138,61,0.15);
  --theme-card: #17120e;
  --theme-section-border: rgba(255,138,61,0.12);
  --theme-hl: #15110d;
  --theme-form: #17120e;
  --theme-form-input: #0f0c09;
  --theme-border: rgba(255,138,61,0.2);
  --theme-lineup: linear-gradient(180deg,#17120e 0%,#15110d 100%);
  --theme-table: #17120e;
  --theme-footer-border: rgba(255,138,61,0.15);
  --theme-badge: #15110d;
  --theme-chip: #15110d;
  --theme-step: #15110d;
  --theme-step-border: rgba(255,138,61,0.25);
  --theme-step-dashed: rgba(255,138,61,0.2);
  --theme-privacy-bg: #15110d;
  --theme-privacy-border: rgba(255,138,61,0.2);
  --theme-kakao-bg: #15110d;
  --theme-kakao-border: rgba(255,138,61,0.2);
  --theme-hero-overlay: rgba(12,10,8,0.45);
  --accent: #ff8a3d;
  --cta: linear-gradient(90deg, #ff7a1a 0%, #ffb36b 100%);*/

  /* 테마 6: 코르크 베이지-오렌지 (톤온톤, 웜 코르크) */
  /*--theme-bg: linear-gradient(135deg,#090705 0%,#120e0a 50%,#090705 100%);
  --theme-quotes: #120e0a;
  --theme-nav: rgba(9,7,5,0.88);
  --theme-nav-border: rgba(240,122,58,0.15);
  --theme-card: #140f0b;
  --theme-section-border: rgba(240,122,58,0.12);
  --theme-hl: #120e0a;
  --theme-form: #140f0b;
  --theme-form-input: #0d0906;
  --theme-border: rgba(240,122,58,0.2);
  --theme-lineup: linear-gradient(180deg,#140f0b 0%,#120e0a 100%);
  --theme-table: #140f0b;
  --theme-footer-border: rgba(240,122,58,0.15);
  --theme-badge: #120e0a;
  --theme-chip: #120e0a;
  --theme-step: #120e0a;
  --theme-step-border: rgba(240,122,58,0.25);
  --theme-step-dashed: rgba(240,122,58,0.2);
  --theme-privacy-bg: #120e0a;
  --theme-privacy-border: rgba(240,122,58,0.2);
  --theme-kakao-bg: #120e0a;
  --theme-kakao-border: rgba(240,122,58,0.2);
  --theme-hero-overlay: rgba(9,7,5,0.52);

  --accent: #f07a3a;
  --cta: linear-gradient(90deg, #e95d22 0%, #ffb15a 100%);*/

  /* 테마 6: 코르크 베이지-오렌지 (톤온톤, 밝고 웜) -- 이거 괜찮음*/
  /*--theme-bg: linear-gradient(135deg,#14100c 0%,#1c1712 50%,#14100c 100%);
  --theme-quotes: #1c1712;
  --theme-nav: rgba(20,16,12,0.88);
  --theme-nav-border: rgba(255,154,77,0.15);
  --theme-card: #1f1913;
  --theme-section-border: rgba(255,154,77,0.12);
  --theme-hl: #1c1712;
  --theme-form: #1f1913;
  --theme-form-input: #15100c;
  --theme-border: rgba(255,154,77,0.2);
  --theme-lineup: linear-gradient(180deg,#1f1913 0%,#1c1712 100%);
  --theme-table: #1f1913;
  --theme-footer-border: rgba(255,154,77,0.15);
  --theme-badge: #1c1712;
  --theme-chip: #1c1712;
  --theme-step: #1c1712;
  --theme-step-border: rgba(255,154,77,0.25);
  --theme-step-dashed: rgba(255,154,77,0.2);
  --theme-privacy-bg: #1c1712;
  --theme-privacy-border: rgba(255,154,77,0.2);
  --theme-kakao-bg: #1c1712;
  --theme-kakao-border: rgba(255,154,77,0.2);
  --theme-hero-overlay: rgba(20,16,12,0.4);
  --accent: #ff9a4d;
  --cta: linear-gradient(90deg, #ff8a2a 0%, #ffc07a 100%);*/

  /* ─── 오렌지 톤 (초고밝기) ─── */
   /* 테마 7: 선라이트 오렌지 (톤인톤 · 매우 밝음) - border 자연스럽게 조정 */
    /*--theme-bg: linear-gradient(
   135deg,
   #1f150c 0%,
   #2d1f12 45%,
   #1f150c 100%
   );
   --theme-quotes: #2d1f12;
   --theme-nav: rgba(31,21,12,0.92);
   --theme-nav-border: rgba(255,154,0,0.15);
   
   --theme-card: #332416;
   --theme-section-border: rgba(255,154,0,0.12);
   --theme-hl: #2d1f12;
   
   --theme-form: #332416;
   --theme-form-input: #281a0f;
   
   --theme-border: rgba(255,154,0,0.2);
   --theme-lineup: linear-gradient(180deg,#332416 0%,#2d1f12 100%);
   --theme-table: #332416;
   --theme-footer-border: rgba(255,154,0,0.15);
   
   --theme-badge: #2d1f12;
   --theme-chip: #2d1f12;
   
   --theme-step: #2d1f12;
   --theme-step-border: rgba(255,154,0,0.25);
   --theme-step-dashed: rgba(255,154,0,0.2);
   
   --theme-privacy-bg: #2d1f12;
   --theme-privacy-border: rgba(255,154,0,0.2);
   
   --theme-kakao-bg: #2d1f12;
   --theme-kakao-border: rgba(255,154,0,0.2);
   
   --theme-hero-overlay: rgba(31,21,12,0.3);
   --accent: #ff9f1c;
   --cta: linear-gradient(
   90deg,
   #ff8a00 0%,
   #ffd08a 100%
   );*/
  
  /* 테마 8: 크림 오렌지 (톤온톤 · 초밝음) */
  /*--theme-bg: linear-gradient(
    135deg,
    #2a1d12 0%,
    #3a2819 50%,
    #2a1d12 100%
  );
  --theme-quotes: #3a2819;
  --theme-nav: rgba(42,29,18,0.92);
  --theme-nav-border: rgba(255,176,0,0.15);
  
  --theme-card: #3f2c1b;
  --theme-section-border: rgba(255,176,0,0.12);
  --theme-hl: #3a2819;
  
  --theme-form: #3f2c1b;
  --theme-form-input: #2f2014;
  
  --theme-border: rgba(255,176,0,0.2);
  --theme-lineup: linear-gradient(180deg,#3f2c1b 0%,#3a2819 100%);
  --theme-table: #3f2c1b;
  --theme-footer-border: rgba(255,176,0,0.15);
  
  --theme-badge: #3a2819;
  --theme-chip: #3a2819;
  
  --theme-step: #3a2819;
  --theme-step-border: rgba(255,176,0,0.25);
  --theme-step-dashed: rgba(255,176,0,0.2);
  
  --theme-privacy-bg: #3a2819;
  --theme-privacy-border: rgba(255,176,0,0.2);
  
  --theme-kakao-bg: #3a2819;
  --theme-kakao-border: rgba(255,176,0,0.2);
  
  --theme-hero-overlay: rgba(42,29,18,0.18);
  --accent: #ffb000;
  --cta: linear-gradient(
    90deg,
    #ff9a00 0%,
    #ffe0b3 100%
  );*/

  /* ─── 오렌지 톤 (초초밝기) ─── */

  /* 테마 9: 선셋 오렌지 (톤온톤 · 매우 밝음) */
  /*--theme-bg: linear-gradient(
    135deg,
    #3a2819 0%,
    #4a3624 50%,
    #3a2819 100%
  );
  --theme-quotes: #4a3624;
  --theme-nav: rgba(58,40,25,0.92);
  --theme-nav-border: rgba(255,180,50,0.15);
  
  --theme-card: #523d2a;
  --theme-section-border: rgba(255,180,50,0.12);
  --theme-hl: #4a3624;
  
  --theme-form: #523d2a;
  --theme-form-input: #3d2a1c;
  
  --theme-border: rgba(255,180,50,0.2);
  --theme-lineup: linear-gradient(180deg,#523d2a 0%,#4a3624 100%);
  --theme-table: #523d2a;
  --theme-footer-border: rgba(255,180,50,0.15);
  
  --theme-badge: #4a3624;
  --theme-chip: #4a3624;
  
  --theme-step: #4a3624;
  --theme-step-border: rgba(255,180,50,0.25);
  --theme-step-dashed: rgba(255,180,50,0.2);
  
  --theme-privacy-bg: #4a3624;
  --theme-privacy-border: rgba(255,180,50,0.2);
  
  --theme-kakao-bg: #4a3624;
  --theme-kakao-border: rgba(255,180,50,0.2);
  
  --theme-hero-overlay: rgba(58,40,25,0.12);
  --accent: #ffb432;
  --cta: linear-gradient(
    90deg,
    #ffa500 0%,
    #ffe5b3 100%
  );*/

  /* 테마 10: 골든 오렌지 (톤온톤 · 초고밝음) - 더 밝게 조정 xxxx*/
  /*--theme-bg: linear-gradient(
    135deg,
    #6a5540 0%,
    #7a6548 50%,
    #6a5540 100%
  );
  --theme-quotes: #7a6548;
  --theme-nav: rgba(106,85,64,0.92);
  --theme-nav-border: rgba(255,200,80,0.15);
  
  --theme-card: #8a7258;
  --theme-section-border: rgba(255,200,80,0.12);
  --theme-hl: #7a6548;
  
  --theme-form: #8a7258;
  --theme-form-input: #6a5540;
  
  --theme-border: rgba(255,200,80,0.2);
  --theme-lineup: linear-gradient(180deg,#8a7258 0%,#7a6548 100%);
  --theme-table: #8a7258;
  --theme-footer-border: rgba(255,200,80,0.15);
  
  --theme-badge: #7a6548;
  --theme-chip: #7a6548;
  
  --theme-step: #7a6548;
  --theme-step-border: rgba(255,200,80,0.25);
  --theme-step-dashed: rgba(255,200,80,0.2);
  
  --theme-privacy-bg: #7a6548;
  --theme-privacy-border: rgba(255,200,80,0.2);
  
  --theme-kakao-bg: #7a6548;
  --theme-kakao-border: rgba(255,200,80,0.2);
  
  --theme-hero-overlay: rgba(106,85,64,0.05);
  --accent: #ffc850;
  --cta: linear-gradient(
    90deg,
    #ffb020 0%,
    #ffebcc 100%
  );*/

  /* 테마 11: 앰버 오렌지 (톤온톤 · 최고밝음) */
  /*--theme-bg: linear-gradient(
    135deg,
    #5a4532 0%,
    #6a5540 50%,
    #5a4532 100%
  );
  --theme-quotes: #6a5540;
  --theme-nav: rgba(90,69,50,0.92);
  --theme-nav-border: rgba(255,220,100,0.15);
  
  --theme-card: #725d46;
  --theme-section-border: rgba(255,220,100,0.12);
  --theme-hl: #6a5540;
  
  --theme-form: #725d46;
  --theme-form-input: #5a4532;
  
  --theme-border: rgba(255,220,100,0.2);
  --theme-lineup: linear-gradient(180deg,#725d46 0%,#6a5540 100%);
  --theme-table: #725d46;
  --theme-footer-border: rgba(255,220,100,0.15);
  
  --theme-badge: #6a5540;
  --theme-chip: #6a5540;
  
  --theme-step: #6a5540;
  --theme-step-border: rgba(255,220,100,0.25);
  --theme-step-dashed: rgba(255,220,100,0.2);
  
  --theme-privacy-bg: #6a5540;
  --theme-privacy-border: rgba(255,220,100,0.2);
  
  --theme-kakao-bg: #6a5540;
  --theme-kakao-border: rgba(255,220,100,0.2);
  
  --theme-hero-overlay: rgba(90,69,50,0.05);
  --accent: #ffdc64;
  --cta: linear-gradient(
    90deg,
    #ffcc40 0%,
    #fff5e6 100%
  );*/

  /* ─── 오렌지 톤 (초초초밝기) ─── */

  /* 테마 12: 선라이트 오렌지 (톤온톤 · 극도로 밝음) X*/
  /*--theme-bg: linear-gradient(
    135deg,
    #7a6548 0%,
    #8a7558 50%,
    #7a6548 100%
  );
  --theme-quotes: #8a7558;
  --theme-nav: rgba(122,101,72,0.92);
  --theme-nav-border: rgba(255,220,100,0.15);
  
  --theme-card: #9a8568;
  --theme-section-border: rgba(255,220,100,0.12);
  --theme-hl: #8a7558;
  
  --theme-form: #9a8568;
  --theme-form-input: #7a6548;
  
  --theme-border: rgba(255,220,100,0.2);
  --theme-lineup: linear-gradient(180deg,#9a8568 0%,#8a7558 100%);
  --theme-table: #9a8568;
  --theme-footer-border: rgba(255,220,100,0.15);
  
  --theme-badge: #8a7558;
  --theme-chip: #8a7558;
  
  --theme-step: #8a7558;
  --theme-step-border: rgba(255,220,100,0.25);
  --theme-step-dashed: rgba(255,220,100,0.2);
  
  --theme-privacy-bg: #8a7558;
  --theme-privacy-border: rgba(255,220,100,0.2);
  
  --theme-kakao-bg: #8a7558;
  --theme-kakao-border: rgba(255,220,100,0.2);
  
  --theme-hero-overlay: rgba(122,101,72,0.03);
  --accent: #ffe078;
  --cta: linear-gradient(
    90deg,
    #ffd450 0%,
    #fff8e6 100%
  );*/

  /* 테마 13: 골든 선샤인 (톤온톤 · 최대 밝음) xxx */
  /*--theme-bg: linear-gradient(
    135deg,
    #8a7558 0%,
    #9a8568 50%,
    #8a7558 100%
  );
  --theme-quotes: #9a8568;
  --theme-nav: rgba(138,117,88,0.92);
  --theme-nav-border: rgba(255,230,120,0.15);
  
  --theme-card: #aa9578;
  --theme-section-border: rgba(255,230,120,0.12);
  --theme-hl: #9a8568;
  
  --theme-form: #aa9578;
  --theme-form-input: #8a7558;
  
  --theme-border: rgba(255,230,120,0.2);
  --theme-lineup: linear-gradient(180deg,#aa9578 0%,#9a8568 100%);
  --theme-table: #aa9578;
  --theme-footer-border: rgba(255,230,120,0.15);
  
  --theme-badge: #9a8568;
  --theme-chip: #9a8568;
  
  --theme-step: #9a8568;
  --theme-step-border: rgba(255,230,120,0.25);
  --theme-step-dashed: rgba(255,230,120,0.2);
  
  --theme-privacy-bg: #9a8568;
  --theme-privacy-border: rgba(255,230,120,0.2);
  
  --theme-kakao-bg: #9a8568;
  --theme-kakao-border: rgba(255,230,120,0.2);
  
  --theme-hero-overlay: rgba(138,117,88,0.02);
  --accent: #ffe68c;
  --cta: linear-gradient(
    90deg,
    #ffdc60 0%,
    #fffaf0 100%
  );*/

  /* 테마 14: 크림 오렌지 선샤인 (톤온톤 · 극대 밝음) */
  /*--theme-bg: linear-gradient(
    135deg,
    #9a8568 0%,
    #aa9578 50%,
    #9a8568 100%
  );
  --theme-quotes: #aa9578;
  --theme-nav: rgba(154,133,104,0.92);
  --theme-nav-border: rgba(255,240,140,0.15);
  
  --theme-card: #baa588;
  --theme-section-border: rgba(255,240,140,0.12);
  --theme-hl: #aa9578;
  
  --theme-form: #baa588;
  --theme-form-input: #9a8568;
  
  --theme-border: rgba(255,240,140,0.2);
  --theme-lineup: linear-gradient(180deg,#baa588 0%,#aa9578 100%);
  --theme-table: #baa588;
  --theme-footer-border: rgba(255,240,140,0.15);
  
  --theme-badge: #aa9578;
  --theme-chip: #aa9578;
  
  --theme-step: #aa9578;
  --theme-step-border: rgba(255,240,140,0.25);
  --theme-step-dashed: rgba(255,240,140,0.2);
  
  --theme-privacy-bg: #aa9578;
  --theme-privacy-border: rgba(255,240,140,0.2);
  
  --theme-kakao-bg: #aa9578;
  --theme-kakao-border: rgba(255,240,140,0.2);
  
  --theme-hero-overlay: rgba(154,133,104,0.01);
  --accent: #fff0a0;
  --cta: linear-gradient(
    90deg,
    #ffe070 0%,
    #fffef8 100%
  );*/

  /* 테마 15: 코르크 브론즈 (톤온톤 · 테마9보다 연하고 테마10보다 진함) */
  --theme-bg: linear-gradient(
    135deg,
    #4a3626 0%,
    #5a4532 50%,
    #4a3626 100%
  );
  --theme-quotes: #5a4532;

  --theme-nav: rgba(74,54,38,0.92);
  --theme-nav-border: rgba(255,200,80,0.14);

  --theme-card: #624836;
  --theme-section-border: rgba(255,200,80,0.11);
  --theme-hl: #5a4532;

  --theme-form: #624836;
  --theme-form-input: #4a3626;

  --theme-border: rgba(255,200,80,0.18);
  --theme-lineup: linear-gradient(180deg,#624836 0%,#5a4532 100%);
  --theme-table: #624836;
  --theme-footer-border: rgba(255,200,80,0.14);

  --theme-badge: #5a4532;
  --theme-chip: #5a4532;

  --theme-step: #5a4532;
  --theme-step-border: rgba(255,200,80,0.22);
  --theme-step-dashed: rgba(255,200,80,0.18);

  --theme-privacy-bg: #5a4532;
  --theme-privacy-border: rgba(255,200,80,0.18);

  --theme-kakao-bg: #5a4532;
  --theme-kakao-border: rgba(255,200,80,0.18);

  /* 밝은 톤에서 헤로 오버레이는 너무 옅으면 사진이 튀니, 9~10의 중간값 */
  --theme-hero-overlay: rgba(50,36,26,0.22);

  --accent: #ffc164;
  --cta: linear-gradient(
    90deg,
    #ffb020 0%,
    #ffe2b8 100%
  );


}
*{box-sizing:border-box}
body{
  margin:0;
  color:var(--text);
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",Arial,sans-serif;
  background:var(--theme-bg);
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.nav{position:sticky;top:0;z-index:40;background:var(--theme-nav);backdrop-filter:blur(8px);border-bottom:1px solid var(--theme-nav-border)}
.nav .inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;gap:10px;align-items:center;font-weight:800;letter-spacing:.2px}
.brand img{height:32px;width:auto}
.brand a{color:inherit;text-decoration:none;cursor:pointer}
.menu{display:flex;gap:18px;align-items:center}
.menu a{color:var(--muted);font-size:14px}
.menu a:hover{color:#fff}
.menu .cta{background:var(--cta);color:#0b0f1a;border:0;border-radius:999px;padding:4px 12px;font-weight:800;font-size:14px;line-height:1.5;height:auto}
.cta{background:var(--cta);color:#0b0f1a;border:0;border-radius:999px;padding:10px 14px;font-weight:800}

.hero{position:relative;overflow:hidden;text-align:left;background:url('hero_bg.jpg') center/cover no-repeat;}
.hero:before{content:"";position:absolute;inset:0;background:var(--theme-hero-overlay)}
.hero .inner{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr .8fr;gap:28px;padding:90px 0 70px}
@media (max-width:940px){ .hero .inner{grid-template-columns:1fr} }
.hero h1{
  margin:0;
  font-size:52px;
  line-height:1.15;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:0.3em;
}

/* "Bottle & Cork" 브랜드명 스타일 (원래 스타일 유지) */
.hero h1 .brand-name{
  font-family:'Playfair Display',serif;
  font-size:1em;
  color:#fff;
  text-shadow:0 0 20px rgba(255,255,255,0.3),0 4px 15px rgba(0,0,0,0.5);
  white-space:nowrap;
}

/* "바틀앤코르크 위스키·와인 셀렉트 숍" 부제목 스타일 (일반 텍스트 스타일) */
.hero h1 .brand-subtitle{
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",Arial,sans-serif;
  font-size:0.85em;
  font-weight:400;
  color:#fff;
  white-space:nowrap;
}
.hero p{margin:20px 0 0;color:var(--muted);font-size:18px}
.badges{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.badge{
  background:var(--theme-badge);
  border:none;
  color:#e5e7eb;
  padding:10px 16px;
  border-radius:8px;
  font-size:14px;
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",Arial,sans-serif;
  font-weight:400;
  line-height:1.5;
  transition:all 0.2s ease;
  box-shadow:0 2px 4px rgba(0,0,0,0.1);
}
.badge:hover{
  background:var(--theme-hl);
  transform:translateY(-1px);
  box-shadow:0 4px 8px rgba(0,0,0,0.15);
}

.quotes{padding:60px 0;background:var(--theme-quotes)}
.quotes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:940px){.quotes-grid{grid-template-columns:1fr}}
.quotes-card{border:none;border-radius:0;padding:20px;background:transparent;color:#e5e7eb;line-height:1.7}
.quotes-card p{margin:0;font-size:18px;font-family:'Pretendard',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",Arial,sans-serif;font-weight:400;font-style:normal}

.section{padding:56px 0;border-top:1px solid var(--theme-section-border);scroll-margin-top:50px}
.section:first-of-type{border-top:none}
/* 모든 앵커 링크 대상 섹션에 스크롤 오프셋 적용 */
section[id]{scroll-margin-top:50px}
.section h2{margin:0 0 16px;font-size:28px;font-weight:700}
.muted{color:var(--muted)}

.cards{display:flex;gap:16px;overflow:hidden;scroll-snap-type:x mandatory;padding-bottom:2px}
@media (max-width:940px){ .cards{scroll-snap-type:x mandatory} }
@media (max-width:940px){ .cards{grid-template-columns:1fr} }
.card{border:none;background:var(--theme-card);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;scroll-snap-align:start;min-width:340px;box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.card .ph{height:180px;background-size:cover;background-position:center}
.card .body{padding:14px}
.chip{display:inline-block;border:none;border-radius:999px;padding:6px 10px;font-size:12px;color:#cbd5e1;background:var(--theme-chip);margin-right:6px}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:940px){ .grid-2{grid-template-columns:1fr} }
.hl{
  border:none;
  border-radius:16px;
  padding:18px 20px;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.04),
      rgba(0,0,0,0.08)
    ),
    var(--theme-hl);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 10px 30px rgba(0,0,0,0.25);
}
.hl.mt-16{margin-top:16px}
.steps{counter-reset:step}
.step{display:flex;gap:12px;align-items:flex-start;border:1px dashed var(--theme-step-dashed);border-radius:12px;padding:12px;margin-top:10px}
.step{
  border:none;
  border-radius:14px;
  padding:14px 16px;
  background:var(--theme-hl);
  box-shadow:
    0 6px 20px rgba(0,0,0,0.2);
}
/* 체크리스트 숫자: 원형 제거, 숫자만 유지 */
.step:before{
  counter-increment: step;
  content: counter(step);
  display:inline-flex;
  align-items:center;
  justify-content:center;

  /* ❌ 원형 제거 */
  width:auto;
  height:auto;
  border:none;
  border-radius:0;
  background:none;

  /* 숫자 스타일 */
  font-size:15px;
  font-weight:700;
  color: rgba(255,255,255,0.75);

  /* 위치 보정 */
  margin-right:10px;
}

.step input{accent-color:var(--cta)}
.step input:disabled{opacity:1;cursor:not-allowed}
.step label{cursor:default}
.privacy-checkbox{display:flex;gap:8px;align-items:center;margin-top:14px;padding:10px 12px;border:1px solid var(--theme-privacy-border);border-radius:8px;background:var(--theme-privacy-bg);cursor:pointer}
.privacy-checkbox span{font-size:14px;color:#cbd5e1}
.kakao-btn{background:var(--theme-kakao-bg)!important;color:#cbd5e1!important;border:1px solid var(--theme-kakao-border)!important;padding:10px 14px;border-radius:999px}

#faq .box{border:none;border-radius:12px;background:var(--theme-hl);box-shadow:0 2px 8px rgba(0,0,0,0.1)}
#faq .faq-grid{display:grid;gap:12px}
#faq details+details{margin-top:10px}
#faq summary{cursor:pointer;list-style:none;position:relative;padding:14px 40px 14px 14px;font-weight:600;color:#ffffff}
#faq summary::marker{display:none}
#faq summary .caret{position:absolute;right:12px;top:10px;transition:transform .2s ease;color:var(--accent)}
#faq summary .faq-icon{color:var(--accent)}
#faq details[open] summary .caret{transform:rotate(90deg)}
#faq .answer{padding:0 16px 14px 14px;color:#9aa4b2;line-height:1.7;position:relative}
#faq .answer .answer-icon{color:var(--ok)}

table{width:100%;border-collapse:collapse;font-size:15px;margin-top:18px}
th,td{padding:12px 10px;border-bottom:1px solid var(--theme-border)}
tbody tr:last-child td{border-bottom:none}
th{background:var(--theme-table);text-align:left}

.footer{padding:28px 0;border-top:1px solid var(--theme-footer-border);color:#9aa4b2;font-size:13px}
.footer a{color:#a5b4fc}
.footer .footer-address{margin-top:6px}
.footer .footer-copyright{margin-top:12px}
.muted.mt-14{margin-top:14px}

.form{border:none;border-radius:14px;background:var(--theme-form);padding:20px;box-shadow:0 4px 16px rgba(0,0,0,0.15)}
.form .cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .cols.mt-10{margin-top:10px}
.form label.block{display:block;margin-top:10px}
.form input,.form textarea{width:100%;padding:10px;border-radius:8px;border:1px solid var(--theme-border);background:var(--theme-form-input);color:#e5e7eb;transition:border-color 0.2s ease}
.form input:focus,.form textarea:focus{border-color:var(--accent);outline:none}
.form textarea{min-height:100px}
.form button{cursor:pointer}
.form input[type="checkbox"]{accent-color:var(--accent);width:16px;height:16px}
.form .form-buttons{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.form .form-note{margin:10px 0 0;font-size:12px}
.card .slider{position:relative;height:180px;overflow:hidden;background:var(--theme-hl)}
.card .slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .45s ease}
.card .slide.active{opacity:1}
.card .dots{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);display:flex;gap:6px;z-index:2}
.card .dot{width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.35);border:0}
.card .dot.active{background:#22d3ee}
.cards::-webkit-scrollbar{height:6px}
.cards::-webkit-scrollbar-thumb{background:#182235;border-radius:999px}
.cards::-webkit-scrollbar-track{background:var(--theme-hl)}

.lineup-grid{display:grid;grid-template-columns:0.4fr 1fr;gap:18px}
@media (max-width:940px){.lineup-grid{grid-template-columns:1fr}}

.lineup-slide{border:none;border-radius:16px;background:var(--theme-lineup);padding:20px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.15)}
.lineup-slider-container{position:relative;height:200px;overflow:hidden}
.lineup-slide-item{position:absolute;inset:0;opacity:0;transition:opacity 0.5s ease;display:flex;align-items:center;justify-content:center}
.lineup-slide-item.active{opacity:1;z-index:1}
.lineup-slide-item img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.lineup-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:2}
.lineup-dots .dot{width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.35);border:0;cursor:pointer}
.lineup-dots .dot.active{background:#22d3ee}

.lineup-gallery{border:none;border-radius:16px;background:var(--theme-lineup);padding:20px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.15)}
.lineup-gallery-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth}
.lineup-gallery-grid::-webkit-scrollbar{height:6px}
.lineup-gallery-grid::-webkit-scrollbar-thumb{background:#182235;border-radius:999px}
.lineup-gallery-grid::-webkit-scrollbar-track{background:#0b0f1a}
.lineup-gallery-grid img{flex:0 0 auto;width:140px;height:200px;object-fit:cover;border-radius:10px;border:none;scroll-snap-align:start;box-shadow:0 2px 8px rgba(0,0,0,0.2)}

/* 모달 스타일 */
#thankYouModal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.6);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
#thankYouModal.show{display:flex}
#thankYouModal .modal-content{
  background:var(--theme-card);
  border:none;
  border-radius:14px;
  padding:28px 24px;
  max-width:420px;
  width:90%;
  text-align:center;
  color:#e5e7eb;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
#thankYouModal h3{margin:0 0 12px;font-size:20px}
#thankYouModal p{font-size:14px;line-height:1.6;color:#cbd5e1}
#thankYouModal .modal-button{margin-top:20px}
.hidden{display:none}


.form input:focus,
.form textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px rgba(255,154,77,0.25);
}

/* 입력 완료 / 자동완성 시 배경색 유지 (Chrome, Edge) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: #e5e7eb; /* 텍스트 색 */
  -webkit-box-shadow: 0 0 0px 1000px var(--theme-form-input) inset;
  box-shadow: 0 0 0px 1000px var(--theme-form-input) inset;
  transition: background-color 9999s ease-in-out 0s;
}

/* submit 비활성화 상태 */
button.cta:disabled{
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(20%);
}

/* 로고 이미지 스타일 */
.nav {
  height: 63px;
}

.nav .inner {
  height: 100%;
  display: flex;
  align-items: center;
}

.brand img {
  height: 38px;
  width: auto;
}
