/* =========================================================
   CLIENT THEME: Stage Building Inspections (film scenes)
   Only the logo colors: navy #252262, blue #1675bb, gray #868688, white.
   Transition language: sheets. A navy sheet rises over the hero photo,
   the navy carries straight into the thermal scene, and a white sheet
   rises over the navy after the services.
   ========================================================= */
@font-face{font-family:"Saira";src:url(../assets/fonts/saira.woff2) format("woff2");font-weight:100 900;font-stretch:50% 125%;font-display:swap}
@font-face{font-family:"Inter";src:url(../assets/fonts/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(../assets/fonts/mono.woff2) format("woff2");font-weight:400;font-display:swap}

:root{
  --bg:#14123d;--navy:#252262;--navy-deep:#14123d;--ink:#ffffff;--muted:#a3a7c7;
  --blue:#1675bb;--blue-l:#5aa5e0;--steel:#868688;
  --paper:#ffffff;--paper-ink:#252262;
  --accent:#252262;--accent-ink:#fff;--shade:#fff;--shade-ink:#5f6178;--bezel:#e2e4eb;
  --grain:0;
  --font-display:"Saira","Arial Narrow",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
}
.display{font-family:var(--font-display);font-weight:600;font-stretch:100%;letter-spacing:-.025em;line-height:.98}
.eyebrow{font-family:var(--font-mono);letter-spacing:.24em}
.grain{display:none}

/* ---------- SCENE 1: arrival (layers). Photo, headline, then a navy sheet rises ---------- */
.scene-arrive .stage{background:var(--navy);overflow:hidden}
.scene-arrive .ly-photo{top:-4vh;height:118vh;background:url(../assets/photos/hero-home.webp) center 42%/cover}
.scene-arrive .ly-veil{top:0;height:100vh;background:linear-gradient(90deg,rgba(20,18,61,.78) 0%,rgba(20,18,61,.42) 42%,rgba(20,18,61,0) 70%),linear-gradient(0deg,rgba(20,18,61,.7) 0%,rgba(20,18,61,0) 45%);pointer-events:none}
.ly-hero{top:auto;bottom:12vh;z-index:4;padding:0 6vw;color:#fff;max-width:980px}
.ly-hero .eyebrow{color:#cfe3f5;font-size:12px;display:flex;gap:12px;align-items:center}
.ly-hero .eyebrow::before{content:"";width:34px;height:1px;background:currentColor}
.ly-hero h1{font-size:clamp(52px,7.4vw,124px);margin:18px 0 0;font-weight:600}
.ly-hero .sub{font-size:clamp(16px,1.4vw,20px);max-width:560px;margin:20px 0 0;line-height:1.6;color:#eef1fa}
.ly-hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.ly-hero .facts{display:flex;gap:28px;flex-wrap:wrap;margin-top:34px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#d6dcef}
.ly-hero .facts span{display:flex;gap:10px;align-items:center}
.ly-hero .facts span::before{content:"";width:6px;height:6px;background:var(--blue-l);transform:rotate(45deg)}
.ly-scroll{top:auto;bottom:4vh;right:6vw;left:auto;z-index:4;font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#e6e9f5;display:flex;align-items:center;gap:12px}
.ly-scroll i{width:1px;height:46px;background:linear-gradient(#fff,transparent);animation:cue 2.2s ease infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (prefers-reduced-motion:reduce){.ly-scroll i{animation:none}}
.ly-curtain{top:0;height:100vh;z-index:6;background:var(--navy);border-radius:28px 28px 0 0;display:flex;flex-direction:column;justify-content:center;padding:0 7vw;box-shadow:0 -30px 80px rgba(13,12,41,.35)}
.ly-curtain::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(90,165,224,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(90,165,224,.07) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 70% 40%,#000,transparent 70%);border-radius:inherit;pointer-events:none}
.ly-curtain .eyebrow{color:var(--blue-l);position:relative;display:flex;gap:12px;align-items:center}
.ly-curtain .eyebrow::before{content:"";width:34px;height:1px;background:currentColor}
.ly-curtain [data-split]{position:relative;font-family:var(--font-display);font-weight:500;font-size:clamp(30px,4.2vw,68px);line-height:1.1;letter-spacing:-.02em;max-width:1180px;margin:18px 0 0;color:#fff}
.ly-curtain .creds{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,260px));gap:40px;margin-top:7vh;border-top:1px solid rgba(255,255,255,.16);padding-top:26px}
.ly-curtain .creds b{display:block;font-family:var(--font-display);font-weight:600;font-size:clamp(22px,2vw,30px);letter-spacing:-.01em}
.ly-curtain .creds span{display:block;color:#b9bcd6;font-size:14.5px;margin-top:4px}
@media (max-width:759px){
  .scene-arrive .ly-photo{background-image:url(../assets/photos/hero-home-m.webp);background-position:center 30%}
  .scene-arrive .ly-veil{background:linear-gradient(0deg,rgba(20,18,61,.92) 0%,rgba(20,18,61,.5) 55%,rgba(20,18,61,.15) 100%)}
  .ly-hero{bottom:calc(76px + 5vh)}
  .ly-hero .facts,.ly-scroll{display:none}
  .ly-curtain .creds{grid-template-columns:1fr;gap:16px;margin-top:4vh}
}

/* ---------- SCENE 2: blueprint to thermal scan (showcase, data-swap="scan") ---------- */
.scene-showcase{--sc-ink:#fff;--sc-h:min(58vh,40vw);--sc-ar:1600 / 1000;--sc-arn:1.6;--sc-scan:#ffffff;--sc-scan2:rgba(90,165,224,.75);--sc-scan-trail:rgba(90,165,224,.16)}
.sc-bg1{background-color:var(--navy);background-image:linear-gradient(rgba(90,165,224,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(90,165,224,.08) 1px,transparent 1px);background-size:56px 56px}
.sc-bg2{background:radial-gradient(ellipse at 50% 55%,#1d1b52,#0d0c29 75%)}
.scene-showcase .sc-obj{top:20vh}
.scene-showcase .sc-b{border-radius:6px;box-shadow:0 50px 120px -30px rgba(0,0,0,.7)}
.scene-showcase .sc-word{font-family:var(--font-display);font-weight:700;font-stretch:110%;font-size:clamp(64px,11vw,190px);text-transform:uppercase;letter-spacing:-.04em}
.scene-showcase .sc-word.l{left:4vw;bottom:auto;top:10vh;color:#fff}
.scene-showcase .sc-word.r{right:4vw;bottom:6vh;color:var(--blue-l)}
.scene-showcase .sc-title{top:9vh;left:5vw;max-width:28vw}
.scene-showcase .sc-title .display{font-size:clamp(30px,3.6vw,58px);margin-top:12px}
.scene-showcase .sc-title .eyebrow{color:var(--blue-l)}
.scene-showcase .sc-specs{top:auto;bottom:5vh;right:5vw;width:min(600px,46vw)}
.sc-specs dl{margin:0;display:grid;grid-template-columns:repeat(4,auto);gap:6px 22px;border-top:1px solid rgba(255,255,255,.2);padding-top:14px}
.sc-specs dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-l);grid-row:1}
.sc-specs dd{margin:0;font-family:var(--font-display);font-weight:600;font-size:clamp(18px,1.6vw,23px);grid-row:2}
.sc-specs p{font-size:14.5px;line-height:1.65;color:#c4c6dc;margin:16px 0 0}
.sc-note{position:absolute;left:5vw;bottom:5vh;z-index:3;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8f93b6;max-width:30vw}
@media (max-width:759px){
  .scene-showcase,.scene-showcase .sc-obj{--sc-h:56vw}
  .scene-showcase .sc-obj{top:31vh}
  .scene-showcase .sc-word{font-size:17vw}
  .scene-showcase .sc-word.l{top:15vh}.scene-showcase .sc-word.r{bottom:calc(76px + 15vh)}
  .scene-showcase .sc-title{top:9vh;max-width:none;right:5vw}
  .scene-showcase .sc-specs{left:5vw;right:5vw;width:auto;bottom:calc(76px + 2vh);display:block}
  .sc-specs dl{grid-template-columns:repeat(2,auto);gap:4px 16px}
  .sc-specs dt:nth-of-type(1),.sc-specs dt:nth-of-type(2){grid-row:1}.sc-specs dd:nth-of-type(1),.sc-specs dd:nth-of-type(2){grid-row:2}
  .sc-specs dt:nth-of-type(3),.sc-specs dt:nth-of-type(4){grid-row:3;margin-top:8px}.sc-specs dd:nth-of-type(3),.sc-specs dd:nth-of-type(4){grid-row:4}
  .sc-specs p,.sc-note{display:none}
}

/* ---------- SCENE 3: services (horizontal) on deep navy, real photos ---------- */
.scene-horizontal .stage{background:var(--navy-deep)}
.h-ghost{font-family:var(--font-display);font-weight:700;color:transparent;-webkit-text-stroke:1px rgba(90,165,224,.16);font-size:30vw;text-transform:uppercase;letter-spacing:-.04em}
.h-intro .eyebrow{color:var(--blue-l)}
.h-intro .display{font-size:clamp(38px,4.6vw,74px);margin-top:14px}
.h-intro p{color:#c4c6dc;line-height:1.7;font-size:16.5px;max-width:390px;margin:20px 0 28px}
.h-panel a{text-decoration:none;display:block}
.h-panel .h-img{border-radius:6px;height:min(62vh,54vw);box-shadow:0 40px 80px -40px rgba(0,0,0,.8);position:relative}
.h-panel .h-img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,12,41,.5),rgba(13,12,41,0) 40%);pointer-events:none}
.h-panel img{transition:filter .6s}
.h-panel a:hover img,.h-panel a:focus-visible img{filter:brightness(1.08)}
.h-panel figcaption{font-family:var(--font-mono);letter-spacing:.16em;color:#fff;font-size:12.5px;margin-top:16px;border-top:1px solid rgba(255,255,255,.16);padding-top:14px}
.h-panel figcaption span:last-child{color:var(--blue-l)}
.h-end{flex:0 0 auto;width:min(36vw,440px);padding-right:6vw}
.h-end .display{font-size:clamp(30px,3.4vw,54px)}
.h-end p{color:#c4c6dc;margin:16px 0 26px}
@media (max-width:759px){.h-panel .h-img{width:80vw;height:auto;aspect-ratio:4/5}.h-end{width:80vw}}

/* ---------- reduced motion and light tier ---------- */
.is-reduced .scene-arrive .stage{height:auto;padding:0;display:flex;flex-direction:column}
.is-reduced .scene-arrive .ly{position:relative;inset:auto;transform:none!important}
.is-reduced .scene-arrive .ly-photo,.is-reduced .scene-arrive .ly-veil{position:absolute;top:0;left:0;right:0;height:100vh}
.is-reduced .scene-arrive .ly-hero{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;padding:18vh 6vw 12vh;max-width:none}
.is-reduced .scene-arrive .ly-scroll{display:none}
.is-reduced .scene-arrive .ly-curtain{height:auto;padding:12vh 7vw}
.is-reduced .scene-showcase .sc-title{order:-1}
.is-reduced .scene-showcase .stage{display:grid;gap:24px;padding:12vh 6vw;align-content:start}
.is-reduced .scene-showcase .sc-obj{position:relative;left:auto;top:auto;margin:0 auto;height:auto;width:min(900px,88vw);aspect-ratio:1600/1000}
.is-reduced .scene-showcase .sc-a{display:none}
.is-reduced .scene-showcase .sc-b{opacity:1;visibility:visible}
.is-reduced .scene-showcase .sc-title,.is-reduced .scene-showcase .sc-specs,.is-reduced .sc-note{position:relative;inset:auto;max-width:900px;width:auto;margin:0 auto}
.scene{color:#fff}