@charset "UTF-8";

/* =====================================================
  BRAND TOKENS : THE BAR（DARK）
===================================================== */

:root{
  --fb-en:'Cormorant Garamond', serif;
  --fb-ja:'Noto Serif JP', serif;

  --fb-bg:#0d1014;
  --fb-bg-soft:#131820;
  --fb-surface:rgba(255,255,255,.04);

  --fb-text:#f5f7fa;
  --fb-muted:rgba(245,247,250,.70);

  --fb-line:rgba(255,255,255,.12);
  --fb-line-soft:rgba(255,255,255,.08);

  --fb-body:15px;
  --fb-lh:2.0;

  --bar-accent:#7a3654;
  --bar-accent-soft:#8c4466;

  /* =========================
    LAYOUT TOKENS
  ========================= */
  --bar-max:1040px;
  --bar-gutter:8px;

  /* =========================
    SHARED TOKENS
  ========================= */
  --bg:var(--fb-bg);
  --text-soft:var(--fb-muted);
}

/* =====================================================
  BASE
===================================================== */

html{
  background:var(--fb-bg);
}

body{
  font-family:var(--fb-en), var(--fb-ja);
  font-size:var(--fb-body);
  line-height:var(--fb-lh);
  letter-spacing:.035em; /* ← 本文は控えめ */
  background:var(--fb-bg);
  color:var(--fb-text);
}

.fb-main{
  background:var(--fb-bg);
  color:var(--fb-text);
}

.fb-section{
  background:var(--fb-bg);
}

/* =====================================================
  EYEBROW / LABEL
===================================================== */
.fb-eyebrow{
  font-family:var(--fb-en);
  font-size:11px;
  line-height:1.2;
  letter-spacing:.14em; /* ← 統一（広め） */
  text-transform:uppercase;
  color:var(--fb-muted);
  font-weight:300;
  opacity:.82;
}

/* =====================================================
  SECTION TITLE
===================================================== */
.bar-section-title,
.bar-drinks-card__title{
  font-family:var(--fb-en);
  font-size:28px;
  line-height:1.14;
  font-weight:400;
  letter-spacing:.01em; /* ← 締める */
  color:var(--fb-text);
}

/* =====================================================
  HERO TITLE
===================================================== */
.bar-hero__title{
  font-family:var(--fb-en);
  font-size:28px;
  line-height:1.14;
  font-weight:400;
  letter-spacing:.01em; /* ← 同じルール */
  color:var(--fb-text);
}

/* =====================================================
  FOOTER
===================================================== */
.fb-footer{
  background:var(--fb-bg);
  color:var(--fb-muted);
}

.fb-footer__menu a,
.fb-footer__copy{
  font-family:var(--fb-en);
  letter-spacing:.12em; /* ← ナビ系統一 */
}

/* =====================================================
  SELECTION
===================================================== */
::selection{
  background:rgba(122,54,84,.78);
  color:#fff;
}

::-moz-selection{
  background:rgba(122,54,84,.78);
  color:#fff;
}