/* Webinar landing page (/webinars/). Loaded only on that page and scoped to body.hxn-wlp, so the
   rest of the site, the masterclass page and the shared checkout popup elsewhere are untouched.
   Two designs from one document:
   - Phones (default): an app screen. Slim app bar, a hero that carries the four facts and one
     button, a feed of rounded cards, a docked bottom bar and a bottom-sheet checkout.
   - Desktop (1024px and up): an event page. Nav bar with its own button, a split-screen hero, the
     story on the left with a booking card pinned on the right, and a full-width closing band. */
.hxn-wlp{
	--w-navy:#16184A; --w-ink:#0B0C1F; --w-bg:#F3EFE8; --w-paper2:#EAE3D6; --w-card:#fff;
	--w-gold:#E8B04B; --w-gold-soft:#FBEBC8; --w-gold-ink:#7A5310; --w-red:#E5484D;
	--w-text:#1E2033; --w-muted:#5E6176; --w-line:rgba(22,24,74,.09);
	--w-shadow:0 1px 2px rgba(11,12,31,.04),0 6px 20px rgba(11,12,31,.06);
	--w-r:24px;
	/* Light only. Dark mode works by flipping these theme tokens on <html>, so pinning them here keeps
	   the shared checkout and the footer readable even if a saved dark choice gets through. */
	--paper:#fff; --soft:#f5f6fb; --ink:#16161e; --black:#0c0c14; --line:#e8e9f0; --muted:#5e6473;
	--shadow:0 14px 44px rgba(12,12,30,.12);
	background:var(--w-bg); color:var(--w-text);
}
html[data-theme="dark"] body.hxn-wlp{background:var(--w-bg);color:var(--w-text)}
.hxn-wlp #main{background:var(--w-bg)}
/* The page carries its own bar, and has no dark mode to switch to. */
.hxn-wlp .site-header,.hxn-wlp .theme-toggle{display:none}
.hxn-wlp #hxn-proof{display:none !important}

.w-app{max-width:560px;margin:0 auto;padding:0 12px 16px}
.w-app h1,.w-app h2,.w-app h3{font-family:Poppins,system-ui,sans-serif;color:var(--w-ink);letter-spacing:-.02em;text-wrap:balance;margin:0}
.w-app p{margin:0}
.w-app ul,.w-app ol{margin:0;padding:0;list-style:none}
.w-aside,.w-pill-d,.hxn-wlp .w-bar a.w-bar-cta{display:none}

/* ---- app bar ---- */
.w-bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;margin:0 -12px;background:rgba(243,239,232,.88);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px)}
.w-bar-in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px}
.w-bar-logo img{height:26px;width:auto;display:block}
.w-pill{display:inline-flex;align-items:center;gap:7px;font:600 12.5px/1 Inter,system-ui,sans-serif;color:var(--w-navy);background:var(--w-card);border:1px solid var(--w-line);padding:8px 12px;border-radius:999px;white-space:nowrap}
.w-live{display:inline-block;flex:0 0 7px;width:7px;height:7px;border-radius:50%;background:var(--w-red);box-shadow:0 0 0 3px rgba(229,72,77,.18);animation:wPulse 1.8s infinite}
@keyframes wPulse{50%{box-shadow:0 0 0 6px rgba(229,72,77,0)}}

/* ---- shared card + type ---- */
.w-sec{background:var(--w-card);border-radius:var(--w-r);padding:22px 18px;margin-top:12px;box-shadow:var(--w-shadow)}
.w-sec h2{font-size:clamp(22px,6.2vw,30px);line-height:1.15;font-weight:700}
.w-kick{font:700 11.5px/1.2 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--w-gold-ink);margin-bottom:8px !important;text-wrap:balance}
.w-sub{color:var(--w-muted);font-size:15px;line-height:1.5;margin-top:8px !important}
.hxn-wlp a.w-cta,.w-player,.w-step,.w-faq summary{transition:transform .12s ease}

/* ---- hero ---- */
/* Kept tight so the reserve button makes the first screen of a phone, browser bars included. */
.hxn-wlp .hero.w-hero{background:none;color:inherit;overflow:visible;padding:4px 4px 0;display:grid;gap:8px}
.hxn-wlp .hero.w-hero::before,.hxn-wlp .hero.w-hero::after{content:none;display:none}
.w-hero-t{display:grid;gap:10px}
.w-photo{position:relative;margin:0;border-radius:var(--w-r);overflow:hidden;aspect-ratio:16/7;background:#222;box-shadow:var(--w-shadow)}
.w-photo picture,.w-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block}
.w-photo figcaption{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:9px;background:rgba(11,12,31,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;border-radius:14px;padding:7px 12px 7px 7px;font-size:12px;line-height:1.25}
.w-photo figcaption b{display:block;font-size:14px;font-weight:600}
.w-photo .w-mark{width:36px;height:28px;border-radius:9px;background:var(--w-navy);display:grid;place-items:center}
.w-photo .w-mark img{width:25px;height:auto}
.w-eyebrow{font:700 12px/1.2 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--w-gold-ink);margin-bottom:-6px !important}
.hxn-wlp .w-hero h1{font-size:clamp(28px,8.2vw,50px);line-height:1.04;font-weight:700;color:var(--w-ink)}
.w-hero h1 em{font-style:normal;color:var(--w-navy);background:linear-gradient(transparent 62%,var(--w-gold-soft) 62%)}
.w-hook{font-size:15px;line-height:1.4;color:var(--w-text)}
.w-trust{text-align:center;font-size:13px;font-weight:600;color:var(--w-navy);margin-top:-4px !important;text-wrap:balance}

/* the four facts: the most visible thing on the page */
.w-ticket{display:grid;grid-template-columns:1fr 1fr;background:var(--w-navy);border-radius:18px;overflow:hidden;box-shadow:0 10px 26px rgba(22,24,74,.2)}
.w-ticket > div{padding:12px 16px 13px;border-color:rgba(255,255,255,.12);border-style:solid;border-width:0}
.w-ticket > div:nth-child(odd){border-right-width:1px}
.w-ticket > div:nth-child(-n+2){border-bottom-width:1px}
.w-ticket small{display:block;font-size:10.5px;line-height:1.3;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#A9ABD6}
/* sized to the screen so "Live on Zoom" stays on one line; the closing card has narrower cells and steps down further (see "final" below) */
.w-ticket b{display:block;font:700 clamp(17px,5vw,22px)/1.1 Poppins,system-ui,sans-serif;color:#fff;margin-top:5px;font-variant-numeric:tabular-nums}
.w-ticket .w-fee b{color:var(--w-gold)}
.w-ticket--soon{grid-template-columns:1fr}
.w-ticket--soon > div{border:0 !important}
/* No price, no Fee cell: Where takes the whole second row instead of leaving an empty navy quarter.
   Phones and the small-laptop hero only; elsewhere the ticket is a single row and three cells sit fine. */
@media (max-width:1023px){.w-ticket > div:nth-child(3):last-child{grid-column:1 / -1;border-right-width:0 !important}}
@media (min-width:1024px) and (max-width:1219px){.w-hero .w-ticket > div:nth-child(3):last-child{grid-column:1 / -1}}

.hxn-wlp a.w-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:0;border-radius:16px;background:var(--w-gold);color:var(--w-ink);font:700 17px/1 Inter,system-ui,sans-serif;padding:19px 18px;box-shadow:0 10px 24px rgba(232,176,75,.35);text-decoration:none}
.hxn-wlp a.w-cta:active,button.w-player:active,.w-step:active,.w-faq summary:active{transform:scale(.97)}
.hxn-wlp a.w-cta i{display:none}
.w-fine{text-align:center;font-size:13px;line-height:1.4;color:var(--w-muted);margin-top:-4px !important}
.w-mid{margin-top:18px}

/* ---- lists as grouped rows ---- */
.w-list{margin-top:14px !important;display:grid;border-top:1px solid var(--w-line)}
.w-list li{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--w-line)}
.w-list li > span:last-child{display:grid;gap:3px;font-size:14px;line-height:1.4;color:var(--w-muted)}
.w-list li b{font:600 16px/1.35 Inter,system-ui,sans-serif;color:var(--w-ink)}
.w-ic{flex:0 0 28px;height:28px;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.w-ic svg{width:14px;height:14px;fill:none;stroke-width:3}
.w-no .w-ic{background:#FBE3E4}.w-no .w-ic svg{stroke:#C2262E}
.w-yes .w-ic,.w-lcard .w-ic{background:var(--w-gold-soft)}.w-yes .w-ic svg,.w-lcard .w-ic svg{stroke:var(--w-gold-ink)}
.w-punch{margin-top:16px !important;font:700 19px/1.3 Poppins,system-ui,sans-serif;color:var(--w-navy);text-wrap:balance}

/* ---- learn: small tiles ---- */
.w-learn{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.w-lcard{background:var(--w-bg);border-radius:18px;padding:14px;display:grid;gap:6px;align-content:start}
.w-lcard .w-ic{justify-self:start;width:28px}
.w-lcard b{font:600 15px/1.3 Poppins,system-ui,sans-serif;color:var(--w-ink)}
.w-lcard > span:last-child{font-size:13px;line-height:1.4;color:var(--w-muted)}

/* ---- the path: webinar, masterclass, Coffee Circle ---- */
.w-path{display:grid;gap:10px;margin-top:14px !important}
.w-step{position:relative;display:grid;gap:5px;background:var(--w-bg);border-radius:18px;padding:16px;overflow:hidden;align-content:start}
.w-step img{width:calc(100% + 32px);max-width:none;margin:-16px -16px 8px;aspect-ratio:16/8;object-fit:cover;display:block}
.w-step b{font:700 17px/1.25 Poppins,system-ui,sans-serif;color:var(--w-ink)}
.w-step > span:last-child{font-size:14px;line-height:1.45;color:var(--w-muted)}
.w-badge{justify-self:start;font:700 11.5px/1.25 Inter,system-ui,sans-serif;padding:5px 10px;border-radius:999px;background:var(--w-paper2);color:var(--w-navy)}
.w-step--now{background:var(--w-navy)}
.w-step--now b{color:#fff}.w-step--now > span:last-child{color:#C5C7DA}
.w-step--now .w-badge{background:var(--w-gold);color:var(--w-ink)}
.w-step--gold .w-badge{background:var(--w-gold-soft);color:var(--w-gold-ink)}
.w-step--lock .w-badge{background:var(--w-ink);color:#fff}

/* ---- start-here band ---- */
.w-band{margin-top:12px;background:var(--w-gold-soft);border:1px solid #F1D79A;border-radius:var(--w-r);padding:20px 18px;display:grid;gap:14px}
.w-band b{display:block;font:700 19px/1.25 Poppins,system-ui,sans-serif;color:var(--w-ink)}
.w-band span{display:block;font-size:15px;line-height:1.45;color:var(--w-gold-ink);margin-top:4px}
.hxn-wlp .w-band a.w-cta{background:var(--w-navy);color:#fff;box-shadow:0 10px 24px rgba(22,24,74,.25)}

/* ---- don't miss it ---- */
.w-fomo{margin-top:12px;background:var(--w-navy);color:#E8E9F2;border-radius:var(--w-r);padding:24px 18px;display:grid;gap:14px}
.w-fomo .w-kick{color:var(--w-gold);margin-bottom:-6px !important}
.w-fomo h2{color:#fff;font-size:clamp(24px,6.8vw,34px);line-height:1.12}
.w-fomo ul{display:grid;gap:10px}
.w-fomo li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.4;color:#E8E9F2}
.w-fomo li::before{content:"";flex:0 0 8px;height:8px;border-radius:50%;background:var(--w-red);margin-top:7px;box-shadow:0 0 0 3px rgba(229,72,77,.22)}

/* ---- video ---- */
.w-video{margin-top:12px;padding:24px 18px;background:var(--w-ink);color:#E8E9F2;border-radius:var(--w-r)}
.w-video .w-kick{color:var(--w-gold)}
.w-video h2{color:#fff;font-size:clamp(26px,7.4vw,40px);line-height:1.1}
.w-video .w-sub{color:#C5C7DA}
.w-video .w-note{font-size:12.5px;line-height:1.45;color:#8E91AE;margin-top:10px !important}
.w-player{position:relative;display:block;width:100%;max-width:360px;margin:18px auto 0;aspect-ratio:9/16;max-height:72svh;border:0;padding:0;border-radius:20px;overflow:hidden;background:#000;cursor:pointer;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.w-player img,.w-player video{width:100%;height:100%;object-fit:cover;display:block}
/* after the first tap the button is swapped for a plain wrapper around the video */
.w-player--on{cursor:auto}
.w-player .w-play{position:absolute;inset:0;margin:auto;width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.95);display:grid;place-items:center;box-shadow:0 8px 30px rgba(0,0,0,.35)}
.w-player .w-play svg{width:30px;height:30px;fill:var(--w-ink);margin-left:5px}
.w-player .w-tag{position:absolute;left:12px;right:12px;bottom:12px;text-align:left;color:#fff;font-size:13px;line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.w-player .w-tag b{display:block;font:600 16px/1.2 Poppins,sans-serif}

/* ---- swipe rails ---- */
.w-rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:14px -18px 0;padding:2px 18px 8px;scrollbar-width:none;overscroll-behavior-x:contain;scroll-padding-inline:18px}
.w-rail::-webkit-scrollbar{display:none}
.w-rail > *{scroll-snap-align:start;flex:0 0 78%;margin:0}
.w-rail--wide > *{flex-basis:88%}
.w-shot{border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:#111}
.w-shot img{width:100%;height:100%;object-fit:cover;display:block}
.w-msg{flex-basis:64%;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--w-line)}
.w-msg img{width:100%;height:320px;object-fit:cover;object-position:top;display:block}
.w-dots{display:flex;gap:5px;justify-content:center;margin-top:6px}
.w-dots i{width:6px;height:6px;border-radius:9px;background:#CFD0DD;transition:width .2s}
.w-dots i.on{width:18px;background:var(--w-navy)}

/* ---- host ---- */
.w-hostsec{display:grid;gap:16px}
.w-host-img{width:100%;max-width:none;aspect-ratio:1;max-height:340px;object-fit:cover;object-position:50% 20%;border-radius:18px;display:block}
.w-hostsec h2{font-size:28px}
.w-creds{display:grid;gap:9px;margin-top:14px !important}
.w-creds li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.4;font-weight:500;color:var(--w-ink)}
.w-creds li::before{content:"";flex:0 0 8px;height:8px;border-radius:50%;background:var(--w-gold);margin-top:6px}
.w-said{margin-top:16px !important;font:italic 600 19px/1.35 Poppins,sans-serif;color:var(--w-navy)}

/* ---- faq ---- */
.w-faq{margin-top:10px;border-top:1px solid var(--w-line)}
.w-faq details{border-bottom:1px solid var(--w-line)}
.w-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 0;font:600 15.5px/1.35 Inter,sans-serif;color:var(--w-ink)}
.w-faq summary::-webkit-details-marker{display:none}
.w-faq summary::after{content:"";flex:0 0 9px;height:9px;border-right:2px solid #9A9CB0;border-bottom:2px solid #9A9CB0;transform:rotate(45deg);margin-top:-4px;transition:transform .2s}
.w-faq details[open] summary::after{transform:rotate(225deg);margin-top:4px}
.w-faq details p{padding:0 0 16px;color:var(--w-muted);font-size:15px;line-height:1.5}

/* ---- final ---- */
.w-final{text-align:center;display:grid;gap:14px}
.w-final .w-kick{margin-bottom:-6px !important;color:#C2262E}
.w-final .w-ticket{text-align:left}
.w-final .w-ticket b{font-size:clamp(16px,4.6vw,22px)}
.w-closed{display:grid;gap:10px;text-align:center}

/* ---- docked bottom bar: up only with .w-on, which the page script sets while the hero's own button is
   off screen and #register is not in view. main.js still toggles its .show here; that no longer decides. ---- */
.hxn-wlp .sticky-cta,.hxn-wlp .sticky-cta.show{transform:translateY(110%)}
.hxn-wlp .sticky-cta.w-on{transform:none}
.hxn-wlp .sticky-cta{background:rgba(255,255,255,.96);border-top:0;border-radius:22px 22px 0 0;box-shadow:0 -8px 30px rgba(11,12,31,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.hxn-wlp .sticky-cta__inner{max-width:560px;margin:0 auto;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));gap:12px}
.w-dock-t{flex:1;min-width:0;line-height:1.25}
.w-dock-t small{display:block;font-size:12px;color:var(--w-muted);font-weight:500}
.w-dock-t b{display:block;font:700 16px/1.2 Poppins,sans-serif;color:var(--w-ink)}
.hxn-wlp .sticky-cta a.w-cta{width:auto;padding:14px 20px;font-size:15px;box-shadow:none;flex:0 0 auto}

/* ---- the shared checkout popup, as a bottom sheet on this page only ---- */
/* min-height and display undo theme.css's full-screen phone panel, so the sheet sits at the bottom with
   the dimmed page above it (a tap there closes it) and anything taller scrolls inside the sheet. */
.hxn-wlp .cobuy{align-items:flex-end;padding:0}
.hxn-wlp .cobuy__panel{width:min(520px,100%);margin:0 auto;min-height:0;display:block;border-radius:24px 24px 0 0;background:#fff;color:var(--w-text);padding:26px 20px calc(20px + env(safe-area-inset-bottom,0px));max-height:94svh;overflow:auto;animation:wSheet .25s cubic-bezier(.2,.8,.2,1)}
@keyframes wSheet{from{transform:translateY(40px);opacity:.5}}
.hxn-wlp .cobuy__lock,.hxn-wlp .cobuy__perks,.hxn-wlp .cobuy__optional,.hxn-wlp .cobuy__reassure{display:none}
.hxn-wlp .cobuy__close{width:44px;height:44px;top:8px;right:10px}
.hxn-wlp .cobuy__title{margin-top:0;font-size:1.4rem;padding-right:34px;color:var(--w-ink)}
.hxn-wlp .cobuy__meta{color:var(--w-muted)}
/* .cobuy doubled where theme.css has a hard-coded dark-mode colour to beat */
.hxn-wlp .cobuy .cobuy__sum{background:var(--w-bg);margin-top:12px}
.hxn-wlp .cobuy .cobuy__price,.hxn-wlp .cobuy__price b{color:var(--w-navy)}
.hxn-wlp .cobuy .co-field input{background:#fff;color:var(--w-ink)}
.hxn-wlp .cobuy__coupon{display:none}
.hxn-wlp .cobuy.w-code-open .cobuy__coupon{display:flex}
/* The link is 18px tall; the ::after band makes the tap area 44px without moving anything. */
.w-codelink{position:relative;display:inline-block;border:0;background:none;padding:2px 0;margin:2px 0 10px;color:var(--w-navy);font:600 14px/1 Inter,sans-serif;text-decoration:underline;cursor:pointer}
.w-codelink::after{content:"";position:absolute;left:-8px;right:-8px;top:-13px;bottom:-13px}
.w-codelink[hidden]{display:none}
.hxn-wlp .cobuy__pay{background:var(--w-gold);color:var(--w-ink);border-radius:16px;font-weight:700;padding:17px}
.hxn-wlp .cobuy__pay i{color:var(--w-ink)}
@media (prefers-reduced-motion:reduce){.hxn-wlp .cobuy__panel{animation:none}.w-live{animation:none}.hxn-wlp a.w-cta,.w-player,.w-step,.w-faq summary{transition:none}}


/* ---- webinar photos: captions, thumbnails (desktop only), lightbox ---- */
.w-room-head{display:block}
.w-show-nav,.w-thumbs{display:none}
.w-shot{position:relative;cursor:zoom-in}
.w-shot figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;color:#fff;font:600 13px/1.3 Inter,system-ui,sans-serif;background:linear-gradient(transparent,rgba(5,6,15,.75))}
.w-shot:focus-visible{outline:3px solid var(--w-gold);outline-offset:2px}
.w-lb{position:fixed;inset:0;z-index:1300;background:rgba(5,6,15,.94);display:grid;place-items:center;padding:56px 12px}
.w-lb[hidden]{display:none}
.w-lb-fig{margin:0;display:grid;gap:12px;justify-items:center;max-width:min(1400px,100%)}
.w-lb-fig img{max-width:100%;max-height:calc(100vh - 160px);width:auto;height:auto;border-radius:12px;display:block;background:#000}
.w-lb-fig figcaption{color:#E8E9F2;font:600 16px/1.4 Inter,system-ui,sans-serif;text-align:center}
.w-lb-x{position:absolute;top:12px;right:14px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font:400 28px/1 Inter,sans-serif;cursor:pointer}
.w-lb-arrow{position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.12);display:grid;place-items:center;cursor:pointer}
.w-lb-arrow svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2.5}
.w-lb-prev{left:14px}.w-lb-next{right:14px}
.w-lb-n{position:absolute;top:24px;left:20px;color:#A9ABC2;font:600 13px/1 Inter,sans-serif}
.w-lb-x:focus-visible,.w-lb-arrow:focus-visible{outline:3px solid var(--w-gold);outline-offset:2px}
/* Phones: the arrows move under the image, so the bottom padding keeps their row clear of a tall message
   and its caption. dvh follows the iOS toolbar; the vh line is the fallback. */
@media (max-width:640px){.w-lb{padding:56px 12px 84px}.w-lb-fig img{max-height:calc(100vh - 230px);max-height:calc(100dvh - 230px)}.w-lb-arrow{top:auto;bottom:18px;margin:0}.w-lb-prev{left:calc(50% - 64px)}.w-lb-next{right:calc(50% - 64px)}}


/* ---- what people tell Vivvek: lines from real messages ---- */
.w-quotes > .w-quote{flex-basis:84%}
.w-quote{margin:0;background:var(--w-bg);border-radius:18px;padding:22px 20px 18px;display:flex;flex-direction:column;gap:16px}
.w-quote blockquote{margin:0;font:600 18px/1.4 Poppins,system-ui,sans-serif;color:var(--w-ink);position:relative;padding-top:26px}
.w-quote blockquote::before{content:"\201C";position:absolute;top:-14px;left:-2px;font:700 56px/1 Poppins,serif;color:var(--w-gold)}
/* The label keeps at least 10em; when the card is narrower than that plus the pill, the pill wraps under it. */
.w-quote figcaption{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;line-height:1.35;color:var(--w-muted)}
.w-quote figcaption > span{flex:1 1 10em}
.w-quote-see{flex:0 0 auto;border:1px solid var(--w-line);background:var(--w-card);color:var(--w-navy);font:600 12.5px/1 Inter,sans-serif;padding:9px 12px;border-radius:999px;cursor:pointer}
.w-quote-see:focus-visible{outline:3px solid var(--w-gold);outline-offset:2px}
.w-lb-single .w-lb-arrow{display:none}

/* ---- footer brand, centred on this page ---- */
.hxn-wlp .footer__brand{text-align:center;margin:0 auto}
.hxn-wlp .footer__brand img{display:block;margin:0 auto 14px}
.hxn-wlp .footer__brand p{margin-left:auto;margin-right:auto}
.hxn-wlp .footer__brand .social{justify-content:center}
.hxn-wlp .footer__bottom{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px}
.hxn-wlp .footer__legal{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 22px}
.hxn-wlp .footer__meta{display:inline-flex;align-items:center;justify-content:center;gap:10px}

/* =====================================================================================
   DESKTOP: a different page, not the phone layout stretched. Event-page pattern: nav bar,
   split-screen hero, open editorial sections on the left, booking card pinned on the right.
   ===================================================================================== */
@media (min-width:1024px){
	.hxn-wlp{--w-bg:#F6F3EE}
	.w-app{max-width:none;padding:0}

	/* nav bar */
	.w-bar{margin:0;background:rgba(255,255,255,.94);border-bottom:1px solid var(--w-line)}
	.w-bar-in{max-width:1240px;margin:0 auto;padding:14px 40px;gap:24px}
	.w-bar-logo img{height:34px}
	.w-pill{margin-left:auto;background:none;border:0;padding:0;font-size:14px;color:var(--w-muted)}
	.w-pill-m{display:none}
	.w-pill-d{display:inline}
	.hxn-wlp .w-bar a.w-bar-cta{display:inline-flex;width:auto;padding:13px 22px;font-size:15px;border-radius:12px;box-shadow:none}

	/* split hero: portrait fills the left half, the pitch sits on the right. contain:size keeps the
	   portrait's own height out of the row, so the pitch and the min-height set the hero's height and the
	   photo stretches to fill it; the text column is centred in its half. */
	.hxn-wlp .hero.w-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;background:var(--w-card);min-height:min(calc(100vh - 70px),820px)}
	.w-photo{grid-column:1;border-radius:0;aspect-ratio:auto;height:auto;contain:size;box-shadow:none;background:#111}
	.w-photo img{object-position:50% 22%}
	.w-photo figcaption{left:28px;bottom:28px;padding:10px 16px 10px 10px}
	.w-hero-t{grid-column:2;align-content:center;gap:20px;padding:56px clamp(36px,4.5vw,80px);max-width:780px;width:100%;justify-self:center}
	.w-eyebrow{font-size:13px;margin-bottom:-8px !important}
	.hxn-wlp .w-hero h1{font-size:clamp(44px,4.4vw,66px);line-height:1.02}
	.w-hook{font-size:19px;line-height:1.55;color:var(--w-muted)}
	/* the facts read as one editorial row of big figures, not a phone ticket */
	.w-hero .w-ticket{grid-template-columns:repeat(4,auto);justify-content:start;gap:0;background:none;box-shadow:none;border-radius:0;border-top:2px solid var(--w-ink);border-bottom:1px solid var(--w-line)}
	.w-hero .w-ticket > div{padding:14px 18px 14px 0;margin-right:18px;border:0;border-right:1px solid var(--w-line) !important}
	.w-hero .w-ticket > div:last-child{border-right:0 !important;margin-right:0}
	.w-hero .w-ticket small{color:var(--w-muted)}
	.w-hero .w-ticket b{color:var(--w-ink);font-size:clamp(19px,1.65vw,24px);white-space:nowrap}
	.w-hero .w-ticket .w-fee b{color:var(--w-gold-ink)}
	.w-hero a.w-cta{width:auto;justify-self:start;padding:21px 40px;font-size:18px}
	.w-hero .w-fine,.w-hero .w-trust{text-align:left}
	.w-trust{margin-top:-10px !important}

	/* body: the story left, the booking card right */
	.w-body{max-width:1240px;margin:0 auto;padding:24px 40px 0;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:64px;align-items:start}
	/* no booking card (closed, date to be announced, or switched off): one centred column, no empty
	   right track. Two classes so it also beats the small-laptop .w-body rule further down. */
	.w-body.w-body--solo{grid-template-columns:minmax(0,1fr);max-width:920px}
	.w-aside{display:block;position:sticky;top:86px;margin-top:56px}
	.w-sec{background:none;box-shadow:none;border-radius:0;padding:56px 0;margin:0;border-top:1px solid var(--w-line)}
	.w-main > .w-sec:first-child{border-top:0}
	.w-sec h2{font-size:40px;line-height:1.1}
	.w-sub{font-size:17px}
	.w-mid{display:none}

	/* pain + includes: white tiles, two across */
	.w-list{grid-template-columns:1fr 1fr;gap:14px;border:0;margin-top:24px !important}
	.w-list li{background:var(--w-card);border:0;border-radius:18px;padding:20px;box-shadow:var(--w-shadow)}
	.w-list li b{font-size:17px}
	.w-punch{font-size:24px;margin-top:24px !important}

	/* learn: four tiles */
	.w-learn{grid-template-columns:1fr 1fr;gap:14px;margin-top:24px}
	.w-lcard{background:var(--w-card);padding:22px;box-shadow:var(--w-shadow)}
	.w-lcard b{font-size:18px}
	.w-lcard > span:last-child{font-size:14.5px}

	/* video: one wide dark block, words beside the player */
	.w-video{margin:8px 0 0;padding:44px;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:44px;align-items:center;border-radius:28px}
	.w-video h2{font-size:44px}
	.w-video .w-sub{font-size:18px}
	.w-player{margin:0;max-height:none}

	/* path: three columns */
	.w-path{grid-template-columns:repeat(3,1fr);margin-top:24px !important;align-items:stretch}
	.w-step{background:var(--w-card);box-shadow:var(--w-shadow);padding:20px}
	.w-step img{width:calc(100% + 40px);margin:-20px -20px 10px;aspect-ratio:16/10}
	.w-step--now{background:var(--w-navy)}

	.w-band{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:30px 36px;margin:0 0 8px}
	.w-band b{font-size:24px}
	.hxn-wlp .w-band a.w-cta{width:auto;padding:18px 28px}

	/* don't miss it: heading on one line, the three reasons side by side, the button under them */
	.w-fomo{display:block;padding:44px 48px;border-radius:28px;margin:40px 0 0}
	.w-fomo .w-kick{margin-bottom:10px !important}
	.w-fomo h2{font-size:36px;max-width:none}
	.w-fomo ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0 28px !important}
	.w-fomo li{display:block;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px;font-size:16px;line-height:1.45}
	.w-fomo li::before{display:block;width:8px;margin:0 0 12px}
	.hxn-wlp .w-fomo a.w-cta{display:inline-flex;width:auto;padding:20px 32px}
	/* webinar photos: a dark band, words and controls on the left, the rotating stage on the right */
	.w-room{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);column-gap:56px;align-items:center;background:var(--w-ink);border-radius:0;margin:56px 0 0;padding:64px max(40px,calc((100% - 1240px) / 2 + 40px));border:0}
	.w-room .w-kick{color:var(--w-gold)}
	.w-room h2{color:#fff;font-size:36px}
	.w-room .w-sub{color:#A9ABC2}
	.w-room-head{grid-column:1;display:flex;flex-direction:column;align-items:flex-start;gap:28px}
	.w-show{grid-column:2;min-width:0}
	.w-show-nav{display:flex;align-items:center;gap:10px}
	.w-show-n{color:#A9ABC2;font:600 15px/1 Inter,sans-serif;margin-right:8px;font-variant-numeric:tabular-nums}
	.w-show-n b{color:#fff}
	.w-show-btn{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);display:grid;place-items:center;cursor:pointer;transition:background .2s}
	.w-show-btn:hover{background:rgba(255,255,255,.16)}
	.w-show-btn svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.5}
	.w-show-track{display:grid;margin:0;padding:0;overflow:visible;gap:0}
	.w-show-track > .w-shot{grid-area:1 / 1;flex:none;width:100%;aspect-ratio:16 / 9;max-height:440px;border-radius:18px;background:#05060F;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s}
	.w-show-track > .w-shot.is-on{opacity:1;visibility:visible}
	.w-show-track .w-shot img{object-fit:contain}
	.w-show-track .w-shot figcaption{padding:44px 22px 16px;font:600 17px/1.3 Poppins,system-ui,sans-serif}
	.w-thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:12px}
	.w-thumb{position:relative;border:0;padding:0;border-radius:12px;overflow:hidden;aspect-ratio:16 / 10;background:#05060F;cursor:pointer;opacity:.45;transition:opacity .2s;outline:2px solid transparent;outline-offset:2px}
	.w-thumb img{width:100%;height:100%;object-fit:cover;display:block}
	.w-thumb:hover{opacity:.8}
	.w-thumb.is-on{opacity:1;outline-color:var(--w-gold)}
	/* white, so keyboard focus reads apart from the gold active thumbnail */
	.w-thumb:focus-visible{opacity:1;outline-color:#fff}
	.w-thumb i{position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--w-gold)}
	.w-thumb.is-run i{animation:wRun 4.5s linear forwards}
	@keyframes wRun{to{width:100%}}
	.w-room .w-dots{display:none}
	.w-body--2{padding-top:0}
	/* real-message quotes: a two-column grid of cards */
	.w-quotes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 0;padding:0;overflow:visible}
	.w-quotes > .w-quote{flex:none;background:var(--w-card);box-shadow:var(--w-shadow);padding:26px 24px 20px}
	.w-quote blockquote{font-size:19px}
	.w-msgs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0 0;padding:0;overflow:visible}
	.w-msgs > *{flex:none}
	.w-msg img{height:400px}
	.w-dots{display:none}

	.w-hostsec{grid-template-columns:240px minmax(0,1fr);gap:36px;align-items:start}
	.w-host-img{max-height:none;border-radius:20px}
	.w-said{font-size:22px}

	.w-faq details p{font-size:16px}

	/* booking card */
	.w-book{background:var(--w-card);border-radius:24px;padding:28px;box-shadow:0 2px 4px rgba(11,12,31,.04),0 20px 50px rgba(11,12,31,.12);display:grid;gap:12px}
	.w-book .w-kick{margin-bottom:-6px !important}
	.w-book-t{font:700 21px/1.25 Poppins,system-ui,sans-serif;color:var(--w-ink)}
	.w-book-facts{display:grid;border-top:1px solid var(--w-line)}
	.w-book-facts li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-bottom:1px solid var(--w-line)}
	.w-book-facts span{font-size:13px;color:var(--w-muted);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
	.w-book-facts b{font:700 17px/1.2 Poppins,system-ui,sans-serif;color:var(--w-ink);text-align:right}
	.w-book-facts .w-fee b{font-size:26px;color:var(--w-gold-ink)}
	.w-book a.w-cta{padding:19px 18px}
	.w-book-incl{display:grid;gap:9px;padding-top:4px}
	.w-book-incl li{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.35;color:var(--w-text)}
	.w-book-incl svg{flex:0 0 16px;width:16px;height:16px;fill:none;stroke:var(--w-gold-ink);stroke-width:3;margin-top:1px}
	.w-book-miss{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:#C2262E;background:#FDF0F0;border-radius:12px;padding:11px 13px;text-wrap:balance}
	.w-book-trust{font-size:13px;color:var(--w-muted);text-align:center;text-wrap:balance}

	/* closing band, full width */
	.w-final{max-width:none;margin:72px 0 0;padding:80px 40px 96px;background:var(--w-ink);border-radius:0;border:0;justify-items:center;gap:20px}
	.w-final h2{color:#fff;font-size:52px;max-width:900px}
	.w-final .w-kick{color:var(--w-gold);margin-bottom:-4px !important}
	.w-final .w-ticket{grid-template-columns:repeat(4,auto);background:rgba(255,255,255,.06);box-shadow:none;border:1px solid rgba(255,255,255,.12)}
	.w-final .w-ticket > div{border-width:0 1px 0 0 !important;padding:18px 30px}
	.w-final .w-ticket > div:last-child{border-right-width:0 !important}
	.w-final .w-ticket b{font-size:26px;white-space:nowrap}
	.w-final a.w-cta{width:auto;padding:22px 44px;font-size:19px}
	.w-final .w-fine{color:#A9ABC2}
	.w-closed h2{color:#fff}

	/* the booking card replaces the phone dock */
	.hxn-wlp .sticky-cta{display:none !important}
	.w-app{padding-bottom:0}

	.hxn-wlp .cobuy{align-items:center;padding:20px}
	.hxn-wlp .cobuy__panel{border-radius:24px}
}

/* Small laptops: the hero column is narrower, so the four facts sit two by two in equal halves, and
   the video block gives its words more room beside a narrower player. */
@media (min-width:1024px) and (max-width:1219px){
	.w-hero .w-ticket{grid-template-columns:1fr 1fr;column-gap:0}
	.w-hero .w-ticket > div{margin-right:0}
	.w-hero .w-ticket > div:nth-child(even){padding-left:18px}
	.w-hero .w-ticket > div:nth-child(2){border-right:0 !important}
	.w-hero .w-ticket > div:nth-child(-n+2){border-bottom:1px solid var(--w-line)}
	.w-body{grid-template-columns:minmax(0,1fr) 340px;gap:44px}
	.w-video{grid-template-columns:minmax(0,1fr) 220px;gap:28px;padding:36px}
	.w-video h2{font-size:34px}
}

/* Short laptop screens: the booking card tightens and drops its perks list (shown in full under
   "Everything you get") so the whole pinned card fits under the nav bar, and the pitch loses some air
   so the hero button clears the fold. */
@media (min-width:1024px) and (max-height:820px){
	.w-book{padding:24px}
	.w-book-facts li{padding:10px 0}
	.w-book-incl{display:none}
}
@media (min-width:1024px) and (max-height:760px){
	.w-hero-t{padding-block:32px}
}
