/* The home page (site/home.html), phase 2 of 10.11.2026: the brand's tokens alone (brand.css) — one left edge (96 px on
   a 1440 px screen, 20 px on a phone), the spacing scale --s1…--s7 between and inside blocks, the type sizes --fs-h1…h3,
   the warm paper and the forest band of the first screen across the whole width. A card only for the product's own
   objects (the day's journal, a conversation, the cabinet, a site, a plan); a number over a block only at «Цены»,
   «Вопросы» and «Подключение»; one lime, the asks' own. No glow, no dots, no lilac for the AI. */
body[data-home] {
  --paper: var(--paper-warm);
  --gutter: 40px;
  --block: var(--s7);
  --block-inner: var(--s6);
  background: var(--paper);
  color: var(--ink);
}
[data-home] .wrap { width: calc(100% - 2 * var(--gutter)); max-width: 1248px; margin-inline: auto; padding-left: 0; padding-right: 0; }
[data-home] main :is(p, li) { max-width: 68ch; }
[data-home] a { text-underline-offset: .22em; }
[data-home] main :is(h2, h3) { text-wrap: balance; }
[data-home] main h2 { font-size: var(--fs-h2); font-weight: 600; line-height: 1.12; letter-spacing: -.03em; }
/* One focus ring on the page (brand.css --focus): forest on light surfaces, lime where it lies on the forest — the first
   screen's band, «Стандарт», the strip after the demos, the proof band, the calculator, the cabinet's dark menu. The white
   journal inside the band and the cabinet's selected tab take the forest again. */
body[data-home] :focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
body[data-home] :is(.home-hero, .plan.recommended, .demo-next, .proof, .calc, .cp-navigation) :focus-visible,
body[data-home] .home-hero .home-window .home-window-bar:focus-visible { outline-color: var(--focus-on-dark); }
body[data-home] .home-hero .home-window :focus-visible,
body[data-home] .cp-navigation .cp-tab[aria-selected="true"]:focus-visible { outline-color: var(--focus); }

/* --- the header: the brand, the page's sections with the other product's quiet link, its outlined ask -------------- */
/* Its sides are the blocks' gutter, so the brand stands on the page's one left edge (40 px, 20 px on a phone; the
   acceptance of 10.11.2026). The tech support is the last of the links, in the muted ink behind a hairline (the owner,
   10.11.2026: a quiet link, not a tab beside the page's own name); up to 1100 px the menu (☰) holds the links, the
   quiet one last before the ask. */
body[data-home] .topbar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; min-height: 88px; height: auto; gap: 24px; padding-block: 12px; border-bottom: 1px solid var(--rule); }
body[data-production-product] > .topbar { width: calc(100% - 2 * var(--gutter)); max-width: 1248px; margin-inline: auto; }
/* From 761 px the header stays at the top, as on every page (site.css): the menu and «Подключить компанию» are at hand
   through the whole page (the review of v0.167.46 — a rule of its own position had taken the header off the screen).
   A phone's header scrolls away and only anchors the menu's panel. */
@media (max-width: 760px) { body[data-home] .topbar { position: relative; } }
[data-home] .topbar .brand { min-height: 44px; font-size: 26px; }
body[data-home] .topbar :is(.brand-desc, .topbar-cta) { display: none; }
body[data-home] .topbar > .nav { justify-self: end; gap: 28px; margin: 0; }
body[data-home] .topbar > .nav a { white-space: nowrap; font-size: 14px; }
body[data-home] .topbar > .nav .nav-product { display: block; padding-left: 28px; border-left: 1px solid var(--rule); color: var(--muted); font-weight: 500; }
body[data-home] .topbar > .nav .nav-product:hover { color: var(--ink); }
body[data-home] .topbar > .nav:not(.open) .nav-cta { display: none; }
body[data-home] .topbar > .menu-button { display: none; }
/* A base of stays does not see «Всё в одном кабинете» and the demo's cabinet (.k-any): no link of the header leads there. */
body[data-kind="stay"][data-home] .topbar .nav a:is([href="#all"], [href="#cabinet"]) { display: none; }
/* The header's ask is the first screen's, outlined (the owner, 09.11.2026): «Подключить компанию» beside the links from
   1101 px; it steps aside while a start button of the page is on the screen (site.js «tucked»). Below that the menu (☰)
   carries it, and a phone has the sticky lime button. */
@media (min-width: 1101px) {
  body[data-home] .topbar > .topbar-cta { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px; border: 1px solid var(--forest); border-radius: 100px; color: var(--forest); background: transparent; font-size: 14px; font-weight: 650; text-decoration: none; }
  body[data-home] .topbar > .topbar-cta:hover { color: var(--forest); background: var(--shade); }
}
@media (max-width: 1100px) {
  body[data-home] .topbar { grid-template-columns: minmax(0, 1fr) 44px; }
  body[data-home] .topbar > .menu-button { display: block; grid-column: 2; grid-row: 1; margin: 0; }
  body[data-home] .topbar > .nav { display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 20; justify-self: stretch; padding: 12px 24px 24px; border: 1px solid var(--rule); border-radius: 14px; background: var(--sheet); box-shadow: 0 12px 28px #173b3014; }
  body[data-home] .topbar > .nav.open { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  body[data-home] .topbar > .nav a { min-height: 44px; padding: 12px 0; border-bottom: 1px solid var(--rule); }
  body[data-home] .topbar > .nav .nav-product { padding-left: 0; border-left: 0; }
  body[data-home] .topbar > .nav.open .nav-cta { display: block; margin-top: 12px; padding: 14px; border: 0; border-radius: 10px; background: var(--forest); color: #fff; text-align: center; font-weight: 700; }
}
@media (max-width: 600px) {
  body[data-home] .topbar { min-height: 0; gap: 6px; padding-block: 8px; }
  body[data-home] .topbar .brand { min-height: 44px; font-size: 22px; }
}
/* The products' pages change with the browser's own cross-fade (the tech support's page has the same rule). */
@media (prefers-reduced-motion: no-preference) and (scripting: enabled) {
  @view-transition { navigation: auto; }
}

/* --- the first screen: the forest band across the whole width, the ask at the left, the night's booking at the right - */
[data-home] .hero.home-hero { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: var(--s5) var(--s6); padding: var(--s6) 0 0; color: var(--on-forest); }
/* The band: as wide as the window, the shadow paints past the column without widening the page. */
[data-home] .home-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--forest); box-shadow: 0 0 0 100vmax var(--forest); clip-path: inset(0 -100vmax); }
[data-home] .home-intro { min-width: 0; }
[data-home] .home-hero h1 { max-width: 14em; margin: 0; color: var(--on-forest); font-size: min(var(--fs-h1), 4.05vw, 58px); font-weight: 650; line-height: 1.05; letter-spacing: -.045em; text-wrap: balance; }
[data-home] .home-lead { max-width: 32em; margin: var(--s3) 0 0; font-size: 18px; line-height: 1.7; color: var(--forest-muted); }
[data-home] .home-lead .l { display: block; }
[data-home] .home-hero .home-actions { display: flex; align-items: flex-start; flex-direction: column; gap: var(--s1); margin: var(--s4) 0 0; padding: 0; }
body[data-home] .home-actions .home-primary { display: inline-flex; align-items: center; justify-content: center; min-height: 60px; max-width: 100%; margin-bottom: var(--s1); padding: 17px 26px; border: 1px solid var(--lime); border-radius: 100px; color: var(--forest); background: var(--lime); font-size: 17px; font-weight: 750; }
body[data-home] .home-actions .home-primary:hover { background: var(--lime-hover); border-color: var(--lime-hover); }
[data-home] .home-actions p { margin: 0; font-size: 16px; line-height: 1.6; font-weight: 650; color: var(--on-forest); }
[data-home] .home-trial { font-weight: inherit; color: inherit; }
/* What comes after the free month: the founder's price with its 12 months, or the list price (site/home.html). A base of
   stays has no plans: its line is the free showing. */
[data-home] .home-actions .home-price { max-width: 36em; font-size: 15px; font-weight: 500; color: var(--forest-muted); }
[data-home] .home-price a { color: var(--on-forest); text-decoration-thickness: 1px; }
/* «2 мастера или 12, цена та же.» goes to the next line whole: a sentence does not start at a line's end. */
[data-home] .home-price-same { white-space: nowrap; }
body[data-kind="stay"][data-home] .home-price { display: none; }
[data-home] .home-actions .home-demo-link { display: inline-block; min-height: 44px; margin-top: var(--s1); padding: 10px 0; color: var(--on-forest); font-size: 15px; font-weight: 600; line-height: 1.6; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
[data-home] .home-actions .home-demo-link:hover { text-decoration-thickness: 2px; }
[data-home] .home-day { position: relative; min-width: 0; margin: 0; padding: 0; }
[data-home] .home-day a { color: inherit; text-decoration: none; }
[data-home] .home-preview-arrow { display: inline-block; margin-left: 5px; font-size: 12px; opacity: .72; }
[data-home] .home-day figcaption { display: flex; align-items: center; gap: var(--s1); margin: 0 4px var(--s2); color: var(--forest-muted); font-size: 13px; }
[data-home] .home-day figcaption small { margin-left: auto; font-size: 12px; }
[data-home] .home-window { overflow: hidden; position: relative; margin-top: var(--s2); border: 1px solid var(--card-edge); border-radius: var(--card-radius); color: var(--ink); background: var(--sheet); }
[data-home] .home-window-bar { display: flex; align-items: center; gap: 10px; padding: 16px 20px; border-bottom: 1px solid var(--hair); font-size: 14px; background: var(--sheet); color: var(--ink); }
[data-home] a.home-window-bar { color: var(--ink); }
[data-home] .home-window-bar:hover { background: var(--row-hover); }
[data-home] .home-day a.home-window-bar:focus-visible { outline-offset: -5px; }
[data-home] .home-window-mark { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; background: var(--forest); color: var(--lime); font-weight: 800; }
[data-home] .home-window-date { margin-left: auto; color: var(--muted); font-size: 12px; }
[data-home] .home-agenda { padding: 16px 20px; }
[data-home] .home-appointment { position: relative; display: block; padding: 13px 16px; border-radius: 8px; transition: box-shadow .18s; }
[data-home] .home-appointment :is(b, small) { display: block; }
[data-home] .home-appointment b { margin: 5px 0 3px; font-size: 15px; }
[data-home] .home-appointment :is(span, small) { font-size: 12px; }
[data-home] .home-appointment-active { background: var(--band); border-left: 3px solid var(--lime-deep); }
[data-home] .home-appointment:hover { box-shadow: 0 6px 16px rgba(23, 46, 37, .1); }
[data-home] .home-appointment:hover b { text-decoration: underline; text-underline-offset: .2em; }
body[data-home] .home-hero .home-appointment .home-booked-by { display: block; margin: 2px 0 4px; color: var(--ok); font: 500 13px/1.4 var(--mono); }
[data-home] .home-appointment strong { position: absolute; bottom: 13px; right: 16px; font-size: 14px; }
[data-home] .home-window-footer { max-width: none; margin: 0; padding: 12px 20px 14px; border-top: 1px solid var(--hair); color: var(--muted); font-size: 13px; line-height: 1.5; }
[data-home] .home-window-footer i { margin-right: 4px; color: var(--ok); font-style: normal; font-weight: 700; }
body[data-home] .home-hero .home-message { display: block; margin: 0; padding: 16px 20px; border: 1px solid var(--card-edge); border-radius: var(--card-radius); color: var(--ink); background: var(--sheet); text-decoration: none; transition: border-color .18s; }
body[data-home] .home-hero .home-message:hover { border-color: var(--forest-edge); }
[data-home] .home-night { display: grid; gap: var(--s1); margin: 0; padding: 0; list-style: none; }
[data-home] .home-night > li { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 10px; align-items: baseline; }
[data-home] .home-night time { color: var(--muted); font: 500 13px/1.5 var(--mono); }
[data-home] .home-night p { margin: 0; font-size: 14px; line-height: 1.5; }
[data-home] .home-night .who { font-weight: 650; }
[data-home] .home-night-times { font-variant-numeric: tabular-nums; white-space: nowrap; }
[data-home] .home-night-times b { padding: 0 4px; border-radius: 4px; background: var(--hi); font-weight: 700; }
[data-home] .home-night .out b { font-weight: 700; }
/* One quiet line of proof under the first screen's two columns, in the band's muted ink behind a hairline; the
   guarantee is a link to its condition in «Цены» (a base of stays reads its own third fact, .k-stay). Then, on the
   paper, whom the service is for: one line of spheres in one ink, the ones with a page or a demo's site underlined — a
   link a 44 px target. A sphere that is words (no demo yet) differs by the underline alone: in the muted ink beside
   five links it read as a link switched off. The dot between two spheres stays muted, drawn in the gap before the
   second; the list clips what stands left of its edge, so a row neither ends nor starts with a dot, at any width (the
   clip leaves room for the first link's ring). */
[data-home] .home-proof { grid-column: 1 / -1; max-width: none; margin: 0; padding: var(--s2) 0 var(--s3); border-top: 1px solid var(--forest-rule); color: var(--forest-muted); font-size: 14px; line-height: 1.6; }
[data-home] .home-proof a { color: inherit; text-decoration-thickness: 1px; }
[data-home] .home-proof a:hover { color: var(--on-forest); }
[data-home] .home-spheres { display: flex; flex-wrap: wrap; align-items: center; column-gap: 22px; max-width: 1248px; margin-top: var(--s2); margin-bottom: 0; padding: 0; list-style: none; clip-path: inset(-8px -8px -8px -7px); color: var(--ink); font-size: 15px; line-height: 1.6; }
[data-home] .home-spheres > li { position: relative; max-width: none; }
[data-home] .home-spheres > li::before { content: "·"; content: "·" / ""; position: absolute; left: -11px; top: 50%; transform: translate(-50%, -50%); color: var(--muted); }
[data-home] .home-spheres a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); text-decoration-thickness: 1px; }
[data-home] .home-spheres a:hover { text-decoration-thickness: 2px; }

/* --- the blocks: one rhythm, a rule over each, no number but at the prices, the questions and the start ----------- */
[data-home] main > :is(.section, .home-cabinet, .home-sites, .home-details, .all-in-one) { margin-top: 0; }
[data-home] .ai-section { padding-top: var(--block); }
[data-home] .block { padding: var(--s4) 0 var(--block); }
[data-home] .idx { display: none; }
[data-home] :is(#prices, #faq, #start) .idx { display: block; }
[data-home] :is(#prices, #faq, #start) .idx::before { content: none; }
[data-home] .block-head h2 { font-size: var(--fs-h2); font-weight: 600; letter-spacing: -.03em; }
[data-home] .show h2 { font-size: var(--fs-h2); }
[data-home] .demo-next-section { padding-top: var(--s5); padding-bottom: 0; }
/* «Что делает» goes on into its band «почти в 7 раз» and the line of risks: the block's own space stays above them. */
[data-home] .ai-section .block { padding-bottom: var(--block-inner); }
[data-home] .risk-line { margin: var(--s3) 0 0; }
/* The home's open lines under «Что делает» and under the cashback's terms (the plan's S2.3): plain sentences over a
   hairline, two columns on a computer — no marks, no boxes. */
[data-home] .ai-lines { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s5); margin: var(--s4) 0 0; padding: 0; list-style: none; }
[data-home] .ai-lines > li { max-width: none; padding: 12px 0; border-top: 1px solid var(--hair); font-size: 15px; line-height: 1.5; }
/* The cashback's terms are folds on the home (app/web.py CASHBACK_TERM): open on a computer, their rows not folding; a
   phone reads the three headings as rows of the page's one disclosure under the example. */
[data-home] .cashback-term > summary { display: block; list-style: none; }
[data-home] .cashback-term > summary::-webkit-details-marker { display: none; }
[data-home] .cashback-lines { margin: var(--s3) 0 0; padding: 0; list-style: none; }
[data-home] .cashback-lines > li { padding: 10px 0; border-top: 1px solid var(--hair); color: var(--muted); font-size: 15px; line-height: 1.5; }
[data-home] .cashback-lines b { color: var(--ink); font-weight: 650; }
[data-home] .cashback-demo { margin: var(--s1) 0 0; }
[data-home] .cashback-demo .text-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font-size: 15px; font-weight: 650; }

/* «Всё в одном кабинете»: the six groups, the lesson in the demo, then the demo's cabinet and the sections in one fold. */
[data-home] .all-in-one.wrap { margin-top: var(--block); margin-bottom: 0; padding: var(--s4) 0 0; border-top: 1px solid var(--ink); }
[data-home] .all-heading h2 { max-width: 22em; font-size: var(--fs-h2); line-height: 1.12; letter-spacing: -.03em; }
[data-home] .all-heading > p { font-size: 17px; }
[data-home] .all-learn { margin: var(--s2) 0 0; font-size: 15px; font-weight: 600; }
[data-home] .all-learn .text-link { color: var(--ink); }
[data-home] .all-list { margin-top: var(--s4); }
/* Each group a fold whose row is its name (app/web.py ALL_ITEM): open on a computer, where its row does not fold and its
   words go under the name; a phone shows the six names as rows of the one disclosure the page has, «+» at the right. */
[data-home] .all-item > summary { display: block; list-style: none; }
[data-home] .all-item > summary::-webkit-details-marker { display: none; }
[data-home] .all-item > summary + * { margin-top: 2px; }
[data-home] .home-anchor { display: block; scroll-margin-top: 95px; }

/* The demo's cabinet: its dark menu at the left, a panel of two cards at the right; a phone puts the menu in rows. */
[data-home] .home-cabinet { padding-top: var(--block-inner); }
[data-home] .home-cabinet-lead { margin: 0 0 var(--s3); color: var(--muted); font-size: 16px; line-height: 1.6; }
[data-home] .cabinet-preview { min-width: 0; width: 100%; position: relative; border: 1px solid var(--card-edge); border-radius: var(--card-radius); overflow: clip; color: var(--ink); background: var(--sheet); box-shadow: var(--card-shadow); text-align: left; container-type: inline-size; }
[data-home] .cabinet-preview :is(h3, h4, p, dl, dt, dd) { margin: 0; color: inherit; letter-spacing: normal; }
[data-home] .cabinet-preview .cp-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--s1) var(--s3); min-height: 72px; padding: 14px 20px; border-bottom: 1px solid var(--hair); }
[data-home] .cabinet-preview .cp-company { display: flex; align-items: center; gap: 12px; min-width: 0; }
[data-home] .cabinet-preview .cp-company-icon { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 auto; border-radius: 9px; background: var(--forest); color: var(--lime); font-size: 12px; font-weight: 750; }
[data-home] .cabinet-preview .cp-company b { display: block; font-size: 15px; line-height: 1.4; }
[data-home] .cabinet-preview .cp-company small { display: block; color: var(--muted); font-size: 12px; line-height: 1.5; }
[data-home] .cabinet-preview .cp-open { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--ink); font-size: 14px; font-weight: 650; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
[data-home] .cabinet-preview .cp-layout { display: grid; grid-template-columns: 200px minmax(0, 1fr); min-width: 0; }
[data-home] .cabinet-preview .cp-navigation { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: var(--s3) 12px; background: var(--forest); }
[data-home] .cabinet-preview .cp-tab { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 44px; padding: 10px 12px; border-radius: 8px; color: var(--on-forest); font-size: 14px; font-weight: 550; line-height: 1.4; text-decoration: none; }
[data-home] .cabinet-preview .cp-tab-marker { display: block; width: 6px; height: 6px; flex: 0 0 auto; border: 1px solid var(--forest-edge); border-radius: 2px; }
[data-home] .cabinet-preview .cp-tab:is([aria-selected="true"], [aria-current="page"]) { background: var(--sheet); color: var(--ink); }
[data-home] .cabinet-preview .cp-tab:is([aria-selected="true"], [aria-current="page"]) .cp-tab-marker { background: var(--forest); border-color: var(--forest); }
[data-home] .cabinet-preview .cp-tab:focus-visible { outline-offset: -4px; }
[data-home] .cabinet-preview .cp-panels { display: grid; min-width: 0; padding: var(--s4); }
[data-home] .cabinet-preview .cp-panel { grid-area: 1 / 1; min-width: 0; display: flex; flex-direction: column; gap: var(--s3); }
/* A hidden panel keeps the tallest panel's height, without focus or a reader's words: the frame does not jump. */
[data-home] .cabinet-preview .cp-panel[hidden] { display: flex; visibility: hidden; pointer-events: none; }
[data-home] .cabinet-preview .cp-panel-heading h3 { font-size: var(--fs-h3); line-height: 1.3; font-weight: 650; letter-spacing: -.02em; }
[data-home] .cabinet-preview .cp-panel-heading p { margin-top: 4px; color: var(--muted); font-size: 14px; line-height: 1.6; }
[data-home] .cabinet-preview .cp-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: var(--s2); flex: 1; }
[data-home] .cabinet-preview .cp-card { display: flex; flex-direction: column; min-width: 0; min-height: 190px; padding: var(--s3) var(--s3) var(--s2); border: 1px solid var(--card-edge); border-radius: var(--radius); background: var(--sheet); color: var(--ink); text-decoration: none; transition: border-color .14s, box-shadow .14s; }
[data-home] .cabinet-preview .cp-card h4 { font-size: 17px; line-height: 1.35; font-weight: 650; letter-spacing: -.015em; overflow-wrap: anywhere; }
[data-home] .cabinet-preview .cp-card p { margin-top: 6px; color: var(--muted); font-size: 14px; line-height: 1.55; }
[data-home] .cabinet-preview .cp-card small { display: block; color: var(--muted); font-size: 13px; line-height: 1.5; }
[data-home] .cabinet-preview .cp-card > small:not(.cp-card-label) { margin-top: 6px; }
[data-home] .cabinet-preview .cp-card .cp-card-label { margin-bottom: var(--s1); font-size: 12px; font-weight: 650; }
[data-home] .cabinet-preview .cp-card-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; min-height: 36px; padding-top: 10px; color: var(--ink); font-size: 13px; font-weight: 650; }
[data-home] .cabinet-preview .cp-card-visit, [data-home] .cabinet-preview .cp-ai-booking { background: var(--band); border-color: var(--card-edge); }
[data-home] .cabinet-preview .cp-visit { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--s1); margin-bottom: 10px; }
[data-home] .cabinet-preview :is(.cp-visit, .cp-journal-entry) time { font-size: 28px; line-height: 1.1; letter-spacing: -.04em; font-weight: 650; }
[data-home] .cabinet-preview .cp-status { display: inline-flex; align-items: center; min-height: 26px; padding: 2px 8px; border: 1px solid var(--card-edge); border-radius: 6px; color: var(--muted); font-size: 12px; }
[data-home] .cabinet-preview .cp-journal-entry { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s2); align-items: start; }
[data-home] .cabinet-preview .cp-journal-entry time { padding-right: var(--s2); border-right: 1px solid var(--hair); font-size: 24px; }
[data-home] .cabinet-preview .cp-person { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
[data-home] .cabinet-preview .cp-avatar { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: 50%; background: var(--shade); color: var(--ink); font-size: 17px; font-weight: 600; }
[data-home] .cabinet-preview .cp-order-facts { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); margin-top: 12px; }
[data-home] .cabinet-preview .cp-order-facts dt { color: var(--muted); font-size: 12px; }
[data-home] .cabinet-preview .cp-order-facts dd { font-size: 14px; font-weight: 650; }
[data-home] .cabinet-preview .cp-unit { display: inline-block; align-self: start; margin-top: 10px; padding: 2px 8px; border: 1px solid var(--card-edge); border-radius: 6px; color: var(--muted); font-size: 12px; }
[data-home] .cabinet-preview .cp-context { padding-top: var(--s2); border-top: 1px solid var(--hair); color: var(--muted); font-size: 14px; line-height: 1.6; }
[data-home] .cabinet-preview .cp-context a { color: var(--ink); font-weight: 600; }
[data-home] .cabinet-preview .cp-no-script { padding: 12px 20px; border-top: 1px solid var(--hair); color: var(--muted); font-size: 13px; }
@media (hover: hover) and (pointer: fine) {
  [data-home] .cabinet-preview .cp-tab:not([aria-selected="true"]):hover { background: var(--forest-hover); }
  [data-home] .cabinet-preview .cp-card:hover { border-color: var(--forest-edge); box-shadow: var(--card-shadow); }
}
@container (max-width: 680px) {
  [data-home] .cabinet-preview .cp-layout { grid-template-columns: minmax(0, 1fr); }
  [data-home] .cabinet-preview .cp-navigation { flex-direction: row; flex-wrap: wrap; gap: 4px; padding: 10px; }
  [data-home] .cabinet-preview .cp-tab { flex: 1 1 28%; justify-content: center; padding: 8px 6px; font-size: 13px; }
  [data-home] .cabinet-preview .cp-tab-marker { display: none; }
  [data-home] .cabinet-preview .cp-panels { padding: var(--s3) var(--s2); }
  [data-home] .cabinet-preview .cp-cards { grid-template-columns: minmax(0, 1fr); }
  [data-home] .cabinet-preview .cp-card { min-height: 0; padding: var(--s2); }
}

/* «Подробности по разделам»: one fold for «Запись», «Сайт», «Смета» and «После визита», a row like the questions'. */
[data-home] .home-details { margin-top: var(--block-inner); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
[data-home] .home-details > summary { display: flex; align-items: center; flex-wrap: wrap; gap: 4px var(--s3); min-height: 64px; padding: var(--s2) 40px var(--s2) 0; position: relative; list-style: none; cursor: pointer; }
[data-home] .home-details > summary::-webkit-details-marker { display: none; }
[data-home] .home-details > summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 26px; font-weight: 400; }
[data-home] .home-details[open] > summary::after { content: "−"; }
[data-home] .home-details > summary > span { font-size: var(--fs-h3); font-weight: 650; letter-spacing: -.02em; }
[data-home] .home-details > summary > small { color: var(--muted); font-size: 14px; }
[data-home] .home-details .wrap { width: 100%; }
[data-home] .home-details .section { padding: 0; }
[data-home] .home-details .block { padding-bottom: var(--block-inner); }
[data-home] .home-details .block-next { display: none; }

/* The demos' own sites: the words at the left, the five spheres' text tabs over one browser window at the right (the plan's
   S2.2). A phone scrolls the tabs inside their own row, never the page; each tab is a 44 px target. */
[data-home] .home-sites { padding-top: var(--block); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s4) var(--s6); align-items: start; }
[data-home] .home-sites-copy h2 { margin: 0; }
[data-home] .home-sites-copy p { margin: var(--s2) 0 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
[data-home] .home-sites-copy .home-sites-lead { color: var(--ink); font-size: 18px; }
[data-home] .home-sites-copy a { color: var(--ink); font-weight: 600; }
[data-home] .home-sites-more > summary { display: none; list-style: none; }
[data-home] .home-sites-more > summary::-webkit-details-marker { display: none; }
[data-home] .home-sites-show { min-width: 0; scroll-margin-top: 95px; }
[data-home] .ws-tabs { display: flex; gap: var(--s3); margin: 0 0 var(--s2); padding: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; border-bottom: 1px solid var(--hair); }
[data-home] .ws-tabs::-webkit-scrollbar { display: none; }
[data-home] .ws-tab { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 44px; margin-bottom: -1px; border-bottom: 2px solid transparent; color: var(--muted); font-size: 15px; font-weight: 600; text-decoration: none; white-space: nowrap; }
[data-home] .ws-tab:is([aria-selected="true"], [aria-current="page"]) { border-bottom-color: var(--ink); color: var(--ink); }
[data-home] .ws-tab:focus-visible { outline-offset: -3px; }
[data-home] .ws-window { overflow: hidden; border: 1px solid var(--card-edge); border-radius: var(--card-radius); background: var(--sheet); }
[data-home] .ws-browser { display: flex; align-items: center; gap: 5px; min-height: 32px; margin: 0; padding: 0 12px; border-bottom: 1px solid var(--hair); color: var(--muted); font: 12px var(--mono); white-space: nowrap; }
[data-home] .ws-browser i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--card-edge); }
[data-home] .ws-browser i:last-of-type { margin-right: 6px; }
[data-home] .ws-host { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
[data-home] .ws-shot { display: block; width: 100%; height: auto; aspect-ratio: 960 / 568; object-fit: cover; object-position: top; background: var(--shade); }
[data-home] .ws-caption { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s1); margin: 0; padding: 4px var(--s2); border-top: 1px solid var(--hair); font-size: 14px; line-height: 1.5; }
[data-home] .ws-name { font-size: 15px; font-weight: 650; }
[data-home] .ws-about { color: var(--muted); }
[data-home] .ws-open { display: inline-flex; align-items: center; min-height: 44px; margin-left: auto; color: var(--ink); font-weight: 650; text-decoration-thickness: 1px; text-underline-offset: 4px; }
[data-home] .home-sites-note { margin: var(--s1) 0 0; color: var(--muted); font-size: 13px; }

/* The network's cashback, its own block after the sites: the rule and the heading as the others', no number. */
[data-home] .home-cashback { padding-top: var(--block); padding-bottom: 0; }
[data-home] .home-cashback h2 { font-weight: 600; letter-spacing: -.03em; }
/* Its example in the main flow is a product card, white with a hairline edge (the review of 09.11.2026): «400 ₽ → 360 ₽»
   stay its largest words, in the text's colour. */
[data-home] .home-cashback .cashback-outcome { border-color: var(--card-edge); background: var(--sheet); color: var(--ink); }
[data-home] .home-cashback :is(.cashback-outcome .story-eyebrow, .bonus-source span, .bonus-visit span, .bonus-transfer) { color: var(--muted); }
[data-home] .home-cashback :is(.bonus-source, .bonus-visit) b { color: var(--ink); }
[data-home] .home-cashback .bonus-settlement { border-top-color: var(--rule); color: var(--ink); }

/* The calculator and the prices. */
[data-home] .calc-section { padding-top: 0; padding-bottom: var(--block); }
[data-home] .calc > .calc-lead { grid-column: 1 / -1; margin: var(--s2) 0 0; color: var(--forest-muted); font-size: 16px; line-height: 1.6; }
[data-home] :is(#prices, #faq, #start) .block-head h2 { font-weight: 600; letter-spacing: -.03em; }
[data-home] .plan { border-radius: var(--card-radius); box-shadow: none; }
[data-home] .plan.recommended { background: var(--forest); border-color: var(--forest); }
[data-home] #start .block { padding-bottom: var(--s5); }
/* «Как запустить и проверить сервис» (site/index.html, the home's alone): on a phone what the start needs and its four
   steps fold into one row over the lime (site.js PHONE_FOLDS), as phase 1 had them; a computer shows them open beside
   the form, without the row. */
[data-home] .start-how > summary { display: none; }
@media (max-width: 760px) {
  [data-home] .start-how { margin: 0 0 var(--s3); }
  [data-home] .start-how > summary { display: flex; justify-content: space-between; align-items: center; gap: var(--s2); min-height: 48px; padding: 10px 0; border-block: 1px solid var(--rule); font-weight: 600; list-style: none; cursor: pointer; }
  [data-home] .start-how[open] > summary { margin-bottom: var(--s2); border-bottom: 0; }
  [data-home] .start-how > summary::-webkit-details-marker { display: none; }
  [data-home] .start-how > summary::after { content: "+" / ""; flex: none; font-size: 20px; font-weight: 400; }
  [data-home] .start-how[open] > summary::after { content: "−" / ""; }
}

/* The tech support, one line over the footer in the text's own colour (the check of 09.11.2026). */
[data-home] .home-support-line { padding: 0 0 var(--s3); }
[data-home] .home-support-line p { max-width: 62em; margin: 0; color: var(--ink); font-size: 15px; line-height: 1.6; }
[data-home] .home-support-line a { color: var(--ink); font-weight: 600; text-decoration-thickness: 1px; text-underline-offset: 3px; }
[data-home] footer { margin-top: 0; padding-top: var(--s3); }

/* The phone's sticky button is the first screen's lime ask (site.js updateCta: /join?src=sticky); it hides while another
   start button is on the screen. home-product.css darkens the shared buttons; this one stays lime. A phone reads it as
   the hero's lime there, «Подключить компанию», its terms left out: whole, it took two lines up to 384 px. From 761 to
   1100 px the header has no room for its ask, so the sticky one stays, a button of its own width at the bottom's centre:
   without it nothing asked to connect between the first screen and «Стандарт» (the review of 09.11.2026). */
html:not(.forest) body[data-home] .mobile-cta { border-color: var(--lime); color: var(--forest); background: var(--lime); }
html:not(.forest) body[data-home] .mobile-cta:hover { border-color: var(--lime-hover); color: var(--forest); background: var(--lime-hover); }
@media (max-width: 760px) {
  body[data-home] .mobile-cta .btn-terms { display: none; }
}
/* Up to 1100 px the sticky lime sits over the page's bottom edge: a stop Tab brings into view lands above it, never
   under it (WCAG 2.4.11; the review of 10.11.2026) — 52 px of button, 16 px below it and a margin. */
@media (max-width: 1100px) {
  html:has(> body[data-home]) { scroll-padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
  [data-home] .topbar { gap: 20px; }
  [data-home] .topbar .nav { gap: 18px; font-size: 13px; }
  [data-home] .hero.home-hero { gap: var(--s5) var(--s5); }
}
@media (min-width: 761px) and (max-width: 1100px) {
  body[data-home] .mobile-cta { position: fixed; z-index: 30; bottom: calc(16px + env(safe-area-inset-bottom)); left: 0; right: 0; display: flex; align-items: center; justify-content: center; width: max-content; max-width: calc(100% - 48px); min-height: 52px; margin-inline: auto; padding: 13px 26px; border: 1px solid var(--lime); border-radius: var(--radius); font-size: 15px; font-weight: 600; text-align: center; text-decoration: none; box-shadow: 0 6px 20px -6px #17201a59; transition: opacity .2s, transform .2s, visibility .2s; }
  body[data-home] .mobile-cta.hidden { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(80px); }
}
/* Where the whole action label would not fit its column, its button says «Подключить компанию» (span.btn-terms hidden,
   as the first screen's on a phone) and the free month is said beside it: the band's lime up to 1000 px, with «Месяц
   бесплатно» in the line of risks right under the band — a phone, which goes without that line, reads «Месяц бесплатно.
   Без карты.» right under the lime (small.proof-free, site/index.html); the calculator's button up to 1179 px, its
   small line then «Месяц бесплатно. Карта не нужна.» (span.calc-free, site/index.html). */
[data-home] :is(.calc-free, .proof-free) { display: none; }
@media (max-width: 1000px) {
  [data-home] .proof-join .btn-terms { display: none; }
}
@media (max-width: 1179px) {
  [data-home] #calc-join .btn-terms { display: none; }
  [data-home] .calc-free { display: inline; }
}
/* Three plans side by side on a narrow computer: each price's small words on a line of their own, so the three prices
   and their buttons stand at one height («· без ограничения срока» is longer than «/ месяц» and wrapped alone). */
@media (min-width: 761px) and (max-width: 1180px) {
  [data-home] .plan .price small { display: block; margin-top: 6px; line-height: 1.3; }
}
/* A tablet: the first screen in one column, the sites under their words. */
@media (max-width: 1000px) {
  [data-home] .hero.home-hero { grid-template-columns: minmax(0, 1fr); }
  [data-home] .home-hero h1 { font-size: var(--fs-h1); }
  [data-home] .home-day { max-width: 640px; }
  [data-home] .home-sites { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  body[data-home] { --gutter: 20px; --block: var(--s6); --block-inner: var(--s5); }
  [data-home] .topbar { min-height: 76px; gap: 15px; }
  [data-home] .topbar .brand { font-size: 23px; }
  [data-home] .topbar .nav { margin-left: 0; }
  [data-home] .topbar .nav-cta { display: block; }
  [data-home] .hero.home-hero { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding-top: 20px; }
  [data-home] .home-lead { margin-top: 12px; font-size: 16px; line-height: 1.55; }
  [data-home] .home-hero .home-actions { margin-top: var(--s2); }
  body[data-home] .home-actions .home-primary { min-height: 55px; padding: 15px 23px; font-size: 15px; }
  [data-home] .home-actions p { font-size: 16px; }
  /* A phone's first screen stays within 1 000 px and keeps its lime in the first 844: the price after the free month is
     in «Цены» and the calculator there (the plan of 10.11.2026). */
  [data-home] .home-actions .home-price { display: none; }
  [data-home] .home-day { margin-top: 12px; padding-bottom: 12px; }
  [data-home] .home-day figcaption { margin: 0 2px 12px; font-size: 12px; }
  [data-home] .home-day figcaption small { font-size: 12px; }
  [data-home] .home-window-bar { padding: 14px 15px; font-size: 13px; }
  [data-home] .home-window-date { font-size: 12px; }
  [data-home] .home-agenda { padding: 12px; }
  [data-home] .home-appointment { padding: 12px; }
  [data-home] .home-appointment b { font-size: 14px; }
  [data-home] .home-appointment strong { right: 12px; bottom: 12px; font-size: 13px; }
  /* A phone's first screen: the headline a size smaller, so «записывает клиентов» stays one line and the night's
     conversation begins in the first 844 px; under it the booking's row of the journal and the cabinet's one line. */
  [data-home] .home-hero h1 { font-size: clamp(27px, 8.4vw, 34px); line-height: 1.08; letter-spacing: -.04em; }
  body[data-home] .home-hero .home-message { padding: 12px; }
  [data-home] .home-night > li { grid-template-columns: 42px minmax(0, 1fr); gap: var(--s1); }
  [data-home] .home-lead .l { display: inline; }
  [data-home] .home-window { margin-top: 12px; }
  /* What the cabinet has done with the booking is the demo's and «Всё в одном кабинете»'s on a phone: the band stays
     within 1 000 px with the line of proof in it. The line of risks under «почти в 7 раз» repeats that proof, so a
     phone goes without it; the free month its lime leaves out stands right under the button, over the study's source. */
  [data-home] .home-window-footer, [data-home] .risk-line { display: none; }
  [data-home] .proof-free { display: block; order: 1; margin-top: var(--s1); color: var(--on-forest); font-size: 14px; font-weight: 650; line-height: 1.5; text-align: center; }
  /* The headline names the AI administrator: a phone's conversation signs its line «ИИ:», one line shorter. */
  [data-home] .home-night .who-full { display: none; }
  [data-home] .home-proof { padding: 10px 0 12px; font-size: 13px; }
  [data-home] .home-spheres { margin-top: 4px; column-gap: 20px; font-size: 14px; }
  [data-home] .home-spheres > li::before { left: -10px; }
  /* The line's last row is links too (the demos' sites): a row of 44 px where the words took 22. Those 22 px come out
     of the space over «Что делает», which stands right under the line — its rule as far from the line's words as
     the band is; the greeting after a demo, when it stands between them, keeps the block's own space. */
  body[data-home]:not([data-kind="stay"]):not(.demo-done) .ai-section { padding-top: 10px; }
  [data-home] .all-heading > p { font-size: 15px; }
  [data-home] .home-details > summary { min-height: 56px; }
  [data-home] .calc > .calc-lead { font-size: 15px; }
  /* The plans in their own order on a phone too, «Старт» → «Стандарт» → «Про», as the home showed them before phase 2
     (a sphere's page puts «Стандарт» first, site.css). */
  [data-home] .pricing-grid > .plan.recommended { order: 0; }
  [data-home] .proof-join { width: 100%; white-space: normal; text-align: center; }
}
/* --- A phone's page no longer than before phase 2 (the owner's condition, 10.11.2026: at most 11 539 px at 390 px with the
   founder offer closed). Every block stays, open where the positioning lives — the AI, «всё в одном», the cashback, the
   payback; on a phone their details fold or come closer: the spacing one step down the scale; «Что делает» names its
   four and keeps the picked one's plans, its sentence being the conversation right under it; the cabinet's sections in
   one row and the frame as tall as the chosen one; the cashback's example in one row; the calculator's live sum and its
   basis come with the sliders; «Старт» and «Про» short — the name, the result, the price, the button — until «Сравнить
   тарифы целиком» (home.js; without the script the cards are whole). A computer sees the page as before. --- */
@media (max-width: 760px) {
  body[data-home] { --block: var(--s4); --block-inner: var(--s4); }
  [data-home] .block { padding-top: var(--s3); }
  [data-home] #ai .is-tabs .skill { min-height: 44px; padding-block: 10px; }
  [data-home] #ai .is-tabs .skill[aria-selected="true"] .skill-does { display: none; }
  [data-home] #ai .is-tabs .skill[aria-selected="true"] .skill-plan { margin-top: 2px; }
  [data-home] .ai-lines { grid-template-columns: minmax(0, 1fr); margin-top: var(--s3); }
  [data-home] .ai-lines > li { padding: 8px 0; font-size: 14px; line-height: 1.45; }
  [data-home] .proof-in { padding-top: var(--s4); padding-bottom: var(--s4); }
  [data-home] .proof-text { margin-bottom: 12px; font-size: 24px; }
  [data-home] .proof-sub { margin-bottom: var(--s3); font-size: 16px; }
  [data-home] .proof-later { margin-top: 12px; }
  [data-home] .proof-join { margin-top: var(--s4); }
  [data-home] .proof-source { margin-top: 12px; font-size: 13px; }
  [data-home] .all-list > li { padding: 0; }
  [data-home] .all-item > summary { display: flex; align-items: center; gap: 0; min-height: 52px; padding: 6px 0; cursor: pointer; }
  [data-home] .all-item > summary::after { content: "+" / ""; margin-left: auto; padding-left: 12px; font: 500 20px/1 var(--mono); color: var(--muted); }
  [data-home] .all-item[open] > summary::after { content: "−" / ""; }
  [data-home] .all-item[open] { padding-bottom: 14px; }
  [data-home] .all-list .text-link { margin-top: 4px; }
  /* The cabinet on a phone is its «Работа» (the plan's approved fold): the night's booking and what it puts aside; the
     other sections are the demo's own cabinet, one tap on «Открыть кабинет». */
  [data-home] .home-cabinet-lead { display: none; }
  [data-home] .cabinet-preview .cp-top { min-height: 0; padding: 8px 16px; }
  [data-home] .cabinet-preview .cp-navigation { display: none; }
  [data-home] .cabinet-preview .cp-panels { padding: var(--s2); }
  [data-home] .cabinet-preview .cp-panel { gap: 12px; }
  [data-home] .cabinet-preview .cp-panel:not([data-cp-panel="work"]) { display: none; }
  [data-home] .cabinet-preview .cp-panel[data-cp-panel="work"] { visibility: visible; pointer-events: auto; }
  [data-home] .cabinet-preview .cp-panel-heading p { display: none; }
  [data-home] .cabinet-preview .cp-cards { gap: 12px; }
  [data-home] .cabinet-preview .cp-card { position: relative; padding-right: 40px; }
  [data-home] .cabinet-preview .cp-card-action { position: absolute; top: 14px; right: 14px; min-height: 0; margin: 0; padding: 0; font-size: 0; }
  [data-home] .cabinet-preview .cp-card-action > span { font-size: 15px; }
  [data-home] .cabinet-preview .cp-context { display: none; }
  [data-home] .home-sites-copy p { font-size: 15px; line-height: 1.55; }
  [data-home] .home-sites-copy .home-sites-lead { font-size: 16px; }
  [data-home] .home-cashback .cashback-outcome { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 0 12px; padding: 20px; }
  [data-home] .home-cashback .cashback-outcome .story-eyebrow { grid-column: 1 / -1; margin-bottom: 12px; }
  [data-home] .home-cashback :is(.bonus-source, .bonus-visit) { display: grid; align-content: start; gap: 4px; }
  [data-home] .home-cashback :is(.bonus-source, .bonus-visit) b { font-size: 32px; line-height: 1.1; }
  [data-home] .home-cashback .bonus-transfer { padding: 4px 0 0; font-size: 22px; transform: rotate(-90deg); }
  [data-home] .home-cashback .bonus-settlement { grid-column: 1 / -1; margin-top: var(--s2); padding-top: 12px; }
  /* The calculator: its sum, the price against it and the button on one screen without a tap (the approved phone
     layout); the worked example of the administrator's hours and the costs come with the sliders, and the example's
     sentence over the sum says what the sum and the price under it say. */
  [data-home] .calc > .calc-lead { display: none; }
  [data-home] .calc:has(> .calc-fold:not([open])) > .calc-result > :is(#c-hours, #c-hours-basis, .calc-costs) { display: none; }
  [data-home] .pricing-grid.is-short:not(.is-full) > .plan:not(.recommended) :is(.per-day, .plan-boundary, .plan-more, .plan-highlights, .plan-inherit, .plan-rest) { display: none; }
  [data-home] .plan.recommended .plan-highlights > li { padding-block: 8px; font-size: 14.5px; line-height: 1.45; }
  [data-home] .plans-voice p:first-child { line-height: 1.5; }
  [data-home] .ws-about { display: none; }
  [data-home] .home-sites-copy .home-sites-more:first-of-type { margin-top: var(--s2); }
  [data-home] .home-sites-more { border-bottom: 1px solid var(--rule); }
  [data-home] .home-sites-more:first-of-type { border-top: 1px solid var(--rule); }
  [data-home] .home-sites-more > summary { display: flex; align-items: center; min-height: 48px; padding: 6px 0; color: var(--ink); font-size: 16px; font-weight: 650; line-height: 1.35; cursor: pointer; }
  [data-home] .home-sites-more > summary::after { content: "+" / ""; margin-left: auto; padding-left: 12px; font: 500 20px/1 var(--mono); color: var(--muted); }
  [data-home] .home-sites-more[open] > summary::after { content: "−" / ""; }
  [data-home] .home-sites-copy .home-sites-more p { margin: 0 0 12px; }
  [data-home] .cabinet-preview .cp-panel-heading { display: none; }
  [data-home] .home-support-line p { font-size: 14.5px; line-height: 1.5; }
  [data-home] #lead-title { font-size: 24px; }
  [data-home] .risk-theses > li:first-child > span, [data-home] .home-cashback .cashback-more { font-size: 14.5px; line-height: 1.5; }
  [data-home] #ai .show-paper .chat-rows p { font-size: 14.5px; }
  [data-home] #ai .show-paper .chat-rows .said p { font-size: 15px; }
  [data-home] #ai .is-tabs .skill { grid-template-columns: minmax(0, 1fr); }
  [data-home] #ai .is-tabs .skill .skill-n { display: none; }
  [data-home] #ai .is-tabs .skill .skill-more { grid-column: 1; }
  [data-home] .no-risk h3 { font-size: 18px; }
  [data-home] .proof-sub { margin-bottom: var(--s2); }
  /* The footer's line of what the service is says the first screen's again: a phone keeps the brand and the links. */
  [data-home] footer .footer-top > div:first-child > p:not(.footer-person) { display: none; }
  [data-home] footer .footer-bottom { line-height: 1.7; }
  /* Its three documents in rows of 44 px, each a thumb's target and none over another (the shared rule's negative
     margins let two wrapped links' targets overlap): two side by side where they fit, the third under them. The dots
     between them are a line's own, so the rows go without (the gap counts twice, once on each side of a dot's place). */
  [data-home] footer .footer-bottom > span:last-child { display: flex; flex-wrap: wrap; column-gap: 10px; font-size: 0; }
  [data-home] footer .footer-bottom a { display: flex; align-items: center; min-height: 44px; margin: 0; padding: 0; font-size: 12.5px; }
  [data-home] .ws-shot { aspect-ratio: 960 / 420; }
  [data-home] #ai .show-next { display: none; }
  [data-home] #ai .risk-line .risk-plans { display: none; }
  [data-home] .plan .plan-result { font-size: 19px; }
  [data-home] .cashback-theses > li { padding: 0; }
  [data-home] .cashback-term > summary { display: flex; align-items: center; min-height: 48px; padding: 6px 0; cursor: pointer; }
  [data-home] .cashback-term > summary::after { content: "+" / ""; margin-left: auto; padding-left: 12px; font: 500 20px/1 var(--mono); color: var(--muted); }
  [data-home] .cashback-term[open] > summary::after { content: "−" / ""; }
  [data-home] .cashback-term[open] { padding-bottom: 10px; }
  [data-home] :is(.cashback-lines, .cashback-demo) { order: 2; }
  [data-home] .cashback-theses > li { max-width: none; }
  /* The three folds and the after-visit sheet as wide as the column: the block is a column that starts its items at
     the left, so a list shrank to its longest row and the «+» marks stopped short of every other fold's. */
  [data-home] :is(.home-cashback .cashback-theses, .after-visit .show-paper) { align-self: stretch; width: 100%; }
  /* Its conversation is the demo's own, one tap away by the open link under the lines: the folded copy stays a computer's. */
  [data-home] .home-cashback .story-example { display: none; }
  [data-home] :is(.home-cashback .show-intro, .prices-lead, #ai .ai-trust, .home-sites-copy .home-sites-lead) { font-size: 15px; line-height: 1.5; }
  [data-home] .cabinet-preview .cp-card-task p { display: none; }
  [data-home] #ai .skill-name { font-size: 17px; }
  [data-home] .proof-lab { margin-bottom: 6px; }
  [data-home] .plans-voice > p:first-child { font-size: 14.5px; }
  [data-home] footer .footer-bottom { gap: 4px; padding-top: var(--s2); }
  [data-home] .ws-caption { padding-block: 0; }
  [data-home] footer .footer-top { padding-block: var(--s3); }
  /* Room for whoever answers by the form and for MAX in the first screen's words (the page with both stays under the
     owner's 11 539 px too): the cashback's three rows as tall as the six groups' — the shared list's own padding gone
     —, and two headings in a line less: «Или настроим за вас» whole — the space before its break stays in the words
     (site/index.html, site.js leadFor) —, the guarantee's as wide as its column. */
  body[data-home] .items.cashback-theses > li { padding: 0; }
  [data-home] .cashback-term > summary { min-height: 52px; }
  [data-home] #lead-title br { display: none; }
  [data-home] .no-risk h3 { max-width: none; text-wrap: balance; }
}
/* A portrait tablet's footer (761–799 px): its three documents wrap into two lines there, and the shared rule's
   negative margins laid one link's 46 px target over the other's — a tap on «Договор-оферта» opened the consent. The
   same rows of 44 px as a phone's; from 800 px the three stand in one line. */
@media (min-width: 761px) and (max-width: 799px) {
  [data-home] footer .footer-bottom > span:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; column-gap: 10px; font-size: 0; }
  [data-home] footer .footer-bottom a { display: flex; align-items: center; min-height: 44px; margin: 0; padding: 0; font-size: 12.5px; }
}
/* Until home.js has folded them, a phone with scripts already draws the folds shut and the short plans short: the page
   is laid out once at its phone height — nothing tall drawn first and folded after (a long task on a slow phone, and a
   page that jumps under a thumb). Without scripts everything is open, as served; a home.js that did not arrive or
   stopped half-way sets the same mark (site/home.html, home.js), so no fold stays shut for good. */
@media (max-width: 760px) and (scripting: enabled) {
  :root:not([data-folds]) body[data-home] :is(.all-item, .cashback-term, .home-sites-more) > :not(summary) { display: none; }
  :root:not([data-folds]) body[data-home] :is(.all-item, .cashback-term, .home-sites-more) > summary::after { content: "+" / ""; }
  :root:not([data-folds]) body[data-home] .pricing-grid > .plan:not(.recommended) :is(.per-day, .plan-boundary, .plan-more, .plan-highlights, .plan-inherit, .plan-rest) { display: none; }
}
/* «Сравнить тарифы целиком»: a phone's way to the short plans' lists (home.js); a computer shows every card whole. */
[data-home] .plans-compare { display: none; }
@media (max-width: 760px) {
  [data-home] .plans-compare { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 48px; margin: var(--s2) 0 0; padding: 12px 0; border: 0; border-block: 1px solid var(--rule); background: none; color: var(--ink); font: inherit; font-size: 15px; font-weight: 650; text-align: left; cursor: pointer; }
  [data-home] .plans-compare::after { content: "+" / ""; font: 500 20px/1 var(--mono); color: var(--muted); }
  [data-home] .plans-compare[aria-expanded="true"]::after { content: "−" / ""; }
}
@media (prefers-reduced-motion: reduce) {
  [data-home] *, [data-home] *::before, [data-home] *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
