/* ============================================================
   LBF Block Theme - Component Styles
   Design tokens come from theme.json.
   This file handles component layouts theme.json can't express.
   ============================================================ */

/* ── Page Shell ── */
.lbf-page-shell {
  width: min(calc(100% - 32px), 1400px);
  margin: 24px auto;
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(17,71,184,0.08);
  overflow: hidden;
}

/* ── Script Font Utility ── */
.lbf-script { font-family: var(--wp--preset--font-family--script) !important; font-weight: 400; }

/* ── Page Hero ── */
.lbf-page-hero { position:relative; min-height:440px; display:flex; align-items:flex-end; isolation:isolate; overflow:hidden; }
.lbf-page-hero__media { position:absolute; inset:0; z-index:-2; background:right center/cover no-repeat; }
.lbf-page-hero::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 30%,rgba(255,255,255,.55) 55%,rgba(255,255,255,.08) 100%); }
.lbf-page-hero__content { position:relative; z-index:2; max-width:620px; padding:30px var(--wp--custom--pad, 40px) 36px; }
.lbf-page-hero__kicker { font-size:28px; color:var(--wp--preset--color--blue); margin:0; }
.lbf-page-hero__title { font-size:clamp(58px,8vw,96px); color:var(--wp--preset--color--blue-deep); line-height:.9; margin:4px 0 0; }
.lbf-page-hero__subtitle { font-size:clamp(32px,5vw,52px); font-weight:800; color:var(--wp--preset--color--navy); line-height:1; margin:-4px 0 0; }
.lbf-page-hero__tagline { font-size:20px; color:var(--wp--preset--color--text); margin-top:12px; }

/* ── Stats Strip ── */
.lbf-stats-strip { position:relative; margin-top:-40px; z-index:15; padding:0 var(--wp--custom--pad, 40px); }
.lbf-stats-row { display:flex; justify-content:center; gap:34px; background:#fff; border-radius:18px; padding:20px 30px; box-shadow:0 12px 30px rgba(17,71,184,.1); }
.lbf-stat { display:flex; align-items:center; gap:10px; }
.lbf-stat-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:#e8eeff; font-size:22px; }
.lbf-stat strong { font-size:26px; font-weight:800; color:var(--wp--preset--color--navy); line-height:1.1; display:block; }
.lbf-stat span { font-size:14px; color:var(--wp--preset--color--muted); font-weight:500; display:block; }

/* ── Section Heading ── */
.lbf-section-heading { display:flex; align-items:center; gap:18px; margin-bottom:30px; padding-top:40px; }
.lbf-section-heading h2 { font-size:42px; color:var(--wp--preset--color--blue); white-space:nowrap; }
.lbf-rule { flex:1; height:2px; background:var(--wp--preset--color--line); border-radius:1px; }

/* ── Feature Grid ── */
.lbf-feature-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-bottom:34px; }
.lbf-feature-card { position:relative; border-radius:22px; overflow:hidden; min-height:280px; display:flex; flex-direction:column; justify-content:flex-end; transition:transform .2s; text-decoration:none; }
.lbf-feature-card:hover { transform:translateY(-4px); }
.lbf-feature-card__media { position:absolute; inset:0; background:#d0d8ed center/cover no-repeat; }
.lbf-feature-badge { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; color:#fff; z-index:3; }
.lbf-badge--blue { background:var(--wp--preset--color--blue); }
.lbf-badge--purple { background:var(--wp--preset--color--purple); }
.lbf-badge--green { background:var(--wp--preset--color--green); }
.lbf-feature-card__curve { position:relative; z-index:2; padding:16px 14px 14px; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); border-radius:18px 18px 0 0; text-align:center; }
.lbf-feature-label { font-size:18px; }
.lbf-label--blue { color:var(--wp--preset--color--blue); }
.lbf-label--purple { color:var(--wp--preset--color--purple); }
.lbf-label--green { color:var(--wp--preset--color--green); }

/* ── Home Schedule Panel ── */
.lbf-schedule-panel { display:grid; grid-template-columns:1fr 1fr; gap:24px; background:var(--wp--preset--color--navy); border-radius:22px; padding:24px; margin-bottom:30px; color:#fff; }
.lbf-schedule-copy h3 { font-size:28px; font-weight:800; margin-bottom:8px; }
.lbf-schedule-copy p { font-size:18px; opacity:.8; margin-bottom:18px; }
.lbf-schedule-cards { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.lbf-schedule-card { background:rgba(255,255,255,.08); border-radius:16px; padding:14px; min-height:120px; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.lbf-sday { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; opacity:.7; }
.lbf-sdate { font-size:28px; font-weight:800; line-height:1.1; }
.lbf-sinfo { font-size:18px; opacity:.75; line-height:1.3; margin-top:4px; }
.lbf-saccent { position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--wp--preset--color--blue); border-radius:0 0 16px 16px; }

/* ── Schedule Page ── */
.lbf-schedule-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; background:#f0f3f9; border-radius:22px; padding:8px; margin-bottom:24px; }
.lbf-schedule-tab { display:flex; align-items:center; justify-content:center; gap:8px; min-height:56px; border-radius:16px; font-weight:700; font-size:20px; color:var(--wp--preset--color--muted); cursor:pointer; transition:all .2s; }
.lbf-schedule-tab span { font-weight:500; font-size:16px; }
.lbf-schedule-tab.is-active { background:var(--wp--preset--color--blue); color:#fff; box-shadow:0 8px 20px rgba(30,86,201,.25); }
.lbf-schedule-filters { display:flex; gap:10px; margin-bottom:24px; overflow-x:auto; }
.lbf-chip { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 18px; border-radius:999px; border:2px solid var(--wp--preset--color--line); font-size:15px; font-weight:600; color:var(--wp--preset--color--muted); white-space:nowrap; cursor:pointer; transition:all .2s; }
.lbf-chip.is-active { background:var(--wp--preset--color--blue); color:#fff; border-color:var(--wp--preset--color--blue); }
.lbf-timeline-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.lbf-timeline-head h3 { font-size:32px; color:var(--wp--preset--color--blue); }
.lbf-day-pill { background:var(--wp--preset--color--blue); color:#fff; padding:8px 18px; border-radius:999px; font-weight:700; font-size:15px; }
.lbf-timeline { display:flex; flex-direction:column; gap:12px; }
.lbf-timeline-row { display:grid; grid-template-columns:100px 1fr; gap:14px; align-items:center; padding:14px; background:#f8fafd; border-radius:14px; }
.lbf-timeline-time { font-size:18px; font-weight:700; color:var(--wp--preset--color--navy); }
.lbf-timeline-event { display:flex; align-items:center; gap:12px; }
.lbf-timeline-icon { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; background:var(--wp--preset--color--blue); color:#fff; flex-shrink:0; }
.lbf-timeline-copy { font-size:17px; font-weight:600; color:var(--wp--preset--color--navy); }
.lbf-stage { font-weight:400; color:var(--wp--preset--color--muted); font-size:15px; }

/* ── Entertainer Grid ── */
.lbf-ent-grid { display:grid; gap:18px; margin-bottom:34px; }
.lbf-cols-2 { grid-template-columns:repeat(2,1fr); }
.lbf-cols-3 { grid-template-columns:repeat(3,1fr); }
.lbf-cols-4 { grid-template-columns:repeat(4,1fr); }
.lbf-cols-5 { grid-template-columns:repeat(5,1fr); }
.lbf-cols-6 { grid-template-columns:repeat(6,1fr); }
.lbf-ent-card { border-radius:22px; overflow:hidden; display:block; transition:transform .2s; text-decoration:none; background:#fff; box-shadow:0 12px 30px rgba(17,71,184,.1); }
.lbf-ent-card:hover { transform:translateY(-4px); }
.lbf-ent-card__media { height:200px; background:center/cover no-repeat; }
.lbf-ent-card__body { padding:14px; text-align:center; }
.lbf-ent-card__title { font-size:16px; font-weight:700; color:var(--wp--preset--color--navy); margin:0; }

/* ── Sponsor Grid ── */
.lbf-sponsors-row { display:flex; align-items:center; justify-content:center; gap:34px; padding:24px; background:#f7f9fc; border-radius:16px; flex-wrap:wrap; margin-bottom:20px; }
.lbf-sponsors-row img { max-height:44px; filter:grayscale(100%); opacity:.6; transition:all .2s; }
.lbf-sponsors-row img:hover { filter:none; opacity:1; }
.lbf-sponsor-tier { margin-bottom:32px; }
.lbf-sponsor-tier__heading { font-size:28px; color:var(--wp--preset--color--blue); margin-bottom:16px; padding-bottom:8px; border-bottom:2px solid var(--wp--preset--color--line); }
.lbf-sponsor-logo-grid { display:grid; gap:18px; }
.lbf-sponsor-logo-card { background:#f8fafd; border-radius:16px; padding:24px; display:flex; align-items:center; justify-content:center; min-height:100px; transition:transform .2s,box-shadow .2s; }
.lbf-sponsor-logo-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(17,71,184,.1); }
.lbf-sponsor-logo-card img { max-height:80px; max-width:100%; }

/* ── Pageant Categories ── */
.lbf-pageant-cats { display:grid; gap:18px; margin-bottom:34px; }
.lbf-pageant-cat-card { background:#f8fafd; border-radius:22px; padding:28px 22px; text-align:center; border:2px solid var(--wp--preset--color--line); transition:transform .2s; }
.lbf-pageant-cat-card:hover { transform:translateY(-3px); }
.lbf-pageant-cat-icon { font-size:42px; margin-bottom:12px; }
.lbf-pageant-cat-card h3 { font-size:20px; font-weight:700; color:var(--wp--preset--color--navy); margin:0 0 6px; }
.lbf-pageant-cat-card p { font-size:15px; color:var(--wp--preset--color--muted); margin:0 0 10px; }
.lbf-fee-badge { display:inline-block; padding:6px 16px; border-radius:999px; font-size:14px; font-weight:700; color:#fff; }

/* ── CTA Banner ── */
.lbf-cta-banner { position:relative; border-radius:22px; overflow:hidden; margin:0 var(--wp--custom--pad, 40px) 30px; min-height:220px; display:flex; align-items:flex-end; }
.lbf-cta-banner::before { content:''; position:absolute; inset:0; }
.lbf-cta--navy { background:var(--wp--preset--color--navy); }
.lbf-cta--navy::before { background:linear-gradient(180deg,rgba(20,33,61,.05) 0%,rgba(20,33,61,.85) 100%); }
.lbf-cta--green { background:linear-gradient(135deg,#065f46,#059669); }
.lbf-cta-banner__inner { position:relative; z-index:2; padding:24px 28px 30px; color:#fff; }
.lbf-cta-banner__inner h3 { font-size:30px; margin:0 0 8px; }
.lbf-cta-banner__inner p { font-size:17px; opacity:.9; max-width:480px; margin:0 0 16px; }
.lbf-btn--green { background:var(--wp--preset--color--green) !important; }

/* ── Green button variant ── */
.wp-element-button.lbf-btn--green,
.wp-block-button__link.lbf-btn--green {
  background: var(--wp--preset--color--green) !important;
  box-shadow: 0 8px 20px rgba(78,164,81,.25);
}

/* ── Muted text utility ── */
.lbf-muted { color: var(--wp--preset--color--muted); font-size: 15px; text-align: center; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1100px) {
  .lbf-feature-grid { grid-template-columns:repeat(3,1fr); }
  .lbf-cols-4 { grid-template-columns:repeat(3,1fr); }
}

@media (max-width:767px) {
  .lbf-page-shell { width:calc(100% - 12px); margin:10px auto; border-radius:18px; }
  .lbf-page-hero { min-height:380px; }
  .lbf-page-hero__title { font-size:58px; }
  .lbf-page-hero__subtitle { font-size:38px; }
  .lbf-stats-row { flex-wrap:wrap; gap:16px; padding:16px; }
  .lbf-stat { min-width:calc(50% - 12px); }
  .lbf-feature-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .lbf-feature-card { min-height:200px; }
  .lbf-section-heading h2 { font-size:28px; }
  .lbf-schedule-panel { grid-template-columns:1fr; padding:16px; gap:16px; }
  .lbf-schedule-cards { grid-template-columns:repeat(2,1fr); gap:10px; }
  .lbf-schedule-tabs { grid-template-columns:repeat(2,1fr); gap:8px; }
  .lbf-cols-3,.lbf-cols-4,.lbf-cols-5 { grid-template-columns:repeat(2,1fr); }
  .lbf-cols-6 { grid-template-columns:repeat(3,1fr); }
  .lbf-ent-card__media { height:128px; }
  .lbf-timeline-row { grid-template-columns:1fr; gap:6px; }
  .lbf-cta-banner { margin:0 16px 30px; min-height:180px; }
  .lbf-sponsors-row { gap:18px; }
  .lbf-sponsors-row img { max-height:30px; }
}