/* Homepage only. The one orchestrated moment: the beam sweeps once on load; on a check, lamps light row by row. */
.hero { padding: 28px 0 64px; }
.hero .wrap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 40px; align-items: center; }
.hero .display { max-width: 13ch; }
.hero .lede { max-width: 46ch; margin: 22px 0 28px; }

.check { display: flex; gap: 10px; max-width: 560px; flex-wrap: wrap; }
.check label { flex: 1 1 260px; display: block; }
.check input {
  width: 100%; min-height: 54px; padding: 0 16px; border: 2px solid var(--ink); border-radius: 6px;
  background: var(--paper); color: var(--ink); font: inherit; font-size: 1.08rem;
}
.check input::placeholder { color: var(--ink-3); }
.check .btn { min-height: 54px; padding: 0 26px; }
.check-note { margin-top: 12px; font-size: 0.92rem; color: var(--ink-3); }
.check-error { min-height: 1.6em; margin: 8px 0 0; color: var(--buoy); font-weight: 600; }

/* tower + beam illustration */
.scene { position: relative; aspect-ratio: 1 / 0.92; }
.scene svg { width: 100%; height: 100%; overflow: visible; }
.scene .contour path { fill: none; stroke: var(--shoal); stroke-width: 1.4; }
.scene .land { fill: var(--chart-2); }
.scene .tower { fill: var(--ink); }
.scene .lamp-glass { fill: var(--lamp); }
.scene .beam { transform-box: view-box; transform-origin: 300px 132px; animation: sweep 2.6s cubic-bezier(.45, .05, .2, 1) .3s both; }
.scene .beam path { fill: url(#beamFill); }
.scene .ship text { font: 600 13px/1 "Archivo", sans-serif; fill: var(--ink-3); transition: fill .3s; }
.scene .ship circle { fill: var(--chart); stroke: var(--ink-3); stroke-width: 1.5; }
.scene .ship { animation: catch .5s ease-out both; animation-delay: calc(.9s + var(--d) * .28s); }
@keyframes sweep {
  0% { transform: rotate(-58deg); opacity: 0; }
  12% { opacity: 1; }
  100% { transform: rotate(14deg); opacity: 1; }
}
@keyframes catch {
  from { opacity: .35; }
  to { opacity: 1; }
}

/* result panel */
.result { padding: 0 0 72px; }
.result-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin-bottom: 14px; }
.result-head h2 { overflow-wrap: anywhere; }
.result.ghost .lights td { color: var(--ink-3); }
.result .verdict { font-size: 1.12rem; max-width: 70ch; }
.result .facts-list { margin: 0 0 22px; padding-left: 1.1em; max-width: 70ch; color: var(--ink-2); }
.result .facts-list .fix { color: var(--ink); font-weight: 600; }
.result.scanning .lights tbody { opacity: .45; transition: opacity .2s; }
.lit-in .lamp-dot { animation: light .45s ease-out both; animation-delay: calc(var(--i, 0) * 70ms); }
@keyframes light { from { background: transparent; box-shadow: none; } }

.offer { margin-top: 28px; padding: 26px 0 0; border-top: 2px solid var(--ink); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 40px; align-items: center; }
.offer h3 { font-stretch: 118%; font-size: 1.45rem; }
.offer p { margin: 6px 0 0; color: var(--ink-2); max-width: 60ch; }
.offer .price { font-stretch: 125%; font-weight: 800; font-size: 1.9rem; }
.offer .actions { display: grid; gap: 8px; justify-items: end; text-align: right; }

@media (max-width: 860px) {
  .hero .wrap { grid-template-columns: 1fr; }
  .scene { max-width: 420px; justify-self: center; order: -1; margin: -10px 0 -20px; }
  .offer { grid-template-columns: 1fr; }
  .offer .actions { justify-items: start; text-align: left; }
}
.scene .d1 { --d: 1; } .scene .d2 { --d: 2; } .scene .d3 { --d: 3; } .scene .d4 { --d: 4; } .scene .d5 { --d: 5; } .scene .d0 { --d: 0; }

/* sections below the result */
.linkish { background: none; border: 0; padding: 0; font: inherit; color: var(--depth); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; min-height: 24px; }
.linkish:hover { color: var(--ink); }
.small { font-size: 0.92rem; }
.split { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 32px 56px; align-items: start; }
.split .prose h2 { margin-bottom: 16px; }
.excerpt { background: var(--paper); padding: 4px 24px; border-left: 4px solid var(--ink); }
.excerpt li:last-child { border-bottom: 0; }
.weights { border-collapse: collapse; width: 100%; }
.weights th { text-align: left; font-weight: 600; font-size: 0.85rem; color: var(--ink-3); padding: 6px 0; border-bottom: 1px solid var(--rule); }
.weights td { padding: 8px 0; border-bottom: 1px solid var(--rule); }
.weights td.num, .weights th.num { text-align: right; width: 4.5em; }
.weights tr.free td:first-child { padding-left: 14px; box-shadow: inset 4px 0 0 var(--lamp); }
.study h2 { max-width: 24ch; margin-bottom: 14px; }
.bars { margin: 28px 0 22px; max-width: 760px; }
.bars figcaption { color: var(--ink-2); margin-bottom: 12px; }
.bar-row { display: grid; grid-template-columns: 9.5em 1fr 9.5em; gap: 14px; align-items: center; padding: 7px 0; }
.bar-row .track { height: 14px; background: var(--chart-2); position: relative; }
.bar-row .fill { position: absolute; inset: 0 auto 0 0; background: var(--buoy); }
.bar-row .fill.p59 { width: 59%; } .bar-row .fill.p64 { width: 64%; } .bar-row .fill.p47 { width: 47%; }
.study code, .faq code { font: 500 0.88em/1 ui-monospace, Consolas, monospace; }
.plans { border-collapse: collapse; width: 100%; margin: 18px 0 24px; }
.plans th, .plans td { text-align: left; vertical-align: top; padding: 16px 18px 16px 0; border-bottom: 1px solid var(--rule); }
.plans thead th { font-weight: 600; font-size: 0.85rem; color: var(--ink-3); padding-top: 0; }
.plans tbody th { font-stretch: 115%; font-weight: 750; white-space: nowrap; }
.plans td.num { white-space: nowrap; }
.plans tr.main th, .plans tr.main td { background: var(--paper); }
.plans tr.main th { padding-left: 14px; box-shadow: inset 4px 0 0 var(--lamp); }
.plans tr.main strong { font-stretch: 125%; font-size: 1.5rem; }
.plan-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 14px; }
.faq details { border-bottom: 1px solid var(--rule); padding: 4px 0; }
.faq summary { cursor: pointer; font-weight: 650; padding: 12px 0; min-height: 24px; }
.faq summary:hover { color: var(--depth); }
.faq details p { margin: 0 0 14px; color: var(--ink-2); }
.offer form { margin: 0; }
.offer .price .quiet { font-stretch: 100%; font-weight: 400; font-size: 1rem; }

@media (max-width: 860px) {
  .split { grid-template-columns: minmax(0, 1fr); }
  .bar-row { grid-template-columns: 7em 1fr; }
  .bar-row .num { grid-column: 2; font-size: 0.9rem; color: var(--ink-2); margin-top: -4px; }
  .plans, .plans tbody { display: block; width: 100%; }
  .plans thead { display: none; }
  .plans td.num { white-space: normal; text-align: right; max-width: 9em; }
  .plans tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 12px 0; border-bottom: 1px solid var(--rule); }
  .plans th, .plans td { border: 0; padding: 4px 0; }
  .plans td:not(.num) { grid-column: 1 / -1; grid-row: 2; }
  .plans tr.main { background: var(--paper); padding: 12px; box-shadow: inset 4px 0 0 var(--lamp); }
  .plans tr.main th { box-shadow: none; padding-left: 0; }
}
.split > * { min-width: 0; }
.fixes h3, .fixes p, .facts dd { overflow-wrap: anywhere; }