@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:800;src:url(/assets/fonts/rubik-latin-800.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:800;src:url(/assets/fonts/rubik-cyrillic-800.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:900;src:url(/assets/fonts/rubik-latin-900.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:900;src:url(/assets/fonts/rubik-cyrillic-900.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:500;src:url(/assets/fonts/barlow-semi-condensed-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:600;src:url(/assets/fonts/barlow-semi-condensed-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/barlow-semi-condensed-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/roboto-condensed-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/roboto-condensed-cyrillic-400.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:600;src:url(/assets/fonts/roboto-condensed-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:600;src:url(/assets/fonts/roboto-condensed-cyrillic-600.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/roboto-condensed-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Roboto Condensed';font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/roboto-condensed-cyrillic-700.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Marck Script';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/marck-script-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Marck Script';font-style:normal;font-display:swap;font-weight:400;src:url(/assets/fonts/marck-script-cyrillic-400.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
:root {
--ink: #15294b;
--paper: #f4f0e8;
--white: #ffffff;
--yellow: #f8d648;
--blue: #1ea5dc;
--orange: #f15a22;
--green: #7cc35a;
--tex: url(/assets/paper.webp);
--star: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27%3E%3Cpath d=%27M50 0C53 33 67 47 100 50C67 53 53 67 50 100C47 67 33 53 0 50C33 47 47 33 50 0Z%27/%3E%3C/svg%3E");
--torn: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1440 60%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0,60 L0,25.6 L6,25.2 L12,28.1 L18,30.0 L24,31.9 L30,29.8 L31,14.5 L35,20.3 L36,29.8 L36,28.3 L42,27.6 L48,30.7 L54,32.3 L60,28.9 L66,25.1 L72,25.2 L78,30.4 L84,26.9 L90,22.2 L96,25.6 L102,23.0 L108,24.1 L114,24.5 L120,24.1 L126,27.2 L132,26.3 L138,25.7 L144,28.5 L150,30.1 L151,14.6 L156,25.4 L158,22.1 L159,30.1 L162,29.2 L168,28.3 L174,30.8 L180,28.9 L186,32.3 L192,32.6 L198,32.3 L204,30.7 L210,32.1 L216,30.3 L222,29.4 L228,32.3 L234,28.6 L240,32.8 L246,30.9 L252,23.9 L258,27.8 L264,23.7 L270,25.1 L276,24.0 L282,18.5 L283,3.0 L288,21.5 L294,20.6 L296,9.1 L297,18.5 L300,22.6 L306,17.4 L312,21.2 L313,13.6 L317,15.7 L318,21.2 L318,16.9 L324,18.5 L330,17.4 L336,22.6 L337,16.0 L341,11.2 L342,22.6 L342,21.0 L348,25.4 L349,17.2 L354,21.9 L360,22.8 L361,19.3 L362,25.4 L366,23.3 L372,20.5 L378,22.1 L384,25.5 L390,21.9 L396,23.3 L402,22.8 L408,24.1 L414,21.7 L420,21.8 L426,22.1 L432,21.2 L438,18.4 L444,21.5 L450,15.9 L456,15.4 L462,14.4 L463,6.6 L468,18.6 L472,8.4 L473,14.4 L474,15.1 L480,13.2 L486,12.5 L492,15.6 L498,12.3 L504,11.9 L510,16.3 L516,12.7 L522,15.2 L528,16.6 L534,16.5 L540,18.3 L546,22.4 L552,19.3 L558,18.8 L564,18.6 L570,23.2 L576,23.9 L582,26.1 L588,25.3 L594,25.9 L600,25.8 L606,26.6 L607,18.0 L612,28.3 L613,21.4 L614,26.6 L618,27.2 L624,28.2 L630,31.9 L636,28.5 L637,17.3 L642,23.6 L643,21.5 L644,28.5 L648,30.5 L654,27.0 L660,23.7 L666,27.4 L672,25.1 L678,23.5 L684,23.3 L690,22.4 L696,24.8 L702,27.3 L708,24.5 L714,26.6 L715,16.4 L720,18.2 L720,30.4 L721,26.6 L726,24.3 L732,28.3 L738,27.9 L744,27.0 L750,27.9 L756,31.0 L762,32.7 L768,31.2 L774,33.0 L780,34.9 L786,34.2 L792,35.6 L798,34.6 L804,34.4 L810,36.9 L811,30.0 L816,33.7 L822,31.9 L823,30.5 L824,36.9 L828,32.4 L834,27.8 L840,28.1 L846,29.6 L852,28.1 L858,29.1 L864,24.7 L870,20.6 L876,27.3 L882,24.7 L888,19.4 L894,24.3 L900,21.0 L906,16.8 L912,19.9 L918,19.8 L919,11.8 L924,24.6 L929,8.1 L930,19.8 L930,19.7 L936,21.2 L942,21.6 L948,21.8 L949,11.2 L954,21.0 L954,16.6 L955,21.8 L960,23.9 L966,26.0 L972,25.2 L978,21.9 L984,21.4 L990,24.0 L996,21.9 L1002,21.7 L1008,18.8 L1014,26.2 L1020,23.1 L1026,18.2 L1032,21.4 L1038,21.5 L1044,12.4 L1050,15.6 L1056,15.2 L1062,16.9 L1068,14.6 L1074,14.0 L1075,-1.6 L1080,4.7 L1080,14.1 L1081,14.0 L1086,18.2 L1092,19.0 L1093,6.7 L1098,13.3 L1101,14.3 L1102,19.0 L1104,12.9 L1110,21.4 L1111,14.4 L1114,11.9 L1115,21.4 L1116,14.0 L1122,15.8 L1128,18.0 L1134,20.0 L1140,22.2 L1146,21.8 L1152,20.0 L1158,24.0 L1164,24.3 L1170,28.7 L1176,25.2 L1182,22.8 L1188,23.8 L1194,29.5 L1200,25.3 L1206,21.8 L1212,25.0 L1218,26.0 L1224,28.3 L1230,23.1 L1236,26.4 L1242,26.3 L1248,22.6 L1254,23.4 L1260,27.5 L1266,27.2 L1272,25.3 L1278,24.2 L1284,26.2 L1290,23.8 L1296,24.4 L1302,23.3 L1308,25.9 L1314,26.6 L1320,33.7 L1326,28.1 L1332,32.3 L1338,33.3 L1344,30.8 L1350,34.6 L1356,27.9 L1362,33.4 L1363,22.8 L1368,35.5 L1374,28.6 L1375,25.9 L1376,33.4 L1380,31.4 L1386,36.2 L1392,33.1 L1398,30.8 L1404,31.8 L1410,30.7 L1416,32.7 L1422,31.2 L1428,28.6 L1434,26.8 L1440,27.2 L1440,60 Z%27/%3E%3C/svg%3E");
--bw: 3px;
--shadow-sm: 4px 4px 0 var(--ink);
--shadow: 6px 6px 0 var(--ink);
--shadow-lg: 10px 10px 0 var(--ink);
--f-display: 'Rubik', 'Arial Black', sans-serif;
--f-body: 'Barlow Semi Condensed', 'Roboto Condensed', 'Arial Narrow', sans-serif;
--f-script: 'Marck Script', 'Brush Script MT', cursive;
--fs-body: 1.1875rem;
--fs-small: 1.0625rem;
--fs-h1: clamp(2.55rem, 0.9rem + 6.5vw, 7rem);
--fs-h2: clamp(1.85rem, 1.05rem + 2.9vw, 3.5rem);
--fs-h3: clamp(1.2rem, 1.05rem + 0.5vw, 1.45rem);
--gutter: 16px;
--container: 1240px;
--section-y: clamp(3.75rem, 2.4rem + 5vw, 7.5rem);
--header-h: 68px;
--sticky-h: 0px;
}
html[lang='ru'] { --f-body: 'Roboto Condensed', 'Arial Narrow', sans-serif; --fs-h1: clamp(2.55rem, 1rem + 5.6vw, 6.3rem); --fs-h2: clamp(1.65rem, 1rem + 2.4vw, 3rem); }
@media (min-width: 720px) { :root { --gutter: 32px; --fs-body: 1.25rem; } }
@media (min-width: 1024px) { :root { --header-h: 84px; } }
@media (max-width: 1023.98px) { :root { --sticky-h: 76px; } }
html[lang='en'] [data-l='ru'],
html[lang='ru'] [data-l='en'],
html[lang='en'] [data-only='ru'],
html[lang='ru'] [data-only='en'] { display: none !important; }
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); }
body {
font-family: var(--f-body); font-weight: 500;
font-size: var(--fs-body); line-height: 1.5;
color: var(--ink); background: var(--paper);
padding-bottom: var(--sticky-h);
overflow-x: hidden;
}
html[lang='ru'] body { font-weight: 400; }
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after { animation: none !important; transition: none !important; }
}
.container { position: relative; width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.section {
position: relative; isolation: isolate; overflow: hidden;
padding-block: var(--section-y);
background-color: var(--bg, var(--paper));
background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light;
}
.bg-paper { --bg: var(--paper); }
.bg-yellow { --bg: var(--yellow); }
.bg-blue { --bg: var(--blue); }
.bg-ink { --bg: var(--ink); color: var(--paper); }
.bg-orange { --bg: var(--orange); }
.torn {
margin-top: -30px;
-webkit-mask: var(--torn) top / 100% 34px no-repeat, linear-gradient(#000 0 0) 0 32px / 100% 100% no-repeat;
mask: var(--torn) top / 100% 34px no-repeat, linear-gradient(#000 0 0) 0 32px / 100% 100% no-repeat;
}
.section.torn { padding-top: calc(var(--section-y) + 30px); }
.trust.torn { padding-top: 30px; }
.star {
position: absolute; z-index: 0; pointer-events: none;
left: var(--x); top: var(--y); width: var(--s, 40px); aspect-ratio: 1;
background: var(--c, var(--blue));
-webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat;
transform: rotate(var(--r, 0deg));
}
.star--y { --c: var(--yellow); } .star--o { --c: var(--orange); } .star--g { --c: var(--green); }
.star--w { --c: var(--white); } .star--i { --c: var(--ink); }
.star.hide-m { display: none; }
@media (min-width: 900px) { .star.hide-m { display: block; } }
.grid-patch {
position: absolute; z-index: 0; pointer-events: none;
left: var(--x); top: var(--y); width: var(--w, 320px); height: var(--h, 220px);
background:
repeating-linear-gradient(90deg, transparent 0 55px, rgb(21 41 75 / 22%) 55px 56px),
repeating-linear-gradient(0deg, transparent 0 55px, rgb(21 41 75 / 22%) 55px 56px);
-webkit-mask: radial-gradient(closest-side, #000 55%, transparent); mask: radial-gradient(closest-side, #000 55%, transparent);
}
.bg-ink .grid-patch, .bg-blue .grid-patch {
background:
repeating-linear-gradient(90deg, transparent 0 55px, rgb(255 255 255 / 22%) 55px 56px),
repeating-linear-gradient(0deg, transparent 0 55px, rgb(255 255 255 / 22%) 55px 56px);
}
.section > .container { z-index: 1; }
.h1, .h2 {
font-family: var(--f-display); font-weight: 900;
text-transform: uppercase; line-height: 1; letter-spacing: -0.012em;
text-wrap: balance;
}
.h1 { font-size: var(--fs-h1); }
.h2 { font-size: var(--fs-h2); max-width: 20ch; }
html[lang='ru'] .h2 { max-width: 22ch; }
.h3 { font-family: var(--f-display); font-weight: 800; font-size: var(--fs-h3); line-height: 1.18; letter-spacing: -0.01em; }
.lead { font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); line-height: 1.45; max-width: 36em; }
.section-head { display: grid; gap: 1.1rem; margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.section-head p { max-width: 40em; }
.outline {
-webkit-text-stroke: 0.09em var(--ink); paint-order: stroke fill;
text-shadow: 0.045em 0.055em 0 var(--ink);
}
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
min-height: 56px; padding: 0.8rem 1.5rem;
font-family: var(--f-body); font-weight: 700; font-size: 1.1875rem; line-height: 1.2;
text-transform: uppercase; letter-spacing: 0.02em;
text-decoration: none; text-align: center;
border: var(--bw) solid var(--ink); border-radius: 0;
box-shadow: var(--shadow-sm);
transition: transform 0.08s ease, box-shadow 0.08s ease;
}
.btn:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink); }
.btn:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--ink); }
.btn--primary { background: var(--orange); color: var(--white); }
.btn--ink { background: var(--ink); color: var(--paper); box-shadow: 4px 4px 0 var(--paper); }
.btn--ink:hover { box-shadow: 6px 6px 0 var(--paper); }
.btn--light { background: var(--white); color: var(--ink); }
.btn--small { min-height: 46px; padding: 0.5rem 1.05rem; font-size: 1.0625rem; white-space: nowrap; }
.site-header {
position: sticky; top: 0; z-index: 50;
background-color: var(--paper); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light;
border-bottom: 2px solid var(--ink);
}
.site-header__bar { display: flex; align-items: center; gap: 1rem; height: var(--header-h); }
.logo { display: block; flex: none; margin-right: auto; }
.logo picture { display: block; }
.logo img { display: block; height: 38px; width: auto; }
@media (max-width: 399.98px) { .logo img { height: 33px; } }
@media (max-width: 339.98px) { .logo img { height: 29px; } }
@media (min-width: 640px) { .logo img { height: 40px; } }
@media (min-width: 1024px) { .logo img { height: 46px; } }
.nav { display: none; }
.nav__link {
position: relative; display: inline-flex; align-items: center; gap: 0.45rem;
padding: 0.55rem 0.85rem; text-decoration: none; white-space: nowrap; border: 0; background: none;
font-family: var(--f-body); font-weight: 700; font-size: 1.125rem; text-transform: uppercase; letter-spacing: 0.02em; color: var(--ink);
}
.nav__link::before {
content: ''; width: 0.8em; height: 0.8em; background: var(--ink);
-webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat;
}
.scribble { position: absolute; inset: -4px -10px; width: calc(100% + 20px); height: calc(100% + 8px); overflow: visible; pointer-events: none; }
.scribble path {
fill: none; stroke: var(--ink); stroke-width: 2.8; stroke-linecap: round; vector-effect: non-scaling-stroke;
stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 0.45s ease-out;
}
.nav__link:hover .scribble path, .nav__link:focus-visible .scribble path, .nav__link[aria-current] .scribble path, .nav__item.is-open .scribble path { stroke-dashoffset: 0; }
.nav__link:focus-visible { outline: none; }
.nav__chev { width: 0.5em; height: 0.5em; border-right: 3px solid currentColor; border-bottom: 3px solid currentColor; transform: translateY(-0.15em) rotate(45deg); transition: transform 0.15s ease; }
.nav__item { position: relative; }
.nav__item.is-open .nav__chev { transform: translateY(0.1em) rotate(-135deg); }
.nav__menu {
position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; min-width: 270px; display: none; padding: 0.4rem;
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow);
}
.nav__item.is-open .nav__menu { display: grid; }
@media (hover: hover) { .nav__item:hover .nav__menu { display: grid; } .nav__item:hover::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 10px; } }
.nav__menu a { display: flex; align-items: center; gap: 0.6rem; padding: 0.55rem 0.7rem; font-weight: 700; font-size: 1.0625rem; text-decoration: none; white-space: nowrap; }
.nav__menu a svg { width: 28px; height: 28px; flex: none; fill: none; stroke: var(--ink); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.nav__menu a svg .f { fill: var(--yellow); }
.nav__menu a:hover, .nav__menu a[aria-current] { background: var(--yellow); }
.nav__menu .nav__all { margin-top: 0.25rem; border-top: 2px dashed var(--ink); color: var(--orange); }
.header-phone { display: none; font-weight: 700; font-size: 1.125rem; text-decoration: none; white-space: nowrap; }
.header-cta { display: none; }
.lang { display: inline-flex; border: var(--bw) solid var(--ink); box-shadow: 3px 3px 0 var(--ink); flex: none; background: var(--white); }
.lang button {
min-width: 44px; min-height: 38px; padding: 0 0.55rem; border: 0; background: transparent;
font-family: var(--f-display); font-weight: 800; font-size: 0.875rem; letter-spacing: 0.03em;
}
.lang button + button { border-left: var(--bw) solid var(--ink); }
.lang button[aria-pressed='true'] { background: var(--ink); color: var(--paper); }
.burger {
display: inline-flex; align-items: center; justify-content: center;
width: 46px; height: 44px; border: var(--bw) solid var(--ink); background: var(--yellow);
box-shadow: 3px 3px 0 var(--ink);
}
.burger span, .burger span::before, .burger span::after { display: block; width: 20px; height: 3px; background: var(--ink); position: relative; content: ''; }
.burger span::before { position: absolute; top: -7px; }
.burger span::after { position: absolute; top: 7px; }
.burger[aria-expanded='true'] span { background: transparent; }
.burger[aria-expanded='true'] span::before { top: 0; transform: rotate(45deg); }
.burger[aria-expanded='true'] span::after { top: 0; transform: rotate(-45deg); }
.mobile-menu { display: none; border-top: 2px solid var(--ink); background: var(--yellow); }
.mobile-menu.is-open { display: block; }
.mobile-menu nav { display: grid; }
.mobile-menu nav a {
display: flex; align-items: center; gap: 0.6rem;
font-family: var(--f-display); font-weight: 900; font-size: 1.375rem; text-transform: uppercase;
text-decoration: none; padding: 0.95rem var(--gutter); border-bottom: 2px solid var(--ink);
}
.mobile-menu nav a::before {
content: ''; width: 0.75em; height: 0.75em; background: var(--blue);
-webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat;
}
.mobile-menu__group { padding: 0.9rem var(--gutter) 0.3rem; font-family: var(--f-display); font-weight: 900; font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.04em; color: rgb(21 41 75 / 65%); }
.mobile-menu__sub { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 2px solid var(--ink); padding-bottom: 0.4rem; }
.mobile-menu nav .mobile-menu__sub a { font-family: var(--f-body); font-weight: 700; font-size: 1.0625rem; text-transform: none; padding: 0.5rem var(--gutter); border-bottom: 0; }
.mobile-menu nav .mobile-menu__sub a::before { width: 0.6em; height: 0.6em; background: var(--orange); }
.mobile-menu nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 4px; }
.mobile-menu__foot { display: grid; gap: 0.5rem; padding: 1.25rem var(--gutter) 1.5rem; }
.mobile-menu__foot a.phone { font-weight: 700; font-size: 1.375rem; }
@media (min-width: 1024px) {
.nav { display: flex; gap: 0.2rem; margin-right: 0.5rem; }
.header-phone, .header-cta { display: inline-flex; }
.burger, .mobile-menu { display: none !important; }
}
@media (min-width: 1024px) and (max-width: 1359.98px) {
.header-phone { display: none; }
}
@media (min-width: 1024px) and (max-width: 1439.98px) {
.nav__link { padding-inline: 0.5rem; font-size: 1.0625rem; }
}
@media (min-width: 1024px) and (max-width: 1199.98px) {
.site-header__bar { gap: 0.6rem; }
.nav { gap: 0; margin-right: 0.25rem; }
.nav__link { padding-inline: 0.4rem; font-size: 1rem; gap: 0.3rem; }
.nav__link::before { display: none; }
}
.hero { position: relative; isolation: isolate; overflow: hidden; background-color: var(--paper); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light; }
.hero::after {
content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none;
background: var(--tex); background-size: 1100px; mix-blend-mode: soft-light; opacity: 0.6;
}
.hero__head { position: relative; z-index: 2; padding-top: clamp(1.75rem, 1rem + 3vw, 3.25rem); text-align: center; }
.hero__title { display: grid; justify-items: center; gap: 0.02em; }
.hero__title span { display: block; }
.hero__title .t1 { color: var(--blue); }
.hero__title .t2 { color: var(--yellow); }
.hero__title .t3 {
margin-top: 0.42em; font-size: max(1.15rem, 0.34em); line-height: 1.1; letter-spacing: 0.01em;
color: var(--ink); max-width: 28ch;
}
@media (min-width: 1024px) { html[lang='ru'] .hero__title .t3 { font-size: 0.5em; max-width: none; } }
.hero__band {
position: relative; z-index: 1;
margin-top: calc(var(--fs-h1) * -0.62);
padding-top: calc(var(--fs-h1) * 0.62 + 2.25rem);
padding-bottom: clamp(3rem, 2rem + 4vw, 5.5rem);
background-color: var(--yellow); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light;
-webkit-mask: var(--torn) top / 100% 40px no-repeat, linear-gradient(#000 0 0) 0 38px / 100% 100% no-repeat;
mask: var(--torn) top / 100% 40px no-repeat, linear-gradient(#000 0 0) 0 38px / 100% 100% no-repeat;
}
.hero__row { display: grid; gap: 2.5rem; align-items: center; }
.hero__lead { display: grid; gap: 1.4rem; align-content: start; }
.hero__cta { display: grid; gap: 0.85rem; justify-items: start; }
.hero__note { font-size: var(--fs-small); max-width: 34em; }
.btn--big { min-height: 64px; padding: 1rem 1.75rem; font-size: clamp(1.15rem, 1.05rem + 0.4vw, 1.375rem); }
.ticks { list-style: none; padding: 0; display: grid; gap: 0.55rem; }
.ticks li { position: relative; padding-left: 1.85rem; font-weight: 700; line-height: 1.35; }
.ticks li::before {
content: ''; position: absolute; left: 0; top: 0.12em; width: 1.2em; height: 1.2em; background: var(--blue);
-webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat;
}
.ticks--dark li::before { background: var(--orange); }
@media (min-width: 1024px) {
.hero__row { grid-template-columns: 0.92fr 1.08fr; gap: 3.5rem; }
}
.drake { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(0.9rem, 0.5rem + 1.5vw, 1.75rem); align-items: start; }
.drake .grid-patch { --x: -10%; --y: -8%; --w: 120%; --h: 116%; }
.drake__card { position: relative; z-index: 1; display: grid; gap: 0.9rem; }
.drake__card img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.drake__card--no { transform: rotate(-2deg); }
.drake__card--yes { transform: rotate(1.8deg); margin-top: 1.5rem; }
.drake__pic { position: relative; container-type: inline-size; }
.hero__art { container-type: inline-size; }
.adson {
position: absolute; right: 4%; bottom: 4.5%; z-index: 2; margin: 0;
display: flex; align-items: center; gap: clamp(5px, 2.4cqw, 11px);
padding: clamp(4px, 1.7cqw, 8px) clamp(7px, 3cqw, 14px);
background: var(--white); border: 2px solid var(--ink); border-radius: 999px; box-shadow: 3px 3px 0 var(--ink);
transform: rotate(-3deg);
}
.drake__card .adson img, .phero__art .adson img { display: block; width: auto; height: clamp(14px, 6.2cqw, 28px); aspect-ratio: auto; object-fit: contain; background: none; border: 0; box-shadow: none; }
.adson__label { font-family: var(--f-display); font-weight: 900; font-size: clamp(0.6rem, 3.1cqw, 0.9rem); line-height: 1; text-transform: uppercase; letter-spacing: 0.02em; white-space: nowrap; }
@container (max-width: 240px) { .adson__label { display: none; } }
.hero__art .adson { gap: clamp(4px, 1.7cqw, 9px); padding: clamp(4px, 1.2cqw, 7px) clamp(7px, 2.2cqw, 12px); }
.hero__art .adson img { height: clamp(14px, 4.6cqw, 24px); }
.hero__art .adson__label { font-size: clamp(0.6rem, 2.4cqw, 0.8rem); }
@container (max-width: 440px) { .hero__art .adson__label { display: none; } }
.drake__card figcaption {
display: grid; gap: 0.15rem; padding: 0.55rem 0.75rem 0.6rem;
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm);
}
.drake__card figcaption b { display: flex; align-items: center; gap: 0.4rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(0.95rem, 0.85rem + 0.4vw, 1.15rem); line-height: 1.1; }
.drake__card figcaption span { font-size: 0.9375rem; font-weight: 600; line-height: 1.25; }
.mark { flex: none; display: grid; place-items: center; width: 1.35em; height: 1.35em; border: 2px solid var(--ink); border-radius: 50%; font-size: 0.85em; font-style: normal; color: var(--white); }
.mark--no { background: var(--orange); }
.mark--yes { background: var(--green); }
.trust { position: relative; isolation: isolate; background-color: var(--ink); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light; color: var(--paper); }
.trust__grid { display: grid; grid-template-columns: repeat(2, 1fr); }
.trust__item { padding: 1.4rem 0.9rem 1.5rem; border-right: 2px dashed rgb(244 240 232 / 45%); border-bottom: 2px dashed rgb(244 240 232 / 45%); }
.trust__item:nth-child(2n) { border-right: 0; }
.trust__item:nth-child(n + 3) { border-bottom: 0; }
.trust__value { font-family: var(--f-display); font-weight: 900; font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); color: var(--yellow); line-height: 1; }
.trust__label { margin-top: 0.45rem; font-size: var(--fs-small); line-height: 1.3; max-width: 16em; }
@media (min-width: 900px) {
.trust__grid { grid-template-columns: repeat(4, 1fr); }
.trust__item { border-bottom: 0; padding: 1.9rem 1.5rem; }
.trust__item:nth-child(2n) { border-right: 2px dashed rgb(244 240 232 / 45%); }
.trust__item:last-child { border-right: 0; }
}
.ticker { background-color: var(--orange); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light; border-block: var(--bw) solid var(--ink); overflow: hidden; }
.ticker__track { display: flex; width: max-content; animation: ticker 52s linear infinite; }
.ticker__list { display: flex; align-items: center; flex: none; list-style: none; padding: 0; }
.ticker__list li {
display: flex; align-items: center; gap: 1.4rem; padding: 0.9rem 0 0.95rem 1.4rem;
font-family: var(--f-display); font-weight: 900; font-size: clamp(1.1rem, 0.9rem + 0.9vw, 1.7rem);
text-transform: uppercase; white-space: nowrap; color: var(--white);
-webkit-text-stroke: 0.08em var(--ink); paint-order: stroke fill;
}
.ticker__list li::after {
content: ''; width: 1.05em; height: 1.05em; flex: none; background: var(--yellow);
-webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat;
}
.ticker:hover .ticker__track { animation-play-state: paused; }
@keyframes ticker { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
.ticker__track { width: auto; }
.ticker__list { flex-wrap: wrap; }
.ticker__list[aria-hidden='true'] { display: none; }
}
.fork__head .h2 { max-width: none; }
.fork__head .lead { max-width: 52em; }
.fork__art { margin: 0 0 clamp(2rem, 1.5rem + 2vw, 3.5rem); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); background: var(--white); transform: rotate(-0.4deg); }
.fork__zoom { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.fork__art img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.fork__hint {
position: absolute; right: 10px; bottom: 10px; padding: 0.35rem 0.7rem;
font-weight: 700; font-size: 0.9375rem; color: var(--ink); background: var(--yellow); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
}
@media (min-width: 900px) { .fork__hint { display: none; } }
.zoom { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgb(21 41 75 / 94%); }
.zoom::backdrop { background: rgb(21 41 75 / 60%); }
.zoom__scroll { width: 100%; height: 100%; overflow: auto; overscroll-behavior: contain; }
.zoom__scroll img { display: block; height: 100%; width: auto; max-width: none; margin: 0 auto; }
.zoom__close {
position: fixed; top: 12px; right: 12px; z-index: 2; width: 48px; height: 48px;
font-size: 2rem; line-height: 1; color: var(--ink); background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: 3px 3px 0 var(--ink); cursor: pointer;
}
.fork-card__way { display: flex; align-items: center; gap: 0.4rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.25rem; letter-spacing: 0.02em; }
.fork-card__way span { font-family: var(--f-body); font-size: 1.8em; line-height: 0.8; }
.fork-card__note { font-weight: 700; color: #c4320a; }
.fork__grid { display: grid; gap: 1.75rem; }
.fork-card { position: relative; display: grid; gap: 1rem; align-content: start; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.fork-card--agency { background: #bfe6f7; }
.fork-card--club { background: var(--white); }
.fork-card .h2 { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.8rem); }
.fork-card ul { padding-left: 1.2rem; display: grid; gap: 0.45rem; }
.fork-card .btn { justify-self: start; margin-top: 0.5rem; }
.tag { justify-self: start; font-weight: 700; font-size: 1rem; padding: 0.2rem 0.65rem; border: 2px solid var(--ink); background: var(--yellow); transform: rotate(-2deg); }
@media (min-width: 800px) { .fork__grid { grid-template-columns: 1fr 1fr; } }
.pimg {
position: relative; display: grid; place-items: center; align-content: center; gap: 0.6rem; overflow: hidden;
border: var(--bw) solid var(--ink); background: var(--pc, var(--yellow)); text-align: center; padding: 1rem;
}
.pimg::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, transparent 0 14px, rgb(21 41 75 / 7%) 14px 16px); }
.pimg svg { position: relative; width: 56px; height: 56px; fill: none; stroke: var(--ink); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.pimg svg .f { fill: var(--white); }
.pimg span { position: relative; color: var(--ink); font-weight: 700; font-size: 0.9375rem; line-height: 1.25; padding: 0.3rem 0.6rem; background: var(--white); border: 2px dashed var(--ink); max-width: 90%; }
.pimg--c0 { --pc: var(--yellow); } .pimg--c1 { --pc: var(--orange); } .pimg--c2 { --pc: var(--green); } .pimg--c3 { --pc: var(--paper); }
.pimg--agency { --pc: #c9c3b6; }
.stack { list-style: none; padding: 0; display: grid; gap: 2rem; }
.pain {
position: sticky; top: calc(var(--header-h) + 14px + var(--i) * 14px);
display: grid; gap: 1rem; padding: 12px 12px 16px;
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow);
}
.pain .pimg { aspect-ratio: 4 / 3; }
.pain__img { border: var(--bw) solid var(--ink); background: var(--paper); }
.pain__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 899.98px) {
.pain { position: relative; top: auto; }
}
.pain__text { display: grid; gap: 0.55rem; align-content: start; padding-inline: 0.25rem; }
.pain__n { font-family: var(--f-display); font-weight: 900; font-size: 1.05rem; color: var(--orange); }
.pain__n span { color: rgb(21 41 75 / 45%); }
.pain .h3 { font-weight: 900; text-transform: uppercase; font-size: clamp(1.1rem, 1rem + 0.6vw, 1.5rem); }
.pain q { display: block; font-family: var(--f-display); font-weight: 700; font-size: clamp(0.98rem, 0.9rem + 0.4vw, 1.2rem); line-height: 1.35; padding-left: 0.9rem; border-left: 5px solid var(--yellow); quotes: '“' '”' '‘' '’'; }
html[lang='ru'] .pain q { quotes: '«' '»' '„' '“'; }
.pain__why { font-size: 1rem; line-height: 1.45; }
.pain__why b { display: block; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.02em; color: var(--blue); }
@media (min-width: 900px) {
.stack { gap: 3rem; }
.pain { grid-template-columns: 0.85fr 1.15fr; gap: 2rem; padding: 20px; align-items: center; }
.pain .pimg { aspect-ratio: 4 / 3; }
.pain__why { font-size: 1.125rem; }
}
@media (max-height: 760px) { .pain { position: relative; top: auto; } }
.pains__closer {
margin-top: 3rem; display: grid; gap: 0.6rem; max-width: 52rem;
background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); transform: rotate(-0.8deg);
}
.pains__closer-title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.4rem); line-height: 1; }
.pains__closer p:last-child { font-size: clamp(1.15rem, 1.05rem + 0.4vw, 1.375rem); font-weight: 600; }
.chain__list { list-style: none; padding: 0; border-top: var(--bw) solid var(--ink); }
.chain__row { display: grid; gap: 1rem; padding-block: 1.6rem; border-bottom: var(--bw) solid var(--ink); }
.chain__num { font-family: var(--f-display); font-weight: 900; font-size: clamp(3.2rem, 2.4rem + 3vw, 5.5rem); line-height: 0.85; color: var(--blue); }
.chain__row:nth-child(2) .chain__num { color: var(--yellow); }
.chain__row:nth-child(3) .chain__num { color: var(--orange); }
.chain__row:nth-child(4) .chain__num { color: var(--green); }
.chain__row:nth-child(5) .chain__num { color: var(--white); }
.chain__body { display: grid; gap: 0.5rem; max-width: 44em; }
@media (min-width: 900px) { .chain__row { grid-template-columns: 7.5rem 1fr; gap: 2rem; align-items: center; } }
.section-head--row { display: grid; gap: 1.25rem; align-items: end; }
@media (min-width: 800px) { .section-head--row { grid-template-columns: 1fr auto; } }
.car-nav { display: flex; gap: 0.6rem; }
.car-nav button {
width: 52px; height: 52px; display: grid; place-items: center;
font-family: var(--f-display); font-weight: 900; font-size: 1.4rem;
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm);
}
.car-nav button:hover { background: var(--ink); color: var(--white); }
.car-nav button:disabled { opacity: 0.35; cursor: default; background: var(--white); color: var(--ink); }
.scroller {
list-style: none; padding: 6px 4px 18px; margin: 0 -4px;
display: flex; gap: 1.25rem; overflow-x: auto; overscroll-behavior-x: contain;
scroll-snap-type: x mandatory; scroll-padding-left: 4px; scrollbar-width: none;
}
.scroller::-webkit-scrollbar { display: none; }
.scroller > li { scroll-snap-align: start; flex: none; }
.trades__head { display: grid; gap: 0.75rem; }
.trades__head .h2, .trades__head .lead { max-width: none; }
.trades__tag {
justify-self: start; padding: 0.3rem 0.8rem; transform: rotate(-2deg);
font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; letter-spacing: 0.02em;
color: var(--white); background: var(--ink); box-shadow: 3px 3px 0 var(--orange);
}
.trades__grid {
list-style: none; padding: 0; margin: 0;
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem;
}
.trade-card {
position: relative; display: grid; align-content: start; background: var(--white);
border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm);
transform: rotate(var(--r, 0deg)); transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.trade-card img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-bottom: var(--bw) solid var(--ink); }
.trade-card__name {
padding: 0.6rem 0.7rem 0.7rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase;
font-size: clamp(0.92rem, 0.8rem + 0.45vw, 1.15rem); line-height: 1.1;
}
.trade-card--cta {
align-content: center; gap: 0.7rem; padding: 1rem; color: var(--white); background: var(--ink);
transform: none; text-align: left;
}
.trade-card--cta p { font-size: 1rem; line-height: 1.35; }
.trade-card--cta .trade-card__q { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.1rem, 0.95rem + 0.7vw, 1.6rem); line-height: 1.05; color: var(--yellow); }
.trade-card--cta .btn { justify-self: stretch; white-space: normal; text-align: center; padding-inline: 0.6rem; }
@media (max-width: 639.98px) { .trade-card--cta { padding: 0.8rem; } .trade-card--cta p { font-size: 0.9375rem; } }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
.trade-card:not(.trade-card--cta):hover { transform: rotate(0deg) translateY(-4px) scale(1.03); box-shadow: var(--shadow-lg); z-index: 2; }
}
@media (min-width: 640px) { .trades__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } .trade-card--cta { grid-column: span 3; } .trade-card--cta .btn { justify-self: start; } }
@media (min-width: 1024px) { .trades__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6rem; } .trade-card--cta { grid-column: auto; } .trade-card--cta .btn { justify-self: stretch; } }
.why .h2 { color: var(--paper); }
.compare { border: var(--bw) solid var(--paper); }
.compare__head { display: none; }
.compare__row { display: grid; grid-template-columns: 1fr 1fr; border-bottom: var(--bw) solid var(--paper); }
.compare__row:last-child { border-bottom: 0; }
.compare__label { grid-column: 1 / -1; padding: 0.9rem 1rem; font-weight: 700; background: rgb(244 240 232 / 8%); }
.compare__cell { padding: 0.9rem 1rem; display: grid; gap: 0.15rem; }
.compare__cell small { font-size: 0.875rem; font-weight: 700; opacity: 0.8; }
.compare__cell--them { color: rgb(244 240 232 / 75%); }
.compare__cell--us { background: var(--yellow); color: var(--ink); font-weight: 700; border-left: var(--bw) solid var(--paper); }
@media (min-width: 900px) {
.compare__head, .compare__row { display: grid; grid-template-columns: 1fr 1.1fr 1.1fr; }
.compare__head { border-bottom: var(--bw) solid var(--paper); }
.compare__head div { padding: 1rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.05rem; }
.compare__head div + div { border-left: var(--bw) solid var(--paper); }
.compare__head div:last-child { background: var(--yellow); color: var(--ink); }
.compare__label { grid-column: auto; }
.compare__cell small { display: none; }
.compare__cell--them { border-left: var(--bw) solid var(--paper); }
}
.ai-note { margin-top: 2rem; max-width: 46em; padding-left: 1.2rem; border-left: 6px solid var(--blue); }
.versus { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; }
.versus__card { display: grid; gap: 0.6rem; }
.versus__card img, .versus__card .pimg { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center 20%; border: var(--bw) solid var(--paper); }
.versus__card--us img { box-shadow: 8px 8px 0 var(--yellow); }
.versus__card figcaption { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1rem, 0.9rem + 0.5vw, 1.3rem); }
.versus__card--us figcaption { color: var(--yellow); }
.versus__vs {
position: absolute; z-index: 2; left: 50%; top: 38%; transform: translate(-50%, -50%) rotate(-8deg);
width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%;
font-family: var(--f-display); font-weight: 900; font-size: 1.4rem; color: var(--ink);
background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: 4px 4px 0 var(--orange);
}
@media (min-width: 900px) {
.versus { grid-template-columns: 1fr 1.1fr 1.1fr; gap: 0; }
.versus__card { padding: 0 1rem; }
.versus__card--them { grid-column: 2; }
.versus__card--us { grid-column: 3; }
.versus__vs { left: calc((1 + 1.1) / 3.2 * 100%); top: 42%; width: 84px; height: 84px; font-size: 1.8rem; }
}
.feature { display: grid; gap: 1.75rem; background: var(--paper); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); padding: clamp(1.1rem, 0.8rem + 2vw, 2.5rem); }
.feature__head { display: grid; gap: 1.5rem; }
.feature__head > div { display: grid; gap: 0.75rem; }
.kicker { font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--orange); }
.feature .h2 { font-size: clamp(1.6rem, 1.1rem + 2.2vw, 3rem); }
.case__stats { display: grid; gap: 1rem; }
.stat { display: grid; gap: 0.35rem; align-content: start; padding: 1rem 1.2rem 1.1rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.stat b { font-family: var(--f-display); font-weight: 900; font-size: clamp(2.1rem, 1.5rem + 2.4vw, 3.5rem); line-height: 1; color: var(--ink); }
.stat span { font-weight: 700; line-height: 1.3; }
.case__quote { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.1rem, 1rem + 0.7vw, 1.45rem); line-height: 1.2; max-width: 20ch; padding: 1rem 1.2rem; background: var(--ink); color: var(--yellow); justify-self: start; transform: rotate(-1.5deg); box-shadow: 6px 6px 0 var(--orange); }
.feature__built { display: grid; gap: 0.75rem; }
.feature__built-title, .proof__title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.15rem; }
@media (min-width: 720px) { .case__stats { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; } .feature__built .ticks { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }
@media (min-width: 1024px) { .feature__head { grid-template-columns: 1.4fr 0.6fr; align-items: end; gap: 3rem; } .case__quote { justify-self: end; } }
.proof { display: grid; gap: 1rem; padding-top: 1.5rem; border-top: 3px dashed var(--ink); }
.proof__tabs { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.proof__tabs button {
display: inline-flex; align-items: center; gap: 0.45rem; min-height: 44px; padding: 0.35rem 0.85rem 0.35rem 0.4rem;
font-weight: 700; font-size: 1.0625rem; background: var(--white); border: var(--bw) solid var(--ink);
}
.proof__tabs button b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--ink); background: var(--yellow); font-family: var(--f-display); font-weight: 900; font-size: 0.95rem; }
.proof__tabs button[aria-selected='true'] { background: var(--ink); color: var(--white); box-shadow: 4px 4px 0 var(--orange); }
.proof__tabs button[aria-selected='true'] b { color: var(--ink); }
.proof__track { display: flex; align-items: flex-start; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 4px 14px; margin: 0 -4px; }
.proof__track::-webkit-scrollbar { display: none; }
.proof__slide { flex: 0 0 100%; scroll-snap-align: start; margin: 0; }
.proof__nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.proof__count { font-family: var(--f-display); font-weight: 900; font-size: 1.2rem; white-space: nowrap; }
.screen { border: var(--bw) solid var(--ink); box-shadow: var(--shadow); background: var(--white); }
.screen__bar { display: flex; gap: 8px; align-items: center; padding: 10px 12px; border-bottom: var(--bw) solid var(--ink); background: var(--paper); }
.screen__bar i { width: 13px; height: 13px; border: 2px solid var(--ink); border-radius: 50%; background: var(--orange); }
.screen__bar i:nth-child(2) { background: var(--yellow); }
.screen__bar i:nth-child(3) { background: var(--green); }
.screen__bar span { margin-left: 6px; font-size: 0.9375rem; font-weight: 700; }
.screen img { width: 100%; }
.proof__slide[data-crop='none'] img { max-width: 720px; margin-inline: auto; }
.screen figcaption { padding: 0.75rem 1rem; border-top: var(--bw) solid var(--ink); font-size: var(--fs-small); font-weight: 700; }
@media (max-width: 719.98px) {
.proof__slide img { aspect-ratio: 4 / 3; object-fit: cover; }
.proof__slide[data-crop='right'] img { object-position: right center; }
.proof__slide[data-crop='left'] img { object-position: left center; }
.proof__slide[data-crop='none'] img { aspect-ratio: auto; }
.proof__nav .btn { padding-inline: 0.8rem; }
}
.mini-cases { margin-top: clamp(2.5rem, 2rem + 2vw, 4rem); }
.mini-cases__title { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.4rem); }
.mini-case {
position: relative; width: 270px; display: grid; gap: 0.6rem; align-content: start;
padding: 1.2rem 1.2rem 1.3rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm);
}
.mini-case__icon svg { width: 52px; height: 52px; fill: none; stroke: var(--ink); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.mini-case__icon svg .f { fill: var(--yellow); }
.mini-case .h3 { font-weight: 900; text-transform: uppercase; }
.mini-case__meta { font-size: 1rem; font-weight: 600; color: rgb(21 41 75 / 75%); }
.mini-cases__head .h2 { max-width: none; color: var(--white); }
.mini-cases__head .mini-cases__sub { max-width: none; margin-top: 1rem; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); font-weight: 600; color: var(--ink); }
.plate { padding: 0.7rem 1rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.mini-case__note { font-size: 0.9375rem; line-height: 1.35; padding-top: 0.6rem; border-top: 2px dashed var(--ink); }
.mini-case ul { list-style: none; padding: 0.6rem 0 0; display: grid; gap: 0.3rem; border-top: 2px dashed var(--ink); }
.mini-case ul b { font-family: var(--f-display); font-weight: 900; font-size: 1.35rem; }
@media (min-width: 1100px) { .cases__track { overflow: visible; } .cases__track > .mini-case { width: auto; flex: 1 1 0; } .mini-cases .car-nav { display: none; } }
.steps__list { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.step { position: relative; display: grid; gap: 0.5rem; align-content: start; padding: 1.4rem 1.3rem 1.5rem; border: var(--bw) solid var(--ink); background: var(--white); box-shadow: var(--shadow-sm); }
.step__n { width: 54px; height: 54px; display: grid; place-items: center; font-family: var(--f-display); font-weight: 900; font-size: 1.5rem; background: var(--blue); border: var(--bw) solid var(--ink); border-radius: 50%; margin-bottom: 0.4rem; }
.step:nth-child(2) .step__n { background: var(--yellow); }
.step:nth-child(3) .step__n { background: var(--orange); color: var(--white); }
.step:nth-child(4) .step__n { background: var(--green); }
@media (min-width: 720px) { .steps__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) {
.steps__list { grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.step:not(:last-child)::after { content: ''; position: absolute; top: 48px; right: calc(-2rem - 3px); width: calc(2rem + 3px); height: var(--bw); background: var(--ink); }
}
.reveal-ready [data-reveal] > * { opacity: 0; transform: translateX(-70px) rotate(-5deg) scale(0.92); }
.reveal-ready [data-reveal] > .is-in { animation: step-in 0.75s cubic-bezier(0.2, 0.9, 0.3, 1.25) var(--d, 0ms) both; }
.reveal-ready [data-reveal] > * .step__n { transform: scale(0); }
.reveal-ready [data-reveal] > .is-in .step__n { animation: num-pop 0.5s cubic-bezier(0.3, 1.6, 0.5, 1) calc(var(--d, 0ms) + 350ms) both; }
@keyframes step-in {
0% { opacity: 0; transform: translateX(-70px) rotate(-5deg) scale(0.92); }
65% { opacity: 1; transform: translateX(8px) rotate(1deg) scale(1.02); }
100% { opacity: 1; transform: none; }
}
@keyframes num-pop { 0% { transform: scale(0) rotate(-90deg); } 100% { transform: scale(1) rotate(0); } }
@media (min-width: 1100px) {
.reveal-ready [data-reveal] > .step::after { transform: scaleX(0); transform-origin: left; }
.reveal-ready [data-reveal] > .step.is-in::after { transition: transform 0.4s ease calc(var(--d, 0ms) + 600ms); transform: scaleX(1); }
}
.pill { justify-self: start; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; padding: 0.6rem 1rem; background: var(--ink); color: var(--yellow); transform: rotate(2deg); box-shadow: 5px 5px 0 var(--orange); }
.svc__grid { list-style: none; padding: 0; display: grid; gap: 1.5rem; }
.svc { display: grid; gap: 0.75rem; align-content: start; padding: 1.3rem 1.3rem 1.4rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.svc__top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.svc__icon { display: grid; place-items: center; width: 60px; height: 60px; border: var(--bw) solid var(--ink); background: var(--blue); }
.svc__icon svg { width: 38px; height: 38px; fill: none; stroke: var(--ink); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.svc__icon svg .f { fill: var(--white); }
.svc__step { font-weight: 700; font-size: 0.9375rem; padding: 0.15rem 0.55rem; border: 2px solid var(--ink); border-radius: 999px; }
.svc .h3 { font-weight: 900; text-transform: uppercase; font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.55rem); }
.svc ul { padding-left: 1.15rem; display: grid; gap: 0.25rem; font-size: 1.0625rem; }
.svc__time { justify-self: start; font-weight: 700; padding: 0.25rem 0.65rem; background: var(--yellow); border: 2px solid var(--ink); transform: rotate(-1.5deg); }
.svc__more { justify-self: start; font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 5px; text-decoration-color: var(--orange); }
.svc--all { background: #c6ecb0; }
.svc--all .svc__icon { background: var(--yellow); }
.svc--all .btn { justify-self: start; margin-top: 0.25rem; }
@media (min-width: 720px) { .svc__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .svc__grid { grid-template-columns: repeat(3, 1fr); } }
.founder__grid { display: grid; gap: 2.5rem; align-items: center; }
.founder__photo { position: relative; border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); background: var(--white); padding: 12px; transform: rotate(1.5deg); }
.founder__photo img { width: 100%; aspect-ratio: 1; object-fit: cover; border: 2px solid var(--ink); }
.tape { position: absolute; top: -16px; left: 50%; width: 130px; height: 32px; transform: translateX(-50%) rotate(-3deg); background: rgb(248 214 72 / 85%); border: 2px solid rgb(21 41 75 / 35%); }
.founder__text { display: grid; gap: 1.25rem; }
.founder__quote { font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.45rem); line-height: 1.5; }
.founder__sign { font-family: var(--f-display); font-weight: 800; }
.founder__facts { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.founder__facts li { padding: 0.3rem 0.7rem; border: 2px solid var(--ink); background: var(--white); font-weight: 700; font-size: 1rem; }
@media (min-width: 1024px) { .founder__grid { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.faq__list { display: grid; gap: 1rem; max-width: 60rem; }
.faq details { border: var(--bw) solid var(--ink); background: var(--white); box-shadow: var(--shadow-sm); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 1.05rem 1.25rem; font-weight: 700; font-size: 1.25rem; line-height: 1.3; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
content: '+'; flex: none; width: 38px; height: 38px; display: grid; place-items: center;
font-family: var(--f-display); font-weight: 900; font-size: 1.4rem; border: var(--bw) solid var(--ink); border-radius: 50%; background: var(--yellow);
transition: transform 0.15s ease;
}
.faq details[open] summary::after { transform: rotate(45deg); background: var(--orange); color: var(--white); }
.faq details[open] summary { border-bottom: 2px dashed var(--ink); }
.faq details p { padding: 1rem 1.25rem 1.25rem; max-width: 46em; }
.final__inner { display: grid; gap: 1.5rem; justify-items: start; }
.final .h1 { font-size: clamp(2.2rem, 1rem + 4.6vw, 5.4rem); color: var(--white); max-width: 15ch; }
html[lang='ru'] .final .h1 { font-size: clamp(2rem, 0.9rem + 4vw, 4.6rem); max-width: 17ch; }
.final .lead { color: var(--white); font-weight: 600; }
.final__actions { display: flex; flex-wrap: wrap; gap: 1rem; }
.footer { background-color: var(--ink); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light; color: var(--paper); padding-block: 3.5rem 2rem; }
.footer__grid { display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); }
.footer__brand { grid-column: 1 / -1; display: grid; gap: 1rem; align-content: start; }
.footer__logo { justify-self: start; }
.footer__logo img { display: block; height: 52px; width: auto; }
.footer h3 { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; color: var(--yellow); margin-bottom: 0.75rem; }
.footer ul { list-style: none; padding: 0; display: grid; gap: 0.45rem; }
.footer a { text-decoration: none; }
.footer a:hover { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; }
.footer__contacts { display: grid; gap: 0.3rem; font-size: var(--fs-small); }
.footer__contacts a.phone { font-family: var(--f-display); font-weight: 900; font-size: 1.3rem; }
.socials { display: flex; gap: 0.6rem; margin-top: 0.5rem; }
.socials a { width: 42px; height: 42px; display: grid; place-items: center; border: 2px solid var(--paper); }
.socials a:hover { background: var(--orange); border-color: var(--orange); }
.socials svg { width: 20px; height: 20px; fill: currentColor; }
.footer__bottom { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 2px dashed rgb(244 240 232 / 30%); display: grid; gap: 0.6rem; font-size: 0.9375rem; opacity: 0.85; }
@media (min-width: 900px) { .footer__grid { grid-template-columns: 1.4fr repeat(3, 1fr); } .footer__brand { grid-column: auto; } }
.footer__legal { margin-top: 1.5rem; }
.sticky-cta {
position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 10px;
padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
background: var(--paper); border-top: var(--bw) solid var(--ink);
}
.sticky-cta .btn { min-height: 52px; padding-inline: 0.6rem; font-size: 1.0625rem; box-shadow: 3px 3px 0 var(--ink); }
@media (min-width: 1024px) { .sticky-cta { display: none; } }
.proto-toast {
position: fixed; z-index: 80; left: 50%; bottom: calc(var(--sticky-h) + 16px); transform: translateX(-50%);
max-width: calc(100vw - 32px); padding: 0.75rem 1rem;
background: var(--ink); color: var(--paper); border: var(--bw) solid var(--paper); box-shadow: 5px 5px 0 var(--orange);
font-weight: 700; font-size: 1rem;
}
.proto-toast[hidden] { display: none; }
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.final__grid { display: grid; gap: 2.5rem; align-items: start; }
.final__copy { display: grid; gap: 1.25rem; align-content: start; }
.final .lead { color: var(--ink); font-weight: 600; }
.ticks--on-orange li { font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3rem); }
.ticks--on-orange li::before { background: var(--yellow); filter: drop-shadow(1px 1px 0 var(--ink)); }
.final__card {
display: grid; gap: 1rem; padding: clamp(1.1rem, 0.9rem + 1vw, 1.6rem);
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); transform: rotate(-0.5deg);
}
.final__small { font-weight: 600; max-width: 34em; padding-top: 0.9rem; border-top: 2px dashed var(--ink); }
.final__small a { font-weight: 800; white-space: nowrap; }
.lead-form {
display: grid; gap: 1rem; padding: clamp(1.25rem, 1rem + 1.5vw, 2rem);
background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); transform: rotate(0.6deg);
}
.lead-form__title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.7rem); line-height: 1.05; }
.field { display: grid; gap: 0.35rem; }
.field label { font-weight: 700; font-size: 1.0625rem; }
.field input {
width: 100%; min-height: 54px; padding: 0.6rem 0.85rem;
font: inherit; font-size: 1.125rem; color: var(--ink);
background: var(--paper); border: var(--bw) solid var(--ink); border-radius: 0;
}
.field input:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; background: var(--white); }
.field input[aria-invalid='true'] { border-color: #c4320a; background: #fff1ec; }
.field__err { font-weight: 700; font-size: 0.9375rem; color: #b42d08; }
.lead-form .btn { width: 100%; }
.lead-form__next { font-weight: 700; text-align: center; }
.lead-form__consent { font-size: 0.8125rem; line-height: 1.4; color: rgb(21 41 75 / 80%); }
.lead-form__consent a { font-weight: 700; }
@media (min-width: 1024px) { .final__grid { grid-template-columns: 1.1fr 0.9fr; gap: 4rem; } }
.c-red, .c-green { font-style: normal; font-weight: 800; }
.c-red { color: #d7261e; }
.c-green { color: #1f8a2e; }
.drake__card figcaption b > span { font-size: inherit; font-weight: inherit; line-height: inherit; }
.drake__card figcaption > span { font-size: 1rem; }
mark.todo { color: inherit; background: rgb(215 38 30 / 10%); outline: 2px dashed #d7261e; outline-offset: 1px; border-radius: 2px; }
.reviews .lead { color: var(--paper); }
.reviews .h2 { color: var(--paper); }
.vids { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 0.9rem; }
@media (min-width: 900px) { .vids { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.6rem; } }
.vid { display: grid; gap: 0.3rem; align-content: start; }
.vid__play {
position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9; padding: 0; overflow: hidden; cursor: pointer;
background: var(--pc, var(--blue)) center / cover no-repeat; border: var(--bw) solid var(--paper); box-shadow: 5px 5px 0 var(--yellow);
}
.vid__play::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, transparent 0 14px, rgb(21 41 75 / 9%) 14px 16px); }
.vid__play.has-video::before { display: none; }
.vid__play--c0 { --pc: var(--blue); } .vid__play--c1 { --pc: var(--orange); } .vid__play--c2 { --pc: var(--green); } .vid__play--c3 { --pc: var(--yellow); }
.vid__icon { position: relative; width: 64px; height: 64px; border-radius: 50%; background: var(--orange); border: var(--bw) solid var(--ink); box-shadow: 3px 3px 0 var(--ink); transition: transform 0.15s ease; }
.vid__icon::after { content: ''; position: absolute; left: 55%; top: 50%; transform: translate(-50%, -50%); border-left: 20px solid var(--white); border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.vid__play:hover .vid__icon { transform: scale(1.08); }
.vid__todo { position: absolute; left: 8px; bottom: 8px; padding: 0.1rem 0.45rem; font-weight: 700; font-size: 0.8125rem; color: var(--ink); background: var(--white); border: 2px dashed var(--ink); }
.vid__play.has-video .vid__todo { display: none; }
.vid__play iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vid__name { margin-top: 0.5rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(0.95rem, 0.88rem + 0.3vw, 1.15rem); line-height: 1.1; }
.vid__meta { font-size: 0.9375rem; color: rgb(244 240 232 / 78%); }
@media (max-width: 639.98px) {
.vid__icon { width: 44px; height: 44px; }
.vid__icon::after { border-left-width: 14px; border-top-width: 9px; border-bottom-width: 9px; }
.vid__todo { font-size: 0.6875rem; left: 5px; bottom: 5px; }
.vid__meta { font-size: 0.8125rem; }
}
.own__grid { display: grid; gap: 2.25rem; align-items: center; }
@media (min-width: 1000px) { .own__grid { grid-template-columns: 1.05fr 0.95fr; gap: 3.5rem; } }
.own__copy { display: grid; gap: 1.5rem; }
.own__copy .h2 { max-width: none; }
.own__list { list-style: none; padding: 0; display: grid; gap: 0.9rem; }
.own__list li { position: relative; padding-left: 2.7rem; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); line-height: 1.4; }
.own__list li::before {
content: '✓'; position: absolute; left: 0; top: 0; width: 1.85rem; height: 1.85rem; display: grid; place-items: center;
font-weight: 900; color: var(--white); background: var(--green); border: var(--bw) solid var(--ink); border-radius: 50%; box-shadow: 2px 2px 0 var(--ink);
}
.own__exit { padding: 1rem 1.2rem; background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); line-height: 1.45; transform: rotate(-0.4deg); }
.own__art { margin: 0; border: var(--bw) solid var(--ink); box-shadow: var(--shadow); background: var(--white); transform: rotate(0.6deg); }
.own__art .pimg, .own__art img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 0; }
[data-page='thanks'] .header-cta, [data-page='thanks'] .sticky-cta { display: none !important; }
.thanks { min-height: 70vh; }
.thanks__grid { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 1000px) {
.thanks__grid { grid-template-columns: 0.9fr 1.1fr; grid-template-areas: 'top cal' 'bottom cal'; column-gap: 3rem; row-gap: 1.25rem; }
.thanks__copy { grid-area: top; }
.thanks__copy--bottom { grid-area: bottom; }
.thanks__cal { grid-area: cal; }
}
.thanks__copy { display: grid; gap: 1.25rem; align-content: start; }
.thanks__tag {
justify-self: start; padding: 0.3rem 0.8rem; transform: rotate(-2deg);
font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; letter-spacing: 0.02em;
color: var(--white); background: var(--green); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
}
.thanks__title { font-size: clamp(2.2rem, 1.2rem + 4vw, 4.4rem); color: var(--blue); }
.thanks__steps { padding-left: 1.4rem; display: grid; gap: 0.5rem; font-weight: 600; font-size: 1.125rem; }
.thanks__alt { font-weight: 600; }
.thanks__alt a { font-weight: 800; white-space: nowrap; }
.thanks__cal { padding: 0.5rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); }
.cal-embed { position: relative; }
.cal-embed__wait { position: absolute; top: 1.5rem; left: 1.5rem; right: 1.5rem; font-weight: 600; text-align: center; }
.cal-embed iframe { position: relative; display: block; width: 100%; min-height: 720px; border: 0; }
.thanks__booked { display: none; padding: 1.5rem; }
.thanks__booked p + p { margin-top: 0.6rem; }
.is-booked .thanks__booked { display: block; }
.is-booked .cal-embed { display: none; }
@keyframes shine { 0% { background-position: 100% 0; } 55%, 100% { background-position: 0% 0; } }
.mini-case ul b, .trust__value {
background-image: linear-gradient(105deg, var(--c1) 0 40%, var(--c2) 50%, var(--c1) 60% 100%);
background-size: 260% 100%; background-position: 0% 0;
-webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.mini-case ul b { --c1: #1f8a2e; --c2: #b8f0a8; font-size: 1.5rem; }
.trust__value { --c1: var(--yellow); --c2: #fffdf0; }
@media (prefers-reduced-motion: no-preference) {
.mini-case ul b, .trust__value { animation: shine 4.2s ease-in-out infinite; }
.mini-case ul li:nth-child(2) b, .trust__item:nth-child(2) .trust__value { animation-delay: 0.35s; }
.mini-case ul li:nth-child(3) b, .trust__item:nth-child(3) .trust__value { animation-delay: 0.7s; }
.trust__item:nth-child(4) .trust__value { animation-delay: 1.05s; }
}
.thanks__form { padding: 1rem 1.2rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); transform: rotate(-0.4deg); }
.thanks__form-title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.1rem; margin-bottom: 0.35rem; color: var(--orange); }
.mobile-menu.is-open { max-height: calc(100dvh - var(--header-h)); overflow-y: auto; }
.crumbs ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.2rem 0.5rem; font-weight: 700; font-size: 1rem; }
.crumbs li + li::before { content: '/'; margin-right: 0.5rem; opacity: 0.5; }
.crumbs a { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.crumbs [aria-current] { opacity: 0.75; }
.phero {
position: relative; isolation: isolate; overflow: hidden;
padding-block: clamp(1.25rem, 1rem + 1.5vw, 2.25rem) clamp(3rem, 2rem + 4vw, 5.5rem);
background-color: var(--yellow); background-image: var(--tex); background-size: 1100px; background-blend-mode: soft-light;
}
.phero > .container { position: relative; z-index: 1; display: grid; gap: clamp(1.25rem, 1rem + 1.5vw, 2.25rem); }
.phero__grid { display: grid; gap: 2.25rem; align-items: center; }
.phero__copy { display: grid; gap: 1.2rem; align-content: start; }
.phero__kicker { justify-self: start; padding: 0.3rem 0.8rem; transform: rotate(-1.5deg); font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(0.95rem, 0.85rem + 0.35vw, 1.15rem); line-height: 1.25; max-width: 100%; letter-spacing: 0.02em; color: var(--white); background: var(--ink); box-shadow: 3px 3px 0 var(--orange); }
.phero__title { font-size: clamp(2.3rem, 1.1rem + 4.4vw, 5rem); color: var(--blue); max-width: 15ch; }
html[lang='ru'] .phero__title { font-size: clamp(2.1rem, 1rem + 3.7vw, 4.3rem); max-width: 17ch; }
.phero__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 0.3rem; }
.phero__art { position: relative; margin: 0; padding: 10px; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); transform: rotate(1.2deg); }
.phero__art img, .phero__art .pimg { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.phero__art .pimg { border-width: 2px; }
.phero .fork-card__note { max-width: 34em; }
@media (min-width: 1024px) { .phero__grid { grid-template-columns: 1.1fr 0.9fr; gap: 3.5rem; } }
.section-head--tight { margin-bottom: 1.5rem; }
.more-link { margin-top: 1.75rem; }
.fit { display: grid; gap: 1.5rem; }
.fit__card { padding: clamp(1.2rem, 1rem + 1vw, 1.8rem); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); background: var(--white); }
.fit__card--yes { background: #c6ecb0; }
.fit__title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.2rem, 1.05rem + 0.6vw, 1.6rem); margin-bottom: 0.9rem; }
.fit__card ul { list-style: none; padding: 0; display: grid; gap: 0.75rem; }
.fit__card li { position: relative; padding-left: 2.4rem; font-weight: 600; line-height: 1.4; }
.fit__card li::before { position: absolute; left: 0; top: 0; width: 1.7rem; height: 1.7rem; display: grid; place-items: center; font-weight: 900; color: var(--white); border: 2px solid var(--ink); border-radius: 50%; box-shadow: 2px 2px 0 var(--ink); }
.fit__card--yes li::before { content: '✓'; background: #1f8a2e; }
.fit__card--no li::before { content: '✕'; background: #d7261e; }
@media (min-width: 900px) { .fit { grid-template-columns: 1fr 1fr; gap: 2rem; } }
.incl, .mini { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.incl__card, .mini__card { position: relative; display: grid; gap: 0.5rem; align-content: start; padding: 1.25rem 1.25rem 1.35rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.incl__n, .mini__n { font-family: var(--f-display); font-weight: 900; font-size: 1.6rem; line-height: 1; color: var(--orange); }
.incl__card .h3, .mini__card .h3 { font-weight: 900; text-transform: uppercase; }
.incl__card p, .mini__card p { font-size: 1.0625rem; line-height: 1.45; }
.incl__link { justify-self: start; font-weight: 700; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.mini__card { background: var(--paper); }
.mini__n { color: var(--blue); }
@media (min-width: 720px) { .incl, .mini { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .incl { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; } .mini { grid-template-columns: repeat(3, 1fr); } }
.step__when { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; color: var(--orange); }
.bg-blue .steps__list .step, .bg-blue .step { color: var(--ink); }
.kpis { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.9rem; }
.kpis li { display: grid; gap: 0.2rem; padding: 0.9rem 1rem 1rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.kpis b { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.35rem); line-height: 1.1; }
.kpis li > span { font-size: 1rem; line-height: 1.3; font-weight: 600; }
.kpis__note { margin-top: 1rem; font-weight: 700; color: var(--white); }
@media (min-width: 900px) { .kpis { grid-template-columns: repeat(3, 1fr); gap: 1.25rem; } }
.report .h2, .report .lead { color: var(--white); }
.proof-one { margin: 2rem 0 0; }
@media (max-width: 719.98px) {
.proof-one[data-crop='right'] img, .proof-one[data-crop='left'] img { aspect-ratio: 4 / 3; object-fit: cover; }
.proof-one[data-crop='right'] img { object-position: right center; }
.proof-one[data-crop='left'] img { object-position: left center; }
}
.proof-one[data-crop='none'] img { max-width: 760px; margin-inline: auto; }
.rels { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.rel__link { position: relative; height: 100%; display: grid; grid-template-columns: auto 1fr; gap: 0.4rem 1rem; align-items: center; padding: 1.1rem 3rem 1.2rem 1.1rem; text-decoration: none; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); transition: transform 0.12s ease, box-shadow 0.12s ease; }
.rel__link:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-lg); }
.rel__link .svc__icon { grid-row: span 2; }
.rel__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.25rem; line-height: 1.1; }
.rel__d { font-size: 1.0625rem; line-height: 1.35; }
.rel__go { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); font-family: var(--f-display); font-weight: 900; font-size: 1.6rem; color: var(--orange); }
@media (min-width: 1000px) { .rels { grid-template-columns: repeat(3, 1fr); } .rel__link { grid-template-columns: 1fr; padding-right: 1.1rem; } .rel__link .svc__icon { grid-row: auto; } .rel__go { top: 1.1rem; transform: none; } }
.bg-blue .related .h2, .related.bg-blue .h2, .related.bg-blue .lead { color: var(--white); }
.chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.75rem; }
.chip { display: inline-flex; align-items: center; gap: 0.55rem; min-height: 50px; padding: 0.45rem 1rem 0.45rem 0.6rem; font-weight: 700; font-size: 1.125rem; text-decoration: none; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); transition: transform 0.12s ease; }
.chip:hover { transform: translate(-2px, -2px); }
.chip svg { width: 32px; height: 32px; flex: none; fill: none; stroke: var(--ink); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.chip svg .f { fill: var(--yellow); }
.chip[aria-current] { background: var(--ink); color: var(--yellow); }
.chip[aria-current] svg { stroke: var(--yellow); }
.chip--all { background: var(--orange); color: var(--white); padding-left: 1rem; }
.chip--sm { min-height: 40px; padding: 0.3rem 0.75rem; font-size: 1rem; box-shadow: 2px 2px 0 var(--ink); }
.trades-strip { padding-block: clamp(2.5rem, 2rem + 2vw, 4rem); }
.club-line { margin-top: 1.5rem; font-weight: 700; font-size: 1.125rem; }
.club-line a { text-decoration-color: var(--orange); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.bench .h2, .bench .lead { color: var(--white); }
.stat--bench b { font-size: clamp(1.8rem, 1.3rem + 2vw, 3rem); color: #1f8a2e; }
.bench__note { margin-top: 1.5rem; max-width: 60rem; font-weight: 600; color: var(--ink); }
.feature--slim { gap: 1.4rem; }
.feature--slim .h2 { max-width: none; }
.case__line { font-weight: 700; font-size: clamp(1.05rem, 1rem + 0.3vw, 1.25rem); padding: 0.8rem 1rem; background: var(--yellow); border: var(--bw) solid var(--ink); }
.feature__side { display: grid; gap: 1rem; justify-items: start; }
@media (min-width: 1024px) { .feature__side { justify-items: end; } }
.npains { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.npain { display: grid; gap: 0.7rem; align-content: start; padding: 1.25rem 1.3rem 1.4rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.npain .h3 { font-weight: 900; text-transform: uppercase; }
.npain q { display: block; font-family: var(--f-display); font-weight: 700; font-size: clamp(1rem, 0.92rem + 0.35vw, 1.2rem); line-height: 1.35; padding-left: 0.9rem; border-left: 5px solid var(--orange); quotes: '“' '”'; }
html[lang='ru'] .npain q { quotes: '«' '»'; }
.npain__fix { font-size: 1.0625rem; line-height: 1.45; }
.npain__fix b { display: block; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.02em; color: var(--blue); }
@media (min-width: 900px) { .npains { grid-template-columns: 1fr 1fr; gap: 1.75rem; } }
.chain__links { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.35rem; }
.look-sec .h2, .look-sec .lead { color: var(--paper); }
.look { display: grid; gap: 1.75rem; }
.look__copy { display: grid; gap: 1rem; }
.look__copy .h2 { max-width: 22ch; }
.look__tag { justify-self: start; padding: 0.3rem 0.8rem; transform: rotate(-2deg); font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; color: var(--ink); background: var(--yellow); box-shadow: 3px 3px 0 var(--orange); }
.look__list { list-style: none; padding: 0; display: grid; gap: 0.85rem; }
.look__list li { position: relative; padding: 0.85rem 1rem 0.9rem 3.1rem; font-weight: 700; line-height: 1.35; color: var(--ink); background: var(--paper); border: var(--bw) solid var(--paper); box-shadow: 5px 5px 0 var(--yellow); }
.look__list li::before { content: ''; position: absolute; left: 0.9rem; top: 0.95rem; width: 1.35rem; height: 1.35rem; background: var(--orange); -webkit-mask: var(--star) center / contain no-repeat; mask: var(--star) center / contain no-repeat; }
@media (min-width: 1000px) { .look { grid-template-columns: 1.1fr 0.9fr; align-items: center; gap: 3rem; } .look__go { grid-column: 1; } }
.segs { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.seg { padding: 1.2rem 1.25rem 1.3rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.seg .h3 { font-weight: 900; text-transform: uppercase; margin-bottom: 0.6rem; }
.seg ul { padding-left: 1.15rem; display: grid; gap: 0.35rem; font-size: 1.0625rem; line-height: 1.4; }
@media (min-width: 900px) { .segs { grid-template-columns: 1fr 1fr; gap: 1.6rem; } }
.tracks-sec .h2, .tracks-sec .lead { color: var(--white); }
.tracks { display: grid; gap: 1.75rem; }
.track { padding: clamp(1.2rem, 1rem + 1vw, 1.8rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); }
.track--growth { background: var(--paper); }
.track__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.7rem, 1.3rem + 1.5vw, 2.5rem); line-height: 1; color: var(--orange); }
.track--growth .track__name { color: var(--blue); }
.track__sub { margin: 0.4rem 0 1.1rem; font-weight: 700; font-size: 1.125rem; }
.track ol { padding-left: 1.6rem; display: grid; gap: 0.75rem; }
.track li::marker { font-family: var(--f-display); font-weight: 900; }
.track li > b { display: block; font-size: 1.125rem; line-height: 1.25; }
.track li > span { display: block; font-size: 1rem; line-height: 1.35; color: rgb(21 41 75 / 80%); }
@media (min-width: 1000px) { .tracks { grid-template-columns: 1fr 1fr; gap: 2rem; } }
.when { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.when li { display: grid; gap: 0.4rem; align-content: start; padding: 1.2rem 1.25rem 1.3rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.when__who { font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; font-size: 0.95rem; color: var(--blue); }
.when__time { font-family: var(--f-display); font-weight: 900; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.3rem); line-height: 1; }
@media (min-width: 900px) { .when { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; } }
.paths { display: grid; gap: 1.75rem; }
.path { display: grid; gap: 0.9rem; align-content: start; padding: clamp(1.4rem, 1rem + 1.6vw, 2.25rem); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.path--club { background: var(--white); }
.path--agency { background: #bfe6f7; }
.path__way { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.1rem; color: var(--orange); }
.path .h2 { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); }
.path ul { padding-left: 1.2rem; display: grid; gap: 0.45rem; }
.path .btn { justify-self: start; margin-top: 0.4rem; }
@media (min-width: 900px) { .paths { grid-template-columns: 1fr 1fr; gap: 2rem; } }
.terms { display: grid; gap: 1.75rem; }
.terms__list { list-style: none; padding: 0; display: grid; gap: 0.75rem; }
.terms__list li { padding: 0.9rem 1.1rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); line-height: 1.4; }
.terms__list b { display: block; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; color: var(--orange); }
.notfor { align-self: start; padding: 1.25rem 1.3rem 1.35rem; background: var(--ink); color: var(--paper); border: var(--bw) solid var(--ink); box-shadow: 6px 6px 0 var(--orange); }
.notfor__title { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.3rem; color: var(--yellow); margin-bottom: 0.7rem; }
.notfor ul { padding-left: 1.15rem; display: grid; gap: 0.55rem; line-height: 1.4; }
@media (min-width: 1000px) { .terms { grid-template-columns: 1.2fr 0.8fr; gap: 2.5rem; } }
.join__grid { display: grid; gap: 2.5rem; align-items: start; }
.join__card { display: grid; gap: 1rem; padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); transform: rotate(0.6deg); }
.join__price { font-family: var(--f-display); font-weight: 900; font-size: clamp(2.6rem, 2rem + 2vw, 3.6rem); line-height: 1; }
.join__price > span { font-size: 0.4em; margin-left: 0.3rem; }
.join__card .btn { width: 100%; }
@media (min-width: 1024px) { .join__grid { grid-template-columns: 1.1fr 0.9fr; gap: 4rem; } }
.trade-card__link { display: grid; height: 100%; align-content: start; text-decoration: none; }
.trade-card__more { padding: 0 0.7rem 0.7rem; margin-top: -0.25rem; font-weight: 700; font-size: 0.9375rem; line-height: 1.2; color: var(--orange); }
.trade-card--page { box-shadow: 5px 5px 0 var(--orange); }
.mini-case__more { justify-self: start; font-weight: 700; font-size: 1rem; text-decoration-color: var(--orange); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.ticker--results { background-color: var(--ink); }
.ticker--results .ticker__track { animation-duration: 70s; }
.ticker--results .ticker__list li { color: var(--yellow); -webkit-text-stroke: 0; font-size: clamp(1rem, 0.85rem + 0.6vw, 1.45rem); gap: 0.7rem; }
.ticker--results .ticker__list li small {
font-family: var(--f-body); font-weight: 700; font-size: 0.55em; text-transform: uppercase; letter-spacing: 0.04em;
color: var(--ink); background: var(--paper); padding: 0.15em 0.5em; border-radius: 999px; -webkit-text-stroke: 0;
}
.ticker--results .ticker__list li::after { background: var(--orange); margin-left: 0.7rem; }
.pricing .section-head .lead { max-width: 52em; }
.tiers { list-style: none; padding: 0; display: grid; gap: 1.5rem; align-items: stretch; }
.tier { position: relative; display: grid; grid-template-rows: auto auto auto 1fr auto; gap: 0.6rem; padding: 1.4rem 1.3rem 1.5rem; background: var(--paper); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.tier__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.3rem, 1.1rem + 0.7vw, 1.7rem); line-height: 1.05; }
.tier__sub { font-weight: 600; font-size: 1.0625rem; color: rgb(21 41 75 / 80%); }
.tier__price { font-family: var(--f-display); font-weight: 900; font-size: clamp(2.3rem, 1.8rem + 2vw, 3.4rem); line-height: 1; margin-top: 0.3rem; }
.tier__price b { font-weight: 900; }
.tier__per { font-family: var(--f-body); font-weight: 700; font-size: 1.0625rem; margin-left: 0.4rem; color: rgb(21 41 75 / 75%); }
.tier__setup { font-weight: 700; font-size: 1rem; }
.tier__list { list-style: none; padding: 0.8rem 0 0; margin: 0; border-top: 2px dashed var(--ink); display: grid; gap: 0.45rem; align-content: start; font-size: 1rem; line-height: 1.35; }
.tier__list li { position: relative; padding-left: 1.6rem; }
.tier__list li::before { position: absolute; left: 0; top: 0; font-weight: 900; }
.tier__yes::before { content: '✓'; color: #1f8a2e; }
.tier__no { color: rgb(21 41 75 / 55%); text-decoration: line-through; text-decoration-color: rgb(21 41 75 / 35%); }
.tier__no::before { content: '✕'; color: #d7261e; text-decoration: none; }
.tier .btn { justify-self: stretch; margin-top: 0.6rem; }
.tier--best { background: var(--white); box-shadow: 10px 10px 0 var(--orange); border-width: 4px; }
.tier--best .tier__price { color: var(--orange); }
.tier--best .tier__setup { color: #1f8a2e; }
.tier__badge { position: absolute; top: -16px; left: 50%; transform: translateX(-50%) rotate(-2deg); white-space: nowrap; padding: 0.3rem 0.85rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.9rem; color: var(--white); background: var(--ink); box-shadow: 3px 3px 0 var(--orange); }
.tiers__note { margin-top: 1.5rem; font-weight: 700; max-width: 52em; }
@media (min-width: 1000px) {
.tiers { grid-template-columns: 0.9fr 0.9fr 1.2fr; gap: 1.75rem; align-items: end; }
.tier--best { padding: 1.9rem 1.6rem 1.8rem; transform: translateY(-14px); }
}
.teaser { display: grid; gap: 2rem; align-items: center; }
.teaser__copy { display: grid; gap: 1rem; }
.teaser__copy .h2 { max-width: 22ch; }
.teaser__card { display: grid; gap: 1rem; padding: clamp(1.3rem, 1rem + 1.4vw, 2rem); background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); transform: rotate(0.6deg); }
.teaser__price { font-family: var(--f-display); font-weight: 900; font-size: clamp(2.4rem, 1.9rem + 2vw, 3.4rem); line-height: 1; }
.teaser__price > span { font-family: var(--f-body); font-size: 1.125rem; margin-left: 0.35rem; }
.teaser__card .btn { justify-self: start; }
@media (min-width: 1000px) { .teaser { grid-template-columns: 1.15fr 0.85fr; gap: 3.5rem; } }
.mistakes { list-style: none; padding: 0; counter-reset: m; display: grid; gap: 1rem; }
.mistake { counter-increment: m; position: relative; display: grid; gap: 0.35rem; padding: 1rem 1.1rem 1.1rem 3.6rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.mistake::before { content: counter(m, decimal-leading-zero); position: absolute; left: 0.9rem; top: 0.95rem; font-family: var(--f-display); font-weight: 900; font-size: 1.3rem; color: #d7261e; }
.mistake__what { font-family: var(--f-display); font-weight: 800; font-size: clamp(1.05rem, 0.98rem + 0.3vw, 1.25rem); line-height: 1.2; }
.mistake__cost { font-size: 1.0625rem; line-height: 1.4; }
.mistake__cost b { color: var(--blue); }
@media (min-width: 900px) { .mistakes { grid-template-columns: 1fr 1fr; gap: 1.25rem 1.6rem; } }
.report--paper .h2, .report--paper .lead { color: var(--ink); }
.report--paper .kpis__note { color: var(--ink); }
.hero--trade .hero__art { position: relative; z-index: 1; justify-self: center; width: min(100%, 620px); }
.tier__cost { display: grid; gap: 0.3rem; }
.tier__month { font-weight: 700; font-size: 1rem; color: rgb(21 41 75 / 70%); }
.tier--best .tier__month { color: rgb(21 41 75 / 80%); }
.addon { display: grid; gap: 1.5rem; margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); padding: clamp(1.3rem, 1rem + 1.5vw, 2.2rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); }
.addon__copy { display: grid; gap: 0.6rem; align-content: start; }
.addon__tag { justify-self: start; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; padding: 0.25rem 0.7rem; background: var(--ink); color: var(--yellow); transform: rotate(-1.5deg); }
.addon__title { font-weight: 900; text-transform: uppercase; font-size: clamp(1.4rem, 1.2rem + 0.8vw, 1.9rem); line-height: 1.05; }
.addon__price { margin-top: 0.4rem; }
.addon__note { font-weight: 600; font-size: 1rem; }
.addon__side { display: grid; gap: 1rem; align-content: start; }
.addon__side .tier__list { border-top: 0; padding-top: 0; }
.addon__side .btn { justify-self: start; }
@media (min-width: 900px) { .addon { grid-template-columns: 1fr 1.1fr; gap: 2.5rem; } .addon__side { padding-left: 2.5rem; border-left: 2px dashed var(--ink); } }
.bprint { display: grid; gap: 1.5rem; grid-template-areas: "head" "doc" "buy"; margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); padding: clamp(1.3rem, 1rem + 1.5vw, 2.2rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); }
.bprint__head { grid-area: head; display: grid; gap: 0.6rem; align-content: start; }
.bprint__title { font-weight: 900; text-transform: uppercase; font-size: clamp(1.4rem, 1.2rem + 0.8vw, 1.9rem); line-height: 1.05; }
.bprint__doc { grid-area: doc; position: relative; padding: 1.6rem 1.2rem 1.2rem; background: var(--paper); border: 2px solid var(--ink); box-shadow: var(--shadow-sm); transform: rotate(0.6deg); }
.bprint__doc .tape { top: -14px; width: 110px; height: 28px; }
.bprint__file { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.95rem; letter-spacing: 0.02em; padding-bottom: 0.6rem; margin-bottom: 0.8rem; border-bottom: 2px solid var(--ink); }
.bprint__file::before { content: '📄 '; }
.bprint__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.bprint__list li { display: grid; grid-template-columns: 2.1rem 1fr; align-items: baseline; line-height: 1.3; }
.bprint__n { font-family: var(--f-display); font-weight: 900; color: var(--orange); font-size: 1.05rem; }
.bprint__note { margin-top: 1rem; padding-top: 0.8rem; border-top: 2px dashed rgb(21 41 75 / 35%); font-size: 1rem; font-style: italic; color: rgb(21 41 75 / 85%); }
.bprint__buy { grid-area: buy; display: grid; gap: 0.7rem; align-content: start; }
.bprint__buy .tier__price { color: var(--orange); }
.bprint__keep { font-weight: 600; font-size: 1rem; }
.bprint__buy .btn { justify-self: start; }
@media (max-width: 599.98px) { .bprint__buy .btn { justify-self: stretch; } }
@media (min-width: 900px) {
.bprint { grid-template-columns: 1fr 1.15fr; grid-template-areas: "head doc" "buy doc"; column-gap: 3rem; row-gap: 1.2rem; }
.bprint__buy { align-self: end; }
}
.split { display: grid; gap: 2rem; align-items: center; }
.split__copy { display: grid; gap: 1rem; }
.split__copy .h2 { max-width: 20ch; }
.split__art { margin: 0; }
@media (min-width: 960px) { .split { grid-template-columns: 1fr 1.05fr; gap: 3.5rem; } }
.svc__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.1rem 0.45rem; }
.svc__price b { font-family: var(--f-display); font-weight: 900; font-size: clamp(1.9rem, 1.6rem + 1vw, 2.4rem); line-height: 1; color: var(--orange); }
.svc__per { font-weight: 700; font-size: 1.0625rem; }
.svc__price small { flex-basis: 100%; font-size: 1rem; font-weight: 700; color: rgb(21 41 75 / 75%); }
.svc__prices { justify-self: start; margin-top: 1rem; }
.system { position: relative; display: grid; gap: 1.75rem; padding: clamp(1.4rem, 1rem + 2vw, 2.6rem); background: var(--white); border: 4px solid var(--ink); box-shadow: 12px 12px 0 var(--orange); }
.system__main { display: grid; gap: 0.9rem; align-content: start; }
.system__main .tier__price { color: var(--orange); }
.system__badge { position: static; transform: rotate(-2deg); justify-self: start; }
.system__start { color: var(--ink) !important; max-width: 30em; }
.system__sep { font-weight: 700; padding: 0.55rem 0.8rem; background: #c6ecb0; border: 2px solid var(--ink); justify-self: start; }
.system__main .btn { justify-self: start; margin-top: 0.4rem; }
.system__side { display: grid; gap: 0.9rem; align-content: start; }
.system__what { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.1rem; }
.system__side .tier__list { border-top: 0; padding-top: 0; font-size: 1.0625rem; }
.system__note { font-size: 0.95rem; font-weight: 600; padding-top: 0.8rem; border-top: 2px dashed var(--ink); }
@media (min-width: 960px) { .system { grid-template-columns: 1fr 1.05fr; gap: 3rem; } .system__side { padding-left: 3rem; border-left: 2px dashed var(--ink); } }
.alts { border: var(--bw) solid var(--ink); background: var(--white); box-shadow: var(--shadow); }
.alts__head { display: none; }
.alts__row { display: grid; gap: 0.35rem; padding: 1rem 1.1rem; border-bottom: 2px solid var(--ink); }
.alts__row:last-child { border-bottom: 0; }
.alts__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.15rem; }
.alts__cost, .alts__catch { display: grid; gap: 0.1rem; line-height: 1.35; }
.alts__cost { font-weight: 700; }
.alts__catch { color: rgb(21 41 75 / 85%); }
.alts small { font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: rgb(21 41 75 / 60%); }
.alts__row--me { background: var(--yellow); }
.alts__row--me .alts__catch { color: var(--ink); font-weight: 700; }
.alts__note { margin-top: 1rem; font-size: 0.9375rem; color: rgb(21 41 75 / 75%); }
@media (min-width: 860px) {
.alts__head, .alts__row { grid-template-columns: 0.8fr 1.1fr 1.3fr; gap: 0; }
.alts__head { display: grid; border-bottom: var(--bw) solid var(--ink); background: var(--ink); color: var(--paper); }
.alts__head div { padding: 0.8rem 1.1rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; }
.alts__row { padding: 0; }
.alts__row > div { padding: 0.95rem 1.1rem; }
.alts__row > div + div { border-left: 2px solid var(--ink); }
.alts small { display: none; }
}
.plist { list-style: none; padding: 0; display: grid; gap: 1.5rem; }
.plist__card { display: grid; gap: 0.9rem; align-content: start; padding: 1.3rem 1.3rem 1.4rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.plist__title { display: flex; align-items: center; gap: 0.8rem; font-weight: 900; text-transform: uppercase; font-size: clamp(1.2rem, 1.05rem + 0.5vw, 1.45rem); }
.plist__title .svc__icon { flex: none; width: 50px; height: 50px; }
.plist__title .svc__icon svg { width: 32px; height: 32px; }
.plist__rows { list-style: none; padding: 0; display: grid; }
.plist__rows li { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; padding: 0.55rem 0; border-bottom: 2px dashed rgb(21 41 75 / 35%); }
.plist__rows li:last-child { border-bottom: 0; }
.plist__plan { font-weight: 600; }
.plist__price { display: grid; justify-items: end; text-align: right; white-space: nowrap; }
.plist__price b { font-family: var(--f-display); font-weight: 900; font-size: 1.35rem; }
.plist__price small { font-size: 0.875rem; color: rgb(21 41 75 / 65%); }
.plist__note { font-weight: 700; font-size: 0.95rem; padding: 0.35rem 0.6rem; background: var(--paper); border: 2px solid var(--ink); justify-self: start; }
.plist__card--video { background: var(--paper); }
@media (min-width: 720px) { .plist { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .plist { grid-template-columns: repeat(3, 1fr); } }
.pinfo { display: grid; gap: 1.75rem; }
.pinfo__card { display: grid; gap: 1rem; align-content: start; padding: clamp(1.3rem, 1rem + 1.4vw, 2rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
.pinfo__card--terms { background: var(--yellow); }
.pinfo__title { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.3rem); }
.pinfo__list { list-style: none; padding: 0; display: grid; gap: 0.7rem; }
.pinfo__list li { line-height: 1.4; padding-bottom: 0.7rem; border-bottom: 2px dashed rgb(21 41 75 / 35%); }
.pinfo__list li:last-child { border-bottom: 0; padding-bottom: 0; }
.pinfo__list b { display: block; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; }
@media (min-width: 960px) { .pinfo { grid-template-columns: 1fr 1fr; } }
.plist__main { white-space: nowrap; }
.plist__main b { margin-right: 0.2rem; }
.system__start { font-size: 1.0625rem; }
.plist__plan b { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1rem; }
.tip { display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; margin-left: 0.4rem; padding: 0; vertical-align: 0.1em; border: 2px solid var(--ink); border-radius: 50%; background: var(--yellow); color: var(--ink); font-family: var(--f-body); font-weight: 900; font-size: 0.75rem; line-height: 1; cursor: help; }
.tip:hover, .tip[aria-expanded="true"] { background: var(--ink); color: var(--yellow); }
.tip:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
.tip__box { display: none; position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 30; padding: 0.7rem 0.85rem; background: var(--ink); color: var(--paper); font-weight: 500; font-size: 0.9375rem; line-height: 1.4; text-decoration: none; border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--orange); }
.tip:hover + .tip__box, .tip:focus-visible + .tip__box, .tip[aria-expanded="true"] + .tip__box { display: block; }
.tier__list li { position: relative; }
html[lang] .phero--courses .phero__title { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.3rem); max-width: 20ch; }
.phero__after { display: grid; gap: 1.25rem; }
@media (min-width: 1024px) {
.phero--courses .phero__grid { grid-template-areas: "copy art" "after art"; align-items: start; row-gap: 1.75rem; }
.phero--courses .phero__copy { grid-area: copy; }
.phero--courses .tour { grid-area: art; align-self: center; }
.phero--courses .phero__after { grid-area: after; }
}
.course__prog summary::after { font-family: var(--f-body); line-height: 1; font-size: 1rem; }
.cstats { list-style: none; padding: 0; margin-top: 0.5rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
.cstats li { display: grid; gap: 0.15rem; align-content: start; padding: 0.7rem 0.8rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.cstats b { font-family: var(--f-display); font-weight: 900; font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); line-height: 1; color: var(--orange); }
.cstats span { font-weight: 700; font-size: 0.9375rem; line-height: 1.25; }
.tour { transform: rotate(-1deg); }
.tour__btn { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.tour__btn img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(1.05); }
.tour__btn::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(21 41 75 / 0%) 45%, rgb(21 41 75 / 70%) 100%); }
.tour__play { position: absolute; z-index: 1; left: 50%; top: 45%; width: clamp(72px, 10vw, 104px); aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: var(--orange); border: 4px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); transition: transform 0.15s; }
.tour__play::before { content: ''; position: absolute; left: 38%; top: 28%; border-style: solid; border-width: 22px 0 22px 34px; border-color: transparent transparent transparent var(--white); }
.tour__btn:hover .tour__play { transform: translate(-50%, -50%) scale(1.07); }
.tour__btn:focus-visible { outline: 4px solid var(--orange); outline-offset: 4px; }
.tour__cap { position: absolute; z-index: 1; left: 0.9rem; right: 0.9rem; bottom: 0.8rem; text-align: left; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(0.95rem, 0.85rem + 0.4vw, 1.2rem); line-height: 1.15; color: var(--white); }
.tour__cap small { font-family: var(--f-body); font-weight: 700; text-transform: none; font-size: 0.9rem; margin-left: 0.3rem; }
.courses-sec .h2, .courses-sec .lead { color: var(--white); }
.course__draft { margin: -0.5rem 0 1.25rem; color: var(--white); font-weight: 700; }
.upds-sec .course__draft { color: var(--ink); }
.courses { list-style: none; padding: 0; display: grid; gap: 1.5rem; align-items: start; }
.course { display: grid; gap: 0.8rem; align-content: start; padding: 1.3rem 1.3rem 1.4rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg); }
.course__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.course__tag { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 0.9rem; padding: 0.25rem 0.65rem; background: var(--yellow); border: 2px solid var(--ink); transform: rotate(2deg); }
.course__title { font-weight: 900; text-transform: uppercase; font-size: clamp(1.2rem, 1.05rem + 0.5vw, 1.45rem); line-height: 1.1; }
.course__prog { border-top: 2px dashed var(--ink); padding-top: 0.6rem; }
.course__prog summary { cursor: pointer; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; list-style: none; display: flex; align-items: center; gap: 0.5rem; }
.course__prog summary::-webkit-details-marker { display: none; }
.course__prog summary::after { content: '+'; display: inline-grid; place-items: center; width: 1.4rem; height: 1.4rem; border: 2px solid var(--ink); font-weight: 900; }
.course__prog[open] summary::after { content: '−'; }
.course__prog ol { margin-top: 0.6rem; padding-left: 1.4rem; display: grid; gap: 0.4rem; line-height: 1.35; }
.course__out { font-weight: 600; padding: 0.55rem 0.7rem; background: #c6ecb0; border: 2px solid var(--ink); }
.course--more { background: var(--yellow); }
@media (min-width: 760px) { .courses { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .courses { grid-template-columns: repeat(3, 1fr); } }
.trial { display: grid; gap: 2rem; align-items: start; }
.trial__copy { display: grid; gap: 1rem; }
.trial__copy .h2 { max-width: 20ch; }
.trial__what { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.05rem; }
.trial__card { display: grid; gap: 0.9rem; padding: clamp(1.3rem, 1rem + 1.4vw, 2rem); background: var(--white); border: 4px solid var(--ink); box-shadow: 10px 10px 0 var(--orange); transform: rotate(-0.6deg); }
.trial__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: 1.25rem; }
.trial__card .join__price { color: var(--orange); }
.trial__credit { font-weight: 700; }
.trial__card .btn { width: 100%; }
@media (min-width: 960px) { .trial { grid-template-columns: 1.2fr 0.8fr; gap: 3.5rem; } }
.upds { list-style: none; padding: 0; display: grid; gap: 0.9rem; }
.upd { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 0.6rem 1rem; padding: 0.85rem 1rem; background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); }
.upd__date { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; white-space: nowrap; }
.upd__tag { font-weight: 800; font-size: 0.875rem; padding: 0.15rem 0.55rem; border: 2px solid var(--ink); border-radius: 999px; white-space: nowrap; }
.upd__tag--ai { background: #c6ecb0; }
.upd__tag--sales { background: var(--yellow); }
.upd__tag--marketing { background: #bfe6f7; }
.upd__text { font-weight: 600; line-height: 1.35; }
@media (max-width: 640px) { .upd { grid-template-columns: auto 1fr; } .upd__text { grid-column: 1 / -1; } .upd__tag { justify-self: start; } }
.author { display: grid; gap: 2rem; align-items: center; }
.author__photo { max-width: 460px; transform: rotate(-1.5deg); }
.author__photo img { aspect-ratio: 1; }
.author__copy { display: grid; gap: 1rem; }
.author__quote { margin: 0.4rem 0 0; padding: 1rem 1.2rem; font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.35rem); line-height: 1.2; background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: var(--shadow); }
@media (min-width: 960px) { .author { grid-template-columns: 0.8fr 1.2fr; gap: 3.5rem; } }
.plans { list-style: none; padding: 0; display: grid; gap: 0.5rem; }
.plans li { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: 0.6rem; padding: 0.55rem 0.7rem; border: 2px solid var(--ink); background: var(--paper); }
.plans li > span { font-weight: 700; }
.plans b { font-family: var(--f-display); font-weight: 900; font-size: 1.2rem; white-space: nowrap; }
.plans em { font-style: normal; font-weight: 900; font-size: 0.85rem; padding: 0.1rem 0.45rem; background: #c6ecb0; border: 2px solid var(--ink); }
.join__trial { justify-self: center; font-weight: 700; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.paymarks { display: grid; justify-items: center; gap: 0.45rem; margin-block: 0.25rem; }
.paymarks__cap { display: inline-flex; align-items: center; gap: 0.35rem; margin: 0; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.02em; color: rgb(21 41 75 / 80%); }
.paymarks__lock { flex: none; }
.paymarks__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.3rem; margin: 0; padding: 0; list-style: none; }
.paymarks__list li { display: block; line-height: 0; }
.paymarks__list img { display: block; width: min(44px, 9.4vw); height: auto; aspect-ratio: 38 / 24; border-radius: 4px; }
.lead-form--crm .paymarks { margin-top: 0.75rem; }
[data-page='privacy'] .sticky-cta, [data-page='terms'] .sticky-cta, [data-page='cookies'] .sticky-cta { display: none !important; }
.legal .container { max-width: calc(52rem + var(--gutter) * 2); }
.legal__head { display: grid; gap: 0.6rem; margin: 1.25rem 0 1.5rem; }
.legal__title { max-width: none; color: var(--ink); }
.legal__updated { font-weight: 700; opacity: 0.8; }
.legal__ru { margin-bottom: 1.25rem; padding: 0.9rem 1.1rem; background: var(--yellow); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-sm); font-weight: 600; line-height: 1.45; }
.legal__ru a { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.legal__prose { padding: clamp(1.25rem, 0.8rem + 2.4vw, 2.75rem); background: var(--white); border: var(--bw) solid var(--ink); box-shadow: var(--shadow-lg);
font-size: 1.0625rem; line-height: 1.6; overflow-wrap: anywhere; }
.legal__prose > * + * { margin-top: 1rem; }
.legal__prose h2 { margin-top: 2.25rem; font-family: var(--f-display); font-weight: 800; text-transform: uppercase; font-size: clamp(1.15rem, 1rem + 0.6vw, 1.4rem); line-height: 1.15; color: var(--ink); }
.legal__prose h3 { margin-top: 1.5rem; font-weight: 700; font-size: 1.125rem; line-height: 1.3; }
.legal__prose h2 + *, .legal__prose h3 + * { margin-top: 0.6rem; }
.legal__prose ul { padding-left: 1.25rem; display: grid; gap: 0.45rem; }
.legal__prose li::marker { color: var(--orange); }
.legal__prose a { font-weight: 700; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.legal__callout { padding: 1rem 1.15rem; background: rgb(248 214 72 / 28%); border-left: 6px solid var(--orange); }
.legal__callout > * + * { margin-top: 0.75rem; }
.legal__contact { display: grid; gap: 0.2rem; padding: 1rem 1.15rem; background: var(--paper); border: var(--bw) solid var(--ink); }
.legal__table table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.45; }
.legal__table th, .legal__table td { padding: 0.6rem 0.7rem; text-align: left; vertical-align: top; border: 2px solid var(--ink); }
.legal__table th { background: var(--ink); color: var(--paper); font-weight: 700; }
.legal__table td, .legal__table th { overflow-wrap: normal; }
@media (min-width: 640px) { .legal__table th:nth-child(1) { width: 19%; } .legal__table th:nth-child(2) { width: 19%; } .legal__table th:nth-child(4) { width: 15%; } }
@media (max-width: 639px) {
.legal__table thead { display: none; }
.legal__table table, .legal__table tbody, .legal__table tr, .legal__table td { display: block; }
.legal__table tr { margin-bottom: 0.9rem; border: var(--bw) solid var(--ink); }
.legal__table td { border: 0; border-top: 1px solid rgb(21 41 75 / 20%); padding: 0.5rem 0.75rem; }
.legal__table td:first-child { border-top: 0; background: var(--ink); color: var(--paper); font-weight: 700; }
.legal__table td:not(:first-child)::before { content: attr(data-th); display: block; font-weight: 700; font-size: 0.8125rem; text-transform: uppercase; opacity: 0.7; }
}
.lead-form--crm { transform: none; gap: 0.75rem; padding: clamp(0.9rem, 0.6rem + 1.2vw, 1.6rem); }
.crm-embed { min-height: 640px; background: var(--white); }
.crm-embed iframe { display: block; width: 100%; min-height: 640px; border: 0; background: transparent; }
.lead-form--crm .lead-form__consent { text-align: center; font-size: 0.875rem; }
@media (min-width: 1024px) { .plan-steps .steps__list { grid-template-columns: repeat(3, 1fr); } }
body.at-form .sticky-cta { transform: translateY(110%); visibility: hidden; }
.sticky-cta { transition: transform 0.2s ease, visibility 0.2s; }
@media (max-width: 639px) { .lead-form--crm { padding: 0.75rem 0.4rem; } .lead-form--crm .lead-form__title { padding-inline: 0.5rem; } }
@media (max-width: 959.98px) {
.system { display: flex; flex-direction: column; gap: 0.9rem; }
.system__main, .system__side { display: contents; }
.system__badge { order: 1; align-self: flex-start; }
.system__main > .h2 { order: 2; }
.system__main > .lead { order: 3; }
.system__what { order: 4; margin-top: 0.4rem; }
.system__side .tier__list { order: 5; }
.system__main .tier__cost { order: 6; margin-top: 0.6rem; padding-top: 1rem; border-top: 2px dashed var(--ink); }
.system__sep { order: 7; align-self: flex-start; }
.system__main .btn { order: 8; align-self: flex-start; }
.system__note { order: 9; }
}
[data-page='club-join'] .sticky-cta, [data-page='club-applied'] .sticky-cta { display: none !important; }
.apply { display: grid; gap: clamp(1.5rem, 1rem + 2vw, 3rem); margin-top: 1.25rem; align-items: start; }
.apply__copy { display: grid; gap: 1rem; align-content: start; }
.apply__title { max-width: 18ch; color: var(--ink); }
.apply--done .apply__title { color: var(--blue); max-width: 16ch; }
.apply__steps { display: grid; gap: 0.6rem; padding-left: 1.4rem; font-weight: 600; font-size: 1.0625rem; }
.apply__steps li::marker { font-family: var(--f-display); font-weight: 900; color: var(--orange); }
@media (min-width: 960px) { .apply { grid-template-columns: 1fr 1.05fr; } .apply--done { grid-template-columns: minmax(0, 760px); } }
.pbadge { position: absolute; right: -10px; bottom: -14px; z-index: 2; display: block; line-height: 0; background: var(--white); box-shadow: 4px 4px 0 var(--ink); transform: rotate(-4deg); transition: transform 0.15s ease; }
a.pbadge:hover { transform: rotate(-4deg) scale(1.05); }
.phero__art .pbadge img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.pbadge--google { width: clamp(86px, 7.5vw, 120px); border-radius: 4px; }
.pbadge--meta { width: clamp(124px, 11vw, 170px); }
.creatives-sec .h2, .creatives-sec .lead { color: var(--paper); }
.creatives { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 0.9rem; }
@media (min-width: 700px) { .creatives { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.6rem 1.25rem; } }
@media (min-width: 1100px) { .creatives { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.creative { display: grid; gap: 0.55rem; color: var(--paper); text-decoration: none; }
.creative__frame { position: relative; display: grid; place-items: center; aspect-ratio: 9 / 16; overflow: hidden; background: var(--ink); border: var(--bw) solid var(--paper); box-shadow: 5px 5px 0 var(--yellow); }
.creative__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.creative__frame--c0 { background: var(--blue); } .creative__frame--c1 { background: var(--orange); } .creative__frame--c2 { background: var(--green); } .creative__frame--c3 { background: var(--yellow); }
.creative--empty .creative__frame::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, transparent 0 14px, rgb(21 41 75 / 9%) 14px 16px); }
.creative__icon { position: relative; width: 56px; height: 56px; border-radius: 50%; background: var(--orange); border: var(--bw) solid var(--ink); box-shadow: 3px 3px 0 var(--ink); transition: transform 0.15s ease; }
.creative__icon::after { content: ''; position: absolute; left: 55%; top: 50%; transform: translate(-50%, -50%); border-left: 18px solid var(--white); border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
a.creative:hover .creative__icon, a.creative:focus-visible .creative__icon { transform: scale(1.1); }
.creative__todo { position: absolute; left: 6px; right: 6px; bottom: 8px; padding: 0.15rem 0.4rem; font-weight: 700; font-size: 0.8125rem; line-height: 1.2; color: var(--ink); background: var(--white); border: 2px dashed var(--ink); text-align: center; }
.creative__name { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(0.9rem, 0.85rem + 0.25vw, 1.05rem); line-height: 1.1; }
@media (max-width: 639.98px) { .creative__icon { width: 46px; height: 46px; } .creative__todo { font-size: 0.6875rem; } }
.course__status { justify-self: start; margin: 0; padding: 0.3rem 0.65rem; font-weight: 800; font-size: 0.875rem; line-height: 1.25; border: 2px solid var(--ink); }
.course__status--ready { background: var(--blue); color: var(--white); }
.course__status--ready::before { content: '✓ '; }
.course__status--soon { background: var(--paper); color: var(--ink); border-style: dashed; }
.course--soon { box-shadow: var(--shadow); }
.vcta { margin-top: clamp(2rem, 4vw, 3rem); display: grid; gap: 1rem 2rem; align-items: center; padding: clamp(1.25rem, 3vw, 2rem); background: var(--white); color: var(--ink); border: var(--bw) solid var(--ink); box-shadow: 8px 8px 0 var(--yellow); }
@media (min-width: 900px) { .vcta { grid-template-columns: 1fr auto; } .vcta__note { grid-column: 2; } }
.vcta__copy { display: grid; gap: 0.6rem; }
.vcta__title { margin: 0; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); }
.vcta__text { margin: 0; max-width: 60ch; }
.vcta__btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem; }
.vcta__play { position: relative; width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--white); border: 2px solid var(--ink); }
.vcta__play::after { content: ''; position: absolute; left: 56%; top: 50%; transform: translate(-50%, -50%); border-left: 12px solid var(--ink); border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.vcta__note { margin: -0.4rem 0 0; font-size: 0.875rem; opacity: 0.75; text-align: center; }
@media (min-width: 1100px) { .creatives--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 980px; margin-inline: auto; } }
.creatives__more { margin-top: clamp(1.4rem, 3vw, 2rem); text-align: center; }
/*wss-perf-v1*/
.trust__value,.mini-case ul b{animation-play-state:paused}
.trust.is-visible .trust__value,.mini-case.is-visible ul b{animation-play-state:running}