*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:"Inter",Arial,sans-serif;color:#192331;background:#eef7fb}.hero{position:relative;min-height:900px;display:flex;align-items:center;overflow:hidden;background-image:linear-gradient(90deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.87) 28%,rgba(255,255,255,.42) 48%,rgba(255,255,255,.02) 72%),url("assets/nature-bg.png");background-size:cover;background-position:center center}.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01) 70%,rgba(242,248,241,.10))}.hero__container{position:relative;z-index:2;width:min(1200px,calc(100% - 96px));margin:0 auto}.hero__content{width:780px;padding:76px 0 70px}.hero__meta{display:flex;align-items:center;gap:20px;margin-bottom:22px;font-size:13px;font-weight:500;color:#6f7c89}.meta-item{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.hero__meta i{width:1px;height:20px;background:rgba(73,91,109,.16)}.icon{width:19px;height:19px;flex:0 0 auto;fill:none;stroke:#278ce1;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.hero__speaker{display:inline-flex;align-items:center;gap:12px;margin-bottom:30px;padding:11px 18px 11px 14px;border-radius:999px;background:rgba(255,255,255,.88);box-shadow:0 8px 24px rgba(63,86,105,.11);backdrop-filter:blur(10px);text-transform:uppercase}.icon--person{width:22px;height:22px;stroke:#278ce1}.hero__speaker .label{font-size:11px;font-weight:600;letter-spacing:.17em;color:#89939d}.speaker-divider{width:1px;height:20px;background:#dbe2e8;margin:0 2px}.hero__speaker strong{font-size:14px;font-weight:700;letter-spacing:.105em;color:#233142}.hero h1{max-width:740px;font-size:clamp(72px,6.25vw,96px);line-height:.90;letter-spacing:-.065em;font-weight:600;color:#182331}.hero__accent{display:inline-block;position:relative;background:linear-gradient(90deg,#49b9f3 0%,#2f9be8 48%,#176fc7 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#2385dd}.hero__lead{margin-top:42px;width:720px;font-family:"Inter",Arial,sans-serif;font-size:30px;line-height:1.34;letter-spacing:-.035em;font-weight:400;color:#465567}.hero__lead strong{font-family:"Inter",Arial,sans-serif;font-weight:650;color:#2f4358}.hero__button{display:flex;align-items:center;justify-content:space-between;width:440px;min-height:76px;margin-top:32px;padding:0 21px 0 43px;border-radius:999px;background:linear-gradient(100deg,#2367c8,#39aef1);color:#fff;text-decoration:none;font-size:22px;font-weight:600;box-shadow:0 13px 30px rgba(35,110,190,.23);transition:.2s ease}.hero__button b{display:grid;place-items:center;width:49px;height:49px;border:1px solid rgba(255,255,255,.48);border-radius:50%;font-size:28px;font-weight:400}.hero__button:hover{transform:translateY(-2px);box-shadow:0 17px 38px rgba(35,110,190,.29)}
html,
body {
width: 100%;
max-width: 100%;
overflow-x: hidden;
}
/* v11 — unified event card */
.hero__meta,
.hero__speaker { display:none; }
.hero__event-card{
width:max-content;
max-width:100%;
display:flex;
align-items:center;
gap:24px;
padding:14px 22px 14px 16px;
margin-bottom:38px;
border:1px solid rgba(255,255,255,.78);
border-radius:20px;
background:rgba(255,255,255,.82);
box-shadow:0 12px 34px rgba(35,72,86,.11);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
}
.mobiledisplayblock {
display: none;
}
.event-card__speaker{display:flex;align-items:center;gap:13px;}
.event-card__person{
width:39px;height:39px;padding:8px;
border-radius:12px;
background:#edf7fb;
stroke:#2c7898;fill:none;stroke-width:1.65;
}
.event-card__speaker div{display:flex;flex-direction:column;gap:3px;}
.event-card__speaker strong{
font-size:16px;line-height:1.1;font-weight:650;color:#18252b;
}
.event-card__speaker span{
font-size:13px;line-height:1.1;font-weight:400;color:#708087;
}
.event-card__divider{
width:1px;height:38px;background:rgba(47,73,84,.16);
}
.event-card__date{display:flex;flex-direction:column;gap:3px;min-width:105px;}
.event-card__date strong{
font-size:15px;line-height:1.1;font-weight:600;color:#24343b;
}
.event-card__date span{
font-size:13px;line-height:1.1;font-weight:450;color:#708087;
}
/* Stronger contrast of weights in the lead */
.hero__lead{
font-family:"Inter",sans-serif;
font-size:30px;
line-height:1.38;
font-weight:300;
letter-spacing:-.025em;
}
.hero__lead .lead-light{font-weight:300;}
.hero__lead strong{font-weight:650;}
/* v12 — quieter event info, no card surface */
.hero__event-card{
padding:0;
gap:28px;
margin-bottom:42px;
border:0;
border-radius:0;
background:transparent;
box-shadow:none;
backdrop-filter:none;
-webkit-backdrop-filter:none;
}
.event-card__location{
width:32px;
height:32px;
flex:0 0 32px;
padding:3px;
stroke:#267da1;
fill:none;
stroke-width:1.7;
stroke-linecap:round;
stroke-linejoin:round;
}
.event-card__speaker{gap:14px;}
.event-card__speaker strong{
font-size:18px;
line-height:1.15;
font-weight:650;
}
.event-card__speaker span{
font-size:18px;
line-height:1.2;
font-weight:400;
color:#64757d;
}
.event-card__divider{
height:44px;
background:rgba(43,68,79,.20);
}
.event-card__date{
gap:4px;
min-width:125px;
}
.event-card__date strong{
font-size:18px;
line-height:1.15;
font-weight:600;
}
.event-card__date span{
font-size:18px;
line-height:1.2;
font-weight:400;
color:#64757d;
}
/* v13 — split speaker/location and date/time */
.hero__content{padding-top:0;}
.hero__event-card{
margin-bottom:24px;
align-items:flex-start;
}
.event-card__location{
width:29px;
height:36px;
flex:0 0 29px;
padding:1px;
stroke-width:1.65;
}
.event-card__speaker{align-items:center;}
.hero__date-pill{
display:inline-flex;
align-items:center;
gap:14px;
margin-bottom:22px;
padding:10px 17px;
border:1px solid rgba(47,111,151,.18);
border-radius:999px;
background:rgba(255,255,255,.56);
box-shadow:0 7px 20px rgba(40,89,118,.06);
backdrop-filter:blur(7px);
-webkit-backdrop-filter:blur(7px);
color:#526975;
}
.hero__date-pill strong{
font-size:15px;
line-height:1;
font-weight:600;
color:#263b46;
}
.hero__date-pill span{
position:relative;
padding-left:14px;
font-size:15px;
line-height:1;
font-weight:450;
}
.hero__date-pill span:before{
content:"";
position:absolute;
left:0;
top:50%;
width:3px;
height:3px;
border-radius:50%;
background:#4b8fb4;
transform:translateY(-50%);
}
/* CTA refinement */
.hero__button{
width:390px;
border:1px solid rgba(255,255,255,.48);
box-shadow:
0 15px 34px rgba(29,105,187,.26),
0 4px 12px rgba(38,149,224,.16),
inset 0 1px 0 rgba(255,255,255,.22);
}
.hero__button b{
display:flex;
align-items:center;
justify-content:center;
padding:0 0 3px 1px;
line-height:1;
font-family:Arial,sans-serif;
}
.hero__button:hover{
box-shadow:
0 19px 42px rgba(29,105,187,.31),
0 5px 15px rgba(38,149,224,.20),
inset 0 1px 0 rgba(255,255,255,.25);
}
/* v14 — softer date pill + speaker identity */
.hero__date-pill{
gap:15px;
padding:11px 19px;
border-color:rgba(68,118,145,.10);
background:rgba(255,255,255,.52);
box-shadow:0 7px 20px rgba(40,89,118,.045);
}
.date-pill__item{
display:inline-flex;
align-items:center;
gap:9px;
}
.date-pill__icon{
width:18px;
height:18px;
fill:none;
stroke:#4b8fb4;
stroke-width:1.7;
stroke-linecap:round;
stroke-linejoin:round;
}
.date-pill__slash{
padding:0 1px;
font-size:18px;
line-height:1;
font-weight:300;
color:rgba(61,87,100,.34);
}
.hero__date-pill span:before{display:none;}
.hero__date-pill .date-pill__time{
padding-left:0;
font-size:15px;
line-height:1;
font-weight:450;
color:#526975;
}
.event-card__speaker-icon{
width:31px;
height:31px;
flex:0 0 31px;
fill:none;
stroke:#4b7488;
stroke-width:1.55;
stroke-linecap:round;
stroke-linejoin:round;
}
.event-card__speaker{
gap:13px;
}
/* v16 FIXED — clean rebuild from valid v14 */
.hero__container{display:flex;align-items:center;justify-content:space-between}
.hero__content{position:relative;z-index:3;flex:0 0 720px;padding-top:0}
.hero__event-card{display:none!important}
.hero__eyebrow{display:flex;align-items:center;gap:15px;margin-bottom:20px}
.hero__brandmark{display:grid;place-items:center;width:52px;height:52px;border-radius:17px;background:rgba(255,255,255,.72);box-shadow:0 8px 24px rgba(40,80,100,.08);backdrop-filter:blur(8px)}
.hero__brandmark svg{width:31px;height:31px;fill:none;stroke:#397d9f;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.hero__eyebrow-text{display:flex;flex-direction:column;gap:3px}
.hero__eyebrow-text strong{font-size:19px;line-height:1.12;font-weight:650;color:#1e2e36}
.hero__eyebrow-text span{font-size:17px;line-height:1.15;font-weight:400;color:#667982}
.hero__date-pill{display:inline-flex;align-items:center;gap:12px;margin-bottom:24px;padding:10px 17px;border:1px solid rgba(68,118,145,.09);border-radius:999px;background:rgba(255,255,255,.52);box-shadow:0 7px 20px rgba(40,89,118,.045);backdrop-filter:blur(7px)}
.hero__date-pill strong,.hero__date-pill .date-pill__text,.hero__date-pill .date-pill__time{padding:0;font-size:15px;line-height:1}
.hero__date-pill strong{font-weight:600;color:#263b46}
.hero__date-pill .date-pill__text,.hero__date-pill .date-pill__time{font-weight:450;color:#526975}
.date-pill__dot{display:block;width:4px;height:4px;flex:0 0 4px;border-radius:50%;background:rgba(58,92,109,.42)}
.date-pill__item,.date-pill__icon,.date-pill__slash{display:none}
.hero__lead,.hero__lead .lead-light{font-family:"Inter",Arial,sans-serif;font-weight:300!important}
.hero__lead strong{font-family:"Inter",Arial,sans-serif;font-weight:600!important}
.hero__portrait{position:absolute;z-index:2;right:-34px;bottom:0;width:500px;height:830px;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}
.hero__portrait img{display:block;max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom}
/* V19 — real HTML/CSS composition */
.hero{
min-height:900px;
overflow:hidden;
background-image:
linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.87) 28%,rgba(255,255,255,.30) 49%,rgba(255,255,255,.03) 70%),
url("assets/hero-bg-bridge.jpg");
background-size:cover;
background-position:center center;
}
.hero__container{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between}
.hero__content{position:relative;z-index:4;flex:0 0 720px;padding-top:0}
.hero__event-card,.hero__brandmark,.hero__bridge{display:none!important}
.hero__eyebrow{display:block;margin:0 0 20px 0}
.hero__eyebrow-text{display:flex;flex-direction:column;gap:2px}
.hero__eyebrow-text strong{font-size:21px;line-height:1.12;font-weight:650;color:#1e2e36}
.hero__eyebrow-text span{font-size:18px;line-height:1.15;font-weight:400;color:#667982}
.hero__date-pill{margin-bottom:24px}
.hero__lead,.hero__lead .lead-light{font-family:"Inter",Arial,sans-serif;font-weight:300!important}
.hero__lead strong{font-family:"Inter",Arial,sans-serif;font-weight:600!important}
/* Large transparent portrait, independent from background */
.hero__portrait{
position:absolute;
z-index:2;
right:-55px;
bottom:-5px;
width:655px;
height:835px;
display:flex;
align-items:flex-end;
justify-content:center;
overflow:visible;
pointer-events:none;
}
.hero__portrait:before{
content:"";
position:absolute;
z-index:-1;
right:10px;
bottom:80px;
width:520px;
height:650px;
border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,.48) 0%,rgba(255,255,255,.16) 48%,transparent 72%);
filter:blur(24px);
}
.hero__portrait img{
display:block;
width:100%;
height:100%;
max-width:none;
max-height:none;
object-fit:contain;
object-position:center bottom;
filter:drop-shadow(0 20px 30px rgba(42,73,86,.10));
}
/* soft foreground haze joins portrait with the landscape */
.hero:before{
content:"";
position:absolute;
z-index:2;
left:48%;
right:-4%;
bottom:-70px;
height:230px;
pointer-events:none;
background:
radial-gradient(circle at 72% 42%,rgba(255,255,255,.70),transparent 12%),
linear-gradient(to top,rgba(224,236,197,.72),rgba(255,255,255,0));
filter:blur(18px);
opacity:.72;
}
/* =========================================================
V20 — clean light hero + portrait + program transition
========================================================= */
.hero{
min-height:980px !important;
padding-bottom:245px !important;
overflow:hidden !important;
background:
radial-gradient(circle at 84% 20%, rgba(194,224,238,.58) 0%, rgba(226,239,245,.28) 27%, transparent 48%),
radial-gradient(circle at 74% 76%, rgba(231,222,245,.38) 0%, transparent 36%),
linear-gradient(118deg,#fcfdfe 0%,#f7fafc 48%,#edf5f8 100%) !important;
}
.hero:before{
content:"" !important;
position:absolute !important;
z-index:1 !important;
right:-130px !important;
top:-180px !important;
width:820px !important;
height:820px !important;
border-radius:50% !important;
background:radial-gradient(circle,rgba(255,255,255,.94) 0%,rgba(215,234,242,.24) 48%,transparent 72%) !important;
filter:blur(8px) !important;
opacity:1 !important;
}
.hero:after{
content:"" !important;
position:absolute;
z-index:1;
right:130px;
bottom:190px;
width:440px;
height:300px;
border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,.84),transparent 70%);
filter:blur(28px);
}
.hero__bridge{display:none !important}
.hero__container{
position:relative !important;
z-index:3 !important;
min-height:735px !important;
align-items:center !important;
}
.hero__content{z-index:5 !important;padding-top:0 !important}
/* no icon — name aligns with the whole left column */
.hero__brandmark{display:none !important}
.hero__eyebrow{
display:block !important;
margin:0 0 19px !important;
}
.hero__eyebrow-text{align-items:flex-start !important;gap:3px !important}
.hero__eyebrow-text strong{font-size:20px !important}
.hero__eyebrow-text span{font-size:17px !important}
/* editorial portrait panel on the right */
.hero__portrait{
position:absolute !important;
z-index:4 !important;
right:-6px !important;
bottom:165px !important;
width:535px !important;
height:650px !important;
display:block !important;
overflow:hidden !important;
border-radius:270px 270px 44px 44px !important;
background:#eef5f8 !important;
box-shadow:0 30px 80px rgba(50,83,101,.14) !important;
pointer-events:none;
}
.hero__portrait:before{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:2 !important;
background:
linear-gradient(to bottom,transparent 61%,rgba(242,248,250,.02) 73%,rgba(242,248,250,.98) 100%),
linear-gradient(to right,rgba(242,248,250,.48),transparent 12%,transparent 90%,rgba(242,248,250,.45)) !important;
filter:none !important;
border-radius:inherit !important;
}
.hero__portrait img{
display:block !important;
width:100% !important;
height:100% !important;
max-width:none !important;
max-height:none !important;
object-fit:cover !important;
object-position:50% 38% !important;
filter:none !important;
-webkit-mask-image:none !important;
mask-image:none !important;
}
/* program block rises into the first screen */
.program-preview{
position:absolute;
z-index:6;
left:50%;
bottom:0;
transform:translateX(-50%);
width:min(1200px,calc(100% - 96px));
padding:25px 28px 28px;
border:1px solid rgba(73,113,134,.10);
border-bottom:0;
border-radius:30px 30px 0 0;
background:rgba(255,255,255,.90);
box-shadow:0 -16px 55px rgba(56,91,108,.09);
backdrop-filter:blur(18px);
}
.program-preview__head{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:24px;
margin-bottom:17px;
}
.program-preview__kicker{
display:block;
margin-bottom:4px;
font-size:13px;
font-weight:650;
letter-spacing:.02em;
color:#5a8ca4;
}
.program-preview__head h2{
margin:0;
font-size:22px;
line-height:1.15;
font-weight:650;
color:#20343e;
}
.program-preview__head small{
padding-bottom:2px;
font-size:14px;
color:#7a909a;
white-space:nowrap;
}
.program-preview__grid{
display:grid;
grid-template-columns:1fr 1fr 1.18fr;
gap:12px;
}
.program-card{
min-height:116px;
padding:18px 20px;
border:1px solid rgba(70,113,135,.08);
border-radius:19px;
background:linear-gradient(145deg,rgba(248,251,253,.98),rgba(237,247,250,.90));
}
.program-card--retreat{
background:linear-gradient(145deg,rgba(247,249,255,.98),rgba(238,242,253,.94));
}
.program-card__date{
margin-bottom:8px;
font-size:13px;
font-weight:650;
color:#4e87a4;
}
.program-card h3{
margin:0 0 6px;
font-size:20px;
line-height:1.15;
font-weight:650;
color:#21343e;
}
.program-card p{
margin:0;
font-size:13px;
color:#7b8f98;
}
/* =========================================================
V21 — two-zone composition.
Portrait belongs to the program zone and rises into hero.
========================================================= */
.hero{
min-height:990px !important;
padding-bottom:270px !important;
background:#f8fbfc !important;
}
/* First zone: clean cool-blue field behind the offer */
.hero:before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
inset:0 0 255px 0 !important;
width:auto !important;
height:auto !important;
border-radius:0 !important;
opacity:1 !important;
filter:none !important;
background:
radial-gradient(circle at 18% 18%,rgba(255,255,255,.98),transparent 34%),
radial-gradient(circle at 82% 12%,rgba(206,231,242,.70),transparent 34%),
linear-gradient(120deg,#fbfdfe 0%,#f2f8fb 55%,#e9f3f7 100%) !important;
}
.hero:after{display:none !important}
.hero__container{min-height:720px !important;}
/* Portrait now grows out of the second/program zone */
.hero__portrait{
z-index:7 !important;
right:42px !important;
bottom:205px !important;
width:465px !important;
height:590px !important;
overflow:hidden !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.hero__portrait:before{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:2 !important;
border-radius:0 !important;
filter:none !important;
background:
linear-gradient(to bottom,transparent 0%,transparent 68%,rgba(255,255,255,.12) 78%,rgba(255,255,255,.96) 100%),
linear-gradient(to right,rgba(238,246,249,.75) 0%,transparent 13%,transparent 90%,rgba(238,246,249,.55) 100%) !important;
}
.hero__portrait img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:50% 35% !important;
}
/* Second zone: a full-width program surface, not a floating card */
.program-preview{
z-index:6 !important;
left:0 !important;
bottom:0 !important;
transform:none !important;
width:100% !important;
height:270px;
padding:34px max(48px,calc((100% - 1200px)/2)) 30px !important;
border:0 !important;
border-radius:0 !important;
background:
radial-gradient(circle at 76% 0%,rgba(217,231,247,.74),transparent 28%),
linear-gradient(110deg,#eef5f8 0%,#e9f2f7 52%,#edf0fa 100%) !important;
box-shadow:inset 0 1px 0 rgba(80,118,137,.08) !important;
backdrop-filter:none !important;
}
.program-preview__head{
width:650px;
margin-bottom:18px !important;
}
.program-preview__grid{
width:650px;
grid-template-columns:1fr 1fr 1.18fr !important;
}
.program-card{
min-height:108px !important;
padding:16px 17px !important;
background:rgba(255,255,255,.66) !important;
border:1px solid rgba(77,116,136,.09) !important;
box-shadow:0 8px 22px rgba(57,91,108,.035);
}
.program-card--retreat{
background:rgba(247,248,255,.78) !important;
}
/* subtle pedestal/glow behind speaker where the two zones meet */
.program-preview:after{
content:"";
position:absolute;
z-index:-1;
right:max(28px,calc((100% - 1200px)/2));
top:-125px;
width:510px;
height:300px;
border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,.90),rgba(226,239,245,.40) 48%,transparent 72%);
filter:blur(16px);
}
/* =========================================================
V22 — more air, quieter typography, portrait lowered into program
========================================================= */
.hero{
min-height:1040px !important;
padding-bottom:285px !important;
background:#f7fafc !important;
}
/* Hero field: almost-white editorial background */
.hero:before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
inset:0 0 270px 0 !important;
width:auto !important;
height:auto !important;
border-radius:0 !important;
opacity:1 !important;
filter:none !important;
background:
radial-gradient(circle at 80% 35%,rgba(210,232,241,.62) 0%,rgba(235,244,248,.30) 28%,transparent 49%),
radial-gradient(circle at 10% 5%,rgba(255,255,255,1) 0%,transparent 38%),
linear-gradient(118deg,#fcfdfe 0%,#f7fafc 48%,#eef5f8 100%) !important;
}
.hero:after{display:none !important}
.hero__container{
min-height:755px !important;
align-items:flex-start !important;
}
/* More top breathing room without changing left composition */
.hero__content{
padding-top:74px !important;
flex:0 0 700px !important;
}
.hero__eyebrow{margin-bottom:21px !important}
.hero__date-pill{margin-bottom:26px !important}
/* Keep the successful title hierarchy */
.hero h1{
margin-bottom:25px !important;
}
/* Supporting line is intentionally quieter */
.hero__lead{
font-size:25px !important;
line-height:1.34 !important;
margin-bottom:31px !important;
}
.hero__lead .lead-light{font-weight:300 !important}
.hero__lead strong{font-weight:600 !important}
/* Speaker is lower: belongs visually to the program section */
.hero__portrait{
z-index:7 !important;
right:15px !important;
bottom:170px !important;
width:500px !important;
height:600px !important;
overflow:hidden !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.hero__portrait:before{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:2 !important;
border-radius:0 !important;
filter:none !important;
background:
linear-gradient(to bottom,transparent 0%,transparent 69%,rgba(240,247,250,.06) 77%,rgba(235,244,248,.94) 100%),
linear-gradient(to right,rgba(240,247,250,.66) 0%,transparent 10%,transparent 91%,rgba(240,247,250,.50) 100%) !important;
}
.hero__portrait img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:50% 34% !important;
filter:none !important;
}
/* Program: softer second field, blended with hero */
.program-preview{
z-index:6 !important;
left:0 !important;
bottom:0 !important;
transform:none !important;
width:100% !important;
height:285px !important;
padding:35px max(48px,calc((100% - 1200px)/2)) 30px !important;
border:0 !important;
border-radius:0 !important;
background:
radial-gradient(circle at 79% -12%,rgba(255,255,255,.88) 0%,transparent 30%),
linear-gradient(110deg,#edf5f8 0%,#e9f2f6 54%,#edf1f8 100%) !important;
box-shadow:none !important;
backdrop-filter:none !important;
}
/* Very soft transition instead of a hard section line */
.program-preview:before{
content:"";
position:absolute;
left:0;
right:0;
top:-74px;
height:76px;
background:linear-gradient(to bottom,rgba(238,246,249,0),rgba(237,245,248,.98));
pointer-events:none;
}
.program-preview:after{
content:"";
position:absolute;
z-index:-1;
right:max(20px,calc((100% - 1200px)/2));
top:-160px;
width:550px;
height:350px;
border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,.84),rgba(220,237,244,.30) 48%,transparent 72%);
filter:blur(20px);
}
/* Keep program copy to the left so portrait has its own space */
.program-preview__head,
.program-preview__grid{
width:660px !important;
}
.program-preview__head{margin-bottom:18px !important}
.program-card{
background:rgba(255,255,255,.62) !important;
border:1px solid rgba(69,110,131,.08) !important;
box-shadow:none !important;
}
.program-card--retreat{
background:rgba(247,248,255,.74) !important;
}
/* =========================================================
V24 — white hero, light/glare accents, clean portrait right
========================================================= */
.hero{
min-height:1000px !important;
padding-bottom:270px !important;
background:#fff !important;
overflow:hidden !important;
}
/* Mostly white first block, with restrained light effects */
.hero:before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
inset:0 0 255px 0 !important;
width:auto !important;
height:auto !important;
border-radius:0 !important;
opacity:1 !important;
filter:none !important;
background:
radial-gradient(circle at 78% 18%,rgba(255,231,177,.42) 0%,rgba(255,244,217,.20) 12%,transparent 28%),
radial-gradient(circle at 91% 42%,rgba(194,226,241,.28) 0%,transparent 23%),
radial-gradient(circle at 58% 74%,rgba(223,233,250,.22) 0%,transparent 27%),
linear-gradient(105deg,#ffffff 0%,#ffffff 55%,#fbfdfe 100%) !important;
}
.hero:after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:175px !important;
top:70px !important;
width:420px !important;
height:420px !important;
border-radius:50% !important;
opacity:.62 !important;
background:
linear-gradient(128deg,transparent 40%,rgba(255,255,255,.95) 48%,transparent 55%),
radial-gradient(circle,rgba(255,244,211,.30),transparent 67%) !important;
filter:blur(10px) !important;
transform:rotate(-8deg);
}
.hero__container{
min-height:730px !important;
align-items:flex-start !important;
}
.hero__content{
flex:0 0 690px !important;
padding-top:62px !important;
}
.hero__lead{
font-size:25px !important;
line-height:1.34 !important;
margin-bottom:31px !important;
}
/* Transparent PNG: no frame, no blue panel */
.hero__portrait{
position:absolute !important;
z-index:5 !important;
right:-5px !important;
bottom:155px !important;
width:500px !important;
height:650px !important;
display:flex !important;
align-items:flex-end !important;
justify-content:center !important;
overflow:visible !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.hero__portrait:before{
content:"" !important;
position:absolute !important;
z-index:-1 !important;
left:50% !important;
bottom:35px !important;
width:520px !important;
height:520px !important;
transform:translateX(-50%) !important;
border-radius:50% !important;
background:radial-gradient(circle,rgba(255,247,224,.52) 0%,rgba(225,239,246,.20) 44%,transparent 70%) !important;
filter:blur(18px) !important;
}
.hero__portrait img{
display:block !important;
width:100% !important;
height:100% !important;
max-width:none !important;
max-height:none !important;
object-fit:contain !important;
object-position:center bottom !important;
filter:drop-shadow(0 20px 25px rgba(56,76,88,.08)) !important;
-webkit-mask-image:none !important;
mask-image:none !important;
}
/* Program remains the soft landing surface for the portrait */
.program-preview{
height:270px !important;
background:
radial-gradient(circle at 83% 0%,rgba(255,255,255,.92),transparent 28%),
linear-gradient(110deg,#f2f6f8 0%,#edf3f6 58%,#f2f3f8 100%) !important;
}
.program-preview:before{
background:linear-gradient(to bottom,rgba(245,248,249,0),rgba(241,246,248,.98)) !important;
}
.program-preview:after{
background:radial-gradient(circle,rgba(255,255,255,.90),rgba(228,238,243,.28) 50%,transparent 72%) !important;
}
/* =========================================================
V25 — smaller H1, larger/lower portrait, quieter program glow,
minimal creative graphics in the first screen
========================================================= */
/* Title: requested 88 px */
.hero h1{
font-size:88px !important;
line-height:.94 !important;
letter-spacing:-.045em !important;
}
/* White foundation + more visible but restrained graphic atmosphere */
.hero:before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
inset:0 0 255px 0 !important;
width:auto !important;
height:auto !important;
border-radius:0 !important;
opacity:1 !important;
filter:none !important;
background:
radial-gradient(ellipse at 82% 22%,rgba(255,224,160,.28) 0%,rgba(255,240,207,.12) 20%,transparent 39%),
radial-gradient(ellipse at 93% 58%,rgba(175,216,235,.24) 0%,transparent 30%),
radial-gradient(ellipse at 55% 86%,rgba(202,215,245,.18) 0%,transparent 31%),
linear-gradient(112deg,#ffffff 0%,#ffffff 48%,#fbfdfe 70%,#f7fbfd 100%) !important;
}
/* Minimal graphic: translucent rings / light arc behind portrait */
.hero:after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:44px !important;
top:90px !important;
width:570px !important;
height:570px !important;
border-radius:50% !important;
opacity:.74 !important;
filter:none !important;
transform:none !important;
background:
radial-gradient(circle at center,
transparent 0 41%,
rgba(139,194,220,.13) 41.3% 41.8%,
transparent 42.1% 53%,
rgba(242,196,111,.13) 53.3% 53.8%,
transparent 54.1% 65%,
rgba(145,178,225,.08) 65.3% 65.7%,
transparent 66%),
linear-gradient(135deg,transparent 44%,rgba(255,255,255,.92) 48%,transparent 53%) !important;
}
/* Give title area a little more room */
.hero__content{
flex:0 0 680px !important;
padding-top:62px !important;
}
/* Bigger speaker, pushed down so he visually rests on program block */
.hero__portrait{
right:-25px !important;
bottom:92px !important;
width:575px !important;
height:720px !important;
overflow:visible !important;
}
.hero__portrait:before{
left:52% !important;
bottom:15px !important;
width:500px !important;
height:470px !important;
opacity:.62 !important;
background:radial-gradient(circle,rgba(255,247,225,.34) 0%,rgba(221,238,245,.12) 46%,transparent 70%) !important;
filter:blur(22px) !important;
}
.hero__portrait img{
object-fit:contain !important;
object-position:center bottom !important;
filter:drop-shadow(0 17px 22px rgba(54,75,87,.07)) !important;
}
/* Program section: substantially reduce the pale/grey glow */
.program-preview{
background:
linear-gradient(110deg,#f1f5f7 0%,#edf3f5 58%,#f1f2f6 100%) !important;
}
.program-preview:before{
top:-52px !important;
height:54px !important;
opacity:.48 !important;
background:linear-gradient(to bottom,rgba(242,246,248,0),rgba(239,244,246,.68)) !important;
}
.program-preview:after{
right:max(20px,calc((100% - 1200px)/2)) !important;
top:-120px !important;
width:450px !important;
height:270px !important;
opacity:.30 !important;
background:radial-gradient(circle,rgba(255,255,255,.48),rgba(227,237,241,.12) 50%,transparent 72%) !important;
filter:blur(22px) !important;
}
/* Small decorative linework, created without extra image assets */
.hero__content:after{
content:"";
position:absolute;
z-index:-1;
left:500px;
top:105px;
width:145px;
height:145px;
border-top:1px solid rgba(90,154,184,.14);
border-right:1px solid rgba(90,154,184,.10);
border-radius:0 100% 0 0;
transform:rotate(18deg);
pointer-events:none;
}
/* =========================================================
V26 — typography tuning + button + portrait grounded to block
========================================================= */
.hero h1{
font-size:88px !important;
line-height:.86 !important;
}
.hero__lead{
font-size:24px !important;
line-height:1.25 !important;
}
.hero__button{
width:370px !important;
}
/* Speaker touches the lower edge / program transition */
.hero__portrait{
bottom:0 !important;
}
/* Continue the target/ring visual language, still restrained */
.hero:after{
width:600px !important;
height:600px !important;
right:18px !important;
top:82px !important;
opacity:.78 !important;
background:
radial-gradient(circle at center,
transparent 0 34%,
rgba(121,184,214,.10) 34.25% 34.75%,
transparent 35% 43%,
rgba(121,184,214,.16) 43.25% 43.8%,
transparent 44.05% 53%,
rgba(237,188,94,.14) 53.25% 53.8%,
transparent 54.05% 64%,
rgba(135,168,218,.09) 64.25% 64.7%,
transparent 65%),
linear-gradient(135deg,transparent 44%,rgba(255,255,255,.92) 48%,transparent 53%) !important;
}
/* Keep the glow behind the person subtle now that he touches the section */
.hero__portrait:before{
bottom:-35px !important;
opacity:.48 !important;
}
/* =========================================================
V27 — rounded hero + compact speaker line + richer right field
========================================================= */
/* The first screen now feels like a large sheet descending over section 2 */
.hero{
border-radius:0 0 46px 46px !important;
isolation:isolate !important;
}
/* Keep the visual effects clipped to the rounded first screen */
.hero:before{
border-radius:0 0 46px 46px !important;
}
/* Speaker header: one quiet line instead of a stacked label */
.hero__eyebrow{
margin-bottom:22px !important;
}
.hero__eyebrow-text{
display:flex !important;
flex-direction:row !important;
align-items:baseline !important;
gap:10px !important;
white-space:nowrap !important;
}
.hero__eyebrow-text strong{
font-size:17px !important;
line-height:1.2 !important;
font-weight:600 !important;
letter-spacing:-.01em !important;
color:#263941 !important;
}
.hero__eyebrow-text span{
position:relative;
font-size:16px !important;
line-height:1.2 !important;
font-weight:400 !important;
color:#78909a !important;
}
.hero__eyebrow-text span:before{
content:"";
display:inline-block;
width:18px;
height:1px;
margin:0 10px 4px 0;
background:rgba(64,112,134,.28);
}
.block768 {
display: none;
}
/* Richer atmosphere around the speaker without enlarging him */
.hero__portrait:after{
content:"";
position:absolute;
z-index:-2;
left:50%;
top:43%;
width:610px;
height:610px;
transform:translate(-50%,-50%);
border-radius:50%;
background:
radial-gradient(circle at 50% 50%,rgba(255,255,255,.12) 0 32%,transparent 33%),
conic-gradient(from 205deg,
rgba(110,180,211,.13),
rgba(255,214,135,.13) 18%,
transparent 31%,
rgba(136,164,218,.10) 49%,
transparent 64%,
rgba(105,181,211,.11) 82%,
rgba(110,180,211,.13));
filter:blur(2px);
opacity:.70;
}
/* Add a soft diagonal wash behind the right column */
.hero__container:after{
content:"";
position:absolute;
z-index:1;
right:-75px;
top:35px;
width:565px;
height:520px;
pointer-events:none;
border-radius:48% 52% 58% 42%;
background:
radial-gradient(ellipse at 62% 42%,rgba(177,216,234,.22),transparent 54%),
radial-gradient(ellipse at 35% 22%,rgba(255,222,156,.20),transparent 40%);
filter:blur(20px);
transform:rotate(-9deg);
}
/* Portrait stays above the new background graphics */
.hero__portrait{z-index:5 !important}
.hero__content{z-index:6 !important}
/* Make program transition less visually attached to the rounded hero */
.program-preview{
padding-top:44px !important;
}
.program-preview:before{
opacity:.22 !important;
}
/* small visual markers on the target rings */
.hero__container:before{
content:"";
position:absolute;
z-index:2;
right:48px;
top:160px;
width:7px;
height:7px;
border-radius:50%;
background:rgba(86,154,187,.48);
box-shadow:
-72px 112px 0 -2px rgba(235,180,81,.50),
24px 194px 0 -2px rgba(119,151,208,.40);
pointer-events:none;
}
/* =========================================================
V28 — unified event line + glass author card + richer right field
========================================================= */
.hero__event-line{
display:flex !important;
align-items:center !important;
gap:10px !important;
min-height:32px;
margin:0 0 27px !important;
white-space:nowrap;
font-size:15px;
line-height:1;
color:#647b86;
}
.event-line__speaker{
font-weight:650;
color:#263a43;
}
.event-line__sep{
width:24px;
height:1px;
margin:0 3px;
background:rgba(59,112,138,.28);
}
.event-line__dot{
width:4px;
height:4px;
border-radius:50%;
background:rgba(66,123,151,.40);
}
.hero__date-pill{display:none!important}
/* Author information overlaps the bottom of the transparent portrait */
.hero__author-card{
position:absolute;
z-index:10;
left:50%;
bottom:24px;
transform:translateX(-50%);
width:405px;
padding:15px 18px 14px;
border:1px solid rgba(255,255,255,.58);
border-radius:20px;
background:rgba(246,250,252,.68);
box-shadow:0 12px 34px rgba(44,76,91,.10);
backdrop-filter:blur(15px);
-webkit-backdrop-filter:blur(15px);
pointer-events:auto;
}
.hero__author-card strong{
display:block;
margin-bottom:4px;
font-size:16px;
line-height:1.15;
font-weight:650;
color:#223740;
}
.hero__author-card span{
display:block;
margin-bottom:9px;
font-size:12.5px;
line-height:1.25;
color:#617985;
}
.hero__author-card a{
display:inline-flex;
align-items:center;
gap:6px;
font-size:12.5px;
font-weight:600;
color:#347b9d;
text-decoration:none;
}
.hero__author-card a b{
font-size:13px;
font-weight:500;
}
/* Stronger, layered but still minimal visual field behind the speaker */
.hero:before{
background:
radial-gradient(ellipse at 80% 18%,rgba(255,218,139,.32) 0%,rgba(255,240,203,.13) 18%,transparent 38%),
radial-gradient(ellipse at 92% 56%,rgba(137,201,230,.28) 0%,rgba(199,229,242,.12) 26%,transparent 43%),
radial-gradient(ellipse at 62% 82%,rgba(176,192,234,.17) 0%,transparent 30%),
linear-gradient(112deg,#fff 0%,#fff 45%,#fbfdfe 68%,#f4f9fb 100%) !important;
}
/* more graphic depth in the target motif */
.hero:after{
right:-8px !important;
top:64px !important;
width:650px !important;
height:650px !important;
opacity:.92 !important;
background:
radial-gradient(circle at center,
transparent 0 29%,
rgba(95,173,210,.08) 29.3% 29.8%,
transparent 30.1% 38%,
rgba(95,173,210,.15) 38.3% 38.8%,
transparent 39.1% 48%,
rgba(237,180,75,.16) 48.3% 48.8%,
transparent 49.1% 58%,
rgba(122,151,211,.10) 58.3% 58.7%,
transparent 59% 69%,
rgba(101,173,207,.07) 69.3% 69.7%,
transparent 70%),
conic-gradient(from 210deg,
transparent 0 8%,
rgba(123,186,215,.08) 8% 15%,
transparent 15% 35%,
rgba(245,196,100,.07) 35% 41%,
transparent 41% 100%) !important;
}
/* Fine editorial lines / data-like accents in the empty right area */
.hero__container:before{
right:52px !important;
top:115px !important;
width:8px !important;
height:8px !important;
background:rgba(69,150,190,.52) !important;
box-shadow:
-98px 75px 0 -2px rgba(229,170,66,.54),
20px 178px 0 -2px rgba(112,145,205,.46),
-145px 260px 0 -3px rgba(70,151,190,.38) !important;
}
.hero__container:after{
right:-65px !important;
top:30px !important;
width:600px !important;
height:560px !important;
opacity:.82;
background:
linear-gradient(116deg,transparent 0 52%,rgba(117,185,216,.045) 52.2% 52.6%,transparent 52.8%),
linear-gradient(28deg,transparent 0 63%,rgba(232,178,78,.05) 63.2% 63.6%,transparent 63.8%),
radial-gradient(ellipse at 62% 42%,rgba(174,216,235,.20),transparent 54%),
radial-gradient(ellipse at 35% 22%,rgba(255,221,153,.17),transparent 40%) !important;
}
/* =========================================================
V29 — clearer event format + clickable author link + bolder background
========================================================= */
/* Full author link gets its own clickable layer */
.hero__author-card{
z-index:20 !important;
pointer-events:auto !important;
}
.hero__author-card a{
position:relative !important;
z-index:30 !important;
display:flex !important;
width:max-content !important;
max-width:100%;
padding:5px 8px 5px 0;
pointer-events:auto !important;
cursor:pointer !important;
}
.hero__author-card a:after{
content:"";
position:absolute;
inset:-5px -8px;
border-radius:10px;
}
.hero__portrait img{
pointer-events:none !important;
}
/* Keep graphics away from the left text: first 58% stays almost clean */
.hero:before{
background:
linear-gradient(90deg,#fff 0%,#fff 53%,rgba(255,255,255,.88) 62%,rgba(255,255,255,0) 72%),
radial-gradient(ellipse at 88% 18%,rgba(255,195,77,.46) 0%,rgba(255,225,161,.20) 20%,transparent 43%),
radial-gradient(ellipse at 91% 58%,rgba(57,163,214,.38) 0%,rgba(142,211,239,.18) 28%,transparent 50%),
radial-gradient(ellipse at 72% 78%,rgba(117,116,214,.20) 0%,transparent 35%),
linear-gradient(115deg,#fff 0%,#f8fbfc 60%,#edf7fb 100%) !important;
}
/* Replace the many target circles with a bold cropped orbital graphic on right */
.hero:after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:-225px !important;
top:-95px !important;
width:780px !important;
height:780px !important;
border-radius:50% !important;
opacity:1 !important;
filter:none !important;
transform:rotate(-13deg) !important;
background:
radial-gradient(circle at center,
transparent 0 42%,
rgba(255,255,255,.64) 42.2% 42.8%,
transparent 43% 51%,
rgba(52,158,207,.26) 51.3% 52%,
transparent 52.3% 61%,
rgba(240,173,49,.28) 61.3% 62%,
transparent 62.3%),
conic-gradient(from 208deg,
transparent 0 13%,
rgba(55,166,215,.24) 13% 23%,
transparent 23% 45%,
rgba(245,180,52,.25) 45% 54%,
transparent 54% 74%,
rgba(107,106,208,.18) 74% 82%,
transparent 82% 100%) !important;
}
/* Large translucent editorial shapes only on the portrait side */
.hero__container:after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:-90px !important;
top:45px !important;
width:520px !important;
height:560px !important;
opacity:1 !important;
border-radius:46% 54% 38% 62% !important;
transform:rotate(9deg) !important;
filter:blur(2px) !important;
background:
linear-gradient(145deg,rgba(255,212,128,.26),transparent 36%),
linear-gradient(330deg,rgba(85,174,216,.24),transparent 46%),
linear-gradient(65deg,transparent 52%,rgba(113,111,208,.10) 53%,transparent 68%) !important;
}
/* Remove distracting marker dots near copy */
.hero__container:before{
display:none !important;
}
.displaymobile {
display: none;
}
/* One crisp vertical accent behind the speaker */
.hero__portrait:after{
content:"" !important;
position:absolute !important;
z-index:-2 !important;
left:66% !important;
top:2% !important;
width:180px !important;
height:520px !important;
border-radius:100px !important;
transform:rotate(18deg) !important;
opacity:.72 !important;
background:linear-gradient(to bottom,rgba(255,196,80,.22),rgba(86,173,215,.18) 55%,rgba(108,106,207,.10)) !important;
filter:blur(18px) !important;
}
/* Slightly stronger lower edge so the rounded white sheet reads clearly */
.hero{
box-shadow:0 18px 48px rgba(46,80,96,.07) !important;
}
/* =========================================================
V30 — quiet minimal gradient + rounded HERO CONTAINER
========================================================= */
/* Remove the aggressive decorative system from V29 */
.hero:after,
.hero__container:before,
.hero__container:after,
.hero__portrait:after{
display:none !important;
}
/* Outer section becomes neutral; the visible "card" is hero__container */
.hero{
background:#eef3f5 !important;
border-radius:0 !important;
box-shadow:none !important;
overflow:visible !important;
padding-bottom:270px !important;
}
.hero:before{
display:none !important;
}
/* The actual first-screen background is now on Hero Container */
.hero__container{
position:relative !important;
z-index:3 !important;
width:min(1320px,calc(100% - 48px)) !important;
max-width:1320px !important;
margin:0 auto !important;
padding-left:60px !important;
padding-right:60px !important;
border-radius:0 0 48px 48px !important;
overflow:hidden !important;
background:
radial-gradient(ellipse at 84% 22%,rgba(209,231,240,.52) 0%,rgba(229,241,246,.26) 30%,transparent 52%),
radial-gradient(ellipse at 72% 78%,rgba(238,225,245,.28) 0%,transparent 38%),
linear-gradient(118deg,#ffffff 0%,#fbfdfe 53%,#f2f8fa 100%) !important;
box-shadow:0 18px 50px rgba(49,82,98,.07) !important;
}
/* One restrained warm highlight so the gradient doesn't feel sterile */
.hero__container::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
right:70px !important;
top:55px !important;
width:430px !important;
height:360px !important;
border-radius:50% !important;
background:radial-gradient(circle,rgba(255,230,179,.25),rgba(255,243,219,.09) 42%,transparent 70%) !important;
filter:blur(12px) !important;
pointer-events:none !important;
}
/* Keep content and portrait above the minimal background */
.hero__content{z-index:4 !important}
.hero__portrait{z-index:5 !important}
/* Portrait glow is also simplified */
.hero__portrait:before{
display:block !important;
opacity:.36 !important;
background:radial-gradient(circle,rgba(255,255,255,.64),rgba(211,232,240,.16) 46%,transparent 72%) !important;
filter:blur(24px) !important;
}
/* Program stays visually separate below the rounded container */
.program-preview{
z-index:2 !important;
padding-top:44px !important;
background:linear-gradient(110deg,#eef3f5 0%,#eaf1f4 58%,#eef0f4 100%) !important;
}
.program-preview:before,
.program-preview:after{
display:none !important;
}
/* =========================================================
V31 — wider inner padding + portrait shifted left
========================================================= */
.hero__container{
padding-left:90px !important;
padding-right:90px !important;
}
.hero__portrait{
right:70px !important;
}
/* =========================================================
V32 — clearer descriptor, lower CTA, restrained creative backdrop
========================================================= */
/* Give the descriptor a cleaner hierarchy */
.hero__lead strong{
font-weight:600 !important;
}
.hero__lead .lead-light{
display:inline-block;
margin-top:5px;
font-size:20px;
line-height:1.35;
color:#6c8089;
}
/* Move CTA slightly lower without disturbing the approved title block */
.hero__button{
margin-top:14px !important;
}
/* Minimal creative composition only on Oleg's side */
.hero__container{
background:
radial-gradient(circle at 82% 23%,rgba(213,235,244,.72) 0%,rgba(231,243,248,.34) 22%,transparent 43%),
radial-gradient(circle at 88% 73%,rgba(238,227,246,.42) 0%,transparent 36%),
linear-gradient(118deg,#fff 0%,#fbfdfe 54%,#f1f8fb 100%) !important;
}
/* A single large ring: visible, but not noisy */
.hero__container::before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:24px !important;
top:84px !important;
width:500px !important;
height:500px !important;
border:1px solid rgba(79,156,190,.20) !important;
border-radius:50% !important;
background:
radial-gradient(circle at center,transparent 0 57%,rgba(255,255,255,.34) 57.5% 58%,transparent 58.5%),
linear-gradient(135deg,transparent 47%,rgba(83,160,194,.08) 47.2% 47.7%,transparent 47.9%) !important;
pointer-events:none !important;
}
/* One geometric rounded rectangle intersects the ring */
.hero__container::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:1 !important;
right:-58px !important;
top:188px !important;
width:310px !important;
height:185px !important;
border:1px solid rgba(223,171,81,.18) !important;
border-radius:42px !important;
background:linear-gradient(135deg,rgba(255,239,207,.18),rgba(206,232,243,.13)) !important;
transform:rotate(-8deg) !important;
pointer-events:none !important;
}
/* Fine horizontal accent behind portrait */
.hero__portrait:after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:-1 !important;
right:-35px !important;
top:235px !important;
width:250px !important;
height:1px !important;
background:linear-gradient(90deg,rgba(64,146,184,.30),rgba(64,146,184,0)) !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
}
/* Preserve readable layering */
.hero__content{z-index:5 !important}
.hero__portrait{z-index:6 !important}
/* =========================================================
V33 — softer descriptor + new "light panels" background
========================================================= */
.hero__lead{
font-size:23px !important;
line-height:1.28 !important;
color:#40545d !important;
}
.hero__lead .lead-intro{
font-weight:400 !important;
color:#536a74 !important;
}
.hero__lead .lead-light{
margin-top:6px !important;
font-size:21px !important;
line-height:1.32 !important;
font-weight:300 !important;
color:#71858e !important;
}
/* Completely replace V32 circle/rectangle composition */
.hero__container::before,
.hero__container::after,
.hero__portrait:after{
display:none !important;
}
/* Calm light gradient base */
.hero__container{
background:
radial-gradient(ellipse at 86% 30%,rgba(199,229,241,.55) 0%,rgba(228,242,247,.26) 29%,transparent 51%),
radial-gradient(ellipse at 78% 80%,rgba(237,228,246,.32) 0%,transparent 36%),
linear-gradient(118deg,#fff 0%,#fcfdfe 52%,#f1f8fb 100%) !important;
}
/* New visual language: two large translucent glass planes behind Oleg */
.hero__portrait:before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:-2 !important;
left:48% !important;
bottom:86px !important;
width:430px !important;
height:500px !important;
border-radius:110px 38px 110px 38px !important;
transform:translateX(-50%) rotate(7deg) !important;
opacity:1 !important;
background:
linear-gradient(145deg,rgba(255,255,255,.58),rgba(202,231,243,.23) 48%,rgba(230,218,244,.17)) !important;
border:1px solid rgba(255,255,255,.72) !important;
box-shadow:
inset 0 0 0 1px rgba(107,174,203,.06),
0 24px 70px rgba(73,124,148,.07) !important;
filter:none !important;
}
/* Secondary slim glass stroke */
.hero__portrait{
overflow:visible !important;
}
.hero__portrait .hero__author-card{
z-index:12 !important;
}
.hero__portrait img{
position:relative !important;
z-index:5 !important;
}
/* A restrained vertical light beam on the far right */
.hero__container{
background-image:
linear-gradient(102deg,transparent 0 74%,rgba(255,255,255,.48) 74.3%,rgba(255,255,255,.08) 81%,transparent 81.3%),
radial-gradient(ellipse at 86% 30%,rgba(199,229,241,.55) 0%,rgba(228,242,247,.26) 29%,transparent 51%),
radial-gradient(ellipse at 78% 80%,rgba(237,228,246,.32) 0%,transparent 36%),
linear-gradient(118deg,#fff 0%,#fcfdfe 52%,#f1f8fb 100%) !important;
}
/* =========================================================
V34 — unified descriptor + background +10% on portrait side
========================================================= */
/* Treat the two descriptor lines as one continuous typographic block */
.hero__lead{
font-size:22px !important;
line-height:1.34 !important;
font-weight:400 !important;
color:#5e737d !important;
}
.hero__lead .lead-intro,
.hero__lead .lead-light{
display:inline !important;
margin:0 !important;
font:inherit !important;
line-height:inherit !important;
font-weight:400 !important;
color:inherit !important;
}
/* Preserve the intentional line break, but not a visual hierarchy break */
.hero__lead br{
display:block !important;
content:"" !important;
margin-top:2px !important;
}
/* Strengthen the right-side gradient and shadows by roughly 10% */
.hero__container{
background-image:
linear-gradient(102deg,transparent 0 74%,rgba(255,255,255,.53) 74.3%,rgba(255,255,255,.09) 81%,transparent 81.3%),
radial-gradient(ellipse at 86% 30%,rgba(190,226,241,.61) 0%,rgba(222,239,246,.30) 29%,transparent 51%),
radial-gradient(ellipse at 78% 80%,rgba(233,222,245,.36) 0%,transparent 36%),
linear-gradient(118deg,#fff 0%,#fcfdfe 52%,#eff7fa 100%) !important;
}
.hero__portrait:before{
background:
linear-gradient(145deg,rgba(255,255,255,.64),rgba(195,228,242,.27) 48%,rgba(226,213,243,.20)) !important;
border-color:rgba(255,255,255,.79) !important;
box-shadow:
inset 0 0 0 1px rgba(100,169,200,.07),
0 26px 74px rgba(67,119,145,.085) !important;
}
/* =========================================================
V35 — CTA refinement + visual event descriptor + compact author card
========================================================= */
/* CTA */
.hero__button{
width:350px !important;
padding-left:35px !important;
font-size:20px !important;
margin-top:34px !important;
}
/* Descriptor becomes one visual unit */
.hero__format{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
gap:9px !important;
margin-bottom:0 !important;
font-size:20px !important;
line-height:1.3 !important;
color:#60747d !important;
}
.hero__format-title{
font:inherit !important;
color:inherit !important;
font-weight:400 !important;
}
.hero__format-items{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:11px;
font:inherit;
color:inherit;
}
.hero__format-items span{
font:inherit !important;
color:inherit !important;
}
.hero__format-items i{
display:block;
width:5px;
height:5px;
border-radius:50%;
background:rgba(66,131,160,.45);
flex:0 0 auto;
}
/* More compact glass author card */
.hero__author-card{
width:max-content !important;
max-width:370px !important;
min-width:0 !important;
padding:14px 17px 13px !important;
}
.hero__author-card span{
max-width:315px;
}
/* Animated underline across the whole author link */
.hero__author-card a{
position:relative !important;
padding:4px 0 6px !important;
width:max-content !important;
text-decoration:none !important;
}
.hero__author-card a:after{
content:"" !important;
position:absolute !important;
left:0 !important;
right:auto !important;
top:auto !important;
bottom:1px !important;
width:100% !important;
height:1px !important;
border-radius:0 !important;
background:currentColor !important;
transform:scaleX(.28) !important;
transform-origin:left center !important;
opacity:.45 !important;
transition:transform .28s ease, opacity .28s ease !important;
pointer-events:none !important;
}
.hero__author-card a:hover:after,
.hero__author-card a:focus-visible:after{
transform:scaleX(1) !important;
opacity:.9 !important;
}
.hero__author-card a b{
transition:transform .28s ease !important;
}
.hero__author-card a:hover b,
.hero__author-card a:focus-visible b{
transform:translate(2px,-2px);
}
/* =========================================================
V36 — compact 17px event format with directional marker
========================================================= */
.hero__format{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
gap:4px !important;
font-size:17px !important;
line-height:1.35 !important;
font-weight:400 !important;
color:#627780 !important;
}
.hero__format-heading{
display:flex;
align-items:center;
gap:8px;
font:inherit;
color:inherit;
}
.hero__format-arrow{
display:inline-flex;
align-items:center;
justify-content:center;
width:18px;
flex:0 0 18px;
color:#4b8ba8;
font-size:17px;
line-height:1;
}
.hero__format-items{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
gap:3px !important;
margin-left:26px;
font:inherit !important;
color:inherit !important;
}
.hero__format-item{
position:relative;
display:block !important;
padding-left:13px;
font:inherit !important;
color:inherit !important;
}
.hero__format-item:before{
content:"";
position:absolute;
left:0;
top:.62em;
width:4px;
height:4px;
border-radius:50%;
background:rgba(69,137,168,.55);
}
/* Remove the previous inline separator if inherited */
.hero__format-items > i{
display:none !important;
}
/* =========================================================
V37 — final first-screen refinements before program section
========================================================= */
.hero__event-line{
margin-bottom:45px !important;
}
/* Arrow removed; align event format naturally with the copy */
.hero__format-heading{
gap:0 !important;
}
.hero__format-items{
margin-left:0 !important;
}
/* Keep longer author description compact inside the glass card */
.hero__author-card{
max-width:390px !important;
}
.hero__author-card span{
max-width:350px !important;
line-height:1.3 !important;
}
/* =========================================================
V38 — SECTION 02 / PROGRAM
========================================================= */
.program-preview{display:none!important}
.program-section{
position:relative;
z-index:1;
margin-top:-215px;
padding:310px 0 120px;
background:
radial-gradient(ellipse at 10% 10%,rgba(211,229,238,.38),transparent 30%),
linear-gradient(180deg,#edf3f5 0%,#f7f9fa 52%,#ffffff 100%);
}
.program-section__inner{
width:min(1200px,calc(100% - 48px));
margin:0 auto;
}
.program-section__intro{
display:grid;
grid-template-columns:180px 1fr auto;
align-items:end;
gap:30px;
margin-bottom:48px;
}
.program-section__kicker{
align-self:start;
padding-top:8px;
font-size:13px;
line-height:1;
font-weight:650;
letter-spacing:.10em;
text-transform:uppercase;
color:#68818c;
}
.program-section__intro h2{
margin:0;
max-width:610px;
font-size:56px;
line-height:.98;
letter-spacing:-.045em;
font-weight:560;
color:#20353e;
}
.program-section__intro p{
margin:0 0 5px;
font-size:15px;
color:#71858e;
}
.program-section__grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
}
.program-day{
position:relative;
min-height:550px;
padding:24px 25px 22px;
overflow:hidden;
border:1px solid rgba(72,119,140,.11);
border-radius:28px;
background:rgba(255,255,255,.78);
box-shadow:0 16px 46px rgba(47,79,94,.055);
display:flex;
flex-direction:column;
transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.program-day:before{
content:"";
position:absolute;
right:-70px;
top:-85px;
width:220px;
height:220px;
border-radius:50%;
background:radial-gradient(circle,rgba(164,211,231,.24),transparent 68%);
pointer-events:none;
}
.program-day--middle:before{
background:radial-gradient(circle,rgba(220,208,238,.25),transparent 68%);
}
.program-day--retreat:before{
background:radial-gradient(circle,rgba(246,216,157,.30),transparent 68%);
}
.program-day:hover{
transform:translateY(-5px);
border-color:rgba(72,132,158,.20);
box-shadow:0 22px 55px rgba(47,79,94,.09);
}
.program-day__top{
position:relative;
z-index:1;
display:flex;
justify-content:space-between;
align-items:center;
padding-bottom:22px;
border-bottom:1px solid rgba(72,119,140,.10);
}
.program-day__number{
font-size:13px;
font-weight:600;
color:#8ba0a9;
}
.program-day__date{
padding:8px 12px;
border-radius:999px;
background:#f1f6f8;
font-size:13px;
font-weight:600;
color:#486a79;
}
.program-day__body{
position:relative;
z-index:1;
padding-top:34px;
}
.program-day__type{
display:block;
margin-bottom:15px;
font-size:13px;
font-weight:650;
letter-spacing:.04em;
color:#4b8aa7;
}
.program-day--retreat .program-day__type{
color:#9b762e;
}
.program-day__body h3{
margin:0 0 20px;
font-size:31px;
line-height:1.03;
letter-spacing:-.035em;
font-weight:570;
color:#233840;
}
.program-day__body p{
margin:0;
max-width:310px;
font-size:15px;
line-height:1.55;
color:#71838b;
}
.program-day__footer{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:space-between;
margin-top:auto;
padding-top:24px;
font-size:14px;
font-weight:600;
color:#516d79;
}
.program-day__footer b{
display:flex;
align-items:center;
justify-content:center;
width:35px;
height:35px;
border:1px solid rgba(69,127,153,.15);
border-radius:50%;
font-size:15px;
font-weight:400;
transition:transform .25s ease,background .25s ease;
}
.program-day:hover .program-day__footer b{
transform:translateX(3px);
background:#f0f6f8;
}
/* =========================================================
V39 — PROGRAM refinement
========================================================= */
/* No gradient on section: use the normal page background */
.program-section{
margin-top:-215px !important;
padding:238px 0 120px !important;
background:#f7f9fa !important;
}
/* Compact, left-aligned heading */
.program-section__intro{
display:block !important;
margin-bottom:34px !important;
}
.program-section__kicker{
display:block !important;
padding:0 !important;
margin-bottom:13px !important;
font-size:13px !important;
}
.program-section__intro h2{
max-width:none !important;
margin:0 !important;
font-size:50px !important;
line-height:1 !important;
}
.program-section__intro p{
display:none !important;
}
/* Cards: clear blue family for lecture 1+2, warm family for retreat */
.program-day{
min-height:550px !important;
padding:24px 25px 24px !important;
}
.program-day--lecture{
border-color:rgba(65,143,181,.16) !important;
background:
linear-gradient(155deg,rgba(255,255,255,.94) 0%,rgba(246,251,253,.96) 58%,rgba(231,244,250,.92) 100%) !important;
}
.program-day--middle{
background:
linear-gradient(155deg,rgba(255,255,255,.94) 0%,rgba(245,250,253,.96) 56%,rgba(226,241,249,.94) 100%) !important;
}
.program-day--retreat{
border-color:rgba(204,151,60,.19) !important;
background:
linear-gradient(155deg,rgba(255,255,255,.96) 0%,rgba(255,250,241,.96) 55%,rgba(250,232,196,.88) 100%) !important;
}
/* Stronger but restrained accent glow */
.program-day--lecture:before{
right:-58px !important;
top:-72px !important;
width:245px !important;
height:245px !important;
background:radial-gradient(circle,rgba(102,190,229,.30),transparent 69%) !important;
}
.program-day--retreat:before{
right:-58px !important;
top:-72px !important;
width:245px !important;
height:245px !important;
background:radial-gradient(circle,rgba(239,181,75,.38),transparent 69%) !important;
}
/* Date alone, aligned left. Remove card numbering. */
.program-day__top{
justify-content:flex-start !important;
padding-bottom:20px !important;
}
.program-day__number{
display:none !important;
}
.program-day__date{
padding:8px 12px !important;
}
.program-day--lecture .program-day__date{
background:rgba(222,241,249,.82) !important;
color:#367b9b !important;
}
.program-day--retreat .program-day__date{
background:rgba(250,231,193,.80) !important;
color:#916b27 !important;
}
.program-day__body{
padding-top:29px !important;
}
.program-day__type{
margin-bottom:10px !important;
}
.program-day__part{
display:block;
margin:-9px 0 18px;
font-size:13px;
font-weight:500;
color:#7b9099;
}
/* Remove the old footer labels/arrows */
.program-day__footer{
display:none !important;
}
/* Ticket buttons */
.program-day__button{
position:relative;
z-index:2;
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
min-height:52px;
margin-top:auto;
padding:0 15px 0 19px;
border:1px solid rgba(54,132,169,.16);
border-radius:15px;
background:rgba(230,244,250,.82);
color:#2f7595;
font-size:15px;
font-weight:650;
text-decoration:none;
transition:transform .25s ease,background .25s ease,box-shadow .25s ease;
}
.program-day__button b{
display:flex;
align-items:center;
justify-content:center;
width:31px;
height:31px;
border-radius:50%;
background:rgba(255,255,255,.75);
font-size:14px;
font-weight:500;
transition:transform .25s ease;
}
.program-day__button:hover{
transform:translateY(-2px);
background:rgba(216,238,247,.96);
box-shadow:0 9px 22px rgba(51,123,155,.10);
}
.program-day__button:hover b{
transform:translateX(2px);
}
.program-day__button--warm{
border-color:rgba(187,132,39,.16);
background:rgba(249,226,181,.68);
color:#8d6724;
}
.program-day__button--warm:hover{
background:rgba(247,217,158,.88);
box-shadow:0 9px 22px rgba(161,113,35,.10);
}
/* =========================================================
V40 — real program content + individual ticket links
========================================================= */
.program-section__subtitle{
display:block !important;
max-width:590px;
margin:14px 0 0 !important;
font-size:16px !important;
line-height:1.45;
color:#74868e;
}
.program-day{
min-height:550px !important;
}
.program-day__top{
justify-content:space-between !important;
}
.program-day__day{
font-size:12px;
line-height:1;
font-weight:650;
letter-spacing:.06em;
text-transform:uppercase;
color:#91a1a8;
}
.program-day__body h3{
margin:0 0 14px !important;
font-size:36px !important;
}
.program-day__type{
max-width:290px;
min-height:34px;
line-height:1.35 !important;
}
.program-day__introtext{
margin:0 0 20px !important;
min-height:69px;
font-size:14px !important;
line-height:1.5 !important;
color:#667b84 !important;
}
.program-day__topics{
list-style:none;
margin:0;
padding:0;
}
.program-day__topics li{
position:relative;
margin:0 0 10px;
padding-left:16px;
font-size:13px;
line-height:1.42;
color:#71838b;
}
.program-day__topics li:before{
content:"";
position:absolute;
left:0;
top:.58em;
width:5px;
height:5px;
border-radius:50%;
background:#72abc4;
}
.program-day--retreat .program-day__topics li:before{
background:#d7a44d;
}
.program-day__button{
margin-top:26px !important;
flex:0 0 52px;
}
/* Discount message after the three choices */
.program-discount{
display:flex;
align-items:center;
gap:18px;
max-width:790px;
margin:28px auto 0;
padding:17px 21px;
border:1px solid rgba(69,132,160,.11);
border-radius:20px;
background:rgba(255,255,255,.76);
box-shadow:0 12px 34px rgba(47,79,94,.04);
}
.program-discount__badge{
display:flex;
align-items:center;
justify-content:center;
flex:0 0 58px;
height:42px;
border-radius:13px;
background:#e8f4f8;
color:#397e9c;
font-size:16px;
font-weight:700;
}
.program-discount p{
margin:0;
font-size:14px;
line-height:1.45;
color:#71838b;
}
.program-discount strong{
color:#405861;
font-weight:650;
}
/* =========================================================
V41 — ticket selection modal / cbiletom widgets
========================================================= */
button.program-day__button{
appearance:none;
-webkit-appearance:none;
cursor:pointer;
font-family:inherit;
text-align:left;
}
.ticket-modal{
position:fixed;
inset:0;
z-index:9999;
display:flex;
align-items:center;
justify-content:center;
padding:28px;
visibility:hidden;
opacity:0;
transition:opacity .22s ease,visibility .22s ease;
}
.ticket-modal.is-open{
visibility:visible;
opacity:1;
}
.ticket-modal__backdrop{
position:absolute;
inset:0;
background:rgba(26,42,49,.46);
backdrop-filter:blur(7px);
-webkit-backdrop-filter:blur(7px);
}
.ticket-modal__dialog{
position:relative;
z-index:1;
width:min(1160px,100%);
max-height:calc(100vh - 56px);
overflow:hidden;
border:1px solid rgba(255,255,255,.68);
border-radius:30px;
background:#fff;
box-shadow:0 32px 90px rgba(25,48,60,.24);
transform:translateY(12px) scale(.985);
transition:transform .26s ease;
}
.ticket-modal.is-open .ticket-modal__dialog{
transform:none;
}
.ticket-modal__header{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:30px;
padding:25px 28px 20px;
border-bottom:1px solid rgba(60,103,123,.10);
background:linear-gradient(110deg,#fff 0%,#f7fbfc 100%);
}
.ticket-modal__eyebrow{
display:block;
margin-bottom:7px;
font-size:11px;
font-weight:700;
letter-spacing:.10em;
text-transform:uppercase;
color:#72909e;
}
.ticket-modal__header h2{
margin:0 0 7px;
font-size:29px;
line-height:1;
letter-spacing:-.035em;
color:#233840;
}
.ticket-modal__header p{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:9px;
margin:0;
font-size:14px;
color:#73858d;
}
.ticket-modal__header p strong{
color:#3c6577;
font-weight:650;
}
#ticketProgramDate:before{
content:"•";
margin-right:9px;
color:#9eb0b8;
}
.ticket-modal__close{
display:flex;
align-items:center;
justify-content:center;
flex:0 0 42px;
width:42px;
height:42px;
padding:0 0 3px;
border:1px solid rgba(57,105,126,.11);
border-radius:50%;
background:#f1f6f8;
color:#4f6c78;
font:300 29px/1 Arial,sans-serif;
cursor:pointer;
transition:background .2s ease,transform .2s ease;
}
.ticket-modal__close:hover{
background:#e7f1f5;
transform:rotate(4deg);
}
.ticket-modal__frame-wrap{
position:relative;
height:min(600px,calc(100vh - 190px));
min-height:420px;
background:#fff;
}
.ticket-modal__loading{
position:absolute;
z-index:0;
inset:0;
display:flex;
align-items:center;
justify-content:center;
color:#84969e;
font-size:14px;
}
#ticketWidgetFrame{
position:relative;
z-index:1;
display:block;
width:100%;
height:100%;
border:0;
background:transparent;
}
body.ticket-modal-open{
overflow:hidden;
}
/* =========================================================
V42 — program spacing, content refinements, aligned CTAs
========================================================= */
.program-section{
margin-top:0 !important;
padding:55px 0 120px !important;
}
.program-section__grid{
align-items:stretch !important;
}
.program-day{
height:100% !important;
min-height:550px !important;
}
.program-day__body{
display:flex !important;
flex-direction:column !important;
flex:1 1 auto !important;
}
.program-day__button{
margin-top:auto !important;
flex:0 0 52px !important;
}
.program-day__type{
max-width:315px !important;
min-height:50px !important;
}
/* =========================================================
V43 — stronger ticket CTA + tighter section connection
========================================================= */
.program-section{
margin-top:-12px !important;
}
/* Ticket buttons: stronger visual priority, inspired by hero CTA */
.program-day__button{
min-height:54px !important;
flex-basis:54px !important;
padding:0 13px 0 20px !important;
border:1px solid rgba(38,125,168,.24) !important;
border-radius:11px !important;
background:linear-gradient(110deg,#438fb2 0%,#327b9f 100%) !important;
color:#fff !important;
box-shadow:
0 10px 24px rgba(49,126,161,.18),
inset 0 1px 0 rgba(255,255,255,.16) !important;
font-size:15px !important;
font-weight:650 !important;
}
.program-day__button b{
width:32px !important;
height:32px !important;
background:rgba(255,255,255,.16) !important;
color:#fff !important;
}
.program-day__button:hover{
transform:translateY(-2px) !important;
background:linear-gradient(110deg,#4b9abd 0%,#347fa4 100%) !important;
box-shadow:
0 14px 28px rgba(49,126,161,.24),
inset 0 1px 0 rgba(255,255,255,.18) !important;
}
/* Retreat stays warm, but equally prominent */
.program-day__button--warm{
border-color:rgba(181,122,30,.25) !important;
background:linear-gradient(110deg,#d9a548 0%,#bd8330 100%) !important;
color:#fff !important;
box-shadow:
0 10px 24px rgba(177,119,32,.18),
inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.program-day__button--warm:hover{
background:linear-gradient(110deg,#e0ad50 0%,#c78b34 100%) !important;
box-shadow:
0 14px 28px rgba(177,119,32,.24),
inset 0 1px 0 rgba(255,255,255,.20) !important;
}
/* =========================================================
V44 — fix the oversized gap after HERO
========================================================= */
.hero{
padding-bottom:55px !important;
}
/* =========================================================
V45 — exact spacing between HERO and PROGRAM
========================================================= */
/* Hero starts flush with the top of the page and adds no space below */
html, body{
margin-top:0 !important;
padding-top:0 !important;
}
.hero{
margin-top:0 !important;
padding-top:0 !important;
padding-bottom:0 !important;
}
.hero__container{
margin-top:0 !important;
}
/* The entire gap between hero container and program is controlled here */
.program-section{
margin-top:0 !important;
padding-top:55px !important;
}
/* =========================================================
V46 — HERO CONTAINER starts at viewport pixel 0
========================================================= */
html,
body{
margin:0 !important;
padding:0 !important;
}
section.hero,
.hero{
position:relative !important;
margin:0 !important;
padding-top:0 !important;
top:0 !important;
}
.hero__container{
margin-top:0 !important;
top:0 !important;
transform:none !important;
}
/* Ensure no pseudo-element above the card can visually create a top gap */
.hero::before,
.hero::after{
top:0;
}
/* =========================================================
V47 — screenshot-verified HERO positioning fix
Root cause: .hero had min-height:900px + align-items:center,
which vertically centered the shorter hero__container.
========================================================= */
.hero{
min-height:0 !important;
height:auto !important;
display:flex !important;
align-items:flex-start !important;
margin:0 !important;
padding:0 !important;
}
.hero__container{
margin:0 auto !important;
top:auto !important;
transform:none !important;
}
/* Exactly 55px from the bottom edge of hero__container
to the beginning of the program content */
.program-section{
margin:0 !important;
padding-top:55px !important;
}
/* V48 — requested HERO bottom spacing */
section.hero{
padding-bottom:60px !important;
}
/* V49 — HERO: seminar + clear three-day structure */
.hero__format-days{gap:4px !important; padding-top: 10px;}
.hero__format-days .hero__format-item{padding-left:13px !important;}
.hero__format-days .hero__format-item b{font-weight:650;color:#435f6b;}
/* =========================================================
V50 — stronger HERO bullets + clearer program heading
========================================================= */
.hero__format-heading{
font-weight:600 !important;
color:#4a6570 !important;
}
.hero__format-days .hero__format-item{
padding-left:17px !important;
}
.hero__format-days .hero__format-item:before{
width:7px !important;
height:7px !important;
top:.52em !important;
background:rgba(61,139,176,.78) !important;
box-shadow:0 0 0 3px rgba(78,157,193,.09);
}
.hero__format-days .hero__format-item b{
font-weight:700 !important;
color:#385765 !important;
}
/* =========================================================
V51 — program titles become primary + brighter visual system
========================================================= */
/* Brighter, cleaner card surfaces */
.program-day--lecture{
border-color:rgba(68,157,202,.18) !important;
background:
linear-gradient(150deg,#ffffff 0%,#f8fcff 52%,#eaf7fd 100%) !important;
box-shadow:0 16px 42px rgba(61,139,177,.07) !important;
}
.program-day--middle{
background:
linear-gradient(150deg,#ffffff 0%,#f7fcff 50%,#e5f5fc 100%) !important;
}
.program-day--retreat{
border-color:rgba(220,164,63,.20) !important;
background:
linear-gradient(150deg,#ffffff 0%,#fffdf8 50%,#fff1d7 100%) !important;
box-shadow:0 16px 42px rgba(185,132,38,.07) !important;
}
/* Secondary label is now the day/theme; the actual program is the headline */
.program-day__type{
min-height:0 !important;
margin-bottom:11px !important;
font-size:12.5px !important;
font-weight:700 !important;
letter-spacing:.045em !important;
text-transform:uppercase;
color:#5796b4 !important;
}
.program-day--retreat .program-day__type{
color:#b1802e !important;
}
.program-day__body h3{
margin:0 0 15px !important;
font-size:28px !important;
line-height:1.08 !important;
letter-spacing:-.035em !important;
font-weight:620 !important;
color:#2f7fa5 !important;
}
.program-day__body h3 em{
display:block;
margin-top:5px;
font-size:15px;
line-height:1.2;
font-style:normal;
font-weight:650;
letter-spacing:0;
color:#668b9c;
}
.program-day--retreat .program-day__body h3{
color:#b47b25 !important;
}
/* Lighter, more vivid CTA — same rounded family as hero button */
.program-day__button{
min-height:56px !important;
flex-basis:56px !important;
padding:0 13px 0 22px !important;
border:1px solid rgba(255,255,255,.42) !important;
border-radius:18px !important;
background:linear-gradient(105deg,#2f7fd5 0%,#39afe8 100%) !important;
color:#fff !important;
box-shadow:
0 10px 25px rgba(45,145,202,.20),
inset 0 1px 0 rgba(255,255,255,.24) !important;
}
.program-day__button:hover{
background:linear-gradient(105deg,#3489df 0%,#46b9ee 100%) !important;
box-shadow:
0 14px 30px rgba(45,145,202,.26),
inset 0 1px 0 rgba(255,255,255,.28) !important;
}
.program-day__button b{
width:34px !important;
height:34px !important;
border:1px solid rgba(255,255,255,.28);
background:rgba(255,255,255,.13) !important;
}
.program-day__button--warm{
background:linear-gradient(105deg,#e2a83f 0%,#f0c567 100%) !important;
box-shadow:
0 10px 25px rgba(204,147,43,.20),
inset 0 1px 0 rgba(255,255,255,.26) !important;
}
.program-day__button--warm:hover{
background:linear-gradient(105deg,#e8af46 0%,#f4cd73 100%) !important;
box-shadow:
0 14px 30px rgba(204,147,43,.25),
inset 0 1px 0 rgba(255,255,255,.30) !important;
}
/* =========================================================
V52 — cleaner card hierarchy
========================================================= */
/* Date is the only item in the top row now */
.program-day__top{
justify-content:flex-start !important;
}
/* Uniform Day 1 / Day 2 / Day 3 label */
.program-day__type{
text-transform:none !important;
font-size:13px !important;
font-weight:700 !important;
letter-spacing:.02em !important;
}
/* Seminar gets its own line */
.program-day__kind{
display:block;
margin-bottom:4px;
font-size:16px;
line-height:1.15;
font-weight:650;
letter-spacing:-.01em;
color:#4b7f98;
}
.program-day__title{
display:block;
}
/* Part 1 / Part 2 becomes a compact badge instead of a third headline */
.program-day__body h3 em{
display:inline-flex !important;
align-items:center;
min-height:27px;
margin-top:11px !important;
padding:0 10px;
border:1px solid rgba(68,151,192,.14);
border-radius:999px;
background:rgba(226,243,251,.72);
font-size:12px !important;
line-height:1 !important;
font-style:normal;
font-weight:700 !important;
letter-spacing:.02em !important;
color:#4f839b !important;
}
/* A little more definition on the CTA without making it heavy */
.program-day__button{
border:1px solid rgba(24,105,165,.28) !important;
outline:1px solid rgba(255,255,255,.16);
outline-offset:-2px;
}
.program-day__button--warm{
border-color:rgba(166,105,19,.30) !important;
}
/* =========================================================
V53 — more compact program cards
========================================================= */
.program-day{
min-height:550px !important;
}
.program-day__type{
display:flex !important;
align-items:center;
gap:7px;
margin-bottom:9px !important;
}
.program-day__type i{
font-style:normal;
font-weight:500;
opacity:.48;
}
.program-day__body h3{
margin-bottom:12px !important;
}
/* Keep descriptors on an equal visual rhythm */
.program-day__desc{
min-height:54px !important;
margin-bottom:17px !important;
line-height:1.48 !important;
}
/* Retreat needs a little more copy, but stays compact */
.program-day--retreat .program-day__desc{
min-height:96px !important;
}
/* Explicit two-line retreat heading */
.program-day__retreat-title span{
display:block;
}
.program-day__retreat-title span + span{
margin-top:2px;
}
/* Slightly tighten the content list to reduce total card height */
.program-day__topics{
gap:9px !important;
}
.program-day__topics li{
line-height:1.36 !important;
}
/* =========================================================
V54 — day/type and date share the top row
========================================================= */
.program-day__top{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:14px !important;
margin-bottom:17px !important;
}
.program-day__top .program-day__type{
margin:0 !important;
flex:0 0 auto;
}
.program-day__date{
margin-left:auto !important;
flex:0 0 auto;
}
/* Headline starts immediately after the divider/top row */
.program-day__body h3{
margin-top:0 !important;
}
/* With one whole row removed, cards can be more compact */
.program-day{
min-height:550px !important;
}
/* First two descriptors occupy the same visual block */
.program-day--lecture .program-day__desc{
min-height:62px !important;
}
/* Retreat descriptor no longer needs the taller text block */
.program-day--retreat .program-day__desc{
min-height:62px !important;
}
/* =========================================================
V55 — compact unified meta bar + tighter headline spacing
========================================================= */
/* One calm unified pill for Day / format / date */
.program-day__top{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:0 !important;
min-height:40px !important;
margin-bottom:10px !important;
padding:5px 6px 5px 12px !important;
border:1px solid rgba(95,135,153,.12) !important;
border-radius:13px !important;
background:rgba(239,246,249,.72) !important;
}
.program-day--retreat .program-day__top{
border-color:rgba(184,139,58,.13) !important;
background:rgba(255,247,231,.78) !important;
}
.program-day__top .program-day__type{
margin:0 !important;
padding:0 !important;
font-size:12.5px !important;
color:#557b8d !important;
}
.program-day--retreat .program-day__top .program-day__type{
color:#9b722e !important;
}
/* Date remains a small inner capsule, now on the right */
.program-day__date{
margin-left:auto !important;
padding:7px 10px !important;
border:1px solid rgba(91,138,159,.10) !important;
border-radius:9px !important;
background:rgba(255,255,255,.72) !important;
box-shadow:none !important;
}
.program-day--retreat .program-day__date{
border-color:rgba(181,133,46,.10) !important;
background:rgba(255,255,255,.68) !important;
}
/* Bring the main program title closer to the meta bar/divider */
.program-day__body h3{
margin-top:-2px !important;
}
/* Slightly tighter card body rhythm */
.program-day__type + h3,
.program-day__top + .program-day__body h3{
margin-top:0 !important;
}
/* =========================================================
V56 — quiet, lightweight card metadata
========================================================= */
.program-day__top{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:14px !important;
min-height:0 !important;
margin-bottom:8px !important;
padding:0 0 9px !important;
border:0 !important;
border-bottom:1px solid rgba(87,126,145,.12) !important;
border-radius:0 !important;
background:transparent !important;
}
.program-day--retreat .program-day__top{
border:0 !important;
border-bottom:1px solid rgba(171,126,47,.13) !important;
background:transparent !important;
}
.program-day__top .program-day__type{
margin:0 !important;
padding:0 !important;
font-size:12px !important;
font-weight:650 !important;
letter-spacing:.025em !important;
color:#6e8a97 !important;
}
.program-day--retreat .program-day__top .program-day__type{
color:#9b8154 !important;
}
.program-day__date{
margin-left:auto !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
font-size:12px !important;
font-weight:600 !important;
color:#84959d !important;
}
.program-day--retreat .program-day__date{
border:0 !important;
background:transparent !important;
color:#9d9078 !important;
}
/* Main title sits closer to the subtle metadata line */
.program-day__body h3{
margin-top:0 !important;
}
/* =========================================================
V57 — stronger Day label + restrained date capsule
========================================================= */
.program-day__top{
padding-bottom:9px !important;
margin-bottom:8px !important;
border-bottom:1px solid rgba(87,126,145,.11) !important;
}
/* Day becomes the stronger anchor on the left */
.program-day__top .program-day__type{
font-size:14px !important;
line-height:1 !important;
font-weight:750 !important;
letter-spacing:-.01em !important;
color:#426f84 !important;
}
.program-day--retreat .program-day__top .program-day__type{
color:#9c722d !important;
}
/* Date: clean outlined capsule, no filled background */
.program-day__date{
margin-left:auto !important;
padding:6px 10px !important;
border:1px solid rgba(71,128,154,.22) !important;
border-radius:999px !important;
background:transparent !important;
box-shadow:none !important;
font-size:11.5px !important;
line-height:1 !important;
font-weight:650 !important;
color:#698591 !important;
}
.program-day--retreat .program-day__date{
border:1px solid rgba(170,124,42,.23) !important;
background:transparent !important;
color:#90764a !important;
}
/* =========================================================
V58 — balanced top row + refined Day marker
========================================================= */
.program-day__top{
padding-top:18px !important;
padding-bottom:18px !important;
margin-bottom:8px !important;
}
/* Day marker: same size or stronger, but more editorial and less button-like */
.program-day__top .program-day__type{
position:relative;
display:inline-flex !important;
align-items:center;
padding-left:13px !important;
font-size:14px !important;
line-height:1 !important;
font-weight:750 !important;
letter-spacing:-.015em !important;
color:#426f84 !important;
}
.program-day__top .program-day__type:before{
content:"";
position:absolute;
left:0;
top:50%;
width:4px;
height:18px;
border-radius:999px;
transform:translateY(-50%);
background:#70b5d5;
}
.program-day--retreat .program-day__top .program-day__type{
color:#9c722d !important;
}
.program-day--retreat .program-day__top .program-day__type:before{
background:#d5a64f;
}
/* =========================================================
V59 — date left, Day marker right; date styling restored from V53
========================================================= */
.program-day__top{
justify-content:space-between !important;
}
/* Restore V53 date treatment */
.program-day__date{
margin-left:0 !important;
padding:8px 12px !important;
border:0 !important;
border-radius:999px !important;
background:rgba(222,241,249,.82) !important;
box-shadow:none !important;
font-size:13px !important;
line-height:1 !important;
font-weight:600 !important;
color:#367b9b !important;
}
.program-day--retreat .program-day__date{
border:0 !important;
background:rgba(250,231,193,.80) !important;
color:#916b27 !important;
}
/* Day marker now sits at the right edge */
.program-day__top .program-day__type{
margin-left:auto !important;
margin-right:0 !important;
}
/* =========================================================
V60 — requested spacing + lighter Day labels
========================================================= */
.program-day__top{
padding-top:0 !important;
}
/* Remove the vertical marker before Day 1 / 2 / 3 */
.program-day__top .program-day__type:before{
display:none !important;
content:none !important;
}
/* Lighter, slightly larger Day labels */
.program-day__top .program-day__type{
padding-left:0 !important;
font-size:16px !important;
font-weight:500 !important;
letter-spacing:-.01em !important;
color:#7293a2 !important;
}
.program-day--retreat .program-day__top .program-day__type{
color:#ad9468 !important;
}
/* Tighten the beginning of the card body */
.program-day__body{
padding-top:20px !important;
}
/* =========================================================
V61 — Part badge integrated into headline
========================================================= */
.program-day__body h3 .program-day__title em{
display:inline-flex !important;
vertical-align:middle;
align-items:center;
min-height:24px;
margin:0 0 3px 7px !important;
padding:0 9px;
border:1px solid rgba(68,151,192,.14);
border-radius:999px;
background:rgba(226,243,251,.72);
font-size:11px !important;
line-height:1 !important;
font-style:normal;
font-weight:700 !important;
letter-spacing:.02em !important;
color:#4f839b !important;
}
/* Removing Day 1 descriptor should not leave an artificial reserved gap */
.program-day:first-child .program-day__desc{
min-height:0 !important;
}
/* =========================================================
V62 — cleaner header, no divider, textual Part 1/2
========================================================= */
/* Remove the grey divider and all bottom-border treatment */
.program-day__top,
.program-day--retreat .program-day__top{
border:0 !important;
border-bottom:0 !important;
padding-bottom:0 !important;
margin-bottom:0 !important;
}
/* Pull the body up after removing the divider */
.program-day__body{
padding-top:5px !important;
}
/* Date + Day read as one compact metadata group */
.program-day__top{
justify-content:flex-start !important;
gap:9px !important;
}
.program-day__top .program-day__type{
order:2;
margin:0 !important;
padding:0 !important;
font-size:12px !important;
line-height:1 !important;
font-weight:550 !important;
letter-spacing:.01em !important;
color:#8197a1 !important;
}
.program-day--retreat .program-day__top .program-day__type{
color:#a49375 !important;
}
.program-day__date{
order:1;
margin:0 !important;
}
/* Part 1 / Part 2 are now plain text inside the headline */
.program-day__body h3 .program-day__title em{
display:inline !important;
min-height:0 !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
font-size:.62em !important;
line-height:inherit !important;
font-style:normal !important;
font-weight:550 !important;
letter-spacing:-.01em !important;
color:#79a6ba !important;
white-space:nowrap;
}
/* =========================================================
V63 — H3 spacing refinement
========================================================= */
.program-day__body h3{
padding-top:20px !important;
padding-bottom:10px !important;
}
/* =========================================================
V64 — Day 1 intro matches Day 2
========================================================= */
.program-day__intro-text{
margin-bottom:20px !important;
}
.program-day__introtext{margin-bottom:20px !important;}
/* =========================================================
V65 — Day 1/2 go straight from title to topics
========================================================= */
/* No artificial reserved height for intro copy */
.program-day__introtext,
.program-day__desc{
min-height:0 !important;
}
/* Retreat keeps its intro; give it a natural gap before topics */
.program-day--retreat .program-day__desc,
.program-day--retreat .program-day__introtext{
margin-bottom:30px !important;
}
.program-day__topics-label{
margin:2px 0 14px;
font-size:13px;
line-height:1;
font-weight:700;
letter-spacing:.02em;
color:#6c8793;
}
.program-day--retreat .program-day__topics-label{
color:#9b8154;
}
/* V66 — final card height */
.program-day{
min-height:550px !important;
}
/* =========================================================
V68 — Block 3 / audience
========================================================= */
.audience-section{
padding:92px 24px 104px;
background:#fff;
}
.audience-section__inner{
width:min(1320px,100%);
margin:0 auto;
}
.audience-section__head{
max-width:930px;
margin-bottom:48px;
}
.audience-section__kicker{
margin-bottom:17px;
font-size:13px;
line-height:1.2;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
color:#4b91af;
}
.audience-section__head h2{
margin:0;
max-width:900px;
font-size:52px;
line-height:1.02;
letter-spacing:-.045em;
font-weight:600;
color:#263f4a;
}
.audience-section__head > p{
max-width:650px;
margin:22px 0 0;
font-size:17px;
line-height:1.55;
color:#758991;
}
.audience-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}
.audience-card{
position:relative;
min-height:270px;
padding:34px 36px 32px;
overflow:hidden;
border:1px solid rgba(67,128,154,.13);
border-radius:28px;
background:
radial-gradient(circle at 100% 0%,rgba(205,235,246,.48),transparent 38%),
linear-gradient(145deg,#fff 0%,#f8fcfe 100%);
}
.audience-card__number{
display:block;
margin-bottom:42px;
font-size:12px;
line-height:1;
font-weight:700;
letter-spacing:.08em;
color:#78a9bc;
}
.audience-card h3{
max-width:510px;
margin:0 0 15px;
font-size:25px;
line-height:1.14;
letter-spacing:-.025em;
font-weight:600;
color:#31515f;
}
.audience-card p{
max-width:540px;
margin:0;
font-size:15px;
line-height:1.55;
color:#71858e;
}
/* =========================================================
V69 — rounded transition from Program to Audience
========================================================= */
/* Shared field behind the rounded top corners */
.program-section{
padding-bottom:92px !important;
}
.audience-section{
position:relative;
z-index:2;
margin-top:-50px;
border-radius:50px 50px 0 0;
background:#fff !important;
}
/* Paint the exposed corner area with the same background as block 2 */
.audience-section::before{
content:"";
position:absolute;
z-index:-2;
left:0;
right:0;
top:-50px;
height:100px;
background:radial-gradient(ellipse at 10% 10%,rgba(211,229,238,.38),transparent 30%),
linear-gradient(180deg,#edf3f5 0%,#f7f9fa 52%,#ffffff 100%);
pointer-events:none;
}
.audience-section::after{
content:"";
position:absolute;
z-index:-1;
inset:0;
border-radius:50px 50px 0 0;
background:#fff;
pointer-events:none;
}
.audience-section__head > p{
max-width:700px;
}
/* =========================================================
V70 — clean Program → Audience transition
========================================================= */
/* Keep enough space below the discount block */
.program-section{
padding-bottom:92px !important;
}
/* No artificial upward shift / positioning on block 3 */
.audience-section{
position:static !important;
z-index:auto !important;
margin-top:0 !important;
border-radius:50px 50px 0 0 !important;
background:#fff !important;
}
/* Remove the V69 helper layers that were causing the overlap/cropping */
.audience-section::before{
content:none !important;
display:none !important;
}
.audience-section::after{
content:none !important;
display:none !important;
}
/* The visible field around the rounded top of block 3
matches the lower background of Program section */
.program-section{
background-color:#f7f9fa !important;
}
/* =========================================================
V71 — page field + elevated Audience section
========================================================= */
body{
background:#f7f9fa !important;
}
.audience-section{
box-shadow:
0 -10px 28px rgba(49,81,95,.055),
0 -2px 8px rgba(49,81,95,.035) !important;
}
/* =========================================================
V72 — Audience cards: warmer, more expressive
========================================================= */
.program-section{
padding-bottom:60px !important;
}
.audience-section{
margin-top:26px !important;
}
/* More dimensional cards without making the section noisy */
.audience-card{
min-height:270px;
padding:30px 34px 32px !important;
border:1px solid rgba(74,145,174,.15) !important;
background:
radial-gradient(circle at 91% 12%,rgba(182,225,242,.48) 0%,rgba(219,240,248,.22) 22%,transparent 43%),
linear-gradient(145deg,#ffffff 0%,#fbfdfe 55%,#f1f9fc 100%) !important;
box-shadow:
0 14px 36px rgba(52,105,128,.065),
inset 0 1px 0 rgba(255,255,255,.92) !important;
transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.audience-card:nth-child(2),
.audience-card:nth-child(4){
background:
radial-gradient(circle at 91% 12%,rgba(224,217,243,.42) 0%,rgba(239,233,248,.18) 23%,transparent 43%),
linear-gradient(145deg,#ffffff 0%,#fcfbfe 55%,#f7f3fb 100%) !important;
border-color:rgba(145,122,177,.13) !important;
}
.audience-card:nth-child(3){
background:
radial-gradient(circle at 91% 12%,rgba(213,234,224,.46) 0%,rgba(235,245,240,.20) 23%,transparent 43%),
linear-gradient(145deg,#ffffff 0%,#fbfdfc 55%,#f2f9f5 100%) !important;
border-color:rgba(99,151,125,.13) !important;
}
.audience-card:hover{
transform:translateY(-3px);
border-color:rgba(74,145,174,.23) !important;
box-shadow:
0 20px 46px rgba(52,105,128,.10),
inset 0 1px 0 rgba(255,255,255,.96) !important;
}
/* Meaningful visual accent instead of unexplained 01 / 02 / 03 / 04 */
.audience-card__number{
display:flex !important;
align-items:center;
justify-content:center;
width:38px;
height:38px;
margin-bottom:34px !important;
border:1px solid rgba(65,145,180,.15);
border-radius:12px;
background:rgba(232,246,251,.78);
font-size:18px !important;
line-height:1 !important;
font-weight:500 !important;
letter-spacing:0 !important;
color:#5796b1 !important;
}
.audience-card:nth-child(2) .audience-card__number,
.audience-card:nth-child(4) .audience-card__number{
border-color:rgba(137,112,171,.14);
background:rgba(242,237,248,.82);
color:#8c77a8 !important;
}
.audience-card:nth-child(3) .audience-card__number{
border-color:rgba(89,143,116,.14);
background:rgba(235,246,240,.84);
color:#6c9a82 !important;
}
.audience-card h3{
font-size:26px !important;
line-height:1.12 !important;
color:#2f505e !important;
}
.audience-card p{
font-size:15.5px !important;
line-height:1.58 !important;
color:#6e838c !important;
}
/* =========================================================
V73 — Audience as one editorial composition
========================================================= */
.audience-panel{
position:relative;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
overflow:hidden;
border:1px solid rgba(70,125,149,.13);
border-radius:34px;
background:
radial-gradient(circle at 50% 47%,rgba(203,231,241,.52) 0%,rgba(226,240,246,.25) 18%,transparent 37%),
radial-gradient(circle at 84% 15%,rgba(232,221,245,.46) 0%,transparent 28%),
radial-gradient(circle at 16% 88%,rgba(218,239,228,.42) 0%,transparent 27%),
linear-gradient(145deg,#ffffff 0%,#fbfdfe 50%,#f7fafb 100%);
box-shadow:
0 20px 54px rgba(53,93,110,.07),
inset 0 1px 0 rgba(255,255,255,.95);
}
.audience-panel::before{
content:"";
position:absolute;
z-index:0;
left:50%;
top:50%;
width:230px;
height:230px;
transform:translate(-50%,-50%);
border:1px solid rgba(93,158,185,.10);
border-radius:50%;
box-shadow:
0 0 0 38px rgba(255,255,255,.17),
0 0 0 78px rgba(100,167,194,.025);
pointer-events:none;
}
.audience-panel .audience-card{
position:relative;
z-index:1;
min-height:260px !important;
padding:44px 46px 42px !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
transform:none !important;
}
.audience-panel .audience-card:nth-child(odd){
border-right:1px solid rgba(71,124,147,.11) !important;
}
.audience-panel .audience-card:nth-child(-n+2){
border-bottom:1px solid rgba(71,124,147,.11) !important;
}
.audience-panel .audience-card::after{
content:"";
position:absolute;
width:150px;
height:150px;
border-radius:50%;
opacity:.34;
filter:blur(1px);
pointer-events:none;
}
.audience-panel .audience-card:nth-child(1)::after{
right:-45px;
bottom:-70px;
background:radial-gradient(circle,rgba(158,215,237,.48),transparent 68%);
}
.audience-panel .audience-card:nth-child(2)::after{
left:-52px;
bottom:-72px;
background:radial-gradient(circle,rgba(210,190,231,.42),transparent 68%);
}
.audience-panel .audience-card:nth-child(3)::after{
right:-48px;
top:-72px;
background:radial-gradient(circle,rgba(180,222,199,.43),transparent 68%);
}
.audience-panel .audience-card:nth-child(4)::after{
left:-50px;
top:-70px;
background:radial-gradient(circle,rgba(237,215,178,.38),transparent 68%);
}
.audience-panel .audience-card h3{
position:relative;
z-index:2;
max-width:500px;
margin:0 0 18px !important;
font-size:27px !important;
line-height:1.12 !important;
letter-spacing:-.03em !important;
font-weight:600 !important;
color:#2e505e !important;
}
.audience-panel .audience-card p{
position:relative;
z-index:2;
max-width:510px;
margin:0 !important;
font-size:15.5px !important;
line-height:1.6 !important;
color:#6c828c !important;
}
/* =========================================================
V74 — central target as the visual idea of block 3
========================================================= */
.audience-panel{
min-height:610px;
border:0 !important;
border-radius:0 !important;
overflow:hidden;
background:
radial-gradient(circle at 50% 50%,rgba(203,232,243,.42) 0%,rgba(231,242,247,.19) 22%,transparent 43%),
radial-gradient(circle at 15% 20%,rgba(225,239,246,.30),transparent 27%),
radial-gradient(circle at 85% 78%,rgba(235,226,245,.27),transparent 28%),
transparent !important;
box-shadow:none !important;
}
/* Large target / focus graphic */
.audience-panel::before{
display:block !important;
content:"" !important;
position:absolute !important;
z-index:0 !important;
left:50% !important;
top:50% !important;
width:330px !important;
height:330px !important;
transform:translate(-50%,-50%) !important;
border:1px solid rgba(70,148,181,.20) !important;
border-radius:50% !important;
background:
radial-gradient(circle,
rgba(89,165,197,.13) 0 7px,
transparent 8px 51px,
rgba(85,158,190,.10) 52px 53px,
transparent 54px 101px,
rgba(85,158,190,.085) 102px 103px,
transparent 104px 149px,
rgba(85,158,190,.07) 150px 151px,
transparent 152px
) !important;
box-shadow:
0 0 0 44px rgba(91,159,188,.028),
0 0 0 88px rgba(91,159,188,.015) !important;
pointer-events:none;
}
/* Crosshair lines are deliberately short and soft */
.audience-panel::after{
content:"" !important;
display:block !important;
position:absolute;
z-index:0;
left:50%;
top:50%;
width:430px;
height:430px;
transform:translate(-50%,-50%);
background:
linear-gradient(90deg,
transparent calc(50% - .5px),
rgba(75,147,177,.12) calc(50% - .5px),
rgba(75,147,177,.12) calc(50% + .5px),
transparent calc(50% + .5px)),
linear-gradient(0deg,
transparent calc(50% - .5px),
rgba(75,147,177,.12) calc(50% - .5px),
rgba(75,147,177,.12) calc(50% + .5px),
transparent calc(50% + .5px));
-webkit-mask:
radial-gradient(circle,transparent 0 40px,#000 41px 100%);
mask:
radial-gradient(circle,transparent 0 40px,#000 41px 100%);
pointer-events:none;
}
/* Open up the centre so the target can breathe */
.audience-panel .audience-card{
min-height:305px !important;
padding:38px 42px !important;
border:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.audience-panel .audience-card:nth-child(odd),
.audience-panel .audience-card:nth-child(-n+2){
border:0 !important;
}
.audience-panel .audience-card:nth-child(1){
padding-right:145px !important;
padding-bottom:76px !important;
}
.audience-panel .audience-card:nth-child(2){
padding-left:145px !important;
padding-bottom:76px !important;
}
.audience-panel .audience-card:nth-child(3){
padding-right:145px !important;
padding-top:76px !important;
}
.audience-panel .audience-card:nth-child(4){
padding-left:145px !important;
padding-top:76px !important;
}
/* Remove the old decorative blobs; the target is now the single visual motif */
.audience-panel .audience-card::after{
content:none !important;
display:none !important;
}
.audience-panel .audience-card h3{
max-width:420px !important;
}
.audience-panel .audience-card p{
max-width:430px !important;
}
/* =========================================================
V75 — centered intro + balanced goal graphic
========================================================= */
/* Center the entire introduction above the circular composition */
.audience-section__head{
max-width:980px !important;
margin-left:auto !important;
margin-right:auto !important;
margin-bottom:50px !important;
text-align:center !important;
}
.audience-section__head h2{
max-width:930px !important;
margin-left:auto !important;
margin-right:auto !important;
}
.audience-section__head > p{
max-width:700px !important;
margin-left:auto !important;
margin-right:auto !important;
}
.audience-section__kicker{
text-align:left !important;
}
/* Softer "goal / direction" motif instead of a crosshair */
.audience-panel::before{
width:350px !important;
height:350px !important;
border:0 !important;
background:
radial-gradient(circle at 50% 50%,
rgba(255,255,255,.98) 0 16px,
rgba(114,190,207,.26) 17px 30px,
rgba(255,255,255,.88) 31px 55px,
rgba(143,184,218,.18) 56px 78px,
rgba(255,255,255,.68) 79px 108px,
rgba(190,165,218,.15) 109px 132px,
rgba(255,255,255,.45) 133px 158px,
rgba(232,192,137,.13) 159px 174px,
transparent 175px
) !important;
box-shadow:
0 0 48px rgba(93,174,198,.10),
0 0 96px rgba(177,151,208,.055) !important;
}
/* Remove rifle-scope crosshair completely */
.audience-panel::after{
content:none !important;
display:none !important;
}
/* Small offset rings make it feel like movement toward a goal */
.audience-panel{
background:
radial-gradient(circle at 50% 50%,rgba(186,226,238,.16) 0%,transparent 31%),
radial-gradient(circle at 47% 47%,rgba(216,201,235,.10) 0%,transparent 23%),
transparent !important;
}
/* Symmetrical text geometry around the centre */
.audience-panel .audience-card{
display:flex;
flex-direction:column;
justify-content:center;
min-height:305px !important;
}
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
align-items:flex-end;
padding-left:28px !important;
padding-right:205px !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
align-items:flex-start;
padding-left:205px !important;
padding-right:28px !important;
text-align:left !important;
}
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2){
padding-top:34px !important;
padding-bottom:58px !important;
}
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
padding-top:58px !important;
padding-bottom:34px !important;
}
.audience-panel .audience-card h3,
.audience-panel .audience-card p{
width:100%;
max-width:430px !important;
}
/* =========================================================
V76 — four situations converge into one goal
========================================================= */
/* Retire the previous pseudo-element goal so the new sector graphic owns the centre */
.audience-panel::before,
.audience-panel::after{
content:none !important;
display:none !important;
}
.audience-goal{
position:absolute;
z-index:1;
left:50%;
top:50%;
width:360px;
height:360px;
transform:translate(-50%,-50%) rotate(45deg);
border-radius:50%;
overflow:hidden;
background:#fff;
box-shadow:
0 0 0 1px rgba(67,144,177,.22),
0 0 0 18px rgba(84,167,196,.045),
0 22px 70px rgba(77,143,170,.16);
pointer-events:none;
}
/* Four coloured fields = four life situations */
.audience-goal__sector{
position:absolute;
width:50%;
height:50%;
}
.audience-goal__sector--one{
left:0;
top:0;
background:linear-gradient(135deg,rgba(67,176,215,.72),rgba(134,211,228,.32));
border-right:1px solid rgba(255,255,255,.72);
border-bottom:1px solid rgba(255,255,255,.72);
}
.audience-goal__sector--two{
right:0;
top:0;
background:linear-gradient(225deg,rgba(151,115,203,.60),rgba(205,183,231,.28));
border-bottom:1px solid rgba(255,255,255,.72);
}
.audience-goal__sector--three{
left:0;
bottom:0;
background:linear-gradient(45deg,rgba(80,176,139,.55),rgba(176,222,202,.26));
border-right:1px solid rgba(255,255,255,.72);
}
.audience-goal__sector--four{
right:0;
bottom:0;
background:linear-gradient(315deg,rgba(231,169,73,.56),rgba(244,213,158,.25));
}
/* Concentric rings unify the four sectors into one destination */
.audience-goal::before{
content:"";
position:absolute;
z-index:2;
inset:38px;
border-radius:50%;
border:1px solid rgba(255,255,255,.78);
box-shadow:
inset 0 0 0 34px rgba(255,255,255,.13),
0 0 0 1px rgba(66,126,151,.08);
}
.audience-goal::after{
content:"";
position:absolute;
z-index:3;
inset:102px;
border-radius:50%;
background:rgba(255,255,255,.72);
border:1px solid rgba(255,255,255,.94);
box-shadow:
0 0 0 18px rgba(255,255,255,.13),
0 10px 30px rgba(56,117,143,.10);
}
.audience-goal__core{
position:absolute;
z-index:4;
left:50%;
top:50%;
width:26px;
height:26px;
transform:translate(-50%,-50%);
border-radius:50%;
background:linear-gradient(135deg,#56b7d2,#778bc7 54%,#bd8ec7);
box-shadow:
0 0 0 8px rgba(255,255,255,.70),
0 0 26px rgba(74,160,190,.26);
}
/* Subtle connectors from each text group toward its sector */
.audience-panel .audience-card{
z-index:2 !important;
}
.audience-panel .audience-card::before{
content:"";
position:absolute;
top:50%;
width:74px;
height:1px;
opacity:.75;
}
.audience-panel .audience-card:nth-child(1)::before,
.audience-panel .audience-card:nth-child(3)::before{
right:116px;
background:linear-gradient(90deg,rgba(82,151,179,.10),rgba(82,151,179,.48));
}
.audience-panel .audience-card:nth-child(2)::before,
.audience-panel .audience-card:nth-child(4)::before{
left:116px;
background:linear-gradient(90deg,rgba(82,151,179,.48),rgba(82,151,179,.10));
}
.audience-panel .audience-card:nth-child(3)::before{
background:linear-gradient(90deg,rgba(84,155,123,.10),rgba(84,155,123,.46));
}
.audience-panel .audience-card:nth-child(4)::before{
background:linear-gradient(90deg,rgba(197,145,67,.46),rgba(197,145,67,.10));
}
/* Keep text at an equal optical distance from the circle */
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:220px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:220px !important;
}
/* =========================================================
V77 — stronger red goal + true 4-quadrant mapping
========================================================= */
/* Make all four text zones geometrically identical.
This fixes the top-right block sitting lower than top-left. */
.audience-panel .audience-card{
justify-content:center !important;
}
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2){
padding-top:38px !important;
padding-bottom:38px !important;
}
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
padding-top:38px !important;
padding-bottom:38px !important;
}
/* Central graphic: no rotation.
Quadrants now map literally:
top-left / top-right / bottom-left / bottom-right. */
.audience-goal{
width:370px !important;
height:370px !important;
transform:translate(-50%,-50%) !important;
background:#fff5f5 !important;
box-shadow:
0 0 0 1px rgba(205,50,62,.24),
0 0 0 18px rgba(226,55,69,.055),
0 24px 74px rgba(178,37,51,.18) !important;
}
/* Strong red palette, with distinct shades for the four problem zones */
.audience-goal__sector--one{
left:0 !important;
top:0 !important;
right:auto !important;
bottom:auto !important;
background:linear-gradient(135deg,#ff4f5f 0%,#f3273e 100%) !important;
border-right:2px solid rgba(255,255,255,.82) !important;
border-bottom:2px solid rgba(255,255,255,.82) !important;
}
.audience-goal__sector--two{
right:0 !important;
top:0 !important;
left:auto !important;
bottom:auto !important;
background:linear-gradient(225deg,#ff796c 0%,#f64b52 100%) !important;
border-left:0 !important;
border-bottom:2px solid rgba(255,255,255,.82) !important;
}
.audience-goal__sector--three{
left:0 !important;
bottom:0 !important;
right:auto !important;
top:auto !important;
background:linear-gradient(45deg,#d7193f 0%,#f12b4b 100%) !important;
border-right:2px solid rgba(255,255,255,.82) !important;
border-top:0 !important;
}
.audience-goal__sector--four{
right:0 !important;
bottom:0 !important;
left:auto !important;
top:auto !important;
background:linear-gradient(315deg,#ff955e 0%,#f45a4e 100%) !important;
border-left:0 !important;
border-top:0 !important;
}
/* Rings pull the four red quadrants into a shared centre */
.audience-goal::before{
inset:42px !important;
border:2px solid rgba(255,255,255,.86) !important;
box-shadow:
inset 0 0 0 37px rgba(255,255,255,.12),
0 0 0 1px rgba(137,20,38,.12) !important;
}
.audience-goal::after{
inset:108px !important;
background:rgba(255,244,244,.90) !important;
border:2px solid rgba(255,255,255,.98) !important;
box-shadow:
0 0 0 20px rgba(255,255,255,.14),
0 12px 34px rgba(137,20,38,.18) !important;
}
.audience-goal__core{
width:32px !important;
height:32px !important;
background:linear-gradient(135deg,#ff3e50 0%,#c91436 100%) !important;
box-shadow:
0 0 0 9px rgba(255,255,255,.84),
0 0 30px rgba(209,27,55,.42) !important;
}
/* Connectors use the same red visual language */
.audience-panel .audience-card:nth-child(1)::before,
.audience-panel .audience-card:nth-child(3)::before{
background:linear-gradient(90deg,rgba(218,34,58,.06),rgba(218,34,58,.62)) !important;
}
.audience-panel .audience-card:nth-child(2)::before,
.audience-panel .audience-card:nth-child(4)::before{
background:linear-gradient(90deg,rgba(218,34,58,.62),rgba(218,34,58,.06)) !important;
}
/* Slight red accent on headings ties copy to the problem/goal graphic */
.audience-panel .audience-card h3{
color:#343f47 !important;
}
.audience-panel .audience-card h3::first-line{
color:#b9243d;
}
/* =========================================================
V78 — calmer monochrome red goal + clean text clearance
========================================================= */
:root{
--audience-red:#f3273e;
--audience-red-dark:#d91f38;
}
/* One coherent colour for all four sectors */
.audience-goal{
width:340px !important;
height:340px !important;
background:#fff7f8 !important;
box-shadow:
0 0 0 1px rgba(243,39,62,.18),
0 0 0 14px rgba(243,39,62,.032),
0 20px 56px rgba(180,31,50,.11) !important;
}
.audience-goal__sector--one,
.audience-goal__sector--two,
.audience-goal__sector--three,
.audience-goal__sector--four{
background:linear-gradient(135deg,rgba(243,39,62,.82),rgba(243,39,62,.62)) !important;
}
.audience-goal__sector--one,
.audience-goal__sector--three{
border-right:2px solid rgba(255,255,255,.76) !important;
}
.audience-goal__sector--one,
.audience-goal__sector--two{
border-bottom:2px solid rgba(255,255,255,.76) !important;
}
/* Softer concentric construction */
.audience-goal::before{
inset:42px !important;
border:1px solid rgba(255,255,255,.90) !important;
box-shadow:
inset 0 0 0 35px rgba(255,255,255,.10),
0 0 0 1px rgba(153,20,38,.06) !important;
}
.audience-goal::after{
inset:103px !important;
background:rgba(255,247,248,.90) !important;
border:1px solid rgba(255,255,255,.98) !important;
box-shadow:
0 0 0 17px rgba(255,255,255,.11),
0 9px 24px rgba(155,22,41,.10) !important;
}
.audience-goal__core{
width:28px !important;
height:28px !important;
background:linear-gradient(135deg,var(--audience-red),var(--audience-red-dark)) !important;
box-shadow:
0 0 0 8px rgba(255,255,255,.84),
0 0 22px rgba(209,27,55,.25) !important;
}
/* Give the copy more breathing room: it must never visually enter the circle */
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:235px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:235px !important;
}
/* Same connector treatment for every quadrant */
.audience-panel .audience-card::before{
display:block !important;
top:50% !important;
width:58px !important;
height:1px !important;
opacity:.68 !important;
}
.audience-panel .audience-card:nth-child(1)::before,
.audience-panel .audience-card:nth-child(3)::before{
right:157px !important;
left:auto !important;
background:linear-gradient(90deg,rgba(243,39,62,.04),rgba(243,39,62,.50)) !important;
}
.audience-panel .audience-card:nth-child(2)::before,
.audience-panel .audience-card:nth-child(4)::before{
left:157px !important;
right:auto !important;
background:linear-gradient(90deg,rgba(243,39,62,.50),rgba(243,39,62,.04)) !important;
}
/* Keep the first-line accent, but slightly calmer than V77 */
.audience-panel .audience-card h3::first-line{
color:#c52a40 !important;
}
/* =========================================================
V79 — orbital goal infographic + precise connections
========================================================= */
/* More air around the infographic: text never enters the circle */
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:265px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:265px !important;
}
/* Add a second, airy radius/orbit around the central graphic */
.audience-goal{
width:330px !important;
height:330px !important;
overflow:visible !important;
box-shadow:
0 0 0 1px rgba(243,39,62,.16),
0 0 0 14px rgba(243,39,62,.028),
0 0 0 42px rgba(243,39,62,.020),
0 20px 52px rgba(180,31,50,.10) !important;
}
.audience-goal::before{
inset:-32px !important;
border:1px dashed rgba(243,39,62,.17) !important;
box-shadow:
0 0 0 22px rgba(243,39,62,.012),
inset 0 0 0 31px rgba(255,255,255,.055) !important;
}
/* Inner "destination" disc remains calm */
.audience-goal::after{
inset:98px !important;
background:rgba(255,248,249,.94) !important;
border:1px solid rgba(255,255,255,.98) !important;
box-shadow:
0 0 0 18px rgba(255,255,255,.12),
0 9px 24px rgba(155,22,41,.09) !important;
}
/* Four small nodes on the orbit visually explain:
each problem feeds into its quadrant of the goal. */
.audience-goal__sector{
overflow:visible;
}
.audience-goal__sector::after{
content:"";
position:absolute;
z-index:6;
width:8px;
height:8px;
border-radius:50%;
background:#f3273e;
border:3px solid #fff;
box-shadow:0 0 0 1px rgba(243,39,62,.22),0 3px 10px rgba(176,28,47,.16);
}
.audience-goal__sector--one::after{ left:-22px; top:-22px; }
.audience-goal__sector--two::after{ right:-22px; top:-22px; }
.audience-goal__sector--three::after{ left:-22px; bottom:-22px; }
.audience-goal__sector--four::after{ right:-22px; bottom:-22px; }
/* Connector originates immediately after each red heading area
and points toward the corresponding quadrant. */
.audience-panel .audience-card::before{
top:50% !important;
width:92px !important;
height:1px !important;
opacity:.82 !important;
}
.audience-panel .audience-card:nth-child(1)::before,
.audience-panel .audience-card:nth-child(3)::before{
right:155px !important;
background:linear-gradient(90deg,rgba(243,39,62,.08),rgba(243,39,62,.62)) !important;
}
.audience-panel .audience-card:nth-child(2)::before,
.audience-panel .audience-card:nth-child(4)::before{
left:155px !important;
background:linear-gradient(90deg,rgba(243,39,62,.62),rgba(243,39,62,.08)) !important;
}
/* Tiny terminal dot makes the vector feel intentional rather than decorative */
.audience-panel .audience-card h3{
position:relative;
}
.audience-panel .audience-card:nth-child(1) h3::after,
.audience-panel .audience-card:nth-child(3) h3::after{
content:"";
position:absolute;
right:-18px;
top:11px;
width:6px;
height:6px;
border-radius:50%;
background:#f3273e;
box-shadow:0 0 0 4px rgba(243,39,62,.08);
}
.audience-panel .audience-card:nth-child(2) h3::after,
.audience-panel .audience-card:nth-child(4) h3::after{
content:"";
position:absolute;
left:-18px;
top:11px;
width:6px;
height:6px;
border-radius:50%;
background:#f3273e;
box-shadow:0 0 0 4px rgba(243,39,62,.08);
}
/* =========================================================
V80 — fix audience composition after visual review
========================================================= */
/* The problem in V79 was simple: the central graphic was larger than
the actual reserved gap. Build the section around a real 360px centre. */
.audience-panel{
grid-template-columns:minmax(0,1fr) 360px minmax(0,1fr) !important;
grid-template-rows:auto auto !important;
column-gap:34px !important;
row-gap:64px !important;
align-items:center !important;
min-height:600px !important;
overflow:visible !important;
background:transparent !important;
}
/* Explicit placement leaves the middle column permanently empty */
.audience-panel .audience-card:nth-of-type(1){ grid-column:1; grid-row:1; }
.audience-panel .audience-card:nth-of-type(2){ grid-column:3; grid-row:1; }
.audience-panel .audience-card:nth-of-type(3){ grid-column:1; grid-row:2; }
.audience-panel .audience-card:nth-of-type(4){ grid-column:3; grid-row:2; }
.audience-panel .audience-card,
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
display:block !important;
min-height:0 !important;
padding:24px 0 !important;
border:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(3){
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(4){
text-align:left !important;
}
.audience-panel .audience-card h3{
max-width:470px !important;
margin:0 0 16px !important;
font-size:25px !important;
line-height:1.15 !important;
}
.audience-panel .audience-card p{
max-width:470px !important;
margin:0 !important;
font-size:15.5px !important;
line-height:1.58 !important;
}
.audience-panel .audience-card:nth-of-type(1) h3,
.audience-panel .audience-card:nth-of-type(1) p,
.audience-panel .audience-card:nth-of-type(3) h3,
.audience-panel .audience-card:nth-of-type(3) p{
margin-left:auto !important;
}
.audience-panel .audience-card:nth-of-type(2) h3,
.audience-panel .audience-card:nth-of-type(2) p,
.audience-panel .audience-card:nth-of-type(4) h3,
.audience-panel .audience-card:nth-of-type(4) p{
margin-right:auto !important;
}
/* Remove the awkward dots and free-floating horizontal rules from V79 */
.audience-panel .audience-card::before,
.audience-panel .audience-card h3::after{
content:none !important;
display:none !important;
}
/* Keep the central idea, but make it circular and contained rather than a square */
.audience-goal{
left:50% !important;
top:50% !important;
width:330px !important;
height:330px !important;
overflow:hidden !important;
border-radius:50% !important;
transform:translate(-50%,-50%) !important;
background:#fff6f7 !important;
box-shadow:
0 0 0 1px rgba(243,39,62,.15),
0 0 0 15px rgba(243,39,62,.025),
0 20px 58px rgba(177,31,49,.11) !important;
}
/* Four clean quadrants inside the circle */
.audience-goal__sector{
width:50% !important;
height:50% !important;
overflow:hidden !important;
background:linear-gradient(135deg,#fa5365 0%,#ef2f47 100%) !important;
}
.audience-goal__sector::after{
content:none !important;
display:none !important;
}
/* Inner rings, no outer target/crosshair language */
.audience-goal::before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:4 !important;
inset:48px !important;
border:1px solid rgba(255,255,255,.74) !important;
border-radius:50% !important;
background:rgba(255,255,255,.07) !important;
box-shadow:inset 0 0 0 38px rgba(255,255,255,.08) !important;
}
.audience-goal::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:5 !important;
inset:105px !important;
border:1px solid rgba(255,255,255,.92) !important;
border-radius:50% !important;
background:#fff5f6 !important;
box-shadow:0 0 0 17px rgba(255,255,255,.13) !important;
}
.audience-goal__core{
z-index:6 !important;
width:28px !important;
height:28px !important;
background:#ee2942 !important;
box-shadow:0 0 0 8px rgba(255,255,255,.86) !important;
}
/* A short, deliberate vector from each heading toward its quadrant.
It stays entirely inside the text column and cannot overlap the circle. */
.audience-panel .audience-card h3{
position:relative !important;
}
.audience-panel .audience-card:nth-of-type(1) h3::before,
.audience-panel .audience-card:nth-of-type(3) h3::before{
content:"" !important;
display:block !important;
position:absolute !important;
right:-26px !important;
top:13px !important;
width:18px !important;
height:2px !important;
border-radius:2px !important;
background:#ef334b !important;
}
.audience-panel .audience-card:nth-of-type(2) h3::before,
.audience-panel .audience-card:nth-of-type(4) h3::before{
content:"" !important;
display:block !important;
position:absolute !important;
left:-26px !important;
top:13px !important;
width:18px !important;
height:2px !important;
border-radius:2px !important;
background:#ef334b !important;
}
/* =========================================================
V81 — softer V78-style goal + extended quadrant guides
========================================================= */
/* Restore the calmer contrast from V78 */
.audience-goal{
overflow:visible !important;
background:#fff7f8 !important;
box-shadow:
0 0 0 1px rgba(243,39,62,.13),
0 0 0 13px rgba(243,39,62,.022),
0 18px 48px rgba(180,31,50,.085) !important;
}
.audience-goal__sector{
overflow:hidden !important;
border-radius:0 !important;
background:linear-gradient(135deg,rgba(243,39,62,.64),rgba(243,39,62,.46)) !important;
}
/* Keep the overall graphic circular even though guides extend outside it */
.audience-goal__sector--one{ border-radius:100% 0 0 0 !important; }
.audience-goal__sector--two{ border-radius:0 100% 0 0 !important; }
.audience-goal__sector--three{ border-radius:0 0 0 100% !important; }
.audience-goal__sector--four{ border-radius:0 0 100% 0 !important; }
.audience-goal::before{
inset:42px !important;
border:1px solid rgba(255,255,255,.84) !important;
background:rgba(255,255,255,.055) !important;
box-shadow:inset 0 0 0 35px rgba(255,255,255,.075) !important;
}
.audience-goal::after{
inset:103px !important;
background:rgba(255,248,249,.94) !important;
border:1px solid rgba(255,255,255,.97) !important;
box-shadow:0 0 0 17px rgba(255,255,255,.11) !important;
}
.audience-goal__core{
z-index:10 !important;
width:27px !important;
height:27px !important;
background:#ef3047 !important;
box-shadow:0 0 0 8px rgba(255,255,255,.82),0 0 20px rgba(209,27,55,.20) !important;
}
/* The plus continues well beyond the circle and defines four sectors */
.audience-goal__axis{
position:absolute;
z-index:3;
display:block;
pointer-events:none;
}
.audience-goal__axis--horizontal{
left:50%;
top:50%;
width:620px;
height:1px;
transform:translate(-50%,-50%);
background:linear-gradient(
90deg,
transparent 0%,
rgba(226,55,75,.08) 8%,
rgba(226,55,75,.30) 27%,
rgba(255,255,255,.80) 42%,
rgba(255,255,255,.88) 58%,
rgba(226,55,75,.30) 73%,
rgba(226,55,75,.08) 92%,
transparent 100%
);
}
.audience-goal__axis--vertical{
left:50%;
top:50%;
width:1px;
height:570px;
transform:translate(-50%,-50%);
background:linear-gradient(
180deg,
transparent 0%,
rgba(226,55,75,.08) 8%,
rgba(226,55,75,.30) 27%,
rgba(255,255,255,.80) 42%,
rgba(255,255,255,.88) 58%,
rgba(226,55,75,.30) 73%,
rgba(226,55,75,.08) 92%,
transparent 100%
);
}
/* Dashed orbital guides around the goal */
.audience-goal__orbit{
position:absolute;
z-index:2;
left:50%;
top:50%;
display:block;
border-radius:50%;
transform:translate(-50%,-50%);
pointer-events:none;
}
.audience-goal__orbit--one{
width:390px;
height:390px;
border:1px dashed rgba(225,53,74,.22);
}
.audience-goal__orbit--two{
width:448px;
height:448px;
border:1px dashed rgba(225,53,74,.11);
}
/* Remove short heading ticks: the long quadrant guides now do that job */
.audience-panel .audience-card h3::before{
content:none !important;
display:none !important;
}
/* =========================================================
V82 — text wraps visually around the circular infographic
========================================================= */
/* Pull all four text groups closer to the dotted orbit */
.audience-panel{
column-gap:0 !important;
}
.audience-panel .audience-card{
position:relative !important;
overflow:visible !important;
}
/* Left side: headings approach the circle, body copy steps back.
This creates the optical curve of the orbit. */
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(3){
padding-right:10px !important;
}
.audience-panel .audience-card:nth-of-type(1) h3,
.audience-panel .audience-card:nth-of-type(3) h3{
max-width:440px !important;
margin-right:-20px !important;
margin-left:auto !important;
}
.audience-panel .audience-card:nth-of-type(1) p,
.audience-panel .audience-card:nth-of-type(3) p{
max-width:405px !important;
margin-right:34px !important;
margin-left:auto !important;
}
/* Right side mirrors the same stepped contour */
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(4){
padding-left:10px !important;
}
.audience-panel .audience-card:nth-of-type(2) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
max-width:440px !important;
margin-left:-20px !important;
margin-right:auto !important;
}
.audience-panel .audience-card:nth-of-type(2) p,
.audience-panel .audience-card:nth-of-type(4) p{
max-width:405px !important;
margin-left:34px !important;
margin-right:auto !important;
}
/* Upper pair curves upward around the orbit */
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(-14px) !important;
}
/* Lower pair mirrors that curve downward */
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:translateY(14px) !important;
}
/* A subtle fade behind the text/circle meeting point keeps readability */
.audience-panel .audience-card h3{
text-wrap:balance;
}
/* =========================================================
V83 — symmetrical orbit wrapping / upper pair refinement
========================================================= */
/* Keep equal geometry from the central 360px column to both text sides */
.audience-panel{
grid-template-columns:minmax(0,1fr) 360px minmax(0,1fr) !important;
column-gap:0 !important;
}
/* Upper blocks move lower and become perfectly mirrored */
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(12px) !important;
}
/* Headings: equal distance from the dotted orbit */
.audience-panel .audience-card:nth-of-type(1) h3{
width:430px !important;
max-width:430px !important;
margin-right:18px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(2) h3{
width:430px !important;
max-width:430px !important;
margin-left:18px !important;
margin-right:auto !important;
text-align:left !important;
}
/* Upper descriptions wrap around the orbit in mirrored stepped contours.
Narrower measure + inward offset creates the curved visual edge. */
.audience-panel .audience-card:nth-of-type(1) p{
width:405px !important;
max-width:405px !important;
margin-right:48px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(2) p{
width:405px !important;
max-width:405px !important;
margin-left:48px !important;
margin-right:auto !important;
text-align:left !important;
}
/* The lower pair keeps the same mirror axis */
.audience-panel .audience-card:nth-of-type(3) h3{
width:430px !important;
max-width:430px !important;
margin-right:18px !important;
margin-left:auto !important;
}
.audience-panel .audience-card:nth-of-type(4) h3{
width:430px !important;
max-width:430px !important;
margin-left:18px !important;
margin-right:auto !important;
}
.audience-panel .audience-card:nth-of-type(3) p{
width:405px !important;
max-width:405px !important;
margin-right:48px !important;
margin-left:auto !important;
}
.audience-panel .audience-card:nth-of-type(4) p{
width:405px !important;
max-width:405px !important;
margin-left:48px !important;
margin-right:auto !important;
}
/* Small symmetric terminal marks between heading and orbit */
.audience-panel .audience-card:nth-of-type(1) h3::after,
.audience-panel .audience-card:nth-of-type(3) h3::after{
content:"" !important;
display:block !important;
position:absolute !important;
right:-18px !important;
left:auto !important;
top:13px !important;
width:10px !important;
height:2px !important;
border-radius:999px !important;
background:rgba(239,48,71,.62) !important;
}
.audience-panel .audience-card:nth-of-type(2) h3::after,
.audience-panel .audience-card:nth-of-type(4) h3::after{
content:"" !important;
display:block !important;
position:absolute !important;
left:-18px !important;
right:auto !important;
top:13px !important;
width:10px !important;
height:2px !important;
border-radius:999px !important;
background:rgba(239,48,71,.62) !important;
}
/* =========================================================
V84 — tighten vertical rhythm + lower text follows orbit
========================================================= */
/* Reduce the gap between upper and lower pairs */
.audience-panel{
row-gap:18px !important;
}
/* Upper pair moves toward the horizontal centre line */
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(34px) !important;
}
/* Lower pair moves upward toward the same centre line */
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:translateY(-34px) !important;
}
/* Lower headings hug the lower arc more closely */
.audience-panel .audience-card:nth-of-type(3) h3{
width:430px !important;
max-width:430px !important;
margin-right:-2px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(4) h3{
width:430px !important;
max-width:430px !important;
margin-left:-2px !important;
margin-right:auto !important;
text-align:left !important;
}
/* Lower descriptions step inward toward the bottom curve:
heading closest to the wide part of the circle,
description slightly narrower and closer to the centre. */
.audience-panel .audience-card:nth-of-type(3) p{
width:395px !important;
max-width:395px !important;
margin-right:34px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(4) p{
width:395px !important;
max-width:395px !important;
margin-left:34px !important;
margin-right:auto !important;
text-align:left !important;
}
/* Move the lower terminal marks with the copy */
.audience-panel .audience-card:nth-of-type(3) h3::after{
right:-18px !important;
}
.audience-panel .audience-card:nth-of-type(4) h3::after{
left:-18px !important;
}
/* =========================================================
V85 — true four-way radial symmetry around the goal
========================================================= */
/* Restore enough vertical separation for all four headings to sit
at matching ~45° positions around the dotted orbit. */
.audience-panel{
row-gap:52px !important;
}
/* Upper and lower pairs mirror each other around the horizontal axis */
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(18px) !important;
}
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:translateY(-18px) !important;
}
/* All four heading anchors use the exact same radial clearance */
.audience-panel .audience-card:nth-of-type(1) h3,
.audience-panel .audience-card:nth-of-type(3) h3{
width:430px !important;
max-width:430px !important;
margin-right:18px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(2) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
width:430px !important;
max-width:430px !important;
margin-left:18px !important;
margin-right:auto !important;
text-align:left !important;
}
/* Identical terminal marks for every quadrant */
.audience-panel .audience-card:nth-of-type(1) h3::after,
.audience-panel .audience-card:nth-of-type(3) h3::after{
content:"" !important;
display:block !important;
position:absolute !important;
right:-18px !important;
left:auto !important;
top:13px !important;
width:10px !important;
height:2px !important;
border-radius:999px !important;
background:rgba(239,48,71,.62) !important;
}
.audience-panel .audience-card:nth-of-type(2) h3::after,
.audience-panel .audience-card:nth-of-type(4) h3::after{
content:"" !important;
display:block !important;
position:absolute !important;
left:-18px !important;
right:auto !important;
top:13px !important;
width:10px !important;
height:2px !important;
border-radius:999px !important;
background:rgba(239,48,71,.62) !important;
}
/* Lower copy now mirrors upper copy instead of pushing through the orbit */
.audience-panel .audience-card:nth-of-type(3) p{
width:405px !important;
max-width:405px !important;
margin-right:48px !important;
margin-left:auto !important;
text-align:right !important;
}
.audience-panel .audience-card:nth-of-type(4) p{
width:405px !important;
max-width:405px !important;
margin-left:48px !important;
margin-right:auto !important;
text-align:left !important;
}
/* V86 — bottom quadrants invert hierarchy for radial symmetry */
.audience-panel .audience-card:nth-of-type(3) p,
.audience-panel .audience-card:nth-of-type(4) p{
margin-bottom:16px !important;
}
.audience-panel .audience-card:nth-of-type(3) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
margin-top:0 !important;
margin-bottom:0 !important;
}
/* =========================================================
V88 — Block 4 / What you take away
========================================================= */
.takeaway-section{
padding:112px 24px 118px;
background:
radial-gradient(circle at 82% 16%,rgba(218,236,243,.46),transparent 28%),
linear-gradient(180deg,#f7f9fa 0%,#f3f7f8 100%);
color:#17252c;
}
.takeaway-section__inner{
width:min(1320px,100%);
margin:0 auto;
}
.takeaway-section__head{
display:grid;
grid-template-columns:180px minmax(0,680px) minmax(260px,1fr);
gap:42px;
align-items:end;
padding-bottom:64px;
}
.takeaway-section__kicker{
align-self:start;
padding-top:13px;
font-size:13px;
font-weight:700;
line-height:1.2;
letter-spacing:.12em;
text-transform:uppercase;
color:#d9344d;
}
.takeaway-section__head h2{
margin:0;
font-size:clamp(54px,5.4vw,82px);
line-height:.94;
letter-spacing:-.055em;
font-weight:650;
}
.takeaway-section__head > p{
max-width:390px;
margin:0 0 7px;
font-size:17px;
line-height:1.55;
color:#60747e;
}
.takeaway-map{
position:relative;
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:0;
padding-top:40px;
}
.takeaway-map__line{
position:absolute;
left:0;
right:0;
top:62px;
height:1px;
background:linear-gradient(90deg,rgba(218,52,77,.08),rgba(218,52,77,.42) 15%,rgba(218,52,77,.42) 85%,rgba(218,52,77,.08));
}
.takeaway-item{
position:relative;
min-height:330px;
padding:0 38px 28px;
border-right:1px solid rgba(45,76,90,.10);
}
.takeaway-item:first-of-type{padding-left:0;}
.takeaway-item:last-of-type{
padding-right:0;
border-right:0;
}
.takeaway-item__num{
display:block;
margin-bottom:32px;
font-size:12px;
font-weight:700;
letter-spacing:.12em;
color:#a5b1b7;
}
.takeaway-item__dot{
position:absolute;
top:16px;
left:38px;
width:13px;
height:13px;
border:3px solid #f3f7f8;
border-radius:50%;
background:#d9344d;
box-shadow:0 0 0 1px rgba(217,52,77,.22);
transform:translateY(0);
}
.takeaway-item:first-of-type .takeaway-item__dot{left:0;}
.takeaway-item__body{
padding-top:28px;
}
.takeaway-item h3{
max-width:260px;
margin:0 0 18px;
font-size:27px;
line-height:1.08;
letter-spacing:-.035em;
font-weight:620;
}
.takeaway-item p{
max-width:265px;
margin:0;
font-size:15.5px;
line-height:1.62;
color:#637781;
}
.takeaway-item:nth-of-type(3) .takeaway-item__dot,
.takeaway-item:nth-of-type(5) .takeaway-item__dot{
background:#ef7384;
}
.takeaway-section__closing{
display:flex;
align-items:center;
gap:24px;
width:min(760px,100%);
margin:22px 0 0 auto;
padding-top:28px;
border-top:1px solid rgba(45,76,90,.12);
}
.takeaway-section__closing span{
flex:0 0 48px;
height:2px;
border-radius:99px;
background:#d9344d;
}
.takeaway-section__closing p{
margin:0;
font-size:18px;
line-height:1.48;
letter-spacing:-.012em;
color:#354a54;
}
/* =========================================================
V90 — Block 4 header becomes a clean vertical composition
========================================================= */
.takeaway-section__head{
display:block !important;
max-width:900px !important;
padding-bottom:64px !important;
}
.takeaway-section__kicker{
display:block !important;
padding-top:0 !important;
margin:0 0 20px !important;
}
.takeaway-section__head h2{
max-width:760px !important;
margin:0 0 28px !important;
}
.takeaway-section__head > p{
max-width:650px !important;
margin:0 !important;
font-size:17px !important;
line-height:1.55 !important;
}
/* Closing thought aligned to the same left edge as the section */
.takeaway-section__closing{
width:min(760px,100%) !important;
margin:22px 0 0 0 !important;
}
/* =========================================================
V91 — Block 4 refinement
========================================================= */
/* Raised rounded grey panel, echoing Block 3 but with its own tone */
.takeaway-section{
position:relative !important;
z-index:3 !important;
margin-top:-28px !important;
padding-top:112px !important;
border-radius:50px 50px 0 0 !important;
box-shadow:
0 -10px 28px rgba(49,81,95,.055),
0 -2px 8px rgba(49,81,95,.035) !important;
}
/* Slightly smaller title and cleaner two-line break */
.takeaway-section__head h2{
max-width:820px !important;
font-size:clamp(50px,4.5vw,68px) !important;
line-height:.96 !important;
letter-spacing:-.05em !important;
margin-bottom:28px !important;
}
.takeaway-section__head > p{
max-width:760px !important;
}
/* Switch this block's accent family away from the red Block 3.
Calm blue-violet keeps continuity with the hero without repeating it. */
.takeaway-section__kicker{
color:#5968c9 !important;
}
.takeaway-map__line{
background:linear-gradient(
90deg,
rgba(89,104,201,.07),
rgba(89,104,201,.42) 15%,
rgba(89,104,201,.42) 85%,
rgba(89,104,201,.07)
) !important;
}
/* Larger markers; number is centered directly over its marker */
.takeaway-item{
padding-top:0 !important;
}
.takeaway-item__num{
position:absolute !important;
top:-9px !important;
left:38px !important;
width:24px !important;
margin:0 !important;
transform:translateX(-50%) !important;
text-align:center !important;
font-size:12px !important;
line-height:1 !important;
color:#7b86ad !important;
}
.takeaway-item:first-of-type .takeaway-item__num{
left:0 !important;
}
.takeaway-item__dot{
top:13px !important;
left:38px !important;
width:22px !important;
height:22px !important;
border:5px solid #f3f7f8 !important;
background:#5968c9 !important;
box-shadow:
0 0 0 1px rgba(89,104,201,.24),
0 5px 16px rgba(89,104,201,.16) !important;
transform:translateX(-50%) !important;
}
.takeaway-item:first-of-type .takeaway-item__dot{
left:0 !important;
}
.takeaway-item:nth-of-type(3) .takeaway-item__dot,
.takeaway-item:nth-of-type(5) .takeaway-item__dot{
background:#7582d8 !important;
}
.takeaway-item__body{
padding-top:72px !important;
}
.takeaway-section__closing span{
background:#5968c9 !important;
}
/* =========================================================
V92 — stronger Block 4 separation + larger lead copy
========================================================= */
/* Lead copy under "Что вы унесёте с собой" */
.takeaway-section__head > p{
max-width:1040px !important;
font-size:35px !important;
line-height:1.22 !important;
letter-spacing:-.025em !important;
color:#465a64 !important;
}
/* Crisper, tighter upper shadow:
less blur than V91, more contrast exactly at the overlap edge */
.takeaway-section{
box-shadow:
0 -1px 0 rgba(42,67,79,.11),
0 -5px 13px rgba(42,67,79,.10),
0 -14px 26px rgba(42,67,79,.045) !important;
}
/* A fine highlight on the rounded edge makes the grey panel read
as a separate physical layer rather than a background transition. */
.takeaway-section::before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
left:50px !important;
right:50px !important;
top:0 !important;
height:1px !important;
background:linear-gradient(
90deg,
transparent,
rgba(255,255,255,.82) 12%,
rgba(255,255,255,.9) 88%,
transparent
) !important;
pointer-events:none !important;
}
.takeaway-section__inner{
position:relative !important;
z-index:1 !important;
}
/* V94 — larger Takeaway timeline markers */
.takeaway-item__dot{
width:34px !important;
height:34px !important;
border-width:5px !important;
}
/* =========================================================
V95 — Block 5: compact ticket CTA
========================================================= */
.mid-cta{
padding:34px 24px 38px;
background:#f3f7f8;
}
.mid-cta__inner{
width:min(1320px,100%);
margin:0 auto;
display:grid;
grid-template-columns:minmax(320px,.82fr) minmax(620px,1.35fr);
gap:54px;
align-items:center;
padding:38px 42px;
border:1px solid rgba(69,91,104,.11);
border-radius:30px;
background:
radial-gradient(circle at 94% 0%,rgba(91,104,201,.10),transparent 30%),
linear-gradient(120deg,rgba(255,255,255,.96),rgba(249,251,252,.92));
box-shadow:0 16px 42px rgba(48,73,86,.055);
}
.mid-cta__kicker{
margin-bottom:12px;
font-size:12px;
line-height:1;
font-weight:750;
letter-spacing:.12em;
text-transform:uppercase;
color:#5968c9;
}
.mid-cta__copy h2{
margin:0 0 10px;
font-size:clamp(34px,3vw,48px);
line-height:.98;
letter-spacing:-.045em;
font-weight:650;
color:#17252c;
}
.mid-cta__copy p{
max-width:440px;
margin:0;
font-size:15px;
line-height:1.5;
color:#687b84;
}
.mid-cta__days{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
}
.mid-cta__day{
position:relative;
display:grid;
grid-template-columns:1fr auto;
grid-template-areas:
"date arrow"
"name arrow";
gap:5px 14px;
align-items:center;
min-height:102px;
padding:20px 18px 19px 21px;
border:1px solid rgba(89,104,201,.14);
border-radius:20px;
background:rgba(255,255,255,.78);
color:#17252c;
text-align:left;
cursor:pointer;
transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.mid-cta__day:hover{
transform:translateY(-3px);
border-color:rgba(89,104,201,.28);
background:#fff;
box-shadow:0 12px 28px rgba(64,78,143,.10);
}
.mid-cta__date{
grid-area:date;
font-size:13px;
line-height:1;
color:#72838b;
}
.mid-cta__date b{
margin-right:3px;
font-size:20px;
font-weight:700;
color:#5968c9;
}
.mid-cta__name{
grid-area:name;
font-size:18px;
line-height:1.1;
font-weight:650;
letter-spacing:-.025em;
}
.mid-cta__arrow{
grid-area:arrow;
display:grid;
place-items:center;
width:34px;
height:34px;
border-radius:50%;
background:#5968c9;
color:#fff;
font-size:18px;
transition:transform .2s ease;
}
.mid-cta__day:hover .mid-cta__arrow{
transform:translateX(2px);
}
/* =========================================================
V96 — Block 5 rebuilt as a compact echo of the Program block
========================================================= */
.mid-cta.mid-cta--program{
padding:72px 24px 82px !important;
background:#fff !important;
}
.mid-cta--program .mid-cta__inner{
display:block !important;
width:min(1320px,100%) !important;
margin:0 auto !important;
padding:52px 54px 54px !important;
border:0 !important;
border-radius:36px !important;
background:
radial-gradient(circle at 8% 0%,rgba(93,158,190,.08),transparent 29%),
radial-gradient(circle at 95% 100%,rgba(207,157,75,.075),transparent 27%),
#f5f8f9 !important;
box-shadow:
inset 0 0 0 1px rgba(57,83,95,.055),
0 18px 46px rgba(45,69,80,.06) !important;
}
.mid-cta--program .mid-cta__head{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:42px;
margin-bottom:34px;
}
.mid-cta--program .mid-cta__kicker{
display:none !important;
}
.mid-cta--program .mid-cta__head h2{
margin:0 !important;
font-size:clamp(42px,4vw,60px) !important;
line-height:.98 !important;
letter-spacing:-.05em !important;
color:#17252c !important;
}
.mid-cta--program .mid-cta__head p{
width:min(410px,100%);
margin:0 0 4px !important;
font-size:17px !important;
line-height:1.48 !important;
color:#657982 !important;
}
.mid-cta--program .mid-cta__days{
display:grid !important;
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
gap:14px !important;
}
.mid-cta--program .mid-cta__day{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
min-height:252px !important;
padding:26px 27px 24px !important;
border-radius:24px !important;
text-align:left !important;
cursor:pointer !important;
overflow:hidden !important;
transition:transform .2s ease,box-shadow .2s ease !important;
}
.mid-cta--program .mid-cta__day--seminar{
border:1px solid rgba(55,132,170,.14) !important;
background:
radial-gradient(circle at 100% 0%,rgba(98,175,211,.12),transparent 34%),
#fff !important;
}
.mid-cta--program .mid-cta__day--retreat{
border:1px solid rgba(194,142,58,.17) !important;
background:
radial-gradient(circle at 100% 0%,rgba(222,177,94,.15),transparent 36%),
#fffdf9 !important;
}
.mid-cta--program .mid-cta__day:hover{
transform:translateY(-4px) !important;
}
.mid-cta--program .mid-cta__day--seminar:hover{
box-shadow:0 16px 34px rgba(46,120,155,.11) !important;
}
.mid-cta--program .mid-cta__day--retreat:hover{
box-shadow:0 16px 34px rgba(163,115,38,.11) !important;
}
.mid-cta--program .mid-cta__date{
display:inline-flex !important;
align-items:baseline !important;
gap:4px !important;
margin-bottom:17px !important;
padding:7px 12px !important;
border-radius:999px !important;
background:#edf6fa !important;
font-size:13px !important;
line-height:1 !important;
color:#56727f !important;
}
.mid-cta--program .mid-cta__day--retreat .mid-cta__date{
background:#fbf1df !important;
color:#806536 !important;
}
.mid-cta--program .mid-cta__date b{
margin:0 !important;
font-size:17px !important;
color:#287ba3 !important;
}
.mid-cta--program .mid-cta__day--retreat .mid-cta__date b{
color:#b27b26 !important;
}
.mid-cta--program .mid-cta__type{
margin-bottom:8px !important;
font-size:11px !important;
line-height:1 !important;
font-weight:750 !important;
letter-spacing:.11em !important;
text-transform:uppercase !important;
color:#7b929c !important;
}
.mid-cta--program .mid-cta__day--retreat .mid-cta__type{
color:#9a7b47 !important;
}
.mid-cta--program .mid-cta__name{
margin-bottom:26px !important;
font-size:24px !important;
line-height:1.08 !important;
font-weight:650 !important;
letter-spacing:-.035em !important;
color:#1b2c34 !important;
}
.mid-cta--program .mid-cta__action{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
width:100% !important;
margin-top:auto !important;
padding-top:18px !important;
border-top:1px solid rgba(46,112,143,.10) !important;
font-size:15px !important;
font-weight:650 !important;
color:#237ba5 !important;
}
.mid-cta--program .mid-cta__day--retreat .mid-cta__action{
border-top-color:rgba(176,125,43,.13) !important;
color:#a46e1e !important;
}
.mid-cta--program .mid-cta__action i{
display:grid !important;
place-items:center !important;
width:31px !important;
height:31px !important;
border-radius:50% !important;
background:#2e8bb7 !important;
color:#fff !important;
font-size:17px !important;
font-style:normal !important;
}
.mid-cta--program .mid-cta__day--retreat .mid-cta__action i{
background:#c58a31 !important;
}
/* =========================================================
V97 — Block 5: clearly separated blue CTA field
========================================================= */
.mid-cta.mid-cta--program{
padding:78px 24px 84px !important;
background:#ffffff !important;
}
.mid-cta--program .mid-cta__inner{
display:block !important;
padding:54px 56px 58px !important;
border:0 !important;
border-radius:42px !important;
background:
radial-gradient(circle at 88% 8%,rgba(106,190,233,.28),transparent 31%),
radial-gradient(circle at 8% 100%,rgba(27,89,168,.32),transparent 32%),
linear-gradient(135deg,#0758b8 0%,#0876d1 52%,#1592dd 100%) !important;
box-shadow:
0 24px 60px rgba(4,72,145,.20),
inset 0 0 0 1px rgba(255,255,255,.13) !important;
}
.mid-cta--program .mid-cta__head{
display:block !important;
margin-bottom:34px !important;
}
.mid-cta--program .mid-cta__head h2{
margin:0 0 12px !important;
color:#fff !important;
font-size:clamp(44px,4.2vw,62px) !important;
}
.mid-cta--program .mid-cta__head p{
width:auto !important;
max-width:none !important;
margin:0 !important;
color:rgba(255,255,255,.82) !important;
font-size:18px !important;
line-height:1.35 !important;
white-space:nowrap !important;
}
.mid-cta--program .mid-cta__days{
gap:14px !important;
}
.mid-cta--program .mid-cta__day--seminar,
.mid-cta--program .mid-cta__day--retreat{
border:1px solid rgba(255,255,255,.38) !important;
background:rgba(255,255,255,.96) !important;
box-shadow:0 12px 28px rgba(0,52,112,.10) !important;
}
.mid-cta--program .mid-cta__day:hover{
background:#fff !important;
box-shadow:0 18px 36px rgba(0,45,100,.18) !important;
}
/* =========================================================
V98 — Block 5 / compact speaker CTA
Full-width section -> dark blue stage -> speaker -> tickets
========================================================= */
.mid-cta.mid-cta--speaker{
position:relative !important;
overflow:hidden !important;
padding:78px 24px 82px !important;
background:
linear-gradient(180deg,#ffffff 0%,#f4f8fa 100%) !important;
}
.mid-cta--speaker .mid-cta__stage{
position:relative !important;
isolation:isolate !important;
width:min(1320px,100%) !important;
min-height:430px !important;
margin:0 auto !important;
padding:52px 48px 38px !important;
overflow:hidden !important;
border-radius:42px !important;
background:
radial-gradient(circle at 53% 12%,rgba(67,180,237,.34),transparent 29%),
radial-gradient(circle at 92% 115%,rgba(52,154,218,.30),transparent 36%),
linear-gradient(125deg,#073b86 0%,#075db5 52%,#0879ca 100%) !important;
box-shadow:
0 28px 65px rgba(8,61,121,.19),
inset 0 0 0 1px rgba(255,255,255,.13) !important;
}
.mid-cta--speaker .mid-cta__stage::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:-2 !important;
opacity:.38 !important;
background:
linear-gradient(112deg,transparent 0 29%,rgba(255,255,255,.08) 29.2%,transparent 29.5%),
linear-gradient(112deg,transparent 0 71%,rgba(255,255,255,.06) 71.2%,transparent 71.5%) !important;
pointer-events:none !important;
}
.mid-cta--speaker .mid-cta__intro{
position:relative !important;
z-index:4 !important;
width:43% !important;
padding:4px 0 210px !important;
}
.mid-cta--speaker .mid-cta__eyebrow{
margin-bottom:18px !important;
font-size:12px !important;
line-height:1.2 !important;
font-weight:700 !important;
letter-spacing:.09em !important;
text-transform:uppercase !important;
color:rgba(255,255,255,.70) !important;
}
.mid-cta--speaker .mid-cta__intro h2{
margin:0 0 17px !important;
font-size:clamp(46px,4.3vw,66px) !important;
line-height:.93 !important;
letter-spacing:-.055em !important;
font-weight:650 !important;
color:#fff !important;
}
.mid-cta--speaker .mid-cta__intro p{
max-width:440px !important;
margin:0 !important;
font-size:17px !important;
line-height:1.45 !important;
color:rgba(255,255,255,.78) !important;
}
.mid-cta--speaker .mid-cta__speaker{
position:absolute !important;
z-index:2 !important;
left:38% !important;
bottom:0 !important;
width:330px !important;
height:420px !important;
pointer-events:none !important;
}
.mid-cta--speaker .mid-cta__speaker-glow{
position:absolute !important;
z-index:-1 !important;
left:50% !important;
bottom:25px !important;
width:330px !important;
height:330px !important;
border-radius:50% !important;
transform:translateX(-50%) !important;
background:rgba(104,205,244,.18) !important;
box-shadow:0 0 0 34px rgba(255,255,255,.035) !important;
}
.mid-cta--speaker .mid-cta__speaker img{
position:absolute !important;
left:50% !important;
bottom:0 !important;
width:auto !important;
height:410px !important;
max-width:none !important;
transform:translateX(-50%) !important;
filter:drop-shadow(0 20px 24px rgba(0,28,70,.20)) !important;
}
.mid-cta--speaker .mid-cta__tickets{
position:absolute !important;
z-index:5 !important;
left:48px !important;
right:48px !important;
bottom:38px !important;
display:grid !important;
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
gap:12px !important;
}
.mid-cta--speaker .mid-cta__ticket{
position:relative !important;
display:grid !important;
grid-template-columns:auto 1fr !important;
grid-template-areas:
"date meta"
"date title"
"action action" !important;
column-gap:17px !important;
align-items:start !important;
min-height:156px !important;
padding:18px 19px 16px !important;
border:1px solid rgba(255,255,255,.58) !important;
border-radius:22px !important;
background:rgba(255,255,255,.965) !important;
box-shadow:
0 14px 30px rgba(0,38,88,.16),
0 2px 7px rgba(0,38,88,.09) !important;
text-align:left !important;
cursor:pointer !important;
transition:transform .2s ease,box-shadow .2s ease !important;
}
.mid-cta--speaker .mid-cta__ticket:hover{
transform:translateY(-4px) !important;
box-shadow:
0 20px 38px rgba(0,38,88,.22),
0 3px 9px rgba(0,38,88,.10) !important;
}
.mid-cta--speaker .mid-cta__ticket-date{
grid-area:date !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
width:62px !important;
height:62px !important;
border-radius:18px !important;
background:#e8f4fa !important;
box-shadow:
inset 0 0 0 1px rgba(35,123,165,.09),
0 6px 14px rgba(28,105,143,.11) !important;
}
.mid-cta--speaker .mid-cta__ticket-date b{
margin:0 !important;
font-size:25px !important;
line-height:.92 !important;
font-weight:720 !important;
color:#1878a7 !important;
}
.mid-cta--speaker .mid-cta__ticket-date span{
margin-top:5px !important;
font-size:10px !important;
line-height:1 !important;
font-weight:650 !important;
color:#557984 !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-date{
background:#fbf0dc !important;
box-shadow:
inset 0 0 0 1px rgba(180,123,35,.10),
0 6px 14px rgba(159,105,24,.11) !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-date b{color:#b77a21 !important;}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-date span{color:#84683b !important;}
.mid-cta--speaker .mid-cta__ticket-meta{
grid-area:meta !important;
padding-top:4px !important;
font-size:12px !important;
line-height:1 !important;
font-weight:750 !important;
letter-spacing:.09em !important;
text-transform:uppercase !important;
color:#7b9099 !important;
}
.mid-cta--speaker .mid-cta__ticket-title{
grid-area:title !important;
align-self:start !important;
margin-top:4px !important;
font-size:17px !important;
line-height:1.12 !important;
font-weight:650 !important;
letter-spacing:-.025em !important;
color:#1b2c34 !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
grid-area:action !important;
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
margin-top:14px !important;
padding-top:11px !important;
border-top:1px solid rgba(41,110,142,.11) !important;
font-size:13px !important;
font-weight:700 !important;
color:#187ca9 !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action{color:#ad7420 !important;}
.mid-cta--speaker .mid-cta__ticket-action i{
font-style:normal !important;
font-size:17px !important;
}
/* =========================================================
V99 — Block 5 becomes the blue section itself.
Rounded overlap + stacked ticket cards + speaker on the right.
========================================================= */
.mid-cta.mid-cta--speaker{
position:relative !important;
z-index:4 !important;
margin-top:-28px !important;
padding:78px 24px 84px !important;
overflow:hidden !important;
border-radius:50px 50px 0 0 !important;
background:
radial-gradient(circle at 76% 5%,rgba(75,187,238,.30),transparent 28%),
radial-gradient(circle at 10% 100%,rgba(21,90,176,.36),transparent 34%),
linear-gradient(125deg,#073b86 0%,#075db5 52%,#0879ca 100%) !important;
box-shadow:
0 -1px 0 rgba(5,47,101,.20),
0 -7px 17px rgba(29,66,91,.15),
0 -18px 32px rgba(29,66,91,.065) !important;
}
/* subtle depth in the full-width section */
.mid-cta.mid-cta--speaker::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
pointer-events:none !important;
background:
linear-gradient(112deg,transparent 0 31%,rgba(255,255,255,.045) 31.2%,transparent 31.5%),
linear-gradient(112deg,transparent 0 73%,rgba(255,255,255,.04) 73.2%,transparent 73.5%) !important;
}
/* The inner stage is no longer a second blue card. */
.mid-cta--speaker .mid-cta__stage{
position:relative !important;
isolation:isolate !important;
width:min(1320px,100%) !important;
min-height:610px !important;
margin:0 auto !important;
padding:0 !important;
overflow:visible !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
}
.mid-cta--speaker .mid-cta__stage::before{
content:none !important;
display:none !important;
}
/* Left column: intro + vertically stacked choices */
.mid-cta--speaker .mid-cta__intro{
position:relative !important;
z-index:5 !important;
width:52% !important;
padding:0 !important;
}
.mid-cta--speaker .mid-cta__eyebrow{
color:rgba(255,255,255,.72) !important;
}
.mid-cta--speaker .mid-cta__intro h2{
font-size:clamp(48px,4.2vw,64px) !important;
}
.mid-cta--speaker .mid-cta__intro p{
max-width:600px !important;
white-space:nowrap !important;
}
.mid-cta--speaker .mid-cta__tickets{
position:relative !important;
z-index:6 !important;
left:auto !important;
right:auto !important;
bottom:auto !important;
display:grid !important;
grid-template-columns:1fr !important;
gap:10px !important;
width:52% !important;
margin-top:32px !important;
}
.mid-cta--speaker .mid-cta__ticket{
min-height:118px !important;
padding:15px 18px 14px !important;
border-radius:20px !important;
grid-template-columns:68px minmax(0,1fr) 126px !important;
grid-template-areas:
"date meta action"
"date title action" !important;
column-gap:17px !important;
align-items:center !important;
box-shadow:
0 14px 30px rgba(0,31,76,.18),
0 2px 7px rgba(0,31,76,.10) !important;
}
.mid-cta--speaker .mid-cta__ticket-date{
width:62px !important;
height:62px !important;
}
.mid-cta--speaker .mid-cta__ticket-meta{
align-self:end !important;
padding:0 0 4px !important;
}
.mid-cta--speaker .mid-cta__ticket-title{
align-self:start !important;
margin:0 !important;
font-size:17px !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
align-self:stretch !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-end !important;
gap:8px !important;
margin:0 !important;
padding:0 0 0 16px !important;
border-top:0 !important;
border-left:1px solid rgba(41,110,142,.11) !important;
text-align:right !important;
}
/* Speaker occupies the whole right half */
.mid-cta--speaker .mid-cta__speaker{
position:absolute !important;
z-index:3 !important;
left:auto !important;
right:0 !important;
bottom:-84px !important;
width:48% !important;
height:650px !important;
pointer-events:none !important;
}
.mid-cta--speaker .mid-cta__speaker img{
left:50% !important;
bottom:0 !important;
height:620px !important;
filter:
drop-shadow(0 24px 30px rgba(0,24,61,.28))
saturate(.94)
contrast(1.035) !important;
}
/* More integrated photographic treatment: cool halo + soft light */
.mid-cta--speaker .mid-cta__speaker-glow{
left:52% !important;
bottom:72px !important;
width:470px !important;
height:470px !important;
background:
radial-gradient(circle,rgba(120,215,249,.25) 0%,rgba(90,194,237,.12) 48%,transparent 70%) !important;
box-shadow:none !important;
}
.mid-cta--speaker .mid-cta__speaker::after{
content:"" !important;
position:absolute !important;
z-index:2 !important;
left:50% !important;
bottom:0 !important;
width:500px !important;
height:150px !important;
transform:translateX(-50%) !important;
background:linear-gradient(180deg,transparent,rgba(5,69,143,.24)) !important;
pointer-events:none !important;
}
/* =========================================================
V100 — CTA copy + generated transparent speaker portrait
========================================================= */
.mid-cta--speaker .mid-cta__intro{
width:55% !important;
}
.mid-cta--speaker .mid-cta__intro h2{
max-width:720px !important;
font-size:clamp(42px,3.65vw,56px) !important;
line-height:.96 !important;
letter-spacing:-.048em !important;
margin-bottom:16px !important;
}
.mid-cta--speaker .mid-cta__intro p{
font-size:17px !important;
color:rgba(255,255,255,.80) !important;
}
.mid-cta--speaker .mid-cta__tickets{
width:55% !important;
}
/* New cutout has a tighter portrait crop, so let it read larger and cleaner. */
.mid-cta--speaker .mid-cta__speaker{
right:-1% !important;
width:45% !important;
}
.mid-cta--speaker .mid-cta__speaker img{
height:625px !important;
filter:
drop-shadow(0 26px 32px rgba(0,24,61,.28))
saturate(.97)
contrast(1.02) !important;
}
.mid-cta--speaker .mid-cta__speaker-glow{
left:54% !important;
width:490px !important;
height:490px !important;
}
/* Make "Купить билет" read more like an action while keeping cards compact. */
.mid-cta--speaker .mid-cta__ticket-action{
font-size:14px !important;
font-weight:750 !important;
}
.mid-cta--speaker .mid-cta__ticket-action i{
display:grid !important;
place-items:center !important;
width:30px !important;
height:30px !important;
border-radius:50% !important;
background:#187ca9 !important;
color:#fff !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action i{
background:#b67a22 !important;
}
/* =========================================================
V101 — integrate portrait via CSS only + real ticket buttons
========================================================= */
/* Make the generated portrait less glossy / less "plastic":
slightly lower saturation and contrast, soften it a touch,
then blend the lower/right edge into the blue environment. */
.mid-cta--speaker .mid-cta__speaker img{
opacity:.94 !important;
filter:
saturate(.82)
contrast(.94)
brightness(.96)
drop-shadow(0 24px 30px rgba(0,25,64,.23)) !important;
}
/* Atmospheric blue light behind the speaker, not a hard halo. */
.mid-cta--speaker .mid-cta__speaker-glow{
width:540px !important;
height:540px !important;
left:52% !important;
bottom:28px !important;
background:
radial-gradient(circle at 48% 38%,
rgba(146,221,250,.24) 0%,
rgba(72,177,229,.15) 35%,
rgba(22,112,188,.08) 56%,
transparent 73%) !important;
filter:blur(8px) !important;
}
/* Blue atmospheric veil over the lower part of the cutout.
It visually seats the portrait inside the section instead of
looking pasted on top of it. */
.mid-cta--speaker .mid-cta__speaker::before{
content:"" !important;
position:absolute !important;
z-index:2 !important;
inset:0 !important;
pointer-events:none !important;
background:
linear-gradient(90deg,
rgba(4,75,151,.10) 0%,
transparent 22%,
transparent 76%,
rgba(4,82,160,.12) 100%),
linear-gradient(180deg,
transparent 0%,
transparent 72%,
rgba(5,77,153,.18) 91%,
rgba(5,73,148,.34) 100%) !important;
}
/* Replace the text-link treatment with an obvious button. */
.mid-cta--speaker .mid-cta__ticket-action{
align-self:center !important;
display:inline-flex !important;
flex-direction:row !important;
align-items:center !important;
justify-content:center !important;
gap:10px !important;
width:auto !important;
min-width:126px !important;
min-height:42px !important;
margin:0 !important;
padding:0 15px !important;
border:0 !important;
border-radius:999px !important;
background:#1685b7 !important;
box-shadow:
0 7px 16px rgba(21,117,160,.20),
inset 0 0 0 1px rgba(255,255,255,.16) !important;
color:#fff !important;
font-size:13px !important;
font-weight:750 !important;
line-height:1 !important;
white-space:nowrap !important;
transition:transform .18s ease,box-shadow .18s ease,background .18s ease !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action{
background:#c48a31 !important;
color:#fff !important;
box-shadow:
0 7px 16px rgba(163,108,28,.20),
inset 0 0 0 1px rgba(255,255,255,.17) !important;
}
.mid-cta--speaker .mid-cta__ticket:hover .mid-cta__ticket-action{
transform:translateY(-1px) !important;
background:#0e78a9 !important;
box-shadow:0 9px 20px rgba(21,117,160,.27) !important;
}
.mid-cta--speaker .mid-cta__ticket--gold:hover .mid-cta__ticket-action{
background:#b97b23 !important;
box-shadow:0 9px 20px rgba(163,108,28,.27) !important;
}
/* Arrow belongs to the button, not a separate round control. */
.mid-cta--speaker .mid-cta__ticket-action i,
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action i{
display:inline !important;
width:auto !important;
height:auto !important;
border-radius:0 !important;
background:none !important;
color:inherit !important;
font-size:17px !important;
line-height:1 !important;
transform:translateY(-1px) !important;
}
/* =========================================================
V102 — portrait integration, card spacing, ticket links,
contextual modal titles
========================================================= */
/* One seamless overlay over the ENTIRE portrait area.
No separate square gradients / no exposed bright elbows. */
.mid-cta--speaker .mid-cta__speaker-glow{
display:none !important;
}
.mid-cta--speaker .mid-cta__speaker::after{
content:none !important;
display:none !important;
}
.mid-cta--speaker .mid-cta__speaker{
overflow:visible !important;
}
.mid-cta--speaker .mid-cta__speaker::before{
content:"" !important;
position:absolute !important;
z-index:2 !important;
inset:-8% -14% -3% -14% !important;
pointer-events:none !important;
border-radius:48% !important;
background:
radial-gradient(ellipse at 51% 43%,
rgba(20,115,193,0) 0%,
rgba(12,94,177,.025) 45%,
rgba(5,78,158,.11) 72%,
rgba(5,72,149,.25) 100%) !important;
filter:blur(18px) !important;
}
.mid-cta--speaker .mid-cta__speaker img{
opacity:.93 !important;
filter:
saturate(.84)
contrast(.95)
brightness(.95)
drop-shadow(0 23px 28px rgba(0,25,64,.22)) !important;
}
/* CTA heading is now a cleaner two-line statement. */
.mid-cta--speaker .mid-cta__intro h2{
max-width:700px !important;
font-size:clamp(44px,3.8vw,58px) !important;
line-height:.96 !important;
}
.mid-cta--speaker .mid-cta__intro p{
font-size:17px !important;
}
/* Larger date tile, with visually equal top/left/bottom breathing room. */
.mid-cta--speaker .mid-cta__ticket{
min-height:126px !important;
grid-template-columns:82px minmax(0,1fr) 145px !important;
padding:14px 16px !important;
column-gap:18px !important;
}
.mid-cta--speaker .mid-cta__ticket-date{
width:78px !important;
height:78px !important;
border-radius:20px !important;
}
.mid-cta--speaker .mid-cta__ticket-date b{
font-size:30px !important;
}
.mid-cta--speaker .mid-cta__ticket-date span{
margin-top:6px !important;
font-size:11px !important;
}
/* Part labels become a clear secondary accent. */
.mid-cta--speaker .mid-cta__ticket-title em{
display:inline !important;
font-style:normal !important;
font-weight:750 !important;
color:#1680ad !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-title em{
color:#ad7420 !important;
}
/* Ticket action goes back to a text link, anchored bottom-right.
The whole white card remains clickable. */
.mid-cta--speaker .mid-cta__ticket-action,
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action{
align-self:end !important;
justify-self:end !important;
display:inline-flex !important;
flex-direction:row !important;
align-items:center !important;
justify-content:flex-end !important;
gap:9px !important;
width:auto !important;
min-width:0 !important;
min-height:0 !important;
margin:0 0 3px !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
color:#075aa9 !important;
font-size:16px !important;
line-height:1 !important;
font-weight:750 !important;
white-space:nowrap !important;
transition:opacity .18s ease,transform .18s ease !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action{
color:#9f691d !important;
}
.mid-cta--speaker .mid-cta__ticket:hover .mid-cta__ticket-action,
.mid-cta--speaker .mid-cta__ticket--gold:hover .mid-cta__ticket-action{
transform:translateX(2px) !important;
background:none !important;
box-shadow:none !important;
opacity:.78 !important;
}
.mid-cta--speaker .mid-cta__ticket-action i,
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action i{
display:inline !important;
width:auto !important;
height:auto !important;
background:none !important;
color:inherit !important;
font-size:18px !important;
}
/* =========================================================
V103 — narrower ticket column + balanced date tile spacing
========================================================= */
.mid-cta--speaker .mid-cta__tickets{
width:48% !important;
}
/* Keep the date square inset equally from the visual card edges. */
.mid-cta--speaker .mid-cta__ticket{
grid-template-columns:82px minmax(0,1fr) 132px !important;
padding:14px 18px 14px 22px !important;
column-gap:18px !important;
}
/* With the narrower card, keep title/action compact and balanced. */
/* .mid-cta--speaker .mid-cta__ticket-title{
font-size:16.5px !important;
} */
.mid-cta--speaker .mid-cta__ticket-title {
font-size: 20.5px !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
margin-right:3px !important;
font-size:15.5px !important;
}
/* =========================================================
V104 — CTA polish + minimal animated portrait decoration
========================================================= */
.mid-cta.mid-cta--speaker{
padding-top:100px !important;
}
/* Minimal animated graphics around Oleg — no hard rectangle. */
.mid-cta--speaker .mid-cta__speaker{
isolation:isolate !important;
}
.mid-cta--speaker .mid-cta__speaker::before{
inset:-10% -16% -5% -16% !important;
border-radius:50% !important;
background:
radial-gradient(ellipse at 52% 46%,
rgba(151,222,249,.13) 0%,
rgba(84,183,229,.07) 35%,
rgba(13,96,178,.025) 58%,
transparent 76%) !important;
filter:blur(22px) !important;
animation:ctaSpeakerAura 7s ease-in-out infinite alternate !important;
}
.mid-cta--speaker .mid-cta__speaker::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:-1 !important;
width:300px !important;
height:300px !important;
right:2% !important;
top:14% !important;
border:1px solid rgba(255,255,255,.16) !important;
border-radius:50% !important;
background:transparent !important;
box-shadow:
0 0 0 48px rgba(255,255,255,.025),
0 0 0 96px rgba(255,255,255,.018) !important;
opacity:.7 !important;
animation:ctaOrbit 14s linear infinite !important;
}
@keyframes ctaSpeakerAura{
from{ transform:translate3d(-7px,4px,0) scale(.98); opacity:.72; }
to{ transform:translate3d(8px,-5px,0) scale(1.035); opacity:1; }
}
@keyframes ctaOrbit{
from{ transform:rotate(0deg) scale(.98); }
50%{ transform:rotate(180deg) scale(1.035); }
to{ transform:rotate(360deg) scale(.98); }
}
/* =========================================================
V105 — audience spacing + takeaway timeline alignment/decor
========================================================= */
/* Block 3: tighten the gap below the heading. */
.audience-section__head{
margin-bottom:30px !important;
}
/* Block 4: center purple markers exactly on the vertical line,
then move the whole marker/line axis 6px to the right. */
.takeaway-list{
--takeaway-axis-shift:6px;
}
.takeaway-list::before{
left:calc(var(--takeaway-axis-left, 17px) + var(--takeaway-axis-shift)) !important;
}
.takeaway-item__dot{
position:absolute !important;
left:calc(var(--takeaway-axis-left, 17px) + var(--takeaway-axis-shift)) !important;
top:50% !important;
transform:translate(-50%,-50%) !important;
margin:0 !important;
}
/* Quiet editorial decoration for the empty upper-right area of Block 4.
Pure CSS: a large soft field + fine concentric guide lines. */
.takeaway-section{
overflow:hidden !important;
}
.takeaway-section::before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
top:54px !important;
right:-105px !important;
width:520px !important;
height:320px !important;
pointer-events:none !important;
background:
radial-gradient(ellipse at center,
rgba(89,104,201,.075) 0%,
rgba(89,104,201,.038) 34%,
rgba(89,104,201,.012) 55%,
transparent 72%) !important;
filter:blur(1px) !important;
}
.takeaway-section::after{
content:"" !important;
position:absolute !important;
z-index:0 !important;
top:72px !important;
right:44px !important;
width:300px !important;
height:210px !important;
pointer-events:none !important;
opacity:.58 !important;
background:
radial-gradient(circle at 50% 50%,
transparent 0 48px,
rgba(89,104,201,.11) 49px 50px,
transparent 51px 82px,
rgba(89,104,201,.075) 83px 84px,
transparent 85px 116px,
rgba(89,104,201,.045) 117px 118px,
transparent 119px) !important;
}
.takeaway-section > *{
position:relative !important;
z-index:1 !important;
}
/* =========================================================
V106 — fix takeaway dots + abstract purple waves + brighter portrait
========================================================= */
/* Block 4: dots belong next to 01/02/03/04, not vertically centered
against the paragraph. Restore their natural top-row position. */
.takeaway-item{
position:relative !important;
}
.takeaway-item__dot{
top:17px !important;
left:23px !important;
transform:translate(-50%,-50%) !important;
margin:0 !important;
}
.takeaway-list::before{
left:23px !important;
}
/* Replace the circular ornament with quiet abstract purple waves. */
.takeaway-section::before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
top:62px !important;
right:-28px !important;
width:430px !important;
height:235px !important;
pointer-events:none !important;
opacity:.50 !important;
filter:none !important;
background:
repeating-radial-gradient(
ellipse at 112% 20%,
transparent 0 23px,
rgba(89,104,201,.13) 24px 25px,
transparent 26px 47px
) !important;
transform:rotate(-7deg) !important;
-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 27%,#000 100%) !important;
mask-image:linear-gradient(90deg,transparent 0%,#000 27%,#000 100%) !important;
}
.takeaway-section::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
top:98px !important;
right:42px !important;
width:310px !important;
height:125px !important;
pointer-events:none !important;
opacity:.36 !important;
border:0 !important;
border-radius:0 !important;
background:
repeating-linear-gradient(
-12deg,
transparent 0 18px,
rgba(89,104,201,.10) 19px 20px,
transparent 21px 37px
) !important;
clip-path:polygon(0 58%,15% 35%,31% 47%,48% 18%,65% 40%,82% 12%,100% 29%,100% 73%,82% 56%,65% 75%,48% 52%,31% 76%,15% 62%,0 82%) !important;
}
/* Block 5: ease the dulling by roughly 10%. */
.mid-cta--speaker .mid-cta__speaker img{
opacity:.96 !important;
filter:
saturate(.88)
contrast(.97)
brightness(1.045)
drop-shadow(0 23px 28px rgba(0,25,64,.22)) !important;
}
/* =========================================================
V107 — clean Block 4 decoration + exact dot placement
========================================================= */
/* Block 4: remove the previous arcs/waves entirely.
Leave only one subtle radial light in the empty upper-right area. */
.takeaway-section::before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
top:18px !important;
right:-80px !important;
width:560px !important;
height:360px !important;
pointer-events:none !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
clip-path:none !important;
-webkit-mask-image:none !important;
mask-image:none !important;
background:
radial-gradient(
ellipse at 58% 42%,
rgba(104,116,205,.095) 0%,
rgba(104,116,205,.050) 28%,
rgba(104,116,205,.020) 48%,
transparent 70%
) !important;
}
.takeaway-section::after{
content:none !important;
display:none !important;
}
/* Put every purple dot directly BELOW its 01/02/03/04 number.
The dot now participates in the item's own flow instead of being
absolutely positioned against differently-sized text blocks. */
.takeaway-item__dot{
position:relative !important;
display:block !important;
top:auto !important;
left:auto !important;
transform:none !important;
margin:9px auto 0 !important;
width:34px !important;
height:34px !important;
flex:0 0 34px !important;
}
/* Keep the vertical guide line centered through the number/dot column. */
.takeaway-list::before{
left:23px !important;
}
/* Ensure the number column keeps a stable width so all dots align. */
.takeaway-item__number{
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:flex-start !important;
min-width:46px !important;
width:46px !important;
}
/* =========================================================
V108 — exact takeaway alignment + visible right-side decor
========================================================= */
/* Exact alignment corrections requested. */
.takeaway-item{
position:static !important;
}
.takeaway-item__dot{
margin:6px auto 0 !important;
}
/* Existing numbered labels use .takeaway-item__num in this layout. */
.takeaway-item__num{
top:-11px !important;
left:54px !important;
}
.takeaway-item:first-of-type .takeaway-item__num{
left:16px !important;
}
/* Stronger but still quiet decoration in the EMPTY UPPER-RIGHT area.
Keep it anchored to the section's right edge. */
.takeaway-section{
position:relative !important;
overflow:hidden !important;
}
.takeaway-section::before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
top:44px !important;
right:0 !important;
left:auto !important;
width:48% !important;
max-width:650px !important;
height:330px !important;
pointer-events:none !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
border-radius:0 !important;
background:
radial-gradient(circle at 76% 36%,
rgba(91,105,201,.15) 0%,
rgba(91,105,201,.075) 28%,
rgba(91,105,201,.025) 49%,
transparent 70%) !important;
}
/* Small editorial marks layered over the light field:
dots, short bars and diamonds — intentionally low contrast. */
.takeaway-section::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
top:90px !important;
right:70px !important;
left:auto !important;
width:390px !important;
height:190px !important;
pointer-events:none !important;
opacity:.50 !important;
border:0 !important;
border-radius:0 !important;
background:
radial-gradient(circle at 12% 25%,rgba(89,104,201,.42) 0 3px,transparent 4px),
radial-gradient(circle at 44% 12%,rgba(89,104,201,.28) 0 2px,transparent 3px),
radial-gradient(circle at 76% 31%,rgba(89,104,201,.35) 0 3px,transparent 4px),
radial-gradient(circle at 91% 67%,rgba(89,104,201,.24) 0 2px,transparent 3px),
linear-gradient(90deg,rgba(89,104,201,.24),rgba(89,104,201,.24)) 22% 61% / 74px 1px no-repeat,
linear-gradient(90deg,rgba(89,104,201,.18),rgba(89,104,201,.18)) 68% 78% / 96px 1px no-repeat,
linear-gradient(45deg,transparent 44%,rgba(89,104,201,.22) 45% 55%,transparent 56%) 52% 48% / 18px 18px no-repeat,
linear-gradient(-45deg,transparent 44%,rgba(89,104,201,.22) 45% 55%,transparent 56%) 52% 48% / 18px 18px no-repeat !important;
}
.takeaway-section > *{
position:relative !important;
z-index:1 !important;
}
/* =========================================================
V109 — rebuild Block 4 timeline from screenshot
========================================================= */
/* Undo the V108 positioning that broke the grid. */
.takeaway-item{
position:relative !important;
margin:0 !important;
padding-top:116px !important;
}
/* Hide the legacy absolutely-positioned numbers; V109 uses a stable
number directly above each marker in each column. */
.takeaway-item__num{
display:none !important;
}
/* Keep the horizontal timeline at one fixed height. */
.takeaway-list{
position:relative !important;
}
.takeaway-list::before{
top:82px !important;
left:0 !important;
right:0 !important;
width:auto !important;
height:1px !important;
transform:none !important;
}
/* Number sits centered over its own dot. */
.takeaway-num-v109{
position:absolute !important;
top:20px !important;
left:50% !important;
transform:translateX(-50%) !important;
display:block !important;
margin:0 !important;
color:#6674c8 !important;
font-size:13px !important;
line-height:1 !important;
font-weight:750 !important;
letter-spacing:.08em !important;
}
/* Dot sits exactly on the horizontal rule. */
.takeaway-item__dot{
position:absolute !important;
top:82px !important;
left:50% !important;
transform:translate(-50%,-50%) !important;
display:block !important;
width:34px !important;
height:34px !important;
margin:0 !important;
z-index:3 !important;
}
/* Text begins a controlled distance below the timeline. */
.takeaway-item h3{
margin-top:0 !important;
}
.takeaway-item p{
margin-bottom:0 !important;
}
/* Clean upper-right decoration: one anchored radial light only.
No dots, crosses, bars or clipped geometry. */
.takeaway-section::before{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:0 !important;
top:0 !important;
right:0 !important;
left:auto !important;
width:52% !important;
max-width:none !important;
height:390px !important;
opacity:1 !important;
pointer-events:none !important;
transform:none !important;
filter:none !important;
clip-path:none !important;
-webkit-mask-image:none !important;
mask-image:none !important;
border-radius:0 !important;
background:
radial-gradient(ellipse at 82% 20%,
rgba(94,111,207,.14) 0%,
rgba(94,111,207,.075) 27%,
rgba(94,111,207,.035) 45%,
rgba(94,111,207,.012) 59%,
transparent 76%) !important;
}
.takeaway-section::after{
content:none !important;
display:none !important;
}
/* =========================================================
V110 — exact manual corrections requested
========================================================= */
/* Remove ALL decorative background from the upper-right of Block 4. */
.takeaway-section::before,
.takeaway-section::after{
content:none !important;
display:none !important;
background:none !important;
}
/* Do not hide the original 01 / 02 / 03 / 04 numbers. */
.takeaway-item__num{
display:block !important;
}
/* Remove the 116px article offset introduced in V109. */
.takeaway-item{
padding-top:0 !important;
}
/* Purple dots: fixed pixel positioning, no percentages. */
.takeaway-item__dot{
top:24px !important;
left:54px !important;
margin:0 !important;
}
.takeaway-item:first-of-type .takeaway-item__dot{
left:16px !important;
}
/* Disable the temporary V109 number system completely. */
.takeaway-num-v109{
display:none !important;
}
/* =========================================================
V111 — Block 6: About Oleg Gennadyevich / editorial
========================================================= */
.about-speaker{
position:relative;
z-index:5;
margin-top:-28px;
padding:96px 24px 108px;
overflow:hidden;
border-radius:50px 50px 0 0;
background:
radial-gradient(circle at 14% 16%,rgba(208,220,238,.44),transparent 31%),
linear-gradient(118deg,#f7f4ee 0%,#fbfaf7 47%,#f2f5f7 100%);
box-shadow:
0 -1px 0 rgba(46,66,75,.08),
0 -8px 22px rgba(35,59,72,.08);
}
.about-speaker__inner{
width:min(1320px,100%);
min-height:650px;
margin:0 auto;
display:grid;
grid-template-columns:minmax(0,.95fr) minmax(480px,1.05fr);
gap:84px;
align-items:center;
}
.about-speaker__visual{
position:relative;
align-self:stretch;
min-height:650px;
display:flex;
align-items:flex-end;
justify-content:center;
}
.about-speaker__photo-field{
position:absolute;
left:4%;
right:4%;
bottom:0;
height:88%;
border-radius:180px 180px 34px 34px;
background:
radial-gradient(circle at 54% 27%,rgba(255,255,255,.88),transparent 35%),
linear-gradient(150deg,rgba(213,224,234,.78),rgba(238,232,223,.62));
border:1px solid rgba(255,255,255,.72);
}
.about-speaker__photo-field::before{
content:"";
position:absolute;
width:310px;
height:310px;
left:-54px;
top:86px;
border:1px solid rgba(83,104,190,.12);
border-radius:50%;
box-shadow:
0 0 0 58px rgba(83,104,190,.035),
0 0 0 116px rgba(83,104,190,.02);
}
.about-speaker__visual img{
position:relative;
z-index:2;
display:block;
max-width:none;
width:auto;
height:625px;
object-fit:contain;
object-position:center bottom;
filter:
saturate(.91)
contrast(.98)
drop-shadow(0 28px 34px rgba(47,66,76,.15));
}
.about-speaker__signature{
position:absolute;
z-index:3;
left:0;
bottom:30px;
min-width:250px;
padding:17px 22px 18px;
border-radius:18px;
background:rgba(255,255,255,.76);
border:1px solid rgba(255,255,255,.88);
box-shadow:0 15px 38px rgba(47,67,77,.10);
backdrop-filter:blur(14px);
}
.about-speaker__signature span{
display:block;
margin-bottom:2px;
color:#75838a;
font-size:13px;
line-height:1.2;
}
.about-speaker__signature strong{
display:block;
color:#18282f;
font-size:22px;
line-height:1.05;
letter-spacing:-.025em;
}
.about-speaker__content{
max-width:650px;
padding:18px 0 10px;
}
.about-speaker__kicker{
margin-bottom:24px;
color:#5968c9;
font-size:13px;
line-height:1;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase;
}
.about-speaker__content h2{
margin:0;
color:#17272e;
font-size:clamp(54px,5vw,76px);
line-height:.93;
letter-spacing:-.055em;
}
.about-speaker__lead{
max-width:610px;
margin:32px 0 0;
color:#52656e;
font-size:23px;
line-height:1.42;
letter-spacing:-.018em;
}
.about-speaker__facts{
margin-top:42px;
border-top:1px solid rgba(66,87,96,.14);
}
.about-speaker__fact{
display:grid;
grid-template-columns:50px 1fr;
gap:14px;
align-items:center;
min-height:68px;
border-bottom:1px solid rgba(66,87,96,.14);
}
.about-speaker__fact span{
color:#6c78ca;
font-size:12px;
font-weight:800;
letter-spacing:.08em;
}
.about-speaker__fact p{
margin:0;
color:#26383f;
font-size:17px;
line-height:1.3;
font-weight:650;
}
.about-speaker__link{
display:inline-flex;
align-items:center;
gap:12px;
margin-top:34px;
color:#3347aa;
font-size:17px;
line-height:1;
font-weight:750;
text-decoration:none;
}
.about-speaker__link span{
font-size:19px;
transition:transform .18s ease;
}
.about-speaker__link:hover span{
transform:translate(3px,-3px);
}
/* V112 — modal scroll recovery */
html:not(.modal-open):not(.no-scroll):not(.is-locked),
body:not(.modal-open):not(.no-scroll):not(.is-locked){
overflow-y:auto;
}
/* =========================================================
V113 — About block: cropped seated portrait + book carousel
========================================================= */
.about-speaker--v113{
background:linear-gradient(118deg,#f7f5f0 0%,#fbfaf7 54%,#f1f5f7 100%) !important;
}
.about-speaker--v113 .about-speaker__inner{
grid-template-columns:minmax(0,.95fr) minmax(470px,1.05fr) !important;
align-items:start !important;
}
.about-speaker__left{
min-width:0;
}
.about-speaker--v113 .about-speaker__visual{
min-height:520px !important;
height:520px !important;
align-self:auto !important;
}
.about-speaker--v113 .about-speaker__photo-field{
left:5% !important;
right:5% !important;
bottom:0 !important;
height:88% !important;
border-radius:150px 150px 34px 34px !important;
}
.about-speaker--v113 .about-speaker__photo-field::before{
content:none !important;
}
.about-speaker--v113 .about-speaker__visual img{
height:505px !important;
max-width:92% !important;
object-fit:contain !important;
object-position:center bottom !important;
filter:saturate(.95) contrast(.99) drop-shadow(0 25px 30px rgba(45,64,74,.14)) !important;
}
.about-speaker--v113 .about-speaker__content{
padding-top:36px !important;
}
/* Books */
.about-books{
margin-top:24px;
}
.about-books__head{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:14px;
}
.about-books__head > span{
color:#6d7b82;
font-size:12px;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
}
.about-books__controls{
display:flex;
gap:7px;
}
.about-books__controls button{
width:34px;
height:34px;
border:1px solid rgba(62,81,90,.14);
border-radius:50%;
background:rgba(255,255,255,.68);
color:#344850;
cursor:pointer;
font-size:16px;
}
.about-books__viewport{
overflow-x:auto;
scrollbar-width:none;
scroll-snap-type:x mandatory;
}
.about-books__viewport::-webkit-scrollbar{display:none}
.about-books__track{
display:flex;
gap:12px;
width:max-content;
}
.about-book{
width:145px;
scroll-snap-align:start;
}
.about-book__cover{
width:145px;
height:190px;
display:flex;
align-items:flex-end;
padding:16px;
border-radius:12px;
background:linear-gradient(145deg,#6273c8,#34479e);
color:#fff;
box-shadow:0 12px 24px rgba(48,62,104,.15);
font-size:15px;
line-height:1.12;
font-weight:800;
letter-spacing:-.02em;
}
.about-book__cover--2{background:linear-gradient(145deg,#d5a75a,#a8752c)}
.about-book__cover--3{background:linear-gradient(145deg,#6f9fa0,#416f75)}
.about-book__cover--4{background:linear-gradient(145deg,#b57975,#7f4c55)}
.about-book > span{
display:block;
margin-top:9px;
color:#61727a;
font-size:12px;
line-height:1.25;
}
/* V114 — Block 6 layout preview */
.about-speaker--v113 .about-speaker__lead{max-width:640px!important;margin-bottom:0!important}
.about-speaker__facts--bio{margin-top:38px!important}
.about-speaker__facts--bio .about-speaker__fact{grid-template-columns:42px minmax(0,1fr)!important;align-items:start!important;min-height:0!important;padding:18px 0 19px!important}
.about-speaker__facts--bio .about-speaker__fact>span{padding-top:4px!important}
.about-speaker__facts--bio .about-speaker__fact strong{display:block;margin:0 0 6px;color:#26383f;font-size:17px;line-height:1.25;font-weight:760;letter-spacing:-.015em}
.about-speaker__facts--bio .about-speaker__fact p{max-width:570px;color:#687980!important;font-size:14px!important;line-height:1.48!important;font-weight:450!important}
.about-books__head{justify-content:flex-start!important}
.about-books__viewport{overflow:hidden!important}
/* V115 — 16 placeholder books + working carousel */
.about-books__head{justify-content:space-between!important}
.about-books__viewport{overflow-x:auto!important;scroll-behavior:smooth!important;scroll-snap-type:x mandatory!important}
.about-books__track{padding-bottom:4px}
.about-book{scroll-snap-align:start}
.about-book__cover--v115-1{background:linear-gradient(145deg,#6273c8,#34479e)!important}
.about-book__cover--v115-2{background:linear-gradient(145deg,#d5a75a,#a8752c)!important}
.about-book__cover--v115-3{background:linear-gradient(145deg,#6f9fa0,#416f75)!important}
.about-book__cover--v115-4{background:linear-gradient(145deg,#b57975,#7f4c55)!important}
.about-book__cover--v115-5{background:linear-gradient(145deg,#6f86a7,#425771)!important}
.about-book__cover--v115-6{background:linear-gradient(145deg,#aa8c69,#765d43)!important}
.about-book__cover--v115-7{background:linear-gradient(145deg,#738b72,#465e49)!important}
.about-book__cover--v115-8{background:linear-gradient(145deg,#917aa4,#614d74)!important}
.about-speaker--v113 .about-speaker__link{line-height:1.25!important}
/* =========================================================
V116 — Real 16 book covers supplied by user
========================================================= */
.about-book{
width:145px !important;
}
.about-book__image{
display:block;
width:145px;
height:242px;
object-fit:cover;
border-radius:12px;
box-shadow:0 12px 24px rgba(48,62,104,.15);
background:#eef1f2;
}
.about-book > span{
min-height:32px;
margin-top:9px !important;
color:#61727a !important;
font-size:12px !important;
line-height:1.28 !important;
}
/* =========================================================
V117 — Block 7 / video + Block 8 / atmosphere
========================================================= */
.meetings-video{
position:relative;
z-index:6;
margin-top:-28px;
padding:108px 24px 118px;
border-radius:50px 50px 0 0;
overflow:hidden;
background:
radial-gradient(circle at 82% 16%,rgba(88,105,200,.16),transparent 31%),
linear-gradient(135deg,#17252c 0%,#20333b 52%,#15252d 100%);
box-shadow:0 -1px 0 rgba(25,42,50,.16),0 -8px 24px rgba(31,52,62,.12);
}
.meetings-video__inner,.meetings-gallery__inner{width:min(1320px,100%);margin:0 auto}
.meetings-video__head{display:grid;grid-template-columns:minmax(0,1fr) 420px;column-gap:80px;align-items:end;margin-bottom:54px}
.meetings-video__kicker,.meetings-gallery__kicker{margin-bottom:22px;font-size:13px;line-height:1;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.meetings-video__kicker{color:#9caae9}
.meetings-video__head h2{grid-column:1;margin:0;color:#fff;font-size:clamp(54px,5vw,76px);line-height:.94;letter-spacing:-.055em}
.meetings-video__head>p{grid-column:2;grid-row:1/3;margin:0 0 7px;color:rgba(234,241,244,.68);font-size:18px;line-height:1.5}
.meetings-video__grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.75fr);gap:20px}
.meetings-video button{appearance:none;border:0;padding:0;background:none;text-align:left;font:inherit;cursor:pointer}
.meetings-video__main,.meetings-video__small{display:block;width:100%}
.meetings-video__media{position:relative;display:block;overflow:hidden;border-radius:28px;background:#31444d}
.meetings-video__main .meetings-video__media{height:510px}
.meetings-video__small .meetings-video__media{height:214px;border-radius:22px}
.meetings-video__scene{position:absolute;inset:0;display:block}
.meetings-video__scene--main{background:radial-gradient(circle at 50% 35%,rgba(255,218,157,.32),transparent 16%),linear-gradient(180deg,rgba(8,20,27,.08),rgba(8,20,27,.58)),linear-gradient(120deg,#73818b,#283b46 58%,#152832)}
.meetings-video__scene--2{background:radial-gradient(circle at 66% 30%,rgba(246,199,137,.30),transparent 18%),linear-gradient(135deg,#5b6970,#263b46 68%)}
.meetings-video__scene--3{background:radial-gradient(circle at 34% 42%,rgba(177,196,226,.22),transparent 22%),linear-gradient(135deg,#314b58,#182a32 70%)}
.meetings-video__scene:after{content:"";position:absolute;left:8%;right:8%;bottom:0;height:30%;opacity:.34;background:repeating-linear-gradient(90deg,transparent 0 7%,rgba(8,16,21,.9) 7.3% 8.5%,transparent 8.8% 13%)}
.meetings-video__play{position:absolute;left:50%;top:50%;width:72px;height:72px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.92);color:#23343d;font-size:21px;box-shadow:0 15px 40px rgba(0,0,0,.20)}
.meetings-video__play--small{width:52px;height:52px;font-size:15px}
.meetings-video__duration{position:absolute;right:18px;bottom:18px;padding:8px 11px;border-radius:10px;background:rgba(11,24,31,.62);color:#fff;font-size:11px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px)}
.meetings-video__caption{display:block;padding:17px 4px 0;color:#fff}
.meetings-video__caption strong{display:block;font-size:19px;line-height:1.2}
.meetings-video__caption>span{display:block;margin-top:5px;color:rgba(232,239,242,.58);font-size:13px}
.meetings-video__side{display:grid;gap:24px}
/* Block 8 overlaps Block 7 with the same rounded-page language */
.meetings-gallery{
position:relative;
z-index:7;
margin-top:-28px;
padding:106px 24px 112px;
border-radius:50px 50px 0 0;
overflow:hidden;
background:#f6f8f8;
box-shadow:0 -1px 0 rgba(43,65,75,.10),0 -8px 22px rgba(31,52,62,.09);
}
.meetings-gallery__head{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:70px;align-items:end;margin-bottom:50px}
.meetings-gallery__kicker{color:#5968c9}
.meetings-gallery__head h2{margin:0;color:#17272e;font-size:clamp(54px,5vw,76px);line-height:.95;letter-spacing:-.055em}
.meetings-gallery__head>p{margin:0 0 7px;color:#687980;font-size:18px;line-height:1.5}
.meetings-gallery__mosaic{display:grid;grid-template-columns:1.35fr .82fr .82fr;grid-template-rows:260px 260px;gap:14px}
.meetings-gallery__photo{position:relative;overflow:hidden;border-radius:24px;background:#dfe6e8}
.meetings-gallery__photo span{position:absolute;left:17px;bottom:15px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.76);color:#4e626b;font-size:11px;font-weight:800;backdrop-filter:blur(8px)}
.meetings-gallery__photo--1{grid-row:1/3;background:linear-gradient(145deg,#a9b9be,#667d86)}
.meetings-gallery__photo--2{background:linear-gradient(145deg,#d6c8b5,#a38b70)}
.meetings-gallery__photo--3{background:linear-gradient(145deg,#aab5c9,#6f7e9a)}
.meetings-gallery__photo--4{background:linear-gradient(145deg,#b8c6bb,#778b7b)}
.meetings-gallery__photo--5{background:linear-gradient(145deg,#d0b7b0,#98736e)}
.meetings-gallery__photo:after{content:"Фото";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.64);font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.meetings-gallery__note{margin:16px 0 0;color:#89969b;font-size:12px}
/* =========================================================
V118 — Block 10 venue + restrained final footer
No additional CTA: ticket actions already appear above.
========================================================= */
.venue-section{
position:relative;
z-index:8;
margin-top:-28px;
padding:110px 24px 118px;
overflow:hidden;
border-radius:50px 50px 0 0;
background:
radial-gradient(circle at 82% 18%,rgba(125,147,220,.15),transparent 28%),
linear-gradient(132deg,#e9eef2 0%,#f5f6f4 47%,#e9eff2 100%);
box-shadow:0 -1px 0 rgba(46,66,75,.10),0 -8px 22px rgba(31,52,62,.08);
}
.venue-section__inner{width:min(1320px,100%);margin:0 auto}
.venue-section__head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:52px}
.venue-section__kicker{margin-bottom:22px;color:#5968c9;font-size:13px;line-height:1;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.venue-section__head h2{margin:0;color:#17272e;font-size:clamp(56px,5vw,78px);line-height:.94;letter-spacing:-.055em}
.venue-section__layout{display:grid;grid-template-columns:220px 330px minmax(0,1fr);min-height:390px;border-radius:30px;overflow:hidden;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.86);box-shadow:0 22px 60px rgba(47,67,77,.08)}
.venue-section__card{display:flex;flex-direction:column;justify-content:center;padding:36px;border-right:1px solid rgba(63,84,94,.10);background:rgba(255,255,255,.45)}
.venue-section__number{color:#273a43;font-size:48px;font-weight:760;line-height:.92;letter-spacing:-.06em}
.venue-section__month{margin-top:8px;color:#64757d;font-size:15px}
.venue-section__time{margin-top:54px;color:#5968c9;font-size:14px;font-weight:760}
.venue-section__place{display:flex;flex-direction:column;justify-content:center;padding:38px 42px}
.venue-section__label{color:#8a989e;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.venue-section__place h3{margin:13px 0 14px;color:#1d3038;font-size:36px;line-height:1;letter-spacing:-.04em}
.venue-section__place p{margin:0;color:#64757d;font-size:17px;line-height:1.55}
.venue-section__place a{display:inline-flex;align-items:center;gap:10px;width:max-content;margin-top:34px;color:#4053b4;font-size:14px;font-weight:760;text-decoration:none}
.venue-section__place a span{font-size:17px}
.venue-section__map{position:relative;overflow:hidden;min-height:390px;background:linear-gradient(145deg,#d8e0e2,#c8d3d7)}
.venue-section__roads{position:absolute;inset:-20%;transform:rotate(-11deg);background:
linear-gradient(90deg,transparent 0 17%,rgba(255,255,255,.82) 17.3% 19%,transparent 19.3% 43%,rgba(255,255,255,.58) 43.3% 44.2%,transparent 44.5% 69%,rgba(255,255,255,.72) 69.4% 71%,transparent 71.3%),
linear-gradient(0deg,transparent 0 23%,rgba(255,255,255,.76) 23.4% 25%,transparent 25.4% 55%,rgba(255,255,255,.62) 55.4% 57%,transparent 57.4% 78%,rgba(255,255,255,.68) 78.4% 80%,transparent 80.4%);
}
.venue-section__map:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 56% 51%,rgba(89,104,201,.14),transparent 23%)}
.venue-section__pin{position:absolute;z-index:2;left:56%;top:49%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center}
.venue-section__pin i{width:22px;height:22px;border:6px solid #5968c9;border-radius:50% 50% 50% 0;background:#fff;transform:rotate(-45deg);box-shadow:0 8px 20px rgba(49,62,127,.24)}
.venue-section__pin span{margin-top:13px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.90);color:#34474f;font-size:12px;font-weight:760;box-shadow:0 8px 20px rgba(48,68,78,.10)}
.venue-section__city{position:absolute;right:18px;bottom:16px;color:rgba(51,73,82,.30);font-size:10px;font-weight:800;letter-spacing:.18em}
/* Footer */
.site-footer{
position:relative;
z-index:9;
margin-top:-28px;
padding:74px 24px 28px;
border-radius:50px 50px 0 0;
background:#15252d;
color:#fff;
/* box-shadow:0 -1px 0 rgba(17,32,39,.22),0 -8px 22px rgba(25,44,53,.11); */
}
.site-footer__inner{width:min(1320px,100%);margin:0 auto;display:grid;grid-template-columns:1.2fr .65fr .8fr;gap:60px;padding-bottom:58px}
.site-footer__brand strong{display:block;font-size:22px;line-height:1.2;letter-spacing:-.025em}
.site-footer__brand span,.site-footer__venue span{display:block;margin-top:8px;color:rgba(231,239,242,.57);font-size:13px;line-height:1.4}
.site-footer__venue span+span{margin-top:3px}
.site-footer__links{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.site-footer__links a{color:rgba(245,248,249,.76);font-size:13px;text-decoration:none}
.site-footer__links a:hover{color:#fff}
.site-footer__bottom{width:min(1320px,calc(100% - 48px));margin:0 auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.10);display:flex;justify-content:space-between;color:rgba(232,239,242,.36);font-size:11px}
/* V119 — real Yandex constructor map */
.venue-section__map--yandex{
min-height:390px!important;
background:#d8e0e2!important;
}
.venue-section__map--yandex:after{content:none!important;display:none!important}
.venue-section__map--yandex>ymaps,
.venue-section__map--yandex>iframe,
.venue-section__map--yandex>div{
width:100%!important;
max-width:none!important;
height:100%!important;
min-height:390px!important;
}
/* =========================================================
V120 — Organizer contact in footer
========================================================= */
.site-footer__inner{
grid-template-columns:1.15fr .58fr .72fr .72fr !important;
gap:48px !important;
}
.site-footer__contact{
display:flex;
flex-direction:column;
align-items:flex-start;
}
.site-footer__contact-label{
margin-bottom:9px;
color:rgba(231,239,242,.42);
font-size:10px;
line-height:1;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
}
.site-footer__contact strong{
margin-bottom:7px;
color:#fff;
font-size:16px;
line-height:1.2;
}
.site-footer__contact a{
margin-top:5px;
color:rgba(245,248,249,.76);
font-size:13px;
line-height:1.35;
text-decoration:none;
}
.site-footer__contact a:hover{color:#fff}
/* V121 — organizer portrait */
.site-footer__inner{grid-template-columns:1.05fr .48fr 1.08fr .62fr!important;gap:44px!important}
.site-footer__contact--person{display:grid!important;grid-template-columns:82px minmax(0,1fr);gap:17px;align-items:center!important}
.site-footer__contact-photo{display:block;width:82px;height:82px;object-fit:cover;object-position:center 24%;border-radius:22px;border:1px solid rgba(255,255,255,.13);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.site-footer__contact-info{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.site-footer__contact--person .site-footer__contact-label{margin-bottom:8px;font-size:9px;line-height:1.25}
.site-footer__contact--person strong{margin-bottom:5px;font-size:17px}
.site-footer__contact--person a{margin-top:4px;white-space:nowrap}
/* =========================================================
V122 — venue hierarchy + contact moved out of footer
========================================================= */
.venue-section__head--v122{
display:block!important;
margin-bottom:48px!important;
text-align:left!important;
}
.venue-section__head--v122 .venue-section__kicker{
margin:0 0 20px!important;
}
.venue-section__head--v122 h2{
margin:0!important;
max-width:1050px;
}
.venue-section__layout--v122{
display:grid!important;
grid-template-columns:430px minmax(0,1fr)!important;
min-height:400px!important;
overflow:hidden!important;
}
.venue-section__details{
display:grid;
grid-template-rows:auto 1fr;
gap:0;
min-width:0;
background:rgba(255,255,255,.70);
}
.venue-section__datebar{
display:flex;
align-items:center;
justify-content:space-between;
gap:22px;
padding:29px 34px;
border-bottom:1px solid rgba(63,84,94,.10);
}
.venue-section__datebar strong{
color:#273a43;
font-size:25px;
line-height:1;
letter-spacing:-.035em;
}
.venue-section__datebar span{
color:#5968c9;
font-size:14px;
font-weight:760;
white-space:nowrap;
}
.venue-section__placebar{
display:flex;
flex-direction:column;
justify-content:center;
padding:40px 34px 44px;
}
.venue-section__placebar h3{
margin:13px 0 12px;
color:#1d3038;
font-size:40px;
line-height:1;
letter-spacing:-.045em;
}
.venue-section__placebar p{
margin:0;
color:#64757d;
font-size:17px;
line-height:1.5;
}
.venue-section__layout--v122 .venue-section__map{
min-height:400px!important;
}
.venue-contact{
display:flex;
align-items:center;
gap:24px;
width:max-content;
max-width:100%;
margin-top:30px;
padding:16px 25px 16px 16px;
border:1px solid rgba(255,255,255,.92);
border-radius:28px;
background:rgba(255,255,255,.64);
box-shadow:0 14px 40px rgba(47,67,77,.07);
backdrop-filter:blur(12px);
}
.venue-contact img{
width:112px;
height:112px;
flex:0 0 112px;
object-fit:cover;
object-position:center 24%;
border-radius:22px;
}
.venue-contact__copy{
display:flex;
flex-direction:column;
align-items:flex-start;
}
.venue-contact__copy>span{
margin-bottom:7px;
color:#7c8c93;
font-size:10px;
line-height:1;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
}
.venue-contact__copy>strong{
color:#1d3038;
font-size:23px;
line-height:1.15;
letter-spacing:-.025em;
}
.venue-contact__links{
display:flex;
gap:20px;
margin-top:11px;
}
.venue-contact__links a{
color:#4053b4;
font-size:13px;
font-weight:720;
text-decoration:none;
}
.site-footer__inner{
grid-template-columns:1.2fr .65fr .8fr!important;
gap:60px!important;
}
/* V123 */
.meetings-video__grid--rutube .meetings-video__embed{position:relative;width:100%;overflow:hidden;border-radius:28px;background:#0d171c;aspect-ratio:16/9}
.meetings-video__grid--rutube .meetings-video__small .meetings-video__embed{border-radius:22px}
.meetings-video__grid--rutube iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.meetings-video__grid--rutube .meetings-video__caption{padding-top:17px}
.meetings-video__grid--rutube .meetings-video__side{align-content:start}
.venue-contact{gap:28px!important;margin-top:34px!important;padding:20px 32px 20px 20px!important;border-radius:30px!important}
.venue-contact img{width:132px!important;height:132px!important;flex-basis:132px!important;border-radius:24px!important}
.venue-contact__copy>strong{font-size:25px!important}
.venue-contact__links{align-items:flex-start!important;gap:24px!important;margin-top:13px!important}
.venue-contact__telegram{display:flex!important;flex-direction:column;gap:3px;line-height:1.25!important}
.venue-contact__telegram span{color:#7c8c93;font-size:11px;font-weight:650}
.venue-contact__telegram strong{color:#4053b4;font-size:13px;font-weight:760}
/* V124 finishing corrections */
.meetings-gallery{margin-top:-33px!important}
.venue-contact{min-width:490px!important;gap:30px!important;padding:22px 36px 22px 22px!important}
.venue-contact img{width:140px!important;height:140px!important;flex-basis:140px!important}
.venue-contact__copy{justify-content:center!important;min-width:255px!important}
.venue-contact__links--v124{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:8px!important;margin-top:14px!important}
.venue-contact__links--v124 .venue-contact__phone{display:block!important}
.venue-contact__links--v124 .venue-contact__telegram{display:flex!important;flex-direction:row!important;gap:5px!important;align-items:baseline!important}
/* =========================================================
V125 — HERO responsive pass
Control widths: 1200 / 1024 / 900 / 768 / 600 / 480 / 390 / 340
Only the first screen is changed in this version.
========================================================= */
/* compact desktop: 1200 */
/* tablet landscape / narrow laptop: 1024 */
/* intermediate tablet: 900 */
/* tablet portrait: switch to a deliberate single-column hero */
/* large mobile */
/* main phone */
/* @media (max-width:480px){
.hero__container{padding:34px 18px 26px!important}
.hero h1{font-size:clamp(46px,12.8vw,58px)!important}
.hero__format{font-size:13.5px!important}
.hero__format-heading{font-weight:600!important}
.hero__button{min-height:62px!important}
.hero__button b{width:42px!important;height:42px!important;font-size:23px!important}
} */
/* @media (max-width:480px){
.hero h1{
max-width:77%!important;
}
.hero__portrait{
top:88px!important;
right:-38px!important;
width:48%!important;
height:295px!important;
}
.hero__portrait:before{
width:168px!important;
height:220px!important;
}
.hero__format{
margin-top:34px!important;
}
} */
/* small phone */
/* minimum supported width */
/* =========================================================
V126 — keep Oleg visible on the mobile hero
Portrait sits carefully to the right of the headline.
========================================================= */
/* @media (max-width:600px){
.hero h1{
max-width:76%!important;
}
.hero__portrait{
top:94px!important;
right:-36px!important;
width:46%!important;
height:330px!important;
}
.hero__portrait:before{
width:190px!important;
height:245px!important;
right:-15px!important;
}
.hero__format{
margin-top:38px!important;
}
} */
/* @media (max-width:390px){
.hero h1{
max-width:76%!important;
}
.hero__portrait{
top:84px!important;
right:-40px!important;
width:50%!important;
height:270px!important;
}
.hero__portrait:before{
width:150px!important;
height:205px!important;
}
.hero__format{
margin-top:32px!important;
}
} */
/* true minimum target: 320px */
/* @media (max-width:320px){
.hero h1{
max-width:77%!important;
font-size:40px!important;
}
.hero__portrait{
top:82px!important;
right:-38px!important;
width:51%!important;
height:238px!important;
}
.hero__portrait:before{
width:135px!important;
height:180px!important;
}
.hero__format{
margin-top:28px!important;
}
} */
/* V127 — from 600px down H1 wraps naturally, without forced BRs */
/* V128 — true BR-free H1 from 600px down */
.hero-title-mobile{display:none}
.hero-title-desktop{display:inline}
/* V129 — exact mobile title composition */
/* V130 — exact 3-row mobile H1, no BR tags */
/* V131 — real photos in “Атмосфера встреч” */
.meetings-gallery__photo{
background:#dfe6e8!important;
}
.meetings-gallery__photo:after{
content:none!important;
display:none!important;
}
.meetings-gallery__photo img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.meetings-gallery__photo--1 img{object-position:center center}
.meetings-gallery__photo--2 img{object-position:center center}
.meetings-gallery__photo--3 img{object-position:center center}
.meetings-gallery__photo--4 img{object-position:center center}
.meetings-gallery__photo--5 img{object-position:center center}
/* =========================================================
V133 — venue: building + event details, no map
Existing section container and “Встречаемся в Новосибирске” heading preserved.
========================================================= */
.venue-section__layout--v133{
display:grid!important;
grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr)!important;
min-height:520px!important;
overflow:hidden!important;
border-radius:34px!important;
background:rgba(255,255,255,.72)!important;
border:1px solid rgba(255,255,255,.9)!important;
box-shadow:0 20px 60px rgba(47,67,77,.08)!important;
}
.venue-section__layout--v133 .venue-section__building-photo{
min-width:0;
min-height:520px;
overflow:hidden;
background:#e7eaeb;
}
.venue-section__layout--v133 .venue-section__building-photo img{
display:block;
width:100%;
height:100%;
min-height:520px;
object-fit:cover;
object-position:center center;
}
.venue-section__info-v133{
display:flex;
flex-direction:column;
justify-content:center;
padding:52px 54px;
background:rgba(255,255,255,.72);
}
.venue-section__date-v133{
margin-bottom:20px;
color:#5968c9;
font-size:17px;
line-height:1.2;
font-weight:800;
letter-spacing:.015em;
}
.venue-section__seminar-v133{
max-width:420px;
margin-bottom:42px;
color:#273a43;
font-size:22px;
line-height:1.35;
font-weight:650;
letter-spacing:-.02em;
}
.venue-section__place-label-v133{
width:max-content;
margin-bottom:24px;
padding:11px 18px;
border:1px solid rgba(89,104,201,.28);
border-radius:999px;
color:#5968c9;
font-size:11px;
line-height:1;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
}
.venue-section__address-v133{
color:#1d3038;
font-size:38px;
line-height:1.12;
font-weight:560;
letter-spacing:-.045em;
}
.venue-section__hall-v133{
margin-top:14px;
color:#7b898e;
font-size:23px;
line-height:1.2;
font-weight:650;
}
/* V134 — organizer moved into footer below brand */
.site-footer__inner{
align-items:flex-start!important;
}
.site-footer__contact{
margin-top:26px!important;
min-width:0!important;
width:max-content!important;
max-width:100%!important;
padding:14px 20px 14px 14px!important;
gap:18px!important;
border-color:rgba(255,255,255,.12)!important;
background:rgba(255,255,255,.055)!important;
box-shadow:none!important;
}
.site-footer__contact img{
width:92px!important;
height:92px!important;
flex-basis:92px!important;
border-radius:19px!important;
}
.site-footer__contact .venue-contact__copy>span{color:rgba(255,255,255,.48)!important}
.site-footer__contact .venue-contact__copy>strong{color:#fff!important;font-size:21px!important}
.site-footer__contact .venue-contact__links a,
.site-footer__contact .venue-contact__telegram strong{color:#b9c3ff!important}
.site-footer__contact .venue-contact__telegram span{color:rgba(255,255,255,.46)!important}
/* V135 — footer rebuilt as one clean left column */
.site-footer__inner--v135{
display:flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:flex-start!important;
gap:0!important;
}
.site-footer__inner--v135 .site-footer__brand{
width:100%!important;
max-width:none!important;
}
.site-footer__inner--v135 .site-footer__contact{
align-self:flex-start!important;
margin:30px 0 0!important;
width:auto!important;
min-width:430px!important;
max-width:100%!important;
padding:16px 24px 16px 16px!important;
gap:21px!important;
}
.site-footer__inner--v135 .site-footer__contact img{
width:104px!important;
height:104px!important;
flex:0 0 104px!important;
}
/* =========================================================
V136 — completely redesigned footer
========================================================= */
.site-footer--v136{
position:relative;
margin:0!important;
padding:0!important;
border-radius:0!important;
background:#edf1f0!important;
/* overflow:hidden; */
}
.site-footer--v136:before{
content:"";
position:absolute;
width:560px;
height:560px;
right:-170px;
top:-270px;
border-radius:50%;
background:radial-gradient(circle,rgba(104,119,213,.18),rgba(104,119,213,0) 68%);
pointer-events:none;
}
.site-footer-v136__shell{
position:relative;
max-width:100%;
margin:0 auto;
overflow:hidden;
border-top-left-radius: 50px;
border-top-right-radius: 50px;
background:#17262c;
color:#fff;
}
.site-footer-v136__top{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
min-height:410px;
}
.site-footer-v136__event{
display:flex;
flex-direction:column;
justify-content:center;
padding:66px 70px 62px;
}
.site-footer-v136__eyebrow{
margin-bottom:28px;
color:#aeb8ff;
font-size:12px;
line-height:1;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
}
.site-footer-v136__event>strong{
max-width:650px;
color:#fff;
font-size:58px;
line-height:.94;
font-weight:570;
letter-spacing:-.055em;
}
.site-footer-v136__speaker{
margin-top:28px;
color:rgba(255,255,255,.58);
font-size:17px;
line-height:1.4;
}
.site-footer-v136__organizer{
display:flex;
flex-direction:column;
justify-content:center;
margin:20px;
padding:42px;
border-radius:30px;
background: radial-gradient(circle at 82% 18%,rgba(125,147,220,.15),transparent 28%),
linear-gradient(132deg,#e9eef2 0%,#f5f6f4 47%,#e9eff2 100%);
color:#1d3038;
}
.site-footer-v136__organizer-head{
display:flex;
align-items:center;
gap:18px;
margin-bottom:30px;
color:#7b8584;
font-size:14px;
line-height:1;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase;
}
.site-footer-v136__line{
height:1px;
flex:1;
background:rgba(43,61,68,.12);
}
.site-footer-v136__person{
display:flex;
align-items:center;
gap:27px;
}
.site-footer-v136__person img{
width:132px;
height:132px;
flex:0 0 132px;
object-fit:cover;
object-position:center 24%;
border-radius:50%;
}
.site-footer-v136__person-copy{
min-width:0;
display:flex;
flex-direction:column;
align-items:flex-start;
}
.site-footer-v136__person-copy>strong{
color:#1d3038;
font-size:29px;
line-height:1.08;
letter-spacing:-.035em;
}
.site-footer-v136__person-copy>span{
margin-top:7px;
color:#7b898e;
font-size:14px;
}
.site-footer-v136__contacts{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:9px;
margin-top:24px;
}
.site-footer-v136__contacts a{
color:#4f60be;
font-size:15px;
line-height:1.3;
font-weight:720;
text-decoration:none;
}
.site-footer-v136__contacts a:hover{opacity:.72}
.site-footer-v136__bottom{
display:flex;
justify-content:space-between;
gap:24px;
padding:20px 70px 22px;
border-top:1px solid rgba(255,255,255,.08);
color:rgba(255,255,255,.38);
font-size:11px;
line-height:1.3;
letter-spacing:.04em;
}
/* V137 — interior of DK Popova under venue card */
.venue-section__hall-photo{
position:relative;
width:100%;
height:390px;
margin:22px 0 0;
overflow:hidden;
border-radius:32px;
background:#e8ecec;
box-shadow:0 18px 48px rgba(47,67,77,.07);
}
.venue-section__hall-photo img{
display:block;
width:100%;
height:100%;
object-fit:cover;
object-position:center 54%;
}
.venue-section__hall-photo figcaption{
position:absolute;
left:22px;
bottom:20px;
margin:0;
padding:10px 15px;
border:1px solid rgba(255,255,255,.28);
border-radius:999px;
background:rgba(20,34,39,.62);
color:#fff;
font-size:12px;
line-height:1;
font-weight:700;
letter-spacing:.025em;
backdrop-filter:blur(12px);
}
/* V138 — two hall photos, less cropping */
.venue-section__hall-gallery{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
margin-top:22px;
}
.venue-section__hall-gallery .venue-section__hall-photo{
height:auto!important;
aspect-ratio:1.5 / 1;
margin:0!important;
border-radius:28px;
}
.venue-section__hall-gallery .venue-section__hall-photo img{
object-fit:cover;
object-position:center center;
}
/* =========================================================
V139 — lighter editorial Blocks 3 + 4
========================================================= */
.audience-section--v139{padding:90px 22px 126px!important;background:#fff!important}
.audience-section--v139 .audience-section__inner{max-width:1400px;margin:0 auto}
.audience-v139__head{display:block;grid-template-columns:.72fr 1.55fr;gap:60px;align-items:start;margin-bottom:64px}
.audience-v139__head h2{margin:0;color:#20343c;font-size:50px;line-height:1;font-weight:540;letter-spacing:-.055em}
.audience-v139__head h2 em{color:#2385dd;font-style:normal}
.audience-v139__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.audience-v139__card{position:relative;min-height:260px;padding:34px 36px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;border-radius:30px;background:#fff;border:1px solid rgba(48,68,76,.07)}
.audience-v139__card:before{content:"";position:absolute;right:-45px;top:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(35,133,221,.13),rgba(35,133,221,0) 70%)}
.audience-v139__card--2:before,.audience-v139__card--3:before{right:auto;left:-55px;top:auto;bottom:-80px;background:radial-gradient(circle,rgba(89,104,201,.12),rgba(89,104,201,0) 70%)}
.audience-v139__card>span{color:#87979d;font-size:11px;font-weight:800;letter-spacing:.12em}
.audience-v139__card div{position:relative;max-width:510px}
.audience-v139__card h3{margin:0;color:#21353d;font-size:29px;line-height:1.08;font-weight:610;letter-spacing:-.035em}
.audience-v139__card p{margin:13px 0 0;max-width:430px;color:#718087;font-size:15px;line-height:1.55}
.takeaway-section--v139{padding:0 22px 128px!important;background:#f5f6f2!important}
.takeaway-v139__inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:.8fr 1.05fr .9fr;gap:18px;align-items:stretch}
.takeaway-v139__title,.takeaway-v139__results{padding:48px 44px;border-radius:34px;background:#1b3038;color:#fff}
.takeaway-v139__title{display:flex;flex-direction:column;justify-content:center}
.takeaway-v139__title .takeaway-section__kicker{color:#aeb8ff!important}
.takeaway-v139__title h2{margin:24px 0 26px;color:#fff;font-size:58px;line-height:.94;font-weight:540;letter-spacing:-.055em}
.takeaway-v139__title h2 em{color:#8ea1ff;font-style:normal}
.takeaway-v139__title>p{margin:0;max-width:340px;color:rgba(255,255,255,.58);font-size:15px;line-height:1.6}
.takeaway-v139__visual{position:relative;min-height:570px;overflow:hidden;border-radius:34px;background:linear-gradient(145deg,#dbe4e7,#eef1ed)}
.takeaway-v139__visual img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:auto;height:94%;max-width:none;object-fit:contain}
.takeaway-v139__quote{position:absolute;left:22px;right:22px;bottom:22px;padding:17px 19px;border-radius:20px;background:rgba(255,255,255,.76);backdrop-filter:blur(13px);color:#2a3d44;font-size:14px;line-height:1.45;font-weight:620}
.takeaway-v139__results{display:flex;flex-direction:column;justify-content:center;padding-top:30px;padding-bottom:30px;background:#e9edf0;color:#20343c}
.takeaway-v139__results article{display:grid;grid-template-columns:38px 1fr;gap:15px;padding:24px 0;border-bottom:1px solid rgba(39,59,67,.11)}
.takeaway-v139__results article:last-child{border-bottom:0}
.takeaway-v139__results article>span{padding-top:4px;color:#5968c9;font-size:10px;font-weight:850;letter-spacing:.1em}
.takeaway-v139__results h3{margin:0;color:#20343c;font-size:25px;line-height:1.05;letter-spacing:-.03em}
.takeaway-v139__results p{margin:7px 0 0;color:#718087;font-size:13px;line-height:1.45}
/* =========================================================
V140 — Block 4: title card + auto stories
========================================================= */
.takeaway-section--v140{
padding:0 22px 128px!important;
background: none !important;
box-shadow: none !important;
}
.takeaway-v140__inner{
max-width:1400px;
margin:0 auto;
display:grid;
grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr);
gap:18px;
align-items:stretch;
}
.takeaway-v140__inner>.takeaway-v139__title{
min-height:570px;
}
.takeaway-stories{
position:relative;
min-height:570px;
overflow:hidden;
border-radius:34px;
background:#eef2f4;
border:1px solid rgba(50,70,78,.06);
}
.takeaway-stories__progress{
position:absolute;
z-index:5;
left:38px;
right:38px;
top:36px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:9px;
}
.takeaway-stories__progress span{
height:3px;
overflow:hidden;
border-radius:999px;
background:rgba(67,84,94,.13);
}
.takeaway-stories__progress i{
display:block;
width:100%;
height:100%;
transform:scaleX(0);
transform-origin:left center;
border-radius:inherit;
background:#5968c9;
}
@keyframes takeawayStoryProgress{
from{transform:scaleX(0)}
to{transform:scaleX(1)}
}
.takeaway-stories__slides{
position:relative;
height:100%;
min-height:570px;
}
.takeaway-story{
position:absolute;
inset:0;
display:flex;
flex-direction:column;
justify-content:space-between;
padding:90px 62px 58px;
opacity:0;
visibility:hidden;
transform:translateX(24px);
transition:opacity .38s ease,transform .38s ease,visibility .38s;
}
.takeaway-story.is-active{
opacity:1;
visibility:visible;
transform:translateX(0);
}
.takeaway-story__num{
color:#6978cf;
font-size:13px;
line-height:1;
font-weight:850;
letter-spacing:.13em;
}
.takeaway-story>div{
max-width:680px;
}
.takeaway-story h3{
margin:0;
color:#1c2d34;
font-size:56px;
line-height:.98;
font-weight:590;
letter-spacing:-.055em;
}
.takeaway-story p{
max-width:610px;
margin:26px 0 0;
color:#667981;
font-size:19px;
line-height:1.55;
}
.takeaway-stories__nav{
position:absolute;
z-index:4;
top:70px;
bottom:0;
width:25%;
border:0;
background:transparent;
cursor:pointer;
}
.takeaway-stories__nav--prev{left:0}
.takeaway-stories__nav--next{right:0}
/* =========================================================
V141 — visual identities for the 4 story slides
========================================================= */
.takeaway-stories{
background:#eef2f4!important;
}
.takeaway-story{
overflow:hidden;
isolation:isolate;
}
.takeaway-story:before{
content:"";
position:absolute;
inset:0;
z-index:-3;
opacity:0;
transition:opacity .45s ease;
}
.takeaway-story.is-active:before{opacity:1}
.takeaway-story--1:before{
background:
radial-gradient(circle at 82% 24%,rgba(86,105,213,.22),transparent 28%),
linear-gradient(135deg,#f3f5f7 0%,#e9eef7 100%);
}
.takeaway-story--2:before{
background:
radial-gradient(circle at 80% 23%,rgba(223,177,101,.26),transparent 28%),
linear-gradient(135deg,#f6f4ef 0%,#eef0e9 100%);
}
.takeaway-story--3:before{
background:
radial-gradient(circle at 82% 24%,rgba(83,153,145,.22),transparent 29%),
linear-gradient(135deg,#f1f5f3 0%,#e6efed 100%);
}
.takeaway-story--4:before{
background:
radial-gradient(circle at 81% 24%,rgba(145,108,176,.20),transparent 29%),
linear-gradient(135deg,#f5f2f6 0%,#ebeaf1 100%);
}
.takeaway-story--1 h3{color:#465bc2!important}
.takeaway-story--2 h3{color:#9a6c2f!important}
.takeaway-story--3 h3{color:#327a72!important}
.takeaway-story--4 h3{color:#70558b!important}
.takeaway-story__visual{
position:absolute;
z-index:-1;
right:34px;
top:82px;
width:245px;
height:190px;
pointer-events:none;
opacity:.9;
}
.takeaway-story__orb{
position:absolute;right:15px;top:4px;width:128px;height:128px;border-radius:50%;
border:1px solid rgba(70,91,194,.20);background:rgba(255,255,255,.28)
}
.takeaway-story__path{
position:absolute;left:14px;right:18px;top:94px;height:1px;
background:linear-gradient(90deg,transparent,rgba(70,91,194,.48))
}
.takeaway-story__dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#5968c9;box-shadow:0 0 0 7px rgba(89,104,201,.10)}
.takeaway-story__dot--a{left:38px;top:88px}.takeaway-story__dot--b{left:105px;top:88px}.takeaway-story__dot--c{right:48px;top:88px}
.takeaway-story__sun{
position:absolute;right:56px;top:38px;width:68px;height:68px;border-radius:50%;
background:rgba(184,132,61,.24);box-shadow:0 0 0 16px rgba(184,132,61,.07)
}
.takeaway-story__ring{position:absolute;border:1px solid rgba(154,108,47,.19);border-radius:50%}
.takeaway-story__ring--1{width:142px;height:142px;right:19px;top:1px}
.takeaway-story__ring--2{width:190px;height:190px;right:-5px;top:-23px}
.takeaway-story__step{position:absolute;bottom:20px;width:42px;border-radius:8px 8px 0 0;background:rgba(50,122,114,.15);border-top:2px solid rgba(50,122,114,.48)}
.takeaway-story__step--1{height:34px;left:28px}.takeaway-story__step--2{height:62px;left:80px}.takeaway-story__step--3{height:96px;left:132px}.takeaway-story__step--4{height:132px;left:184px}
.takeaway-story__horizon{position:absolute;left:12px;right:12px;top:102px;height:1px;background:rgba(112,85,139,.30)}
.takeaway-story__arc{position:absolute;border:1px solid rgba(112,85,139,.22);border-radius:50%}
.takeaway-story__arc--1{width:160px;height:160px;right:25px;top:22px}
.takeaway-story__arc--2{width:104px;height:104px;right:53px;top:50px;background:rgba(112,85,139,.055)}
.takeaway-story__num{
width:max-content;
padding:8px 11px;
border-radius:999px;
background:rgba(255,255,255,.56);
border:1px solid rgba(255,255,255,.74);
backdrop-filter:blur(8px);
}
.takeaway-story--1 .takeaway-story__num{color:#465bc2}
.takeaway-story--2 .takeaway-story__num{color:#9a6c2f}
.takeaway-story--3 .takeaway-story__num{color:#327a72}
.takeaway-story--4 .takeaway-story__num{color:#70558b}
/* =========================================================
V142 — rebuilt story infographics with stable inline SVG
========================================================= */
.takeaway-story__visual{
right:34px!important;
top:78px!important;
width:280px!important;
height:190px!important;
opacity:1!important;
transform:none!important;
}
.takeaway-story__visual svg{
display:block;
width:100%;
height:100%;
overflow:visible;
}
.takeaway-story__visual .iv-soft,
.takeaway-story__visual .iv-ring,
.takeaway-story__visual .iv-rays,
.takeaway-story__visual .iv-stairs,
.takeaway-story__visual .iv-arrow,
.takeaway-story__visual .iv-horizon,
.takeaway-story__visual .iv-view{
fill:none;
stroke:currentColor;
stroke-width:2;
stroke-linecap:round;
stroke-linejoin:round;
}
.takeaway-story__visual .iv-soft,
.takeaway-story__visual .iv-ring,
.takeaway-story__visual .iv-horizon,
.takeaway-story__visual .iv-view{opacity:.28}
.takeaway-story__visual .iv-rays,
.takeaway-story__visual .iv-stairs,
.takeaway-story__visual .iv-arrow{opacity:.58}
.takeaway-story__visual .iv-fill{fill:currentColor}
.takeaway-story__visual .iv-halo{
fill:currentColor;
opacity:.10;
stroke:currentColor;
stroke-width:1.5;
}
.takeaway-story__visual .iv-target{
fill:none;
stroke:currentColor;
stroke-width:1.5;
opacity:.25;
}
.takeaway-story__visual .iv-sun{fill:currentColor;opacity:.18}
.takeaway-story__visual--goals{color:#465bc2}
.takeaway-story__visual--happiness{color:#9a6c2f}
.takeaway-story__visual--steps{color:#327a72}
.takeaway-story__visual--perspective{color:#70558b}
/* Neutralize the obsolete span primitives from V141. */
.takeaway-story__orb,.takeaway-story__path,.takeaway-story__dot,
.takeaway-story__sun,.takeaway-story__ring,.takeaway-story__step,
.takeaway-story__horizon,.takeaway-story__arc{display:none!important}
/* =========================================================
V143 — refined story illustrations: mountain, sun, eye.
Slide 03 staircase intentionally unchanged.
========================================================= */
.takeaway-story__visual--goals .iv-mountain-back{
fill:currentColor;opacity:.055;
}
.takeaway-story__visual--goals .iv-mountain-front,
.takeaway-story__visual--goals .iv-route,
.takeaway-story__visual--goals .iv-flag{
fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;
}
.takeaway-story__visual--goals .iv-mountain-front{stroke-width:1.6;opacity:.25}
.takeaway-story__visual--goals .iv-route{stroke-width:2.2;stroke-dasharray:5 7;opacity:.62}
.takeaway-story__visual--goals .iv-flag{stroke-width:2;opacity:.75}
.takeaway-story__visual--goals .iv-check{fill:currentColor;opacity:.7}
.takeaway-story__visual--goals .iv-check-halo{fill:currentColor;opacity:.09}
.takeaway-story__visual--goals .iv-goal{fill:currentColor}
.takeaway-story__visual--goals .iv-goal-halo{fill:currentColor;opacity:.09}
.takeaway-story__visual--goals .iv-goal-ring{fill:none;stroke:currentColor;stroke-width:2;opacity:.6}
.takeaway-story__visual--happiness .iv-sun-horizon,
.takeaway-story__visual--happiness .iv-sun-arc,
.takeaway-story__visual--happiness .iv-sun-glow,
.takeaway-story__visual--happiness .iv-rays,
.takeaway-story__visual--happiness .iv-ground{
fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;
}
.takeaway-story__visual--happiness .iv-sun-horizon{stroke-width:1.5;opacity:.24}
.takeaway-story__visual--happiness .iv-sun-arc{stroke-width:2;opacity:.62}
.takeaway-story__visual--happiness .iv-sun-glow{stroke-width:1.3;opacity:.17}
.takeaway-story__visual--happiness .iv-rays{stroke-width:2;opacity:.55}
.takeaway-story__visual--happiness .iv-sun-core{fill:currentColor;opacity:.17}
.takeaway-story__visual--happiness .iv-ground{stroke-width:1.4;opacity:.18}
.takeaway-story__visual--perspective .iv-eye,
.takeaway-story__visual--perspective .iv-iris,
.takeaway-story__visual--perspective .iv-iris-inner,
.takeaway-story__visual--perspective .iv-gaze{
fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;
}
.takeaway-story__visual--perspective .iv-eye{stroke-width:2;opacity:.42}
.takeaway-story__visual--perspective .iv-iris{stroke-width:1.6;opacity:.26}
.takeaway-story__visual--perspective .iv-iris-inner{stroke-width:1.5;opacity:.42}
.takeaway-story__visual--perspective .iv-pupil{fill:currentColor;opacity:.72}
.takeaway-story__visual--perspective .iv-glint{fill:#fff;opacity:.88}
.takeaway-story__visual--perspective .iv-gaze{stroke-width:1.8;opacity:.35}
/* V144 — Block 4 alignment/background refinement */
/* .takeaway-section--v140{
background:#f5f6f2!important;
} */
.takeaway-v140__inner{
max-width:1320px!important;
border-radius:42px;
background:#fff !important;
}
/* =========================================================
V145 — Block 3 horizontal auto-slider
========================================================= */
.audience-section--v139{
overflow:hidden;
}
.audience-slider{
position:relative;
overflow:hidden;
}
.audience-slider__track{
display:flex!important;
gap:16px!important;
width:max-content;
transform:translate3d(0,0,0);
transition:transform .72s cubic-bezier(.22,.7,.2,1);
will-change:transform;
}
.audience-slider .audience-v139__card{
flex:0 0 clamp(390px,41vw,555px);
width:clamp(390px,41vw,555px);
min-height:285px;
}
.audience-slider .audience-v139__card:nth-child(1){
background:linear-gradient(145deg,#ffffff 0%,#edf2fb 100%);
}
.audience-slider .audience-v139__card:nth-child(2){
background:linear-gradient(145deg,#fffdfa 0%,#f3eee4 100%);
}
.audience-slider .audience-v139__card:nth-child(3){
background:linear-gradient(145deg,#fbfdfc 0%,#e9f2ef 100%);
}
.audience-slider .audience-v139__card:nth-child(4){
background:linear-gradient(145deg,#fdfbfe 0%,#efebf4 100%);
}
.audience-slider .audience-v139__card>span{
width:42px;height:42px;
display:grid;place-items:center;
border-radius:50%;
background:rgba(255,255,255,.72);
border:1px solid rgba(50,70,78,.08);
}
.audience-slider__footer{
display:flex;
align-items:center;
justify-content:space-between;
margin-top:24px;
}
.audience-slider__count{
display:flex;align-items:baseline;gap:6px;
color:#8a989d;font-size:12px;font-weight:700;
}
.audience-slider__count strong{
color:#4053b4;font-size:17px;
}
.audience-slider__controls{display:flex;gap:8px}
.audience-slider__controls button{
width:46px;height:46px;
display:grid;place-items:center;
padding:0;border:1px solid rgba(48,68,76,.11);
border-radius:50%;background:#fff;color:#2b4149;
font-size:18px;cursor:pointer;
transition:transform .2s ease,background .2s ease;
}
.audience-slider__controls button:hover{transform:translateY(-2px);background:#f7f8fb}
/* =========================================================
V146 — Blocks 3+4 as one visual story
========================================================= */
.audience-section--v139,
.takeaway-section--v140{
background:#fff!important;
}
.audience-section--v139{padding-bottom:15px!important}
.takeaway-section--v140{padding-top:54px!important}
.blocks-bridge{
width:min(1400px,calc(100% - 44px));
height:92px;
margin:0 auto;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
position:relative;
background:#fff;
}
.blocks-bridge__line{
position:absolute;
top:0;
width:1px;
height:29px;
background:linear-gradient(to bottom,rgba(55,75,85,0),rgba(55,75,85,.18));
}
.blocks-bridge__label{
padding:8px 15px;
border:1px solid rgba(55,75,85,.09);
border-radius:999px;
background:#fff;
color:#839096;
font-size:11px;
line-height:1;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
box-shadow:0 8px 30px rgba(44,60,70,.04);
}
.blocks-bridge__arrow{margin-top:7px;color:#a3adb2;font-size:15px;line-height:1}
/* soft visual language shared with the four stories */
.audience-slider .audience-v139__card{
position:relative;
overflow:hidden;
isolation:isolate;
border:1px solid rgba(55,72,80,.07)!important;
box-shadow:0 18px 50px rgba(39,54,62,.055);
}
.audience-slider .audience-v139__card>span,
.audience-slider .audience-v139__card>div{position:relative;z-index:2}
.audience-slider .audience-v139__card::before,
.audience-slider .audience-v139__card::after{
content:"";
position:absolute;
z-index:1;
pointer-events:none;
}
.audience-slider .audience-v139__card--1::before{
width:260px;height:140px;right:-52px;bottom:-54px;
border:1.5px dashed rgba(70,91,194,.16);border-radius:50%;transform:rotate(-18deg);
}
.audience-slider .audience-v139__card--1::after{
width:12px;height:12px;right:72px;bottom:54px;border-radius:50%;background:rgba(70,91,194,.17);box-shadow:-62px 21px 0 rgba(70,91,194,.10);
}
.audience-slider .audience-v139__card--2::before{
width:190px;height:190px;right:-44px;bottom:-76px;border-radius:50%;
background:radial-gradient(circle,rgba(154,108,47,.12) 0 30%,rgba(154,108,47,.045) 31% 52%,transparent 53%);
}
.audience-slider .audience-v139__card--2::after{
width:110px;height:1px;right:7px;bottom:43px;background:rgba(154,108,47,.14);box-shadow:0 -18px 0 rgba(154,108,47,.07);
}
.audience-slider .audience-v139__card--3::before{
width:190px;height:190px;right:-55px;bottom:-65px;border:1px solid rgba(50,122,114,.13);border-radius:50%;box-shadow:0 0 0 25px rgba(50,122,114,.035),0 0 0 52px rgba(50,122,114,.025);
}
.audience-slider .audience-v139__card--4::before{
width:210px;height:160px;right:-40px;bottom:-45px;
background:repeating-linear-gradient(90deg,rgba(112,85,139,.075) 0 1px,transparent 1px 31px),repeating-linear-gradient(0deg,rgba(112,85,139,.06) 0 1px,transparent 1px 31px);
transform:rotate(-8deg);
}
.audience-slider .audience-v139__card--4::after{
width:110px;height:1px;right:28px;bottom:76px;background:rgba(112,85,139,.16);transform:rotate(-28deg);transform-origin:right center;
}
/* the story container is now the stronger colour destination on white */
.takeaway-v140__inner{background:#fff!important}
.takeaway-stories{box-shadow:0 22px 65px rgba(39,54,62,.07)}
/* =========================================================
V147 — cleaner 3→4 transition + stronger audience cards
========================================================= */
.audience-slider .audience-v139__card{
box-shadow:none!important;
border-width:1px!important;
border-style:solid!important;
}
.audience-slider .audience-v139__card--1{
background:linear-gradient(135deg,#f3f6ff 0%,#e7edff 100%)!important;
border-color:rgba(70,91,194,.14)!important;
}
.audience-slider .audience-v139__card--2{
background:linear-gradient(135deg,#fffaf0 0%,#f6ead4 100%)!important;
border-color:rgba(154,108,47,.14)!important;
}
.audience-slider .audience-v139__card--3{
background:linear-gradient(135deg,#f1faf7 0%,#deeee9 100%)!important;
border-color:rgba(50,122,114,.14)!important;
}
.audience-slider .audience-v139__card--4{
background:linear-gradient(135deg,#faf5fc 0%,#eee5f3 100%)!important;
border-color:rgba(112,85,139,.14)!important;
}
.audience-slider .audience-v139__card>span{
background:rgba(255,255,255,.6)!important;
backdrop-filter:blur(5px);
}
/* stronger, readable visual motifs: movement / warmth / inner centre / direction */
.audience-slider .audience-v139__card--1::before{
width:300px!important;height:170px!important;right:-45px!important;bottom:-42px!important;top:auto!important;
border:2px dashed rgba(70,91,194,.25)!important;border-radius:52% 48% 0 0!important;
transform:rotate(-14deg)!important;background:none!important;
}
.audience-slider .audience-v139__card--1::after{
width:16px!important;height:16px!important;right:65px!important;bottom:68px!important;
border-radius:50%!important;background:#6678d1!important;
box-shadow:-76px 27px 0 rgba(102,120,209,.45),-142px 43px 0 rgba(102,120,209,.24)!important;
}
.audience-slider .audience-v139__card--2::before{
width:230px!important;height:230px!important;right:-42px!important;left:auto!important;bottom:-88px!important;top:auto!important;
border-radius:50%!important;background:radial-gradient(circle,#e2bb74 0 22%,rgba(226,187,116,.30) 23% 42%,rgba(226,187,116,.12) 43% 58%,transparent 59%)!important;
}
.audience-slider .audience-v139__card--2::after{
width:150px!important;height:1px!important;right:0!important;bottom:50px!important;background:rgba(154,108,47,.28)!important;
box-shadow:0 -24px 0 rgba(154,108,47,.11),0 24px 0 rgba(154,108,47,.08)!important;
}
.audience-slider .audience-v139__card--3::before{
width:205px!important;height:205px!important;right:-38px!important;bottom:-55px!important;left:auto!important;top:auto!important;
border:2px solid rgba(50,122,114,.22)!important;border-radius:50%!important;
box-shadow:0 0 0 28px rgba(50,122,114,.07),0 0 0 58px rgba(50,122,114,.035)!important;background:none!important;
}
.audience-slider .audience-v139__card--3::after{
width:18px!important;height:18px!important;right:56px!important;bottom:39px!important;border-radius:50%!important;background:#4d968d!important;
}
.audience-slider .audience-v139__card--4::before{
width:245px!important;height:190px!important;right:-28px!important;bottom:-38px!important;
background:repeating-linear-gradient(90deg,rgba(112,85,139,.12) 0 1px,transparent 1px 34px),repeating-linear-gradient(0deg,rgba(112,85,139,.10) 0 1px,transparent 1px 34px)!important;
transform:rotate(-8deg)!important;
}
.audience-slider .audience-v139__card--4::after{
width:145px!important;height:2px!important;right:30px!important;bottom:80px!important;background:#8a6ba5!important;
transform:rotate(-28deg)!important;transform-origin:right center!important;
}
/* Bridge is no longer a floating pill/card: it is part of the same white canvas. */
.blocks-bridge{
width:100%!important;
height:auto!important;
min-height:92px;
margin:0!important;
padding:12px max(22px,calc((100% - 1400px)/2)) 0!important;
box-sizing:border-box;
display:flex!important;
flex-direction:row!important;
align-items:center!important;
justify-content:flex-start!important;
gap:14px;
background:#fff!important;
border-radius:0!important;
box-shadow:none!important;
}
.blocks-bridge__line{
position:static!important;
width:42px!important;height:1px!important;
flex:0 0 42px;
background:#cfd7da!important;
}
.blocks-bridge__label{
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
color:#718087!important;
font-size:12px!important;
line-height:1.2!important;
font-weight:750!important;
letter-spacing:.09em!important;
text-transform:uppercase;
}
.blocks-bridge__arrow{
margin:0!important;
color:#9aa7ac!important;
font-size:16px!important;
transform:rotate(-45deg);
}
.takeaway-section--v140{padding-top:24px!important}
/* =========================================================
V148 — slider alignment + intentional heading wraps
========================================================= */
/* =========================================================
RESPONSIVE / MEDIA QUERIES
Ordered from larger max-width breakpoints to smaller ones.
Duplicate identical @media conditions are consolidated below.
========================================================= */
@media (max-width:1200px){
.hero__container{
width:calc(100% - 36px)!important;
padding-left:58px!important;
padding-right:58px!important;
}
.hero__content{flex:0 0 61%!important;max-width:650px!important}
.hero h1{font-size:clamp(68px,7.2vw,86px)!important}
.hero__portrait{right:5px!important;width:47%!important;height:760px!important}
.hero__portrait:before{width:390px!important;height:455px!important}
}
@media (max-width:1150px){
.audience-panel{
grid-template-columns:minmax(0,1fr) 280px minmax(0,1fr) !important;
column-gap:24px !important;
}
.audience-goal{
width:260px !important;
height:260px !important;
}
.audience-goal::before{ inset:38px !important; }
.audience-goal::after{ inset:82px !important; }
.audience-goal::before{ inset:36px !important; }
.audience-goal::after{ inset:90px !important; }
.audience-goal__axis--horizontal{ width:500px; }
.audience-goal__axis--vertical{ height:500px; }
.audience-goal__orbit--one{ width:340px; height:340px; }
.audience-goal__orbit--two{ width:390px; height:390px; }
.audience-panel{
column-gap:10px !important;
}
.audience-panel .audience-card:nth-of-type(1) h3,
.audience-panel .audience-card:nth-of-type(3) h3{
margin-right:0 !important;
}
.audience-panel .audience-card:nth-of-type(2) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
margin-left:0 !important;
}
.audience-panel .audience-card:nth-of-type(1) p,
.audience-panel .audience-card:nth-of-type(3) p{
margin-right:22px !important;
}
.audience-panel .audience-card:nth-of-type(2) p,
.audience-panel .audience-card:nth-of-type(4) p{
margin-left:22px !important;
}
.audience-panel{
grid-template-columns:minmax(0,1fr) 280px minmax(0,1fr) !important;
}
.audience-panel .audience-card:nth-of-type(1) h3,
.audience-panel .audience-card:nth-of-type(3) h3{
width:auto !important;
margin-right:12px !important;
}
.audience-panel .audience-card:nth-of-type(2) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
width:auto !important;
margin-left:12px !important;
}
.audience-panel .audience-card:nth-of-type(1) p,
.audience-panel .audience-card:nth-of-type(3) p{
width:auto !important;
margin-right:32px !important;
}
.audience-panel .audience-card:nth-of-type(2) p,
.audience-panel .audience-card:nth-of-type(4) p{
width:auto !important;
margin-left:32px !important;
}
.audience-panel{
row-gap:24px !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(24px) !important;
}
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:translateY(-24px) !important;
}
.audience-panel .audience-card:nth-of-type(3) p{
width:auto !important;
margin-right:26px !important;
}
.audience-panel .audience-card:nth-of-type(4) p{
width:auto !important;
margin-left:26px !important;
}
.audience-panel{
row-gap:42px !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:translateY(14px) !important;
}
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:translateY(-14px) !important;
}
}
@media (max-width:1100px){
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:175px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:175px !important;
}
.audience-panel::before{
width:310px !important;
height:310px !important;
}
.audience-goal{
width:310px;
height:310px;
}
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:180px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:180px !important;
}
.audience-panel .audience-card::before{
width:54px;
}
.audience-goal{
width:315px !important;
height:315px !important;
}
.audience-goal::before{ inset:35px !important; }
.audience-goal::after{ inset:91px !important; }
.audience-goal{
width:300px !important;
height:300px !important;
}
.audience-goal::before{ inset:36px !important; }
.audience-goal::after{ inset:90px !important; }
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:190px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:190px !important;
}
.audience-panel .audience-card:nth-child(1)::before,
.audience-panel .audience-card:nth-child(3)::before{
right:128px !important;
}
.audience-panel .audience-card:nth-child(2)::before,
.audience-panel .audience-card:nth-child(4)::before{
left:128px !important;
}
.audience-goal{
width:290px !important;
height:290px !important;
}
.audience-goal::after{ inset:86px !important; }
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:210px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:210px !important;
}
.audience-panel .audience-card::before{
width:64px !important;
}
}
@media(max-width:1100px){
.hero__content{flex-basis:650px !important}
.hero__portrait{right:-75px !important;width:455px !important}
.program-preview__head,.program-preview__grid{width:61% !important}
.hero__content{flex-basis:640px !important}
.hero__portrait{right:-80px !important;width:455px !important}
.hero h1{font-size:78px !important}
.hero__portrait{right:-105px !important;width:520px !important}
.hero__eyebrow-text strong{font-size:16px !important}
.hero__eyebrow-text span{font-size:15px !important}
.hero__container:after{right:-150px}
.hero__event-line{font-size:14px!important;gap:8px!important}
.hero__author-card{width:360px}
.hero:before{
background:
linear-gradient(90deg,#fff 0%,#fff 58%,rgba(255,255,255,.76) 72%,rgba(255,255,255,0) 82%),
radial-gradient(ellipse at 90% 25%,rgba(255,195,77,.38),transparent 42%),
radial-gradient(ellipse at 92% 62%,rgba(57,163,214,.30),transparent 48%),
#fff !important;
}
.hero__container{
width:calc(100% - 28px) !important;
padding-left:42px !important;
padding-right:42px !important;
}
.hero__container{
padding-left:60px !important;
padding-right:60px !important;
}
.hero__portrait{
right:20px !important;
}
.hero__container::before{right:-85px!important}
.hero__container::after{right:-145px!important}
.takeaway-story__visual{
width:220px!important;
height:150px!important;
right:20px!important;
top:78px!important;
}
}
@media (max-width:1050px){
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(3){
padding-right:105px !important;
}
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(4){
padding-left:105px !important;
}
.audience-panel::before{
width:280px !important;
height:280px !important;
}
}
@media(max-width:1050px){
.hero__content{flex-basis:650px}.hero__portrait{right:-100px;width:430px;opacity:.92}
.hero__content{flex-basis:650px}
.hero__portrait{right:-130px;width:570px;opacity:.96}
.hero__portrait{right:-110px !important;width:500px !important}
.hero__portrait{right:-40px !important;width:430px !important}
.program-preview__head,.program-preview__grid{width:61%}
.takeaway-section__head{
grid-template-columns:130px minmax(0,1fr);
}
.takeaway-section__head > p{
grid-column:2;
}
.takeaway-map{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:44px 0;
}
.takeaway-map__line{display:none;}
.takeaway-item{
min-height:280px;
border-top:1px solid rgba(217,52,77,.24);
}
.takeaway-item__dot{top:-7px;}
.takeaway-section__head{
display:block !important;
}
.takeaway-section__head > p{
max-width:650px !important;
}
.takeaway-section{
margin-top:-22px !important;
}
.takeaway-item__num{
top:14px !important;
}
.takeaway-item__dot{
top:-11px !important;
}
.mid-cta--speaker .mid-cta__stage{
min-height:660px !important;
}
.mid-cta--speaker .mid-cta__intro{
width:60% !important;
padding-bottom:0 !important;
}
.mid-cta--speaker .mid-cta__speaker{
left:auto !important;
right:3% !important;
height:420px !important;
}
.mid-cta--speaker .mid-cta__tickets{
grid-template-columns:1fr !important;
position:relative !important;
left:auto !important;
right:auto !important;
bottom:auto !important;
margin-top:225px !important;
}
.mid-cta--speaker .mid-cta__ticket{
min-height:130px !important;
}
/* .mid-cta--speaker .mid-cta__stage{
min-height:760px !important;
} */
.mid-cta--speaker .mid-cta__intro,
.mid-cta--speaker .mid-cta__tickets{
width:60% !important;
}
.mid-cta--speaker .mid-cta__speaker {
right: -14% !important;
width: 48% !important;
}
.mid-cta--speaker .mid-cta__tickets{
margin-top:32px !important;
}
.mid-cta--speaker .mid-cta__intro,
.mid-cta--speaker .mid-cta__tickets{
width:62% !important;
}
.mid-cta--speaker .mid-cta__tickets{
width:58% !important;
}
}
@media (max-width:1024px){
section.hero{padding-bottom:44px!important}
.hero__container{
width:calc(100% - 28px)!important;
min-height:760px!important;
padding:64px 42px 36px!important;
border-radius:0 0 40px 40px!important;
}
.hero__content{flex:0 0 62%!important;max-width:590px!important}
.hero__event-line{
margin-bottom:34px!important;
font-size:13px!important;
gap:7px!important;
white-space:normal!important;
flex-wrap:wrap!important;
}
.hero h1{font-size:clamp(62px,7.3vw,75px)!important;line-height:.9!important}
.hero__format{font-size:15px!important;max-width:550px!important}
.hero__button{width:320px!important;min-height:68px!important;font-size:18px!important}
.hero__button b{width:44px!important;height:44px!important}
.hero__portrait{display:flex!important;right:-18px!important;width:44%!important;height:690px!important}
.hero__author-card{width:320px!important;max-width:320px!important;left:48%!important}
.hero__author-card span{max-width:285px!important}
.hero__portrait:before{display:block!important;width:330px!important;height:405px!important;bottom:72px!important}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 700px !important;
font-size: clamp(44px, 3.8vw, 58px) !important;
line-height: 1.1 !important;
}
.about-speaker--v113 .about-speaker__visual img {
height: 365px !important;
}
.meetings-video {
padding: 65px 24px 118px;
}
.meetings-gallery {
padding: 65px 24px 112px;
}
.venue-section {
padding: 65px 24px 118px;
}
.venue-section__address-v133 {
color: #1d3038;
font-size: 22px;
}
.desktopdisplayblock {
display: none;
}
.mobiledisplayblock {
display: block;
}
.audience-v139__head {
margin-bottom: 40px;
}
.audience-section--v139 {
padding: 65px 22px 0px !important;
}
.program-section {
padding-bottom: 30px !important;
}
.audience-panel {
row-gap: 0px !important;
}
.audience-goal {
width: 180px !important;
height: 180px !important;
}
.audience-panel {
grid-template-columns: minmax(0, 1fr) 152px minmax(0, 1fr) !important;
}
.audience-panel .audience-card:nth-of-type(1) h3, .audience-panel .audience-card:nth-of-type(3) h3 {
width: auto !important;
}
.audience-panel .audience-card:nth-of-type(3) p, .audience-panel .audience-card:nth-of-type(4) p {
margin-left: 0px !important;
}
.audience-panel .audience-card:nth-of-type(3) p {
max-width: 370px !important;
}
.audience-panel .audience-card:nth-of-type(4) p {
max-width: 370px !important;
margin-right: 0px !important;
margin-left: 32px !important;
}
.audience-section {
padding: 92px 24px 50px;
}
.takeaway-section {
padding-top: 30px !important;
}
.mid-cta.mid-cta--speaker {
padding-top: 65px !important;
}
.takeaway-section__head > p {
font-size: 26px !important;
}
.takeaway-section__head {
padding-bottom: 10px !important;
}
.takeaway-item {
border: none;
padding: 0;
min-height: 200px;
}
.takeaway-item__body {
padding-top: 0px !important;
}
.takeaway-item h3 {
margin-top: 0 !important;
padding-left: 50px;
max-width: 350px;
}
.takeaway-item__dot {
left: 16px !important;
}
.takeaway-item__num {
left: 16px !important;
}
.hero__content {
padding-top: 0px !important;
padding: 76px 0 35px;
}
.hero__container {
width: calc(100% - 28px) !important;
min-height: 640px !important;
}
.hero__portrait {
display: flex !important;
right: 40px !important;
width: 50% !important;
}
.hero__event-line {
font-size: 16px !important;
max-width: 410px;
}
.about-speaker {
padding: 70px 24px 108px;
}
}
@media(max-width:1000px){
.mid-cta__inner{
grid-template-columns:1fr;
gap:28px;
}
.audience-v139__head{grid-template-columns:1fr;gap:22px}
.audience-v139__head h2{font-size:50px}
.takeaway-v139__inner{grid-template-columns:1fr 1fr}
.takeaway-v139__results{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}
.takeaway-v139__results article:nth-child(odd){padding-right:25px}
}
@media(max-width:980px){
.about-speaker{
padding-top:80px;
}
.about-speaker__inner{
grid-template-columns:1fr;
gap:54px;
}
.about-speaker__content{
max-width:760px;
order:1;
}
.about-speaker__visual{
order:2;
min-height:580px;
}
.about-speaker__visual img{
height:560px;
}
.about-speaker--v113 .about-speaker__inner{
grid-template-columns:1fr !important;
}
.about-speaker--v113 .about-speaker__content{
order:1;
padding-top:0 !important;
}
.about-speaker__left{
order:2;
}
.site-footer__inner{
grid-template-columns:1fr 1fr !important;
}
.site-footer__links{
grid-column:auto !important;
}
.site-footer__inner{grid-template-columns:1fr 1fr!important}
}
@media (max-width:900px){
.audience-section{
padding:70px 18px 78px;
}
.audience-section__head h2{
font-size:40px;
}
.audience-grid{
grid-template-columns:1fr;
}
.audience-card{
min-height:0;
}
.audience-panel{
grid-template-columns:1fr;
border-radius:28px;
}
.audience-panel::before{
display:none;
}
.audience-panel .audience-card{
min-height:0 !important;
padding:34px 32px !important;
border-right:0 !important;
border-bottom:1px solid rgba(71,124,147,.11) !important;
}
.audience-panel .audience-card:last-child{
border-bottom:0 !important;
}
.audience-panel{
min-height:0;
padding-top:240px;
}
.audience-panel::before{
top:120px !important;
width:210px !important;
height:210px !important;
}
.audience-panel::after{
top:120px;
width:270px;
height:270px;
}
.audience-panel .audience-card,
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
min-height:0 !important;
padding:30px 28px !important;
border-top:1px solid rgba(71,124,147,.09) !important;
}
.audience-section__head{
text-align:center !important;
}
.audience-panel::before{
top:120px !important;
width:210px !important;
height:210px !important;
}
.audience-panel .audience-card,
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
display:block;
padding:30px 28px !important;
text-align:left !important;
}
.audience-panel .audience-card h3,
.audience-panel .audience-card p{
max-width:none !important;
}
.audience-goal{
top:120px;
width:210px;
height:210px;
}
.audience-goal::before{ inset:25px; }
.audience-goal::after{ inset:61px; }
.audience-panel .audience-card::before{
display:none;
}
.audience-goal{
top:120px !important;
width:215px !important;
height:215px !important;
}
.audience-goal::before{ inset:25px !important; }
.audience-goal::after{ inset:64px !important; }
.audience-panel .audience-card:nth-child(1),
.audience-panel .audience-card:nth-child(2),
.audience-panel .audience-card:nth-child(3),
.audience-panel .audience-card:nth-child(4){
padding-top:30px !important;
padding-bottom:30px !important;
}
.audience-goal{
width:205px !important;
height:205px !important;
}
.audience-goal::before{ inset:24px !important; }
.audience-goal::after{ inset:60px !important; }
.audience-panel .audience-card::before{
display:none !important;
}
.audience-goal{
width:200px !important;
height:200px !important;
}
.audience-goal::before{
inset:-22px !important;
}
.audience-goal::after{
inset:59px !important;
}
.audience-panel .audience-card h3::after{
display:none !important;
}
.audience-panel{
display:block !important;
min-height:0 !important;
padding-top:250px !important;
}
.audience-goal{
top:105px !important;
width:200px !important;
height:200px !important;
}
.audience-goal::before{ inset:29px !important; }
.audience-goal::after{ inset:63px !important; }
.audience-panel .audience-card,
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
padding:24px 0 !important;
text-align:left !important;
}
.audience-panel .audience-card h3,
.audience-panel .audience-card p{
max-width:none !important;
margin-left:0 !important;
margin-right:0 !important;
}
.audience-panel .audience-card h3::before{
display:none !important;
}
.audience-goal::before{ inset:24px !important; }
.audience-goal::after{ inset:60px !important; }
.audience-goal__axis--horizontal{ width:300px; }
.audience-goal__axis--vertical{ height:300px; }
.audience-goal__orbit--one{ width:235px; height:235px; }
.audience-goal__orbit--two{ width:270px; height:270px; }
.audience-panel .audience-card,
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:none !important;
padding-left:0 !important;
padding-right:0 !important;
}
.audience-panel .audience-card h3,
.audience-panel .audience-card p{
max-width:none !important;
margin-left:0 !important;
margin-right:0 !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2){
transform:none !important;
}
.audience-panel .audience-card h3,
.audience-panel .audience-card p{
width:auto !important;
max-width:none !important;
margin-left:0 !important;
margin-right:0 !important;
text-align:left !important;
}
.audience-panel .audience-card h3::after{
display:none !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:none !important;
}
.audience-panel .audience-card:nth-of-type(3) h3,
.audience-panel .audience-card:nth-of-type(4) h3,
.audience-panel .audience-card:nth-of-type(3) p,
.audience-panel .audience-card:nth-of-type(4) p{
width:auto !important;
max-width:none !important;
margin-left:0 !important;
margin-right:0 !important;
text-align:left !important;
}
.audience-panel{
row-gap:0 !important;
}
.audience-panel .audience-card:nth-of-type(1),
.audience-panel .audience-card:nth-of-type(2),
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
transform:none !important;
}
.audience-panel .audience-card:nth-of-type(3),
.audience-panel .audience-card:nth-of-type(4){
display:flex !important;
flex-direction:column !important;
}
.audience-panel .audience-card:nth-of-type(3) h3,
.audience-panel .audience-card:nth-of-type(4) h3{
order:1 !important;
margin-bottom:16px !important;
}
.audience-panel .audience-card:nth-of-type(3) p,
.audience-panel .audience-card:nth-of-type(4) p{
order:2 !important;
margin-bottom:0 !important;
}
.hero__container{
min-height:720px!important;
padding:58px 34px 34px!important;
}
.hero__content{flex-basis:64%!important;max-width:560px!important}
.hero h1{font-size:clamp(58px,7.6vw,68px)!important}
.hero__format{font-size:14px!important}
.hero__format-days{gap:5px!important}
.hero__portrait{display:flex!important;right:-55px!important;width:43%!important;height:630px!important}
.hero__author-card{display:none!important}
.hero__portrait:before{width:300px!important;height:360px!important;bottom:58px!important}
}
@media(max-width:900px){
.hero{background-position:60% center}.hero__container{width:min(100% - 56px,760px)}.hero__content{width:100%;padding:70px 0}.hero h1{font-size:clamp(64px,10vw,86px)}
.program-section__intro{
grid-template-columns:1fr;
gap:14px;
}
.program-section__intro h2{font-size:48px}
.program-section__grid{grid-template-columns:1fr}
.program-day{min-height:390px}
.program-section__intro h2{font-size:44px!important}
.program-day{min-height:auto!important}
.program-day__introtext{min-height:0}
.program-section{
margin-top:0 !important;
padding:55px 0 90px !important;
}
.program-day{
min-height:auto !important;
}
.program-day__type{
min-height:0 !important;
}
.program-section{
margin-top:-12px !important;
}
.mid-cta--program .mid-cta__head{
display:block !important;
}
.mid-cta--program .mid-cta__head p{
margin-top:18px !important;
}
.mid-cta--program .mid-cta__days{
grid-template-columns:1fr !important;
}
.mid-cta--program .mid-cta__day{
min-height:220px !important;
}
.takeaway-section::before,
.takeaway-section::after{
opacity:.55 !important;
}
.takeaway-section::before{ width:55% !important; opacity:.75 !important; }
.takeaway-section::after{ right:28px !important; opacity:.36 !important; }
.meetings-video__head,.meetings-gallery__head{grid-template-columns:1fr;gap:20px}
.meetings-video__head>p{grid-column:1;grid-row:auto}
.meetings-video__grid{grid-template-columns:1fr}
.meetings-video__side{grid-template-columns:1fr 1fr}
.meetings-gallery__mosaic{grid-template-columns:1fr 1fr;grid-template-rows:360px 220px 220px}
.meetings-gallery__photo--1{grid-column:1/3;grid-row:auto}
.venue-section__layout{grid-template-columns:180px 1fr}
.venue-section__map{grid-column:1/3;min-height:320px}
.site-footer__inner{grid-template-columns:1fr 1fr}
.site-footer__links{grid-column:1/3}
.venue-section__layout--v122{grid-template-columns:1fr!important}
.venue-section__layout--v122 .venue-section__map{grid-column:auto!important;min-height:340px!important}
.site-footer__inner{grid-template-columns:1fr 1fr!important}
.site-footer__links{grid-column:1/3!important}
.venue-section__layout--v133{
grid-template-columns:1fr!important;
}
.venue-section__layout--v133 .venue-section__building-photo,
.venue-section__layout--v133 .venue-section__building-photo img{
min-height:420px;
height:420px;
}
.venue-section__info-v133{padding:42px 38px 46px}
.site-footer-v136__top{grid-template-columns:1fr}
.site-footer-v136__event{padding:54px 46px 36px}
.site-footer-v136__event>strong{font-size:52px}
.site-footer-v136__organizer{margin:0 20px 20px}
.venue-section__hall-photo{height:340px}
.takeaway-v140__inner{grid-template-columns:1fr}
.takeaway-v140__inner>.takeaway-v139__title{min-height:auto}
.takeaway-stories,.takeaway-stories__slides{min-height:520px}
.audience-slider .audience-v139__card{
flex-basis:min(72vw,520px);
width:min(72vw,520px);
}
}
@media(max-width:820px){
.hero__container{display:block}.hero__content{width:100%;max-width:680px}.hero__portrait{display:none}
.hero__container{display:block}
.hero__content{width:100%;max-width:680px}
.hero__portrait{display:none}
.hero{min-height:auto !important;padding:74px 0 0 !important}
.hero__container{min-height:auto !important;padding-bottom:55px !important}
.hero__portrait{display:none !important}
.program-preview{
position:relative;
left:auto;
bottom:auto;
transform:none;
width:calc(100% - 40px);
margin:0 auto;
}
.program-preview__head{align-items:flex-start;flex-direction:column;gap:8px}
.program-preview__grid{grid-template-columns:1fr}
.hero{padding-bottom:0 !important}
.hero:before{inset:0 !important}
.hero__portrait{display:none !important}
.program-preview{
position:relative !important;
height:auto !important;
padding:28px 20px 32px !important;
}
.program-preview__head,.program-preview__grid{width:100%}
.program-preview__grid{grid-template-columns:1fr !important}
.hero{min-height:auto !important;padding-bottom:0 !important}
.hero:before{inset:0 !important}
.hero__container{min-height:auto !important}
.hero__content{padding-top:30px !important}
.hero__portrait{display:none !important}
.program-preview{
position:relative !important;
height:auto !important;
padding:30px 20px 34px !important;
}
.program-preview:before{display:none}
.program-preview__head,.program-preview__grid{width:100% !important}
.program-preview__grid{grid-template-columns:1fr !important}
.hero{min-height:auto !important;padding-bottom:0 !important}
.hero:before{inset:0 !important}
.hero__portrait{display:none !important}
.hero h1{font-size:clamp(54px,12vw,72px) !important}
.hero__content:after{display:none}
.hero{border-radius:0 0 30px 30px !important}
.hero:before{border-radius:0 0 30px 30px !important}
.hero__eyebrow-text{white-space:normal !important;flex-wrap:wrap !important}
.hero__container:after,.hero__container:before{display:none}
.hero__event-line{white-space:normal!important;flex-wrap:wrap!important;line-height:1.35}
.hero__author-card{display:none}
.hero__container{
width:calc(100% - 20px) !important;
padding-left:20px !important;
padding-right:20px !important;
border-radius:0 0 30px 30px !important;
}
.hero__container{
padding-left:20px !important;
padding-right:20px !important;
}
.hero__container::before,
.hero__container::after,
.hero__portrait:after{display:none!important}
.hero__lead .lead-light{font-size:18px}
.hero__lead{font-size:20px!important}
.hero__lead .lead-light{font-size:18px!important}
.hero__portrait:before{display:none!important}
.hero__lead{
font-size:19px !important;
}
.hero__format{
font-size:18px !important;
}
.hero__button{
width:100% !important;
max-width:350px !important;
}
.hero__format{
font-size:16px !important;
}
}
@media (max-width:768px){
section.hero{padding-bottom:34px!important}
.hero__container{
display:block!important;
width:calc(100% - 20px)!important;
min-height:0!important;
padding:50px 32px 38px!important;
border-radius:0 0 34px 34px!important;
overflow:hidden!important;
}
.hero__content{width:100%!important;max-width:none!important;padding:0!important}
.hero__event-line {
max-width: 450px !important;
margin-bottom: 28px !important;
line-height: 1.4 !important;
font-size: 18px !important;
}
.event-line__sep{width:18px!important}
.hero h1{
max-width:650px!important;
font-size:clamp(58px,10.2vw,72px)!important;
line-height:.91!important;
}
.hero__format{
max-width:610px!important;
margin-top:30px!important;
font-size:15px!important;
line-height:1.42!important;
}
.hero__button{
width:320px!important;
max-width:100%!important;
min-height:66px!important;
margin-top:28px!important;
}
.hero__portrait{display:none!important}
.hero__format-days {
gap: 4px !important;
padding-top: 0;
}
.hero__container{
position:relative!important;
}
.hero__content{
position:relative!important;
z-index:3!important;
}
.hero h1{
position:relative!important;
z-index:3!important;
max-width:78%!important;
}
.hero__portrait{
display:flex!important;
position:absolute!important;
z-index:2!important;
right:-34px!important;
bottom: 0 !important;
width:43%!important;
height:390px!important;
pointer-events:none!important;
}
.hero__portrait img{
position:absolute!important;
right:0!important;
bottom:0!important;
width:auto!important;
max-width:none!important;
height:100%!important;
object-fit:contain!important;
object-position:right bottom!important;
}
.hero__portrait:before{
display:block!important;
width:235px!important;
height:285px!important;
right:-18px!important;
bottom:8px!important;
border-radius:44px!important;
opacity:.58!important;
}
.hero__author-card{display:none!important}
.hero__format{
position:relative!important;
z-index:4!important;
max-width:100%!important;
margin-top:44px!important;
}
.hero__button{
position:relative!important;
z-index:4!important;
}
.program-day {
min-height: auto !important;
}
.program-day__body {
padding-bottom: 15px !important;
}
.program-section {
padding: 55px 0 30px !important;
}
button.program-day__button {
max-width: 320px;
}
.none768 {
display: none;
}
.block768 {
display: block;
}
.audience-panel .audience-card:nth-of-type(1) h3, .audience-panel .audience-card:nth-of-type(3) h3 {
width: 100% !important;
text-align: center !important;
max-width: 400px !important;
margin: 0 auto 15px !important;
}
.audience-panel .audience-card:nth-of-type(2) h3, .audience-panel .audience-card:nth-of-type(4) h3 {
width: 100% !important;
text-align: center !important;
max-width: 400px !important;
margin: 0 auto 15px !important;
}
.audience-goal {
width: 110px !important;
height: 110px !important;
}
.audience-goal__orbit--one {
width: 160px;
height: 160px;
}
.audience-goal__orbit--two {
width: 200px;
height: 200px;
}
.audience-goal__axis--horizontal {
width: 260px;
}
.audience-goal__axis--vertical {
height: 260px;
}
.audience-panel {
padding-top: 230px !important;
}
.audience-panel .audience-card:nth-of-type(1) h3::before, .audience-panel .audience-card:nth-of-type(3) h3::before {
display: none !important;
}
.audience-panel .audience-card:nth-of-type(1) h3::after, .audience-panel .audience-card:nth-of-type(3) h3::after {
display: none !important;
}
.audience-panel .audience-card:nth-of-type(2) h3::before, .audience-panel .audience-card:nth-of-type(4) h3::before {
display: none !important;
}
.audience-panel .audience-card:nth-of-type(2) h3::after, .audience-panel .audience-card:nth-of-type(4) h3::after {
display: none !important;
}
.audience-panel .audience-card:nth-of-type(1) p, .audience-panel .audience-card:nth-of-type(3) p {
width: auto !important;
margin-right: 32px !important;
margin: 0 auto !important;
width: 100% !important;
display: block;
max-width: 400px !important;
text-align: center !important;
}
.audience-panel .audience-card:nth-of-type(2) p, .audience-panel .audience-card:nth-of-type(4) p {
width: auto !important;
margin-right: 32px !important;
margin: 0 auto !important;
width: 100% !important;
display: block;
max-width: 400px !important;
text-align: center !important;
}
.mid-cta--speaker .mid-cta__speaker {
right: -9% !important;
top: 33%;
}
.mid-cta--speaker .mid-cta__intro, .mid-cta--speaker .mid-cta__tickets {
width: auto !important;
}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 496px !important;
line-height: 48px !important;
}
.mid-cta--speaker .mid-cta__speaker {
right: 28% !important;
top: 33%;
}
.mid-cta--speaker .mid-cta__speaker {
height: auto !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 580px;
}
.venue-contact {
width: 100%;
}
.venue-contact img {
width: 200px !important;
height: 200px !important;
flex-basis: 140px !important;
}
.venue-contact__copy>span {
font-size: 14px;
}
.venue-contact__copy>strong {
font-size: 30px !important;
}
.venue-contact__links a {
color: #4053b4;
font-size: 24px;
font-weight: 720;
text-decoration: none;
}
.venue-contact__telegram span {
color: #7c8c93;
font-size: 18px;
}
.venue-contact__telegram strong {
color: #4053b4;
font-size: 18px;
font-weight: 760;
}
.site-footer__inner {
display: block;
}
.site-footer__brand strong {
display: block;
font-size: 38px;
line-height: 1.2;
letter-spacing: -.025em;
}
.site-footer__brand span, .site-footer__venue span {
display: block;
margin-top: 6px;
color: rgba(231, 239, 242, .57);
font-size: 28px;
line-height: 1.2;
}
.site-footer__links {
display: none;
}
.meetings-gallery {
position: relative;
z-index: 7;
margin-top: -28px;
padding: 65px 24px 112px;
}
.venue-section {
position: relative;
z-index: 8;
margin-top: -28px;
padding: 65px 24px 118px;
}
.meetings-video {
position: relative;
z-index: 6;
margin-top: -28px;
padding: 65px 24px 118px;
}
.mid-cta.mid-cta--speaker {
padding: 65px 24px 84px !important;
}
/* .about-speaker--v113 .about-speaker__link {
display: block;
text-align: center;
} */
}
@media(max-width:760px){
.mid-cta.mid-cta--speaker{
margin-top:-18px !important;
padding:58px 18px 62px !important;
border-radius:34px 34px 0 0 !important;
}
.mid-cta--speaker .mid-cta__stage{
min-height:0 !important;
}
.mid-cta--speaker .mid-cta__intro,
.mid-cta--speaker .mid-cta__tickets{
width:100% !important;
}
.mid-cta--speaker .mid-cta__intro p{
white-space:normal !important;
}
.mid-cta--speaker .mid-cta__speaker{
position:relative !important;
right:auto !important;
bottom:auto !important;
width:100% !important;
height:340px !important;
margin-top:12px !important;
}
.mid-cta--speaker .mid-cta__speaker img{
height:350px !important;
}
.mid-cta--speaker .mid-cta__speaker-glow{
width:300px !important;
height:300px !important;
bottom:25px !important;
}
.mid-cta--speaker .mid-cta__tickets{
margin-top:4px !important;
}
.mid-cta--speaker .mid-cta__ticket{
grid-template-columns:68px 1fr !important;
grid-template-areas:
"date meta"
"date title"
"action action" !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
flex-direction:row !important;
align-items:center !important;
justify-content:space-between !important;
margin-top:10px !important;
padding:10px 0 0 !important;
border-left:0 !important;
border-top:1px solid rgba(41,110,142,.11) !important;
}
.mid-cta--speaker .mid-cta__intro,
.mid-cta--speaker .mid-cta__tickets{
width:100% !important;
}
.mid-cta--speaker .mid-cta__intro h2{
font-size:42px !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
justify-self:start !important;
margin-top:10px !important;
}
.mid-cta--speaker .mid-cta__ticket{
grid-template-columns:82px 1fr !important;
grid-template-areas:
"date meta"
"date title"
"action action" !important;
}
.mid-cta--speaker .mid-cta__ticket-action{
justify-self:end !important;
margin-top:12px !important;
}
.mid-cta--speaker .mid-cta__tickets{
width:100% !important;
}
.mid-cta--speaker .mid-cta__ticket{
padding:14px 16px !important;
}
.takeaway-item{
padding-top:0 !important;
}
.takeaway-num-v109{
position:static !important;
transform:none !important;
margin-bottom:10px !important;
}
.takeaway-item__dot{
display:none !important;
}
.takeaway-list::before{
display:none !important;
}
}
@media (max-width:700px){
.audience-subtitle-break{
display:none;
}
.audience-section{
border-radius:32px 32px 0 0;
}
.audience-section::after{
border-radius:32px 32px 0 0;
}
}
@media(max-width:700px){
.hero__event-card{gap:14px;padding:12px 15px;margin-bottom:30px;border-radius:17px;}
.event-card__divider{height:34px;}
.event-card__person{width:35px;height:35px;}
.event-card__speaker strong{font-size:14px;}
.event-card__speaker span,.event-card__date span{font-size:12px;}
.event-card__date strong{font-size:13px;}
.hero__lead{font-size:24px;}
.hero__event-card{padding:0;gap:14px;}
.event-card__location{width:28px;height:28px;flex-basis:28px;}
.event-card__speaker strong,
.event-card__speaker span,
.event-card__date strong,
.event-card__date span{font-size:14px;}
.ticket-modal{
padding:10px;
}
.ticket-modal__dialog{
max-height:calc(100vh - 20px);
border-radius:22px;
}
.ticket-modal__header{
padding:19px 18px 15px;
}
.ticket-modal__header h2{
font-size:25px;
}
.ticket-modal__frame-wrap{
height:calc(100vh - 145px);
min-height:420px;
}
.ticket-modal__close{
flex-basis:38px;
width:38px;
height:38px;
}
.takeaway-section{padding:80px 20px 86px;}
.takeaway-section__head{
display:block;
padding-bottom:50px;
}
.takeaway-section__kicker{margin-bottom:22px;}
.takeaway-section__head h2{
font-size:52px;
margin-bottom:25px;
}
.takeaway-map{display:block;padding-top:0;}
.takeaway-item,
.takeaway-item:first-of-type,
.takeaway-item:last-of-type{
min-height:0;
padding:30px 0 36px;
border-right:0;
border-top:1px solid rgba(217,52,77,.22);
}
.takeaway-item__dot,
.takeaway-item:first-of-type .takeaway-item__dot{
left:auto;
right:0;
top:-7px;
}
.takeaway-item__num{margin-bottom:16px;}
.takeaway-item__body{padding-top:0;}
.takeaway-item h3,.takeaway-item p{max-width:90%;}
.takeaway-section__closing{margin-top:20px;}
.takeaway-section__head{
padding-bottom:50px !important;
}
.takeaway-section{
margin-top:-18px !important;
border-radius:34px 34px 0 0 !important;
}
.takeaway-section__head h2{
font-size:48px !important;
}
.takeaway-copy-break{
display:none;
}
.takeaway-item__num{
position:static !important;
display:block !important;
width:auto !important;
transform:none !important;
text-align:left !important;
margin-bottom:16px !important;
}
.takeaway-item__dot,
.takeaway-item:first-of-type .takeaway-item__dot{
left:auto !important;
right:0 !important;
top:-11px !important;
transform:none !important;
}
.takeaway-item__body{
padding-top:0 !important;
}
.takeaway-section__head > p{
font-size:25px !important;
line-height:1.3 !important;
}
.takeaway-section::before{
left:34px !important;
right:34px !important;
}
.mid-cta{
padding:26px 18px 32px;
}
.mid-cta__inner{
padding:30px 22px;
border-radius:26px;
}
.mid-cta__days{
grid-template-columns:1fr;
}
.mid-cta__day{
min-height:84px;
}
.mid-cta.mid-cta--program{
padding:52px 18px 62px !important;
}
.mid-cta--program .mid-cta__inner{
padding:34px 20px 22px !important;
border-radius:28px !important;
}
.mid-cta--program .mid-cta__inner{
padding:38px 22px 24px !important;
border-radius:30px !important;
}
.mid-cta--program .mid-cta__head p{
white-space:normal !important;
}
.mid-cta.mid-cta--speaker{
padding:52px 18px 62px !important;
}
.mid-cta--speaker .mid-cta__stage{
min-height:0 !important;
padding:34px 20px 22px !important;
border-radius:30px !important;
}
.mid-cta--speaker .mid-cta__intro{
width:100% !important;
}
.mid-cta--speaker .mid-cta__speaker{
position:relative !important;
left:auto !important;
right:auto !important;
width:100% !important;
height:280px !important;
margin-top:12px !important;
}
.mid-cta--speaker .mid-cta__speaker img{
height:285px !important;
}
.mid-cta--speaker .mid-cta__speaker-glow{
width:250px !important;
height:250px !important;
}
.mid-cta--speaker .mid-cta__tickets{
margin-top:-8px !important;
}
.venue-section__hall-gallery{
grid-template-columns:1fr;
gap:12px;
margin-top:14px;
}
.venue-section__hall-gallery .venue-section__hall-photo{
height:auto!important;
aspect-ratio:1.5 / 1;
border-radius:24px;
}
.audience-section--v139{padding:78px 16px 84px!important}
.audience-v139__head{margin-bottom:38px}
.audience-v139__head h2{font-size:38px}
.audience-v139__head h2 br{display:none}
.audience-v139__grid{grid-template-columns:1fr}
.audience-v139__card{min-height:210px;padding:27px 25px;border-radius:25px}
.audience-v139__card h3{font-size:25px}
.takeaway-section--v139{padding:0 16px 90px!important}
.takeaway-v139__inner{grid-template-columns:1fr}
.takeaway-v139__title{padding:38px 28px}
.takeaway-v139__title h2{font-size:49px}
.takeaway-v139__visual{min-height:470px}
.takeaway-v139__results{grid-column:auto;display:block;padding:22px 28px}
.takeaway-v139__results article:nth-child(odd){padding-right:0}
.takeaway-story__visual{
width:150px;height:120px;right:10px;top:62px;opacity:.65;transform:scale(.78);transform-origin:top right;
}
.takeaway-story__visual{
width:142px!important;
height:96px!important;
right:10px!important;
top:61px!important;
opacity:.72!important;
transform:none!important;
}
}
@media(max-width:680px){
.takeaway-section::before,
.takeaway-section::after{
display:none !important;
}
.takeaway-section::before,
.takeaway-section::after{
display:none !important;
}
.takeaway-section::before,
.takeaway-section::after{
display:none !important;
}
}
@media(max-width:640px){
.hero{min-height:800px;align-items:flex-start;background-position:62% center}.hero:before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.34)}.hero__container{width:calc(100% - 36px)}.hero__content{padding:44px 0 65px}.hero__meta{gap:9px;flex-wrap:wrap;margin-bottom:18px;font-size:11px}.hero__meta i{height:16px}.hero__speaker{margin-bottom:26px;padding:10px 14px 10px 12px;gap:9px}.hero__speaker .label{font-size:9px}.hero__speaker strong{font-size:11px}.speaker-divider{height:17px}.hero h1{font-size:clamp(48px,14vw,66px);line-height:.91}.hero__lead{width:100%;font-size:22px;margin-top:32px}.icon{width:17px;height:17px}.icon--person{width:19px;height:19px}.hero__button{width:100%;min-height:68px;padding-left:30px;font-size:19px}.hero__button b{width:44px;height:44px}
.hero__content{padding-top:0;}
.hero__date-pill{margin-bottom:18px;}
.hero__button{width:100%;}
.hero__date-pill{gap:10px;padding:10px 14px;}
.date-pill__icon{width:16px;height:16px;}
.date-pill__slash{font-size:16px;}
.hero__brandmark{width:46px;height:46px;border-radius:15px}.hero__brandmark svg{width:27px;height:27px}
.hero__eyebrow-text strong{font-size:16px}.hero__eyebrow-text span{font-size:14px}
.hero__date-pill{gap:8px;padding:9px 12px}.hero__date-pill strong,.hero__date-pill .date-pill__text,.hero__date-pill .date-pill__time{font-size:12px}
}
@media(max-width:620px){
.about-speaker{
padding:68px 18px 78px;
border-radius:34px 34px 0 0;
}
.about-speaker__content h2{
font-size:48px;
}
.about-speaker__lead{
font-size:19px;
}
.about-speaker__visual{
min-height:470px;
}
.about-speaker__visual img{
height:450px;
}
.about-speaker__signature{
left:8px;
bottom:18px;
}
.meetings-video,.meetings-gallery{padding:76px 18px 82px;border-radius:34px 34px 0 0}
.meetings-video__main .meetings-video__media{height:340px}
.meetings-video__side{grid-template-columns:1fr}
.meetings-gallery__mosaic{display:grid;grid-template-columns:1fr;grid-template-rows:330px repeat(4,220px)}
.meetings-gallery__photo--1{grid-column:auto}
.venue-section{padding:78px 18px 88px;border-radius:34px 34px 0 0}
.venue-section__layout{grid-template-columns:1fr}
.venue-section__card,.venue-section__place{border-right:0;border-bottom:1px solid rgba(63,84,94,.10)}
.venue-section__time{margin-top:25px}
.venue-section__map{grid-column:auto;min-height:300px}
.site-footer{padding:62px 18px 25px;border-radius:34px 34px 0 0}
.site-footer__inner{grid-template-columns:1fr;gap:30px}
.site-footer__links{grid-column:auto}
.site-footer__bottom{width:100%;gap:18px;flex-direction:column}
.site-footer__inner{
grid-template-columns:1fr !important;
}
.site-footer__inner{grid-template-columns:1fr!important}.site-footer__contact--person{grid-template-columns:76px minmax(0,1fr)}.site-footer__contact-photo{width:76px;height:76px;border-radius:20px}
.venue-section__datebar{align-items:flex-start;flex-direction:column;padding:25px}
.venue-section__placebar{padding:32px 25px 36px}
.venue-contact{width:100%;box-sizing:border-box;align-items:flex-start}
.venue-contact img{width:92px;height:92px;flex-basis:92px}
.venue-contact__links{flex-direction:column;gap:6px}
.site-footer__inner{grid-template-columns:1fr!important}
.site-footer__links{grid-column:auto!important}
.venue-contact{padding:17px!important;gap:18px!important}.venue-contact img{width:104px!important;height:104px!important;flex-basis:104px!important}.venue-contact__links{gap:10px!important}
.venue-contact{min-width:0!important;width:100%!important;padding:18px!important}.venue-contact img{width:108px!important;height:108px!important;flex-basis:108px!important}.venue-contact__copy{min-width:0!important}
}
@media (max-width:600px){
/* section.hero{padding-bottom:26px!important}
.hero__container{
width:calc(100% - 16px)!important;
padding:38px 22px 30px!important;
border-radius:0 0 28px 28px!important;
} */
/* .hero__event-line{
display:grid!important;
grid-template-columns:auto auto auto!important;
justify-content:start!important;
column-gap:8px!important;
row-gap:7px!important;
margin-bottom:24px!important;
font-size:12px!important;
} */
.hero__event-line .event-line__speaker{
grid-column:1/-1!important;
font-size:18px!important;
display: block;
}
/* .hero__event-line .event-line__sep{display:none!important} */
.hero__event-line .event-line__dot{align-self:center!important}
/* .hero h1{
font-size:clamp(50px,12.4vw,64px)!important;
line-height:.92!important;
letter-spacing:-.06em!important;
} */
/* .hero__format{
margin-top:26px!important;
gap:7px!important;
font-size:14px!important;
} */
/* .hero__format-heading{line-height:1.35!important}
.hero__format-days .hero__format-item{
padding-left:15px!important;
line-height:1.4!important;
} */
/* .hero__button{
width:100%!important;
min-height:64px!important;
margin-top:25px!important;
padding-left:26px!important;
font-size:17px!important;
} */
.hero__portrait {
right: -122px !important;
}
.displaydesktop {
display: none !important;
}
.displaymobile {
display: block !important;
}
/* .hero__event-line {
display: block !important;
} */
.hero-title-mobile{
display:block!important;
font-size: 50px;
line-height: 46px;
padding-top: 30px;
}
.hero-title-mobile > span{
display:block!important;
}
.hero-title-mobile__accent{
color:#2385dd!important;
}
.hero__format-heading {
font-weight: 600 !important;
color: #4a6570 !important;
max-width: 230px;
}
.hero h1 {
padding-top: 10px;
}
.hero__format {
margin-top: 30px !important;
}
.takeaway-item__dot {
display: block !important;
}
/* .hero__format-days .hero__format-item b {
display: block;
} */
.takeaway-item:first-of-type .takeaway-item__dot {
left: 0px !important;
top: 26px !important;
}
.takeaway-item__dot {
top: 42px !important;
left: 18px !important;
}
.takeaway-item__num {
display: block !important;
padding-left: 8px !important;
}
.takeaway-section__head {
padding-bottom: 30px !important;
}
.takeaway-item, .takeaway-item:first-of-type, .takeaway-item:last-of-type {
border: none;
}
.mid-cta--speaker .mid-cta__speaker {
position: static !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 440px !important;
}
.mid-cta.mid-cta--speaker {
padding: 65px 24px 25px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 485px;
}
.mid-cta--speaker .mid-cta__ticket {
grid-template-columns: 82px 1fr !important;
}
.mid-cta--speaker .mid-cta__ticket-action {
margin-top: 0px !important;
}
.mid-cta--speaker .mid-cta__ticket {
grid-template-areas: "date meta action" "date title action" !important;
}
.about-speaker--v113 .about-speaker__visual img {
height: 400px !important;
}
.about-speaker__inner {
gap: 0px;
}
.about-speaker {
padding: 70px 24px 65px;
}
.meetings-gallery {
padding: 65px 24px 75px;
}
.venue-contact__copy>span {
font-size: 12px;
margin-top: 15px;
}
.venue-contact__copy>strong {
font-size: 24px !important;
}
.venue-contact__links a {
color: #4053b4;
font-size: 20px;
font-weight: 720;
text-decoration: none;
}
.venue-contact__links--v124 {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
gap: 8px !important;
margin-top: 10px !important;
}
.venue-contact__links--v124 .venue-contact__telegram {
display: block !important;
flex-direction: row !important;
gap: 5px !important;
align-items: baseline !important;
margin-top: 15px;
}
.venue-contact__telegram span {
color: #7c8c93;
display: block;
line-height: 1;
font-weight: 800;
letter-spacing: .13em;
text-transform: uppercase;
font-size: 12px;
margin-bottom: 5px;
}
.site-footer__brand strong {
display: block;
font-size: 26px;
line-height: 1.2;
letter-spacing: -.025em;
}
.site-footer__brand span {
margin-top: 16px;
}
.site-footer__brand span, .site-footer__venue span {
display: block;
margin-top: 20px;
color: rgba(231, 239, 242, .57);
font-size: 20px;
line-height: 1.2;
}
.hero h1 .hero-title-break{
display:none!important;
}
.hero-title-desktop{display:none!important}
.hero-title-mobile{display:inline!important}
.hero-title-mobile__accent{
color:#5968c9;
}
}
@media(max-width:600px){
/* .program-section{
margin-top:-225px;
padding:295px 0 80px;
} */
.program-section__inner{
width:calc(100% - 28px);
}
.program-section__intro h2{
font-size:40px;
}
.program-section__intro h2{font-size:38px!important}
.program-discount{
align-items:flex-start;
}
.venue-section__layout--v133{border-radius:28px!important}
.venue-section__layout--v133 .venue-section__building-photo,
.venue-section__layout--v133 .venue-section__building-photo img{
min-height:270px;
height:270px;
}
.venue-section__info-v133{padding:30px 24px 34px}
.venue-section__date-v133{font-size:15px;margin-bottom:16px}
.venue-section__seminar-v133{font-size:18px;margin-bottom:30px}
.venue-section__place-label-v133{margin-bottom:20px}
.venue-section__address-v133{font-size:30px}
.venue-section__hall-v133{font-size:20px}
.site-footer__contact{width:100%!important}
.site-footer__contact img{width:82px!important;height:82px!important;flex-basis:82px!important}
.site-footer__inner--v135 .site-footer__contact{
min-width:0!important;
width:100%!important;
margin-top:24px!important;
padding:14px!important;
}
.site-footer__inner--v135 .site-footer__contact img{
width:86px!important;
height:86px!important;
flex-basis:86px!important;
}
.site-footer--v136{padding:10px!important}
.site-footer-v136__shell{border-radius:30px}
.site-footer-v136__event{padding:42px 25px 30px}
.site-footer-v136__eyebrow{font-size:10px;margin-bottom:22px}
.site-footer-v136__event>strong{font-size:42px}
.site-footer-v136__speaker{font-size:14px;margin-top:20px}
.site-footer-v136__organizer{margin:0 10px 10px;padding:26px 22px;border-radius:24px}
.site-footer-v136__organizer-head{margin-bottom:22px}
.site-footer-v136__person{align-items:flex-start;gap:18px}
.site-footer-v136__person img{width:88px;height:88px;flex-basis:88px}
.site-footer-v136__person-copy>strong{font-size:22px}
.site-footer-v136__person-copy>span{font-size:12px}
.site-footer-v136__contacts{margin-top:17px;gap:7px}
.site-footer-v136__contacts a{font-size:13px}
.site-footer-v136__bottom{padding:18px 25px 20px;flex-direction:column;gap:6px}
.venue-section__hall-photo{
height:250px;
margin-top:14px;
border-radius:25px;
}
.venue-section__hall-photo figcaption{
left:14px;
bottom:14px;
font-size:11px;
}
.takeaway-section--v140{padding:0 16px 90px!important}
.takeaway-stories{border-radius:28px}
.takeaway-stories,.takeaway-stories__slides{min-height:470px}
.takeaway-stories__progress{left:22px;right:22px;top:25px;gap:6px}
.takeaway-story{padding:68px 27px 36px}
.takeaway-story h3{font-size:39px}
.takeaway-story p{font-size:16px;margin-top:20px}
.takeaway-v140__inner{
padding:0!important;
border-radius:0;
}
.audience-slider{overflow:visible}
.audience-section--v139 .audience-section__inner{overflow:hidden}
.audience-slider .audience-v139__card{
flex-basis:82vw;
width:82vw;
min-height:235px;
}
.audience-slider__footer{margin-top:18px}
.audience-section--v139 {
padding-bottom: 15px !important;
}
.takeaway-section--v140{padding-top:36px!important}
.blocks-bridge{width:calc(100% - 32px);height:76px}
.blocks-bridge__line{height:20px}
.blocks-bridge__label{font-size:9px;padding:7px 12px}
.blocks-bridge{
min-height:72px!important;
padding:8px 16px 0!important;
gap:10px!important;
}
.blocks-bridge__line{width:26px!important;flex-basis:26px!important}
.blocks-bridge__label{font-size:9px!important;padding:0!important}
.takeaway-section--v140{padding-top:18px!important}
}
@media (max-width:577px) {
.takeaway-v139__title h2 {
font-size: 45px;
}
.takeaway-stories, .takeaway-stories__slides {
min-height: 340px;
}
.mid-cta--speaker .mid-cta__speaker {
position: static !important;
height: auto !important;
margin-top: 35px !important;
}
.about-speaker {
padding: 55px 24px 65px;
}
.mid-cta.mid-cta--speaker {
padding: 30px 24px 25px !important;
}
.meetings-video, .meetings-gallery {
padding: 55px 18px 82px;
border-radius: 34px 34px 0 0;
}
.meetings-video__head h2 {
font-size: 48px;
}
.meetings-video__head {
margin-bottom: 40px;
}
.meetings-gallery__head {
margin-bottom: 40px;
}
.venue-section {
padding: 55px 18px 88px;
}
.venue-section__seminar-v133 {
font-size: 30px;
margin-bottom: 30px;
}
}
@media (max-width:560px){
.audience-section__head{
margin-bottom:32px;
}
.audience-section__head h2{
font-size:34px;
}
.audience-card{
padding:27px 24px 26px;
border-radius:22px;
}
.audience-card__number{
margin-bottom:30px;
}
.audience-card h3{
font-size:22px;
}
.audience-panel .audience-card{
padding:29px 24px !important;
}
.audience-panel .audience-card h3{
font-size:23px !important;
}
}
@media (max-width:440px) {
.hero__container {
padding: 50px 20px 20px !important;
}
.hero__portrait {
height: 340px !important;
}
.hero-title-mobile {
font-size: 40px;
line-height: 40px;
}
.program-section {
padding: 55px 0 5px !important;
}
.audience-v139__head h2 {
font-size: 35px;
line-height: 1.05;
}
.audience-section--v139 {
padding: 55px 16px 5px !important;
}
.mid-cta--speaker .mid-cta__ticket {
min-height: 120px !important;
}
.mid-cta--speaker .mid-cta__ticket {
display: block !important;
}
.mid-cta--speaker .mid-cta__ticket-date {
float: left;
margin-right: 15px;
}
.mid-cta--speaker .mid-cta__ticket-meta {
display: block;
padding-top: 10px !important;
}
.mid-cta--speaker .mid-cta__ticket-title {
font-size: 19px !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action {
color: #9f691d !important;
padding-top: 10px !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 350px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 370px;
}
.about-speaker__content h2 {
font-size: 42px;
line-height: 1.1;
}
.about-speaker--v113 .about-speaker__visual img {
height: 300px !important;
}
.about-speaker--v113 .about-speaker__photo-field {
height: 85% !important;
}
.about-speaker--v113 .about-speaker__visual {
min-height: 430px !important;
height: 430px !important;
}
.venue-section {
padding: 55px 18px 15px;
}
.site-footer-v136__person-copy>span {
font-size: 14px;
}
}
@media (max-width:430px){
.hero-title-mobile {
display: block !important;
font-size: 35px;
line-height: 33px;
padding-top: 0px;
}
.hero__event-line {
max-width: 450px !important;
margin-bottom: 28px !important;
line-height: 1.4 !important;
font-size: 15px !important;
}
.hero__event-line .event-line__speaker {
grid-column: 1 / -1 !important;
font-size: 16px !important;
}
.hero__event-line .event-line__speaker {
grid-column: 1 / -1 !important;
font-size: 16px !important;
max-width: 250px;
}
.hero__container {
display: block !important;
width: calc(100% - 20px) !important;
min-height: 0 !important;
padding: 30px 32px 38px !important;
}
.hero__button {
width: 275px !important;
font-size: 15px !important;
min-height: 45px !important;
}
.hero__button b {
border: none;
display: grid;
}
.hero h1 {
padding-top: 15px;
}
.hero__portrait {
right: -82px !important;
height: 288px !important;
}
.hero__format-days {
gap: 4px !important;
padding-top: 0;
max-width: 255px;
}
.audience-section {
padding: 55px 24px 50px;
}
.audience-section__kicker {
max-width: 250px;
margin: 0 auto 15px;
}
.audience-section__head h2 {
font-size: 24px;
line-height: 1.12;
}
.audience-section__head > p {
max-width: 650px;
margin: 22px 0 0;
font-size: 16px;
line-height: 1.45;
}
.program-section {
padding-bottom: 30px !important;
}
.takeaway-section__head h2 {
font-size: 38px !important;
}
.program-section__intro h2 {
font-size: 34px !important;
}
.takeaway-section__head > p {
font-size: 20px !important;
}
.takeaway-item h3 {
max-width: 265px;
margin: 0 0 20px;
font-size: 20px;
line-height: 1.08;
letter-spacing: -.035em;
font-weight: 620;
padding-top: 4px;
}
.mid-cta--speaker .mid-cta__ticket-meta {
grid-area: meta !important;
padding-top: 4px !important;
font-size: 10px !important;
line-height: 1.4 !important;
font-weight: 750 !important;
letter-spacing: .09em !important;
text-transform: uppercase !important;
color: #7b9099 !important;
}
.mid-cta--speaker .mid-cta__ticket {
grid-template-areas: "date meta" "date title" "action action" !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 485px;
margin-top: 25px !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 330px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 370px;
margin-top: 25px !important;
}
.mid-cta--speaker .mid-cta__ticket-title {
font-size: 19px !important;
}
.about-speaker {
padding: 50px 24px 65px;
}
.about-speaker__content h2 {
font-size: 40px;
line-height: 44px;
}
.about-speaker__link {
max-width: 210px;
margin: 15px auto;
display: block;
text-align: center;
}
.about-speaker--v113 .about-speaker__visual img {
height: 280px !important;
}
.about-speaker--v113 .about-speaker__photo-field {
left: 5% !important;
right: 5% !important;
bottom: 0 !important;
height: 90% !important;
border-radius: 150px 150px 34px 34px !important;
}
.about-speaker--v113 .about-speaker__visual {
min-height: 350px !important;
height: 260px !important;
align-self: auto !important;
}
.venue-contact img {
width: 100px !important;
height: 215px !important;
flex-basis: 140px !important;
}
.venue-contact__links a {
color: #4053b4;
font-size: 18px;
}
.venue-contact {
gap: 17px !important;
}
.meetings-video__head h2 {
grid-column: 1;
margin: 0;
color: #fff;
font-size: clamp(46px, 5vw, 76px);
}
.meetings-gallery__head h2 {
margin: 0;
color: #17272e;
font-size: clamp(46px, 5vw, 76px);
}
.venue-section__head h2 {
margin: 0;
color: #17272e;
font-size: clamp(46px, 5vw, 78px);
}
.program-section {
padding-bottom: 5px !important;
}
.audience-section__kicker {
max-width: 250px;
margin: 0 0 15px;
}
.audience-v139__head h2 {
font-size: 34px;
line-height: 1.05;
}
.mid-cta--speaker .mid-cta__stage {
padding: 34px 8px 22px !important;
}
}
@media(max-width:410px) {
.hero__portrait {
right: -96px !important;
height: 288px !important;
}
}
@media(max-width:395px){
.site-footer-v136__event>strong{font-size:38px}
.site-footer-v136__person{display:grid;grid-template-columns:76px 1fr}
.site-footer-v136__person img{width:76px;height:76px}
.hero__container {
display: block !important;
width: calc(100% - 20px) !important;
min-height: 0 !important;
padding: 25px 20px 20px !important;
}
.takeaway-v139__title h2 {
font-size: 42px;
}
.takeaway-v139__title>p {
font-size: 14px;
}
.audience-v139__card h3 {
font-size: 24px;
}
.takeaway-story h3 {
font-size: 32px;
}
}
@media (max-width:375px){
/* .hero__container{
width:calc(100% - 12px)!important;
padding:30px 16px 24px!important;
border-radius:0 0 24px 24px!important;
} */
/* .hero__event-line{font-size:11.5px!important}
.hero__event-line .event-line__speaker{font-size:12.5px!important}
.hero h1{font-size:46px!important;letter-spacing:-.055em!important}
.hero__format{font-size:13px!important}
.hero__button{font-size:16px!important;padding-left:22px!important} */
.hero__format-days {
gap: 4px !important;
padding-top: 0;
max-width: 240px;
}
.hero__portrait {
right: -82px !important;
height: 275px !important;
}
.hero__format-days .hero__format-item b {
display: block;
}
.program-section__kicker {
display: block !important;
padding: 0 !important;
margin-bottom: 10px !important;
}
.program-section__intro h2 {
font-size: 32px !important;
}
.program-day__body h3 {
margin: 0 0 15px !important;
font-size: 24px !important;
}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 700px !important;
font-size: clamp(36px, 3.8vw, 58px) !important;
line-height: 40px !important;
}
.mid-cta--speaker .mid-cta__ticket--gold .mid-cta__ticket-action {
color: #9f691d !important;
margin-top: 10px !important;
}
.mid-cta--speaker .mid-cta__ticket-action {
margin-top: 8px !important;
}
.takeaway-section {
padding: 80px 20px 65px;
}
.venue-contact {
gap: 15px !important;
padding: 0 !important;
background: transparent;
border: none;
box-shadow: none;
}
.venue-contact img {
width: 75px !important;
height: 180px !important;
flex-basis: 125px !important;
}
.venue-contact__links--v124 .venue-contact__telegram {
margin-top: 5px;
}
.hero__portrait {
right: -92px !important;
height: 275px !important;
}
.takeaway-v139__title>p {
font-size: 13px;
}
.takeaway-story h3 {
margin-top: 10px;
}
}
@media (max-width:360px){
.hero__portrait {
right: -92px !important;
height: 275px !important;
}
.program-day__body h3 {
margin: 0 0 15px !important;
font-size: 23px !important;
}
.venue-section__head h2 {
margin: 0;
color: #17272e;
font-size: clamp(40px, 5vw, 78px);
}
.venue-section__head--v122 {
display: block !important;
margin-bottom: 35px !important;
}
.venue-section__datebar {
display: flex;
justify-content: space-between;
gap: 10px;
}
.venue-section__placebar h3 {
margin: 13px 0 12px;
color: #1d3038;
font-size: 25px;
line-height: 1;
letter-spacing: -.045em;
}
.venue-section__placebar p {
margin: 0;
color: #64757d;
font-size: 15px;
line-height: 1.5;
}
.venue-section {
position: relative;
z-index: 8;
margin-top: -28px;
padding: 65px 24px 80px;
}
.about-speaker {
padding: 50px 24px 45px;
}
.takeaway-section {
padding-top: 50px !important;
}
.meetings-video__kicker {
margin-bottom: 5px;
}
}
@media (max-width:340px) {
.takeaway-section {
padding-top: 20px !important;
}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 700px !important;
font-size: clamp(35px, 3.8vw, 58px) !important;
line-height: 40px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 300px;
margin-top: 25px !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 280px !important;
}
.about-speaker--v113 .about-speaker__visual img {
height: 230px !important;
}
.takeaway-stories, .takeaway-stories__slides {
min-height: 370px;
}
}
@media (max-width:320px){
.hero__container {
display: block !important;
width: calc(100% - 20px) !important;
min-height: 0 !important;
padding: 25px 15px 15px !important;
}
.hero h1 {
position: relative !important;
z-index: 3 !important;
max-width: 90% !important;
}
.hero__format-days .hero__format-item {
padding-left: 0px !important;
}
.hero__format-days {
gap: 4px !important;
padding-top: 0;
max-width: 185px;
}
.hero__format-days .hero__format-item:before {
display: none;
}
.audience-v139__card h3 {
font-size: 23px;
}
.hero__portrait {
right: -81px !important;
height: 245px !important;
}
.program-section {
margin: 0 !important;
padding-top: 35px !important;
}
.program-section__intro h2 {
font-size: 28px !important;
}
.program-section__kicker {
font-size: 12px !important;
}
.program-section__intro {
display: block !important;
margin-bottom: 25px !important;
}
.program-day {
padding: 20px 20px 20px !important;
}
.program-day__body h3 {
margin: 0 0 15px !important;
font-size: 20px !important;
}
.program-section {
padding-bottom: 0px !important;
}
.takeaway-section__head h2 {
font-size: 32px !important;
}
.takeaway-item {
padding: 30px 0 36px;
}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 700px !important;
font-size: clamp(34px, 3.8vw, 58px) !important;
line-height: 40px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 320px;
margin-top: 25px !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 279px !important;
}
.about-speaker__lead {
font-size: 18px;
}
.meetings-video__head h2 {
grid-column: 1;
margin: 0;
color: #fff;
font-size: clamp(38px, 5vw, 76px);
}
.meetings-video__head {
margin-bottom: 25px;
}
.meetings-video {
padding: 65px 24px 75px;
}
.meetings-gallery {
padding: 50px 24px 75px;
}
.meetings-gallery__head {
margin-bottom: 25px;
}
.about-speaker--v113 .about-speaker__visual img {
height: 215px !important;
}
.about-speaker--v113 .about-speaker__photo-field {
height: 70% !important;
border-radius: 150px 150px 34px 34px !important;
}
.about-speaker--v113 .about-speaker__visual {
min-height: 300px !important;
height: 260px !important;
align-self: auto !important;
}
.about-speaker--v113 .about-speaker__photo-field {
height: 85% !important;
border-radius: 150px 150px 34px 34px !important;
}
.venue-section__head h2 {
margin: 0;
color: #17272e;
font-size: clamp(37px, 5vw, 78px);
line-height: 1;
}
.venue-contact img {
width: 60px !important;
height: 132px !important;
flex-basis: 94px !important;
}
.mid-cta.mid-cta--speaker {
padding: 25px 20px 25px !important;
}
.mid-cta--speaker .mid-cta__intro h2 {
max-width: 700px !important;
font-size: clamp(33px, 3.8vw, 58px) !important;
line-height: 40px !important;
}
.mid-cta--speaker .mid-cta__speaker img {
height: 238px !important;
}
.mid-cta--speaker .mid-cta__tickets {
padding-bottom: 245px;
margin-top: 25px !important;
}
.venue-section__seminar-v133 {
font-size: 28px;
margin-bottom: 30px;
line-height: 1.2;
}
.venue-section__address-v133 {
font-size: 22px;
line-height: 1.2;
}
}
@media(min-width:901px){
.audience-section--v139 .audience-slider{
width:min(1320px,100%);
margin-left:auto;
margin-right:auto;
}
}
@media (prefers-reduced-motion:reduce){
.mid-cta--speaker .mid-cta__speaker::before,
.mid-cta--speaker .mid-cta__speaker::after{
animation:none !important;
}
}
@media(prefers-reduced-motion:reduce){
.takeaway-story{transition:none}
.takeaway-stories__progress i{animation-duration:1ms!important}
.audience-slider__track{transition:none}
}