/* ==========================================================================
   Piers & Beers — event flow styles (landing, register, waiver, pay, list).
   Loads after pool.css (shared tokens, fonts, masthead, footer, forms).
   ========================================================================== */

/* Event pages use the slightly tighter 24px section h2 from the design. */
.pb h2 { font-size:24px; }

/* --- Event hero (landing) --------------------------------------------------
   three-piers.jpg at its full natural aspect — never cropped. */
.pb-hero {
    position:relative;
    width:100%;
    background:var(--hero-navy);
    overflow:hidden;
}
.pb-hero img { display:block; width:100%; height:auto; }
.pb-hero__overlay {
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,
        rgba(8,26,43,0.55) 0%,
        rgba(8,26,43,0.05) 34%,
        rgba(8,26,43,0.08) 55%,
        rgba(8,26,43,0.8) 100%);
}
.pb-hero__content {
    position:absolute;
    inset:0;
    max-width:1100px;
    margin:0 auto;
    padding:0 var(--pad-x);
}
.pb-hero__crumb {
    position:absolute;
    top:20px;
    left:var(--pad-x);
    right:var(--pad-x);
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:0.06em;
    color:rgba(255,255,255,0.82);
}
.pb-hero__crumb a { color:inherit; opacity:0.7; text-decoration:none; }
.pb-hero__crumb a:hover { opacity:1; }
.pb-hero__title {
    position:absolute;
    left:var(--pad-x);
    right:var(--pad-x);
    bottom:34px;
}
.pb-hero__eyebrow {
    font-family:var(--mono);
    font-size:11px;
    font-weight:500;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--sky);
}
.pb-hero__title h1 {
    font-size:40px;
    font-weight:800;
    letter-spacing:-0.03em;
    line-height:1.05;
    color:#fff;
    margin:10px 0 0;
    text-shadow:0 2px 20px rgba(8,26,43,0.5);
}

/* --- Event meta strip ------------------------------------------------------ */
.pb-meta { background:var(--brand-deep); color:#fff; }
.pb-meta__inner {
    display:flex;
    max-width:1100px;
    margin:0 auto;
}
.pb-meta__cell { flex:1; padding:16px 22px; }
.pb-meta__cell + .pb-meta__cell { border-left:1px solid rgba(255,255,255,0.14); }
.pb-meta__label {
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--sky);
}
.pb-meta__value { font-size:15px; font-weight:600; margin-top:4px; }

/* --- Landing body layout ---------------------------------------------------- */
.pb-body {
    display:flex;
    gap:44px;
    align-items:flex-start;
    padding:44px var(--pad-x) 40px;
}
.pb-body__main { flex:1.25; min-width:0; }
.pb-body__side { flex:1; min-width:0; }

/* --- Registration / pricing card -------------------------------------------- */
.pb-reg {
    border:1px solid var(--border);
    border-radius:16px;
    overflow:hidden;
    margin-bottom:34px;
}
.pb-reg__head { padding:22px 26px 6px; }
.pb-reg__head h3 { font-size:20px; margin:6px 0 2px; }
.pb-reg__tiers { padding:8px 26px 4px; }
.pb-tier {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:11px 16px;
}
.pb-tier + .pb-tier--quiet { border-top:1px solid #f0f2f5; }
.pb-tier--active {
    padding:14px 16px;
    background:var(--tint);
    border:1px solid var(--tint-border);
    border-radius:11px;
    margin-bottom:8px;
}
.pb-tier--active + .pb-tier--quiet { border-top:none; }
.pb-tier__name { font-size:14px; color:var(--muted); }
.pb-tier--active .pb-tier__name { font-size:15px; font-weight:600; color:var(--brand-deep); }
.pb-tier__desc { font-size:13px; color:var(--muted); }
.pb-tier__price { font-family:var(--mono); font-size:15px; color:var(--faint); white-space:nowrap; }
.pb-tier--active .pb-tier__price { font-size:20px; font-weight:500; color:var(--brand-deep); }
.pb-reg__foot { padding:16px 26px 24px; }
.pb-reg__spots { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.pb-reg__note { font-size:13px; line-height:1.55; color:var(--muted); margin:14px 0 0; }
.pb-soldout {
    background:var(--tint);
    border:1px solid var(--tint-border);
    border-radius:11px;
    padding:14px 16px;
    font-size:14px;
    line-height:1.6;
    color:var(--brand-deep);
}

/* --- Day-of timeline --------------------------------------------------------- */
.pb-intro { font-size:14.5px; line-height:1.6; color:var(--body); margin-bottom:20px; }
.pb-timeline { display:flex; flex-direction:column; }
.pb-stop { display:flex; gap:16px; align-items:flex-start; padding-bottom:16px; }
.pb-stop:last-child { padding-bottom:0; }
.pb-stop__badge {
    flex:0 0 auto;
    width:27px;
    height:27px;
    border-radius:50%;
    background:var(--hero-navy);
    color:#fff;
    font-family:var(--mono);
    font-size:12px;
    font-weight:500;
    display:flex;
    align-items:center;
    justify-content:center;
}
.pb-stop--final .pb-stop__badge { background:var(--brand-blue); }
.pb-stop__text { font-size:14.5px; line-height:1.5; color:var(--body); padding-top:3px; }
.pb-stop__text strong { color:var(--ink); font-weight:600; }
.pb-infocards { display:flex; gap:16px; margin-top:26px; }
.pb-infocards .hp-quiet { flex:1; }

/* --- FAQs ---------------------------------------------------------------------- */
.pb-faq { padding:18px 0; border-top:1px solid var(--border); }
.pb-faq:last-child { border-bottom:1px solid var(--border); }
.pb-faq__q { font-size:15px; font-weight:600; color:var(--ink); margin-bottom:6px; }
.pb-faq__a { font-size:14px; line-height:1.6; color:var(--body); }

/* --- Focused single-column pages (register / waiver / pay) ---------------------- */
.pb-page {
    max-width:660px;
    margin:0 auto;
    padding:40px 24px 44px;
}
.pb-field { margin-bottom:18px; }
.pb-form-note {
    font-size:13px;
    line-height:1.55;
    color:var(--muted);
    margin:14px 0 0;
    text-align:center;
}
.pb-form-note--faint { font-size:12.5px; color:var(--faint); margin-top:12px; }

/* --- Waiver page ------------------------------------------------------------------ */
.pb-legal { font-size:14px; line-height:1.7; color:var(--body); }
.pb-legal p { margin:0 0 12px; }
.pb-legal p:last-child { margin-bottom:0; }
.pb-sign { display:flex; gap:16px; margin-top:26px; align-items:flex-start; }
.pb-sign__field { flex:1; min-width:0; }
/* Typed signature reads as a signature: serif italic, larger */
.pb-sign__field .form-control {
    font-family:var(--serif);
    font-style:italic;
    font-size:20px;
}
.pb-sign__date { width:180px; flex:0 0 auto; }
.pb-date {
    border:1px solid var(--border);
    border-radius:10px;
    padding:14px;
    font-family:var(--mono);
    font-size:14px;
    color:var(--muted);
    background:var(--panel);
}
.pb-sign-note { font-size:12.5px; line-height:1.5; color:var(--faint); margin:8px 0 0; }
.pb-agree { margin:22px 0 24px; }
.pb-agree .form-check-label { font-size:14px; }

/* --- Pay page ----------------------------------------------------------------------- */
.pb-banner {
    background:var(--hero-navy);
    padding:34px var(--pad-x);
    text-align:center;
    color:#fff;
}
.pb-banner__check {
    width:54px;
    height:54px;
    border-radius:50%;
    background:rgba(107,181,236,0.2);
    border:1.5px solid #6bb5ec;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 16px;
    color:var(--sky);
    font-size:24px;
}
.pb-banner h1 { font-size:25px; color:#fff; margin:0 0 6px; }
.pb-banner__sub { font-size:14.5px; color:rgba(255,255,255,0.78); }
.pb-total {
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:var(--tint);
    border:1px solid var(--tint-border);
    border-radius:12px;
    padding:18px 22px;
    margin-bottom:24px;
}
.pb-total__label {
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--brand-blue);
}
.pb-total__desc { font-size:13px; color:var(--muted); margin-top:2px; }
.pb-total__amount { font-family:var(--mono); font-size:30px; font-weight:500; color:var(--brand-deep); padding-left:18px; flex-shrink:0; }
.pb-pay-how { display:flex; gap:22px; align-items:center; }
.pb-pay-how img {
    width:140px;
    height:auto;
    border-radius:12px;
    border:1px solid var(--border);
    flex:0 0 auto;
}
.pb-pay-how__text { flex:1; min-width:0; font-size:14.5px; line-height:1.6; color:var(--body); }
.pb-pay-how__text a { font-weight:600; }
.pb-pay-how__cash { font-size:13.5px; line-height:1.55; color:var(--muted); margin-top:10px; }
.pb-pay-eyebrow { margin-bottom:12px; }
.pb-deadline { margin-top:24px; }

/* --- RSVP list (internal) -------------------------------------------------------------- */
.pb-list-page { max-width:660px; margin:0 auto; padding:34px 24px 36px; }
.pb-list-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:22px;
}
.pb-list-head h1 { font-size:24px; margin:6px 0 0; }
.pb-stats { display:flex; gap:10px; }
.pb-stat { text-align:right; }
.pb-stat__value { font-family:var(--mono); font-size:19px; font-weight:500; color:var(--ink); }
.pb-stat__value--money { color:var(--brand-deep); }
.pb-stat__label { font-size:11px; color:var(--muted); letter-spacing:0.03em; }
.pb-stats__divider { width:1px; background:var(--border); }
.pb-roster {
    border:1px solid var(--border);
    border-radius:12px;
    overflow:hidden;
}
.pb-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:13px 18px;
}
.pb-row + .pb-row { border-top:1px solid #f0f2f5; }
.pb-row--unpaid { background:#fffdf8; }
.pb-row__name { font-size:14.5px; font-weight:500; color:var(--ink); }
.pb-row__meta { display:flex; align-items:center; gap:12px; }
.pb-row__waiver {
    font-family:var(--mono);
    font-size:11px;
    color:var(--muted);
    white-space:nowrap;
}
.pb-row__mark {
    font-family:var(--mono);
    font-size:12px;
    font-weight:500;
    color:var(--brand-blue);
    text-decoration:none;
    white-space:nowrap;
}
.pb-row__mark:hover { text-decoration:underline; text-underline-offset:2px; }
.pb-list-empty { font-size:14px; color:var(--muted); padding:18px; }

/* --- Responsive -------------------------------------------------------------------------- */
@media (max-width:760px) {
    .pb-hero__title h1 { font-size:28px; }
    .pb-hero__title { bottom:22px; }
    .pb-meta__inner { flex-wrap:wrap; }
    .pb-meta__cell { flex:1 1 50%; }
    .pb-meta__cell + .pb-meta__cell { border-left:none; }
    .pb-meta__cell:nth-child(even) { border-left:1px solid rgba(255,255,255,0.14); }
    .pb-meta__cell:nth-child(n+3) { border-top:1px solid rgba(255,255,255,0.14); }
    .pb-body { flex-direction:column; gap:34px; }
    .pb-body__main, .pb-body__side { flex:1 1 auto; width:100%; }
    .pb-infocards { flex-direction:column; }
    .pb-sign { flex-direction:column; gap:14px; }
    .pb-sign__date { width:100%; }
    .pb-pay-how { flex-direction:column; align-items:flex-start; }
    .pb-list-head { flex-direction:column; align-items:flex-start; }
    .pb-stat { text-align:left; }
}