
:root{
  --bg:#081730;
  --bg-deep:#061225;
  --bg-soft:#0c2344;
  --card:rgba(255,255,255,.06);
  --card-2:rgba(255,255,255,.035);
  --line:rgba(255,255,255,.10);
  --line-gold:rgba(212,162,74,.28);
  --gold:#d4a24a;
  --gold-2:#f0c16d;
  --ink:#f6f0e6;
  --muted:#c8d2e0;
  --shadow:0 22px 55px rgba(0,0,0,.26);
  --radius:28px;
  --radius-sm:18px;
  --wrap:min(1180px, calc(100% - 2rem));
  --serif: Georgia, 'Times New Roman', serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font:16px/1.6 Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background:
    radial-gradient(circle at 8% 0%, rgba(212,162,74,.10), transparent 24%),
    radial-gradient(circle at 100% 12%, rgba(54,114,194,.18), transparent 26%),
    linear-gradient(180deg, #07142a 0%, #081730 50%, #0a1b36 100%);
  position:relative;
  overflow-x:hidden;
}
body::before,
body::after{
  content:"";
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:-2;
}
body::before{
  width:44vw;height:44vw;left:-12vw;top:12vh;border-radius:50%;
  background:radial-gradient(circle, rgba(212,162,74,.14), transparent 60%);
  filter:blur(12px);
}
body::after{
  width:50vw;height:50vw;right:-10vw;top:22vh;border-radius:50%;
  background:radial-gradient(circle, rgba(61,119,205,.18), transparent 62%);
  filter:blur(18px);
}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
button,input,textarea{font:inherit}
.wrap{width:var(--wrap);margin:0 auto}
.narrow{width:min(860px, calc(100% - 2rem));margin:0 auto}
.top-gap{margin-top:28px}
.skip-link{position:absolute;left:12px;top:-40px;background:#fff;color:#000;padding:.6rem .9rem;border-radius:999px;z-index:100}
.skip-link:focus{top:12px}

.site-header{
  position:sticky;top:0;z-index:40;
  background:linear-gradient(180deg, rgba(6,15,32,.92), rgba(6,15,32,.68));
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.nav{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand-image{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0}
.brand-image img{width:clamp(290px,32vw,392px);height:auto;filter:drop-shadow(0 12px 28px rgba(0,0,0,.30))}
.menu{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.menu a{color:var(--muted);padding:.72rem .86rem;border-radius:999px;font-weight:600;font-size:.96rem;transition:.2s ease}
.menu a:hover{background:rgba(255,255,255,.05);color:var(--ink)}
.menu .cta-nav{background:linear-gradient(135deg, var(--gold-2), var(--gold));color:#10203e}
.menu-toggle{display:none;width:48px;height:48px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);align-items:center;justify-content:center;gap:4px;flex-direction:column;cursor:pointer}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--ink);border-radius:999px}

.hero,.page-hero{position:relative;overflow:hidden}
.hero-home{padding:6rem 0 4.8rem}
.hero-backdrop{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(6,18,38,.94) 0%, rgba(6,18,38,.84) 46%, rgba(6,18,38,.54) 100%),
    radial-gradient(circle at 72% 44%, rgba(212,162,74,.16), transparent 26%),
    url('assets/hero-remote-presence.png') right center / cover no-repeat;
  opacity:1;
}
.hero-home::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(8,23,48,.08), rgba(8,23,48,.42) 72%, rgba(8,23,48,.9));
  pointer-events:none;
}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.06fr .94fr;gap:2rem;align-items:center}
.hero-copy h1,.page-hero h1,h2{
  margin:0;
  font-family:var(--serif);
  line-height:.98;
  letter-spacing:-.02em;
}
.hero-copy h1,.page-hero h1{font-size:clamp(3.15rem, 7vw, 5.5rem);max-width:11ch}
h2{font-size:clamp(2rem,4vw,3.5rem)}
.eyebrow{margin:0 0 1rem;color:var(--gold);font-size:.76rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.lead,.section-lead{color:var(--muted);font-size:clamp(1.02rem,2vw,1.16rem)}
.actions{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.7rem 0 1.35rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:.92rem 1.2rem;border-radius:14px;font-weight:800;transition:transform .2s ease, background .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg, var(--gold-2), var(--gold));color:#0b1c35;box-shadow:0 14px 30px rgba(212,162,74,.18)}
.btn-ghost{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.cap-row,.story-points{display:flex;flex-wrap:wrap;gap:.65rem}
.cap-row span,.story-points span{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.62rem .88rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);color:#edf2fb;font-size:.93rem
}
.hero-panel{
  position:relative;padding:1rem;border-radius:34px;background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow)
}
.hero-panel img{width:100%;border-radius:24px;height:auto;object-fit:cover}
.hero-panel::before{content:"";position:absolute;inset:-1px;border-radius:34px;background:linear-gradient(135deg, rgba(212,162,74,.4), transparent 22%, transparent 78%, rgba(74,126,211,.25));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px;pointer-events:none}
.hero-panel-tag{position:absolute;left:1.6rem;bottom:1.6rem;padding:.68rem .92rem;border-radius:999px;background:rgba(8,23,48,.78);border:1px solid rgba(255,255,255,.12);font-size:.9rem;font-weight:800}

.section{padding:5.4rem 0;position:relative;border-bottom:1px solid rgba(255,255,255,.04)}
.section-surface::before{
  content:"";position:absolute;inset:1.2rem 1rem;border-radius:34px;z-index:-1;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.05)
}
.section-accent::after{
  content:"";position:absolute;right:8%;top:10%;width:320px;height:320px;border-radius:50%;z-index:-1;
  background:radial-gradient(circle, rgba(212,162,74,.10), transparent 60%);filter:blur(6px)
}
.truth-grid,.feature-grid,.application-grid,.steps,.mech,.value-pairs,.moments{display:grid;gap:1rem}
.truth-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.application-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.story-grid,.deployment-grid,.video-grid,.two-col,.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.card,.truth,.feature-card,.application-card,.story-card,.story-copy,.visual-card,.video-card,.pain,.gain,.roi,.pilot-box,.quote,.step{
  background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.03));
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)
}
.truth,.feature-card,.card,.step,.pain,.gain{padding:1.5rem}
.truth .n,.step .n{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;margin-bottom:1rem;background:rgba(212,162,74,.12);border:1px solid rgba(212,162,74,.28);color:var(--gold);font-weight:800}
.feature-icon{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:50%;margin-bottom:1rem;background:rgba(212,162,74,.12);border:1px solid rgba(212,162,74,.28);color:var(--gold);font-weight:900}
.card h3,.truth h3,.feature-card h3,.application-card h3,.step h3,.pain h3,.gain h3{margin:.1rem 0 .55rem;font-size:1.16rem}
.truth p,.feature-card p,.application-card p,.card p,.step p,.story-copy p,.kit-list li,.li span,.small,.fineprint,.muted,.quote span,.page-meta{color:var(--muted)}
.application-card.primary{grid-column:span 2;background:linear-gradient(135deg, rgba(212,162,74,.10), rgba(255,255,255,.04), rgba(38,89,159,.12))}
.link{display:inline-flex;margin-top:12px;color:var(--gold-2);font-weight:800}
.story-card,.visual-card,.video-card{padding:1rem}
.story-card img,.visual-card img{width:100%;height:auto;border-radius:22px;object-fit:cover}
.story-copy{padding:2rem}
.video-card video{width:100%;border-radius:22px;background:#000}
.kit-list{margin:1.25rem 0 0;padding-left:1.2rem;display:grid;gap:.8rem}
.kit-list li::marker{color:var(--gold)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.gallery-card{margin:0;padding:1rem;background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.03));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.gallery-card img{width:100%;height:auto;border-radius:18px;object-fit:contain}
.gallery-card figcaption{margin-top:.75rem;color:var(--muted);font-size:.95rem}

.pilot-box{padding:1.8rem 2rem;display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center;border:1px solid var(--line-gold);background:linear-gradient(135deg, rgba(212,162,74,.10), rgba(255,255,255,.03), rgba(33,79,141,.08))}
.footer{padding:1.25rem 0 2rem;border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-logo img{width:clamp(230px,24vw,300px)}
.fineprint{margin-top:.4rem;font-size:.92rem}

.page-hero{padding:7rem 0 4rem}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(6,18,38,.94), rgba(6,18,38,.78) 48%, rgba(6,18,38,.54)),
    radial-gradient(circle at 72% 40%, rgba(212,162,74,.16), transparent 28%);
}
.page-hero-support::after,.page-hero-commissioning::after{
  content:"";position:absolute;inset:0;opacity:.26;background-position:right center;background-size:cover;background-repeat:no-repeat
}
.page-hero-support::after{background-image:url('assets/hero-expertise.png')}
.page-hero-commissioning::after{background-image:url('assets/hero-be-there.png')}
.page-hero-inner{position:relative;z-index:1}
.doc-label{display:inline-flex;padding:.46rem .74rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:.84rem;font-weight:800;color:#fff}
.page-meta{margin-top:1rem}
.li{display:grid;grid-template-columns:auto 1fr;gap:.8rem;align-items:flex-start;padding:.65rem 0;border-bottom:1px solid rgba(255,255,255,.06)}
.li:last-child{border-bottom:none}
.m{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(212,162,74,.12);border:1px solid rgba(212,162,74,.28);color:var(--gold);font-weight:900}
.roi{padding:1.2rem 1.2rem 1rem}
.roi-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.roi-top span{color:var(--muted);font-size:.92rem}
.roi table{width:100%;border-collapse:collapse}
.roi td{padding:.8rem .5rem;border-top:1px solid rgba(255,255,255,.07);vertical-align:top}
.roi tr:first-child td{border-top:none}
.roi .total td{font-weight:800;color:var(--ink)}
.input-mini{width:90px;max-width:100%;padding:.6rem .7rem;border-radius:10px;background:rgba(8,23,48,.8);border:1px solid rgba(255,255,255,.12);color:var(--ink)}
.quote{padding:2rem;text-align:center;font-family:var(--serif)}
.quote p{margin:0 0 .8rem;font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.2;color:var(--ink)}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease}
.reveal.in-view{opacity:1;transform:none}
.delay-1{transition-delay:.08s}.delay-2{transition-delay:.16s}.delay-3{transition-delay:.24s}

@media (max-width: 1100px){
  .hero-grid,.story-grid,.deployment-grid,.video-grid,.two-col,.split,.pilot-box{grid-template-columns:1fr}
  .truth-grid,.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .application-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .application-card.primary{grid-column:span 1}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .menu{position:fixed;right:1rem;top:84px;flex-direction:column;align-items:stretch;min-width:230px;padding:.8rem;background:rgba(7,18,36,.98);border:1px solid rgba(255,255,255,.08);border-radius:18px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(-10px);transition:.24s ease}
  .menu.open{opacity:1;pointer-events:auto;transform:translateY(0)}
  .menu-toggle{display:flex}
}
@media (max-width: 760px){
  .section{padding:4.4rem 0}
  .nav{min-height:82px}
  .brand-image img{width:min(280px, 68vw)}
  .hero-home{padding:5rem 0 4.1rem}
  .truth-grid,.feature-grid,.application-grid,.gallery-grid,.moments,.mech,.value-pairs,.steps{grid-template-columns:1fr}
  .hero-copy h1,.page-hero h1{font-size:clamp(2.6rem, 12vw, 4.2rem)}
  .actions{flex-direction:column;align-items:stretch}
  .btn{width:100%}
  .cap-row span,.story-points span{font-size:.89rem}
  .section-surface::before{inset:.7rem .55rem;border-radius:24px}
  .pilot-box{padding:1.3rem}
  .footer-logo img{width:220px}
}




/* Demo-only update: richer subpage hero backgrounds without embedded text overlap */
.page-hero{isolation:isolate;background:#061226;min-height:560px;display:flex;align-items:center}
.page-hero::before{background:
  linear-gradient(90deg, rgba(4,14,31,.99) 0%, rgba(5,16,35,.95) 38%, rgba(5,16,35,.68) 62%, rgba(5,16,35,.88) 100%),
  radial-gradient(circle at 18% 20%, rgba(212,162,74,.18), transparent 28%),
  radial-gradient(circle at 82% 62%, rgba(72,131,214,.24), transparent 34%)!important;z-index:-2}
.page-hero-support::after,.page-hero-commissioning::after{content:"";position:absolute;inset:0;display:block!important;z-index:-3;opacity:.76;background-position:right center;background-size:cover;background-repeat:no-repeat;filter:saturate(1.08) contrast(1.04)}
.page-hero-support::after{background-image:url('assets/support-hero-bg.jpg')!important}
.page-hero-commissioning::after{background-image:url('assets/commissioning-hero-bg.jpg')!important}
.page-hero::after{mask-image:linear-gradient(90deg, transparent 0 34%, #000 56%, #000 100%);-webkit-mask-image:linear-gradient(90deg, transparent 0 34%, #000 56%, #000 100%)}
.page-hero-inner{width:100%}
.page-hero .narrow{margin-left:0;max-width:820px;background:linear-gradient(135deg, rgba(3,16,31,.72), rgba(3,16,31,.46));border:1px solid rgba(255,255,255,.12);border-radius:30px;padding:1.45rem 1.65rem;backdrop-filter:blur(14px);box-shadow:0 30px 90px rgba(0,0,0,.28)}
.page-hero .narrow::before{content:"";position:absolute;inset:-1px;border-radius:30px;padding:1px;background:linear-gradient(135deg, rgba(212,162,74,.46), rgba(255,255,255,.06), rgba(74,126,211,.32));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.page-hero .doc-label{box-shadow:0 12px 28px rgba(0,0,0,.16)}
@media(max-width:900px){.page-hero{min-height:auto}.page-hero::before{background:linear-gradient(180deg, rgba(4,14,31,.95), rgba(4,14,31,.78)),radial-gradient(circle at 50% 15%, rgba(212,162,74,.18), transparent 35%)!important}.page-hero::after{opacity:.26;mask-image:none;-webkit-mask-image:none}.page-hero .narrow{padding:1.15rem;border-radius:24px}}



/* v15 Applications section: text-only cards, no application imagery */
.application-card{padding:1.5rem;display:block;overflow:visible}
.application-card.primary{background:linear-gradient(135deg, rgba(212,162,74,.10), rgba(255,255,255,.04), rgba(38,89,159,.12))}
.application-card .eyebrow{margin-bottom:.45rem}
.application-card h3{margin:.1rem 0 .55rem}
.application-card .link{margin-top:12px}
