/* 27.1 — The Winner's Circle resource page. Scoped to .rbp-wc. Navy/gold facelift palette.
   FAQ/tip accordions are native <details>; no page script required. */
.rbp-wc{
  --navy:#15233d; --navy2:#1a2c4a; --gold:#c89a44; --gold-bright:#e3bd6a;
  --line:#e2d8c4; --paper:#faf6ee; --ink:#273043; --muted:#55607a; --light:#eef1f6;
  color:var(--ink);
  font-family:inherit;
  line-height:1.55;
}
.rbp-wc *{ box-sizing:border-box; }
.rbp-wc .wc-wrap{ max-width:960px; margin:0 auto; padding:0 24px; }

/* --- Shared headings / kickers --- */
.rbp-wc .wc-kicker{
  display:inline-block; text-transform:uppercase; letter-spacing:.12em;
  font-size:.74rem; font-weight:800; color:var(--gold); margin-bottom:8px;
}
.rbp-wc h2{
  font-size:clamp(1.6rem,3.2vw,2.2rem); color:var(--navy); line-height:1.15;
  margin:0 0 .5em;
}
.rbp-wc .wc-intro{ color:var(--muted); font-size:1.05rem; max-width:62ch; margin:0 0 1.8em; }

.rbp-wc .wc-section{ padding:64px 0; }
.rbp-wc .wc-section:nth-of-type(even){ background:var(--paper); }

/* --- HERO --- */
.rbp-wc .wc-hero{
  background:linear-gradient(160deg,#15233d 0%,#1a2c4a 60%,#22375c 100%);
  color:#fff; padding:76px 0 64px; text-align:center;
  border-bottom:4px solid var(--gold);
}
.rbp-wc .wc-eyebrow{
  display:inline-block; text-transform:uppercase; letter-spacing:.14em;
  font-size:.76rem; font-weight:700; color:var(--gold-bright); margin-bottom:16px;
}
.rbp-wc .wc-hero h1{
  font-size:clamp(2.2rem,5vw,3.4rem); line-height:1.08; margin:0 0 .35em; color:#fff;
}
.rbp-wc .wc-lede{
  color:#cdd5e4; font-size:1.18rem; max-width:40ch; margin:0 auto 1.8em;
}
.rbp-wc .wc-chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.rbp-wc .wc-chips a{
  display:inline-block; text-decoration:none; color:#eef1f6;
  border:1.5px solid rgba(255,255,255,.35); border-radius:999px;
  padding:.5em 1.1em; font-size:.86rem; font-weight:700; transition:all .15s ease;
}
.rbp-wc .wc-chips a:hover{ background:var(--gold); border-color:var(--gold); color:#0d1626; }

/* --- Buttons --- */
.rbp-wc .wc-btn{
  display:inline-block; text-decoration:none; font-weight:800; font-size:.86rem;
  text-transform:uppercase; letter-spacing:.04em; line-height:1.1;
  padding:.82em 1.5em; border-radius:6px; border:1.5px solid var(--gold); transition:all .15s ease;
}
.rbp-wc .wc-btn.gold{ background:var(--gold); color:#0d1626; }
.rbp-wc .wc-btn.gold:hover{ background:var(--gold-bright); border-color:var(--gold-bright); }
.rbp-wc .wc-btn.ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.rbp-wc .wc-btn.ghost:hover{ border-color:var(--gold-bright); color:var(--gold-bright); }

/* --- ORDERING GUIDE --- */
.rbp-wc .wc-steps{ list-style:none; counter-reset:step; margin:0; padding:0; display:grid; gap:16px; }
.rbp-wc .wc-steps li{
  counter-increment:step; position:relative; background:#fff; border:1px solid var(--line);
  border-radius:12px; padding:22px 24px 22px 76px;
}
.rbp-wc .wc-steps li::before{
  content:counter(step); position:absolute; left:20px; top:20px;
  width:40px; height:40px; border-radius:50%; background:var(--navy); color:var(--gold-bright);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.15rem;
}
.rbp-wc .wc-steps h3{ margin:0 0 .3em; color:var(--navy); font-size:1.12rem; }
.rbp-wc .wc-steps p{ margin:0; color:var(--ink); }
.rbp-wc .wc-steps a{ color:var(--navy); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.rbp-wc .wc-steps a:hover{ color:var(--gold); }
.rbp-wc .wc-guide-cta{ margin-top:28px; }

/* --- VIDEO --- */
.rbp-wc .wc-video-frame{
  position:relative; width:100%; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  background:var(--navy); border:1px solid var(--line); box-shadow:0 12px 34px rgba(21,35,61,.18);
}
.rbp-wc .wc-video-frame iframe,
.rbp-wc .wc-video-frame video{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.rbp-wc .wc-video-poster{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; text-align:center;
  background:
    radial-gradient(circle at 50% 42%, rgba(200,154,68,.18), transparent 60%),
    linear-gradient(160deg,#15233d,#22375c);
}
.rbp-wc .wc-video-poster::before{
  content:""; width:74px; height:74px; border-radius:50%;
  background:var(--gold); position:relative; box-shadow:0 8px 24px rgba(0,0,0,.3);
}
.rbp-wc .wc-video-poster::after{ /* play triangle */
  content:""; position:absolute; top:calc(42% - 11px);
  border-style:solid; border-width:12px 0 12px 20px; border-color:transparent transparent transparent #15233d;
  margin-left:4px;
}
.rbp-wc .wc-video-badge{
  text-transform:uppercase; letter-spacing:.12em; font-size:.74rem; font-weight:800;
  color:#0d1626; background:var(--gold-bright); padding:.35em .9em; border-radius:999px; margin-top:6px;
}
.rbp-wc .wc-video-note{ color:#cdd5e4; font-size:.95rem; }

/* --- COMMON QUESTIONS (accordion) --- */
.rbp-wc .wc-faqs{ list-style:none; margin:0; padding:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; }
.rbp-wc .wc-faqs li + li{ border-top:1px solid var(--line); }
.rbp-wc .wc-faqs summary{
  cursor:pointer; list-style:none; padding:18px 22px; font-weight:700; color:var(--navy);
  font-size:1.04rem; display:flex; align-items:flex-start; gap:12px; transition:background .12s ease;
}
.rbp-wc .wc-faqs summary::-webkit-details-marker{ display:none; }
.rbp-wc .wc-faqs summary::before{
  content:"+"; flex:0 0 auto; color:var(--gold); font-weight:800; font-size:1.3rem; line-height:1; margin-top:-1px;
}
.rbp-wc .wc-faqs details[open] summary::before{ content:"\2212"; }
.rbp-wc .wc-faqs summary:hover{ background:var(--paper); }
.rbp-wc .wc-a{ padding:0 22px 20px 46px; color:var(--ink); }
.rbp-wc .wc-a p{ margin:0 0 .8em; }
.rbp-wc .wc-a a{ color:var(--navy); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.rbp-wc .wc-a a:hover{ color:var(--gold); }

/* status definition list */
.rbp-wc .wc-statuses{ margin:.4em 0 0; display:grid; grid-template-columns:auto 1fr; gap:6px 16px; }
.rbp-wc .wc-statuses dt{ font-weight:800; color:var(--navy); white-space:nowrap; }
.rbp-wc .wc-statuses dd{ margin:0; color:var(--ink); }

/* price tiers */
.rbp-wc .wc-tiers{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:.6em; }
.rbp-wc .wc-tier{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:16px 18px; }
.rbp-wc .wc-tier h4{ margin:0 0 .5em; color:var(--navy); font-size:1rem; }
.rbp-wc .wc-tier h4 span{ color:var(--muted); font-weight:600; font-size:.85rem; }
.rbp-wc .wc-tier ul{ margin:0; padding-left:1.1em; }
.rbp-wc .wc-tier li{ margin:.2em 0; }

/* lead times */
.rbp-wc .wc-leadtimes{ list-style:none; margin:.4em 0 0; padding:0; }
.rbp-wc .wc-leadtimes li{ display:flex; flex-wrap:wrap; gap:4px 10px; padding:8px 0; border-bottom:1px dashed var(--line); }
.rbp-wc .wc-leadtimes li:last-child{ border-bottom:0; }
.rbp-wc .wc-leadtimes span{ font-weight:800; color:var(--navy); min-width:220px; }
.rbp-wc .wc-leadtimes em{ color:var(--muted); font-style:normal; }

/* --- TIPS & IDEAS --- */
.rbp-wc .wc-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.rbp-wc .wc-card{ background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.rbp-wc .wc-card details{ height:100%; }
.rbp-wc .wc-card summary{
  cursor:pointer; list-style:none; padding:22px 22px 20px; display:block; border-top:4px solid var(--gold);
}
.rbp-wc .wc-card summary::-webkit-details-marker{ display:none; }
.rbp-wc .wc-card-tag{
  display:inline-block; text-transform:uppercase; letter-spacing:.1em; font-size:.68rem;
  font-weight:800; color:var(--gold); margin-bottom:10px;
}
.rbp-wc .wc-card-title{ display:block; font-size:1.18rem; font-weight:800; color:var(--navy); line-height:1.2; margin-bottom:8px; }
.rbp-wc .wc-card-teaser{ display:block; color:var(--muted); font-size:.95rem; }
.rbp-wc .wc-card summary::after{
  content:"Read tip +"; display:inline-block; margin-top:14px; color:var(--gold);
  font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.05em;
}
.rbp-wc .wc-card details[open] summary::after{ content:"Close \2212"; }
.rbp-wc .wc-card-body{ padding:0 22px 22px; }
.rbp-wc .wc-card-body p{ margin:0 0 .8em; }

/* --- CTA --- */
.rbp-wc .wc-cta{ background:var(--navy); color:#fff; padding:60px 0; text-align:center; border-top:4px solid var(--gold); }
.rbp-wc .wc-cta h2{ color:#fff; }
.rbp-wc .wc-cta p{ color:#cdd5e4; margin:0 0 1.6em; font-size:1.08rem; }
.rbp-wc .wc-cta-btns{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* --- Responsive --- */
@media(max-width:820px){
  .rbp-wc .wc-cards{ grid-template-columns:1fr; }
  .rbp-wc .wc-tiers{ grid-template-columns:1fr; }
  .rbp-wc .wc-statuses{ grid-template-columns:1fr; gap:2px 0; }
  .rbp-wc .wc-statuses dd{ margin:0 0 10px; }
  .rbp-wc .wc-leadtimes span{ min-width:0; }
}
@media(max-width:600px){
  .rbp-wc .wc-section{ padding:48px 0; }
  .rbp-wc .wc-steps li{ padding:20px 20px 20px 20px; }
  .rbp-wc .wc-steps li::before{ position:static; margin-bottom:12px; }
}
@media(prefers-reduced-motion:reduce){
  .rbp-wc .wc-chips a, .rbp-wc .wc-btn{ transition:none; }
}
