/* Landscape and home composition. Shared UI lives in ui/. */
body.home-page{overflow:hidden;background:#506f83}
body.calculator-page{background:#506f83}
.landscape{position:fixed;inset:-3%;z-index:-3;background:#506f83 url('/assets/mexico-volcano-ai-v2.jpg') 72% 50%/cover no-repeat;animation:landscape-arrive 2.2s var(--ease-out) both,landscape-drift 38s 2.2s ease-in-out infinite alternate}
.atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(90deg,#1227366b,#162a391f 64%),linear-gradient(180deg,#11223033,transparent 30%,transparent 78%,#1122303b)}
.home-page .atmosphere{background:linear-gradient(90deg,#1227363b,#162a3906 68%),linear-gradient(180deg,#1122301a,transparent 30%,transparent 78%,#1122301f)}
.home-page .landscape{filter:brightness(1.08) saturate(.92)}
.atmosphere::after{content:'';position:absolute;inset:-10%;background:radial-gradient(ellipse at 75% 60%,#e6f1ff12,transparent 58%);animation:haze-drift 44s ease-in-out infinite alternate}
.hero{height:100svh;min-height:500px;display:flex;align-items:center;padding:0 var(--page-gutter)}
.hero-copy{margin-top:1.5vh;position:relative;isolation:isolate}
.identity{display:flex;align-items:center;gap:23px}
.identity h1{margin:0;font-size:clamp(25px,3.4vw,46px);font-weight:400;letter-spacing:.24em;text-transform:uppercase;line-height:1.5;white-space:nowrap;text-shadow:none}
.title-letter{display:inline-block;animation:letter-arrive 1.2s var(--ease-out) both;animation-delay:calc(.55s + var(--letter-index)*.045s)}
.title-space{width:.42em}
.hero-brand-symbol{display:block;width:42px;height:42px;background:currentColor;mask:url('/assets/brand-symbol.svg') center/contain no-repeat;-webkit-mask:url('/assets/brand-symbol.svg') center/contain no-repeat;animation:content-arrive 1.2s .3s both}
.hero-deck{font-size:var(--text-body);font-weight:300;letter-spacing:.02em;margin:14px 0 26px 65px;animation:content-arrive 1s 1.15s both;text-shadow:none}
.upload-control{position:relative;margin-left:65px;max-width:365px}
#receiptFile{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.home-page .upload-button{min-width:180px;justify-content:space-between;animation:button-arrive 1s 1.35s var(--ease-out) both}
.button-label,.button-arrow{position:relative}
.button-arrow{font-size:20px;line-height:1;transition:transform var(--duration-normal) var(--ease-out)}
.home-page .upload-button:hover .button-arrow{transform:rotate(90deg)}
.file-status{min-height:24px;max-width:350px;margin-top:var(--space-3);font-size:var(--text-caption);line-height:1.6;color:var(--muted);overflow-wrap:anywhere}
.file-status:empty{display:none}
.upload-control::before{content:'';position:absolute;inset:-14px;border:1px dashed transparent;border-radius:var(--radius-panel);pointer-events:none;transition:border-color var(--duration-fast),background var(--duration-fast)}
.upload-control.is-dragging::before{border-color:#ffffffb3;background:#ffffff12}
.home-page.is-file-dragging::after{content:'';position:fixed;inset:18px;border:1px dashed #ffffffb3;border-radius:var(--radius-panel);background:#183d4a24;pointer-events:none;z-index:10}
@keyframes landscape-arrive{from{opacity:.4;transform:scale(1.07)}to{opacity:1;transform:scale(1)}}
@keyframes landscape-drift{from{transform:scale(1)}to{transform:scale(1.035) translate(-.45%,.25%)}}
@keyframes haze-drift{from{opacity:.35;transform:translateX(-2%)}to{opacity:.85;transform:translateX(3%)}}
@keyframes content-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes letter-arrive{from{opacity:0;transform:translateY(18px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes button-arrive{from{opacity:0;transform:translateY(9px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.hero{align-items:flex-start}.hero-copy{margin-top:39svh;width:100%}.identity{gap:15px}.identity h1{font-size:clamp(22px,6.1vw,35px);letter-spacing:.16em}.hero-brand-symbol{width:30px;height:30px}.hero-deck{font-size:var(--text-small);margin:15px 0 23px 45px}.upload-control{margin-left:45px;max-width:calc(100% - 45px)}.landscape{background-position:76% center}.home-page .atmosphere{background:linear-gradient(90deg,#142c3f30,transparent 80%),linear-gradient(0deg,#142c3f28,transparent 35%)}}
