/* Fieldora 3D + glass layer — load LAST on both pages */
:root{--ink-soft:#43554a;--muted:#43554a;--glass:rgb(255 255 255 / 38%);--glass-edge:rgb(255 255 255 / 65%)}
html{background:#d9e5d0}
body{background:transparent!important}

/* Scene: sky, sun, receding field rows */
.scene{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#bcd3dc 0%,#e6eedf 45%,#dfe8d3 100%)}
.scene::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 14%,rgb(255 247 214 / 95%),transparent 26%),radial-gradient(ellipse at 12% 30%,rgb(255 255 255 / 55%),transparent 40%);transform:translate(calc(var(--mx,0)*-14px),calc(var(--my,0)*-10px))}

/* Glass surfaces with a stacked-slab edge */
.panel,.card,.report-progress,.summary-card,.cta,.pop,.site-footer,footer{background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(165%);backdrop-filter:blur(18px) saturate(165%);border:1px solid var(--glass-edge);border-radius:18px;box-shadow:inset 0 1px 0 rgb(255 255 255 / 80%),inset 0 -1px 0 rgb(255 255 255 / 20%),0 12px 0 -7px rgb(255 255 255 / 30%),0 26px 44px -18px rgb(36 56 42 / 38%)}
.summary-card{border-radius:12px;box-shadow:inset 0 1px 0 rgb(255 255 255 / 70%),0 8px 18px -10px rgb(36 56 42 / 35%)}
.site-footer,footer{border-radius:14px;box-shadow:none}
@supports not (backdrop-filter:blur(1px)){.panel,.card,.report-progress,.summary-card,.cta,.pop{background:rgb(247 249 243 / 92%)}}
input,select,.cb-list{background:rgb(255 255 255 / 55%);border-color:rgb(255 255 255 / 70%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.cb-list{background:rgb(250 252 247 / 82%);border-radius:14px;box-shadow:0 24px 50px -12px rgb(36 56 42 / 40%)}
.btn,.button-primary{box-shadow:0 10px 20px -8px rgb(36 56 42 / 55%),inset 0 1px 0 rgb(255 255 255 / 25%)}
.btn:hover,.button-primary:hover:not(:disabled){transform:translateY(-2px)}
.button-quiet,.sample-button{background:rgb(255 255 255 / 45%);border-color:rgb(255 255 255 / 70%)}
.card{transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-8px) rotateX(3deg)}

/* Front page: floating popups on a platform */
.flutes{display:none}
.hero{perspective:1400px}
.stage{position:absolute;right:0;top:50%;width:46%;height:470px;margin-top:-235px;transform-style:preserve-3d;transform:rotateY(calc(-14deg + var(--mx,0)*7deg)) rotateX(calc(8deg + var(--my,0)*-5deg))}
.platform{position:absolute;left:4%;right:2%;bottom:6%;height:150px;transform:translateZ(-40px) rotateX(64deg);border-radius:22px;border:1px solid var(--glass-edge);background:repeating-linear-gradient(90deg,rgb(63 96 54 / 45%) 0 10px,rgb(138 168 112 / 40%) 10px 28px),rgb(255 255 255 / 35%);box-shadow:0 18px 0 -2px rgb(255 255 255 / 40%),0 34px 0 -6px rgb(90 120 80 / 35%),0 60px 70px -10px rgb(36 56 42 / 45%)}
.pop{position:absolute;width:210px;padding:16px 18px;transform-style:preserve-3d;animation:float 7s ease-in-out infinite}
.pop small{display:block;font:600 10px Inter;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.pop b{display:block;margin:4px 0 8px;font:400 34px/1 Fraunces,Georgia,serif;letter-spacing:-.03em;color:#2b3d33}
.pop span{font-size:12.5px;color:var(--ink-soft)}
.pop i{display:block;height:6px;margin:0 0 8px;border-radius:9px;background:rgb(43 61 51 / 14%);overflow:hidden}
.pop i::before{content:"";display:block;width:34%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7f9f78,#3f5a49)}
.pop-a{left:2%;top:4%;transform:translateZ(90px)}
.pop-b{right:4%;top:27%;transform:translateZ(110px);animation-delay:-2.3s}
.pop-c{left:12%;bottom:22%;width:230px;transform:translateZ(60px);animation-delay:-4.6s}
@keyframes float{50%{translate:0 -14px}}
.eyebrow-tag{position:absolute;left:6%;bottom:0;font-size:11px;color:var(--ink-soft)}

/* Monitor: panels rise in as floating platforms */
.report{perspective:1500px}
.report-step:not([hidden]){animation:lift .5s cubic-bezier(.2,.7,.2,1) both;transform-origin:50% 100%}
@keyframes lift{from{opacity:0;transform:translateY(34px) rotateX(9deg)}to{opacity:1;transform:none}}
.planner{animation:lift .6s cubic-bezier(.2,.7,.2,1) both}
.step-navigation{bottom:14px;width:max-content;max-width:100%;margin:0 auto;padding:8px;border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--glass-edge);box-shadow:0 18px 36px -12px rgb(36 56 42 / 45%)}
.step-navigation .button{border-radius:999px}
.progress-list li.completed{border-color:#6f8f68}

@media (max-width:820px){.stage{position:relative;width:100%;height:380px;margin:0;top:0;transform:none}.pop{width:180px}.pop-c{width:190px}.hero{padding-bottom:20px}}
@media (max-width:560px){.stage{height:340px}.pop b{font-size:28px}.step-navigation{width:100%}}
@media (prefers-reduced-motion:reduce){.pop,.report-step:not([hidden]),.planner{animation:none}.stage,.scene::before,
/* Footers: no rules, tidy glass */
footer{border:0;border-radius:0;padding:0}
footer .wrap{padding-top:22px;padding-bottom:22px}
.site-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;margin-top:22px;padding:16px 22px;border:1px solid var(--glass-edge);border-radius:14px;color:var(--ink-soft);font-size:12px;line-height:1.5}
.site-footer a{color:var(--forest-deep);font-weight:600}

/* Floating popups on the monitor page */
.intro{position:relative;max-width:none}
.intro>:not(.stage){max-width:520px}
.intro .stage{top:50%;right:0;width:44%;height:330px;margin-top:-165px}
@media (max-width:820px){.intro>:not(.stage){max-width:none}.intro .stage{position:relative;width:100%;height:290px;margin:12px 0 0;top:0}}
@media (max-width:560px){.intro .stage{height:250px}.intro .pop-b{display:none}.intro .pop-c{left:34%;bottom:18%}}