/* Главная · «Солнечный отпечаток» (lab/home-print-v1/). Поверх /lab/print-shared/style.css.
   Шапка, меню, липкая полоса под шапкой и подвал — /lab/print-shared/chrome-print.css; здесь только сама
   страница: первый экран под канонической шапкой, Дизайн Человека, Атлас, голоса читателей, полоса цен. */

/* ════════════ Табл. I под канонической шапкой ════════════ */
/* Шапка фиксирована и закрывает верх листа (70 / 66 / 64 px) — текст начинается ниже неё. --hr-note-h
   теперь 0 (строку «Сайт в разработке» убрали 23.10); calc оставлен, чтобы не трогать геометрию. */
.hero {
  height: calc(100svh - var(--hr-note-h, 0px));
  min-height: max(620px, calc(100svh - var(--hr-note-h, 0px)));
}

/* перелёт Solar Crest уже показал этот экран: Табл. I проявлена с первого кадра (home-boot.js, home.js) */
html.print-arrived .hero-print { background: var(--deep); }
html.print-arrived.dev .hero[data-phase] .ink {
  color: var(--white); transition: none;
  text-shadow: 0 0 .7px rgba(var(--glow-rgb), .55), 0 0 14px rgba(var(--halo-rgb), .14);
}
html.print-arrived.dev .hero[data-phase] .stencil { --bg: var(--white); --fg: var(--deep); filter: none; transition: none; }

/* стекло Долины Сердца — на светлой бумаге своего мира (химия gum, светлая стадия): туман — пыльно-розовая
   дымка, прозрачный след — чистая бумага; буквы тёмные */
.pl-glass {
  --fog-rgb: 210, 152, 130; --dew-rgb: 255, 251, 246; --drop-rgb: 145, 84, 71;
  background-color: var(--sens);
  background-image:
    radial-gradient(120% 90% at 30% 20%, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0) 60%),
    linear-gradient(170deg, var(--sens-hi), var(--sens) 70%);
  box-shadow: inset 0 0 0 1px rgba(var(--ink-rgb), .16), 0 20px 40px -26px rgba(var(--deep-rgb), .4);
}
.pl-glass .pl-copy, .pl-glass.fogged .pl-copy { color: var(--ink); text-shadow: 0 0 8px rgba(var(--mist-rgb), .7); }
.pl-glass .g-line, .pl-glass .g-key, .pl-glass.fogged .g-line, .pl-glass.fogged .g-key { color: var(--ink-2); }
.pl-glass .pl-hint { color: var(--ink-2); }
.pl-glass .pl-act { background: var(--deep); color: var(--white); }

/* ════════════ IV. Дизайн Человека — та же дата, отдельная система ════════════ */
.other-system {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.42fr); gap: 10px clamp(28px, 5vw, 80px);
  align-items: start;
  margin-top: clamp(72px, 9vw, 128px); padding-top: 30px; border-top: 1px solid var(--rule);
}
.other-system .w-book { grid-column: 1 / -1; margin-bottom: 6px; }
.other-system h3 { font: 400 clamp(32px, 3.2vw, 48px)/1.05 var(--f-display); text-wrap: balance; }
.os-text { display: grid; gap: 14px; justify-items: start; max-width: 34em; }
.os-text p { text-wrap: pretty; }
.os-text .w-link { margin-top: 6px; }

/* Мастер-Атлас — карта трёх книг: образный мир живёт в книгах, на сайте — одна тихая ссылка */
.atlas-line { margin-top: clamp(36px, 4vw, 52px); max-width: 46em; font: italic 400 16.5px/1.6 var(--f-text); color: var(--ink-2); text-wrap: pretty; }
.atlas-line a {
  display: table; margin-top: 6px;
  font: 600 11px/1.9 var(--f-mono); font-style: normal; letter-spacing: .14em; text-transform: uppercase;
  color: var(--deep); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 1px;
}
.atlas-line a:hover { border-bottom-width: 2px; }

/* ════════════ V. Книги и цены: подпись к ценам, голоса читателей ════════════ */
.oc-note { margin-top: 16px; font: italic 400 15.5px/1.5 var(--f-text); color: var(--ink-2); }

.voices { margin-top: clamp(64px, 8vw, 112px); }
.voices .sec-no { margin-bottom: 24px; }
.voices-empty h3 { font: 400 clamp(26px, 2.6vw, 38px)/1.12 var(--f-display); max-width: 22em; text-wrap: balance; }
.voices-empty p { margin-top: 12px; max-width: 40em; font-style: italic; color: var(--ink-2); text-wrap: pretty; }
.voices-empty[hidden], .voices-grid[hidden] { display: none; }
.voices-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 18px; }
.voice { display: grid; gap: 14px; align-content: start; margin: 0; padding: 26px 24px 22px; border: 1px solid var(--rule); background: var(--paper); }
.voice blockquote { margin: 0; font: italic 400 18px/1.55 var(--f-text); color: var(--ink); text-wrap: pretty; }
.voice figcaption { font: 500 10.5px/1.5 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }

/* ════════════ полоса цен над подвалом ════════════ */
/* прейскурант слева, строка о сайте справа; ниже — канонический подвал (chrome-print.css стыкует их) */
.foot { margin-top: clamp(84px, 10vw, 150px); padding: 48px var(--gut) 50px; }
.foot-grid { align-items: start; }
.foot-about { gap: 12px; }
.foot-pay { margin-top: 16px; }
@media (min-width: 1101px) {
  .foot-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr); }
  .foot-about { padding-top: 34px; }
}
@media (max-width: 1100px) { .foot-grid { grid-template-columns: minmax(0, 1fr); gap: 26px; } }

/* ════════════ без JS: всё читается, дары видны (ART-BIBLE §4.8–9; проявитель — бонус, а не замок) ════════════ */
/* Лист без скрипта не проявится: он сразу стоит проявленным — синий, текст белый, дар виден; кнопки, которые
   без скрипта ничего не делают, не показываются. */
html:not(.js) .pl-print { background: var(--deep); }
html:not(.js) .pl-print .pl-copy > .pl-tag,
html:not(.js) .pl-print .pl-phrase { color: var(--white); text-shadow: none; }
html:not(.js) .pl-gift { opacity: 1; visibility: visible; transform: none; }
html:not(.js) .pl-act, html:not(.js) .pl-hint { display: none; }
html:not(.js) .slip { background: var(--deep); cursor: default; }
html:not(.js) .slip-phrase { color: var(--white); text-shadow: none; }
html:not(.js) .slip-gift { opacity: 1; visibility: visible; }
html:not(.js) .slip-cue { display: none; }

/* ════════════ телефон ════════════ */
@media (max-width: 760px) {
  /* отдельно стоящие тихие ссылки: линия тонкая, нажимается полоса 44 px (CLARITY §3) */
  .atlas-line a { position: relative; }
  .atlas-line a::before { content: ''; position: absolute; inset: -13px -6px; }
  .hero { min-height: 596px; }
  /* видимая часть листа начинается на 64 px (шапка; или шапка + строка в разработке — первый экран тогда
     и начинается на 44 px ниже): текст встаёт в 20 px под ними */
  .hero-copy { top: 84px; }
  .kicker { margin-bottom: 14px; }
  .hero h1 { margin-bottom: 16px; }
  .cta-row { margin-top: 20px; }
  .hero-motto { margin-top: 18px; }
  .other-system { grid-template-columns: 1fr; padding-top: 24px; }
  .foot { padding: 40px var(--gut) 44px; }
  .voice { padding: 22px 20px 20px; }
}

/* прилетели перелётом Solar Crest: подписи шагов встают сразу, без второго «прихода» после снятия блокировки */
html.print-arrived .steps li { transition: none; }

/* прейскурант подвала: название слева (переносится), цена справа и не отрывается на свою строку;
   строка — сама полоса нажатия 44 px */
.foot .price-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 14px; padding: 0; }
.foot .price-list a { display: flex; align-items: center; min-height: 44px; padding: 4px 0; }
.foot .price-list a::before { content: none; }
.foot .price-list b { margin-left: 0; }

/* три пути — цветом мира. Метки --world-* одинаковы во всех процессах (style.css), контраст ≥4.6:1 на бумаге */
.world[data-world="earth"], .offer-card[data-world="earth"], .devs li:nth-child(1) { --world: var(--world-earth); }
.world[data-world="heart"], .offer-card[data-world="heart"], .devs li:nth-child(2) { --world: var(--world-heart); }
.world[data-world="city"], .offer-card[data-world="pearl"], .devs li:nth-child(3) { --world: var(--world-pearl); }
.devs .dv-w, .world .w-book, .world .w-link, .offer-card[data-world] .oc-world, .offer-card[data-world] .oc-link { color: var(--world); }
.offer-card[data-world] { box-shadow: inset 0 3px 0 var(--world); }

/* разборы и игра под книгами (владелец 2026-10-22): два листа потоньше — у каждого своя страница, цены нет */
.offer-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 18px; }
.offer-more li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; align-items: end;
  padding: 22px 24px; border: 1px dashed rgba(var(--ink-rgb), .35);
}
.offer-more .oc-k, .offer-more .oc-name, .offer-more .oc-what { grid-column: 1; }
.offer-more .oc-link { grid-column: 2; grid-row: 1 / span 3; align-self: end; white-space: nowrap; }
@media (max-width: 760px) {
  .offer-more { grid-template-columns: 1fr; }
  .offer-more li { grid-template-columns: 1fr; }
  .offer-more .oc-link { grid-column: 1; grid-row: auto; justify-self: start; }
}
/* VI · ваш лист: тихая ссылка на разбор профиля на примере (Библиотека, 24.10) */
.your-example { margin-top: 18px; font-size: 16px; }
.your-example a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* «Расчёт карты · 0 ₽» — светлая карточка (владелец 25.10.2026: тёмное — только то, что стало вашим):
   бумага, двойная рамка тушью и плашка «сначала · бесплатно» цвета солнечной бумаги; трафарет — тёмный */
.offer-card.free {
  background: var(--paper); color: var(--ink); border: 1.5px solid var(--deep);
  box-shadow: inset 0 0 0 4px var(--paper), inset 0 0 0 5px rgba(var(--deep-rgb), .35);
}
.offer-card.free .oc-k {
  color: var(--deep); background: var(--sens); padding: 5px 9px 4px; margin: -4px 0 2px -2px;
  box-shadow: 1px 2px 0 rgba(var(--deep-rgb), .18);
}
.offer-card.free .cta-note { color: var(--ink-2); }
.offer-card.free .oc-price { color: var(--deep); }
.offer-card.free .stencil { --bg: var(--cut); --fg: var(--sens); filter: drop-shadow(1px 3px 2px rgba(16, 20, 8, .3)); }