/* Страница «Audit náběru zdarma» сайта маклеров (03.11, решение realtors-audit-page-sheet-scroll-3days). Грамматика хиро
   и блоков 1–6: Poppins, земля #EEF2F8, белые панели 24, синий — данные и действия, коралл — главная кнопка (одна на
   экране), шапка — белая капсула с контурной кнопкой. Лист аудита и его части — ../blok4/blok4.css без изменений; здесь —
   страница вокруг листа: первый экран с формой, «что меряем / откуда» у частей, шаги, после аудита, FAQ. Мобилка 390. */
@font-face{font-family:Poppins;font-weight:400;src:url(../hero/fonts/poppins-400.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:500;src:url(../hero/fonts/poppins-500.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:700;src:url(../hero/fonts/poppins-700.woff2) format('woff2')}
*{box-sizing:border-box;margin:0}
:root{--mark:#C9D8FA;--land:#EEF2F8;--ink:#0B1F3F;--muted:#4A5872;--base2:#2456D6;--tint:#DCE6FB;--acc:#D63A2A;--acc-ink:#fff;
  --rule:#E2E7F0;--blue-ink:#1B45B0;--ease:cubic-bezier(.23,1,.32,1);--drawer:cubic-bezier(.32,.72,0,1)}
body{min-height:100dvh;background:var(--land);color:var(--ink);font-family:Poppins,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
[id]{scroll-margin-top:12px}

/* шапка — как на главной: белая капсула, кнопка контуром */
body>.top{display:flex;justify-content:center;padding:14px 12px 0}   /* только обёртка шапки: .top есть и у строки «Doporučení» листа */
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;height:56px;padding:0 6px 0 20px;
  border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--rule)}
.nav .lnk{display:none}
.logo{display:flex;align-items:center;min-height:44px;font-weight:700;font-size:15px;letter-spacing:.02em}
.logo i{font-style:normal;color:var(--base2)}
.nav .cta{display:flex;align-items:center;height:44px;padding:0 18px;border-radius:12px;background:#fff;color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--ink);font-size:14px;font-weight:500;transition:background-color .15s var(--ease),transform .15s var(--ease)}
.nav .cta:active{transform:scale(.97)}
.logo:focus-visible,.nav .cta:focus-visible{outline:3px solid var(--base2);outline-offset:3px;border-radius:8px}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:0;border-radius:14px;font-size:16px;cursor:pointer;
  font-weight:500;box-shadow:inset 0 0 0 1px var(--rule);transition:transform .16s var(--ease),opacity .16s var(--ease)}
.btn--main{background:var(--acc);color:var(--acc-ink);box-shadow:none}
.btn:active{transform:scale(.97)}
.btn:focus-visible{outline:3px solid var(--base2);outline-offset:3px}

/* панели страницы — как .b4 главной: белые, 24, через 12 */
.ap{position:relative;margin:12px 12px 0;padding:32px 20px 24px;border-radius:24px;background:#fff;
  box-shadow:0 0 0 1px var(--rule),0 30px 60px -40px rgba(15,23,42,.25)}
.ap-main .b4{margin:12px 12px 0}
.ap-hero{margin-top:20px;padding:28px 20px 24px}
.ap-hero .b4-h{font-size:32px}
.ap .b4-h{margin-top:8px}
.ap-end{margin-bottom:12px}

/* форма первого экрана: подписи видны, поля 52, сегменты канала 44, ошибка под полем, после отправки — срок */
.ap-form{display:grid;gap:16px;margin-top:24px;padding-top:24px;border-top:1px solid var(--rule)}
.f-l{display:grid;gap:8px;min-width:0;padding:0;border:0;font-size:14px;font-weight:500;line-height:1.4}
.f-l legend{padding:0;margin-bottom:8px}
.f-in{width:100%;height:52px;padding:0 16px;border:0;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px #858FA3;
  font-size:16px;font-weight:400;transition:box-shadow .16s var(--ease)}
.f-in::placeholder{color:#6B7690}
.f-in:focus{outline:none;box-shadow:inset 0 0 0 2px var(--base2)}
.f-in[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--acc)}
.f-err{font-size:13px;font-weight:400;line-height:1.4;color:#C2331F}
.f-err:empty{display:none}
.f-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.f-seg button{display:flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 8px;border:0;border-radius:10px;
  background:#fff;box-shadow:inset 0 0 0 1px #858FA3;font-size:14px;font-weight:500;cursor:pointer;
  transition:background-color .16s var(--ease),box-shadow .16s var(--ease),transform .16s var(--ease)}
.f-seg button:active{transform:scale(.97)}
.f-seg svg{display:none;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.f-seg [aria-pressed="true"]{background:var(--tint);color:var(--blue-ink);box-shadow:inset 0 0 0 1.5px var(--base2)}
.f-seg [aria-pressed="true"] svg{display:block}
.f-seg button:focus-visible{outline:3px solid var(--base2);outline-offset:2px}
.f-ok{display:flex;gap:12px;align-items:flex-start;min-height:44px;font-size:13px;line-height:1.5;color:var(--muted);cursor:pointer}
.f-ok input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--base2)}
.f-ok a{color:var(--blue-ink);text-decoration:underline;text-underline-offset:3px}
.f-go{width:100%}
.f-go[disabled]{opacity:.6}
.f-fine{font-size:13px;line-height:1.5;color:var(--muted)}
.f-done{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:12px;background:var(--tint);font-size:15px;line-height:1.5}
.f-done[hidden]{display:none}
.f-done i{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--base2)}
.f-done svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.f-done b{font-weight:500}
.ap-form.sent>:not(.f-done){display:none}

/* закрытый лист: обложка с оглавлением частей — ссылки к частям ниже */
.ap-toc{padding:16px 0 4px}
.ap-toc>p{font-size:13px;font-weight:500;line-height:1.35;color:var(--muted)}
.ap-toc ol{margin-top:8px;padding:0;list-style:none}
.ap-toc li+li{border-top:1px solid var(--rule)}
.ap-toc a{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px;line-height:1.35}
.ap-toc a::after{content:'';flex:none;margin-left:auto;width:14px;height:14px;background:#9AA6BB;   /* стрелка вниз: ссылка ведёт к части ниже, не раскрывает */
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2.5v11M3.5 9 8 13.5 12.5 9'/%3E%3C/svg%3E") center/14px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2.5v11M3.5 9 8 13.5 12.5 9'/%3E%3C/svg%3E") center/14px no-repeat}
.ap-toc b{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:6px;background:var(--tint);color:var(--blue-ink);
  font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.ap-toc a:focus-visible{outline:3px solid var(--base2);outline-offset:2px;border-radius:6px}
.ap-sheet .d-part:first-of-type{margin-top:12px;border-top:1px solid var(--rule)}
/* лист — последний в панели: стол доходит до низа панели, без белой полосы под ним (аудит design-review) */
.ap-main .ap-sheet{padding-bottom:0;overflow:hidden}
.ap-main .ap-sheet .b4-desk{padding-bottom:24px}

/* «что меряем / откуда» у каждой части — строки с подписью слева, без рамки */
.ap-how{display:grid;gap:8px;margin-top:16px;padding-top:12px;border-top:1px dashed #CBD3E1}
.ap-how div{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px}
.ap-how dt{font-size:12px;font-weight:500;line-height:1.5;color:var(--blue-ink)}
.ap-how dd{font-size:13px;line-height:1.5;color:var(--muted)}

/* шаги — номера на общей линии, не три карточки */
.ap-steps{margin-top:24px;padding:0;list-style:none}
.ap-steps li{position:relative;padding:0 0 24px 44px}
.ap-steps li:last-child{padding-bottom:0}
.ap-steps li:not(:last-child)::before{content:'';position:absolute;left:13px;top:32px;bottom:4px;width:2px;border-radius:1px;background:var(--rule)}
.ap-steps b{position:absolute;left:0;top:0;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--tint);
  color:var(--blue-ink);font-size:13px;font-weight:700}
.ap-steps small{display:block;font-size:13px;font-weight:500;line-height:28px;color:var(--blue-ink)}
.ap-steps p{margin-top:4px;font-size:16px;line-height:1.5}
.ap-no{margin-top:24px;padding:20px 0 0;border-top:1px solid var(--rule);list-style:none}
.ap-no li{position:relative;padding-left:28px;font-size:15px;line-height:1.5;color:var(--muted)}
.ap-no li+li{margin-top:8px}
.ap-no li::before{content:'';position:absolute;left:1px;top:4px;width:16px;height:16px;background:var(--base2);   /* галочка: «без звонка» — обещание, не отказ (аудит design-review) */
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5 6.5 11.5 12.5 5'/%3E%3C/svg%3E") center/16px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5 6.5 11.5 12.5 5'/%3E%3C/svg%3E") center/16px no-repeat}
.ap-no b{font-weight:500;color:var(--ink)}

/* после аудита — условия строкой и ссылка со стрелкой (как стрелки пакетов блока 6) */
.ap-terms{display:grid;gap:8px;margin-top:20px;padding-top:20px;border-top:1px solid var(--rule)}
.ap-terms span{position:relative;padding-left:20px;font-size:14px;line-height:1.5;color:var(--muted)}
.ap-terms span::before{content:'';position:absolute;left:3px;top:9px;width:5px;height:5px;border-radius:50%;background:var(--base2)}   /* мельче галочек выше (аудит apple-design) */
.ap-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:12px;font-size:16px;font-weight:500;color:var(--blue-ink)}
.ap-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  transition:translate .16s var(--ease)}
.ap-link:focus-visible{outline:3px solid var(--base2);outline-offset:2px;border-radius:6px}

/* FAQ — раскрытие строк, без карточек */
.ap-qs{margin-top:20px}
.ap-qs details{border-top:1px solid var(--rule)}
.ap-qs details:last-child{border-bottom:1px solid var(--rule)}
.ap-qs summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 0;font-size:16px;
  font-weight:500;line-height:1.4;cursor:pointer;list-style:none}
.ap-qs summary::-webkit-details-marker{display:none}
.ap-qs summary::after{content:'';flex:none;width:8px;height:8px;border:solid var(--muted);border-width:0 1.5px 1.5px 0;rotate:45deg;
  translate:0 -3px;transition:rotate .2s var(--ease),translate .2s var(--ease)}
.ap-qs details[open] summary::after{rotate:225deg;translate:0 2px}
.ap-qs summary:focus-visible{outline:3px solid var(--base2);outline-offset:2px;border-radius:6px}
.ap-qs details p{padding:0 0 16px;font-size:15px;line-height:1.55;color:var(--muted)}
.ap-up{width:100%;margin-top:24px}

.ap-foot{padding:20px 12px calc(40px + env(safe-area-inset-bottom));text-align:center;font-size:13px;line-height:1.5;color:var(--muted)}
.ap-foot i{font-style:normal;color:var(--base2)}
.ap-foot{display:flex;flex-direction:column;align-items:center}
.ap-foot a{display:inline-flex;align-items:center;min-height:44px}

/* липкая кнопка: появляется, когда форма ушла вверх; прячется, когда в кадре форма или кнопка конца */
.sticky{position:fixed;left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;
  box-shadow:0 14px 28px -12px rgba(11,31,63,.5);transition:opacity .25s var(--drawer),translate .25s var(--drawer)}
.sticky.off{opacity:0;translate:0 100%;pointer-events:none}

/* появление: как блок 4 — один раз, группой, порог 0,25 */
@media (prefers-reduced-motion:no-preference){
  .ap-js .ap .rv{opacity:0;transform:translateY(12px);transition:opacity .44s var(--ease) var(--d,0ms),transform .44s var(--ease) var(--d,0ms)}
  .ap-js .ap .rv.on{opacity:1;transform:none}
}
@media (hover:hover) and (pointer:fine){
  .nav .cta:hover{background:var(--tint)}
  .f-seg button:hover{box-shadow:inset 0 0 0 1.5px var(--base2)}
  .ap-link:hover svg{translate:3px 0}
  .ap-toc a:hover{color:var(--blue-ink)}
}

/* планшет 768–1023 — колонка мобилки по центру (как планшет блоков 2–4) */
@media (min-width:768px) and (max-width:1023px){
  body>.top{padding-inline:24px}.nav{width:min(640px,100%)}
  .ap,.ap-main .b4{display:flex;flex-direction:column;width:min(640px,calc(100vw - 48px));margin:12px auto 0;padding:48px 40px 40px;border-radius:24px}
  .ap-hero{margin-top:20px}
  .ap-main .b4 .b4-desk{margin:24px -40px 0;padding:24px 40px 32px;border-radius:0}
  .ap-main .b4 .b4-h,.ap .b4-h{margin-top:8px;font-size:30px;line-height:1.12;letter-spacing:-.03em}
  .ap-hero .b4-h{font-size:40px}
  .ap-main .b4 .b4-lead,.ap .b4-lead{margin-top:16px;font-size:16px}
  .ap-main .b4 .b4-eye,.ap .b4-eye{font-size:14px}
  .sticky{max-width:600px;margin:0 auto}
}

/* 03.11 десктоп 1440 (его «Да отлично» на мобилку, идея 09:59): первый экран и лист — одна панель шириной хиро главной;
   слева липкая колонка с формой, справа стол с листом — лист «листается», форма всегда рядом. Ниже — панели той же
   ширины, сетка 5/7 с зазором 96, как блок 4: слева надпись и заголовок, справа содержание. Липкой кнопки нет. */
@media (min-width:1024px){
  body>.top{padding:14px 24px 0}
  .nav{width:auto;gap:36px;padding:0 8px 0 24px}
  .nav .lnk{display:flex;align-items:center;height:44px;border-radius:8px;font-size:14px;color:var(--muted);transition:color .15s var(--ease)}
  .nav .lnk:focus-visible{outline:3px solid var(--base2);outline-offset:3px}
  .ap-top,.ap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:96px;align-items:start;
    width:min(1360px,calc(100vw - 48px));margin:24px auto 0;padding:64px 64px 56px;border-radius:28px;background:#fff;
    box-shadow:0 0 0 1px var(--rule),0 30px 60px -40px rgba(15,23,42,.25)}
  .ap-top{margin-top:28px;padding:40px 64px 64px}
  .ap-top>.ap-hero,.ap-main .ap-top>.ap-sheet{display:block;width:auto;margin:0;padding:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
  .ap-top>.ap-hero{position:sticky;top:24px}
  .ap-top>.ap-sheet>.b4-eye,.ap-top>.ap-sheet>.b4-h{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .ap-top>.ap-sheet>.b4-lead{margin:0 0 16px;font-size:15px}
  .ap-main .ap-top .b4-desk{margin:0;padding:40px 40px 32px;border-radius:20px}
  .ap-top .ap-hero .b4-eye,.ap .b4-eye{font-size:15px}
  .ap-top .ap-hero .b4-h{margin-top:16px;font-size:48px;line-height:1.08;letter-spacing:-.035em}
  .ap .b4-h{margin-top:16px;font-size:40px;line-height:1.1;letter-spacing:-.035em}
  .ap-top .b4-h mark,.ap .b4-h mark{padding:0 .1em;margin:0 -.1em;border-radius:.16em;
    background:linear-gradient(transparent .22em,var(--mark) .22em,var(--mark) calc(100% - .18em),transparent calc(100% - .18em))}
  .ap-top .ap-hero .b4-lead{margin-top:20px;font-size:18px}
  .ap-form{margin-top:24px;padding-top:24px;gap:12px}
  .ap-terms span{font-size:15px}
  .ap-foot{flex-direction:row;justify-content:center;gap:32px}
  .ap-how div{grid-template-columns:96px minmax(0,1fr)}
  .ap-how dd{font-size:14px}
  .ap-body>:first-child,.ap-body.ap-qs,.ap-next .ap-body>.b4-lead{margin-top:0}
  .ap-steps p{font-size:17px}
  .ap-end{margin-bottom:24px;align-items:end}
  .ap-end .b4-lead{margin-top:16px;font-size:18px}
  .ap-up{width:100%}
  .sticky{display:none}
}
@media (min-width:1024px) and (hover:hover) and (pointer:fine){.nav .lnk:hover{color:var(--ink)}}
@media (min-width:1024px){.ap-top.tall>.ap-hero{position:static}}
/* 1024–1279 (ноутбуки, iPad альбомом): зазор и поля уже, заголовок первого экрана меньше — колонка 5/7 остаётся */
@media (min-width:1024px) and (max-width:1279px){
  .ap-top,.ap{column-gap:56px;padding-left:40px;padding-right:40px}
  .ap-top .ap-hero .b4-h{font-size:40px}
  .ap .b4-h{font-size:34px}
  .ap-main .ap-top .b4-desk{padding:32px 24px 24px}
}
