/* Detail Solar glass mockup, v2: solar and sunbeam motion layer (driven by Motion, assets/js/motion-fx.js).
   Every rule here is cosmetic. Without JS, or with prefers-reduced-motion, the static end state shows. */
:root{--fx-amber:245,166,35;--fx-gold:252,211,77}

/* ---- dark glass cards: consistent amber-edged glass (cards are tagged .fx-card by motion-fx.js) ---- */
.fx-card{position:relative;isolation:isolate;box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 0 0 1px rgba(255,255,255,.06),0 14px 40px rgba(2,6,14,.35)!important;transition:border-color .3s,box-shadow .3s,transform .3s}
@media (hover:hover){.fx-card:hover{border-color:rgba(var(--fx-amber),.45)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 18px 50px rgba(2,6,14,.45),0 0 0 1px rgba(var(--fx-amber),.12)!important}}
.fx-fxl{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:3}
.fx-glow{position:absolute;inset:0;opacity:0;background:radial-gradient(circle 240px at var(--mx,50%) var(--my,50%),rgba(var(--fx-gold),.16),rgba(var(--fx-amber),.06) 45%,transparent 70%);mix-blend-mode:screen}
.fx-band{position:absolute;top:-20%;bottom:-20%;left:0;width:34%;opacity:0;transform:translateX(-140%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(var(--fx-gold),.22) 45%,rgba(255,255,255,.34) 50%,rgba(var(--fx-gold),.22) 55%,transparent)}

/* ---- section beams ---- */
.gm-main>section{position:relative}
.fx-beam{position:absolute;left:24px;right:24px;top:52px;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14) 15%,rgba(255,255,255,.14) 85%,transparent)}
.fx-beam i{position:absolute;top:-1px;left:0;width:26%;height:3px;margin-left:-13%;border-radius:3px;opacity:0;background:linear-gradient(90deg,transparent,rgba(var(--fx-amber),.85) 40%,rgba(var(--fx-gold),1) 50%,rgba(var(--fx-amber),.85) 60%,transparent);filter:blur(.6px);box-shadow:0 0 18px 2px rgba(var(--fx-amber),.45)}
.fx-beam.is-static i{opacity:.55;left:50%}

/* ---- heading light shafts and sun dust ---- */
.gm-main h2,.gm-main h1{position:relative;isolation:isolate}
.fx-shaft{position:absolute;left:-40px;top:-60%;width:min(560px,calc(100% + 80px));height:220%;z-index:-1;pointer-events:none}
.fx-shaft b{position:absolute;inset:0;opacity:.9;background:linear-gradient(104deg,transparent 8%,rgba(var(--fx-amber),.13) 32%,rgba(var(--fx-gold),.07) 48%,transparent 72%);filter:blur(10px);transform:skewX(-14deg);transform-origin:0 100%;-webkit-mask-image:radial-gradient(ellipse at 20% 50%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse at 20% 50%,#000 25%,transparent 75%)}
.fx-dot{position:absolute;width:4px;height:4px;border-radius:50%;background:rgb(var(--fx-gold));box-shadow:0 0 8px 2px rgba(var(--fx-amber),.6);opacity:0;pointer-events:none}

/* ---- sun arc scroll tracker ---- */
.fx-arc{position:fixed;right:5px;top:21vh;z-index:25;pointer-events:none;opacity:.9}
.fx-arc svg{display:block;overflow:visible}
.fx-arc .trk{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:2 7}
.fx-arc .prg{fill:none;stroke:rgb(var(--fx-amber));stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(var(--fx-amber),.7))}
.fx-arc .sun{fill:rgb(var(--fx-gold));filter:drop-shadow(0 0 7px rgba(var(--fx-gold),.95)) drop-shadow(0 0 16px rgba(var(--fx-amber),.6))}
.fx-arc .hal{fill:rgba(var(--fx-gold),.2)}
.fx-arc .hz{stroke:rgba(255,255,255,.28);stroke-width:1}
html.gm-m .fx-arc{right:2px;top:26vh;opacity:.8}

/* ---- panel cell field (CTA and Furman cards) ---- */
.fx-cells{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:0;opacity:.9;
 background-image:linear-gradient(rgba(150,190,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(150,190,255,.07) 1px,transparent 1px);background-size:34px 34px;
 -webkit-mask-image:radial-gradient(ellipse 90% 120% at 100% 0%,#000,transparent 72%);mask-image:radial-gradient(ellipse 90% 120% at 100% 0%,#000,transparent 72%)}
.fx-cells i{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(var(--fx-gold),.28) 50%,transparent 65%);background-size:260% 100%;background-position:130% 0;mix-blend-mode:screen;opacity:.8}
.fx-cells.is-static i{background-position:40% 0;opacity:.35}

/* ---- timeline beam head, step badges ---- */
.fx-tlhead{position:absolute;left:12px;top:22px;width:20px;height:20px;margin-top:-10px;border-radius:50%;pointer-events:none;z-index:2;background:radial-gradient(circle,#fff 0 18%,rgb(var(--fx-gold)) 30%,rgba(var(--fx-amber),.5) 55%,transparent 72%);filter:drop-shadow(0 0 10px rgba(var(--fx-amber),.9))}
#tl-line{background:linear-gradient(180deg,rgba(var(--fx-gold),.95),rgba(var(--fx-amber),.55))!important;box-shadow:0 0 12px rgba(var(--fx-amber),.45)}
.fx-num{box-shadow:0 0 0 1px rgba(var(--fx-amber),.5),0 0 18px rgba(var(--fx-amber),.18)!important;border-color:rgba(var(--fx-amber),.5)!important;color:rgb(var(--fx-gold))!important}
.fx-hline{position:absolute;left:0;top:-1px;height:2px;width:100%;transform-origin:0 50%;background:linear-gradient(90deg,rgba(var(--fx-amber),.15),rgba(var(--fx-gold),.95) 50%,rgba(var(--fx-amber),.15));box-shadow:0 0 14px rgba(var(--fx-amber),.5);pointer-events:none}

/* ---- hero overlays ---- */
.fx-hero{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit}
.fx-scene{position:absolute;right:1%;top:0;width:62%;height:100%;display:block}
.fx-scene svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fx-scene svg *{transform-box:fill-box;transform-origin:center}
html.gm-m .fx-scene{left:0;right:0;width:100%;top:56px;height:min(400px,calc(100% - 270px))}
.fx-scene text{font-family:Inter,system-ui,sans-serif;fill:#f6f1e6}
.fx-hero .fx-dust{position:absolute;inset:0}
.fx-hero .fx-dot{opacity:.7}
.fx-quote-glow{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.fx-quote-glow .core{position:absolute;right:23%;top:50%;width:980px;height:980px;margin:-490px -490px 0 0;border-radius:50%;background:radial-gradient(circle,rgba(var(--fx-gold),.42),rgba(var(--fx-amber),.22) 26%,rgba(var(--fx-amber),.08) 50%,transparent 70%)}
.fx-quote-glow .rays{position:absolute;right:23%;top:50%;width:0;height:0}
.fx-quote-glow .ray{position:absolute;left:0;top:0;width:1100px;height:64px;margin-top:-32px;transform-origin:0 50%;background:linear-gradient(90deg,rgba(var(--fx-gold),.2),rgba(var(--fx-amber),.05) 50%,transparent);clip-path:polygon(0 48%,100% 0,100% 100%,0 52%);filter:blur(5px);opacity:.45}
html.gm-m .fx-quote-glow .core{right:50%;top:62%;width:760px;height:760px;margin:-380px -380px 0 0}
html.gm-m .fx-quote-glow .rays{right:50%;top:62%}
html.gm-m .fx-quote-glow .ray{width:700px}
.gm-quote>*:not(.fx-quote-glow){position:relative;z-index:1}

/* ---- image framing: every photo fills its frame with a sensible focal point ---- */
.gm-main img{max-width:100%}
.gm-main img[style*="object-fit"]{object-fit:cover}

/* ---- states ---- */
html.fx.js [data-rise],html.fx.js [data-rise][data-in]{opacity:1;transform:none;transition:none}
.fx-hide{opacity:0}
@media (prefers-reduced-motion:reduce){.fx-arc .sun{filter:none}}

/* full-bleed card photos sit a little deeper so text and glass stay readable */
.fx-bg{filter:brightness(.74) saturate(1.05)}
