/* Exo 2, event facts, video invitation and a separate registration band. */
:root { font-family:'Exo 2','Segoe UI',Arial,sans-serif; --blue:#ea445a; --blue-deep:#e21934; }
body, button, input, select, textarea { font-family:'Exo 2','Segoe UI',Arial,sans-serif; }
h1,h2,h3 { font-weight:600; line-height:1.25; letter-spacing:normal; }
strong { font-weight:600; }
.header-inner { height:88px; }
/* Evenly spaced event details with centered vertical separators. */
.event-facts { padding:18px 0 0; background:var(--light); }
.event-facts-grid { display:grid; grid-template-columns:minmax(0,max-content) minmax(32px,1fr) minmax(0,max-content) minmax(32px,1fr) minmax(0,max-content) minmax(32px,1fr) minmax(0,max-content); }
.event-fact { display:grid; grid-template-columns:27px minmax(0,max-content); column-gap:12px; row-gap:2px; align-content:center; min-width:0; min-height:66px; margin:0; padding:8px 0; border:0; border-radius:0; background:transparent; text-align:left; }
.event-fact-separator { width:1px; height:34px; background:var(--line); align-self:center; justify-self:center; }
.event-icon { width:27px; height:27px; color:var(--blue); grid-row:1 / 3; align-self:center; }
.event-fact dt { grid-column:2; color:var(--muted); font-size:.875rem; line-height:1.3; font-weight:500; }
.event-fact dd { grid-column:2; margin:0; color:var(--navy); font-size:1rem; font-weight:600; line-height:1.4; }
.event-fact dd span, .event-fact dd time { white-space:nowrap; }
.hero-editorial { padding:44px 0 52px; background:var(--light); overflow:hidden; }
.hero-editorial .hero-grid { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); grid-template-areas:"copy video"; gap:0 56px; align-items:start; }
.hero-editorial h1 { max-width:730px; font-size:2.875rem; font-weight:700; line-height:1.25; letter-spacing:normal; color:var(--navy); }
.hero-editorial h1 span { color:inherit; }
.hero-editorial .hero-subtitle { font-size:1.375rem; font-weight:400; letter-spacing:normal; color:var(--ink); margin:24px 0 23px; line-height:1.4; padding-left:20px; border-left:4px solid var(--blue); }
.hero-copy { grid-area:copy; }
.hero-register { margin-bottom:0; min-width:230px; }
.hero-register-mobile { grid-area:register; }
/* Specyficzność ≥ .btn motywu (display:inline-flex !important), inaczej oba CTA hero są widoczne naraz. */
.hero-editorial .hero-grid .btn.hero-register-mobile { display:none !important; }
/* The longer explanation belongs beside the registration form. */
.registration-explanation { max-width:540px; margin-top:24px; }
.registration-lead { font-size:1.075rem; line-height:1.7; color:var(--muted); margin:0; }
.registration-points { padding:0; list-style:none; display:grid; gap:10px; margin:20px 0; font-size:1.075rem; line-height:1.6; }
.registration-points li { display:flex; gap:12px; }
.registration-points li::before { content:'✓'; color:#f09a37; font-weight:700; flex:none; }
.registration-transition { margin-bottom:0; }
/* A deliberate video mockup; no unrelated video is loaded. */
.hero-video { grid-area:video; margin:7px 0 0; min-width:0; }
.video-preview { aspect-ratio:16 / 9; position:relative; overflow:hidden; border-radius:10px; color:#fff; background:#212224; isolation:isolate; }
.video-preview-top, .video-preview-bottom { position:absolute; left:20px; right:20px; display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:.875rem; line-height:1.4; }
.video-preview-top { top:18px; color:#eeeeee; }
.video-platform { font-weight:700; color:#fff; }
.video-preview-center { position:absolute; inset:52px 20px 46px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:15px; }
.video-play { width:72px; height:51px; flex:none; display:grid; place-items:center; padding:0; border:1px solid #ffffff45; border-radius:12px; color:#fff; background:var(--blue); transition:background .18s,transform .18s; }
.video-play:hover { background:var(--blue-deep); transform:scale(1.04); }
.video-play svg { width:27px; height:27px; margin-left:-3px; }
.video-preview-title { text-align:center; font-size:clamp(1.05rem,1.65vw,1.35rem); font-weight:500; line-height:1.35; }
.video-preview-bottom { bottom:16px; color:#eeeeee; }
.video-duration { padding:3px 7px; border-radius:3px; color:#fff; background:#333333; font-variant-numeric:tabular-nums; }
.video-placeholder-message { position:absolute; inset:0; padding:24px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background:var(--navy); }
.video-placeholder-message[hidden] { display:none; }
.video-placeholder-message strong { font-size:1.2rem; }
.video-placeholder-message p { font-size:1rem; line-height:1.5; margin:10px 0 16px; max-width:340px; }
.video-preview-back { background:transparent; color:#fff; border:1px solid #d6d6d6; border-radius:4px; min-height:44px; padding:9px 15px; font-size:.875rem; }
.registration-band { padding:68px 0; background:var(--white); border-top:0; scroll-margin-top:16px; }
.registration-intro .kicker { margin-bottom:12px; }
.registration-intro h2 { font-size:1.6rem; line-height:1.24; margin-bottom:21px; }
.trust-strip { background:var(--light); color:var(--navy); border-bottom:1px solid var(--line); }
.trust-grid>div { border-color:var(--line); }
.trust-grid strong { color:var(--blue); }
.trust-grid span { color:var(--muted); }
.number { font-weight:500; }
.program-list article { grid-template-columns:64px minmax(0,1fr) 155px; }
@media(max-width:1050px) {
    .event-fact { column-gap:9px; grid-template-columns:24px minmax(0,max-content); }
    .event-icon { width:24px; height:24px; }
    .video-preview-top, .video-preview-bottom { left:14px; right:14px; font-size:.8125rem; }
    .video-preview-center { gap:10px; }

    .hero-editorial .hero-grid { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); column-gap:32px; }
    .hero-editorial h1 { font-size:2.625rem; }
    .program-list article { grid-template-columns:64px minmax(0,1fr) 125px; }
}
/* Two equal, fluid columns share icon and text alignment in both rows. */
@media(max-width:799px) {
    .event-facts { padding-top:12px; }
    .event-facts-grid { --fact-icon-size:clamp(20px,3vw,24px); grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr); gap:clamp(18px,3vw,24px) clamp(12px,3vw,24px); }
    .event-fact { min-height:56px; grid-template-columns:var(--fact-icon-size) minmax(0,1fr); align-content:start; column-gap:clamp(8px,1.2vw,10px); row-gap:3px; }
    .event-fact-separator:nth-of-type(2) { display:none; }
    .event-fact-separator { height:34px; }
    .event-icon { width:var(--fact-icon-size); height:var(--fact-icon-size); align-self:start; margin-top:5px; }
    .event-fact dt { font-size:clamp(.75rem,.6875rem + .4vw,.875rem); }
    .event-fact dd { font-size:clamp(.875rem,.75rem + .5vw,1rem); }
    .event-fact:first-child dd time { display:flex; flex-wrap:wrap; column-gap:.3em; white-space:normal; }
}
@media(max-width:760px) {
    .hero-video { margin:0; width:100%; }
    .video-preview-top, .video-preview-bottom { font-size:.875rem; }
    .video-preview-title { font-size:1.125rem; }

    .header-inner { height:70px; }
    .header .brand img { width:220px; }
    .hero-editorial { padding:32px 0 36px; }
    .hero-editorial .hero-grid { grid-template-columns:1fr; grid-template-areas:"copy" "video" "register"; gap:28px; }
    .hero-editorial h1 { font-size:clamp(2rem,6.5vw,2.625rem); line-height:1.25; max-width:590px; }
    .hero-editorial .hero-subtitle { margin:22px 0 0; font-size:1.3rem; padding-left:15px; }
    .hero-register { width:100%; margin-bottom:0; }
    .hero-editorial .hero-grid .btn.hero-register-desktop { display:none !important; }
    .hero-editorial .hero-grid .btn.hero-register-mobile { display:inline-flex !important; }
    .registration-explanation { max-width:none; }
    .registration-lead, .registration-points { font-size:1rem; }
    .registration-band { padding:51px 0; }
    .registration-intro h2 { font-size:1.6rem; max-width:480px; margin-bottom:15px; }
    .program-list article { grid-template-columns:54px minmax(0,1fr); }
}
@media(max-width:370px) {
    .video-preview-top, .video-preview-bottom { left:12px; right:12px; font-size:.75rem; }
    .video-preview-center { inset:42px 12px 38px; gap:9px; }
    .video-play { width:60px; height:42px; }
    .video-preview-title { font-size:1rem; }
    .video-placeholder-message { padding:16px; }
    .video-placeholder-message strong { font-size:1rem; }
    .video-placeholder-message p { font-size:.875rem; margin:8px 0; }

    .hero-editorial h1 { font-size:2rem; }
}

/* Component details shared with prostodom.pl. */
.kicker { font-weight:600; }
.hero-subtitle strong { font-weight:600; }
.signup-form input:not([type=checkbox]) { border:1px solid transparent; border-radius:10px; background:#f7f7f7; color:#333; min-height:60px; font-size:1rem; padding:15px; }
.signup-form input:not([type=checkbox]):focus { border-color:#646464; }
.signup-form input::placeholder { color:#767676; }
.signup-form .consent-field input { accent-color:#3478f6; }
.final-form { background:var(--light); border:0; border-radius:10px; }
.check { color:#f09a37; background:#fdf8f0; }
.host-section { background:var(--white); border:0; }
.portrait-sign { color:#333; }
.host-brand { color:#333; }
.host-copy .kicker { color:#ea445a; }
.trust-grid strong { letter-spacing:normal; }
.program-list .number { font-weight:600; letter-spacing:normal; }
.form-status { background:var(--white); }
:focus-visible { outline:3px solid #3478f6; outline-offset:4px; }

/* Both registration cards share .final-form and .signup-form styling. */

/* One heading system, based on the FAQ section. */
.section-title { align-self:start; min-width:0; }
.section-title .kicker { font-family:inherit; font-size:.76rem; font-weight:600; line-height:1.7; letter-spacing:.13em; margin:0 0 1rem; }
.section-title h2 { font-family:inherit; font-size:clamp(2rem,3.2vw,2.8rem); font-weight:600; line-height:1.25; letter-spacing:normal; margin:0; }
.section-title h2 span { color:inherit; font-weight:inherit; }
.section-title .section-intro,
.final-grid > .section-title > .section-intro { font-size:1.075rem; font-weight:400; line-height:1.7; color:var(--muted); max-width:420px; width:auto; margin:1.4rem 0 0; }
.section-heading.section-title { display:block; margin-bottom:40px; }
.section-heading.section-title .section-intro { max-width:680px; }
.final-grid, .for-grid, .faq-grid, .host-grid { align-items:start; }
.host-section { padding:0 0 70px; }
.host-grid { padding-top:70px; }
.host-copy { padding:0; }
.host-copy > .section-title { margin-bottom:1.15rem; }
.final-meta { display:block; margin-top:20px; }

/* Identical registration cards: persistent labels inside the fields. */
.final-form { min-width:0; }
.signup-form .form-field { margin:0 0 16px; }
.signup-form .field-control { background:var(--white); border:1px solid transparent; border-radius:10px; overflow:hidden; padding:11px 15px 9px; transition:border-color .18s,box-shadow .18s; }
.signup-form .field-control:focus-within { border-color:#646464; box-shadow:0 0 0 2px #3478f633; }
.signup-form .field-control label { display:block; color:var(--ink); font-size:.875rem; font-weight:600; line-height:1.4; margin:0 0 3px; cursor:text; }
.signup-form .field-control input { width:100%; min-width:0; min-height:24px; padding:0; border:0; border-radius:0; background:transparent; font-size:1rem; line-height:1.5; color:var(--ink); box-shadow:none; }
.signup-form .field-control input:focus { outline:none; border:0; }
.signup-form .field-control input::placeholder { color:#767676; opacity:1; }
.signup-form .optional { font-size:.8125rem; font-weight:400; }
.signup-form .field-help { font-size:.8125rem; line-height:1.5; color:var(--muted); margin:6px 2px 0; }
.signup-form .required-mark { color:#e21934; font-weight:600; }
.signup-form .consent-field { display:flex; align-items:flex-start; gap:12px; margin:20px 0; }
.signup-form .consent-field input { flex:0 0 20px; width:20px; height:20px; min-height:20px; padding:0; margin:1px 0 0; accent-color:#3478f6; cursor:pointer; }
.signup-form .consent-field .consent-label { font-size:.8125rem; line-height:1.55; font-weight:400; color:var(--muted); margin:0; cursor:pointer; overflow-wrap:anywhere; }
.consent-label a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
.consent-label a:hover { color:var(--ink); }
.final-form .reassurance { margin:12px 0 0; }
@media(max-width:760px) {
    .section-title h2 { font-size:2rem; max-width:none; }
    .section-title .section-intro,
    .final-grid > .section-title > .section-intro { font-size:1rem; max-width:none; }
    .section-heading.section-title { margin-bottom:30px; }
    .host-section { padding:0; }
    .host-grid { padding-top:59px; }
    .host-copy { padding:0 0 35px; }
    .signup-form .field-control { padding:10px 13px 8px; }
}
@media(max-width:370px) {
    .final-form { padding:20px; }
}

/* White/gray alternation, including the separate gray results ribbon. */
.program, .final-section { background:var(--light); }
.for-you, .host-section, .faq-section, footer { background:var(--white); }
.faq-section { border-top:0; }
.final-section .final-form { background:var(--white); }
.final-section .signup-form .field-control,
.final-section .form-status { background:var(--light); }

/* A shared row aligns the headline/CTA block and video at both edges. */
.hero-editorial .hero-grid { align-items:stretch; }
.hero-copy { display:flex; flex-direction:column; min-width:0; }
.hero-register { align-self:flex-start; margin-top:auto; }
.hero-video { display:flex; align-items:stretch; margin:0; }
.hero-video .video-preview { width:100%; height:100%; min-height:0; }

/* Smaller form typography with separate field, help, and consent groups. */
.final-form { padding:26px; }
.final-form h3 { font-size:1.1875rem; font-weight:600; line-height:1.35; margin:0; }
.final-grid > .final-form > .event-date { font-size:.875rem; font-weight:500; line-height:1.5; color:var(--muted); margin:7px 0 22px; }
.signup-form .form-field { margin:0 0 16px; }
.signup-form .field-control { padding:9px 13px 8px; border-color:var(--line); border-radius:8px; }
.signup-form .field-control label { font-size:.8125rem; line-height:1.35; margin:0 0 2px; }
.signup-form .field-control input { font-size:.9375rem; line-height:1.45; min-height:22px; }
.signup-form .optional { font-size:.75rem; }
.signup-form .field-help { font-size:.75rem; line-height:1.5; margin:6px 2px 0; }
.signup-form .consent-field { border-top:1px solid var(--line); padding-top:17px; margin:20px 0; gap:10px; }
.signup-form .consent-field input { flex-basis:18px; width:18px; height:18px; min-height:18px; margin-top:1px; }
.signup-form .consent-field .consent-label { font-size:.75rem; line-height:1.6; }
.final-grid > .final-form > .reassurance { font-size:.75rem; line-height:1.55; margin:12px 0 0; max-width:none; color:var(--muted); }
.final-form .form-status { font-size:.8125rem; line-height:1.5; }

@media(min-width:761px) and (max-width:960px) {
    .hero-editorial .hero-grid { grid-template-columns:1fr; grid-template-areas:"copy" "video"; gap:28px; }
    .hero-editorial h1 { max-width:700px; }
    .hero-register { margin-top:0; }
    .hero-video .video-preview { height:auto; }
}
@media(max-width:760px) {
    .hero-register { margin-top:0; }
    .hero-video .video-preview { height:auto; }
    .final-form { padding:22px; }
    /* Keep entered values at 16px to avoid focus zoom on mobile browsers. */
    .signup-form .field-control input { font-size:1rem; }
}
@media(max-width:370px) {
    .final-form { padding:18px; }
}
/* Formularze webinaru na klasach formularza motywu (.form-field, .custom-checkbox, .btn) – tylko uzupełnienia. */
.kw-form .btn, .mobile-cta .btn { width:100%; }
.kw-form .required-mark { color:#ea445a; }
/* Kwadrat checkboxa jak w .custom-checkbox motywu (tam rysuje go markup CF7). */
.kw-form .custom-checkbox input[type=checkbox] { position:absolute; opacity:0; }
.kw-form .kw-checkbox { position:relative; flex:0 0 20px; width:20px; height:20px; margin-right:15px; background:#fff; border:1px solid #d6d6d6; border-radius:4px; transition:border-color .2s; }
.kw-form .kw-checkbox::after { content:'\e90e'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'icomoon'; font-size:20px; color:#3478f6; opacity:0; transition:opacity .2s; }
.kw-form .custom-checkbox input:checked + .kw-checkbox { border-color:transparent; }
.kw-form .custom-checkbox input:checked + .kw-checkbox::after { opacity:1; }
.kw-form .custom-checkbox input:focus-visible + .kw-checkbox { outline:2px solid #3478f6; outline-offset:2px; }
/* Tekst zgody jak przypisy pod polami (.field-help): bez pogrubienia, ten sam rozmiar, interlinia i kolor. */
.kw-form .custom-checkbox__label { font-size:.78rem; font-weight:400; line-height:1.5; color:var(--muted); }

/* Krok 2 formularza webinaru: kompaktowe potwierdzenie i opcjonalne pytanie o etap. */
.kw-form .confirmation-heading { display:flex; align-items:center; gap:12px; }
.kw-form .confirmation-heading h3 { margin:0; }
.kw-form .confirmation-icon { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border:2px solid #ea445a; border-radius:50%; color:#ea445a; }
.kw-form .confirmation-icon svg { width:18px; height:18px; }
.kw-form .confirmation-copy { margin:16px 0 0; font-size:.875rem; line-height:1.55; color:var(--muted); }
.kw-form .confirmation-email { display:block; font-weight:700; color:var(--ink); overflow-wrap:anywhere; }
.kw-form .stage-form { margin-top:20px; padding-top:24px; border-top:1px solid var(--line); }
.kw-form .optional-label { margin:0 0 6px; font-size:.75rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.kw-form .stage-form h4 { margin:0 0 14px; font-size:1.125rem; font-weight:600; line-height:1.35; color:var(--ink); }
.kw-form .stage-form label { display:block; margin:0 0 8px; font-size:.875rem; line-height:1.4; color:var(--ink); }
.kw-form .stage-form select { height:52px; padding:0 40px 0 14px; border:1px solid #d6d6d6; border-radius:8px !important; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23646464' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center / 12px 8px; font-size:.9375rem; line-height:1.4; cursor:pointer; }
.kw-form .stage-form select:focus { border-color:#646464; box-shadow:0 0 0 2px #3478f633; }
.kw-form .stage-form .btn.btn-primary { margin-top:18px; }
.kw-form .stage-form .btn.btn-primary:disabled,
.kw-form .stage-form .btn.btn-primary:disabled:hover { background-color:#e5e5e5; color:#8a8a8a; box-shadow:none; cursor:default; opacity:1; transform:none; }
.kw-form .skip-stage { display:block; margin:10px auto 0; padding:0; border:0; background:none; font-size:.8125rem; color:var(--muted); text-decoration:underline; text-underline-offset:3px; }

/* Końcowe podziękowanie po kroku 2: ikona nad tekstem, treść do lewej (padding daje karta). */
.thanks-view.kw-form:focus { outline:none; }
.thanks-view.kw-form .confirmation-heading { display:block; }
.thanks-view.kw-form .confirmation-icon { margin:0 0 22px; }
.thanks-view.kw-form h3 { margin:0; font-size:1.25rem; line-height:1.35; font-weight:600; color:var(--ink); }
.thanks-view.kw-form p { margin:10px 0 0; font-size:1rem; line-height:1.5; color:var(--muted); }

/* Błędy walidacji formularza webinaru (z backendu). */
.kw-form .form-error { margin:0 0 16px; padding:16px 18px; border-radius:10px; background:#fdecef; color:#d12f46; font-size:.875rem; line-height:1.5; }
.kw-form .form-field.is-invalid { margin-bottom:0; }
.kw-form .form-field.is-invalid input,
.kw-form .form-field.is-invalid select { border-color:#ea445a; }
.kw-form .form-field.is-invalid input:focus,
.kw-form .form-field.is-invalid select:focus { border-color:#ea445a; box-shadow:0 0 0 3px #ea445a26; }
.kw-form .field-error { margin:6px 0 10px; font-size:.8125rem; line-height:1.45; color:#d12f46; text-align:left; }
.kw-form .custom-checkbox.is-invalid { margin-bottom:0; }
.kw-form .custom-checkbox.is-invalid input:not(:checked) + .kw-checkbox { border-color:#ea445a; }
.kw-form .custom-checkbox.is-invalid + .field-error { margin-bottom:20px; }
