/* Главная для гостя: слева текст, справа «видоискатель» с тремя ответами. */
.land-hero {
  max-width: 1180px; margin: 0 auto; padding: 48px 16px 32px;
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 48px; align-items: center;
}
.land-copy { display: grid; gap: 18px; }
.land-copy h1 { font-size: clamp(30px, 4.2vw, var(--fs-6)); letter-spacing: -.028em; line-height: 1.06; }

.land-frame { margin: 0; display: grid; gap: 12px; }
.lf-view {
  position: relative; aspect-ratio: 1 / 1; max-width: 100%;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(0,0,0,.18)),
    repeating-linear-gradient(90deg, #6f7370 0 2px, #747874 2px 5px);
  border-radius: 4px; overflow: hidden;
}
.lf-corner { position: absolute; width: 34px; height: 34px; border: 2px solid rgba(255,255,255,.85); }
.lf-corner.tl { top: 16px; left: 16px; border-right: 0; border-bottom: 0; }
.lf-corner.tr { top: 16px; right: 16px; border-left: 0; border-bottom: 0; }
.lf-corner.bl { bottom: 16px; left: 16px; border-right: 0; border-top: 0; }
.lf-corner.br { bottom: 16px; right: 16px; border-left: 0; border-top: 0; }
.lf-no { position: absolute; top: 22px; left: 60px; font: 600 12px/1 var(--mono); letter-spacing: .1em; color: rgba(255,255,255,.8); }
.lf-q { position: absolute; inset: 0; display: grid; place-items: center; font: 800 clamp(30px, 5vw, 54px)/1 var(--font); color: rgba(255,255,255,.92); letter-spacing: -.03em; }
.lf-scale { position: absolute; left: 16px; right: 16px; bottom: 60px; display: grid; grid-template-columns: repeat(6, 1fr); height: 14px; }
.lf-scale i:nth-child(1) { background: #5f7aa0; } .lf-scale i:nth-child(2) { background: #6a4679; } .lf-scale i:nth-child(3) { background: #c8741f; }
.lf-scale i:nth-child(4) { background: #469449; } .lf-scale i:nth-child(5) { background: #af363c; } .lf-scale i:nth-child(6) { background: #0885a1; }

.lf-answers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.lf-btn {
  display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 8px 12px; border-radius: var(--r-2);
  background: var(--card); border: 1px solid var(--line-2); font-weight: 650; font-size: var(--fs-1);
  box-shadow: inset 4px 0 0 var(--cls);
}
.lf-btn.real { --cls: var(--c-real); } .lf-btn.full { --cls: var(--c-full); } .lf-btn.partial { --cls: var(--c-partial); }
.lf-conf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: var(--fs-0); color: var(--ink-3); }
.lf-conf span { font-family: var(--mono); text-transform: uppercase; letter-spacing: .06em; margin-right: 4px; }

.land-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding-block: 24px; border-top: 1px solid var(--line); }
.fact { display: grid; gap: 8px; align-content: start; }
.fact-n { font: 800 44px/1 var(--font); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.fact-n span { font-size: 18px; font-weight: 650; color: var(--ink-3); margin-left: 4px; letter-spacing: 0; }
.fact p:last-child { color: var(--ink-2); font-size: var(--fs-1); max-width: 36ch; }

.land-how { display: grid; gap: 16px; padding-top: 12px; }
.how { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; counter-reset: how; }
.how li { counter-increment: how; display: grid; gap: 6px; align-content: start; font-size: var(--fs-1); color: var(--ink-2); padding-top: 14px; border-top: 2px solid var(--ink); }
.how li::before { content: "0" counter(how); font: 600 12px/1 var(--mono); color: var(--ink-3); letter-spacing: .08em; }
.how b { color: var(--ink); font-size: var(--fs-2); }

@media (max-width: 900px) {
  .land-hero { grid-template-columns: 1fr; gap: 28px; padding-top: 28px; }
  .land-facts, .how { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width: 480px) {
  .lf-answers { grid-template-columns: 1fr; }
}
