/* ResultsAiX Webinars - front-end (registration, thanks, room, replay).
   House design system: light page, dark hero, amber CTAs, Outfit. Eight
   registration styles, listed in rwb_reg_templates(): dark, white, bold,
   editorial, corporate, gradient, premium, minimal. The body class is
   rwb-tpl-<key> and it is on the thanks page too, so anything a style changes
   has to survive both. */

* { box-sizing: border-box; }

/* An element with display:flex or grid BEATS the browser's own [hidden]{display:none},
   so setting the hidden attribute on one silently does nothing. This has now bitten
   three times in this plugin: the New Webinar modal in the admin, and then far worse
   here, where .rwb-stage-overlay is display:flex. Clicking "Enter Webinar" ran
   overlay.hidden = true, the gate stayed on screen, and NOBODY COULD EVER ENTER A
   ROOM, live or replay. The same fault kept "The host is typing" (.rwb-typing, flex)
   and the reaction bar (.rwb-rx, flex) permanently on screen.
   Declared once, broadly, so the next flex element someone hides is covered by
   default rather than shipping the same bug a fourth time. */
[hidden] { display: none !important; }

html, body { overflow-x: hidden; overflow-x: clip; }
.rwb-body { margin: 0; font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; line-height: 1.5; color: var(--rwb-page-text); background: var(--rwb-page); }
.rwb-body h1, .rwb-body h2 { max-width: none !important; }
.rwb-body img { max-width: 100%; }
a { color: inherit; }

/* ============ Registration ============
   Every style is the same markup with a different palette plus its own layout
   personality. The palette is declared ONCE here as variables and each style
   redeclares only what it changes, which is what stops a style looking finished
   on the hero and unfinished on the form card or the thanks page. */
.rwb-body {
	--rwb-page: #faf7ee;            /* the page itself: always light, never black */
	--rwb-page-text: #0a0a0a;
	--rwb-hero-bg: linear-gradient( 160deg, #16130c 0%, #0a0a0a 62% );
	--rwb-hero-text: #fafaf9;
	--rwb-hero-sub: rgba(250,250,249,.84);
	--rwb-form-bg: #ffffff;         /* the signup side */
	--rwb-form-text: #0a0a0a;
	--rwb-card: #ffffff;            /* the thanks card */
	--rwb-acc: #f59e0b;             /* family primary */
	--rwb-acc-hover: #d97706;
	--rwb-acc-on: #0a0a0a;          /* text that sits ON the accent */
	--rwb-acc-soft: rgba(245,158,11,.16);
	--rwb-acc-ink: #b45309;         /* the accent as readable text on a light background */
	--rwb-badge-bg: rgba(245,158,11,.15);
	--rwb-badge-text: #fbbf24;
	--rwb-tick-bg: #f59e0b;
	--rwb-tick-fg: #0a0a0a;
	--rwb-ok: #22c55e;
	--rwb-line: #e7dfc8;
	--rwb-input-bg: #ffffff;
	--rwb-input-bd: #d8cfae;
	--rwb-radius: 12px;
	--rwb-head-font: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--rwb-head-weight: 900;
}

.rwb-reg-wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 0; min-height: 100vh; }
@media ( max-width: 900px ) { .rwb-reg-wrap { grid-template-columns: 1fr; } }

.rwb-reg-hero { padding: 8vh 6vw; display: flex; flex-direction: column; justify-content: center; background: var(--rwb-hero-bg); color: var(--rwb-hero-text); }
.rwb-reg-badge { align-self: flex-start; font-size: 14px; font-weight: 700; letter-spacing: .02em; padding: 6px 16px; border-radius: 99px; margin-bottom: 24px; background: var(--rwb-badge-bg); color: var(--rwb-badge-text); }
.rwb-reg-hero h1 { font-family: var(--rwb-head-font); font-size: clamp( 30px, 4vw, 52px ); font-weight: var(--rwb-head-weight); line-height: 1.08; margin: 0 0 18px; letter-spacing: -.02em; }
.rwb-reg-sub { font-size: clamp( 17px, 1.6vw, 21px ); line-height: 1.5; margin: 0 0 26px; color: var(--rwb-hero-sub); }
.rwb-reg-bullets { list-style: none; padding: 0; margin: 0 0 26px; }
.rwb-reg-bullets li { position: relative; padding: 9px 0 9px 34px; font-size: 17px; }
.rwb-reg-bullets li::before { content: "✓"; position: absolute; left: 0; top: 9px; width: 24px; height: 24px; background: var(--rwb-tick-bg); color: var(--rwb-tick-fg); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 13px; }
.rwb-reg-presenter { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.rwb-reg-presenter img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; }

.rwb-reg-formcard { display: flex; flex-direction: column; justify-content: center; padding: 8vh 5vw; background: var(--rwb-form-bg); color: var(--rwb-form-text); }
.rwb-reg-formcard h2 { font-family: var(--rwb-head-font); font-size: 26px; font-weight: 800; margin: 0 0 14px; }
.rwb-reg-when { font-size: 15px; margin: 0 0 18px; opacity: .9; }
.rwb-reg-when b { color: var(--rwb-acc-ink); }
.rwb-tznote { font-weight: 400; font-size: .72em; opacity: .75; }

/* Compliance footer: privacy, terms, disclaimer. */
.rwb-reg-footer { text-align: center; padding: 18px 6vw 6px; font-size: 12.5px; opacity: .8; }
.rwb-reg-footer a { color: inherit; text-decoration: underline; }
.rwb-reg-footer-links { margin: 0 0 6px; }
.rwb-reg-footer-disclaimer { max-width: 720px; margin: 0 auto; line-height: 1.5; }

/* The embeddable form: one compact column made to live inside an iframe on
   any page. It reuses the form-card styles, minus the full-page padding. */
.rwb-embed { min-height: 100vh; }
.rwb-embed .rwb-embed-wrap { max-width: 520px; margin: 0 auto; padding: 18px 16px 8px; }
.rwb-embed .rwb-reg-when { text-align: center; }
.rwb-embed .rwb-reg-formcard { padding: 22px 20px; border-radius: 12px; }
.rwb-embed .rwb-powered { text-align: center; padding: 6px 0 10px; }
.rwb-f { display: block; margin-bottom: 16px; }
.rwb-f span { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; opacity: .75; }
.rwb-f input, .rwb-f select { width: 100%; padding: 14px 16px; font-size: 16px; border-radius: var(--rwb-radius); border: 1.5px solid var(--rwb-input-bd); background: var(--rwb-input-bg); color: var(--rwb-form-text); font-family: inherit; }
.rwb-f input:focus, .rwb-f select:focus { outline: none; border-color: var(--rwb-acc); box-shadow: 0 0 0 3px var(--rwb-acc-soft); }
.rwb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.rwb-reg-cta { display: block; width: 100%; padding: 16px; font-size: 18px; font-weight: 800; color: var(--rwb-acc-on); background: var(--rwb-acc); border: none; border-radius: var(--rwb-radius); cursor: pointer; text-align: center; text-decoration: none; margin-top: 6px; box-shadow: 0 10px 26px -12px rgba(0,0,0,.55); transition: transform .12s, background .12s, filter .12s; }
.rwb-reg-cta:hover { background: var(--rwb-acc-hover); transform: translateY(-1px); }
.rwb-reg-msg { margin-top: 12px; min-height: 20px; color: #b91c1c; font-weight: 600; }
.rwb-reg-fine { margin-top: 14px; font-size: 12px; opacity: .6; text-align: center; }

/* Split styles place their own boxes. Left to the browser, testimonials land in
   the FORM column and shove the form underneath the hero, which is what used to
   happen the moment anybody added a testimonial to a two column page. */
@media ( min-width: 901px ) {
	.rwb-tpl-dark .rwb-reg-hero, .rwb-tpl-white .rwb-reg-hero,
	.rwb-tpl-corporate .rwb-reg-hero, .rwb-tpl-gradient .rwb-reg-hero { grid-column: 1; grid-row: 1; }
	.rwb-tpl-dark .rwb-reg-quotes, .rwb-tpl-white .rwb-reg-quotes,
	.rwb-tpl-corporate .rwb-reg-quotes, .rwb-tpl-gradient .rwb-reg-quotes { grid-column: 1; grid-row: 2; }
	.rwb-tpl-dark .rwb-reg-formcard, .rwb-tpl-white .rwb-reg-formcard,
	.rwb-tpl-corporate .rwb-reg-formcard, .rwb-tpl-gradient .rwb-reg-formcard { grid-column: 2; grid-row: 1 / span 2; }
}

/* Stacked styles: hero band across the top, everything centred under it. */
.rwb-tpl-bold .rwb-reg-wrap, .rwb-tpl-editorial .rwb-reg-wrap,
.rwb-tpl-premium .rwb-reg-wrap, .rwb-tpl-minimal .rwb-reg-wrap { grid-template-columns: 1fr; }
.rwb-tpl-bold .rwb-reg-hero, .rwb-tpl-editorial .rwb-reg-hero,
.rwb-tpl-premium .rwb-reg-hero, .rwb-tpl-minimal .rwb-reg-hero { text-align: center; }
.rwb-tpl-bold .rwb-reg-badge, .rwb-tpl-editorial .rwb-reg-badge,
.rwb-tpl-premium .rwb-reg-badge, .rwb-tpl-minimal .rwb-reg-badge { align-self: center; }
.rwb-tpl-bold .rwb-reg-bullets, .rwb-tpl-editorial .rwb-reg-bullets,
.rwb-tpl-premium .rwb-reg-bullets, .rwb-tpl-minimal .rwb-reg-bullets { text-align: left; margin-left: auto; margin-right: auto; }
.rwb-tpl-bold .rwb-reg-presenter, .rwb-tpl-editorial .rwb-reg-presenter,
.rwb-tpl-premium .rwb-reg-presenter, .rwb-tpl-minimal .rwb-reg-presenter { justify-content: center; }
.rwb-tpl-bold .rwb-reg-video, .rwb-tpl-editorial .rwb-reg-video,
.rwb-tpl-premium .rwb-reg-video, .rwb-tpl-minimal .rwb-reg-video { max-width: 860px; margin-left: auto; margin-right: auto; }
.rwb-tpl-bold .rwb-reg-logo, .rwb-tpl-editorial .rwb-reg-logo,
.rwb-tpl-premium .rwb-reg-logo, .rwb-tpl-minimal .rwb-reg-logo { margin-left: auto; margin-right: auto; }

/* ---- Style: Dark Hero ----
   The original, corrected. It used to paint the whole page black, including the
   form side and the thanks page. The hero is the dark part; the page it sits on
   is light, which is the house look and reads far better on a phone. */
.rwb-tpl-dark {
	--rwb-page: #f7f4ea;
	--rwb-line: #e6dcc0;
}
.rwb-tpl-dark .rwb-reg-formcard { border-left: 1px solid var(--rwb-line); }

/* ---- Style: Clean White ----
   The one style with a light hero on purpose. It is for a list that already
   trusts you, where a black slab reads as a pitch. */
.rwb-tpl-white {
	--rwb-page: #ffffff;
	--rwb-hero-bg: #f8f6f0;
	--rwb-hero-text: #0a0a0a;
	--rwb-hero-sub: #5b5647;
	--rwb-badge-bg: #fef3c7;
	--rwb-badge-text: #b45309;
	--rwb-line: #eee3c8;
}
.rwb-tpl-white .rwb-reg-formcard { border-left: 1px solid var(--rwb-line); }

/* ---- Style: Bold Conversion ----
   Full width black band, Anton at the biggest size the page can carry, and the
   form card lifted up over the join so the button is the first thing under the
   fold. Made for cold traffic that has three seconds of patience. */
.rwb-tpl-bold {
	--rwb-page: #fffdf7;
	--rwb-hero-bg: linear-gradient( 180deg, #17150f 0%, #000000 100% );
	--rwb-badge-bg: #f59e0b;
	--rwb-badge-text: #0a0a0a;
	--rwb-line: #efe2c0;
	--rwb-head-font: 'Anton', 'Outfit', sans-serif;
	--rwb-head-weight: 400;   /* Anton ships one weight; 900 only fakes it */
	--rwb-radius: 10px;
}
.rwb-tpl-bold .rwb-reg-hero { padding: 7vh 6vw 9vh; }
.rwb-tpl-bold .rwb-reg-badge { text-transform: uppercase; letter-spacing: .08em; font-size: 13px; }
.rwb-tpl-bold .rwb-reg-hero h1 { font-size: clamp( 36px, 6.2vw, 74px ); line-height: 1.03; letter-spacing: 0; text-transform: uppercase; }
.rwb-tpl-bold .rwb-reg-sub { font-weight: 500; }
.rwb-tpl-bold .rwb-reg-bullets { display: grid; grid-template-columns: repeat( auto-fit, minmax( 270px, 1fr ) ); gap: 0 28px; max-width: 920px; }
.rwb-tpl-bold .rwb-reg-bullets li { font-size: 18px; font-weight: 600; }
.rwb-tpl-bold .rwb-reg-formcard { position: relative; z-index: 2; max-width: 560px; margin: -56px auto 0; padding: 30px 28px 34px; border: 2px solid #0a0a0a; border-radius: 16px; box-shadow: 0 28px 60px -32px rgba(0,0,0,.75); }
.rwb-tpl-bold .rwb-reg-formcard h2 { font-size: clamp( 24px, 3vw, 32px ); text-transform: uppercase; letter-spacing: .01em; }
.rwb-tpl-bold .rwb-reg-cta { font-size: 20px; padding: 18px; text-transform: uppercase; letter-spacing: .03em; }
.rwb-tpl-bold .rwb-thanks-card { border: 2px solid #0a0a0a; }

/* ---- Style: Warm Editorial ----
   Playfair over cream, hairline rules instead of boxes, presenter set as a
   byline. For coaches and authors, where the story is the offer. */
.rwb-tpl-editorial {
	--rwb-page: #fbf7ef;
	--rwb-hero-bg: linear-gradient( 180deg, #201c15 0%, #12100c 100% );
	--rwb-hero-sub: rgba(245,240,228,.84);
	--rwb-badge-bg: transparent;
	--rwb-badge-text: #e7c67a;
	--rwb-acc-ink: #9a6316;
	--rwb-form-bg: #fffdf8;
	--rwb-card: #fffdf8;
	--rwb-line: #e6dcc6;
	--rwb-input-bd: #ddd0b0;
	--rwb-head-font: 'Playfair Display', Georgia, serif;
	--rwb-head-weight: 800;
	--rwb-radius: 4px;
}
.rwb-tpl-editorial .rwb-reg-hero { padding: 9vh 7vw 8vh; }
.rwb-tpl-editorial .rwb-reg-badge { border: 1px solid rgba(231,198,122,.55); border-radius: 0; text-transform: uppercase; letter-spacing: .2em; font-size: 11px; padding: 7px 16px; }
.rwb-tpl-editorial .rwb-reg-hero h1 { font-size: clamp( 32px, 4.6vw, 58px ); line-height: 1.12; letter-spacing: 0; }
.rwb-tpl-editorial .rwb-reg-bullets { max-width: 680px; }
.rwb-tpl-editorial .rwb-reg-bullets li::before { background: transparent; color: #e7c67a; border: 1px solid rgba(231,198,122,.6); }
.rwb-tpl-editorial .rwb-reg-presenter { margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(231,198,122,.28); }
.rwb-tpl-editorial .rwb-reg-formcard { max-width: 580px; margin: 0 auto; padding: 7vh 6vw 8vh; text-align: center; }
.rwb-tpl-editorial .rwb-reg-formcard h2 { font-size: 30px; font-weight: 800; }
.rwb-tpl-editorial .rwb-reg-formcard form { text-align: left; }
.rwb-tpl-editorial .rwb-reg-quotes blockquote { background: transparent; border-left: 0; border-top: 1px solid var(--rwb-line); border-radius: 0; padding: 18px 0 0; font-style: italic; }

/* ---- Style: Clean Corporate ----
   Navy, Montserrat, square corners and a boxed form. The CTA is deliberately
   blue rather than amber: amber on navy reads as a consumer offer, and this is
   the style people put in front of a procurement team. */
.rwb-tpl-corporate {
	--rwb-page: #f4f6fb;
	--rwb-hero-bg: linear-gradient( 165deg, #123156 0%, #0b1e3a 68% );
	--rwb-hero-sub: rgba(226,240,255,.82);
	--rwb-acc: #1d4ed8;
	--rwb-acc-hover: #1e40af;
	--rwb-acc-on: #ffffff;
	--rwb-acc-soft: rgba(29,78,216,.15);
	--rwb-acc-ink: #1d4ed8;
	--rwb-badge-bg: rgba(56,189,248,.16);
	--rwb-badge-text: #7dd3fc;
	--rwb-tick-bg: #38bdf8;
	--rwb-tick-fg: #06233d;
	--rwb-ok: #1d4ed8;
	--rwb-line: #dbe3ef;
	--rwb-input-bd: #c7d2e4;
	--rwb-radius: 6px;
	--rwb-head-font: 'Montserrat', 'Outfit', sans-serif;
	--rwb-head-weight: 800;
}
.rwb-tpl-corporate .rwb-reg-badge { border-radius: 4px; text-transform: uppercase; font-size: 12px; letter-spacing: .09em; }
.rwb-tpl-corporate .rwb-reg-hero h1 { font-size: clamp( 27px, 3.3vw, 44px ); letter-spacing: -.01em; }
.rwb-tpl-corporate .rwb-reg-bullets li { border-bottom: 1px solid rgba(255,255,255,.1); }
.rwb-tpl-corporate .rwb-reg-formcard { padding: 8vh 4vw; }
.rwb-tpl-corporate .rwb-reg-formcard form { border: 1px solid var(--rwb-line); border-radius: 8px; padding: 24px; background: #ffffff; box-shadow: 0 14px 36px -26px rgba(11,30,58,.7); }
.rwb-tpl-corporate .rwb-thanks-card { border-radius: 8px; }

/* ---- Style: Modern Gradient ----
   Indigo to violet wash with a floating, softly blurred form card. The CTA is a
   gradient of the same two colours, which is the one place a flat amber button
   would look bolted on. */
.rwb-tpl-gradient {
	--rwb-page: #f7f7fd;
	--rwb-hero-bg: linear-gradient( 150deg, #312e81 0%, #4c1d95 46%, #101538 100% );
	--rwb-hero-sub: rgba(237,233,254,.86);
	--rwb-acc: #6366f1;
	--rwb-acc-hover: #4f46e5;
	--rwb-acc-on: #ffffff;
	--rwb-acc-soft: rgba(99,102,241,.18);
	--rwb-acc-ink: #4338ca;
	--rwb-badge-bg: rgba(255,255,255,.16);
	--rwb-badge-text: #ede9fe;
	--rwb-tick-bg: #a78bfa;
	--rwb-tick-fg: #1b1035;
	--rwb-ok: #8b5cf6;
	--rwb-line: #e4e2f5;
	--rwb-input-bd: #d6d3ee;
	--rwb-radius: 14px;
}
.rwb-tpl-gradient .rwb-reg-cta { background: linear-gradient( 96deg, #6366f1 0%, #a855f7 100% ); }
.rwb-tpl-gradient .rwb-reg-cta:hover { background: linear-gradient( 96deg, #4f46e5 0%, #9333ea 100% ); filter: brightness( 1.04 ); }
.rwb-tpl-gradient .rwb-reg-formcard form { background: rgba(255,255,255,.92); border: 1px solid var(--rwb-line); border-radius: 18px; padding: 26px; box-shadow: 0 26px 60px -32px rgba(76,29,149,.6); }
.rwb-tpl-gradient .rwb-thanks-card { border-radius: 22px; box-shadow: 0 26px 70px -34px rgba(76,29,149,.6); }

/* ---- Style: Spacious Premium ----
   Deep green band, an Oswald eyebrow, underlined fields and a square button.
   Almost all of the design is the space between things, which is what makes a
   high ticket page feel expensive instead of loud. */
.rwb-tpl-premium {
	--rwb-page: #f6f7f4;
	--rwb-hero-bg: linear-gradient( 170deg, #08281d 0%, #04170f 72% );
	--rwb-hero-sub: rgba(236,253,245,.82);
	--rwb-acc-ink: #0f6f4f;
	--rwb-badge-bg: transparent;
	--rwb-badge-text: #6ee7b7;
	--rwb-tick-bg: #34d399;
	--rwb-tick-fg: #04170f;
	--rwb-ok: #059669;
	--rwb-line: #dfe5e0;
	--rwb-input-bd: #c8d1ca;
	--rwb-head-weight: 600;
	--rwb-radius: 2px;
}
.rwb-tpl-premium .rwb-reg-hero { padding: 13vh 8vw 12vh; }
.rwb-tpl-premium .rwb-reg-badge { font-family: 'Oswald', 'Outfit', sans-serif; border: 1px solid rgba(110,231,183,.45); border-radius: 0; text-transform: uppercase; letter-spacing: .3em; font-size: 11px; padding: 8px 18px 8px 22px; }
.rwb-tpl-premium .rwb-reg-hero h1 { font-size: clamp( 30px, 4.2vw, 54px ); line-height: 1.16; letter-spacing: -.005em; }
.rwb-tpl-premium .rwb-reg-sub { margin-bottom: 34px; }
.rwb-tpl-premium .rwb-reg-bullets { max-width: 620px; }
.rwb-tpl-premium .rwb-reg-bullets li { padding-top: 12px; padding-bottom: 12px; }
.rwb-tpl-premium .rwb-reg-formcard { max-width: 520px; margin: 0 auto; padding: 9vh 6vw 10vh; }
.rwb-tpl-premium .rwb-reg-formcard h2 { font-size: 24px; font-weight: 600; letter-spacing: .01em; }
.rwb-tpl-premium .rwb-f input { border-width: 0 0 1px; border-radius: 0; padding: 14px 2px; background: transparent; }
.rwb-tpl-premium .rwb-f input:focus { box-shadow: none; border-bottom-color: var(--rwb-acc); }
.rwb-tpl-premium .rwb-reg-cta { padding: 18px; font-size: 15px; text-transform: uppercase; letter-spacing: .08em; }
.rwb-tpl-premium .rwb-thanks-card { border-radius: 2px; }

/* ---- Style: Minimal ----
   One narrow column and no hero band at all, on purpose: when the link comes
   out of an email the reader is already sold and only needs the form. */
.rwb-tpl-minimal {
	--rwb-page: #fafaf9;
	--rwb-page-text: #1a1a1a;
	--rwb-hero-bg: transparent;
	--rwb-hero-text: #1a1a1a;
	--rwb-hero-sub: #5b5b57;
	--rwb-form-bg: transparent;
	--rwb-form-text: #1a1a1a;
	--rwb-badge-bg: #eef2ff;
	--rwb-badge-text: #4338ca;
	--rwb-acc-ink: #4338ca;
	--rwb-line: #e5e5e1;
	--rwb-input-bd: #d9d9d4;
}
/* Wide on desktop: the old 640px cap wrapped the copy into a narrow column
   and pushed the form below the fold (tester report). Same minimalist look,
   just given room; small screens are untouched by the cap either way. */
.rwb-tpl-minimal .rwb-reg-wrap { max-width: 980px; margin: 0 auto; }
.rwb-tpl-minimal .rwb-reg-hero { padding-bottom: 2vh; }
.rwb-tpl-minimal .rwb-reg-formcard { max-width: 560px; margin: 0 auto; width: 100%; }
.rwb-tpl-minimal .rwb-reg-formcard { padding-top: 0; }
.rwb-tpl-minimal .rwb-reg-bullets li::before { background: #4338ca; color: #ffffff; }

/* Phones. The grid collapses to one column on its own; these are the pieces
   that need a real decision at that width rather than just a narrower box. */
@media ( max-width: 900px ) {
	.rwb-tpl-dark .rwb-reg-formcard, .rwb-tpl-white .rwb-reg-formcard { border-left: 0; border-top: 1px solid var(--rwb-line); }
	.rwb-tpl-bold .rwb-reg-hero { padding-bottom: 7vh; }
	.rwb-tpl-bold .rwb-reg-formcard { margin: -34px 16px 0; }
	.rwb-tpl-editorial .rwb-reg-hero { padding: 7vh 7vw 6vh; }
	.rwb-tpl-premium .rwb-reg-hero { padding: 9vh 7vw 8vh; }
	.rwb-tpl-editorial .rwb-reg-formcard, .rwb-tpl-premium .rwb-reg-formcard { padding: 6vh 7vw 8vh; }
	.rwb-tpl-corporate .rwb-reg-formcard form, .rwb-tpl-gradient .rwb-reg-formcard form { padding: 20px; }
	.rwb-thanks-card { padding: 36px 24px; }
}

/* ============ Thanks ============
   Same body class as the registration page, so it inherits the same palette and
   a style is finished on both pages or on neither. */
.rwb-thanks-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 5vw; }
.rwb-thanks-card { max-width: 560px; text-align: center; background: var(--rwb-card); color: var(--rwb-form-text); border: 1px solid var(--rwb-line); border-radius: 20px; padding: 48px 40px; box-shadow: 0 20px 60px -32px rgba(0,0,0,.4); }
.rwb-thanks-check { width: 72px; height: 72px; margin: 0 auto 20px; background: var(--rwb-ok); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 40px; font-weight: 900; }
.rwb-thanks-card h1 { font-family: var(--rwb-head-font); font-size: clamp( 26px, 3.4vw, 34px ); font-weight: var(--rwb-head-weight); margin: 0 0 12px; }
.rwb-thanks-when { font-size: 18px; margin: 0 0 16px; }
.rwb-thanks-when b { color: var(--rwb-acc-ink); }
.rwb-ics { display: inline-block; margin-bottom: 20px; font-weight: 700; color: var(--rwb-acc-ink); text-decoration: none; border-bottom: 1px dashed currentColor; }
.rwb-thanks-note { opacity: .8; font-size: 15px; margin: 0 0 24px; }

/* ============ Room ============ */
.rwb-room-body { background: #0a0a0a; color: #fafaf9; overflow: hidden; }
.rwb-room { display: grid; grid-template-columns: 1fr 340px; height: 100vh; }
.rwb-room-solo { grid-template-columns: 1fr; }
/* Host-preview banner: pinned so it can never be mistaken for the visitor view. */
.rwb-hostnote { position: fixed; top: 0; left: 0; right: 0; z-index: 50; background: #f59e0b; color: #0a0a0a; font-weight: 700; font-size: 13px; padding: 8px 14px; text-align: center; }
.rwb-hostnote ~ .rwb-room { padding-top: 34px; box-sizing: border-box; }
@media ( max-width: 820px ) { .rwb-room { grid-template-columns: 1fr; grid-template-rows: auto 1fr; height: auto; min-height: 100vh; } }
.rwb-room-main { display: flex; align-items: center; justify-content: center; background: #000; padding: 16px; }
.rwb-stage-wrap { position: relative; width: 100%; max-width: 1280px; aspect-ratio: 16 / 9; background: #000; border-radius: 12px; overflow: hidden; }
.rwb-stage-wrap canvas, .rwb-stage-wrap video, .rwb-live-mount { position: absolute; inset: 0; width: 100%; height: 100%; }
.rwb-stage-wrap canvas, .rwb-stage-wrap video { object-fit: contain; }
.rwb-live-iframe { width: 100%; height: 100%; border: 0; }
.rwb-live-waiting { display: flex; align-items: center; justify-content: center; height: 100%; opacity: .7; }

.rwb-stage-overlay { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; background: radial-gradient( circle at center, rgba(20,18,12,.6), rgba(0,0,0,.88) ); }
.rwb-enter-btn { background: #f59e0b; color: #0a0a0a; font-weight: 800; font-size: 20px; padding: 16px 40px; border: none; border-radius: 99px; cursor: pointer; text-decoration: none; box-shadow: 0 10px 30px -8px rgba(245,158,11,.8); }
.rwb-enter-btn:hover { background: #d97706; }
.rwb-countdown { font-size: clamp( 32px, 6vw, 64px ); font-weight: 900; letter-spacing: .02em; font-variant-numeric: tabular-nums; color: #f59e0b; }
.rwb-ended { text-align: center; }
.rwb-ended h2 { font-size: 30px; font-weight: 900; margin: 0 0 18px; }

.rwb-offer-box { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; background: linear-gradient( to top, rgba(10,10,10,.96), rgba(10,10,10,.82) ); padding: 20px 24px; animation: rwb-slide-up .4s ease; }
@keyframes rwb-slide-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
.rwb-offer-inner { max-width: 900px; margin: 0 auto; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.rwb-offer-inner h3 { margin: 0; font-size: 22px; font-weight: 800; }
.rwb-offer-inner p { margin: 0; opacity: .85; }
.rwb-offer-cd { font-weight: 800; color: #fca5a5; font-variant-numeric: tabular-nums; }
.rwb-offer-cta { margin-left: auto; background: #f59e0b; color: #0a0a0a; font-weight: 800; padding: 14px 30px; border-radius: 12px; text-decoration: none; box-shadow: 0 8px 24px -8px rgba(245,158,11,.8); }
.rwb-offer-cta:hover { background: #d97706; }
/* Offer placed below the stage instead of over it. */
.rwb-offer-box.rwb-offer-below { position: static; border-radius: 12px; margin-top: 12px; width: 100%; max-width: 900px; animation: rwb-slide-up .4s ease; }
.rwb-room-main.rwb-main-stack { flex-direction: column; }

/* Chat rail */
.rwb-room-side { display: flex; flex-direction: column; background: #12110c; border-left: 1px solid rgba(255,255,255,.06); min-height: 0; }
.rwb-room-head { display: flex; align-items: center; gap: 8px; padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,.06); font-weight: 700; font-size: 14px; }
.rwb-live-dot { width: 10px; height: 10px; border-radius: 50%; background: #6b7280; }
.rwb-live-dot.live { background: #ef4444; box-shadow: 0 0 0 0 rgba(239,68,68,.6); animation: rwb-pulse 1.6s infinite; }
.rwb-live-dot.soon { background: #f59e0b; }
.rwb-live-dot.ended { background: #6b7280; }
@keyframes rwb-pulse { 0% { box-shadow: 0 0 0 0 rgba(239,68,68,.6); } 70% { box-shadow: 0 0 0 8px rgba(239,68,68,0); } 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); } }
.rwb-attendees { margin-left: auto; opacity: .7; font-weight: 600; }
.rwb-chat { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.rwb-chat-log { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.rwb-chat-msg { font-size: 14px; line-height: 1.4; }
.rwb-chat-msg b { color: #f59e0b; font-weight: 700; margin-right: 6px; }
.rwb-chat-msg.host b { color: #38bdf8; }
.rwb-chat-form { display: flex; gap: 8px; padding: 12px 14px; border-top: 1px solid rgba(255,255,255,.06); }
.rwb-chat-form input { flex: 1; background: #1c1a14; border: 1px solid #3a352a; border-radius: 10px; padding: 10px 12px; color: #fafaf9; font-family: inherit; }
.rwb-chat-form input:focus { outline: none; border-color: #f59e0b; }
.rwb-chat-form button { background: #f59e0b; color: #0a0a0a; border: none; border-radius: 10px; width: 44px; font-size: 16px; cursor: pointer; }
.rwb-chat-form button:hover { background: #d97706; }

.rwb-chat-closed { padding: 14px 16px; border-top: 1px solid rgba(255,255,255,.06); font-size: 12.5px; color: #9a9384; text-align: center; }

/* Host-pinned message above the chat */
.rwb-pinned { background: rgba(245,158,11,.16); border-bottom: 1px solid rgba(245,158,11,.4); padding: 9px 14px; font-size: 12.5px; color: #fde68a; line-height: 1.45; }
.rwb-pinned b { display: block; color: #fcd34d; margin-bottom: 2px; }

/* Live poll card */
.rwb-poll { background: linear-gradient( 180deg, rgba(245,158,11,.16), rgba(245,158,11,.06) ); border-bottom: 1px solid rgba(245,158,11,.35); padding: 12px 14px; animation: rwb-slidein .35s ease; }
@keyframes rwb-slidein { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.rwb-poll-q { font-size: 13.5px; font-weight: 700; color: #fde68a; line-height: 1.35; margin-bottom: 9px; }
.rwb-poll-opts { display: flex; flex-direction: column; gap: 6px; }
.rwb-poll-opt { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: 9px; padding: 9px 11px; color: #fafaf9; font-family: inherit; font-size: 13px; text-align: left; cursor: pointer; transition: background .12s ease, border-color .12s ease, transform .12s ease; }
.rwb-poll-opt:hover:not(:disabled) { background: rgba(245,158,11,.24); border-color: #f59e0b; transform: translateX(2px); }
.rwb-poll-opt:disabled { cursor: default; opacity: .75; }
.rwb-poll-opt.chosen { background: rgba(245,158,11,.34); border-color: #f59e0b; opacity: 1; }
.rwb-poll-res { position: relative; border-radius: 8px; background: rgba(255,255,255,.05); margin-bottom: 5px; padding: 7px 10px; overflow: hidden; display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.rwb-poll-bar { position: absolute; left: 0; top: 0; bottom: 0; background: rgba(245,158,11,.3); transition: width .5s ease; }
.rwb-poll-res.mine .rwb-poll-bar { background: rgba(245,158,11,.55); }
.rwb-poll-lbl { position: relative; flex: 1; color: #fafaf9; }
.rwb-poll-res.mine .rwb-poll-lbl { font-weight: 700; }
.rwb-poll-pct { position: relative; font-weight: 800; color: #fde68a; }
.rwb-poll-total { font-size: 11.5px; color: #a89f8c; margin-top: 4px; }
.rwb-poll-thanks { font-size: 12.5px; color: #fde68a; }

/* Handouts released into the room */
.rwb-res { padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,.06); background: rgba(56,189,248,.07); }
.rwb-res.arrived { animation: rwb-slidein .4s ease; }
.rwb-res-head { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #7dd3fc; margin-bottom: 6px; }
.rwb-res-link { display: block; font-size: 13px; color: #bae6fd; text-decoration: none; padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,.05); }
.rwb-res-link:last-child { border-bottom: none; }
.rwb-res-link:hover { color: #fff; text-decoration: underline; }
.rwb-res-link::before { content: '↓ '; opacity: .7; }

/* Join notices, kept quiet so they never fight with real conversation */
.rwb-chat-join { font-size: 12px; color: #9a9384; font-style: italic; }

/* The host is typing */
.rwb-typing { display: flex; align-items: center; gap: 4px; padding: 4px 16px 8px; font-size: 12px; color: #9a9384; }
.rwb-typing span { width: 5px; height: 5px; border-radius: 50%; background: #38bdf8; animation: rwb-dot 1.2s infinite; }
.rwb-typing span:nth-child(2) { animation-delay: .18s; }
.rwb-typing span:nth-child(3) { animation-delay: .36s; margin-right: 4px; }
@keyframes rwb-dot { 0%, 60%, 100% { opacity: .25; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

/* Reaction bar */
.rwb-rx { display: flex; gap: 4px; padding: 8px 12px 0; flex-wrap: wrap; }
.rwb-rx-btn { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 9px; padding: 5px 7px; font-size: 15px; line-height: 1; cursor: pointer; transition: transform .12s ease, background .12s ease; }
.rwb-rx-btn:hover { background: rgba(245,158,11,.2); border-color: rgba(245,158,11,.5); transform: translateY(-2px); }
.rwb-rx-btn.pop { animation: rwb-pop .32s ease; }
@keyframes rwb-pop { 50% { transform: scale(1.35) translateY(-4px); } }
.rwb-rx-btn.hand { margin-left: auto; }
.rwb-rx-btn.hand.raised { background: rgba(56,189,248,.22); border-color: rgba(56,189,248,.6); }

/* Floating reactions over the chat column */
.rwb-floats { position: fixed; right: 0; bottom: 88px; width: 340px; height: 55vh; pointer-events: none; overflow: hidden; z-index: 5; }
@media ( max-width: 820px ) { .rwb-floats { width: 100%; height: 40vh; } }
.rwb-float { position: absolute; bottom: 0; opacity: 0; animation-name: rwb-rise; animation-timing-function: ease-out; animation-fill-mode: forwards; }
@keyframes rwb-rise {
	0% { opacity: 0; transform: translateY(0) scale(.6); }
	12% { opacity: 1; transform: translateY(-24px) scale(1); }
	60% { opacity: 1; transform: translateY(-140px) translateX(-18px) scale(1.05); }
	100% { opacity: 0; transform: translateY(-260px) translateX(14px) scale(.9); }
}

/* Question mode */
.rwb-ask-toggle { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.1) !important; color: #cfc9ba !important; width: 40px !important; }
.rwb-ask-toggle:hover { background: rgba(56,189,248,.18) !important; }
.rwb-ask-toggle.on { background: #38bdf8 !important; color: #06121a !important; border-color: #38bdf8 !important; }
.rwb-chat.asking .rwb-chat-form input:focus { border-color: #38bdf8; }
.rwb-ask-note { padding: 0 16px 10px; font-size: 12px; color: #7dd3fc; }

/* Registration: advanced blocks */
.rwb-reg-logo { max-height: 54px; width: auto; margin: 0 0 18px; display: block; }
.rwb-reg-video { position: relative; width: 100%; aspect-ratio: 16/9; margin: 22px 0; border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 20px 50px -20px rgba(0,0,0,.55); }
.rwb-reg-video iframe, .rwb-reg-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.rwb-reg-presenter em { display: block; font-style: normal; font-size: 12.5px; opacity: .72; }
/* Padding rather than a bare margin: testimonials are a full width grid item on
   the stacked styles and a column item on the split ones, and with no padding
   they ran into the edge of the screen on both. */
.rwb-reg-quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin: 0; padding: 6px 6vw 40px; }
.rwb-reg-quotes blockquote { margin: 0; padding: 18px 20px; border-radius: var(--rwb-radius); background: rgba(127,127,127,.08); border-left: 3px solid var(--rwb-acc); }
.rwb-reg-quotes p { margin: 0 0 8px; font-size: 14.5px; line-height: 1.6; }
.rwb-reg-quotes cite { font-style: normal; font-weight: 700; font-size: 12.5px; opacity: .75; }

/* ============ Powered by ============
   On the normal pages it sits under the content. The room is a locked, full
   height layout with its own scrolling, so there it floats quietly in the
   corner instead of fighting the grid. */
.rwb-powered { text-align: center; padding: 22px 16px 26px; font-size: 12.5px; opacity: .6; }
.rwb-powered a { text-decoration: none; color: inherit; }
.rwb-powered a:hover { opacity: 1; }
.rwb-powered b { font-weight: 800; }
/* Takes the accent from whichever style the page is in, so a new style never
   arrives with a credit line in somebody else's colour. */
.rwb-powered b { color: var(--rwb-acc-ink); }
.rwb-room-body .rwb-powered b { color: #f59e0b; }
.rwb-room-body .rwb-powered { position: fixed; left: 14px; bottom: 10px; padding: 0; z-index: 7; font-size: 11.5px; opacity: .45; pointer-events: auto; }
.rwb-room-body .rwb-powered:hover { opacity: .9; }
@media ( max-width: 820px ) { .rwb-room-body .rwb-powered { position: static; text-align: center; padding: 14px 0 18px; } }