#webinar {font-family:Montserrat,Arial,sans-serif; color:#fff; width:100%; box-sizing:border-box;}
#webinar * {box-sizing:border-box;}
#webinar .preview-tools {display:flex; align-items:center; justify-content:space-between; gap:12px; max-width:390px; margin:0 auto 12px; padding-right:40px; font-size:12px;}
#webinar .replay {font:inherit; color:#fff; border:1px solid var(--border); border-radius:20px; background:transparent; padding:9px 12px; cursor:pointer; min-height:40px;}
#webinar .stage {padding:10px 0;}
#webinar .screen {position:relative; margin:auto; width:min(390px,100%); height:790px; border-radius:26px; overflow:hidden; background:#07111f; box-shadow:0 14px 44px #0003; isolation:isolate; color:#fff;}
#webinar .scroll {height:100%; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; background:radial-gradient(ellipse at 80% 15%,#233846 0%,#0c1c2b 42%,#07111f 78%);}
#webinar .scroll::-webkit-scrollbar {display:none;}
#webinar .site-header {margin:10px; height:66px; display:flex; align-items:center; gap:8px; padding:6px 10px; background:#0c1c2b; border:1px solid #d7b36c44; border-radius:18px;}
#webinar .logo {width:138px; height:54px; object-fit:contain; margin-right:auto;}
#webinar .languages {display:flex; align-items:center; border:1px solid #f2dfad29; border-radius:30px; padding:3px; font-size:10px; font-weight:800; color:#f2dfad; gap:3px;}
#webinar .languages span {display:grid; place-items:center; width:37px; height:37px;}
#webinar .languages .active {background:#c98f47; color:#07111f; border-radius:50%;}
#webinar .menu {height:42px; width:42px; border:1px solid #f2dfad4d; border-radius:50%; display:grid; place-items:center; background:#ffffff0d; color:#fff; cursor:pointer;}
#webinar svg {width:20px;height:20px;flex-shrink:0;}
#webinar .menu-panel {margin:0 10px 12px; padding:8px; border-radius:14px; background:#152c40;}
#webinar .menu-panel button {display:block; width:100%; background:none; border:0; color:white; text-align:left; font:600 14px Montserrat,sans-serif; padding:15px; cursor:pointer;}
#webinar .hero {padding:14px 18px 28px;}
#webinar figure {position:relative; margin:0 0 22px; height:205px; overflow:hidden; border:1px solid #9eafb13b; border-radius:10px;}
#webinar .portrait {width:100%; height:100%; object-fit:cover; object-position:46% 50%; display:block;}
#webinar figcaption {position:absolute; inset:auto 0 0; padding:22px 12px 10px; background:linear-gradient(transparent,#07111fe8); color:#eed99d; font-size:10px; letter-spacing:1px; font-weight:800;}
#webinar .eyebrow {display:inline-block; color:#07111f; background:linear-gradient(100deg,#c98f47,#dfad65); border-radius:24px; padding:8px 12px; font-size:10px; font-weight:800; letter-spacing:1px;}
#webinar h1 {font:800 38px/1.06 Montserrat,sans-serif; letter-spacing:-1.4px; margin:16px 0 13px; color:#fff;}
#webinar .subtitle {font-size:19px; font-weight:500; line-height:1.38; margin:0 0 16px; color:#fff;}
#webinar .intro {font-size:14px; line-height:1.55; color:#c8cdd3; margin:0 0 22px;}
#webinar .event {display:flex; gap:12px; align-items:center; padding:0;}
#webinar .event>svg {width:28px; height:28px; color:#d9a657;}
#webinar .event-info {border-left:2px solid #c98f47; padding-left:12px; font-size:13px; line-height:1.65; color:#cbd0d7;}
#webinar .event strong {display:block; font-size:14px; color:#fff;}
#webinar .learn {padding:24px 22px 32px; border-top:1px solid #d7b36c27;}
#webinar .learn h2 {font:800 23px/1.2 Montserrat,sans-serif; color:#fff; margin:0 0 16px;}
#webinar .learn p {display:flex;gap:14px; font-size:14px; line-height:1.5; padding:13px 0; margin:0; border-bottom:1px solid #ffffff12; color:#d5d8dd;}
#webinar .learn b {color:#d7a15a; font-size:16px;}
#webinar .registration {margin:10px 14px 0; padding:25px 18px 24px; background:#f5f1e7; border-radius:22px; color:#101b2c; color-scheme:light; scroll-margin-top:14px;}
#webinar .reg-eyebrow {color:#956424; font-size:10px; letter-spacing:1px; font-weight:800;}
#webinar .registration h2 {font:800 27px/1.2 Montserrat,sans-serif; letter-spacing:-.6px; margin:12px 0; color:#0b192a;}
#webinar .reg-intro {font-size:14px; line-height:1.5; color:#5b6371; margin:0 0 22px;}
#webinar .field {display:block; font:700 13px/1.4 Montserrat,sans-serif; color:#515b6b; margin:0 0 16px;}
#webinar input:not([type=checkbox]), #webinar select, #webinar textarea {display:block; width:100%; min-width:0; min-height:48px; padding:11px; margin-top:6px; border:1px solid #b6bec7; border-radius:8px; background:#fff; color:#102031; font:400 16px/1.4 Montserrat,sans-serif;}
#webinar input:focus-visible, #webinar select:focus-visible, #webinar textarea:focus-visible {outline:2px solid #a7722e; outline-offset:2px;}
#webinar details {margin:2px 0 20px; font-size:12px; color:#5b6371;}
#webinar summary {cursor:pointer; font-size:13px; font-weight:600; padding:12px 0; color:#18324c;}
#webinar details p {margin:10px 0 0; line-height:1.5;}
#webinar .consent {display:flex; align-items:flex-start; gap:10px; font-size:12px; line-height:1.55; margin:0 0 18px; color:#364355; cursor:pointer;}
#webinar .consent input {flex:none; width:22px; height:22px; margin:2px 0 0; accent-color:#a7712b;}
#webinar .consent a {color:#71501f; text-decoration:underline;}
#webinar .confirm {width:100%; min-height:52px; border:1px solid #e4b876; border-radius:12px; background:linear-gradient(105deg,#dfaa59,#c98f47); color:#07111f; font:800 16px/1.2 Montserrat,sans-serif; cursor:pointer; padding:14px;}
#webinar .small-note {margin:13px 0 0; font-size:11px; text-align:center; color:#636c79; line-height:1.5;}
#webinar .demo-result {margin:15px 0 0; padding:12px; background:#e5ecdf; border-radius:8px; color:#30472c; font-size:13px; line-height:1.5;}
#webinar .footer {color:#bfc8d3; text-align:center; font-size:11px; line-height:1.6; padding:25px 24px 90px;}
#webinar .dock {position:absolute; left:14px; right:14px; bottom:16px; z-index:5; opacity:0; transform:translateY(16px); pointer-events:none; transition:opacity 240ms ease,transform 300ms cubic-bezier(.22,1,.36,1);}
#webinar .dock.visible {opacity:1; transform:translateY(0); pointer-events:auto;}
#webinar .reserve {display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:68px; padding:12px 18px; border:1px solid #ebc586; border-radius:18px; background:linear-gradient(110deg,#e2b66e,#cd944c); box-shadow:0 8px 28px #0005; color:#08192b; cursor:pointer; text-align:left;}
#webinar .reserve-copy {display:flex; flex-direction:column; gap:4px;}
#webinar .reserve small {font:600 10px/1.2 Montserrat,sans-serif; letter-spacing:.5px;}
#webinar .reserve strong {font:800 18px/1.2 Montserrat,sans-serif;}
#webinar .arrow {display:grid; place-items:center; width:34px;height:34px; border-radius:50%; background:#ffffff2b; flex:none;}
#webinar .arrow.nudge {animation:dlv-arrow-nudge 800ms ease-in-out 1;}
@keyframes dlv-arrow-nudge {0%,100%{transform:translateY(0)}45%{transform:translateY(5px)}}
#webinar .dock.intro-once {animation:dlv-button-enter 480ms cubic-bezier(.22,1,.36,1) both;}
@keyframes dlv-button-enter {from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:360px){#webinar h1{font-size:34px}#webinar .logo{width:117px}#webinar .site-header{gap:5px;padding:6px 8px}#webinar .screen{border-radius:18px}#webinar .languages span{width:33px;height:37px}}
@media(prefers-reduced-motion:reduce){#webinar .dock{transition:none}#webinar .dock.intro-once,#webinar .arrow.nudge{animation:none}}

@font-face{font-family:Montserrat;src:url('/assets/montserrat-latin-400-normal-CIMKXMQI.woff2') format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/montserrat-latin-800-normal-Cp9CdP19.woff2') format('woff2');font-weight:700 900;font-display:swap}
html{background:#07111f;scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 80% 15%,#233846,#0c1c2b 42%,#07111f 78%)}
#webinar{min-height:100svh;margin:0}#webinar .site-header{margin:12px 14px}
#webinar .home-link{margin-right:auto}#webinar .menu-panel a{display:block;padding:14px;color:#fff;text-decoration:none}
#webinar .dock{position:fixed;max-width:450px;left:14px;right:14px;margin:auto;bottom:calc(16px + env(safe-area-inset-bottom))}
#webinar .registration{scroll-margin-top:16px}#webinar .registration:focus{outline:none}
#webinar .registration a:focus-visible,#webinar button:focus-visible,#webinar a:focus-visible{outline:3px solid #c98f47;outline-offset:4px}
#webinar button:disabled{opacity:.65;cursor:wait}#webinar [hidden]{display:none!important}
#webinar .preview-notice{background:#f5f1e7;color:#152c40;margin:0;padding:8px 16px;font-size:11px;text-align:center}
#webinar .form-status{font-size:14px;line-height:1.6}#webinar .confirm{scroll-margin-top:100px}
#webinar .desktop-nav, #webinar .desktop-actions {display:none;}
/* Keep the footer after a complete viewport, without clipping expanded content. */
#webinar .webinar-stage {display:flex; flex-direction:column; min-height:100vh; min-height:100dvh;}
#webinar main {flex:1; padding-bottom:32px;}
#webinar .webinar-stage > .site-header {flex-shrink:0;}
#webinar main > section {min-width:0;}
#webinar h1, #webinar .registration h2 {overflow-wrap:break-word;}
#webinar figure {height:auto; aspect-ratio:900 / 502;}
@media (600px <= width <= 1120px) {
  #webinar .site-header, #webinar main {width:calc(100% - 48px); max-width:720px; margin-left:auto; margin-right:auto;}
  #webinar .hero {padding:24px 0 32px;}
  #webinar h1 {font-size:clamp(40px,6vw,56px);}
  #webinar .subtitle {font-size:23px;}
  #webinar .registration {margin:16px 0 0; padding:32px;}
  #webinar .learn {padding-left:0; padding-right:0;}
}
@media (width > 1120px) {
  /* Match the source site's independent header and hero containers. */
  #webinar {--hero-inline:max(36px, calc((100vw - 1740px) / 2 + 36px));}
  #webinar main {width:calc(100% - 2 * var(--hero-inline)); margin-left:auto; margin-right:auto;}
  #webinar .site-header {position:sticky; top:18px; z-index:20; width:min(1210px,calc(100% - 44px)); min-height:67px; height:auto; margin:18px auto 0; padding:7px 9px 7px 15px; gap:16px; border-radius:18px; border-color:#ffffff24; background:#081220b8; backdrop-filter:blur(24px) saturate(1.2); box-shadow:0 18px 48px #07111f2e;}
  #webinar .logo {display:block; width:136px; height:50px;}
  #webinar .desktop-nav {display:flex; flex:1; justify-content:center; align-items:center; gap:clamp(8px,1.7vw,22px);}
  #webinar .desktop-nav a {font-size:13px; font-weight:800; color:#e2e5e9; text-decoration:none; padding:9px 0; white-space:nowrap;}
  #webinar .desktop-nav a:hover {color:#e2b66e;}
  #webinar .desktop-nav a[href="#registro"] {color:#e2b66e;}
  #webinar .desktop-actions {display:flex; gap:8px;}
  #webinar .desktop-actions a {display:flex; align-items:center; min-height:42px; padding:10px 14px; border:1px solid #07111f2e; border-radius:12px; background:linear-gradient(135deg,#c98f47,#e0ad67); color:#07111f; text-decoration:none; font-size:13px; font-weight:800; white-space:nowrap;}
  #webinar .menu, #webinar .menu-panel {display:none!important;}
  #webinar main {display:grid; grid-template-columns:minmax(0,1fr) minmax(380px,.6fr); gap:20px clamp(32px,4vw,72px); padding:24px 0; align-items:start; align-content:center;}
  #webinar .hero {display:flex; flex-direction:column; align-self:stretch; grid-column:1; grid-row:1 / 3; padding:0;}
  #webinar .hero-copy {display:contents;}
  #webinar .eyebrow {align-self:flex-start; padding:9px 14px; font-size:11px;}
  #webinar h1 {font-size:clamp(44px,min(4vw,7svh),72px); line-height:1.06; letter-spacing:-.035em; margin:16px 0;}
  #webinar .subtitle {font-size:clamp(21px,1.4vw,26px); line-height:1.4; max-width:36ch; margin-bottom:12px;}
  #webinar .intro {font-size:16px; line-height:1.6; max-width:62ch; margin-bottom:20px;}
  #webinar .event {margin-bottom:22px;}
  #webinar .event-info {font-size:14px;}
  #webinar .event strong {font-size:16px;}
  #webinar figure {order:1; flex:none; aspect-ratio:2 / 1; min-height:0; margin:0; border-radius:16px;}
  #webinar .portrait {position:absolute; inset:0; object-position:center 43%;}
  #webinar figcaption {padding:28px 18px 14px; font-size:11px;}
  #webinar .registration {grid-column:2; grid-row:1; margin:0; padding:28px; border-radius:22px; box-shadow:0 16px 48px #0002; scroll-margin-top:104px;}
  #webinar .registration h2 {font-size:32px; margin:12px 0;}
  #webinar .reg-intro {font-size:14px; margin-bottom:20px;}
  #webinar .field {font-size:13px; margin-bottom:14px;}
  #webinar .consent {font-size:12px; line-height:1.6; margin-bottom:16px;}
  #webinar details {margin-bottom:16px;}
  #webinar summary {padding:10px 0;}
  #webinar .learn {grid-column:1 / -1; padding:30px 0 10px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 32px;}
  #webinar .learn h2 {grid-column:1 / -1; font-size:clamp(25px,2vw,32px); margin-bottom:20px;}
  #webinar .learn p {align-items:baseline; padding:18px 0; font-size:clamp(14px,1vw,18px); border-top:1px solid #ffffff12; border-bottom:0;}
  #webinar .learn b {font-size:21px;}
  #webinar .footer {padding:32px 20px; margin-top:24px; border-top:1px solid #d7b36c27;}
  #webinar .dock {display:none;}
}
@media (min-width:1360px) {
  #webinar main {row-gap:20px;}
  #webinar .hero {grid-column:1; grid-row:1 / 3; gap:24px;}
  #webinar figure {order:1; flex:none; aspect-ratio:2 / 1; min-height:0;}
  #webinar .portrait {object-position:center 43%;}
  #webinar .hero-copy {display:grid; grid-template-columns:minmax(0,1fr) minmax(200px,.55fr); column-gap:28px;}
  #webinar .eyebrow {grid-column:1 / -1; justify-self:start; font-size:10px; letter-spacing:.7px;}
  #webinar h1 {grid-column:1 / -1; font-size:clamp(42px,3vw,60px);}
  #webinar h1 br {display:none;}
  #webinar .subtitle {grid-column:1; font-size:clamp(20px,1.3vw,24px);}
  #webinar .intro {grid-column:1; margin-bottom:0;}
  #webinar .event {grid-column:2; grid-row:3 / 5; align-self:center; margin-bottom:0;}
}
@media (width > 1120px) {
  #webinar .registration {padding:22px;}
  #webinar .registration h2 {font-size:28px; margin:8px 0;}
  #webinar .reg-intro {font-size:13px; margin-bottom:14px;}
  #webinar .field {margin-bottom:10px;}
  #webinar input:not([type=checkbox]), #webinar select {min-height:44px; padding:9px 11px;}
  #webinar details {margin-bottom:8px;}
  #webinar summary {padding:8px 0;}
  #webinar .consent {line-height:1.45; margin-bottom:10px;}
  #webinar .confirm {min-height:48px; padding:12px;}
  #webinar .small-note {margin-top:10px;}
  #webinar .form-status:empty {display:none;}
  #webinar .learn {grid-column:2; grid-row:2; grid-template-columns:minmax(0,1fr); gap:0; padding:16px 0 0;}
  #webinar .learn h2 {font-size:21px; margin-bottom:8px;}
  #webinar .learn p {font-size:14px; padding:7px 0; border:0; gap:12px;}
  #webinar .learn b {font-size:16px;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Footer content and visual tokens mirror Footer in src/main.jsx / src/styles.css. */
#webinar .footer {display:grid; grid-template-columns:minmax(0,1fr); gap:20px; width:100%; margin:0; padding:30px clamp(18px,4.5vw,58px) 110px; border-top:1px solid #c98f4738; background:radial-gradient(circle at 8% 0%,#d7b36c1f,transparent 28%),linear-gradient(180deg,#081321,#030812); color:#ffffffc2; font-size:14px; line-height:1.5; text-align:center; scroll-margin-top:112px;}
#webinar .footer > * {min-width:0;}
#webinar .footer a {color:inherit; text-decoration:none;}
#webinar .footer a:hover {color:#c98f47;}
#webinar .footer-brand {justify-self:center;}
#webinar .footer-brand img {display:block; width:min(252px,72vw); height:auto;}
#webinar .footer nav {display:flex; flex-wrap:wrap; justify-content:center; align-content:start; gap:10px 18px; width:100%;}
#webinar .footer nav > span, #webinar .footer address > span {flex:0 0 100%; color:#f2dfad; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
#webinar .footer address {display:grid; gap:9px; justify-items:center; align-content:start; margin:0; font-style:normal;}
#webinar .footer address a {max-width:100%; overflow-wrap:anywhere;}
#webinar .footer .social-link {display:inline-flex; gap:6px; align-items:center; min-height:32px;}
#webinar .social-link svg {width:17px; height:17px; color:#c98f47; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8;}
#webinar .social-link svg path {fill:currentColor; stroke:none;}
#webinar .footer-legal-links a {font-size:13px; font-weight:800; padding:7px 0;}
#webinar .footer p {max-width:820px; margin:0; justify-self:center; color:#ffffff8c; font-size:13px; line-height:1.46;}
#webinar .quentrik {display:flex; flex-direction:column; align-items:center; gap:0; width:100%; padding-top:18px; border-top:1px solid #ffffff1f;}
#webinar .quentrik span {color:#ffffff80; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
#webinar .quentrik img {display:block; width:155px; max-width:100%; height:auto; filter:drop-shadow(0 0 16px #45abff33);}
@media (max-width:720px) {
  #webinar .footer .footer-socials {display:grid; grid-template-columns:repeat(2,max-content); justify-items:center; gap:8px 18px;}
  #webinar .footer-socials > span, #webinar .footer-socials .social-link:nth-of-type(5), #webinar .footer-socials .social-link:nth-of-type(6) {grid-column:1 / -1;}
}
@media (width > 1120px) {#webinar .footer {padding-bottom:20px;}}
@media (min-width:1280px) {
  #webinar .footer {grid-template-columns:minmax(220px,1fr) minmax(0,2fr) minmax(220px,1fr); gap:20px clamp(22px,4vw,62px); padding-top:24px;}
  #webinar .footer-brand {justify-self:start;}
  #webinar .footer-brand img {width:228px;}
  #webinar .footer address {justify-items:end; text-align:right;}
  #webinar .footer-legal-links, #webinar .footer p {grid-column:2;}
  #webinar .quentrik {grid-column:1 / -1;}
}