/* lotcheck.com home page: the LED screens beside the search, the special-features ticker,
   the built-out lot in Studies and the factory photo. Loaded after reel.css. */

/* Can I build: two LED screens until a lot is searched */
.sheet.is-mirror{background:none;box-shadow:none;border-top:0}
.sheet.is-mirror .plan{display:none}
.sheet.is-mirror .result{padding:18px 0 0;border-top:0}
.mirror{display:grid;gap:20px}
.mirror[hidden]{display:none}
.mirror-theme{margin:0 0 -4px;min-height:1.5em;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.tv{position:relative;display:block;width:94%;color:var(--graphite);text-decoration:none}
.tv + .tv{margin-left:6%}
.tv-panel{position:relative;display:block}
.tv-glow{position:absolute;top:10%;right:5%;bottom:-6%;left:5%;z-index:0;filter:blur(28px) saturate(1.5);opacity:.5;pointer-events:none}
.tv-glow img,.tv-glass img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}
.tv-glow img.is-on,.tv-glass img.is-on{opacity:1}
.tv-glass video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;background:#000}
.tv-bezel{position:relative;z-index:1;display:block;padding:4px 4px 5px;border-radius:10px;background:linear-gradient(160deg,#3B3A37 0%,#151514 42%,#050505 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 26px 36px -22px rgba(0,0,0,.65),0 3px 8px rgba(0,0,0,.16)}
.tv-glass{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:6px;background:#000}
.tv-glass::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(122deg,rgba(255,255,255,.17) 0%,rgba(255,255,255,.04) 26%,rgba(255,255,255,0) 40%),linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 10%)}
.tv-led{position:absolute;right:16px;bottom:1px;z-index:2;width:5px;height:2px;border-radius:2px;background:#8FE3A0;box-shadow:0 0 6px 1px rgba(120,220,140,.85)}
.tv-cap{display:block;margin-top:10px;min-height:1.4em;font-size:15px;line-height:1.35;color:var(--stone)}
.tv-cap b{font-weight:500;color:var(--graphite)}
.tv:hover .tv-cap b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.tv:focus-visible{outline:2px solid var(--graphite);outline-offset:6px}
@media (max-width:700px){.tv{width:100%}.tv + .tv{margin-left:0}.mirror{gap:16px}}
@media (prefers-reduced-motion:reduce){.tv-glow img,.tv-glass img{transition:none}}

/* Special features: runs like a stock ticker; the tape below lists where units go, by road or by sea */
.ticker-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 40px;margin-bottom:24px}
.ticker-head .btn--quiet{min-width:48px;min-height:48px}
.ticker:not(.is-js) .ticker-head .btn{display:none}
.ticker-stage{overflow:hidden}
.ticker:not(.is-js) .ticker-stage{overflow-x:auto;scrollbar-width:none}
.ticker-track,.tape-track{display:flex;width:max-content;margin:0;padding:0;list-style:none}
.ticker.is-js .ticker-track{animation:km-tick var(--dur,90s) linear infinite}
.ticker.is-js .tape-track{animation:km-tick var(--dur,60s) linear infinite}
.ticker-stage:hover .ticker-track,.ticker-stage:focus-within .ticker-track,.ticker.is-paused .ticker-track,.ticker.is-paused .tape-track{animation-play-state:paused}
@keyframes km-tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker-card{position:relative;flex:none;width:clamp(240px,26vw,340px);aspect-ratio:17/20;margin-right:16px;overflow:hidden;background:var(--concrete)}
.ticker-card a{position:absolute;top:0;right:0;bottom:0;left:0;display:block;color:var(--paper);text-decoration:none}
.ticker-card img{display:block;width:100%;height:100%;object-fit:cover}
.ticker-card.is-trim img{transform:scale(1.08);transform-origin:50% 100%}   /* renders with a grey band along the top */
.ticker-card .reel-plate{right:0;max-width:none}
.ticker-card a:hover .reel-plate b,.ticker-card a:focus-visible .reel-plate b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.ticker-card a:focus-visible{outline:0;box-shadow:inset 0 0 0 3px var(--graphite),inset 0 0 0 6px var(--paper)}
.tape{margin-top:16px;overflow:hidden;background:var(--graphite);border-top:2px solid var(--gold)}
.tape-track li{display:flex;align-items:baseline;gap:9px;padding:13px 30px 12px 0;white-space:nowrap;font-size:15px;letter-spacing:.08em;color:#CFCAC1}
.tape-track li b{font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--paper)}
.tape-track li span{font-style:italic;letter-spacing:.04em;color:#CFCAC1}
.tape-track .up{font-style:normal;font-size:12px;color:#3DDC84}
.tape-track li::after{content:"·";margin-left:21px;color:var(--gold)}
.tape{position:relative}
@media (prefers-reduced-motion:reduce){.ticker-stage{overflow-x:auto}.tape{overflow-x:auto}}

/* Studies: a lot, built out, to scale */
.built{margin:0 0 44px}
.built-pan{box-shadow:var(--sheet-lift);border-top:3px solid var(--gold);background:#fff}
.built-pan img{display:block;width:100%;height:auto}
.built-pan img[data-lang="es"]{display:none}
html[lang^="es"] .built-pan img[data-lang="en"]{display:none}
html[lang^="es"] .built-pan img[data-lang="es"]{display:block}
.built figcaption{display:grid;gap:10px;margin-top:16px;max-width:46em}
.built-h{font-size:clamp(19px,2vw,21px);line-height:1.3;color:var(--graphite)}
.built-c{font-size:16px;line-height:1.5;color:var(--stone)}
.built-key{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0;padding:0;list-style:none;font-size:15px;color:var(--stone)}
.built-key li{display:flex;align-items:center;gap:8px}
.built-key i{display:inline-block;width:18px;height:18px;flex:none}
.k-solar{background:linear-gradient(90deg,transparent 8px,#64768A 8px,#64768A 9px,transparent 9px),linear-gradient(transparent 8px,#64768A 8px,#64768A 9px,transparent 9px);background-color:#2C3947}
.k-awning{background:repeating-linear-gradient(0deg,#C0913F 0 4px,#F5F3EE 4px 8px);box-shadow:inset 0 0 0 1px #22211E}
.k-umbrella{border-radius:50%;background:conic-gradient(#D9B878 0 45deg,#F5F3EE 0 90deg,#D9B878 0 135deg,#F5F3EE 0 180deg,#D9B878 0 225deg,#F5F3EE 0 270deg,#D9B878 0 315deg,#F5F3EE 0);box-shadow:inset 0 0 0 1px #22211E}
.k-green{border-radius:50%;background:#A6B78E;box-shadow:inset 0 0 0 1px #6F8661}

/* The factory: Antoinette on the floor */
.factory-photo{margin:44px 0 0}
.factory-photo img{display:block;width:100%;height:auto}
.factory-photo figcaption{margin-top:12px;font-size:16px;font-style:italic;line-height:1.45;color:var(--stone)}