/* Chand's Grand Opening recap on reforgedhq.com (Pixel 10/30): the FFN replay's forge skin of recap.css (replay_rhq.py),
   then Chand's additions (chand.css) in the same skin. rhq.css loads first. Built by build.py, do not hand-edit. */
/* ReforgedHQ skin for the moved replay (Pixel 10/25): recap.css from the live readcharming.com build with the gold
   mapped to ember, the navy to forge charcoal, and the type to Space Grotesk and IBM Plex Mono. rhq.css loads first. */
:root {
  --bg: #0B0B0B; --bg-2: #0F0F0F; --bg-elevated: #141414; --card: #161616; --border: #2C2C2C;
  --muted: #8f8a84; --body: #c9c4bd; --navy: #121212; --navy-2: #0d0d0d; --navy-card: rgba(255,255,255,0.035); --navy-line: #2C2C2C; --cream: #f4f1ec; --gold: #ff6b35; --gold-hover: #ff9a5c; --gold-glow: rgba(255,107,53,0.38);
  --navy-deep: #080808; --ivory: #f2efea; --ivory-2: #e8e3dc; --ink: #1a1a1a; --ink-2: #4a4642;
  --rc-serif: "Space Grotesk", system-ui, sans-serif; --rc-sans: "IBM Plex Mono", ui-monospace, Consolas, monospace;
  --foil: linear-gradient(95deg, #ffb21e 0%, #ff8a2a 30%, #ff6b35 55%, #d43b1a 100%);
}
:where(main.rc) a { color: var(--gold); text-decoration: none; transition: color 0.2s; }
main.rc em { font-style: normal; }
.rc-fine { margin-top: 12px; }

main.rc { font-family: var(--rc-sans); color: var(--body); }
main.rc h1, main.rc h2, main.rc h3 { font-family: var(--rc-serif); font-style: normal; font-weight: 700; letter-spacing: -0.025em; }
main.rc h2 { font-size: clamp(2.2rem, 3.6vw, 3.4rem); line-height: 1.06; margin-bottom: 14px; }
main.rc h2 em { color: var(--gold-hover); }
.rc-wrap { padding: 0 max(20px, 3%); }
.rc-label { font-family: var(--rc-sans); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
.rc-foil { background: var(--foil); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: rc-shine 9s ease-in-out infinite alternate; }
@keyframes rc-shine { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
section[id] { scroll-margin-top: 90px; }
.rc-sec { position: relative; padding: 84px 0; }
.rc-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 10px 28px; margin-bottom: 34px; }
.rc-head p { font-size: 1.04rem; line-height: 1.6; max-width: 560px; }

/* buttons */
main.rc .btn, .rc-share-wrap .btn { font-family: var(--rc-sans); font-weight: 600; }
.rc-btn-share { display: inline-flex; align-items: center; gap: 9px; background: rgba(11,11,11,0.4); color: var(--cream); border: 1px solid rgba(255,107,53,0.55); }
.rc-btn-share:hover { border-color: var(--gold-hover); color: var(--gold-hover); transform: translateY(-2px); }
.rc-btn-share svg, .rc-share svg { width: 17px; height: 17px; flex-shrink: 0; }
.rc-share { display: inline-flex; align-items: center; gap: 7px; font-family: var(--rc-sans); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold-hover); background: transparent; border: 1px solid rgba(255,107,53,0.45); border-radius: 100px; padding: 8px 14px; cursor: pointer; transition: background .25s, border-color .25s, transform .25s; }
.rc-share:hover { background: rgba(255,107,53,0.12); border-color: var(--gold-hover); transform: translateY(-1px); }
.rc-light .rc-share { color: #8f2e0a; border-color: rgba(181,58,12,0.45); }
.rc-light .rc-share:hover { background: rgba(255,107,53,0.16); border-color: #b53a0c; }

/* share menu */
.rc-share-wrap { position: relative; display: inline-block; }
/* The menu is moved to <body> and placed by recap.js, so overflow:hidden on the hero or a card can't clip it (Charming 10/24). */
.rc-menu { position: absolute; z-index: 90; top: 0; left: 0; min-width: 228px; padding: 8px; border-radius: 12px; background: #161616; border: 1px solid rgba(255,107,53,0.45); box-shadow: 0 30px 60px -20px rgba(0,0,0,0.8); text-align: left; }
.rc-menu[hidden] { display: none; }
.rc-menu a, .rc-menu button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 12px; border: 0; border-radius: 8px; background: transparent; color: var(--cream); font: 500 0.95rem var(--rc-sans); text-decoration: none; cursor: pointer; text-transform: none; letter-spacing: 0; }
.rc-menu a:hover, .rc-menu button:hover, .rc-menu a:focus-visible, .rc-menu button:focus-visible { background: rgba(255,107,53,0.14); color: var(--gold-hover); outline: none; }
.rc-menu svg { width: 18px; height: 18px; color: var(--gold); flex-shrink: 0; }
@media (max-width: 560px) {
  .rc-menu { position: fixed; left: 12px; right: 12px; top: auto; bottom: 12px; min-width: 0; padding: 10px; }
  .rc-menu a, .rc-menu button { padding: 14px; font-size: 1rem; }
}
.rc-toast { position: fixed; z-index: 80; left: 50%; bottom: 28px; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; padding: 12px 20px; border-radius: 100px; background: var(--gold); color: var(--ink); font: 600 0.92rem var(--rc-sans); box-shadow: 0 16px 40px -12px rgba(0,0,0,0.7); transition: opacity .25s, transform .25s; }
.rc-toast.on { opacity: 1; transform: translate(-50%, 0); }

/* video players: poster + gold play button until the viewer presses play */
.rc-player { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #050505; border: 1px solid rgba(255,107,53,0.3); box-shadow: 0 40px 80px -40px rgba(0,0,0,0.9); }
.rc-player video { display: block; width: 100%; height: 100%; object-fit: contain; background: #050505; }
.rc-player.pre video::-webkit-media-controls { display: none !important; }
.rc-play { position: absolute; inset: 0; display: grid; place-items: center; border: 0; padding: 0; cursor: pointer; background: linear-gradient(180deg, rgba(8,8,8,0) 55%, rgba(8,8,8,0.55)); }
.rc-play span { display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: rgba(11,11,11,0.66); border: 2px solid var(--gold-hover); box-shadow: 0 0 0 0 rgba(255,154,92,0.5); transition: transform .3s ease, background .3s ease; animation: rc-pulse 2.8s ease-out infinite; }
.rc-play svg { width: 26px; height: 26px; margin-left: 4px; color: var(--gold-hover); }
.rc-play:hover span, .rc-play:focus-visible span { transform: scale(1.08); background: rgba(11,11,11,0.85); }
.rc-play em { position: absolute; right: 14px; bottom: 12px; font: 600 0.78rem var(--rc-sans); font-style: normal; letter-spacing: 0.06em; color: var(--cream); background: rgba(8,8,8,0.7); padding: 4px 9px; border-radius: 6px; }
@keyframes rc-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,154,92,0.45); } 70%, 100% { box-shadow: 0 0 0 18px rgba(255,154,92,0); } }
.rc-player.on .rc-play { display: none; }
.rc-replay .rc-play em { display: none; }
.rc-player-lg .rc-play span { width: 96px; height: 96px; }
.rc-player-lg .rc-play svg { width: 34px; height: 34px; }

/* HERO */
.rc-hero { position: relative; overflow: hidden; padding: calc(var(--hdr) + 56px) 0 0; background: radial-gradient(ellipse 70% 80% at 72% 10%, rgba(255,107,53,0.16), transparent 62%), linear-gradient(180deg, #141414 0%, var(--bg) 100%); }
.rc-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,107,53,0.6), transparent); }
.rc-glow { position: absolute; width: 640px; height: 640px; right: 6%; top: -180px; border-radius: 50%; background: radial-gradient(circle, rgba(255,154,92,0.16), transparent 64%); pointer-events: none; animation: rc-drift 14s ease-in-out infinite alternate; }
@keyframes rc-drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(-90px, 60px) scale(1.15); } }
.rc-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr); gap: 20px 40px; align-items: end; }
.rc-hero-copy { padding-bottom: 76px; }
.rc-hero h1 { font-size: clamp(3rem, 6.4vw, 6.2rem); line-height: 0.98; margin: 0 0 14px; }
.rc-theme { font-family: var(--rc-serif); font-style: normal; font-size: clamp(1.5rem, 2.4vw, 2.2rem); color: var(--cream); margin-bottom: 10px; }
.rc-theme span { color: var(--gold); }
.rc-date { display: inline-flex; align-items: center; gap: 10px; font-size: 1.02rem; font-weight: 600; letter-spacing: 0.04em; color: var(--cream); margin-bottom: 18px; }
.rc-date svg { width: 18px; height: 18px; color: var(--gold); }
.rc-with { font-size: 1.04rem; line-height: 1.6; max-width: 560px; margin-bottom: 28px; }
.rc-with strong { color: var(--cream); font-weight: 600; }
.rc-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.rc-jump { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; color: var(--gold-hover); font-weight: 600; font-size: 0.98rem; }
.rc-jump svg { width: 20px; height: 20px; transition: transform .3s; }
.rc-jump:hover svg { transform: translateY(3px); }
.rc-hero-side { display: flex; flex-direction: column; align-items: stretch; gap: 26px; min-width: 0; }
.rc-hero-quote { position: relative; align-self: flex-end; width: min(100%, 660px); margin-right: 3%; padding: 46px 36px 26px; border-radius: 18px; border: 1px solid rgba(255,107,53,0.4); background: linear-gradient(160deg, rgba(36,24,18,0.9), rgba(18,18,18,0.92)); box-shadow: 0 40px 80px -40px rgba(0,0,0,0.95); opacity: 0; transform: translateY(24px); animation: rc-rise 1s cubic-bezier(.2,.7,.2,1) .1s forwards; }

.rc-hero-quote::before { content: "“"; position: absolute; left: 30px; top: -30px; font-family: var(--rc-serif); font-size: 6.5rem; line-height: 1; background: var(--foil); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* rotating quotes (Charming 10/24): all slides share one grid cell, so the card holds the tallest one's height and never jumps */
.rc-hq-slides { display: grid; }
.rc-hq-slide { grid-area: 1 / 1; display: flex; flex-direction: column; margin: 0; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .7s ease, transform .7s ease, visibility 0s linear .7s; }
.rc-hq-slide.on { opacity: 1; visibility: visible; transform: none; transition-delay: .25s, .25s, 0s; }
.rc-hero-quote blockquote { flex: 1; display: flex; align-items: center; margin: 0; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: clamp(1.45rem, 1.9vw, 1.95rem); line-height: 1.3; color: var(--cream); }
.rc-hero-quote figcaption { display: flex; align-items: center; gap: 14px; margin-top: 20px; font-size: 0.9rem; color: var(--body); }
.rc-hq-av { flex-shrink: 0; width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: #2A2A2A; border: 1px solid rgba(255,107,53,0.5); }
.rc-hq-av img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; transform: scale(1.7); transform-origin: 50% 22%; }
.rc-hero-quote figcaption strong { display: block; color: var(--cream); font-weight: 600; font-size: 1rem; }
.rc-hq-nav { display: flex; align-items: center; gap: 14px; margin-top: 22px; }
.rc-hq-dots { display: flex; flex-wrap: wrap; gap: 4px; }
.rc-hq-dots button { position: relative; width: 26px; height: 26px; padding: 0; border: 0; background: none; cursor: pointer; }
.rc-hq-dots button::before { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 4px; background: rgba(255,107,53,0.35); overflow: hidden; transition: width .4s, margin .4s, background .3s; }
.rc-hq-dots button:hover::before { background: rgba(255,107,53,0.7); }
.rc-hq-dots button[aria-current]::before { width: 24px; margin-left: -12px; background: rgba(255,107,53,0.35); }
.rc-hq-dots button::after { content: ""; position: absolute; left: 50%; top: 50%; width: 24px; height: 8px; margin: -4px 0 0 -12px; border-radius: 4px; background: var(--gold); transform: scaleX(0); transform-origin: left; opacity: 0; }
.rc-hq-dots button[aria-current]::after { opacity: 1; transform: scaleX(1); }
.rc-hero-quote.run .rc-hq-dots button[aria-current]::after { transform: scaleX(0); animation: rc-hq-fill var(--ms, 7000ms) linear forwards; }
.rc-hero-quote.held .rc-hq-dots button[aria-current]::after { animation-play-state: paused; }
@keyframes rc-hq-fill { to { transform: scaleX(1); } }
.rc-hq-pause { flex-shrink: 0; width: 34px; height: 34px; display: grid; place-items: center; padding: 0; border-radius: 50%; border: 1px solid rgba(255,107,53,0.45); background: transparent; color: var(--gold-hover); cursor: pointer; transition: background .3s; }
.rc-hq-pause[hidden] { display: none; }
.rc-hq-pause:hover { background: rgba(255,107,53,0.14); }
.rc-hq-pause svg { width: 13px; height: 13px; }
.rc-hq-pause svg + svg, .rc-hq-pause[aria-pressed="true"] svg:first-child { display: none; }
.rc-hq-pause[aria-pressed="true"] svg + svg { display: block; margin-left: 2px; }
.rc-hero-play { display: flex; align-items: center; gap: 16px; margin-top: 18px; padding-top: 20px; border-top: 1px solid rgba(255,107,53,0.25); color: var(--cream); }
.rc-hero-play-btn { flex-shrink: 0; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: var(--gold); color: var(--ink); box-shadow: 0 10px 28px -8px rgba(255,107,53,0.7); transition: transform .3s, background .3s; }
.rc-hero-play-btn svg { width: 22px; height: 22px; margin-left: 3px; }
.rc-hero-play strong { display: block; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.45rem; line-height: 1.2; }
.rc-hero-play strong + span { font-size: 0.88rem; font-weight: 600; color: var(--gold-hover); }
.rc-hero-play:hover .rc-hero-play-btn { transform: scale(1.08); background: var(--gold-hover); }
.rc-heads { position: relative; display: flex; justify-content: center; align-items: flex-end; min-width: 0; }
.rc-head-fig { position: relative; margin: 0 -8%; flex: 0 1 41%; opacity: 0; transform: translateY(40px); animation: rc-rise 1s cubic-bezier(.2,.7,.2,1) forwards; }
.rc-head-fig img { display: block; width: 100%; height: auto; }
.rc-head-fig figcaption { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); white-space: nowrap; padding: 6px 12px; border-radius: 100px; background: rgba(11,11,11,0.82); border: 1px solid rgba(255,107,53,0.45); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.04em; color: var(--cream); }
.rc-head-fig:nth-child(1) { z-index: 5; animation-delay: .15s; }
.rc-head-fig:nth-child(2) { z-index: 4; animation-delay: .3s; }
.rc-head-fig:nth-child(3) { z-index: 3; animation-delay: .45s; }   /* Charming 10/24: Deb in front of Anishia, Anishia in front of Lindsy only */
.rc-head-fig:nth-child(4) { z-index: 2; animation-delay: .6s; }
.rc-head-fig:nth-child(even) figcaption { bottom: 52px; }
@keyframes rc-rise { to { opacity: 1; transform: none; } }

/* FULL RECORDING */
.rc-replay { background: linear-gradient(180deg, var(--bg) 0%, var(--navy-deep) 100%); }
.rc-replay-grid { display: grid; grid-template-columns: minmax(0, 2.15fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.rc-chapters { list-style: none; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: rgba(26,26,26,0.55); }
.rc-chapters-head { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--border); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold); }
.rc-chapters-head span { color: var(--muted); letter-spacing: 0.08em; }
.rc-chap { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: start; width: 100%; padding: 15px 20px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--body); text-align: left; font: 500 1rem/1.4 var(--rc-sans); cursor: pointer; transition: background .25s, color .25s; }
.rc-chapters li:last-child .rc-chap { border-bottom: 0; }
.rc-chap:hover, .rc-chap:focus-visible { background: rgba(255,107,53,0.08); color: var(--cream); outline: none; }
.rc-chap b { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--gold-hover); }
.rc-chap::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--gold); transform: scaleY(0); transition: transform .3s; }
.rc-chap::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: calc(var(--p, 0) * 100%); background: rgba(255,154,92,0.7); }
.rc-chap.on { background: rgba(255,107,53,0.12); color: var(--cream); }
.rc-chap.on::before { transform: scaleY(1); }

/* HIGHLIGHTS: uneven bento */
.rc-highlights { background: radial-gradient(ellipse 50% 60% at 0% 100%, rgba(255,107,53,0.1), transparent 70%), var(--bg); }
.rc-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.rc-clip { display: flex; flex-direction: column; min-width: 0; border-radius: 16px; background: linear-gradient(165deg, var(--card), var(--bg-2)); border: 1px solid var(--border); padding: 12px 12px 18px; transition: border-color .3s, transform .3s, box-shadow .3s; scroll-margin-top: 90px; }
.rc-clip:hover { border-color: rgba(255,107,53,0.55); transform: translateY(-3px); box-shadow: 0 30px 60px -36px rgba(0,0,0,0.9); }
.rc-clip:target { border-color: var(--gold); }
.rc-clip .rc-player { border-radius: 10px; box-shadow: none; }
.rc-clip-body { padding: 16px 8px 0; display: flex; flex-direction: column; flex: 1; }
.rc-who { font-size: 0.74rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.rc-clip h3 { font-size: 1.5rem; line-height: 1.15; color: var(--cream); margin-bottom: 16px; }
.rc-clip-foot { margin-top: auto; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.rc-dur { font-size: 0.85rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.rc-clip.big { grid-column: span 2; grid-row: span 2; padding: 16px 16px 24px; }
.rc-clip.big h3 { font-size: clamp(1.9rem, 2.6vw, 2.5rem); }
.rc-clip.big .rc-clip-body { padding: 20px 10px 0; flex: 0 0 auto; }
.rc-clip.big .rc-player { flex: 1 0 auto; background: #121212; }
.rc-clip.big .rc-player video { background: #121212; }

/* PANEL Q AND A (ivory) */
.rc-light { background: var(--ivory); color: var(--ink-2); }
.rc-light h2, .rc-light h3 { color: var(--ink) !important; }
.rc-light h2 em { color: #b53a0c !important; }
.rc-light .rc-label { color: #b53a0c; }
.rc-qa-grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 2fr); gap: 48px; align-items: start; }
.rc-qa-intro { position: sticky; top: 110px; }
.rc-qa-intro p { font-size: 1.06rem; line-height: 1.65; color: var(--ink-2); }
.rc-qa-list { display: grid; gap: 12px; }
.rc-q { border-radius: 14px; background: #fff; border: 1px solid #E6DCC3; box-shadow: 0 18px 40px -30px rgba(11,11,11,0.45); transition: border-color .3s, box-shadow .3s; scroll-margin-top: 90px; }
.rc-q:hover { border-color: #CDB676; }
.rc-q[open] { border-color: var(--gold); box-shadow: 0 30px 60px -34px rgba(11,11,11,0.55); }
.rc-q summary { list-style: none; display: grid; grid-template-columns: 52px minmax(0, 1fr) 28px; gap: 14px; align-items: center; padding: 18px 20px; cursor: pointer; }
.rc-q summary::-webkit-details-marker { display: none; }
.rc-q summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 14px; }
.rc-qn { font-family: var(--rc-serif); font-style: normal; font-size: 1.9rem; color: #A88A33; line-height: 1; }
.rc-qt { font-family: var(--rc-serif); font-style: normal; font-size: 1.3rem; line-height: 1.25; color: var(--ink); }
.rc-qm { display: block; margin-top: 4px; font-family: var(--rc-sans); font-style: normal; font-size: 0.86rem; color: #6E6759; }
.rc-chev { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; border: 1px solid #D9CBA4; color: #b53a0c; transition: transform .3s, background .3s; }
.rc-chev svg { width: 14px; height: 14px; }
.rc-q[open] .rc-chev { transform: rotate(180deg); background: var(--gold); color: var(--ink); border-color: var(--gold); }
.rc-q-body { padding: 0 20px 20px; }
.rc-q-body .rc-player { border-radius: 10px; }
.rc-q-foot { display: flex; justify-content: flex-end; margin-top: 12px; }

/* MEET THE PANEL */
.rc-panel { background: linear-gradient(180deg, var(--bg) 0%, #0F0F0F 100%); overflow: hidden; }
.rc-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: start; }
.rc-person { position: relative; border-radius: 18px; overflow: hidden; background: linear-gradient(180deg, rgba(255,107,53,0.18), rgba(26,26,26,0.9) 46%, var(--bg-2)); border: 1px solid rgba(255,107,53,0.3); transition: transform .35s, border-color .35s; }
.rc-person:nth-child(2) { margin-top: 48px; }
.rc-person:hover { transform: translateY(-4px); border-color: rgba(255,107,53,0.6); }
.rc-person img { display: block; width: 100%; height: auto; margin-bottom: -60px; transition: transform .6s ease; }
.rc-person:hover img { transform: scale(1.03); }
.rc-person-body { position: relative; padding: 0 26px 28px; }
.rc-person h3 { font-size: 2rem; color: var(--cream); margin-bottom: 4px; }
.rc-role { font-size: 0.9rem; font-weight: 600; color: var(--gold-hover); margin-bottom: 14px; line-height: 1.45; }
.rc-person p.rc-bio { font-size: 1rem; line-height: 1.65; }
.rc-host { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 30px; padding: 14px 24px 14px 14px; border-radius: 100px; border: 1px solid var(--border); background: rgba(26,26,26,0.6); width: fit-content; max-width: 100%; }
.rc-host img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; background: linear-gradient(180deg, rgba(255,107,53,0.3), var(--card)); border: 1.5px solid rgba(255,107,53,0.7); }
.rc-host div { font-size: 0.96rem; line-height: 1.45; }
.rc-host strong { display: block; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.3rem; color: var(--cream); }

/* KITCHEN TABLE (cream) */
.rc-kitchen { background: radial-gradient(ellipse 60% 80% at 100% 0%, rgba(255,107,53,0.22), transparent 60%), var(--ivory-2); color: var(--ink-2); }
.rc-kitchen-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 48px; align-items: center; }
.rc-kitchen h2 { font-size: clamp(2.4rem, 4.2vw, 4rem); }
.rc-kitchen-sub { font-size: 1.08rem; line-height: 1.6; margin-bottom: 22px; }
.rc-kq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; counter-reset: kq; list-style: none; }
.rc-kq li { position: relative; padding: 26px 26px 26px 84px; border-radius: 16px; background: #FFFDF7; border: 1px solid #E3D5AE; font-family: var(--rc-serif); font-style: normal; font-size: 1.32rem; line-height: 1.35; color: var(--ink); box-shadow: 0 20px 40px -30px rgba(11,11,11,0.4); transition: transform .3s; }
.rc-kq li:nth-child(even) { transform: translateY(26px); }
.rc-kq li:hover { transform: translateY(-3px); }
.rc-kq li:nth-child(even):hover { transform: translateY(23px); }
.rc-kq li::before { counter-increment: kq; content: counter(kq); position: absolute; left: 24px; top: 18px; font-family: var(--rc-serif); font-style: normal; font-size: 3.2rem; line-height: 1; color: #e0561f; }
.rc-link-ink { display: inline-flex; align-items: center; gap: 8px; color: #8f2e0a; font-weight: 600; border-bottom: 1px solid rgba(181,58,12,0.4); padding-bottom: 2px; }
.rc-link-ink:hover { color: var(--ink); border-color: var(--ink); }
.rc-link-ink svg { width: 16px; height: 16px; }

/* THE NUMBERS */
.rc-numbers { background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(255,107,53,0.14), transparent 70%), linear-gradient(180deg, var(--navy-2) 0%, var(--navy) 100%); }
.rc-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.rc-stat { display: flex; flex-direction: column; padding: 26px 24px 22px; border-radius: 16px; background: var(--navy-card); border: 1px solid var(--navy-line); transition: border-color .3s, transform .3s; }
.rc-stat:hover { border-color: rgba(255,107,53,0.5); transform: translateY(-3px); }
.rc-stat:nth-child(1), .rc-stat:nth-child(2) { grid-column: span 2; }
.rc-stat:last-child { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 34px; }
.rc-stat:last-child .rc-num { margin-bottom: 0; }
.rc-stat:last-child p { margin-bottom: 0; flex: 1 1 280px; font-size: 1.1rem; }
.rc-stat:last-child .rc-src { margin-top: 0; padding-top: 0; border-top: 0; flex: 0 1 auto; }
.rc-num { font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: clamp(2.6rem, 3.6vw, 3.4rem); line-height: 1; margin-bottom: 14px; font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.rc-stat:nth-child(1) .rc-num, .rc-stat:nth-child(2) .rc-num { font-size: clamp(3.4rem, 5.4vw, 5.2rem); }
.rc-stat p { font-size: 1rem; line-height: 1.55; color: var(--body); margin-bottom: 16px; }
.rc-src { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--navy-line); font-size: 0.78rem; line-height: 1.45; color: #9a948d; }
.rc-numbers .rc-stat p, .rc-numbers .rc-head p { color: #C9D3E0; }

/* NEXT STEPS */
.rc-next { background: radial-gradient(ellipse 70% 90% at 0% 100%, rgba(255,107,53,0.2), transparent 60%), linear-gradient(180deg, var(--bg) 0%, #0F0F0F 100%); }
.rc-steps { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-rows: auto auto auto; gap: 18px; }
.rc-step { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; padding: 28px 30px; border-radius: 18px; border: 1px solid var(--border); background: rgba(26,26,26,0.7); color: var(--cream); transition: transform .3s, border-color .3s, background .3s; min-width: 0; }
.rc-step:hover { transform: translateY(-3px); border-color: rgba(255,107,53,0.6); }
.rc-step strong { display: block; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.7rem; line-height: 1.15; }
.rc-step small { display: block; margin-top: 6px; font-size: 0.95rem; color: var(--body); }
.rc-step .rc-arrow { align-self: flex-start; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,107,53,0.6); color: var(--gold-hover); transition: transform .3s, background .3s; }
.rc-step .rc-arrow svg { width: 20px; height: 20px; }
.rc-step:hover .rc-arrow { transform: translateX(4px); }
.rc-step.main { grid-row: span 3; padding: 40px; background: linear-gradient(140deg, #ff8a4a 0%, var(--gold) 45%, #d43b1a 100%); border-color: transparent; color: var(--ink); box-shadow: 0 40px 80px -40px rgba(255,107,53,0.6); }
.rc-step.main strong { font-size: clamp(2.2rem, 3.4vw, 3.2rem); color: var(--ink); }
.rc-step.main small { color: #2a140a; font-size: 1.05rem; }
.rc-step.main .rc-arrow { width: 60px; height: 60px; background: var(--ink); color: var(--gold-hover); border-color: var(--ink); }
.rc-step.main:hover { background: linear-gradient(140deg, #ff9a5c 0%, #D3B45A 45%, #B08E36 100%); }
.rc-btn-lindsy { color: var(--cream); border-color: rgba(255,107,53,0.55); background: rgba(11,11,11,0.4); }
.rc-btn-lindsy:hover { color: var(--gold-hover); border-color: var(--gold-hover); }
.rc-lindsy-note { margin: 14px 0 0; font-size: 0.95rem; line-height: 1.5; color: var(--body); }
.rc-clip-lindsy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; margin-top: 22px; padding: 20px 24px; border-radius: 14px; border: 1px solid rgba(255,107,53,0.35); background: rgba(26,26,26,0.7); }
.rc-clip-lindsy p { margin: 0; font-size: 1.05rem; line-height: 1.5; color: var(--cream); }
.rc-step.main > span:first-child { display: block; }
.rc-book-lead { display: block; margin-top: 18px; max-width: 34em; font-size: 1.12rem; line-height: 1.55; color: #2a140a; }
.rc-book-label { display: block; margin-top: 24px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #4A3B12; }
.rc-book-list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; }
.rc-book-list li { position: relative; padding-left: 30px; font-size: 1.12rem; line-height: 1.45; color: var(--ink); font-weight: 500; }
.rc-book-list li::before { content: ""; position: absolute; left: 2px; top: 0.5em; width: 14px; height: 8px; border-left: 2.5px solid var(--ink); border-bottom: 2.5px solid var(--ink); transform: rotate(-45deg); }
.rc-book-go { display: inline-flex; align-items: center; gap: 16px; }
.rc-book-go em { font-style: normal; font-size: 0.95rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); }
.rc-step small { overflow-wrap: anywhere; }
.rc-foot { margin-top: 40px; font-size: 0.86rem; line-height: 1.6; color: var(--muted); text-align: center; }

/* CLIP PAGES */
.rc-cliphero { padding: 56px 0 70px; background: radial-gradient(ellipse 60% 70% at 50% 0%, rgba(255,107,53,0.15), transparent 70%), linear-gradient(180deg, #141414 0%, var(--bg) 100%); }
.rc-cliphero-in { max-width: 1180px; margin: 0 auto; }
.rc-crumb { display: inline-flex; align-items: center; gap: 8px; color: var(--gold-hover); font-size: 0.9rem; font-weight: 600; margin-bottom: 18px; }
.rc-crumb svg { width: 16px; height: 16px; }
.rc-cliphero h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: 1.02; margin-bottom: 16px; }
.rc-speaker { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.rc-speaker img { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; background: linear-gradient(180deg, rgba(255,107,53,0.3), var(--card)); border: 1.5px solid rgba(255,107,53,0.7); }
.rc-speaker strong { display: block; color: var(--cream); font-size: 1.1rem; }
.rc-speaker span { font-size: 0.92rem; color: var(--muted); }
.rc-clip-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 18px; }
.rc-full { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 26px; align-items: center; margin-top: 44px; padding: 18px; border-radius: 18px; border: 1px solid rgba(255,107,53,0.4); background: rgba(26,26,26,0.6); color: var(--cream); transition: border-color .3s, transform .3s; }
.rc-full:hover { border-color: var(--gold-hover); transform: translateY(-3px); }
.rc-full img { display: block; width: 100%; height: auto; border-radius: 10px; }
.rc-full strong { display: block; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: clamp(1.6rem, 2.6vw, 2.2rem); line-height: 1.15; margin-bottom: 6px; }
.rc-full span { color: var(--body); font-size: 0.98rem; }

/* responsive */
@media (max-width: 1180px) {
  .rc-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .rc-hero { padding-top: calc(var(--hdr) + 36px); }
  .rc-hero-side { order: -1; }
  .rc-hero-quote { display: none; }   /* stacked layouts: the replay is the next section down */
  .rc-heads { max-width: 760px; margin: 0 auto; width: 100%; }
  .rc-hero-copy { padding-bottom: 64px; text-align: center; }
  .rc-with { margin-left: auto; margin-right: auto; }
  .rc-actions { justify-content: center; }
  .rc-replay-grid { grid-template-columns: minmax(0, 1fr); }
  .rc-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rc-qa-grid { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .rc-qa-intro { position: static; }
}
@media (max-width: 960px) {
  .rc-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rc-clip.big { grid-column: span 2; grid-row: auto; }
  .rc-people { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin: 0 auto; }
  .rc-person:nth-child(2) { margin-top: 0; }
  .rc-kitchen-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .rc-steps { grid-template-columns: minmax(0, 1fr); }
  .rc-step.main { grid-row: auto; }
  .rc-host { margin-left: auto; margin-right: auto; }
}
@media (max-width: 720px) {
  .rc-bento { grid-template-columns: minmax(0, 1fr); }
  .rc-clip.big { grid-column: auto; }
  .rc-kq { grid-template-columns: minmax(0, 1fr); }
  .rc-kq li:nth-child(even), .rc-kq li:nth-child(even):hover { transform: none; }
  .rc-full { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .rc-sec { padding: 60px 0; }
  .rc-hero h1 { font-size: 3rem; }
  .rc-head-fig figcaption { display: none; }
  .rc-actions .btn { width: 100%; justify-content: center; text-align: center; }
  .rc-actions .rc-share-wrap { width: 100%; }
  .rc-clip-lindsy { padding: 18px; }
  .rc-clip-lindsy .btn { width: 100%; text-align: center; }
  .rc-chap { grid-template-columns: 54px minmax(0, 1fr); padding: 14px 16px; font-size: 0.95rem; }
  .rc-stats { grid-template-columns: minmax(0, 1fr); }
  .rc-stat:nth-child(1), .rc-stat:nth-child(2) { grid-column: auto; }
  .rc-q summary { grid-template-columns: 34px minmax(0, 1fr) 26px; gap: 10px; padding: 16px 14px; }
  .rc-qn { font-size: 1.5rem; }
  .rc-qt { font-size: 1.12rem; }
  .rc-q-body { padding: 0 12px 14px; }
  .rc-kq li { padding: 22px 20px 22px 70px; font-size: 1.16rem; }
  .rc-kq li::before { left: 20px; font-size: 2.7rem; }
  .rc-step, .rc-step.main { padding: 26px 22px; }
  .rc-play span { width: 62px; height: 62px; }
  .rc-player-lg .rc-play span { width: 76px; height: 76px; }
  .rc-host { border-radius: 18px; }
  footer.site-footer .socials { flex-wrap: wrap; justify-content: center; row-gap: 12px; }
  .container, .container-narrow { padding: 0 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .rc-foil, .rc-glow, .rc-play span { animation: none; }
  .rc-head-fig { animation: none; opacity: 1; transform: none; }
  .rc-hero-quote { animation: none; opacity: 1; transform: none; }
  .rc-hq-slide { transition: none; transform: none; }
}

/* ---- Chand's Grand Opening additions (10/29) ---- */
/* hero: one large portrait on the right instead of the FFN quote card and four headshots */
.rc-hero-chand .rc-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: end; }
.rc-hero-chand .rc-hero-copy { padding-bottom: 64px; }
.rc-hero-chand .rc-with { font-size: 1.12rem; max-width: 600px; }
.rc-hero-chand .rc-hero-play { max-width: 600px; margin-top: 26px; }
.rc-hero-chand .rc-hero-side { align-self: end; }
.rc-chand-fig { position: relative; margin: 0 auto; width: min(100%, 720px); opacity: 0; transform: translateY(40px); animation: rc-rise 1s cubic-bezier(.2,.7,.2,1) .15s forwards; }
.rc-chand-fig::before { content: ""; position: absolute; left: 6%; right: 6%; top: 8%; bottom: 0; border-radius: 50% 50% 0 0; background: radial-gradient(closest-side, rgba(255,107,53,0.22), rgba(255,107,53,0.06) 60%, transparent); }
.rc-chand-fig img { position: relative; display: block; width: 100%; height: auto; }
.rc-chand-fig figcaption { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 2px; white-space: nowrap; padding: 10px 20px; border-radius: 14px; background: rgba(11,11,11,0.84); border: 1px solid rgba(255,107,53,0.5); font-size: 0.82rem; letter-spacing: 0.04em; color: var(--body); }
.rc-chand-fig figcaption strong { font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.3rem; letter-spacing: 0; color: var(--cream); }

/* training appointments note: under the hero buttons, and with its own button on clip pages */
.rc-train { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; max-width: 600px; margin-top: 20px; padding: 16px 20px; border-radius: 14px; border: 1px solid rgba(255,107,53,0.4); background: rgba(255,107,53,0.07); }
.rc-train strong { display: block; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.3rem; line-height: 1.2; color: var(--gold-hover); margin-bottom: 4px; }
.rc-train p { margin: 0; font-size: 0.98rem; line-height: 1.55; color: var(--cream); }
.rc-train > div { flex: 1 1 300px; min-width: 0; }
.rc-cliphero .rc-train { max-width: none; margin-top: 24px; }

/* replay: the blur line under the player; 16 chapters scroll beside it at desktop instead of running past it */
.rc-blur { display: flex; align-items: center; gap: 8px; margin: 12px 2px 0; font-size: 0.9rem; color: var(--muted); }
.rc-blur svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--gold); }
.rc-replay-grid { align-items: stretch; }
.rc-chap-col { position: relative; min-height: 0; }
.rc-chap-col .rc-chapters { position: absolute; inset: 0 0 34px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(255,107,53,0.5) transparent; }
.rc-chapters-head { position: sticky; top: 0; z-index: 1; background: #141414; }
.rc-chap { padding: 12px 18px; font-size: 0.95rem; }

/* next steps: the feedback card carries the training note */
.rc-step.main .rc-book-label { display: block; margin-top: 18px; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.4rem; text-transform: none; letter-spacing: 0; color: var(--ink); }
.rc-step.main .rc-book-lead { display: block; margin-top: 6px; font-size: 1.05rem; line-height: 1.55; color: #2a140a; max-width: 520px; }
.rc-step.main .rc-book-go { display: flex; align-items: center; gap: 14px; }
.rc-step.main .rc-book-go em { font-style: normal; font-weight: 600; letter-spacing: 0.04em; }
.rc-next .rc-steps { grid-template-rows: auto auto; }
.rc-next .rc-step.main { grid-row: span 2; }

@media (max-width: 1180px) {
  .rc-hero-chand .rc-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .rc-chand-fig { width: min(92vw, 640px); }
  .rc-hero-chand .rc-train, .rc-hero-chand .rc-hero-play { margin-left: auto; margin-right: auto; text-align: left; }
  .rc-chap-col .rc-chapters { position: static; max-height: 440px; }
}
@media (max-width: 960px) {
  .rc-next .rc-step.main { grid-row: auto; }
}
@media (max-width: 600px) {
  .rc-chand-fig figcaption { bottom: 14px; padding: 8px 14px; }
  .rc-chand-fig figcaption strong { font-size: 1.1rem; }
  .rc-train { padding: 16px; }
  .rc-train .btn { width: 100%; justify-content: center; text-align: center; }
}
/* Topic posters (c02-c08): the name line is off the art, and the play button sits where it was, bottom-left, so it never covers the title */
.rc-player.rc-topic .rc-play { place-items: end start; padding: 0 0 7.2% 6.4%; }
.rc-player.rc-topic .rc-play span { width: clamp(40px, 13%, 84px); height: auto; aspect-ratio: 1; }
.rc-player.rc-topic .rc-play svg { width: 36%; height: auto; margin-left: 8%; }
/* 10/30 (Charming via Grant): headline about Chand's practice, both firm logos above his head, the education series */
.rc-hero-chand h1 { font-size: clamp(2.6rem, 4.7vw, 4.7rem); line-height: 1.03; }
.rc-hero-logos { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: clamp(18px, 2.4vw, 34px); margin: 0 auto clamp(4px, 1vw, 14px); opacity: 0; animation: rc-rise 1s cubic-bezier(.2,.7,.2,1) .05s forwards; }
.rc-hero-logos img { display: block; width: auto; height: clamp(58px, 6.4vw, 104px); }
.rc-hero-logos span { align-self: stretch; width: 1px; margin: 8px 0; background: linear-gradient(180deg, transparent, rgba(255,107,53,0.6), transparent); }
.rc-pre-row { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 16px; }
.rc-pre-card h3 { margin: 12px 2px 0; font-family: var(--rc-serif); font-style: normal; font-weight: 500; font-size: 1.08rem; line-height: 1.25; color: var(--cream); }
.rc-player.rc-vert { aspect-ratio: 9 / 16; border-radius: 12px; box-shadow: none; }
.rc-player.rc-vert .rc-play { place-items: end start; padding: 0 0 5% 6%; }
.rc-player.rc-vert .rc-play span { width: clamp(34px, 21%, 46px); height: auto; aspect-ratio: 1; }
.rc-player.rc-vert .rc-play svg { width: 36%; height: auto; margin-left: 8%; }
.rc-player.rc-vert .rc-play em { right: 8px; bottom: 8px; }
@media (max-width: 1180px) { .rc-pre-row { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  .rc-pre-row { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 44%; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-bottom: 10px; scrollbar-width: thin; scrollbar-color: rgba(255,107,53,0.5) transparent; }
  .rc-pre-card { scroll-snap-align: start; }
}
/* 10/30 Motions (Reel): horizontal player, vertical cut as a link, music credit under the title; an odd last card goes wide */
.rc-motion-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.rc-motion.wide { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 8px 26px; align-items: center; padding: 16px; }
.rc-motion.wide .rc-clip-body { padding: 8px 6px; }
.rc-credit { margin: -6px 0 18px; font-size: 0.82rem; line-height: 1.5; color: var(--muted); }
.rc-vlink { display: inline-flex; align-items: center; gap: 8px; font-size: 0.86rem; font-weight: 600; color: var(--gold-hover); text-decoration: none; border-bottom: 1px solid rgba(255,107,53,0.4); padding-bottom: 2px; }
.rc-vlink svg { width: 14px; height: 14px; }
.rc-vlink:hover { color: var(--cream); border-color: var(--cream); }
.rc-clip-motion { margin-top: 40px; scroll-margin-top: 90px; }
.rc-clip-motion .rc-label { margin-bottom: 14px; }
.rc-clip-motion .rc-motion:hover { transform: none; }
@media (max-width: 960px) { .rc-motion-grid { grid-template-columns: minmax(0, 1fr); } .rc-motion.wide { grid-template-columns: minmax(0, 1fr); } }
/* 10/30 replay leads: no big highlight card; on the 2-across grid an odd last card spans the row */
@media (max-width: 960px) and (min-width: 721px) { .rc-bento.rc-no-lead .rc-clip:last-child:nth-child(odd) { grid-column: span 2; } }
/* 10/30 the full replay is a Loom embed in the big player frame */
.rc-loom { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #050505; border: 1px solid rgba(255,107,53,0.3); box-shadow: 0 40px 80px -40px rgba(0,0,0,0.9); }
.rc-loom img, .rc-loom iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; object-fit: cover; }
.rc-loom .rc-play span { width: clamp(62px, 11%, 96px); height: auto; aspect-ratio: 1; }
.rc-loom .rc-play svg { width: 36%; height: auto; margin-left: 8%; }
.rc-loom.on img, .rc-loom.on .rc-play { display: none; }
/* 10/30 Motion-first clips: version toggle, music credit, share-which-cut menu, vertical cut on clip pages */
.rc-cut { display: inline-flex; padding: 3px; border-radius: 100px; border: 1px solid rgba(255,107,53,0.35); background: rgba(11,11,11,0.45); }
.rc-cut button { border: 0; background: transparent; color: var(--muted); font: 600 0.72rem var(--rc-sans); letter-spacing: 0.06em; text-transform: uppercase; padding: 7px 12px; border-radius: 100px; cursor: pointer; transition: background .25s, color .25s; }
.rc-cut button:hover { color: var(--cream); }
.rc-cut button[aria-pressed="true"] { background: var(--gold); color: #0b0b0b; }
.rc-cut button:focus-visible { outline: 2px solid var(--gold-hover); outline-offset: 2px; }
.rc-cutbox[data-cut="o"] .rc-credit { visibility: hidden; }
.rc-credit-page { margin: 14px 0 0; }
.rc-share-proxy { position: absolute; inset: 0; opacity: 0; pointer-events: none; border: 0; padding: 0; background: none; }
.rc-menu-head { padding: 8px 12px 6px; font: 600 0.68rem var(--rc-sans); letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); }
.rc-cut-ico { flex-shrink: 0; display: inline-block; border: 2px solid var(--gold); border-radius: 3px; }
.rc-cut-ico.v { width: 11px; height: 18px; margin: 0 4px; }
.rc-cut-ico.h { width: 19px; height: 11px; }
.rc-cut-ico.o { width: 19px; height: 11px; border-style: dashed; }
.rc-cliphero .rc-player.rc-vert { width: min(420px, 100%); margin: 0 auto; }
/* c01 Motion (10/30): its bottom-left holds the "Down in the depths" label, so the 16:9 animated cut puts the play button on the
   path's pin, centred across and 55% down (padding % is of the width: 5.6% of a 16:9 width moves the centre 5% of the height) */
.rc-player.rc-topic.rc-btn-pin .rc-play { place-items: center; padding: 5.6% 0 0 0; }

/* the rhq header is fixed (readcharming's sits in the flow), so the clip pages clear it like the recap hero does */
.rc-cliphero { padding-top: calc(var(--hdr) + 40px); }

/* Charming 10/30 14:26Z: the hero's two logos in the home page's framed RFF card (navy, gold frame, HONOS FIDES line), one circle per logo.
   The circles are the same size, so the firm logo on the left is as big as the RFF crest. */
.rc-hero-chand .rc-hero-side { position: relative; }
.rc-lockup { position: relative; z-index: 1; display: grid; justify-items: center; gap: clamp(16px, 1.6vw, 22px); width: fit-content; max-width: 100%; margin: 0 auto clamp(-26px, -1.6vw, -10px);
  padding: clamp(20px, 2.2vw, 32px) clamp(22px, 2.6vw, 40px); border-radius: var(--r);
  background: radial-gradient(ellipse 70% 90% at 88% 0%, rgba(212,175,55,.22), transparent 60%), linear-gradient(150deg, #1B2A4A, #0e1730 68%, #0a1122);
  border: 1px solid rgba(212,175,55,.32); box-shadow: 0 50px 90px -50px rgba(0,0,0,.95);
  opacity: 0; animation: rc-rise 1s cubic-bezier(.2,.7,.2,1) .05s forwards; }
.rc-lockup::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(212,175,55,.16); border-radius: 10px; pointer-events: none; }
.rc-lk-row { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 2vw, 30px); }
.rc-lk-c { display: grid; place-items: center; width: clamp(140px, 14.8vw, 216px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #22355c, #0e1730 72%); border: 2px solid rgba(212,175,55,.8);
  box-shadow: inset 0 0 0 6px #0e1730, inset 0 0 0 7px rgba(212,175,55,.32), 0 22px 40px -22px rgba(0,0,0,.9); }
.rc-lk-c img { display: block; width: 76%; height: auto; filter: drop-shadow(0 6px 14px rgba(0,0,0,.45)); }
.rc-lockup .rff-motto { font-size: 12px; }
@media (max-width: 1180px) and (min-width: 601px) { .rc-lk-c { width: clamp(170px, 21vw, 214px); } }
@media (max-width: 600px) {
  .rc-lockup { padding: 18px 18px 16px; margin-bottom: -4px; }
  .rc-lk-c { width: clamp(118px, 36vw, 140px); }
  .rc-lockup .rff-motto { gap: 10px; letter-spacing: .28em; font-size: 11px; }
  .rc-lockup .rff-motto small { font-size: 10.5px; }
}