/* The landing in the style of bidzaar.com — see DESIGN.md. Loaded last; it repaints the layers
   inherited from the 10.11 page. One font (Eesti), flat colour plates in the site's skewed shapes
   (clip-path #bz-* defined at the top of <body>), no shadows, lowercase headings and buttons. */
:root{--bz-ink:#111111;--bz-text:#4d4d4d;--bz-muted:#8a8a8a;--bz-page:#fff;--bz-surface:#f7f7f7;--bz-rose:#fff2f7;--bz-line:#ededed;--bz-chip:#acacac;--bz-pink:#ff0067;--bz-pink-hover:#e0005a;--bz-blue:#1f5bff;--bz-wrap:1200px;--bz-sec:112px}

html body{background:var(--bz-page);color:var(--bz-ink);font-family:Eesti,Arial,sans-serif}
html body .wrap{width:min(var(--bz-wrap),calc(100% - 64px))}

/* One font: Eesti everywhere, regular weight for display type, as on the site. */
html body :is(h1,h2,h3,.wow-title,.wow-subtitle,.st-days,.st-inbox b,.speaker h3,.wt-tile h3,.agenda li::before){font-family:Eesti,Arial,sans-serif!important;letter-spacing:-.01em!important}
html body :is(h1,h2){font-weight:400!important;text-transform:lowercase;color:var(--bz-ink)}
html body h2{font-size:56px!important;line-height:1.2!important}
html body h3{font-weight:400!important}

/* No glows, no shadows. */
html body :is(.wow-bg,.wt-aura,.cursor-glow,.diagnostic-glow,.wow-shine,.wt-beams){display:none!important}
html body :is(.st,.st-app,.st-deadline,.st-inbox,.diagnostic-card,.wt-tile,.speaker,.materials,.company-title-card,.company-mission-card,.client-logos){box-shadow:none!important}

/* Buttons: small capsules in the header, big skewed plates elsewhere. */
html body .btn{font-family:Eesti,Arial,sans-serif;text-transform:lowercase;box-shadow:none!important;transition:background .2s,transform .2s}
html body header .btn{min-height:0!important;padding:11px 22px!important;border-radius:99px!important;font-size:14px!important;font-weight:700!important;line-height:1!important;background:var(--bz-pink)!important}
html body main .btn{border-radius:0!important;clip-path:url(#bz-narrow-1);background:var(--bz-pink)!important;color:#fff!important;font-size:22px!important;font-weight:400!important;min-height:72px!important;padding:0 44px!important}
html body main .btn:nth-of-type(even){clip-path:url(#bz-narrow-2)}
html body main .btn:hover{background:var(--bz-pink-hover)!important;transform:translateY(-2px)}
html body .wow-hero .wow-cta{min-height:84px!important;font-size:24px!important;padding:0 56px!important}
html body .mobile-registration{text-transform:lowercase}

/* Header: white, no rule. */
html body header{background:#fffffff2!important;border-bottom:0!important}
html body header nav a{font-size:16px!important;text-transform:lowercase;color:var(--bz-ink)}
html body header nav a.is-current,html body header nav a:hover{color:var(--bz-pink)!important}

/* Hero */
html body main>.wow-hero{background:var(--bz-page)!important;padding-top:56px!important}
html body .wow-hero .wow-title{font-size:64px!important;line-height:1.15!important;color:var(--bz-ink)!important}
html body .wow-hero .wow-title .t-accent{color:var(--bz-pink)}
html body .wow-hero .wow-subtitle{font-size:26px!important;line-height:1.3!important;color:var(--bz-ink)!important;max-width:520px;margin-top:20px}
html body .wow-meta{gap:10px}
html body .wow-meta>*{padding:8px 18px;border:1px solid var(--bz-chip);border-radius:99px;font-size:16px;color:var(--bz-ink)!important;background:#fff}
html body .wow-meta .wow-tag{background:var(--bz-blue);border-color:var(--bz-blue);color:#fff!important}
html body .wow-hero .wow-cta{margin-top:36px}

/* Hero story: a grey skewed plate. */
html body .st{background:var(--bz-surface)!important;border:0!important;border-radius:0!important;clip-path:url(#bz-side-1);padding:28px 26px 0}
html body .st-app,html body .st-deadline{border-color:var(--bz-line)!important}
html body .st-say p{background:var(--bz-ink)}
html body .wow-hero .wow-case.case-result{border-left:3px solid var(--bz-pink)}
html body .wow-hero .case-result .wow-stamp{color:var(--bz-pink)}
html body .wow-hero .case-result .wow-case-text{font-size:16px!important;color:var(--bz-text)!important}

/* Problem + gift: the gift is a solid pink plate with white type and a white button. */
html body main>section.process-section{background:var(--bz-page)!important;padding-top:96px!important}
html body .process-section .cinema-copy h2{text-transform:none}
html body .process-section .cinema-copy h2,html body .process-section .cinema-copy h2 span{color:var(--bz-ink)!important}
html body .process-section .cinema-copy h2 .loss-accent,html body .process-section .cinema-copy h2 .loss-accent span{color:var(--bz-pink)!important}
html body .process-section .cinema-copy p{font-size:18px!important;color:var(--bz-text)!important}
html body .process-section .process-gift .diagnostic-card{background:var(--bz-pink)!important;border:0!important;border-radius:0!important;clip-path:url(#bz-side-2);padding:40px 36px!important}
html body .diagnostic-card::before,html body .diagnostic-card::after{display:none!important}
html body .diagnostic-card .gift-label{color:#ffffffcc!important}
html body .diagnostic-card h3{color:#fff!important;font-size:30px!important;line-height:1.15!important}
html body .diagnostic-card .btn{background:#fff!important;color:var(--bz-pink)!important}
html body .diagnostic-card .btn:hover{background:var(--bz-rose)!important}
html body .diagnostic-card .gift-symbol{width:96px!important;height:96px!important}

/* Topics: grey skewed plates, heading black, glossy icons. */
html body .wt-tile{background:var(--bz-surface)!important;border:0!important;border-radius:0!important;clip-path:url(#bz-side-1);padding:30px!important;grid-template-columns:1fr 76px!important}
html body .wt-tile:nth-child(even){clip-path:url(#bz-side-2)}
html body .wt-tile::before,html body .wt-tile::after{display:none!important}
html body .wow-topics .wt-tile h3{color:var(--bz-ink)!important;font-size:26px!important}
html body .wow-topics .wt-tile p,html body .wow-topics .topic-line{color:var(--bz-text)!important;font-size:17px!important}
html body .wt-icon,html body .wt-tile[data-side] .wt-icon{width:76px!important;height:76px!important}

/* Program */
html body main>section#program{background:var(--bz-page)!important;width:auto!important;margin:0!important;border-radius:0!important;padding:var(--bz-sec) 0!important}
html body #program .date-pill{border:1px solid var(--bz-chip)!important;border-radius:99px!important;background:#fff!important;color:var(--bz-ink)!important;font-size:16px}
html body #program .agenda li{border-color:var(--bz-line)!important;font-size:22px!important;color:var(--bz-ink)!important}
html body #program .agenda li::before{color:var(--bz-pink)!important;font-size:18px!important}

/* Speakers: three grey plates. */
html body main>.speakers{background:var(--bz-page)!important;padding:var(--bz-sec) 0!important}
html body .speakers .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
html body .speakers .wrap>h2{grid-column:1/-1;margin-bottom:24px}
html body .speakers .speaker{display:flex!important;flex-direction:column;padding:36px 32px 40px!important;margin:0!important;border:0!important;background:var(--bz-surface)!important;clip-path:url(#bz-side-1)}
html body .speakers .speaker:nth-of-type(even){clip-path:url(#bz-side-2)}
html body .speakers .portrait{width:136px!important;height:136px!important;margin-bottom:24px;align-self:flex-start;background:var(--bz-rose)!important}
html body .speakers .speaker h3{font-size:24px!important;color:var(--bz-ink)!important}
html body .speakers .role{font-size:16px!important;margin:8px 0 16px!important;color:var(--bz-text)!important}
html body .speaker-tenure{display:block!important;font-size:16px}
html body .speaker-tenure strong{color:var(--bz-pink)!important;margin-right:6px}
html body .speaker-points{font-size:16px!important;padding-left:18px!important;margin-top:12px!important}
html body .speakers li{color:var(--bz-text)!important}

/* Materials: one big blue plate with white type. */
html body main>#materials{background:var(--bz-page)!important;border:0!important;padding:40px 0 var(--bz-sec)!important}
html body #materials .materials{background:var(--bz-blue)!important;border:0!important;border-radius:0!important;clip-path:url(#bz-side-2);padding:72px 64px!important}
html body #materials :is(h2,h3,.material-finale){color:#fff!important}
html body #materials .resource-list li{border-color:#ffffff40!important}
html body #materials .resource-list h3{font-size:20px!important}
html body #materials .resource-list .icon{stroke:#fff!important;color:#fff!important}
html body #materials .btn{background:#fff!important;color:var(--bz-blue)!important}
html body #materials .btn:hover{background:var(--bz-rose)!important}


/* Clients: logos on grey tiles, as on the site. */
html body main>section.clients-section{background:var(--bz-page)!important;padding:48px 0 var(--bz-sec)!important}
html body .clients-section h2{font-size:40px!important}
html body .client-logos{background:transparent!important;border:0!important;padding:0!important;display:grid!important;grid-template-columns:repeat(5,1fr);gap:8px}
html body .client-logos li{background:var(--bz-surface);border-radius:12px;display:grid;place-items:center;padding:22px 18px;height:104px}

html body footer{border-top:1px solid var(--bz-line)!important;color:var(--bz-muted)}

@media(max-width:1000px){
 html body .speakers .wrap{grid-template-columns:1fr}
 html body .client-logos{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
 :root{--bz-sec:64px}
 html body .wrap{width:calc(100% - 36px)}
 html body h2{font-size:34px!important}
 html body .wow-hero .wow-title{font-size:40px!important}
 html body .wow-hero .wow-subtitle{font-size:21px!important}
 html body main .btn{font-size:19px!important;min-height:64px!important;padding:0 28px!important}
 html body .wow-hero .wow-cta{min-height:68px!important;font-size:20px!important}
 html body .process-section .process-gift .diagnostic-card{padding:32px 24px!important}
 html body .diagnostic-card h3{font-size:24px!important}
 html body #materials .materials{padding:44px 24px!important}
 html body .clients-section h2{font-size:30px!important}
 html body .client-logos{grid-template-columns:repeat(2,1fr)}
 html body .speakers .speaker{padding:28px 24px 32px!important}
 /* Topic tiles in one full-width column; the buyer already stars in the hero. */
 html body .wow-topics .wt-stage{display:block!important}
 html body .wow-topics .wt-center{display:none!important}
 html body .wow-topics .wt-tiles{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;width:100%!important;margin:0!important}
 html body .wow-topics .wt-tile:nth-child(n){margin:0!important;width:auto!important;left:0!important;min-height:0!important;grid-template-columns:1fr 60px!important;padding:24px!important}
 html body .wt-icon,html body .wt-tile[data-side] .wt-icon{width:60px!important;height:60px!important}
}

/* One content column for every section: the inherited layers gave some sections their own width. */
html body main>section{width:auto!important;margin-left:0!important;margin-right:0!important;border-radius:0!important}
html body main>section>.wrap,html body header>.wrap,html body footer>.wrap{width:min(var(--bz-wrap),calc(100% - 64px))!important;margin-left:auto!important;margin-right:auto!important}
html body .wow-meta>*{padding:8px 18px!important}
/* The mascot's pink backdrop would turn violet on blue; make it a faint white shape instead. */
html body #materials .brand-practice-shape{filter:brightness(0) invert(1);opacity:.16}
@media(max-width:760px){html body main>section>.wrap,html body header>.wrap,html body footer>.wrap{width:calc(100% - 36px)!important}}
html body main>section:is(.wow-hero,.process-section,.wow-topics)>.wrap{width:min(var(--bz-wrap),calc(100% - 64px))!important}
@media(max-width:760px){html body main>section:is(.wow-hero,.process-section,.wow-topics)>.wrap{width:calc(100% - 36px)!important}}

/* Programme rows on hover: pink text and a soft pink wash (the inherited rule turned it white for the dark page). */
html body #program .agenda-plain li:hover{background:linear-gradient(90deg,#fff2f7,transparent 75%)!important}
html body #program .agenda-plain li:hover>span{color:#ff0067!important}
html body #program .agenda-plain li:hover::before{text-shadow:none!important}

/* Speakers, compact: the photo with the name and role beside it, experience and points below. */
html body .speakers .speaker{display:grid!important;grid-template-columns:88px minmax(0,1fr);grid-template-areas:"photo name" "photo role" "tenure tenure" "points points";column-gap:18px;row-gap:0;align-content:start;padding:28px 26px 30px!important}
html body .speakers .speaker>div:not(.portrait){display:contents}
html body .speakers .portrait{grid-area:photo;width:88px!important;height:88px!important;margin:0!important;align-self:center}
html body .speakers .speaker h3{grid-area:name;align-self:end;font-size:21px!important;line-height:1.2!important;margin:0!important}
html body .speakers .role{grid-area:role;align-self:start;font-size:15px!important;line-height:1.35!important;margin:4px 0 0!important}
html body .speakers .speaker-tenure{grid-area:tenure;margin:18px 0 0!important;font-size:15px!important}
html body .speakers .speaker-points{grid-area:points;margin:8px 0 0!important;font-size:15px!important}
html body .speakers .speaker-points li{margin:4px 0!important}
html body .speakers .wrap>h2{margin-bottom:8px!important}
@media(max-width:760px){
 html body .speakers .speaker{grid-template-columns:72px minmax(0,1fr);column-gap:14px;padding:24px 20px 26px!important}
 html body .speakers .portrait{width:72px!important;height:72px!important}
 html body .speakers .speaker h3{font-size:19px!important}
}

/* Company block as before the restyle: the white statement card with the silver lightning, the grey mission card
   with the ring and the sphere (styles from light.css / company.css). */
html body main>section.company-section{padding:0 0 40px!important}
html body .company-title-card h2{text-transform:none}

/* Materials: the brand pink plate instead of blue. */
html body #materials .materials{background:#ff0067!important}
html body #materials .btn{background:#fff!important;color:#ff0067!important}
html body #materials .resource-list li{border-color:#ffffff4d!important}
html body .company-title-card{box-shadow:inset 0 0 0 1px #efe3e9!important}

/* Less space before the programme and before the speakers. */
html body main>section.wow-topics{padding-bottom:16px!important}
html body main>section#program{padding-top:48px!important;padding-bottom:40px!important}
html body main>section.speakers{padding-top:40px!important}
@media(max-width:760px){
 html body main>section#program{padding-top:36px!important;padding-bottom:28px!important}
 html body main>section.speakers{padding-top:28px!important}
}
/* Less space before «После вебинара вы получите». */
html body main>section.speakers{padding-bottom:24px!important}
html body main>section#materials{padding-top:24px!important}
@media(max-width:760px){html body main>section.speakers{padding-bottom:16px!important}html body main>section#materials{padding-top:16px!important}}
/* No gap between the company cards and «Клиенты». */
html body main>section.company-section{padding-bottom:0!important}
html body main>section.clients-section{padding-top:28px!important}
@media(max-width:760px){html body main>section.clients-section{padding-top:20px!important}}

/* Phones: the sticky button sits on a frosted white strip instead of solid black. */
@media(max-width:760px){
 html body .mobile-cta-backdrop{background:rgba(255,255,255,.55)!important;-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);border-top:1px solid rgba(255,255,255,.7);box-shadow:0 -10px 30px -20px rgba(120,0,50,.35)}
 html body .mobile-registration{box-shadow:0 12px 26px -12px rgba(255,0,103,.7)!important;border:0!important}
}

/* Materials plate: the outline is drawn to its real size by shapes.js, so the skew stays even on phones too. */
html body #materials .materials{clip-path:var(--shape)!important}
/* Desktop keeps the original site outline for the materials plate; the size-drawn one is for phones only. */
@media(min-width:761px){html body #materials .materials{clip-path:url(#bz-side-2)!important}}
/* Desktop too: the materials plate uses the same even outline as the cards above it (top running down to the right). */
@media(min-width:761px){html body #materials .materials{clip-path:var(--shape)!important}}

/* «Задачи повторяются» uses the same heading style as «Программа вебинара». */
html body .process-section .cinema-copy h2{font-size:56px!important;line-height:1.2!important;letter-spacing:-.01em!important;text-transform:lowercase!important;color:#111!important;max-width:none!important}
html body .process-section .cinema-copy h2 span:not(.loss-accent):not(.loss-accent span){color:#111!important}
@media(max-width:760px){html body .process-section .cinema-copy h2{font-size:34px!important}}
html body .process-section .cinema-copy h2{color:#16121a!important}
html body .process-section .cinema-copy h2 span:not(.loss-accent):not(.loss-accent span){color:#16121a!important}

/* Topics heading, same style as the other section headings. */
html body .wow-topics .topics-title{margin:0 0 40px;font-size:56px!important;line-height:1.2!important;font-weight:400!important;letter-spacing:-.01em!important;color:#16121a!important;text-transform:lowercase}
@media(max-width:760px){html body .wow-topics .topics-title{font-size:34px!important;margin-bottom:24px}}

/* Topic tiles: every icon in the same spot and size — top-right corner, centred in a fixed 76px box. */
html body .wow-topics .wt-tile{position:relative;display:block!important;padding-right:122px!important}
html body .wow-topics .wt-icon,html body .wow-topics .wt-tile[data-side] .wt-icon{position:absolute!important;top:50px!important;right:30px!important;left:auto!important;bottom:auto!important;width:76px!important;height:76px!important;margin:0!important;display:grid!important;place-items:center;transform:none!important}
html body .wow-topics .wt-icon img{width:100%!important;height:100%!important;max-width:none!important;object-fit:contain}
html body .wow-topics .wt-tile h3{margin:0 0 10px!important}
@media(max-width:760px){
 html body .wow-topics .wt-tile:nth-child(n){padding-right:96px!important}
 html body .wow-topics .wt-icon,html body .wow-topics .wt-tile[data-side] .wt-icon{top:38px!important;right:22px!important;width:60px!important;height:60px!important}
}
/* Icons on the left of each tile, text to their right. */
html body .wow-topics .wt-tile{padding-left:126px!important;padding-right:32px!important}
html body .wow-topics .wt-icon,html body .wow-topics .wt-tile[data-side] .wt-icon{left:30px!important;right:auto!important}
@media(max-width:760px){
 html body .wow-topics .wt-tile:nth-child(n){padding-left:96px!important;padding-right:22px!important}
 html body .wow-topics .wt-icon,html body .wow-topics .wt-tile[data-side] .wt-icon{left:20px!important;right:auto!important}
}