@import url("./site/tokens.038ae78685e6.css");
@import url("./site/base.d37ee2639c74.css");
.site { display: block; }
.site > section { padding-block: var(--space-2xl); }
.site > section + section > .container,
.site > section + section > .container.ask { position: relative; }
h1, h2, h3 { color: var(--color-ink); }
.lead { color: var(--color-ink-2); }
.num { font-variant-numeric: tabular-nums; }
a { color: var(--color-accent); }
a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; border-radius: 2px; }
@media (hover: hover) and (pointer: fine) {
a:hover { color: var(--color-accent-hover); }
}
.more { color: var(--color-accent); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
.skip {
position: absolute; left: var(--space-md); top: calc(-1 * var(--space-3xl)); z-index: var(--z-toast);
padding: var(--space-xs) var(--space-md); background: var(--color-ink); color: var(--color-paper);
}
.skip:focus-visible { top: var(--space-md); }
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs);
min-height: 48px; padding: 0 var(--space-lg);
border: 1px solid var(--color-accent); border-radius: var(--radius-input);
background: var(--color-accent); color: var(--color-accent-ink);
font: 600 var(--text-md)/1 var(--font-body); white-space: nowrap; text-decoration: none; cursor: pointer;
transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), transform var(--dur-micro) var(--ease-out);
}
.btn:visited { color: var(--color-accent-ink); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.btn[aria-busy="true"] { cursor: progress; }
.btn--quiet { background: transparent; color: var(--color-ink); border-color: var(--color-muted); }
.btn--quiet:visited { color: var(--color-ink); }
@media (hover: hover) and (pointer: fine) {
.btn:hover { background: var(--color-accent-hover); border-color: var(--color-accent-hover); color: var(--color-accent-ink); }
.btn--quiet:hover { background: var(--color-paper-2); border-color: var(--color-ink); color: var(--color-ink); }
}
@media (prefers-reduced-motion: reduce) { .btn { transition: background-color var(--dur-short) linear; } }
.site-banner {
margin: 0; padding: var(--space-xs) var(--gutter);
background: var(--color-dark); color: var(--color-on-dark);
font-size: var(--text-sm); text-align: center;
}
.site-banner a { color: var(--color-on-dark); text-decoration: underline; text-decoration-color: var(--color-on-dark-muted); text-underline-offset: 0.2em; }
.site-banner a:focus-visible { outline-color: var(--color-on-dark-link); }
@media (hover: hover) and (pointer: fine) { .site-banner a:hover { color: var(--color-on-dark-link); } }
.site-top {
position: sticky; top: 0; z-index: var(--z-sticky-nav);
background: var(--color-paper); border-bottom: 1px solid var(--color-rule);
}
.site-top__bar {
display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-xl);
min-height: var(--nav-height);
}
.site-top__logo { display: inline-flex; align-items: center; gap: var(--space-xs); color: var(--color-ink); font-weight: 600; font-size: var(--text-lg); text-decoration: none; letter-spacing: -0.01em; }
.site-top__logo:visited { color: var(--color-ink); }
.site-nav { display: flex; align-items: center; gap: var(--space-lg); font-size: var(--text-sm); }
.site-nav > a, .site-nav__group > summary { color: var(--color-ink); text-decoration: none; white-space: nowrap; }
.site-nav__group { position: relative; }
.site-nav__group > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: var(--space-2xs); }
.site-nav__group > summary::-webkit-details-marker { display: none; }
.site-nav__group > summary::after {
content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
transform: translateY(-2px) rotate(45deg); transition: transform var(--dur-short) var(--ease-out);
}
.site-nav__group[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.site-nav__group > summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; border-radius: 2px; }
.site-nav__panel {
position: absolute; top: calc(100% + var(--space-sm)); left: calc(-1 * var(--space-md)); z-index: var(--z-dropdown);
display: grid; min-width: 15rem; padding: var(--space-xs);
background: var(--color-paper); border: 1px solid var(--color-rule); border-radius: var(--radius-input);
}
.site-nav__panel a { padding: var(--space-xs) var(--space-sm); border-radius: 6px; color: var(--color-ink); text-decoration: none; white-space: nowrap; }
.site-nav__all { border-top: 1px solid var(--color-rule); margin-top: var(--space-2xs); }
@media (hover: hover) and (pointer: fine) {
.site-nav > a:hover, .site-nav__group > summary:hover { color: var(--color-accent); }
.site-nav__panel a:hover { background: var(--color-paper-2); color: var(--color-ink); }
}
.lp-top__actions { display: flex; align-items: center; gap: var(--space-md); }
.site-top__login { color: var(--color-ink); font-size: var(--text-sm); text-decoration: none; }
.site-top__cta { min-height: 44px; font-size: var(--text-sm); gap: 0; }
@media (hover: hover) and (pointer: fine) { .site-top__login:hover { color: var(--color-accent); } }
.site-mobile { display: none; position: relative; }
.site-mobile > summary {
list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-md);
border: 1px solid var(--color-muted); border-radius: var(--radius-input); color: var(--color-ink); font-weight: 600; font-size: var(--text-sm);
}
.site-mobile > summary::-webkit-details-marker { display: none; }
.site-mobile > summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.site-mobile__panel {
position: absolute; right: 0; top: calc(100% + var(--space-xs)); z-index: var(--z-dropdown);
display: grid; width: 20rem; max-width: calc(100dvw - 2 * var(--gutter)); max-height: 75dvh; overflow-y: auto; padding: var(--space-md);
background: var(--color-paper); border: 1px solid var(--color-rule); border-radius: var(--radius-input);
}
.site-mobile__panel a:not(.btn) { padding: var(--space-xs) 0; color: var(--color-ink); text-decoration: none; }
.site-mobile__title { margin: var(--space-md) 0 var(--space-2xs); font-size: var(--text-sm); color: var(--color-muted); }
.site-mobile__cta { width: 100%; }
@media (max-width: 75rem) {
.site-top__cta-long { display: none; }
.site-nav { gap: var(--space-md); }
}
@media (max-width: 64rem) {
.site-nav { display: none; }
.site-top__bar { grid-template-columns: minmax(0, 1fr) auto; }
.site-mobile { display: block; }
}
@media (max-width: 30rem) {
.site-top__login, .site-top__cta { display: none; }
}
.ask {
display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); row-gap: var(--space-lg);
align-items: start;
}
.ask > h2, .ask__head { grid-column: 1 / span 5; }
.ask__head { display: grid; gap: var(--space-md); }
@media (min-width: 60rem) { .ask__head { position: sticky; top: calc(var(--nav-height) + var(--space-xl)); } }
.ask__answer { grid-column: 7 / -1; }
.ask__line { color: var(--color-ink-2); font-size: var(--text-lead); line-height: 1.45; max-width: 40ch; }
.ask__answer > p + p { margin-top: var(--space-md); }
.ask__links { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); align-self: end; }
.ask--wide { margin-bottom: var(--space-2xl); }
.price > .container, .how > .container, .faq > .container, .inside > .container, .points > .container, .example > .container,
.features > .container, .formats > .container, .cards > .container, .related > .container, .page-close > .container {
border-top: 1px solid var(--color-rule); padding-top: var(--space-2xl);
}
@media (max-width: 60rem) {
.ask > h2, .ask__head, .ask__answer { grid-column: 1 / -1; }
}
.hero { padding-block: var(--space-2xl) var(--space-xl); }
.hero__grid {
display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-3xl); align-items: end;
}
.hero h1 { font-size: clamp(2.5rem, 3.2vw + 1rem, 4.25rem); max-width: 19ch; line-height: 1.02; }
.hero__lead { margin-top: var(--space-lg); max-width: 50ch; }
.hero__demo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm) var(--space-md); margin-top: var(--space-xl); color: var(--color-muted); font-size: var(--text-sm); }
.offer {
display: grid; gap: var(--space-md); padding: var(--space-xl);
background: var(--color-paper-2); border-radius: var(--radius-card);
}
.offer__figure { display: grid; gap: var(--space-2xs); }
.offer__figure b {
font-size: clamp(5rem, 8vw + 1rem, 8.5rem); font-weight: 600; line-height: 0.9; letter-spacing: -0.05em;
font-variant-numeric: tabular-nums; color: var(--color-ink);
}
.offer__figure span { font-size: var(--text-xl); font-weight: 600; letter-spacing: -0.01em; }
.offer__terms { color: var(--color-ink-2); }
.offer__cta { width: 100%; margin-top: var(--space-xs); }
@media (max-width: 60rem) {
.hero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
}
.day { padding-top: var(--space-lg); }
.day__shots {
display: grid; grid-template-columns: minmax(0, 9fr) minmax(0, 3fr); gap: var(--gap-columns); align-items: end;
margin: var(--space-xl) 0 0;
}
.day__desk, .day__phone, .shot__frame {
border-radius: min(1vw, var(--radius-card));
outline: 1px solid var(--color-shade); outline-offset: -1px;
background: var(--color-paper-2);
}
.day__desk { aspect-ratio: 1416 / 1340; }
.day__phone { aspect-ratio: 780 / 1688; }
.day__desk > img, .day__phone > img, .shot__frame > img { object-position: 0 0; }
.day__shots figcaption { grid-column: 1 / -1; color: var(--color-muted); font-size: var(--text-sm); max-width: 70ch; }
@media (max-width: 40rem) {
.day__shots { grid-template-columns: minmax(0, 1fr); }
.day__phone { max-width: 14rem; }
}
.price__list { list-style: none; margin: 0; padding: 0; display: grid; }
.price__list > li { padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.price__list > li:first-child { padding-top: 0; }
.price__line { display: flex; align-items: baseline; gap: var(--space-sm); }
.price__line h3 { font-size: var(--text-title); flex: 0 1 auto; font-variant-numeric: tabular-nums; }
.price__dots { flex: 1 1 var(--space-xl); min-width: var(--space-lg); border-bottom: 2px dotted var(--color-rule); transform: translateY(-0.3em); }
.price__line b { font-size: var(--text-2xl); font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.price__list p { margin-top: var(--space-xs); color: var(--color-ink-2); max-width: 60ch; }
@media (max-width: 40rem) {
.price__line { flex-wrap: wrap; justify-content: space-between; column-gap: var(--space-md); }
.price__dots { display: none; }
}
.calc__grid {
display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-3xl);
padding: var(--space-2xl); background: var(--color-paper-2); border-radius: var(--radius-card);
}
.calc__controls { display: grid; gap: var(--space-lg); align-content: start; }
.calc__lead { color: var(--color-ink-2); }
.calc__field { display: grid; gap: var(--space-xs); font-size: var(--text-sm); }
.calc__field span { display: flex; justify-content: space-between; gap: var(--space-md); }
.calc__field output { font-weight: 600; font-size: var(--text-md); font-variant-numeric: tabular-nums; }
.calc__field input { width: 100%; min-height: 44px; accent-color: var(--color-accent); cursor: pointer; }
.calc__field input:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.calc__saving { display: grid; gap: var(--space-2xs); padding-top: var(--space-lg); border-top: 1px solid var(--color-rule); }
.calc__saving span { color: var(--color-ink-2); font-size: var(--text-sm); }
.calc__saving b { font-size: var(--text-3xl); font-weight: 600; letter-spacing: -0.02em; }
.calc__rows { display: grid; gap: var(--space-xl); align-content: start; }
.calc__row { display: grid; gap: var(--space-xs); }
.calc__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-md); }
.calc__head span { font-weight: 600; }
.calc__head b { font-size: var(--text-xl); font-weight: 600; white-space: nowrap; }
.calc__bar { height: 12px; border-radius: var(--radius-pill); background: var(--color-paper); overflow: hidden; }
.calc__bar i {
display: block; height: 100%; background: var(--color-ink-2); border-radius: inherit;
transform-origin: left center; transform: scaleX(1); transition: transform var(--dur-long) var(--ease-out);
}
.calc__row--ours .calc__bar i { background: var(--color-accent); }
.calc__row--ours .calc__head b { color: var(--color-accent); }
.calc__note { color: var(--color-ink-2); font-size: var(--text-sm); }
.calc__foot { color: var(--color-ink-2); font-size: var(--text-sm); max-width: 70ch; }
.calc__foot .more { display: inline-block; margin-top: var(--space-xs); }
@media (prefers-reduced-motion: reduce) { .calc__bar i { transition: none; } }
@media (max-width: 60rem) {
.calc__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); padding: var(--space-xl) var(--space-lg); }
}
.features__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-3xl); }
.features__rows .lp-rows__item:nth-child(2) { padding-top: 0; }
.lp-rows { list-style: none; margin: 0; padding: 0; display: grid; }
.lp-rows__item { display: grid; gap: var(--space-xs); padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.lp-rows__item:first-child { padding-top: 0; }
.lp-rows__item p { color: var(--color-ink-2); max-width: 60ch; }
.lp-rows__item--accent { padding: var(--space-lg); background: var(--color-paper-3); border-radius: var(--radius-input); border-bottom: 0; }
.lp-rows__item--accent:first-child { padding-top: var(--space-lg); }
.lp-tag { color: var(--color-accent); font-size: var(--text-sm); font-weight: 600; }
@media (max-width: 60rem) {
.features__rows { grid-template-columns: minmax(0, 1fr); }
.features__rows .lp-rows__item:nth-child(2) { padding-top: var(--space-lg); }
}
.formats h2 { margin-bottom: var(--space-xl); }
.formats__bar { display: flex; gap: var(--space-xs); overflow-x: auto; padding-bottom: var(--space-2xs); margin-bottom: var(--space-xl); scrollbar-width: thin; }
.formats__tab {
flex: 0 0 auto; min-height: 44px; padding: 0 var(--space-md);
border: 1px solid var(--color-rule); border-radius: var(--radius-pill); background: var(--color-paper); color: var(--color-ink);
font-size: var(--text-sm); white-space: nowrap; cursor: pointer;
transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out);
}
.formats__tab[aria-selected="true"] { background: var(--color-ink); border-color: var(--color-ink); color: var(--color-paper); }
.formats__tab:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .formats__tab[aria-selected="false"]:hover { background: var(--color-paper-2); } }
.formats__panel { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-3xl); }
.formats__pain { display: grid; gap: var(--space-xl); align-content: start; }
.formats__ask { font-size: var(--text-xl); line-height: 1.4; letter-spacing: -0.01em; max-width: 34ch; }
.formats__ask b { font-weight: 600; }
.formats__fix { display: grid; gap: var(--space-md); align-content: start; }
.formats__fix ul { margin: 0; padding: 0; list-style: none; display: grid; }
.formats__fix li { padding-block: var(--space-sm); border-bottom: 1px solid var(--color-rule); color: var(--color-ink-2); }
.lp-formats__more { justify-self: start; font-weight: 600; text-decoration: underline; text-underline-offset: 0.22em; }
.formats__others { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: var(--gap-columns); margin-top: var(--space-2xl); }
.lp-formats__plaque { display: grid; gap: var(--space-2xs); padding-top: var(--space-md); border-top: 2px solid var(--color-ink); color: var(--color-ink); text-decoration: none; }
.lp-formats__plaque b { font-size: var(--text-lg); font-weight: 600; }
.lp-formats__plaque span { color: var(--color-ink-2); }
@media (hover: hover) and (pointer: fine) { .lp-formats__plaque:hover b { color: var(--color-accent); } }
@media (max-width: 60rem) { .formats__panel { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); } }
.lp-frag { border: 1px solid var(--color-rule); border-radius: var(--radius-input); padding: var(--space-md) var(--space-lg); max-width: 32rem; }
.lp-frag__title { font-weight: 600; margin-bottom: var(--space-xs); }
.lp-frag__title small { font-weight: 400; color: var(--color-muted); font-size: var(--text-sm); margin-left: var(--space-xs); }
.lp-frag ul { margin: 0; padding: 0; list-style: none; }
.lp-frag li { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); padding-block: var(--space-xs); border-top: 1px solid var(--color-rule); font-size: var(--text-sm); }
.lp-frag li span { display: block; color: var(--color-muted); }
.lp-frag em { font-style: normal; color: var(--color-accent); font-weight: 600; white-space: nowrap; }
.lp-frag__num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.inside__groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2xl) var(--gap-columns); }
.inside__group > summary {
list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-md);
font-size: var(--text-lg); font-weight: 600; letter-spacing: -0.01em; padding-bottom: var(--space-sm); border-bottom: 2px solid var(--color-ink);
}
.inside__group > summary::-webkit-details-marker { display: none; }
.inside__group > summary::after { content: "−"; font-weight: 400; color: var(--color-muted); }
.inside__group:not([open]) > summary::after { content: "+"; }
.inside__group > summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.inside__group ul { margin: 0; padding: 0; list-style: none; }
.inside__group li { padding-block: var(--space-xs); border-bottom: 1px solid var(--color-rule); color: var(--color-ink-2); font-size: var(--text-sm); line-height: 1.45; }
@media (max-width: 60rem) { .inside__groups { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 40rem) { .inside__groups { grid-template-columns: minmax(0, 1fr); } }
.how__list { margin: 0; padding: 0; list-style: none; counter-reset: шаг; display: grid; }
.how__list li {
counter-increment: шаг; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); column-gap: var(--space-md); row-gap: var(--space-2xs);
padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule);
}
.how__list li:first-child { padding-top: 0; }
.how__list li::before {
content: counter(шаг); grid-row: span 2; font-size: var(--text-2xl); font-weight: 600; line-height: 1;
color: var(--color-accent); font-variant-numeric: tabular-nums;
}
.how__list b { font-size: var(--text-title); font-weight: 600; letter-spacing: -0.01em; }
.how__list span { color: var(--color-ink-2); }
.first > .container { border-top: 2px solid var(--color-ink); padding-top: var(--space-2xl); }
.first h2 { font-size: var(--text-section); }
.first__intro { margin-top: var(--space-md); }
.first__list { list-style: none; margin: var(--space-2xl) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap-columns); }
.first__list li { display: grid; gap: var(--space-md); align-content: start; padding-top: var(--space-lg); border-top: 1px solid var(--color-rule); }
.first__list h3 { font-size: var(--text-2xl); letter-spacing: -0.02em; }
.first__list p { color: var(--color-ink-2); max-width: 46ch; }
@media (max-width: 40rem) { .first__list { grid-template-columns: minmax(0, 1fr); } }
.faq__list { display: grid; }
.faq__item { border-bottom: 1px solid var(--color-rule); }
.faq__item:first-child summary { padding-top: 0; }
.faq__item > summary {
list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-md); align-items: baseline;
padding-block: var(--space-lg); font-size: var(--text-lg); font-weight: 600; letter-spacing: -0.01em;
}
.faq__item > summary::-webkit-details-marker { display: none; }
.faq__item > summary::after { content: "+"; font-weight: 400; font-size: var(--text-xl); line-height: 1; color: var(--color-accent); transition: transform var(--dur-short) var(--ease-out); }
.faq__item[open] > summary::after { transform: rotate(45deg); }
.faq__item > summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; border-radius: 2px; }
.faq__item > p { padding-bottom: var(--space-lg); color: var(--color-ink-2); max-width: 62ch; }
.close__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-3xl); align-items: start; border-top: 2px solid var(--color-ink); padding-top: var(--space-2xl); }
.close__text { display: grid; gap: var(--space-md); align-content: start; }
.close__text .btn { margin-block: var(--space-xs); }
.close__small { color: var(--color-muted); font-size: var(--text-sm); }
@media (max-width: 60rem) { .close__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); } }
.lead-box { display: grid; gap: var(--space-lg); padding: var(--space-xl); background: var(--color-paper-2); border-radius: var(--radius-card); }
.lead-box h3, .lead-box__title { font-size: var(--text-title); }
.landing__form { display: grid; gap: var(--space-md); }
.sale-box__field { display: grid; gap: var(--space-2xs); }
.sale-box__field label, .lead-choice legend { font-size: var(--text-sm); font-weight: 600; color: var(--color-ink); }
.landing__form input:not([type="radio"]):not([type="checkbox"]), .landing__form select, .landing__form textarea {
width: 100%; min-height: 48px; padding: var(--space-sm) var(--space-md);
border: 1px solid var(--color-muted); border-radius: var(--radius-input); background: var(--color-paper); color: var(--color-ink);
font-size: var(--text-md); outline: 2px solid transparent; outline-offset: -3px;
}
.landing__form textarea { min-height: 96px; resize: vertical; }
.landing__form input:focus-visible, .landing__form select:focus-visible, .landing__form textarea:focus-visible { outline-color: var(--color-focus); }
.landing__form input[aria-invalid="true"] { border-color: var(--color-error); }
.lead-choice { margin: 0; padding: 0; border: 0; display: grid; gap: var(--space-xs); }
.lead-choice__options { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.lead-choice__option { position: relative; display: inline-flex; }
.lead-choice__option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lead-choice__option span {
display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-md);
border: 1px solid var(--color-muted); border-radius: var(--radius-input); background: var(--color-paper);
font-size: var(--text-sm); cursor: pointer; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out);
}
.lead-choice__option input:checked + span { background: var(--color-ink); border-color: var(--color-ink); color: var(--color-paper); }
.lead-choice__option input:focus-visible + span { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.landing__consent { font-size: var(--text-sm); color: var(--color-ink-2); }
.landing__consent label { display: flex; gap: var(--space-xs); align-items: flex-start; }
.landing__consent input { width: 20px; height: 20px; margin-top: var(--space-3xs); flex-shrink: 0; accent-color: var(--color-accent); }
.sale-box__submit { width: 100%; }
.form__error { color: var(--color-error); font-size: var(--text-sm); }
.landing__sent { display: grid; gap: var(--space-xs); }
.page-hero { padding-block: var(--space-3xl) var(--space-2xl); }
.page-hero__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-3xl); align-items: center; }
.page-hero__text { display: grid; gap: var(--space-lg); align-content: start; }
.page-hero h1 { font-size: clamp(2.5rem, 3vw + 1rem, 4rem); max-width: 18ch; line-height: 1.05; }
.page-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xs); }
.page-hero__note { color: var(--color-muted); font-size: var(--text-sm); max-width: 52ch; }
.page-hero--text .page-hero__grid, .page-hero--article .page-hero__grid { grid-template-columns: minmax(0, 1fr); }
.page-hero--text h1 { max-width: 22ch; }
.page-hero--article h1 { font-size: var(--text-display-s); max-width: 24ch; }
.page-hero--long h1 { font-size: clamp(2rem, 1.6vw + 1.25rem, 3rem); max-width: 28ch; line-height: 1.1; }
.page-date { color: var(--color-muted); font-size: var(--text-sm); }
@media (max-width: 60rem) { .page-hero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); } }
.shot { margin: 0; display: grid; gap: var(--space-sm); }
.shot__frame { aspect-ratio: 2560 / 1640; }
.site-hero__shot--phone { justify-items: center; }
.site-hero__shot--phone .shot__frame { aspect-ratio: 840 / 1760; width: min(100%, 20rem); }
.shot figcaption { color: var(--color-muted); font-size: var(--text-sm); max-width: 52ch; }
.page-shot { padding-top: 0; }
.facts { padding-block: 0 var(--space-2xl); }
.facts__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); margin: 0; border-top: 1px solid var(--color-rule); }
.facts__list > div { padding: var(--space-lg) var(--space-lg) 0; border-left: 1px solid var(--color-rule); }
.facts__list > div:first-child { padding-left: 0; border-left: 0; }
.facts__list dt { font-size: var(--text-3xl); font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; }
.facts__list dd { margin: var(--space-2xs) 0 0; color: var(--color-ink-2); font-size: var(--text-sm); }
@media (max-width: 40rem) {
.facts__list > div { padding-left: 0; border-left: 0; }
}
.points__list { margin: 0; padding: 0; list-style: none; display: grid; }
.points__list li { padding-block: var(--space-md); border-bottom: 1px solid var(--color-rule); font-size: var(--text-lg); line-height: 1.45; }
.points__list li:first-child { padding-top: 0; }
.cards h2 { margin-bottom: var(--space-2xl); }
.cards__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-3xl); }
.cards__rows .lp-rows__item:nth-child(2) { padding-top: 0; }
@media (max-width: 60rem) { .cards__rows { grid-template-columns: minmax(0, 1fr); } .cards__rows .lp-rows__item:nth-child(2) { padding-top: var(--space-lg); } }
.example__message { padding: var(--space-lg); background: var(--color-paper-2); border-radius: var(--radius-card) var(--radius-card) var(--radius-card) 4px; max-width: 46ch; }
.prose-section > .container { display: grid; }
.prose { max-width: 68ch; font-size: 1.0625rem; line-height: 1.7; color: var(--color-ink); }
.prose > * + * { margin-top: var(--space-md); }
.prose h2 { font-size: var(--text-2xl); margin-top: var(--space-2xl); max-width: 30ch; }
.prose ul, .prose ol { padding-left: var(--space-lg); }
.prose li + li { margin-top: var(--space-xs); }
.prose strong { font-weight: 600; }
.related h2 { margin-bottom: var(--space-xl); }
.related__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xl) var(--gap-columns); }
.site-related__item { display: grid; gap: var(--space-xs); align-content: start; padding-top: var(--space-md); border-top: 2px solid var(--color-ink); color: var(--color-ink); text-decoration: none; }
.site-related__item b { font-size: var(--text-lg); font-weight: 600; }
.site-related__item span { color: var(--color-ink-2); font-size: var(--text-sm); }
.site-related__item:visited { color: var(--color-ink); }
@media (hover: hover) and (pointer: fine) { .site-related__item:hover b { color: var(--color-accent); text-decoration: underline; text-underline-offset: 0.2em; } }
@media (max-width: 60rem) { .related__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 40rem) { .related__list { grid-template-columns: minmax(0, 1fr); } }
.index { padding-block: var(--space-3xl) var(--space-2xl); }
.index h1 { font-size: clamp(2.5rem, 3vw + 1rem, 4rem); }
.index > .container > .lead { margin-top: var(--space-md); }
.index__list { margin-top: var(--space-2xl); }
.index__card { border-top: 0; padding-top: 0; }
.index__shot { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: 0 0; border-radius: var(--radius-input); outline: 1px solid var(--color-shade); outline-offset: -1px; margin-bottom: var(--space-xs); }
.status__table { width: 100%; max-width: 48rem; margin-top: var(--space-2xl); border-collapse: collapse; }
.status__table th, .status__table td { text-align: left; padding: var(--space-md) 0; border-bottom: 1px solid var(--color-rule); }
.status__table thead th { font-size: var(--text-sm); color: var(--color-muted); font-weight: 400; }
.status__table tbody th { font-weight: 400; }
.status__table td { font-weight: 600; white-space: nowrap; }
.status__row--ok td { color: var(--color-accent); }
.status__row--down td { color: var(--color-error); }
.status__help { margin-top: var(--space-xl); color: var(--color-ink-2); max-width: 60ch; }
.page-close__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-lg) var(--gap-columns); }
.page-close h2 { grid-column: 1 / span 5; }
.page-close__body { grid-column: 7 / -1; display: grid; gap: var(--space-lg); color: var(--color-ink-2); }
.page-close__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-lg); }
.page-close__ask { font-size: var(--text-sm); }
@media (max-width: 60rem) { .page-close h2, .page-close__body { grid-column: 1 / -1; } }
.site-footer { margin-top: var(--space-2xl); padding-block: var(--space-3xl) var(--space-2xl); background: var(--color-dark); color: var(--color-on-dark); }
.site-footer__brand { display: inline-flex; align-items: center; gap: var(--space-xs); font-size: var(--text-xl); font-weight: 600; letter-spacing: -0.01em; }
.site-footer__line { margin-top: var(--space-xs); color: var(--color-on-dark-muted); }
.site-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-xl) var(--gap-columns); margin-top: var(--space-2xl); padding-top: var(--space-xl); border-top: 1px solid var(--color-on-dark-rule); }
.site-footer nav { display: grid; gap: var(--space-xs); align-content: start; }
.site-footer h2 { font-size: var(--text-sm); font-weight: 600; color: var(--color-on-dark-muted); letter-spacing: 0; margin-bottom: var(--space-xs); max-width: none; }
.site-footer a { color: var(--color-on-dark); text-decoration: none; font-size: var(--text-sm); }
.site-footer a:focus-visible { outline-color: var(--color-on-dark-link); }
@media (hover: hover) and (pointer: fine) { .site-footer a:hover { color: var(--color-on-dark-link); text-decoration: underline; text-underline-offset: 0.2em; } }
@media (max-width: 60rem) { .site-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 30rem) { .site-footer__cols { grid-template-columns: minmax(0, 1fr); } }