/* /webinar-gever: only what the site theme (tp_theme_compact) has no block for.
 * Fonts, colours and buttons come from the theme: --lol-* tokens,
 * lol-home-* sections, lol-pill-btn, Bootstrap form controls. */
.lwg { overflow-x: clip; }
/* Landing page: no theme tab bar (home, categories, cart) on phones. */
#wrapwrap:has(.lwg) .tpc-tabbar { display: none !important; }
#wrapwrap:has(.lwg) { padding-bottom: 0 !important; }
.lwg-narrow { max-width: 820px; }
.lwg-muted { color: var(--lol-muted); }
.lwg-accent { color: var(--lol-forest); }
.lwg-subtitle { font-weight: 700; color: var(--lol-ink); }
.lwg-mark {
    background: linear-gradient(transparent 62%, var(--lol-sage) 62%) no-repeat 100% 0 / 100% 100%;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.lwg-hero .lwg-mark { background-image: linear-gradient(transparent 62%, #fff 62%); }
.lwg-mark-dark { background-image: linear-gradient(transparent 62%, rgba(255, 255, 255, .18) 62%); }
.lwg-card {
    background: #fff;
    border: 1px solid var(--lol-line);
    border-radius: var(--lol-radius-lg);
    padding: clamp(1.25rem, 3vw, 2rem);
    color: var(--lol-text);
}
.lwg-card h2, .lwg-card h3 { font-weight: 800; color: var(--lol-ink); margin: .25rem 0 .5rem; }
.lwg-btn-sm { min-height: 40px; padding: 0 1.125rem; font-size: .9375rem; }
.lwg-cta { margin-top: 2rem; text-align: center; }
.lwg-cta .lwg-muted { margin-top: .75rem; font-size: .875rem; }

/* Header: logo and one CTA, no site menu (no exits). */
.lwg-header { position: sticky; top: 0; z-index: 20; background: rgba(255, 255, 255, .92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--lol-line); }
.lwg-header-inner { display: flex; align-items: center; gap: .75rem; padding-block: .5rem; }
/* Odoo's "#wrap .container::before/::after" become flex and grid items (an
   empty first cell) on containers that are also the layout. */
#wrap.lwg .lwg-header-inner::before, #wrap.lwg .lwg-header-inner::after,
#wrap.lwg .lol-home-founder::before, #wrap.lwg .lol-home-founder::after { display: none; }
.lwg-logo { margin-inline-end: auto; }
.lwg-logo img { display: block; width: 40px; height: auto; }
.lwg section[id], #register-form { scroll-margin-top: 80px; }

/* Hero: the theme's sage hero card, form in the media column. */
.lwg-hero-form { display: flex; align-items: center; padding: clamp(1rem, 3vw, 2.5rem); }
.lwg-hero-form .lwg-card { width: 100%; box-shadow: 0 24px 60px -30px rgba(30, 43, 34, .45); }

/* Form */
.lwg-form .form-control { min-height: 48px; }
.lwg-form .form-control[dir=ltr] { text-align: right; }
.lwg-form .form-check { display: flex; flex-wrap: wrap; gap: .5rem; padding-inline-start: 0; }
.lwg-form .form-check-input { float: none; margin: .2rem 0 0; flex: none; }
.lwg-form .form-check-label { flex: 1; font-size: .875rem; }
.lwg-error { width: 100%; margin: .25rem 0 0; font-size: .8125rem; color: var(--lol-clay); }
.lwg-error:empty { display: none; }
.lwg-note { margin: .75rem 0 0; text-align: center; font-size: .8125rem; color: var(--lol-muted); }
.lwg-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Countdown */
.lwg-countdown-label { font-weight: 700; font-size: .875rem; color: var(--lol-ink); margin-bottom: .5rem; }
.lwg-countdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; text-align: center; }
.lwg-countdown div { background: #fff; border-radius: var(--lol-radius-sm); padding: .75rem .25rem; }
.lwg-countdown b { display: block; font-size: clamp(1.75rem, 6vw, 2.25rem); font-weight: 800; line-height: 1; color: var(--lol-forest); font-variant-numeric: tabular-nums; }
.lwg-countdown span { display: block; margin-top: .375rem; font-size: .75rem; color: var(--lol-muted); }
.lwg-countdown-date { margin-top: .625rem; text-align: center; font-size: .9375rem; color: var(--lol-ink); }
.lwg-card .lwg-countdown div { background: var(--lol-sage-soft); }
.lwg-countdown-dark .lwg-countdown-label, .lwg-countdown-dark .lwg-countdown-date { color: #fff; }
.lwg-countdown-dark .lwg-countdown div { background: rgba(255, 255, 255, .1); }
.lwg-countdown-dark .lwg-countdown b { color: #fff; }
.lwg-countdown-dark .lwg-countdown span { color: rgba(255, 255, 255, .75); }

/* Partners: an endless strip once JS measures it, a centred row without JS. */
.lwg-marquee { overflow: hidden; direction: ltr; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.lwg-marquee-track { display: flex; }
.lwg-marquee-set { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex: none; margin: 0; padding: 0; list-style: none; }
.lwg-marquee.is-running .lwg-marquee-track { width: max-content; will-change: transform; }
.lwg-marquee.is-running .lwg-marquee-set { flex-wrap: nowrap; }
.lwg-marquee-set li { flex: none; padding: .75rem clamp(1.5rem, 4vw, 3rem); }
.lwg-marquee-set img { display: block; height: clamp(44px, 6vw, 64px); width: auto; max-width: 180px; object-fit: contain; filter: grayscale(1); opacity: .7; transition: filter .3s, opacity .3s; }
.lwg-marquee-set li:hover img { filter: none; opacity: 1; }

/* Approach / quality */
.lwg-video-wrap { max-width: 900px; }
.lwg-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--lol-radius-lg); overflow: hidden; background: var(--lol-ink); }
.lwg-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lwg-caption { margin-top: .75rem; text-align: center; font-size: .875rem; color: var(--lol-muted); }
.lwg-badges { justify-content: center; margin-top: 2rem; }
.lwg-badges li { padding: .375rem .875rem; border-radius: var(--lol-radius-pill); background: var(--lol-sage-soft); }
.lwg-two { display: grid; gap: 1rem; margin: 1.5rem 0; text-align: start; }
.lwg-two .lwg-card { margin: 0; }
.lwg-highlight { margin-top: 1.5rem; }
.lwg-highlight p { margin: 0 0 .375rem; }
.lwg-highlight-big { font-size: clamp(1.25rem, 3vw, 1.625rem); font-weight: 800; color: var(--lol-forest); }

/* About */
/* The photo is a finished composite (round cut-out and badge on white):
   show it whole on a white card instead of cropping it. */
.lwg-founder-media { max-width: 520px; margin-inline: auto; padding: clamp(1rem, 3vw, 2rem); border-radius: var(--lol-radius-lg); background: #fff; }
.lol-home-founder .lwg-founder-media img { height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 0; }

/* Sticky countdown: a floating bar once the hero form is off screen. */
.lwg-sticky { position: fixed; inset-inline: 0; bottom: 0; z-index: 30; display: flex; justify-content: center; padding: 0 .5rem calc(.5rem + env(safe-area-inset-bottom, 0px)); pointer-events: none; transform: translateY(130%); transition: transform .45s cubic-bezier(.2, .8, .2, 1); }
.lwg-sticky.is-shown { transform: none; }
.lwg-sticky-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; max-width: 560px; padding: .5rem .5rem .5rem 1rem; padding-inline-start: 1.125rem; border-radius: var(--lol-radius-pill); background: var(--lol-ink); color: #fff; box-shadow: 0 16px 40px -12px rgba(30, 43, 34, .55); pointer-events: auto; }
.lwg-sticky-time { display: flex; flex-direction: column; line-height: 1.2; }
.lwg-sticky-time span { font-size: .75rem; color: rgba(255, 255, 255, .75); }
.lwg-sticky-time b { font-size: 1.125rem; font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
.lwg-sticky .lol-pill-btn { flex: none; min-height: 44px; background: var(--lol-sage); color: var(--lol-ink); }
.lwg-sticky .lol-pill-btn:hover, .lwg-sticky .lol-pill-btn:focus-visible { background: #fff; color: var(--lol-ink); }
@media (prefers-reduced-motion: reduce) { .lwg-sticky { transition: none; } }

/* Register: forest version of the hero card. */
.lwg-register { display: grid; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; padding: clamp(1.5rem, 4vw, 3.5rem); border-radius: 28px; background: var(--lol-forest); color: rgba(255, 255, 255, .88); }
.lwg-register h2 { margin: .5rem 0 1rem; font-weight: 800; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.15; color: #fff; }
.lwg-register .lol-home-eyebrow { color: var(--lol-sage); }

/* FAQ */
.lwg-faq { display: grid; gap: .75rem; }
.lwg-faq details { border: 1px solid var(--lol-line); border-radius: var(--lol-radius); background: #fff; }
.lwg-faq summary { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; font-weight: 700; color: var(--lol-ink); cursor: pointer; list-style: none; }
.lwg-faq summary::-webkit-details-marker { display: none; }
.lwg-faq summary::after { content: "+"; font-size: 1.25rem; line-height: 1; color: var(--lol-forest); transition: transform .2s; }
.lwg-faq details[open] summary::after { transform: rotate(45deg); }
.lwg-faq details p { margin: 0; padding: 0 1.25rem 1rem; color: var(--lol-text); }

/* Footer */
/* Colours come from the theme footer (ink); only the layout is ours. */
.lwg-footer { margin-top: 3rem; padding-block: 1.5rem 6rem; font-size: .875rem; }
.lwg-footer-brand img { filter: brightness(0) invert(1); opacity: .9; }
.lwg-footer-inner { display: flex; flex-direction: column; align-items: center; gap: .75rem; text-align: center; }
.lwg-footer-brand { display: flex; align-items: center; gap: .75rem; }
.lwg-footer p { margin: 0; }

/* Thank you */
.lwg-thanks .lwg-check { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 1.25rem; border-radius: 50%; background: var(--lol-forest); color: #fff; }
.lwg-thanks h1 { font-weight: 800; color: var(--lol-ink); }
.lwg-thanks .lwg-card { margin-top: 1.5rem; }
.lwg-steps ol { margin: 0; padding-inline-start: 1.25rem; }
.lwg-steps li { margin-bottom: .5rem; }
.lwg-steps li::marker { font-weight: 800; color: var(--lol-forest); }
.lwg-back { font-weight: 700; color: var(--lol-forest); }

@media (max-width: 575.98px) {
    .lwg-btn-sm { min-height: 38px; padding: 0 .875rem; font-size: .875rem; }
}

@media (min-width: 992px) {
    .lwg-logo img { width: 48px; }
    .lwg-two { grid-template-columns: 1fr 1fr; }
    /* The theme's auto-fit grid makes 3 tracks at this width. */
    .lwg .lol-home-founder { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 4rem; }
    .lwg-register { grid-template-columns: 1.1fr .9fr; }
    .lwg-footer-inner { flex-direction: row; justify-content: space-between; }
}