:root{
  --ink:#17130f;
  --ink-soft:#5b5144;
  --ivory:#f7f2e8;
  --ivory-2:#eee5d7;
  --gold:#bf8e31;
  --gold-light:#efd486;
  --gold-dark:#88621f;
  --atlas:#2abec8;
  --images:#9b63d2;
  --assets:#40bd70;
  --impact:#319b65;
  --fitness:#d45454;
  --tech:#d7a43d;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#f4eee4;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
button{font:inherit;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
sup{font-size:.28em;vertical-align:super}
#cursorGlow{position:fixed;z-index:50;width:420px;height:420px;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%);opacity:.10;background:radial-gradient(circle,rgba(239,212,134,.55),rgba(239,212,134,.08) 35%,transparent 70%)}

/* HEADER */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;height:102px;padding:0 4.2%;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(rgba(255,255,255,.90),rgba(249,245,237,.94)),url("assets/backgrounds/marble-light.jpg") center/cover;border-bottom:1px solid rgba(191,142,49,.48);box-shadow:0 8px 30px rgba(71,49,18,.08);backdrop-filter:blur(12px)}
.brand{border:0;background:none;display:flex;align-items:center;gap:14px;cursor:pointer;padding:0}
.brand-helmet{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(127,83,18,.18))}
.brand-copy{display:flex;flex-direction:column;align-items:flex-start;font-family:Georgia,"Times New Roman",serif}
.brand-name{font-size:33px;line-height:1;letter-spacing:2px}
.brand-sub{margin-top:7px;font-size:10px;letter-spacing:6px;color:var(--gold-dark)}
.desktop-nav{display:flex;align-items:center;gap:48px}
.desktop-nav button{border:0;background:none;cursor:pointer;padding:18px 0;position:relative;font-family:Georgia,"Times New Roman",serif;font-size:12px;letter-spacing:3.2px}
.desktop-nav button::after{content:"";position:absolute;height:1px;left:50%;right:50%;bottom:5px;background:var(--gold);transition:.25s}
.desktop-nav button:hover::after{left:0;right:0}
.nav-divisions{position:relative}
.dropdown{position:absolute;top:54px;left:50%;width:245px;padding:8px;transform:translateX(-50%) translateY(-8px);background:rgba(251,247,239,.98);border:1px solid rgba(191,142,49,.35);box-shadow:0 16px 45px rgba(76,54,22,.14);opacity:0;visibility:hidden;transition:.22s}
.nav-divisions.open .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dropdown button{display:block;width:100%;text-align:left;padding:14px;border-bottom:1px solid rgba(110,84,43,.10);font-family:Arial,sans-serif;font-size:11px}
.mobile-menu{display:none;border:0;background:none;font-size:27px;cursor:pointer}
.mobile-drawer{display:none}

/* ROUTES */
.page{display:none}
.page.active{display:block}

/* HERO */
.hero{
  position:relative;
  height:calc(100vh - 102px);
  min-height:690px;
  margin-top:102px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#d9c8a5;
}

.hero-art{
  position:absolute;
  inset:-2%;
  background:
    url("assets/backgrounds/hero-gateway-gold.jpg")
    center 58% / cover no-repeat;

  transform:scale(1.03);
  transition:transform .12s linear;
  will-change:transform;

  filter:
    brightness(.92)
    contrast(1.05)
    saturate(.92);
}

.hero-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      180deg,
      rgba(100,63,9,.05),
      rgba(65,37,1,.03) 38%,
      rgba(55,31,2,.18) 100%
    ),
    radial-gradient(
      ellipse at 50% 48%,
      rgba(255,255,255,.06),
      transparent 48%
    );
}

.portal-glow{
  position:absolute;
  top:0;
  bottom:0;
  width:14%;
  opacity:.22;
  filter:blur(40px);
  pointer-events:none;
}

.portal-glow-left{
  left:0;
  background:linear-gradient(
    90deg,
    rgba(255,223,143,.45),
    transparent
  );
}

.portal-glow-right{
  right:0;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,223,143,.45)
  );
}

.hero-content{
  position:relative;
  z-index:5;
  width:min(960px,91vw);
  text-align:center;
  color:white;
  transform:translateY(54px);
}

.latin{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:13px;
  letter-spacing:6px;
  text-shadow:0 2px 12px rgba(61,39,8,.52);
}

.ornament{
  width:310px;
  margin:17px auto 16px;
  display:flex;
  align-items:center;
  gap:13px;
  color:var(--gold-light);
}

.ornament span{
  height:1px;
  flex:1;
  background:linear-gradient(
    90deg,
    transparent,
    var(--gold-light)
  );
}

.ornament span:last-child{
  background:linear-gradient(
    90deg,
    var(--gold-light),
    transparent
  );
}

.hero h1{
  margin:26px 0 8px;
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  font-size:clamp(88px,11.4vw,155px);
  line-height:.88;
  letter-spacing:-4px;
  color:#faf7ef;

  text-shadow:
    0 1px 0 white,
    0 2px 0 rgba(159,112,29,.8),
    0 8px 18px rgba(74,45,7,.38),
    0 20px 45px rgba(54,35,8,.22);
}

.industry-title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin-top:8px;

  font-family:Georgia,"Times New Roman",serif;
  font-size:24px;
  letter-spacing:10px;

  color:#f0c96e;

  text-shadow:
    0 2px 4px rgba(70,40,5,.65),
    0 0 12px rgba(112,69,9,.45);
}

.industry-title span{
  width:70px;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    var(--gold-light),
    transparent
  );
}

.hero-statement{
  margin:46px 0 0;

  font-family:Georgia,"Times New Roman",serif;
  font-size:20px;
  line-height:1.52;
  letter-spacing:5.5px;

  color:#fff;

  text-shadow:
    0 2px 8px rgba(45,25,3,.78),
    0 0 14px rgba(70,40,5,.38);
}

.tiny-diamond{
  margin:12px auto 15px;
  color:var(--gold-light);
}

.ecosystem-button{
  width:315px;
  max-width:78vw;
  height:50px;
  border:1px solid #f2d58a;
  background:
    linear-gradient(
      180deg,
      rgba(95,58,8,.67),
      rgba(67,38,2,.70)
    );
  color:#fff;

  clip-path:
    polygon(
      5% 0,
      95% 0,
      100% 50%,
      95% 100%,
      5% 100%,
      0 50%
    );

  box-shadow:
    0 0 22px rgba(236,196,98,.72),
    inset 0 0 24px rgba(255,231,170,.14);

  cursor:pointer;
  letter-spacing:3px;
  transition:.25s;
}

.ecosystem-button b{
  margin-left:25px;
  color:#f8d77d;
  font-size:24px;
  font-weight:300;
}

.ecosystem-button:hover{
  transform:translateY(-2px);

  box-shadow:
    0 0 34px rgba(236,196,98,.9),
    inset 0 0 30px rgba(255,239,198,.18);
}
/* DIVISIONS */
.divisions{min-height:600px;padding:36px 4.5% 64px;background:linear-gradient(rgba(252,249,243,.90),rgba(239,230,216,.95)),url("assets/backgrounds/marble-light.jpg") center/cover;border-top:1px solid rgba(191,142,49,.42)}
.section-title{text-align:center}
.section-title h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:38px;font-weight:400;letter-spacing:2px;color:#966d20}
.section-rule{width:245px;margin:7px auto 8px;display:flex;align-items:center;gap:10px;color:var(--gold)}
.section-rule span{height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.section-title p{font-family:Georgia,"Times New Roman",serif;font-size:11px;letter-spacing:4px;color:#4c4439}
.division-grid{max-width:1160px;margin:34px auto 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;align-items:start}
.division-card{--accent:var(--gold);border:0;background:none;cursor:pointer;text-align:center;padding:0 4px;color:#2c251d;transition:.24s}
.division-card.atlas{--accent:var(--atlas)}.division-card.images{--accent:var(--images)}.division-card.assets{--accent:var(--assets)}.division-card.impact{--accent:var(--impact)}.division-card.fitness{--accent:var(--fitness)}.division-card.tech{--accent:var(--tech)}
.hex-frame{aspect-ratio:1.08/1;width:100%;max-width:185px;margin:0 auto 17px;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);display:grid;place-items:center;background:linear-gradient(145deg,#f1d48c,#a57420 45%,#f3dc9d 72%,#8e631b);padding:3px;filter:drop-shadow(0 9px 10px rgba(97,67,18,.15));transition:.28s}
.hex-frame::before{content:"";position:absolute}
.hex-frame img{width:calc(100% - 6px);height:calc(100% - 6px);padding:25%;object-fit:contain;clip-path:inherit;background:radial-gradient(circle at 50% 44%,rgba(255,255,255,.98),rgba(247,241,231,.92) 62%,rgba(225,211,187,.96));transition:.28s}
.division-card h3{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:15px;font-weight:400;white-space:nowrap}
.division-card p{margin:8px 0 0;font-size:9px;letter-spacing:.8px;color:#9a7026}
.division-card:hover{transform:translateY(-6px)}
.division-card:hover .hex-frame{filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 60%,transparent)) drop-shadow(0 16px 14px rgba(78,54,19,.14))}
.division-card:hover .hex-frame img{filter:drop-shadow(0 0 11px var(--accent));}
.division-card:hover p{color:var(--accent)}

/* INTERIOR */
.interior,.division-page{min-height:100vh;padding-top:102px;background:radial-gradient(circle at 50% 5%,rgba(255,255,255,.96),transparent 38%),linear-gradient(180deg,#fbf8f2,#eee5d7)}
.interior-hero{min-height:550px;padding:125px 8% 70px;display:flex;flex-direction:column;justify-content:flex-end;border-bottom:1px solid rgba(191,142,49,.25);background:linear-gradient(rgba(255,255,255,.72),rgba(247,241,231,.86)),url("assets/backgrounds/marble-light.jpg") center/cover}
.interior-hero small,.division-page small{color:#997024;letter-spacing:5px}
.interior-hero h1{margin:20px 0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(64px,9vw,130px);line-height:.9;font-weight:400}
.interior-hero p{color:#655b4e;letter-spacing:3px}
.interior-body{max-width:900px;padding:75px 8% 120px}
.interior-body h2{font-family:Georgia,"Times New Roman",serif;font-size:34px;font-weight:400}
.interior-body p{color:#6a6054;line-height:1.9}
.principle-grid{max-width:1180px;margin:auto;padding:70px 6% 110px;display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.principle-grid article{padding:38px;background:rgba(255,255,255,.62);border:1px solid rgba(191,142,49,.28);box-shadow:0 12px 35px rgba(91,67,28,.06)}
.principle-grid b{font-family:Georgia,serif;font-size:42px;color:#d1ae67;font-weight:400}
.principle-grid h2{font-family:Georgia,serif;font-weight:400;letter-spacing:3px}
.principle-grid p{color:#6b6257;line-height:1.7}
.initiative-grid{max-width:1180px;margin:auto;padding:70px 6% 110px;display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.initiative-grid article{padding:38px;background:rgba(255,255,255,.62);border:1px solid rgba(191,142,49,.28);box-shadow:0 12px 35px rgba(91,67,28,.06)}
.initiative-grid b{font-family:Georgia,serif;font-size:42px;color:#d1ae67;font-weight:400}
.initiative-grid h2{font-family:Georgia,serif;font-weight:400;letter-spacing:3px}
.initiative-grid p{color:#6b6257;line-height:1.7}
.team-intro{max-width:900px;padding:75px 8% 120px}
.team-intro h2{font-family:Georgia,"Times New Roman",serif;font-size:34px;font-weight:400}
.team-intro p{color:#6a6054;font-size:17px;line-height:1.9}

.division-page{padding:210px 8% 120px}
.division-page-content{max-width:1050px}
.division-page h1{margin:20px 0 0;font-family:Georgia,serif;font-size:clamp(70px,10vw,145px);line-height:.9;font-weight:400}
.division-page h2{letter-spacing:5px;font-weight:400;color:#6b5d4b}
.division-line{width:120px;height:1px;margin:35px 0;background:var(--gold)}
.division-page p{max-width:690px;color:#6e6458;font-size:17px;line-height:1.8}
.division-page a{display:inline-block;margin-top:30px;color:#966d20;text-decoration:none}
.atlas-page small,.atlas-page a{color:var(--atlas)}.images-page small,.images-page a{color:var(--images)}.assets-page small,.assets-page a{color:var(--assets)}.impact-page small,.impact-page a{color:var(--impact)}.fitness-page small,.fitness-page a{color:var(--fitness)}.tech-page small,.tech-page a{color:var(--tech)}
.contact-grid{max-width:1100px;margin:auto;padding:80px 5% 120px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(191,142,49,.17)}
.contact-grid a{padding:30px;background:rgba(255,255,255,.74);color:#2d271f;text-decoration:none;font-family:Georgia,serif;font-size:18px}
.contact-grid small{display:block;margin-bottom:10px;color:#997024;font-family:Arial,sans-serif;font-size:9px;letter-spacing:4px}

/* SPAR10 TECH — CLIENT SERVICE PAGE */
.tech-page{min-height:100vh;padding-top:102px;background:#f8f4eb;color:#27221c}
.tech-hero{position:relative;min-height:650px;padding:80px 7%;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:6%;overflow:hidden;border-bottom:1px solid rgba(191,142,49,.34);background:linear-gradient(90deg,transparent 0 58%,rgba(176,126,36,.055) 58% 59%,transparent 59% 66%,rgba(176,126,36,.045) 66% 67%,transparent 67%),radial-gradient(circle at 22% 35%,rgba(255,255,255,.96),transparent 35%),linear-gradient(rgba(255,255,255,.70),rgba(246,239,226,.82)),url("assets/backgrounds/marble-light.jpg") center/cover}
.tech-hero::after{content:"";position:absolute;right:-7%;top:4%;width:48%;height:92%;pointer-events:none;opacity:.32;background:repeating-linear-gradient(60deg,transparent 0 52px,rgba(185,134,45,.15) 53px,transparent 54px 106px),repeating-linear-gradient(-60deg,transparent 0 52px,rgba(185,134,45,.10) 53px,transparent 54px 106px);mask-image:radial-gradient(circle,#000,transparent 72%)}
.tech-hero-copy{position:relative;z-index:2}.tech-hero small,.tech-feature small{color:#a77420;letter-spacing:3px}.tech-hero h1{margin:22px 0 18px;font-family:Georgia,serif;font-size:clamp(58px,7vw,108px);line-height:.9;font-weight:400}.tech-hero h1 sup{font-size:.16em;vertical-align:top}.tech-hero h2{max-width:690px;margin:0 0 25px;font-family:Georgia,serif;font-size:clamp(30px,3.2vw,52px);line-height:1.2;font-weight:400}.tech-hero p{max-width:680px;margin-bottom:32px;color:#5f5549;font-size:18px;line-height:1.8}.tech-capabilities{margin-top:25px;color:#93681f;font-size:10px;letter-spacing:2px}.tech-capabilities b{margin:0 8px;color:#c99b45}
.tech-button{display:inline-flex!important;align-items:center;justify-content:center;min-width:190px;padding:17px 26px!important;border:1px solid #b9862d;background:rgba(255,253,247,.72);color:#996a1d!important;font-family:Georgia,serif;font-size:13px;letter-spacing:2px;text-decoration:none;cursor:pointer;transition:.25s}.tech-button:hover{transform:translateY(-2px);background:#fff;box-shadow:0 9px 24px rgba(91,63,18,.14)}
.tech-artifact{position:relative;z-index:1;width:min(470px,43vw);aspect-ratio:1;margin:auto;display:grid;place-items:center;clip-path:polygon(25% 3%,75% 3%,98% 50%,75% 97%,25% 97%,2% 50%);background:linear-gradient(145deg,#fff0b4 0%,#895b10 20%,#f4d477 43%,#65410b 70%,#e8bf5f 100%);padding:9px;filter:drop-shadow(0 29px 29px rgba(35,24,8,.34)) drop-shadow(0 0 18px rgba(190,135,36,.20))}.tech-artifact::before{content:"";position:absolute;inset:10px;clip-path:inherit;background:radial-gradient(circle at center,rgba(223,173,69,.25),transparent 30%),repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 2px,transparent 2px 7px),repeating-linear-gradient(90deg,transparent 0 24px,rgba(231,194,113,.11) 25px,transparent 26px 48px),repeating-linear-gradient(0deg,transparent 0 24px,rgba(231,194,113,.08) 25px,transparent 26px 48px),linear-gradient(145deg,#080909,#292821 52%,#040505);box-shadow:inset 0 0 42px #000,inset 0 0 14px rgba(232,188,91,.22)}.tech-artifact::after{content:"";position:absolute;width:46%;aspect-ratio:1;clip-path:inherit;background:radial-gradient(circle at 42% 35%,#f8da83,#be8423 42%,#6e470c 85%);box-shadow:0 0 0 8px rgba(15,15,13,.84),0 0 0 11px #c6973e,0 13px 20px rgba(0,0,0,.55);filter:drop-shadow(0 0 16px rgba(223,171,67,.35))}.tech-artifact span{position:relative;z-index:2;color:#fff0b3;font:700 clamp(32px,4vw,62px)/1 Consolas,monospace;text-shadow:0 0 9px rgba(255,224,145,.82),0 0 22px rgba(205,145,37,.55)}
.tech-outcomes{min-height:70px;padding:16px 5%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:20px;border-bottom:1px solid rgba(191,142,49,.32);background:linear-gradient(90deg,#171816,#292820 50%,#171816);color:#f0d58e;font-family:Georgia,serif;font-size:12px;letter-spacing:2px;box-shadow:inset 0 1px 0 rgba(244,211,130,.18)}.tech-outcomes b{color:#bd8e35;font-weight:400}
.tech-section{padding:76px 5.5%}.tech-section-title{text-align:center}.tech-section-title h2{margin:0;font-family:Georgia,serif;font-size:clamp(34px,4vw,56px);font-weight:400;letter-spacing:2px}.tech-service-grid{max-width:1380px;margin:42px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.tech-service-grid article{position:relative;padding:38px 26px 34px;border:1px solid rgba(191,142,49,.34);background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(246,239,225,.68));box-shadow:0 14px 35px rgba(78,55,22,.09),inset 0 1px 0 #fff;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}.tech-service-grid article::after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:2px;background:linear-gradient(90deg,transparent,#bf8e31,transparent);opacity:.25;transition:.28s}.tech-service-grid article:hover{transform:translateY(-7px);border-color:rgba(185,134,45,.68);box-shadow:0 22px 42px rgba(78,55,22,.15),0 0 20px rgba(198,151,65,.10)}.tech-service-grid article:hover::after{opacity:.85}.tech-icon{width:76px;height:68px;margin:0 auto 24px;display:grid;place-items:center;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#fffdf6,#efe1bf);color:#a36d16;font:27px Georgia,serif;box-shadow:inset 0 0 0 1px #b98328,0 8px 18px rgba(100,69,20,.10);transition:.28s}.tech-service-grid article:hover .tech-icon{color:#7d510d;box-shadow:inset 0 0 0 1px #c79b48,0 0 18px rgba(198,151,65,.30)}.tech-service-grid h3{text-align:center;font-family:Georgia,serif;font-size:20px;line-height:1.25;font-weight:400}.tech-service-grid ul{padding:0;list-style:none}.tech-service-grid li{position:relative;margin:12px 0;padding-left:18px;color:#655c50;font-size:13px;line-height:1.45}.tech-service-grid li::before{content:"◇";position:absolute;left:0;color:#b98328}
.tech-feature{padding:75px 7%;display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:7%;border-block:1px solid rgba(191,142,49,.24);background:linear-gradient(rgba(255,255,255,.68),rgba(245,238,225,.74)),url("assets/backgrounds/marble-light.jpg") center/cover}.tech-feature h2{font-family:Georgia,serif;font-size:clamp(34px,4vw,58px);font-weight:400}.tech-feature p{max-width:520px;color:#665c50;line-height:1.75}.project-preview{max-width:720px;width:100%;margin:auto;border:10px solid #252525;border-bottom-width:22px;border-radius:10px;background:#111;box-shadow:0 22px 35px rgba(38,27,11,.24)}.preview-bar{height:24px;padding:7px;background:#eee9df}.preview-bar i{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:50%;background:#b88a3c}.preview-scene{height:300px;padding:40px;display:flex;flex-direction:column;align-items:flex-start;color:#f5d98d;background:linear-gradient(90deg,rgba(21,13,3,.72),rgba(83,54,10,.18)),radial-gradient(circle at 70% 35%,#c89a42,#3c2b11 38%,#100d08 75%)}.preview-scene strong{font:52px Georgia,serif}.preview-scene span{letter-spacing:6px}.preview-scene em{margin-top:auto;color:#fff7e5;font:normal 28px Georgia,serif}
.tech-process{background:rgba(255,255,255,.52)}.tech-process-grid{max-width:1380px;margin:42px auto 0;display:grid;grid-template-columns:repeat(5,1fr)}.tech-process-grid article{position:relative;padding:10px 24px 25px;text-align:center;border-right:1px solid rgba(191,142,49,.30)}.tech-process-grid article:last-child{border:0}.tech-process-grid b{width:54px;height:48px;margin:auto;display:grid;place-items:center;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:#fff;border:1px solid #b9862d;color:#a6721d;font:18px Georgia,serif}.tech-process-grid h3{font-family:Georgia,serif;font-weight:400;letter-spacing:1px}.tech-process-grid p{color:#665c50;font-size:13px;line-height:1.55}
.tech-cta{margin:0 2% 50px;padding:70px 5%;text-align:center;border:1px solid rgba(185,134,45,.58);background:linear-gradient(rgba(255,255,255,.78),rgba(248,242,230,.88)),url("assets/backgrounds/marble-light.jpg") center/cover}.tech-cta h2{margin:0 0 30px;font-family:Georgia,serif;font-size:clamp(36px,5vw,68px);line-height:1.05;font-weight:400}
@media(max-width:1050px){.tech-service-grid{grid-template-columns:repeat(2,1fr)}.tech-hero{grid-template-columns:1fr}.tech-artifact{width:min(390px,70vw)}.tech-feature{grid-template-columns:1fr}.tech-process-grid{grid-template-columns:repeat(5,minmax(130px,1fr));overflow-x:auto}}
@media(max-width:620px){.tech-page{padding-top:78px}.tech-hero{padding:58px 6%}.tech-hero h1{font-size:54px}.tech-capabilities{line-height:2}.tech-outcomes{gap:10px;font-size:9px;text-align:center}.tech-service-grid{grid-template-columns:1fr}.tech-section,.tech-feature{padding:55px 6%}.preview-scene{height:220px;padding:24px}.preview-scene strong{font-size:38px}.preview-scene em{font-size:21px}.tech-process-grid{grid-template-columns:1fr;overflow:visible}.tech-process-grid article{border-right:0;border-bottom:1px solid rgba(191,142,49,.25)}}

/* SPAR10 TECH — MOCKUP THEME RESTORATION */
.tech-page{position:relative;background:linear-gradient(rgba(251,248,241,.90),rgba(239,231,216,.94)),url("assets/backgrounds/marble-light.jpg") center/cover fixed}
.tech-hero{border-bottom:3px double rgba(174,123,35,.62);background:radial-gradient(circle at 78% 48%,rgba(204,157,68,.12),transparent 29%),radial-gradient(circle at 22% 35%,rgba(255,255,255,.96),transparent 35%),linear-gradient(rgba(255,255,255,.68),rgba(246,239,226,.80)),url("assets/backgrounds/marble-light.jpg") center/cover}
.tech-hero::after{width:55%;opacity:.48;background:linear-gradient(30deg,transparent 49%,rgba(185,134,45,.18) 49.5% 50.5%,transparent 51%),linear-gradient(150deg,transparent 49%,rgba(185,134,45,.14) 49.5% 50.5%,transparent 51%),repeating-linear-gradient(60deg,transparent 0 52px,rgba(185,134,45,.13) 53px,transparent 54px 106px),repeating-linear-gradient(-60deg,transparent 0 52px,rgba(185,134,45,.09) 53px,transparent 54px 106px);background-size:180px 180px,180px 180px,auto,auto}
.tech-artifact{width:min(500px,45vw);padding:11px;background:linear-gradient(145deg,#fff0b4 0%,#895b10 18%,#f4d477 40%,#65410b 70%,#e8bf5f 100%);filter:drop-shadow(0 32px 28px rgba(35,24,8,.38)) drop-shadow(0 0 22px rgba(190,135,36,.24))}
.tech-artifact::before{inset:12px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 2px,transparent 2px 7px),radial-gradient(circle at center,rgba(216,163,58,.22),transparent 42%),linear-gradient(145deg,#080909,#292821 52%,#040505);box-shadow:inset 0 0 50px #000,inset 0 0 18px rgba(232,188,91,.24)}
.tech-artifact::after{inset:7%;width:auto;aspect-ratio:auto;border:1px solid rgba(239,204,124,.22);background:repeating-linear-gradient(90deg,transparent 0 29px,rgba(231,194,113,.075) 30px,transparent 31px 59px),repeating-linear-gradient(0deg,transparent 0 29px,rgba(231,194,113,.06) 30px,transparent 31px 59px);box-shadow:none;filter:none}
.tech-circuit-ring{position:absolute;z-index:2;inset:18%;clip-path:inherit;background:repeating-conic-gradient(from 0deg,rgba(228,185,88,.58) 0 1deg,transparent 1.5deg 8deg);mask:radial-gradient(circle,transparent 0 38%,#000 40% 57%,transparent 59%);filter:drop-shadow(0 0 5px rgba(213,161,55,.55));animation:techCircuitTurn 24s linear infinite}
.tech-core{position:relative;z-index:4;width:42%;aspect-ratio:1;display:grid;place-items:center;clip-path:inherit;background:linear-gradient(145deg,#f7d777,#956316 38%,#d7a83f 65%,#5f3d09);box-shadow:0 0 0 9px rgba(10,10,9,.92),0 0 0 12px #c6973e,0 15px 22px rgba(0,0,0,.58);filter:drop-shadow(0 0 17px rgba(223,171,67,.38))}.tech-core span{color:#1e1d19;font:700 clamp(54px,6vw,88px)/1 Georgia,serif;text-shadow:0 1px 0 rgba(255,239,185,.45)}
@keyframes techCircuitTurn{to{transform:rotate(360deg)}}
.tech-hero-seal{position:relative;z-index:5;width:54px;height:48px;margin:-25px auto -24px;display:grid;place-items:center;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#f4d581,#8d6017 45%,#e5bd5e);color:#29251e;font:700 23px Georgia,serif;box-shadow:0 0 0 5px #f7f1e6,0 8px 16px rgba(58,39,10,.20)}
.tech-outcomes{min-height:78px;padding-top:22px;border-block:1px solid rgba(215,173,88,.38);background:repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 2px,transparent 2px 7px),linear-gradient(90deg,#121311,#2b2a23 50%,#121311)}
.tech-section{position:relative;background:radial-gradient(circle at 50% 0,rgba(255,255,255,.86),transparent 40%)}
.tech-section::before,.tech-section::after{content:"";position:absolute;top:0;width:180px;height:180px;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='78' viewBox='0 0 90 78'%3E%3Cpath d='M23 1h44l22 38-22 38H23L1 39z' fill='none' stroke='%23b9862d' stroke-opacity='.55'/%3E%3C/svg%3E")}.tech-section::before{left:0}.tech-section::after{right:0;transform:scaleX(-1)}
.tech-section-title,.tech-service-grid,.tech-process-grid{position:relative;z-index:1}
.tech-feature{border-block:3px double rgba(174,123,35,.44);box-shadow:inset 0 20px 45px rgba(130,91,25,.035),inset 0 -20px 45px rgba(130,91,25,.035)}
.tech-cta{position:relative;border:3px double rgba(185,134,45,.62);box-shadow:inset 0 0 0 8px rgba(255,255,255,.42),0 14px 35px rgba(80,55,18,.10)}
@media(max-width:620px){.tech-artifact{width:min(390px,82vw)}.tech-hero-seal{margin-top:-24px}.tech-section::before,.tech-section::after{width:90px;height:100px}}

@media(max-width:980px){
  .desktop-nav{gap:27px}
  .division-grid{gap:12px}
  .division-card h3{font-size:12px}
}
@media(max-width:820px){
  #cursorGlow{display:none}
  .site-header{height:78px}
  .desktop-nav{display:none}
  .mobile-menu{display:block}
  .brand-helmet{width:42px;height:42px}
  .brand-name{font-size:25px}
  .brand-sub{font-size:8px;letter-spacing:4px}
  .mobile-drawer{position:fixed;z-index:999;top:78px;left:0;right:0;padding:16px 6%;display:flex;flex-direction:column;gap:0;background:rgba(250,246,238,.98);border-bottom:1px solid rgba(191,142,49,.35);transform:translateY(-120%);transition:.25s}
  .mobile-drawer.open{transform:translateY(0)}
  .mobile-drawer button{padding:16px;border:0;border-bottom:1px solid rgba(100,75,38,.1);background:none;text-align:left;letter-spacing:3px;font-family:Georgia,serif}
  .initiative-grid{grid-template-columns:1fr;padding:45px 6% 80px}

  .hero{
    margin-top:78px;
    height:720px;
    min-height:0;
  }

  .hero h1{
    font-size:76px;
    letter-spacing:-2px;
  }

  .industry-title{
    font-size:15px;
    letter-spacing:5px;
  }

  .industry-title span{width:28px}
  .division-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:470px){
  .brand-copy{display:none}
  .hero h1{font-size:61px}
  .industry-title{font-size:12px}
  .division-grid{grid-template-columns:1fr}
}


/* =========================================================
   SPAR10 GATEWAY EXPERIENCE — V5
========================================================= */
.sr-only{
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.gateway-vignette,.gateway-beam,.gateway-iris{
  position:absolute;pointer-events:none;z-index:4;opacity:0;
}
.gateway-vignette{
  inset:0;
  background:radial-gradient(ellipse at 50% 48%,transparent 0 27%,rgba(37,20,2,.10) 47%,rgba(20,10,0,.72) 100%);
}
.gateway-beam{
  inset:0 auto 0 50%;
  width:3px;
  transform:translateX(-50%) scaleY(.08);
  transform-origin:center;
  background:linear-gradient(180deg,transparent 0%,rgba(255,236,178,.58) 15%,rgba(255,213,105,.98) 48%,rgba(255,239,191,.72) 82%,transparent 100%);
  box-shadow:0 0 18px rgba(255,218,123,.95),0 0 58px rgba(255,205,89,.75),0 0 120px rgba(244,180,48,.45);
}
.gateway-iris{
  top:50%;left:50%;
  width:28vmin;height:28vmin;border-radius:50%;
  transform:translate(-50%,-50%) scale(.15);
  background:radial-gradient(circle,rgba(255,250,231,.98) 0 9%,rgba(255,224,143,.92) 22%,rgba(231,173,49,.46) 48%,transparent 72%);
}
.hero.gateway-sequence{isolation:isolate}
.hero.gateway-sequence .ecosystem-button{pointer-events:none}
.hero.gateway-awaken .gateway-vignette{animation:gatewayVignetteIn .55s ease-out forwards}
.hero.gateway-awaken .portal-glow{animation:gatewaySideWake .65s ease-out forwards!important}
.hero.gateway-awaken .hero-art{animation:gatewayPush 1.55s cubic-bezier(.18,.74,.22,1) forwards}
.hero.gateway-awaken .hero-content{animation:gatewayContentRecede .95s cubic-bezier(.3,.7,.2,1) .28s forwards}
.hero.gateway-open .gateway-beam{animation:gatewayBeamOpen .62s cubic-bezier(.2,.8,.2,1) forwards}
.hero.gateway-open .gateway-iris{animation:gatewayIrisOpen .78s cubic-bezier(.2,.75,.2,1) forwards}
.hero.gateway-enter .gateway-iris{animation:gatewayIrisEnter .62s cubic-bezier(.2,.75,.2,1) forwards}
.hero.gateway-enter .gateway-vignette{animation:gatewayVignetteOut .55s ease-in forwards}
.divisions.gateway-reveal .section-title{animation:gatewayTitleReveal .55s ease-out both}
.divisions.gateway-reveal .division-card{
  opacity:0;transform:translateY(20px) scale(.97);
  animation:gatewayCardReveal .55s cubic-bezier(.18,.78,.24,1) forwards;
}
.divisions.gateway-reveal .division-card:nth-child(1){animation-delay:.08s}
.divisions.gateway-reveal .division-card:nth-child(2){animation-delay:.17s}
.divisions.gateway-reveal .division-card:nth-child(3){animation-delay:.26s}
.divisions.gateway-reveal .division-card:nth-child(4){animation-delay:.35s}
.divisions.gateway-reveal .division-card:nth-child(5){animation-delay:.44s}

@keyframes gatewayVignetteIn{from{opacity:0}to{opacity:1}}
@keyframes gatewayVignetteOut{from{opacity:1}to{opacity:0}}
@keyframes gatewaySideWake{from{opacity:.18;filter:blur(40px)}to{opacity:.56;filter:blur(28px)}}
@keyframes gatewayPush{0%{transform:scale(1.03)}48%{transform:scale(1.075)}100%{transform:scale(1.16)}}
@keyframes gatewayContentRecede{
  0%{opacity:1;transform:translateY(54px) scale(1);filter:blur(0)}
  65%{opacity:.42}
  100%{opacity:0;transform:translateY(46px) scale(.94);filter:blur(3px)}
}
@keyframes gatewayBeamOpen{
  0%{opacity:0;width:2px;transform:translateX(-50%) scaleY(.08)}
  35%{opacity:1}
  100%{opacity:1;width:7px;transform:translateX(-50%) scaleY(1)}
}
@keyframes gatewayIrisOpen{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}
  38%{opacity:.65}
  100%{opacity:.92;transform:translate(-50%,-50%) scale(1.55)}
}
@keyframes gatewayIrisEnter{
  0%{opacity:.92;transform:translate(-50%,-50%) scale(1.55)}
  70%{opacity:.98}
  100%{opacity:0;transform:translate(-50%,-50%) scale(7.5)}
}
@keyframes gatewayTitleReveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes gatewayCardReveal{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

@media (prefers-reduced-motion: reduce){
  .hero.gateway-awaken .gateway-vignette,
  .hero.gateway-awaken .portal-glow,
  .hero.gateway-awaken .hero-art,
  .hero.gateway-awaken .hero-content,
  .hero.gateway-open .gateway-beam,
  .hero.gateway-open .gateway-iris,
  .hero.gateway-enter .gateway-iris,
  .hero.gateway-enter .gateway-vignette,
  .divisions.gateway-reveal .section-title,
  .divisions.gateway-reveal .division-card{animation:none!important}
}


/* =========================================================
   FULL-SCREEN ECOSYSTEM HUB — V6
========================================================= */
.ecosystem-page{
  min-height:100vh;
  padding-top:102px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 50% 52%,rgba(255,255,252,.98) 0 24%,rgba(250,246,237,.82) 55%,rgba(222,211,191,.42) 100%),
    repeating-linear-gradient(135deg,rgba(167,149,118,.055) 0 1px,transparent 1px 5px),
    repeating-linear-gradient(45deg,rgba(255,255,255,.62) 0 1px,transparent 1px 5px),
    linear-gradient(180deg,#f7f3e9,#e9e0cf);
}

.ecosystem-page::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%,rgba(255,255,255,.88),transparent 32%),
    radial-gradient(circle at 50% 64%,rgba(255,252,241,.76),transparent 40%),
    linear-gradient(90deg,rgba(125,103,70,.08),transparent 14% 86%,rgba(125,103,70,.08));
}

.ecosystem-page::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.38;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='450' viewBox='0 0 520 450'%3E%3Cpath d='M130 2h260l128 223-128 223H130L2 225z' fill='none' stroke='%23b8aa91' stroke-opacity='.28' stroke-width='2'/%3E%3C/svg%3E");
  background-size:520px 450px;
  background-position:center;
}

.ecosystem-stage{
  position:relative;
  z-index:2;
  min-height:calc(100vh - 102px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:52px 4.5% 70px;
}

.ecosystem-eyebrow{
  text-align:center;
  margin-bottom:14px;
  color:#9a7026;
  font-size:10px;
  letter-spacing:6px;
}

.ecosystem-page .section-title h2{
  font-size:clamp(42px,5vw,72px);
  letter-spacing:4px;
  color:#8e651b;
}

.ecosystem-page .section-title p{
  margin-top:10px;
}

.ecosystem-intro{
  text-align:center;
  margin:10px 0 34px;
  color:#6f6250;
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
  letter-spacing:4px;
}

.ecosystem-page .division-grid{
  width:min(1180px,94vw);
  margin:0 auto;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:28px;
}

.ecosystem-page .division-card{
  opacity:1;
}

.ecosystem-page .hex-frame{
  max-width:200px;
}

.ecosystem-page.reveal .section-title,
.ecosystem-page.reveal .ecosystem-eyebrow,
.ecosystem-page.reveal .ecosystem-intro{
  animation:ecosystemHeaderIn .7s ease-out both;
}

.ecosystem-page.reveal .division-card{
  opacity:0;
  transform:translateY(28px) scale(.96);
  animation:ecosystemDivisionIn .62s cubic-bezier(.18,.78,.24,1) forwards;
}
.ecosystem-page.reveal .division-card:nth-child(1){animation-delay:.12s}
.ecosystem-page.reveal .division-card:nth-child(2){animation-delay:.22s}
.ecosystem-page.reveal .division-card:nth-child(3){animation-delay:.32s}
.ecosystem-page.reveal .division-card:nth-child(4){animation-delay:.42s}
.ecosystem-page.reveal .division-card:nth-child(5){animation-delay:.52s}

@keyframes ecosystemHeaderIn{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes ecosystemDivisionIn{
  from{opacity:0;transform:translateY(28px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(max-width:980px){
  .ecosystem-page .division-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media(max-width:820px){
  .ecosystem-page{padding-top:78px}
  .ecosystem-stage{min-height:calc(100vh - 78px);padding-top:42px}
  .ecosystem-page .division-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:470px){
  .ecosystem-page .division-grid{grid-template-columns:1fr}
}




/* =========================================================
   SPAR10 CORPORATE WORDMARK — reference-font treatment
   Scoped ONLY to exact "Spar10 Industries LLC" identity uses.
   ========================================================= */
.corporate-wordmark,
.corporate-wordmark-main,
.corporate-wordmark-sub,
.corporate-wordmark-inline{
  font-family:"Cinzel","Trajan Pro","Times New Roman",serif !important;
}

/* Header lockup */
.corporate-wordmark .brand-name{
  font-family:inherit;
  font-weight:500;
  letter-spacing:1.5px;
}
.corporate-wordmark .brand-sub{
  font-family:inherit;
  font-weight:500;
}

/* Hero lockup — preserve all existing sizing, shadows, spacing and animation */
.hero .corporate-wordmark-main{
  font-family:"Cinzel","Trajan Pro","Times New Roman",serif !important;
  font-weight:500;
}
.hero .corporate-wordmark-sub{
  font-family:"Cinzel","Trajan Pro","Times New Roman",serif !important;
  font-weight:500;
}

/* Small exact corporate-name instances on Ecosystem/About/Contact */
.corporate-wordmark-inline{
  font-weight:500;
}


/* =========================================================
   SPAR10 CUSTOM BLACK/GOLD WORDMARK
   Uses the approved custom logo artwork only in the two
   primary corporate lockups: fixed header + homepage hero.
   ========================================================= */
.brand-wordmark{
  display:block;
  width:190px;
  height:auto;
  object-fit:contain;
}

.hero-wordmark{
  display:block;
  width:min(690px,72vw);
  height:auto;
  margin:22px auto 0;
  filter:drop-shadow(0 8px 16px rgba(45,25,3,.30));
}

@media(max-width:820px){
  .brand-wordmark{width:150px}
  .hero-wordmark{width:min(570px,86vw);margin-top:18px}
}

@media(max-width:470px){
  .brand-wordmark{width:128px}
  .hero-wordmark{width:92vw}
}


/* Homepage Welcome button — restrained ivory and gold treatment */
.ecosystem-button{
  position:relative;
  display:flex;
  margin-left:auto;
  margin-right:auto;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(213,177,88,.04),transparent 24% 76%,rgba(213,177,88,.04)),
    linear-gradient(180deg,rgba(255,255,252,.96) 0%,rgba(250,247,239,.94) 52%,rgba(242,235,220,.94) 100%);
  border:1px solid rgba(190,140,45,.76);
  color:#a87318;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.30),
    0 4px 12px rgba(79,53,17,.14),
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -7px 14px rgba(184,142,67,.07);
  font-family:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  font-size:25px;
  font-style:italic;
  font-weight:400;
  letter-spacing:1.5px;
  text-shadow:0 1px 1px rgba(255,255,255,.86);
}
.ecosystem-button b{
  display:block;
  position:absolute;
  right:21px;
  margin:0;
  color:#b57d1d;
  font-family:Arial,sans-serif;
  font-size:25px;
  font-weight:200;
  line-height:1;
  text-shadow:0 1px 1px rgba(255,255,255,.86);
}
.ecosystem-button:hover{
  background:
    linear-gradient(90deg,rgba(213,177,88,.06),transparent 24% 76%,rgba(213,177,88,.06)),
    linear-gradient(180deg,#fffef9 0%,#fbf7ed 52%,#f2ead9 100%);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.38),
    0 5px 15px rgba(79,53,17,.18),
    0 0 13px rgba(216,183,91,.24),
    inset 0 1px 0 #fff,
    inset 0 -7px 14px rgba(184,142,67,.09);
}

@media(max-width:470px){
  .ecosystem-button{width:270px;height:47px;font-size:22px;letter-spacing:1px}
  .ecosystem-button b{right:18px;font-size:23px}
}

/* =========================================================
   SPAR10 3D ORBITAL DIVISION CHAMBER
   ========================================================= */

.ecosystem-page .division-grid.orbital-interface{

  position:relative;

  display:block;

  width:min(1180px,94vw);

  height:500px;

  margin:10px auto 0;

  perspective:1300px;

  perspective-origin:50% 48%;

  transform-style:preserve-3d;

  overflow:visible;
}


/* ---------------------------------------------------------
   EACH DIVISION BECOMES A FLOATING ENTITY
   --------------------------------------------------------- */

.ecosystem-page
.division-grid.orbital-interface
.division-card{

  position:absolute;

  left:50%;
  top:50%;

  width:190px;

  margin:0;
  padding:0;

  transform-style:preserve-3d;

  transform-origin:center;

  will-change:
    transform,
    opacity,
    filter;

  transition:
    filter .35s ease,
    text-shadow .35s ease;

  backface-visibility:hidden;
}


/* Disable the old entrance animation once
   the orbital interface takes control. */

.ecosystem-page.reveal
.division-grid.orbital-interface
.division-card{

  animation:none !important;
}


/* ---------------------------------------------------------
   FLOATING ARTIFACT FRAME
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface
.hex-frame{

  position:relative;

  width:180px;
  height:166px;

  margin:0 auto 18px;

  transform-style:preserve-3d;

  background:
    linear-gradient(
      145deg,
      #f1d48c,
      #a57420 45%,
      #f3dc9d 72%,
      #8e631b
    );

  box-shadow:
    0 18px 35px
    rgba(41,24,4,.22),

    0 0
    calc(8px + 22px * var(--orbit-depth))
    color-mix(
      in srgb,
      var(--accent) 42%,
      transparent
    );

  filter:
    drop-shadow(
      0 12px 18px
      rgba(55,34,7,.24)
    );
}


/* ---------------------------------------------------------
   SUBTLE INTERNAL ROTATION
   Gives the impression that each entity is suspended.
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface
.hex-frame img{

  animation:
    spar10ArtifactTurn
    16s linear infinite;

  transform-style:preserve-3d;
}


@keyframes spar10ArtifactTurn{

  0%{
    transform:
      rotateY(-4deg)
      rotateX(1deg);
  }

  25%{
    transform:
      rotateY(3deg)
      rotateX(-1deg);
  }

  50%{
    transform:
      rotateY(5deg)
      rotateX(1deg);
  }

  75%{
    transform:
      rotateY(-2deg)
      rotateX(-1deg);
  }

  100%{
    transform:
      rotateY(-4deg)
      rotateX(1deg);
  }
}


/* ---------------------------------------------------------
   FRONT / DEPTH LIGHTING
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface
.division-card h3{

  transition:
    color .3s ease,
    text-shadow .3s ease;

  text-shadow:
    0 3px 12px
    rgba(51,31,4,.16);
}


.ecosystem-page
.orbital-interface
.division-card p{

  transition:
    color .3s ease,
    opacity .3s ease;
}


/* ---------------------------------------------------------
   HOVER / FOCUS
   Orbit itself slows through JavaScript.
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface
.division-card.orbital-focus{

  filter:
    brightness(1.12)
    saturate(1.08);
}


.ecosystem-page
.orbital-interface
.division-card.orbital-focus
.hex-frame{

  box-shadow:

    0 22px 42px
    rgba(43,26,5,.24),

    0 0 26px
    color-mix(
      in srgb,
      var(--accent) 68%,
      transparent
    ),

    0 0 58px
    color-mix(
      in srgb,
      var(--accent) 30%,
      transparent
    );
}


.ecosystem-page
.orbital-interface
.division-card.orbital-focus h3{

  color:var(--accent);

  text-shadow:
    0 0 15px
    color-mix(
      in srgb,
      var(--accent) 38%,
      transparent
    );
}


/* ---------------------------------------------------------
   SELECTION LOCK
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface.division-selected
.division-card{

  pointer-events:none;
}


.ecosystem-page
.orbital-interface
.chosen-division{

  z-index:1000 !important;

  opacity:1 !important;

  filter:
    brightness(1.15)
    saturate(1.15);
}


/* ---------------------------------------------------------
   ENVIRONMENTAL LIGHT DURING ENTRY
   --------------------------------------------------------- */

.ecosystem-page
.orbital-interface::before{

  content:"";

  position:absolute;

  inset:0;

  pointer-events:none;

  opacity:0;

  background:
    radial-gradient(
      ellipse at center,
      rgba(255,225,151,.20),
      transparent 58%
    );

  transition:
    opacity .6s ease;
}


.ecosystem-page
.orbital-interface.orbital-entry::before{

  opacity:1;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:820px){

  .ecosystem-page
  .division-grid.orbital-interface{

    height:470px;

    perspective:1000px;
  }

  .ecosystem-page
  .division-grid.orbital-interface
  .division-card{

    width:150px;
  }

  .ecosystem-page
  .orbital-interface
  .hex-frame{

    width:145px;
    height:134px;
  }
}


@media(max-width:470px){

  .ecosystem-page
  .division-grid.orbital-interface{

    height:440px;

    width:100%;
  }

  .ecosystem-page
  .division-grid.orbital-interface
  .division-card{

    width:126px;
  }

  .ecosystem-page
  .orbital-interface
  .hex-frame{

    width:120px;
    height:111px;
  }
}


/* =========================================================
   SPAR10 DIVISION TITLES — corporate font treatment
   Extends the approved Cinzel/Trajan-style treatment to all
   five division names without changing sizing or layout.
   ========================================================= */
.ecosystem-page .division-card h3{
  font-family:"Cinzel","Trajan Pro","Times New Roman",serif !important;
  font-weight:500;
}

/* =========================================================
   SPAR10 ORBITAL ARTIFACT ENERGIZATION — V2
   Visual-only enhancement. Orbit geometry/routing untouched.
   ========================================================= */
.ecosystem-page .orbital-interface .division-card.atlas{--artifact-a:#1a91a0;--artifact-b:#062e35;--artifact-hot:#71f4ff}
.ecosystem-page .orbital-interface .division-card.images{--artifact-a:#8d35cf;--artifact-b:#230535;--artifact-hot:#d79aff}
.ecosystem-page .orbital-interface .division-card.assets{--artifact-a:#1768c8;--artifact-b:#061b43;--artifact-hot:#83bdff}
.ecosystem-page .orbital-interface .division-card.impact{--artifact-a:#168348;--artifact-b:#052b19;--artifact-hot:#79efad}

.ecosystem-page .orbital-interface .impact-symbol{position:relative;z-index:3;width:86px;height:86px;display:grid;place-items:center}
.ecosystem-page .orbital-interface .impact-symbol i{position:absolute;width:18px;height:18px;border:2px solid #a6f3c5;border-radius:50%;box-shadow:0 0 8px rgba(121,239,173,.88),0 0 18px rgba(22,131,72,.58)}
.ecosystem-page .orbital-interface .impact-symbol i:nth-child(1){transform:translateY(-23px)}
.ecosystem-page .orbital-interface .impact-symbol i:nth-child(2){transform:translate(-22px,16px)}
.ecosystem-page .orbital-interface .impact-symbol i:nth-child(3){transform:translate(22px,16px)}
.ecosystem-page .orbital-interface .impact-symbol::before{content:"";position:absolute;width:54px;height:47px;background:conic-gradient(from 30deg at 50% 42%,transparent 0 15%,#79efad 16% 18%,transparent 19% 48%,#79efad 49% 51%,transparent 52% 81%,#79efad 82% 84%,transparent 85%);filter:drop-shadow(0 0 5px rgba(121,239,173,.75))}
.ecosystem-page .orbital-interface .division-card.fitness{--artifact-a:#c22d31;--artifact-b:#3a0709;--artifact-hot:#ff8a8e}
.ecosystem-page .orbital-interface .division-card.tech{--artifact-a:#c48b28;--artifact-b:#2d250f;--artifact-hot:#ffe19a}

.ecosystem-page .orbital-interface .tech-symbol{
  position:relative;
  z-index:3;
  color:#ffe19a;
  font-family:Consolas,"Courier New",monospace;
  font-size:38px;
  font-weight:700;
  letter-spacing:-5px;
  text-shadow:0 0 7px rgba(255,225,154,.88),0 0 18px rgba(196,139,40,.68);
}

.ecosystem-page .orbital-interface .hex-frame{
  isolation:isolate;
  overflow:hidden;
  padding:3px;
  background:
    linear-gradient(145deg,#fff0b5 0%,#b57d19 28%,#f6dc8d 48%,#8b5a12 72%,#f7dda0 100%);
  box-shadow:
    0 18px 35px rgba(41,24,4,.24),
    0 0 calc(10px + 28px * var(--orbit-depth)) color-mix(in srgb,var(--artifact-a) 52%,transparent),
    inset 0 0 14px rgba(255,231,164,.42);
}

/* dark marble/jewel chamber */
.ecosystem-page .orbital-interface .hex-frame::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:3px;
  clip-path:inherit;
  background:
    radial-gradient(circle at 48% 38%,color-mix(in srgb,var(--artifact-a) 28%,transparent),transparent 34%),
    repeating-linear-gradient(118deg,transparent 0 18px,color-mix(in srgb,var(--artifact-hot) 13%,transparent) 19px,transparent 21px 43px),
    linear-gradient(145deg,#020304 3%,var(--artifact-b) 48%,#010202 100%);
  box-shadow:inset 0 0 34px rgba(0,0,0,.78),inset 0 0 18px color-mix(in srgb,var(--artifact-a) 24%,transparent);
}

/* rotating energized perimeter / halo */
.ecosystem-page .orbital-interface .hex-frame::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:-42%;
  background:conic-gradient(from 0deg,transparent 0 16%,var(--artifact-hot) 20%,transparent 25% 49%,color-mix(in srgb,var(--artifact-a) 88%,white) 53%,transparent 58% 82%,var(--artifact-hot) 86%,transparent 91%);
  opacity:calc(.18 + var(--orbit-depth) * .48);
  filter:blur(7px);
  mix-blend-mode:screen;
  animation:spar10EnergySweep 6.8s linear infinite;
}

.ecosystem-page .orbital-interface .hex-frame img{
  position:relative;
  z-index:3;
  width:calc(100% - 6px);
  height:calc(100% - 6px);
  padding:20%;
  background:transparent;
  filter:
    brightness(1.16)
    contrast(1.08)
    drop-shadow(0 0 5px rgba(255,239,188,.72))
    drop-shadow(0 0 calc(5px + 10px * var(--orbit-depth)) var(--artifact-hot));
}

/* fine inner hex line so the artifact reads like a powered seal */
.ecosystem-page .orbital-interface .division-card::before{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:5;
  left:18px;
  top:15px;
  width:154px;
  height:142px;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  border:1px solid color-mix(in srgb,var(--artifact-hot) calc(28% + var(--orbit-depth) * 36%),transparent);
  filter:drop-shadow(0 0 6px color-mix(in srgb,var(--artifact-a) 50%,transparent));
  opacity:calc(.35 + var(--orbit-depth) * .55);
  transition:opacity .3s ease,filter .3s ease;
}

.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame{
  box-shadow:
    0 24px 46px rgba(20,10,1,.32),
    0 0 24px color-mix(in srgb,var(--artifact-hot) 84%,transparent),
    0 0 72px color-mix(in srgb,var(--artifact-a) 48%,transparent),
    inset 0 0 20px rgba(255,236,180,.48);
}
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame::after{
  opacity:.88;
  animation-duration:2.2s;
}
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame img{
  filter:brightness(1.28) contrast(1.1) drop-shadow(0 0 8px #fff1bd) drop-shadow(0 0 20px var(--artifact-hot));
}
.ecosystem-page .orbital-interface .division-card.orbital-focus::before{
  opacity:1;
  filter:drop-shadow(0 0 12px var(--artifact-hot));
}

.ecosystem-page .orbital-interface .chosen-division .hex-frame{
  animation:spar10ChosenPulse .72s ease-in-out infinite alternate;
}

@keyframes spar10EnergySweep{to{transform:rotate(360deg)}}
@keyframes spar10ChosenPulse{
  from{filter:drop-shadow(0 0 8px var(--artifact-a)) brightness(1.05)}
  to{filter:drop-shadow(0 0 28px var(--artifact-hot)) brightness(1.24)}
}

@media(max-width:820px){
  .ecosystem-page .orbital-interface .division-card::before{left:12px;top:12px;width:126px;height:116px}
}
@media(max-width:470px){
  .ecosystem-page .orbital-interface .division-card::before{left:10px;top:10px;width:106px;height:98px}
}

@media(prefers-reduced-motion:reduce){
  .ecosystem-page .orbital-interface .hex-frame::after,
  .ecosystem-page .orbital-interface .chosen-division .hex-frame{animation:none!important}
}


/* =========================================================
   SPAR10 ORBITAL ARTIFACT IDENTITIES — V3
   Gives each division a unique internal "instrument" while
   preserving the shared hex chassis and orbital mechanics.
   ========================================================= */

/* shared identity layer — sits behind the logo, above the chamber */
.ecosystem-page .orbital-interface .division-card::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:2;
  left:18px;
  top:15px;
  width:154px;
  height:142px;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  opacity:calc(.10 + var(--orbit-depth) * .34);
  mix-blend-mode:screen;
  transition:opacity .35s ease, filter .35s ease, transform .35s ease;
}

/* ---------------------------------------------------------
   ATLAS — navigational globe / live coordinate instrument
   --------------------------------------------------------- */
.ecosystem-page .orbital-interface .division-card.atlas::after{
  background:
    radial-gradient(circle at 50% 50%,transparent 0 26%,rgba(113,244,255,.26) 27% 28%,transparent 29% 39%,rgba(113,244,255,.18) 40% 41%,transparent 42%),
    repeating-linear-gradient(90deg,transparent 0 18px,rgba(113,244,255,.12) 19px,transparent 20px 38px),
    repeating-linear-gradient(0deg,transparent 0 17px,rgba(113,244,255,.10) 18px,transparent 19px 36px);
  animation:atlasInstrumentDrift 12s linear infinite;
}

/* ---------------------------------------------------------
   IMAGES — camera aperture / optical iris
   --------------------------------------------------------- */
.ecosystem-page .orbital-interface .division-card.images::after{
  background:
    radial-gradient(circle at center,transparent 0 21%,rgba(215,154,255,.22) 22% 23%,transparent 24%),
    repeating-conic-gradient(
      from 9deg at 50% 50%,
      rgba(215,154,255,.18) 0 8deg,
      transparent 9deg 46deg
    );
  transform:scale(.78);
  animation:imagesIris 7.5s ease-in-out infinite;
}

/* ---------------------------------------------------------
   ASSETS — vault / architectural structure
   --------------------------------------------------------- */
.ecosystem-page .orbital-interface .division-card.assets::after{
  background:
    linear-gradient(90deg,transparent 12%,rgba(131,189,255,.18) 13% 15%,transparent 16% 32%,rgba(131,189,255,.20) 33% 35%,transparent 36% 64%,rgba(131,189,255,.20) 65% 67%,transparent 68% 84%,rgba(131,189,255,.18) 85% 87%,transparent 88%),
    linear-gradient(0deg,transparent 18%,rgba(131,189,255,.20) 19% 21%,transparent 22% 72%,rgba(131,189,255,.16) 73% 75%,transparent 76%),
    linear-gradient(135deg,transparent 47%,rgba(131,189,255,.10) 48% 49%,transparent 50%);
  filter:drop-shadow(0 0 5px rgba(131,189,255,.18));
  animation:assetsVaultPulse 5.8s ease-in-out infinite;
}

/* ---------------------------------------------------------
   IMPACT — connected communities / expanding reach
   --------------------------------------------------------- */
.ecosystem-page .orbital-interface .division-card.impact::after{
  background:
    radial-gradient(circle at center,transparent 0 18%,rgba(121,239,173,.28) 19% 20%,transparent 21% 34%,rgba(121,239,173,.18) 35% 36%,transparent 37% 50%,rgba(121,239,173,.10) 51% 52%,transparent 53%),
    radial-gradient(circle at 26% 34%,rgba(121,239,173,.80) 0 2px,transparent 3px),
    radial-gradient(circle at 73% 31%,rgba(121,239,173,.74) 0 2px,transparent 3px),
    radial-gradient(circle at 68% 73%,rgba(121,239,173,.78) 0 2px,transparent 3px),
    radial-gradient(circle at 31% 72%,rgba(121,239,173,.70) 0 2px,transparent 3px);
  animation:impactRipple 4.6s ease-in-out infinite;
}

/* ---------------------------------------------------------
   FITNESS — kinetic pulse / heartbeat energy
   --------------------------------------------------------- */
.ecosystem-page .orbital-interface .division-card.fitness::after{
  background:
    radial-gradient(circle at center,transparent 0 24%,rgba(255,138,142,.24) 25% 26%,transparent 27% 37%,rgba(255,138,142,.13) 38% 39%,transparent 40%),
    linear-gradient(90deg,transparent 0 17%,rgba(255,138,142,.11) 18% 21%,transparent 22% 38%,rgba(255,138,142,.28) 39% 41%,transparent 42% 47%,rgba(255,138,142,.46) 48% 51%,transparent 52% 58%,rgba(255,138,142,.22) 59% 61%,transparent 62% 78%,rgba(255,138,142,.10) 79% 82%,transparent 83%);
  animation:fitnessHeartbeat 2.8s ease-in-out infinite;
}

/* TECH — connected systems / digital circuitry */
.ecosystem-page .orbital-interface .division-card.tech::after{
  background:
    radial-gradient(circle at 25% 30%,rgba(255,225,154,.82) 0 2px,transparent 3px),
    radial-gradient(circle at 73% 27%,rgba(255,225,154,.74) 0 2px,transparent 3px),
    radial-gradient(circle at 68% 72%,rgba(255,225,154,.76) 0 2px,transparent 3px),
    linear-gradient(32deg,transparent 24%,rgba(255,225,154,.18) 25% 26%,transparent 27% 73%,rgba(255,225,154,.16) 74% 75%,transparent 76%),
    repeating-linear-gradient(90deg,transparent 0 25px,rgba(255,225,154,.08) 26px,transparent 27px 48px);
  animation:techCircuitPulse 4.2s ease-in-out infinite;
}

/* Bring each identity fully awake when hovered */
.ecosystem-page .orbital-interface .division-card.orbital-focus::after{
  opacity:.78;
  filter:drop-shadow(0 0 10px var(--artifact-hot));
}

/* Slightly more visible when selected */
.ecosystem-page .orbital-interface .division-card.chosen-division::after{
  opacity:.95;
  filter:drop-shadow(0 0 16px var(--artifact-hot));
}

/* Per-division chamber materials */
.ecosystem-page .orbital-interface .division-card.atlas .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(26,145,160,.30),transparent 34%),
    repeating-linear-gradient(118deg,transparent 0 18px,rgba(113,244,255,.10) 19px,transparent 21px 43px),
    linear-gradient(145deg,#010304 3%,#062e35 48%,#010202 100%);
}
.ecosystem-page .orbital-interface .division-card.images .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(141,53,207,.35),transparent 34%),
    repeating-radial-gradient(circle at center,transparent 0 16px,rgba(215,154,255,.055) 17px,transparent 18px 30px),
    linear-gradient(145deg,#030104 3%,#230535 48%,#010102 100%);
}
.ecosystem-page .orbital-interface .division-card.assets .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(23,104,200,.31),transparent 34%),
    repeating-linear-gradient(90deg,transparent 0 24px,rgba(131,189,255,.065) 25px,transparent 26px 49px),
    linear-gradient(145deg,#010204 3%,#061b43 48%,#010102 100%);
}
.ecosystem-page .orbital-interface .division-card.impact .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(22,131,72,.31),transparent 34%),
    repeating-linear-gradient(132deg,transparent 0 20px,rgba(121,239,173,.07) 21px,transparent 22px 46px),
    linear-gradient(145deg,#010402 3%,#052b19 48%,#010201 100%);
}
.ecosystem-page .orbital-interface .division-card.fitness .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(194,45,49,.32),transparent 34%),
    repeating-radial-gradient(circle at center,transparent 0 18px,rgba(255,138,142,.055) 19px,transparent 20px 35px),
    linear-gradient(145deg,#040101 3%,#3a0709 48%,#020101 100%);
}
.ecosystem-page .orbital-interface .division-card.tech .hex-frame::before{
  background:
    radial-gradient(circle at 50% 42%,rgba(196,139,40,.32),transparent 34%),
    repeating-linear-gradient(90deg,transparent 0 20px,rgba(255,225,154,.07) 21px,transparent 22px 42px),
    repeating-linear-gradient(0deg,transparent 0 20px,rgba(255,225,154,.055) 21px,transparent 22px 42px),
    linear-gradient(145deg,#030302 3%,#2d250f 48%,#020201 100%);
}

/* Unique motion signatures */
@keyframes atlasInstrumentDrift{
  0%{transform:rotate(0deg) scale(.82)}
  50%{transform:rotate(4deg) scale(.88)}
  100%{transform:rotate(0deg) scale(.82)}
}

@keyframes imagesIris{
  0%,100%{transform:rotate(0deg) scale(.72);opacity:.18}
  50%{transform:rotate(18deg) scale(.90);opacity:.48}
}

@keyframes assetsVaultPulse{
  0%,100%{opacity:.14;filter:brightness(.9)}
  50%{opacity:.44;filter:brightness(1.25)}
}

@keyframes impactRipple{
  0%,100%{transform:scale(.76);opacity:.16}
  50%{transform:scale(.94);opacity:.52}
}

@keyframes fitnessHeartbeat{
  0%,100%{transform:scale(.88);opacity:.14}
  12%{transform:scale(.98);opacity:.52}
  22%{transform:scale(.91);opacity:.22}
  34%{transform:scale(1.02);opacity:.60}
  48%{transform:scale(.90);opacity:.18}
}
@keyframes techCircuitPulse{
  0%,100%{opacity:.18;filter:brightness(.9)}
  50%{opacity:.58;filter:brightness(1.35)}
}

/* Responsive identity-layer geometry mirrors the existing inner frame */
@media(max-width:820px){
  .ecosystem-page .orbital-interface .division-card::after{
    left:12px;
    top:12px;
    width:126px;
    height:116px;
  }
}

@media(max-width:470px){
  .ecosystem-page .orbital-interface .division-card::after{
    left:10px;
    top:10px;
    width:106px;
    height:98px;
  }
}

@media(prefers-reduced-motion:reduce){
  .ecosystem-page .orbital-interface .division-card::after{
    animation:none!important;
  }
}


/* =========================================================
   SPAR10 IMAGES — PEOPLE / PLACES / NATURE PORTFOLIO
   ========================================================= */
.images-portfolio-page{min-height:100vh;padding-top:102px;background:#080807;color:#f7f2e8;overflow-x:hidden}
.images-portfolio-shell{position:relative;min-height:calc(100vh - 102px);isolation:isolate;background:
 radial-gradient(circle at 18% 8%,rgba(157,99,210,.11),transparent 24%),
 radial-gradient(circle at 82% 82%,rgba(191,142,49,.09),transparent 30%),
 linear-gradient(135deg,#090908,#11100e 52%,#070706)}
.images-portfolio-shell::before{content:"";position:fixed;inset:102px 0 0;z-index:-2;pointer-events:none;opacity:.16;background-image:url("assets/backgrounds/marble-light.jpg");background-size:cover;filter:grayscale(1) contrast(1.12) brightness(.38)}
.images-portfolio-shell::after{content:"";position:fixed;inset:102px 0 0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.30) 46%,rgba(0,0,0,.68))}
.images-ambient{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 11.95%,rgba(218,177,87,.035) 12%,transparent 12.05%)}
.images-portfolio-header{position:relative;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding:48px 5.5% 25px;border-bottom:1px solid rgba(216,171,76,.22)}
.images-portfolio-header small,.images-category-intro small,.places-heading small,.images-collection-heading small{font-size:9px;letter-spacing:3.4px;color:#b98b37}
.images-portfolio-header h1{margin:10px 0 0;font-family:Cinzel,Georgia,serif;font-size:clamp(35px,4.3vw,68px);font-weight:400;letter-spacing:7px}.images-portfolio-header h1 span{color:#d2a046}.images-portfolio-header h1 sup{font-size:.18em}
.images-portfolio-header>p{margin:0;text-align:right;font-family:Cinzel,Georgia,serif;font-size:12px;line-height:1.7;letter-spacing:3.4px;color:#d9d1c4}.images-portfolio-header>p span{font-family:Arial,sans-serif;font-size:11px;letter-spacing:1px;color:#777167}
.images-category-nav{position:sticky;top:102px;z-index:40;display:flex;justify-content:center;gap:42px;padding:16px 5%;background:rgba(9,9,8,.89);border-bottom:1px solid rgba(216,171,76,.16);backdrop-filter:blur(15px)}
.images-category-tab{position:relative;border:0;background:none;color:#746f66;cursor:pointer;padding:8px 2px;font-family:Cinzel,Georgia,serif;font-size:10px;letter-spacing:3px;transition:.25s}.images-category-tab::after{content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;background:#d2a046;transition:.25s}.images-category-tab:hover,.images-category-tab.active{color:#f4ecdc}.images-category-tab.active::after{left:0;right:0}
.images-category-stage{display:none;position:relative;z-index:2;min-height:calc(100vh - 230px);padding:48px 5.5% 70px}.images-category-stage.active{display:block;animation:imagesStageIn .55s ease both}@keyframes imagesStageIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.images-category-intro{text-align:center;margin:12px auto 35px}.images-category-intro h2,.places-heading h2,.images-collection-heading h2{margin:9px 0;font-family:Cinzel,Georgia,serif;font-size:clamp(30px,4vw,58px);font-weight:400;letter-spacing:6px}.images-category-intro p,.places-heading p,.images-collection-heading p{color:#827b70;line-height:1.8}
.images-category-cards{max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.images-category-card{position:relative;height:min(53vh,510px);min-height:370px;overflow:hidden;border:1px solid rgba(217,174,82,.20);background:#12110f;color:#f7f2e8;cursor:pointer;text-align:left;padding:0;box-shadow:0 22px 55px rgba(0,0,0,.28);transition:transform .45s cubic-bezier(.18,.82,.22,1),border-color .35s}.images-category-card:hover{transform:translateY(-8px);border-color:rgba(230,190,103,.65)}
.images-category-card-photo{position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(213,169,74,.16),transparent 34%),linear-gradient(160deg,#25221c,#080807);background-size:cover;background-position:center;filter:saturate(.70) brightness(.62);transition:transform .8s ease,filter .5s}.images-category-card:hover .images-category-card-photo{transform:scale(1.045);filter:saturate(.95) brightness(.73)}
.images-category-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(0,0,0,.10) 48%,rgba(0,0,0,.92) 100%)}
.images-category-card>div:last-child{position:absolute;z-index:3;left:28px;right:28px;bottom:28px}.images-category-card small{font-size:8px;letter-spacing:2.8px;color:#c1933f}.images-category-card h3{margin:8px 0 8px;font-family:Cinzel,Georgia,serif;font-size:clamp(31px,3.2vw,48px);font-weight:400;letter-spacing:6px}.images-category-card p{margin:0;color:#a49c8f;font-size:12px;line-height:1.6}.images-category-number{position:absolute;z-index:3;top:24px;right:24px;font-family:Cinzel,serif;font-size:11px;letter-spacing:2px;color:#d7ad59}
.places-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;max-width:1320px;margin:0 auto 15px}.places-heading p{max-width:370px;text-align:right}
.places-experience{max-width:1320px;margin:auto;display:grid;grid-template-columns:minmax(520px,1.5fr) minmax(290px,.55fr);gap:55px;align-items:center}
.places-globe-wrap{position:relative;min-height:610px;display:grid;place-items:center;perspective:1200px}.places-globe-aura{position:absolute;width:min(62vw,620px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(202,155,58,.16),rgba(157,99,210,.07) 42%,transparent 70%);filter:blur(25px)}
.places-globe{--globe-size:min(48vw,520px);position:relative;width:var(--globe-size);height:var(--globe-size);border-radius:50%;cursor:grab;overflow:visible;background:radial-gradient(circle at 33% 25%,rgba(255,246,219,.22),transparent 20%),radial-gradient(circle at 48% 52%,#24231f 0,#151512 56%,#080807 74%);border:1px solid rgba(229,188,99,.62);box-shadow:inset -45px -20px 80px rgba(0,0,0,.72),inset 24px 18px 55px rgba(219,173,79,.08),0 0 45px rgba(195,145,49,.18),0 35px 70px rgba(0,0,0,.5)}.places-globe:active{cursor:grabbing}
.places-globe-grid{position:absolute;inset:0;border-radius:50%;overflow:hidden;opacity:.42;background:repeating-radial-gradient(ellipse at center,transparent 0 38px,rgba(223,187,111,.16) 39px,transparent 40px 76px),repeating-linear-gradient(90deg,transparent 0 51px,rgba(223,187,111,.12) 52px,transparent 53px 104px);mask-image:radial-gradient(circle,#000 69%,transparent 70%)}
.places-globe-shine{position:absolute;inset:4%;border-radius:50%;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.12),transparent 29% 70%,rgba(0,0,0,.26))}
.places-pins{position:absolute;inset:0;pointer-events:none}.place-pin{position:absolute;left:50%;top:50%;z-index:5;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border:0;border-radius:50%;background:#e5b653;box-shadow:0 0 0 5px rgba(229,182,83,.12),0 0 18px rgba(236,189,87,.78);cursor:pointer;pointer-events:auto;transition:opacity .15s,filter .2s,box-shadow .2s}.place-pin::after{content:attr(data-label);position:absolute;left:18px;top:50%;transform:translateY(-50%);white-space:nowrap;padding:5px 8px;background:rgba(5,5,5,.78);border:1px solid rgba(225,178,75,.2);color:#efe7d8;font-family:Cinzel,serif;font-size:8px;letter-spacing:1.8px;opacity:0;pointer-events:none;transition:.2s}.place-pin:hover::after,.place-pin.active::after{opacity:1}.place-pin.active{background:#fff2c6;box-shadow:0 0 0 7px rgba(229,182,83,.17),0 0 26px rgba(250,213,126,.95)}
.places-globe-caption{position:absolute;bottom:16px;font-size:8px;letter-spacing:2px;color:#5f5a51}.places-globe-caption b{color:#b98b37;font-weight:400}.places-globe-caption span{margin:0 8px;color:#69552e}
.places-detail{min-height:490px;padding:0 0 0 28px;border-left:1px solid rgba(213,166,67,.22)}.places-detail>small{font-size:8px;letter-spacing:3px;color:#b98b37}.places-cover{height:190px;margin:18px 0 18px;background:linear-gradient(135deg,#24211b,#111);background-size:cover;background-position:center;border:1px solid rgba(213,166,67,.22);box-shadow:0 18px 42px rgba(0,0,0,.32)}.places-coordinate{font-size:8px;letter-spacing:2px;color:#746f66}.places-detail h3{margin:10px 0 4px;font-family:Cinzel,Georgia,serif;font-size:clamp(27px,3vw,44px);font-weight:400;letter-spacing:5px}.places-detail h4{margin:0;color:#b88a36;font-size:9px;font-weight:400;letter-spacing:3px}.places-detail p{min-height:80px;margin:22px 0;color:#8e877b;font-size:12px;line-height:1.8}.places-detail button,.images-album-topbar button{border:0;border-bottom:1px solid rgba(210,160,61,.55);background:none;color:#d6aa50;cursor:pointer;padding:12px 0;font-family:Cinzel,Georgia,serif;font-size:9px;letter-spacing:3px}.places-detail button:disabled{opacity:.3;cursor:default}.places-detail button span{display:inline-grid;width:27px;height:27px;margin-left:12px;place-items:center;border:1px solid rgba(213,166,67,.5);border-radius:50%;font-size:17px}
.places-destination-strip{max-width:1320px;margin:15px auto 0;display:flex;gap:9px;overflow-x:auto;padding:8px 0 14px;scrollbar-width:thin}.destination-chip{flex:0 0 auto;border:1px solid rgba(213,166,67,.18);background:rgba(255,255,255,.025);color:#827b70;cursor:pointer;padding:10px 14px;font-size:8px;letter-spacing:2px}.destination-chip:hover,.destination-chip.active{border-color:rgba(227,181,82,.58);color:#eee5d4;background:rgba(213,166,67,.07)}
.images-collection-heading{max-width:1320px;margin:0 auto 30px}.images-project-grid{max-width:1320px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.images-project-card{position:relative;height:390px;overflow:hidden;border:1px solid rgba(213,166,67,.18);background:#111;cursor:pointer;padding:0;text-align:left;color:#eee6d8}.images-project-card-photo{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(.72) brightness(.62);transition:.55s}.images-project-card:hover .images-project-card-photo{transform:scale(1.04);filter:saturate(.95) brightness(.74)}.images-project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.9))}.images-project-card-copy{position:absolute;z-index:2;left:24px;right:24px;bottom:23px}.images-project-card-copy small{font-size:8px;letter-spacing:2px;color:#c39543}.images-project-card-copy h3{margin:7px 0 5px;font-family:Cinzel,serif;font-size:25px;font-weight:400;letter-spacing:4px}.images-project-card-copy p{margin:0;color:#938b7e;font-size:10px;letter-spacing:1px}
.images-empty{grid-column:1/-1;padding:80px 20px;text-align:center;border:1px solid rgba(213,166,67,.15);color:#756f65;letter-spacing:1px}.images-empty b{display:block;margin-bottom:10px;font-family:Cinzel,serif;color:#c2943e;letter-spacing:3px}
.images-album{display:none;position:fixed;z-index:3000;inset:0;overflow:auto;background:#080807;color:#f5eee1}.images-album.open{display:block}.images-album-topbar{position:sticky;top:0;z-index:3;min-height:105px;padding:20px 4%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:rgba(8,8,7,.92);border-bottom:1px solid rgba(213,166,67,.18);backdrop-filter:blur(14px)}.images-album-topbar>div{text-align:center}.images-album-topbar small{font-size:8px;letter-spacing:3px;color:#b98b37}.images-album-topbar h2{margin:4px 0 0;font-family:Cinzel,serif;font-size:24px;font-weight:400;letter-spacing:5px}.images-album-topbar>span{text-align:right;color:#777167;font-size:9px;letter-spacing:2px}.images-album-grid{padding:18px;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:250px;gap:10px}.images-album-photo{border:0;padding:0;overflow:hidden;background:#111;cursor:zoom-in}.images-album-photo:nth-child(7n+1),.images-album-photo:nth-child(7n+5){grid-column:span 2;grid-row:span 2}.images-album-photo img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.84);transition:.45s}.images-album-photo:hover img{transform:scale(1.025);filter:saturate(1)}
.images-lightbox{display:none;position:fixed;z-index:4100;inset:0;place-items:center;background:rgba(0,0,0,.96)}.images-lightbox.open{display:grid}.images-lightbox figure{margin:0;max-width:86vw;max-height:88vh;text-align:center}.images-lightbox img{max-width:86vw;max-height:82vh;object-fit:contain;box-shadow:0 15px 70px #000}.images-lightbox figcaption{margin-top:10px;color:#80796f;font-size:9px;letter-spacing:2px}.images-lightbox-close,.images-lightbox-nav{position:absolute;border:0;background:none;color:#e9deca;cursor:pointer}.images-lightbox-close{right:28px;top:20px;font-size:35px;font-weight:200}.images-lightbox-nav{top:50%;transform:translateY(-50%);font-size:55px}.images-lightbox-nav.prev{left:28px}.images-lightbox-nav.next{right:28px}

@media(max-width:1150px) and (min-width:701px){
  .images-category-cards{grid-template-columns:repeat(2,1fr)}
  .images-category-card{height:390px;min-height:0}
}

@media(max-width:1000px){.images-category-cards{grid-template-columns:1fr}.images-category-card{height:330px;min-height:0}.places-experience{grid-template-columns:1fr}.places-detail{max-width:650px;margin:auto;padding:28px 0 0;border-left:0;border-top:1px solid rgba(213,166,67,.22)}.places-globe-wrap{min-height:570px}.images-project-grid{grid-template-columns:repeat(2,1fr)}.images-album-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.images-portfolio-page{padding-top:102px}.images-portfolio-header{align-items:flex-start;flex-direction:column;padding-top:30px}.images-portfolio-header>p{text-align:left}.images-category-nav{gap:12px;justify-content:space-between;overflow:auto}.images-category-tab{font-size:8px;letter-spacing:1.7px}.images-category-stage{padding:35px 5% 55px}.places-heading{display:block}.places-heading p{text-align:left}.places-experience{display:block}.places-globe-wrap{min-height:440px}.places-globe{--globe-size:min(88vw,390px)}.images-project-grid{grid-template-columns:1fr}.images-project-card{height:330px}.images-album-topbar{grid-template-columns:auto 1fr}.images-album-topbar>span{display:none}.images-album-grid{grid-template-columns:1fr;grid-auto-rows:280px}.images-album-photo:nth-child(n){grid-column:auto;grid-row:auto}.images-lightbox-nav{font-size:40px}.images-lightbox-nav.prev{left:8px}.images-lightbox-nav.next{right:8px}}

/* =========================================================
   SPAR10 IMAGES — GATEWAY-STYLE STAGE TRANSITION V6
   IMPORTANT: This does not alter the first-page gateway.
   ========================================================= */

/* Fixed transition layer lives above the site but below the selected division. */
.images-gateway-layer{
  position:fixed;
  inset:0;
  z-index:2400;
  pointer-events:none;
  overflow:hidden;
}
.images-gateway-cone,
.images-gateway-pool,
.images-gateway-veil{
  position:absolute;
  pointer-events:none;
}

/* The cone is aimed at the icon's actual on-screen location, so the icon
   doesn't have to jump to center just to meet the light. */
.images-gateway-cone{
  z-index:2;
  left:calc(var(--spot-x) - 230px);
  top:0;
  width:460px;
  height:calc(var(--spot-y) + 120px);
  opacity:0;
  transform:scaleX(.54);
  transform-origin:50% 0;
  clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);
  background:linear-gradient(
    180deg,
    rgba(255,255,242,.94) 0%,
    rgba(255,227,151,.48) 34%,
    rgba(215,154,255,.12) 72%,
    transparent 100%
  );
  transition:
    opacity .55s ease,
    transform .70s cubic-bezier(.18,.82,.22,1);
}
.images-gateway-pool{
  z-index:2;
  left:calc(var(--spot-x) - 185px);
  top:calc(var(--spot-y) + 78px);
  width:370px;
  height:118px;
  opacity:0;
  transform:translateY(-50%) scale(.76);
  border-radius:50%;
  background:radial-gradient(
    ellipse,
    rgba(255,235,184,.38) 0%,
    rgba(215,154,255,.12) 42%,
    transparent 74%
  );
  transition:
    opacity .55s ease,
    transform .70s cubic-bezier(.18,.82,.22,1);
}

/* Opaque handoff veil. It stays invisible until phase three. */
.images-gateway-veil{
  z-index:5;
  inset:0;
  background:#000;
  opacity:0;
  transition:opacity .42s ease;
}

.images-gateway-layer.phase-one .images-gateway-cone{
  opacity:.92;
  transform:scaleX(1);
}
.images-gateway-layer.phase-one .images-gateway-pool{
  opacity:1;
  transform:translateY(-50%) scale(1);
}

/* Room blackout occurs gradually while Images remains above it. */
.ecosystem-page.images-gateway-dim{
  position:relative;
  background:#000!important;
  transition:background-color .55s ease;
}
.ecosystem-page.images-gateway-dim .ecosystem-stage::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:205;
  pointer-events:none;
  background:#000;
  opacity:0;
  transition:opacity .55s ease;
}
.ecosystem-page.images-gateway-dim.phase-one .ecosystem-stage::after{
  opacity:.94;
}

.ecosystem-page.images-gateway-dim .ecosystem-eyebrow,
.ecosystem-page.images-gateway-dim .section-title{
  transition:opacity .48s ease;
}
.ecosystem-page.images-gateway-dim.phase-one .ecosystem-eyebrow,
.ecosystem-page.images-gateway-dim.phase-one .section-title{
  opacity:0;
}

/* Every non-selected division disappears into the darkness in place.
   No flying away and no blur-heavy compositor work. */
.ecosystem-page.images-gateway-dim .division-card{
  transition:
    opacity .48s ease,
    filter .48s ease!important;
}
.ecosystem-page.images-gateway-dim.phase-one
.division-card:not(.images-gateway-selected){
  opacity:0!important;
  filter:brightness(0)!important;
  pointer-events:none!important;
}

/* Selected Images icon stays where the visitor clicked it. */
.ecosystem-page .orbital-interface .division-card.images.images-gateway-selected{
  z-index:2600!important;
  visibility:visible!important;
  transition:
    opacity .48s ease,
    filter .55s ease,
    transform .55s ease!important;
}
.ecosystem-page.images-gateway-dim.phase-one
.division-card.images.images-gateway-selected{
  filter:
    brightness(1.10)
    drop-shadow(0 0 16px rgba(215,154,255,.60))!important;
}
.ecosystem-page.images-gateway-dim.phase-two
.division-card.images.images-gateway-selected{
  filter:
    brightness(1.22)
    drop-shadow(0 0 24px rgba(215,154,255,.80))
    drop-shadow(0 0 16px rgba(255,222,146,.30))!important;
}
.ecosystem-page.images-gateway-dim.phase-two
.division-card.images.images-gateway-selected .hex-frame{
  transform:scale(1.045);
  transition:transform .52s cubic-bezier(.18,.82,.22,1)!important;
}

/* The chosen icon dissolves at the same time the black veil arrives. */
.images-gateway-layer.phase-three .images-gateway-veil{
  opacity:1;
}
.ecosystem-page.images-gateway-dim.phase-three
.division-card.images.images-gateway-selected{
  opacity:0!important;
  filter:brightness(.6)!important;
}
.images-gateway-layer.phase-three .images-gateway-cone,
.images-gateway-layer.phase-three .images-gateway-pool{
  opacity:0;
  transition:opacity .34s ease;
}

/* Route changes behind black. Then this same layer simply fades away,
   revealing the already-rendered Images page underneath. */
.images-gateway-layer.reveal-destination .images-gateway-veil{
  opacity:0;
  transition:opacity .78s cubic-bezier(.22,.7,.22,1);
}

/* Hide only the chrome during the dark stage. It comes back with the page. */
body.images-gateway-running .site-header{
  opacity:0;
  transition:opacity .48s ease;
}

@media(prefers-reduced-motion:reduce){
  .images-gateway-cone,
  .images-gateway-pool,
  .images-gateway-veil,
  .ecosystem-page.images-gateway-dim .division-card,
  .ecosystem-page.images-gateway-dim .ecosystem-eyebrow,
  .ecosystem-page.images-gateway-dim .section-title{
    transition:none!important;
  }
}

/* =========================================================
   ABOUT PAGE — WHITE / GOLD MARBLE THEME (VISIBLE PASS)
   Uses: assets/backgrounds/about-marble.jpg
   ========================================================= */
.about-page{
  position:relative;
  isolation:isolate;
  background-color:#fbf8f2;
  background-image:
    linear-gradient(
      rgba(255,253,249,.34),
      rgba(250,246,238,.42)
    ),
    url("assets/backgrounds/about-marble.jpg");
  background-position:center top, center top;
  background-size:100% auto, 100% auto;
  background-repeat:repeat-y, repeat-y;
}

/* Very light center wash: protects readability without hiding the stone. */
.about-page::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(
    ellipse at 50% 44%,
    rgba(255,255,255,.24) 0%,
    rgba(255,255,255,.12) 42%,
    transparent 76%
  );
}

.about-page .about-video-section,
.about-page .about-body{
  position:relative;
  z-index:1;
}

/* The empty video frame now clearly sits on the marble instead of masking it. */
.about-page .about-video-placeholder{
  background:rgba(255,255,255,.20);
  border-color:rgba(191,142,49,.44);
  box-shadow:0 18px 48px rgba(91,67,28,.06);
  backdrop-filter:none;
}

/* Keep copy open on the page — only a faint invisible reading halo. */
.about-page .about-body::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:18px;
  bottom:42px;
  left:50%;
  width:min(1020px,92vw);
  transform:translateX(-50%);
  pointer-events:none;
  background:radial-gradient(
    ellipse at center,
    rgba(255,255,255,.22) 0%,
    rgba(255,255,255,.10) 54%,
    transparent 86%
  );
}

@media (max-width: 900px){
  .about-page{
    background-size:auto 560px, auto 560px;
    background-position:center top, center top;
  }

  .about-page .about-video-placeholder{
    background:rgba(255,255,255,.26);
  }
}


/* =========================================================
   SPAR10 IMAGES — TRUE 3D EARTH GLOBE V3
   Replaces the radar-style globe with WebGL Earth.
   ========================================================= */
.places-globe{
  --globe-size:min(50vw,560px);
  position:relative;
  width:var(--globe-size);
  height:var(--globe-size);
  border-radius:50%;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  cursor:grab;
}
.places-globe:active{cursor:grabbing}
.places-globe::before{
  content:"";
  position:absolute;
  inset:7%;
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
  background:radial-gradient(circle,rgba(216,169,72,.12) 0 46%,rgba(148,100,34,.07) 56%,transparent 72%);
  filter:blur(25px);
}
.places-globe-webgl{position:absolute;inset:-5%;z-index:2}
.places-globe-webgl canvas{display:block;width:100%!important;height:100%!important;filter:drop-shadow(0 28px 35px rgba(0,0,0,.52))}
.places-globe-fallback{position:absolute;inset:7%;border-radius:50%;z-index:1;opacity:0;pointer-events:none;transition:opacity .3s;background:url("assets/images/globe/earth-spar10.jpg") center/cover;box-shadow:inset -45px -20px 80px rgba(0,0,0,.72),0 0 40px rgba(195,145,49,.18)}
.places-globe-fallback.visible{opacity:1}
.places-globe-grid,.places-globe-shine,.places-pins{display:none!important}
.places-globe-aura{width:min(67vw,690px);background:radial-gradient(circle,rgba(202,155,58,.13),rgba(157,99,210,.035) 46%,transparent 72%);filter:blur(34px)}
.places-globe-caption{bottom:-6px}
@media(max-width:650px){.places-globe{--globe-size:min(92vw,430px)}.places-globe-webgl{inset:-2%}}


/* =========================================================
   SPAR10 IMAGES — CLEAN PHYSICAL EARTH V4
   Final overrides intentionally isolate the Places globe.
   ========================================================= */
.images-places-stage .places-globe-wrap{
  min-height:590px;
}

.images-places-stage .places-globe-aura{
  width:min(58vw,620px);
  opacity:.56;
  background:
    radial-gradient(circle,
      rgba(93,132,168,.085) 0 42%,
      rgba(49,72,96,.035) 52%,
      transparent 72%);
  filter:blur(42px);
}

.images-places-stage .places-globe{
  --globe-size:min(47vw,535px);
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible;
}

.images-places-stage .places-globe::before{
  inset:13%;
  opacity:.65;
  background:
    radial-gradient(circle,
      rgba(101,140,176,.08) 0 48%,
      rgba(101,140,176,.025) 58%,
      transparent 72%);
  filter:blur(34px);
}

.images-places-stage .places-globe-webgl{
  inset:-3%;
}

.images-places-stage .places-globe-webgl canvas{
  filter:
    drop-shadow(0 24px 34px rgba(0,0,0,.58))
    drop-shadow(0 0 14px rgba(89,126,158,.10));
}

.images-places-stage .places-globe-fallback{
  inset:9%;
  border:0;
  box-shadow:
    inset -34px -16px 62px rgba(0,0,0,.52),
    0 22px 40px rgba(0,0,0,.38);
}

.images-places-stage .places-globe-caption{
  bottom:0;
  color:#69655e;
}

.images-places-stage .places-globe-caption b{
  color:#b98b37;
}

/* The destination panel remains Spar10 gold; the planet itself does not. */
.images-places-stage .places-detail{
  border-left-color:rgba(213,166,67,.18);
}

@media(max-width:650px){
  .images-places-stage .places-globe{
    --globe-size:min(90vw,430px);
  }
}


/* =========================================================
   SPAR10 INDUSTRY ARTIFACT REFINEMENT
   Visual-only. Orbit geometry, movement, routing and label
   placement remain untouched.
   ========================================================= */
.ecosystem-page .orbital-interface .division-card.atlas{--artifact-a:#7d2e2e;--artifact-b:#21090b;--artifact-hot:#d8a25b}
.ecosystem-page .orbital-interface .division-card.images{--artifact-a:#263d57;--artifact-b:#07111c;--artifact-hot:#caa65b}
.ecosystem-page .orbital-interface .division-card.assets{--artifact-a:#315d6f;--artifact-b:#071a22;--artifact-hot:#b6c9d0}
.ecosystem-page .orbital-interface .division-card.impact{--artifact-a:#405f43;--artifact-b:#0c1b0e;--artifact-hot:#d0b66a}
.ecosystem-page .orbital-interface .division-card.fitness{--artifact-a:#4e4b2e;--artifact-b:#15150b;--artifact-hot:#cbb875}
.ecosystem-page .orbital-interface .division-card.tech{--artifact-a:#30585d;--artifact-b:#07191b;--artifact-hot:#b9a765}

/* remove the electric sweep and neon bloom while retaining the existing frame */
.ecosystem-page .orbital-interface .hex-frame::after{display:none}
.ecosystem-page .orbital-interface .hex-frame{
  box-shadow:0 18px 35px rgba(41,24,4,.24),0 0 calc(5px + 12px * var(--orbit-depth)) color-mix(in srgb,var(--artifact-a) 26%,transparent),inset 0 0 14px rgba(255,231,164,.30);
}
.ecosystem-page .orbital-interface .hex-frame::before{
  background:radial-gradient(circle at 48% 38%,color-mix(in srgb,var(--artifact-a) 18%,transparent),transparent 38%),linear-gradient(145deg,#020304 3%,var(--artifact-b) 52%,#010202 100%);
}
.ecosystem-page .orbital-interface .hex-frame img{
  filter:brightness(.92) contrast(1.05) sepia(.12) drop-shadow(0 2px 5px rgba(0,0,0,.45));
}
.ecosystem-page .orbital-interface .division-card::before{
  border-color:color-mix(in srgb,var(--artifact-hot) 42%,transparent);
  filter:none;
  opacity:calc(.28 + var(--orbit-depth) * .34);
}
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame{
  box-shadow:0 24px 46px rgba(20,10,1,.32),0 0 20px color-mix(in srgb,var(--artifact-a) 34%,transparent),inset 0 0 18px rgba(255,236,180,.34);
}
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame img{
  filter:brightness(1.03) contrast(1.07) sepia(.08) drop-shadow(0 3px 7px rgba(0,0,0,.48));
}
.ecosystem-page .orbital-interface .division-card.orbital-focus::before{filter:none}

/* quieter built-in symbols */
.ecosystem-page .orbital-interface .impact-symbol i{border-color:#d0b66a;box-shadow:none}
.ecosystem-page .orbital-interface .impact-symbol::before{filter:none;opacity:.62}
.ecosystem-page .orbital-interface .tech-symbol{color:#d2bc76;text-shadow:none;font-weight:500;opacity:.78}


/* =========================================================
   SPAR10 INDUSTRIES — HOLOGRAPHIC MEDALLION OVERRIDE
   2026-08-13
   Presentation only: orbit geometry, routes, labels and page positions remain intact.
   ========================================================= */
.ecosystem-page .orbital-interface .division-card{
  --glass-accent:var(--accent);
}

/* circular, transparent artifact instead of the former hexagonal chamber */
.ecosystem-page .orbital-interface .hex-frame,
.ecosystem-page .orbital-interface .industry-coin{
  width:168px;
  height:168px;
  aspect-ratio:1;
  border-radius:50%;
  clip-path:none;
  overflow:visible;
  padding:0;
  isolation:isolate;
  border:1px solid color-mix(in srgb,var(--glass-accent) 46%,#c69a42);
  background:
    radial-gradient(circle at 35% 26%,rgba(255,255,255,.42),transparent 24%),
    radial-gradient(circle at 50% 58%,color-mix(in srgb,var(--glass-accent) 11%,transparent),rgba(255,255,255,.035) 62%,transparent 76%);
  box-shadow:
    inset 0 0 0 5px rgba(255,255,255,.08),
    inset 0 0 24px color-mix(in srgb,var(--glass-accent) 10%,transparent),
    0 13px 24px rgba(49,37,20,.10),
    0 0 14px color-mix(in srgb,var(--glass-accent) 15%,transparent);
  backdrop-filter:blur(7px) saturate(112%);
  -webkit-backdrop-filter:blur(7px) saturate(112%);
  filter:none;
  transition:border-color .3s ease,box-shadow .3s ease,background .3s ease;
}

/* thin etched inner rings */
.ecosystem-page .orbital-interface .hex-frame::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:8px;
  border-radius:50%;
  clip-path:none;
  border:1px solid rgba(191,142,49,.40);
  background:transparent;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  pointer-events:none;
}
.ecosystem-page .orbital-interface .hex-frame::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:15px;
  border-radius:50%;
  background:linear-gradient(118deg,rgba(255,255,255,.18),transparent 31% 70%,rgba(255,255,255,.07));
  border:1px solid color-mix(in srgb,var(--glass-accent) 20%,transparent);
  pointer-events:none;
}

/* existing logo artwork becomes an etched hologram rather than a luminous tile */
.ecosystem-page .orbital-interface .hex-frame img{
  position:relative;
  z-index:3;
  width:70%;
  height:70%;
  padding:12%;
  object-fit:contain;
  clip-path:none;
  border-radius:0;
  background:transparent;
  opacity:.68;
  mix-blend-mode:multiply;
  filter:grayscale(.35) contrast(1.08) drop-shadow(0 0 4px color-mix(in srgb,var(--glass-accent) 30%,transparent));
  animation:none !important;
}

/* simplify the generated Impact / Tech marks to the same etched language */
.ecosystem-page .orbital-interface .impact-symbol,
.ecosystem-page .orbital-interface .tech-symbol{
  z-index:3;
  opacity:.66;
  filter:saturate(.65);
  text-shadow:none;
}
.ecosystem-page .orbital-interface .impact-symbol i{box-shadow:none}
.ecosystem-page .orbital-interface .impact-symbol::before{filter:none}

/* no electric perimeter animation */
.ecosystem-page .orbital-interface .hex-frame,
.ecosystem-page .orbital-interface .hex-frame::after{
  animation:none !important;
}

/* quiet professional focus */
.ecosystem-page .orbital-interface .division-card.orbital-focus{
  filter:none;
}
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame{
  border-color:color-mix(in srgb,var(--glass-accent) 72%,#d2ad5e);
  box-shadow:
    inset 0 0 0 5px rgba(255,255,255,.10),
    inset 0 0 28px color-mix(in srgb,var(--glass-accent) 14%,transparent),
    0 15px 28px rgba(49,37,20,.12),
    0 0 18px color-mix(in srgb,var(--glass-accent) 25%,transparent);
}
.ecosystem-page .orbital-interface .division-card.orbital-focus h3{color:var(--ink);text-shadow:none}

/* selection beam: inherits the selected industry's accent and rises vertically */
.ecosystem-page .orbital-interface .division-card::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:50%;
  top:calc(50% - 330px);
  width:34px;
  height:340px;
  transform:translateX(-50%) scaleY(.05);
  transform-origin:50% 100%;
  opacity:0;
  pointer-events:none;
  background:linear-gradient(to top,
    color-mix(in srgb,var(--glass-accent) 52%,transparent),
    color-mix(in srgb,var(--glass-accent) 15%,transparent) 62%,
    transparent);
  filter:blur(7px);
  transition:opacity .22s ease,transform .48s cubic-bezier(.2,.8,.2,1);
}
.ecosystem-page .orbital-interface .division-card.chosen-division::before{
  opacity:.62;
  transform:translateX(-50%) scaleY(1);
}
.ecosystem-page .orbital-interface .division-card.chosen-division .hex-frame{
  border-color:color-mix(in srgb,var(--glass-accent) 78%,#e1c16d);
  box-shadow:
    inset 0 0 0 5px rgba(255,255,255,.12),
    inset 0 0 30px color-mix(in srgb,var(--glass-accent) 18%,transparent),
    0 0 24px color-mix(in srgb,var(--glass-accent) 34%,transparent),
    0 16px 30px rgba(49,37,20,.12);
}

@media(max-width:820px){
  .ecosystem-page .orbital-interface .hex-frame,
  .ecosystem-page .orbital-interface .industry-coin{width:138px;height:138px}
}
@media(max-width:470px){
  .ecosystem-page .orbital-interface .hex-frame,
  .ecosystem-page .orbital-interface .industry-coin{width:112px;height:112px}
}

/* =========================================================
   SPAR10 INDUSTRIES — REFERENCE TOKEN APPEARANCE ONLY
   Matches the approved illuminated circular medallions.
   Orbit geometry, card positions, routing, copy, timing,
   transitions, page layout and all non-token systems remain unchanged.
   ========================================================= */

/* Division palette used only inside the physical tokens. */
.ecosystem-page .orbital-interface .division-card.atlas{
  --coin-dark:#082b40; --coin-mid:#1f7199; --coin-light:#bceaff; --coin-white:#effbff;
}
.ecosystem-page .orbital-interface .division-card.images{
  --coin-dark:#241039; --coin-mid:#7541a2; --coin-light:#e1b8ff; --coin-white:#f8efff;
}
.ecosystem-page .orbital-interface .division-card.assets{
  --coin-dark:#0b2942; --coin-mid:#397fa9; --coin-light:#b4e3ff; --coin-white:#effaff;
}
.ecosystem-page .orbital-interface .division-card.tech{
  --coin-dark:#4a3112; --coin-mid:#b67d2e; --coin-light:#ffe1a0; --coin-white:#fff7df;
}
.ecosystem-page .orbital-interface .division-card.fitness{
  --coin-dark:#451116; --coin-mid:#b13b3e; --coin-light:#ffaaa6; --coin-white:#fff1ef;
}
.ecosystem-page .orbital-interface .division-card.impact{
  --coin-dark:#0d392b; --coin-mid:#348965; --coin-light:#b3f2d3; --coin-white:#effff6;
}

/* Circular crystal/metal medallion body. */
.ecosystem-page .orbital-interface .hex-frame,
.ecosystem-page .orbital-interface .industry-coin{
  position:relative;
  width:180px;
  height:180px;
  aspect-ratio:1;
  margin:0 auto 22px;
  padding:0;
  border-radius:50%;
  clip-path:none;
  overflow:hidden;
  isolation:isolate;
  border:2px solid rgba(245,250,255,.82);
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.10) 0 10%, transparent 11%),
    radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--coin-mid) 42%,transparent) 0 35%, var(--coin-dark) 72%, #071017 100%);
  box-shadow:
    inset 0 0 0 3px rgba(255,255,255,.28),
    inset 0 0 0 7px color-mix(in srgb,var(--coin-light) 28%,transparent),
    inset 0 0 22px color-mix(in srgb,var(--coin-light) 16%,transparent),
    inset 0 -25px 38px rgba(0,0,0,.30),
    0 0 0 1px color-mix(in srgb,var(--coin-mid) 48%,transparent),
    0 0 12px color-mix(in srgb,var(--coin-light) 48%,transparent),
    0 0 30px color-mix(in srgb,var(--coin-mid) 34%,transparent),
    0 18px 24px rgba(44,31,13,.15);
  filter:none;
}

/* Precision-machined outer ring with the visible radial ticks from the reference. */
.ecosystem-page .orbital-interface .hex-frame::before{
  content:"";
  position:absolute;
  inset:5px;
  z-index:2;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.44);
  background:
    repeating-conic-gradient(
      from -1deg,
      rgba(245,252,255,.72) 0deg .65deg,
      transparent .65deg 5deg
    ),
    radial-gradient(circle,
      transparent 0 73%,
      color-mix(in srgb,var(--coin-light) 50%,transparent) 73.5% 75%,
      transparent 75.5% 100%
    );
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.14),
    inset 0 0 13px color-mix(in srgb,var(--coin-light) 28%,transparent),
    0 0 8px color-mix(in srgb,var(--coin-light) 40%,transparent);
  opacity:.96;
  pointer-events:none;
}

/* Inner circular grid/lens. */
.ecosystem-page .orbital-interface .hex-frame::after{
  content:"";
  position:absolute;
  inset:19px;
  z-index:1;
  display:block;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--coin-light) 58%,rgba(255,255,255,.45));
  background:
    linear-gradient(90deg, transparent 49.5%, color-mix(in srgb,var(--coin-light) 18%,transparent) 50%, transparent 50.5%),
    linear-gradient(0deg, transparent 49.5%, color-mix(in srgb,var(--coin-light) 18%,transparent) 50%, transparent 50.5%),
    repeating-radial-gradient(circle,
      transparent 0 20px,
      color-mix(in srgb,var(--coin-light) 15%,transparent) 20.5px 21.5px,
      transparent 22px 33px
    ),
    radial-gradient(circle at 50% 48%, color-mix(in srgb,var(--coin-mid) 14%,transparent), transparent 67%);
  box-shadow:
    inset 0 0 18px color-mix(in srgb,var(--coin-light) 18%,transparent),
    0 0 9px color-mix(in srgb,var(--coin-light) 24%,transparent);
  opacity:.90;
  pointer-events:none;
  animation:none !important;
}

/* Keep the existing identity art, but treat it like the bright etched icon in the goal image. */
.ecosystem-page .orbital-interface .hex-frame img{
  position:relative;
  z-index:4;
  width:72%;
  height:72%;
  padding:13%;
  object-fit:contain;
  clip-path:none;
  border-radius:0;
  background:transparent !important;
  opacity:1;
  mix-blend-mode:screen;
  animation:none !important;
  transform:none !important;
  filter:
    grayscale(.22)
    brightness(1.58)
    contrast(1.18)
    drop-shadow(0 0 3px rgba(255,255,255,.95))
    drop-shadow(0 0 9px var(--coin-light));
}

/* CSS-drawn Technology + Impact marks get the same luminous etched treatment. */
.ecosystem-page .orbital-interface .tech-symbol,
.ecosystem-page .orbital-interface .impact-symbol{
  position:relative;
  z-index:4;
  color:var(--coin-white) !important;
  opacity:1 !important;
  filter:none !important;
  text-shadow:
    0 0 2px #fff,
    0 0 8px var(--coin-light),
    0 0 16px color-mix(in srgb,var(--coin-mid) 80%,transparent) !important;
}
.ecosystem-page .orbital-interface .impact-symbol i{
  border-color:var(--coin-white) !important;
  box-shadow:0 0 5px var(--coin-light) !important;
}
.ecosystem-page .orbital-interface .impact-symbol::before{
  opacity:1 !important;
  filter:drop-shadow(0 0 6px var(--coin-light)) !important;
}

/* Optical highlight across the glass face. */
.ecosystem-page .orbital-interface .industry-coin{
  background-image:
    linear-gradient(125deg, rgba(255,255,255,.22) 2%, transparent 25% 65%, rgba(255,255,255,.055) 78%, transparent 90%),
    radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--coin-mid) 32%,transparent), var(--coin-dark) 70%, #070d12 100%);
}

/* The glowing base/ring underneath each medallion in the reference image. */
.ecosystem-page .orbital-interface .division-card::before{
  content:"";
  position:absolute;
  left:50%;
  top:174px;
  width:142px;
  height:22px;
  z-index:-1;
  transform:translateX(-50%);
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--coin-light) 56%,transparent);
  background:radial-gradient(ellipse at center,
    color-mix(in srgb,var(--coin-light) 28%,rgba(255,255,255,.20)) 0 22%,
    color-mix(in srgb,var(--coin-mid) 20%,transparent) 48%,
    transparent 72%);
  box-shadow:
    0 0 8px color-mix(in srgb,var(--coin-light) 48%,transparent),
    0 0 22px color-mix(in srgb,var(--coin-mid) 26%,transparent);
  pointer-events:none;
}

/* Restore the clean circular silhouette if an older token overlay exists. */
.ecosystem-page .orbital-interface .division-card::after{
  border-radius:50%;
  clip-path:none;
}

/* Hover: intensify illumination only; orbit motion/geometry is untouched. */
.ecosystem-page .orbital-interface .division-card.orbital-focus .hex-frame{
  box-shadow:
    inset 0 0 0 3px rgba(255,255,255,.34),
    inset 0 0 0 7px color-mix(in srgb,var(--coin-light) 34%,transparent),
    inset 0 0 28px color-mix(in srgb,var(--coin-light) 23%,transparent),
    inset 0 -25px 38px rgba(0,0,0,.26),
    0 0 0 1px color-mix(in srgb,var(--coin-light) 58%,transparent),
    0 0 18px color-mix(in srgb,var(--coin-light) 64%,transparent),
    0 0 42px color-mix(in srgb,var(--coin-mid) 44%,transparent),
    0 20px 27px rgba(44,31,13,.16);
}

@media(max-width:820px){
  .ecosystem-page .orbital-interface .hex-frame,
  .ecosystem-page .orbital-interface .industry-coin{width:145px;height:145px}
  .ecosystem-page .orbital-interface .division-card::before{top:140px;width:116px;height:18px}
}
@media(max-width:470px){
  .ecosystem-page .orbital-interface .hex-frame,
  .ecosystem-page .orbital-interface .industry-coin{width:118px;height:118px}
  .ecosystem-page .orbital-interface .division-card::before{top:114px;width:94px;height:15px}
}


/* =========================================================
   SPAR10 IMAGES — NATURAL GALAXY + CONSTELLATIONS
   Scoped only to the Spar10 Images portfolio experience.
   ========================================================= */
.images-portfolio-page{background:#020306}
.images-portfolio-shell{
  isolation:isolate;
  background:
    radial-gradient(ellipse at 54% 43%,rgba(91,103,135,.16) 0%,rgba(25,31,48,.08) 20%,transparent 43%),
    radial-gradient(ellipse at 18% 72%,rgba(37,57,78,.16) 0%,transparent 32%),
    radial-gradient(ellipse at 84% 20%,rgba(67,48,83,.12) 0%,transparent 30%),
    linear-gradient(180deg,#030407 0%,#050609 46%,#020305 100%);
}
.images-portfolio-shell::before{
  content:"";
  position:fixed;
  inset:102px 0 0;
  z-index:-3;
  pointer-events:none;
  opacity:.92;
  filter:none;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.95) 0 1px,transparent 1.25px),
    radial-gradient(circle,rgba(196,218,255,.70) 0 .8px,transparent 1.15px),
    radial-gradient(circle,rgba(255,242,205,.62) 0 .7px,transparent 1px),
    radial-gradient(ellipse at 48% 43%,rgba(111,123,151,.16),rgba(42,48,64,.06) 30%,transparent 58%),
    radial-gradient(ellipse at 13% 78%,rgba(72,97,122,.12),transparent 38%),
    radial-gradient(ellipse at 83% 26%,rgba(88,66,99,.10),transparent 34%);
  background-size:137px 137px,211px 211px,293px 293px,100% 100%,100% 100%,100% 100%;
  background-position:0 0,31px 53px,87px 19px,center,center,center;
}
.images-portfolio-shell::after{
  content:"";
  position:fixed;
  inset:102px 0 0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.10) 46%,rgba(0,0,0,.48)),
    radial-gradient(ellipse at center,transparent 43%,rgba(0,0,0,.45) 100%);
}
.images-ambient{
  z-index:-1;
  opacity:.34;
  background:
    repeating-linear-gradient(90deg,transparent 0 11.95%,rgba(218,177,87,.025) 12%,transparent 12.05%);
}
.images-constellations{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.constellation{position:absolute;overflow:visible;opacity:.48;filter:drop-shadow(0 0 6px rgba(220,232,255,.32))}
.constellation-lines{fill:none;stroke:rgba(220,230,245,.48);stroke-width:.8}
.constellation-stars{fill:#f7f5eb}
.constellation-stars circle{filter:drop-shadow(0 0 4px rgba(230,240,255,.9))}
.constellation text{fill:rgba(191,142,49,.78);font:500 9px Arial,Helvetica,sans-serif;letter-spacing:2.4px}
.constellation-ursa{width:225px;left:1.5%;top:30%}
.constellation-cassiopeia{width:190px;left:48%;top:21%}
.constellation-orion{width:170px;left:2%;top:61%}
.constellation-scorpius{width:165px;right:27%;top:59%}
.images-portfolio-header,.images-category-nav,.images-category-stage,.images-album{position:relative;z-index:3}
@media(max-width:900px){
  .constellation{opacity:.28;transform:scale(.82)}
  .constellation-ursa{left:-5%;top:34%}
  .constellation-cassiopeia{left:58%;top:24%}
  .constellation-orion{left:-7%;top:66%}
  .constellation-scorpius{right:-5%;top:63%}
}
@media(max-width:650px){.images-constellations{display:none}}

/* =========================================================
   SPAR10 BLACK / CYAN MASTER THEME
   Theme-only conversion. Existing routes, animation geometry,
   portfolio/globe behavior and division logic remain unchanged.
   ========================================================= */

:root{
  --ink:#f2fbff;
  --ink-soft:#9eb3be;
  --ivory:#03070a;
  --ivory-2:#071016;
  --gold:#00e5ff;
  --gold-light:#78f5ff;
  --gold-dark:#00a9c4;
}

/* GLOBAL */
html{background:#020406}
body{
  color:#f2fbff;
  background:
    radial-gradient(circle at 50% -10%,rgba(0,229,255,.09),transparent 32%),
    linear-gradient(180deg,#020406,#050a0e 52%,#020507);
}
#cursorGlow{
  opacity:.18;
  background:radial-gradient(circle,rgba(0,229,255,.55),rgba(0,229,255,.10) 34%,transparent 70%);
}

/* HEADER / NAV */
.site-header{
  background:
    linear-gradient(180deg,rgba(2,6,9,.96),rgba(3,8,12,.92));
  border-bottom:1px solid rgba(0,229,255,.34);
  box-shadow:0 8px 30px rgba(0,0,0,.42),0 0 22px rgba(0,229,255,.05);
  backdrop-filter:blur(16px);
}
.brand-helmet{
  filter:grayscale(1) brightness(1.8) contrast(1.1) drop-shadow(0 0 9px rgba(0,229,255,.30));
}
.brand-wordmark,
.hero-wordmark{
  filter:grayscale(1) brightness(3.2) contrast(1.25) drop-shadow(0 0 13px rgba(0,229,255,.38));
}
.desktop-nav button,
.mobile-menu{color:#eafaff}
.desktop-nav button::after{background:#00e5ff}
.dropdown{
  background:rgba(3,9,13,.98);
  border:1px solid rgba(0,229,255,.30);
  box-shadow:0 18px 50px rgba(0,0,0,.58),0 0 24px rgba(0,229,255,.06);
}
.dropdown button{border-bottom-color:rgba(0,229,255,.10);color:#dff9ff}
.dropdown button:hover{color:#78f5ff;background:rgba(0,229,255,.05)}
.mobile-drawer{
  background:rgba(3,9,13,.98)!important;
  border-bottom-color:rgba(0,229,255,.28)!important;
}
.mobile-drawer button{color:#e9fbff!important}

/* HOME GATEWAY */
.hero{background:#020609}
.hero-art{
  filter:grayscale(1) brightness(.33) contrast(1.38) saturate(.2);
}
.hero-shade{
  background:
    radial-gradient(circle at 50% 42%,rgba(0,229,255,.11),transparent 28%),
    linear-gradient(180deg,rgba(0,3,6,.08),rgba(0,4,7,.26) 38%,rgba(0,2,4,.76) 100%);
  box-shadow:inset 0 0 150px rgba(0,0,0,.62);
}
.portal-glow-left{
  background:linear-gradient(90deg,rgba(0,229,255,.46),transparent);
}
.portal-glow-right{
  background:linear-gradient(90deg,transparent,rgba(0,229,255,.46));
}
.gateway-vignette{
  box-shadow:inset 0 0 180px rgba(0,0,0,.88)!important;
}
.gateway-beam{
  background:linear-gradient(90deg,transparent,rgba(0,229,255,.13),transparent)!important;
}
.hero-content{color:#f6fcff}
.latin{
  color:#dffaff;
  text-shadow:0 0 12px rgba(0,229,255,.32),0 2px 12px rgba(0,0,0,.8);
}
.ornament,.tiny-diamond{color:#78f5ff}
.ornament span{
  background:linear-gradient(90deg,transparent,#00e5ff)!important;
}
.ornament span:last-child{
  background:linear-gradient(90deg,#00e5ff,transparent)!important;
}
.industry-title{
  color:#78f5ff;
  text-shadow:0 0 12px rgba(0,229,255,.42);
}
.industry-title span{
  background:linear-gradient(90deg,transparent,#00e5ff,transparent);
}
.hero-statement{
  color:#f4fbff;
  text-shadow:0 2px 10px #000,0 0 16px rgba(0,229,255,.16);
}
.ecosystem-button{
  border:1px solid #00e5ff;
  background:linear-gradient(180deg,rgba(0,229,255,.16),rgba(0,107,130,.18));
  color:#effcff;
  box-shadow:0 0 22px rgba(0,229,255,.38),inset 0 0 24px rgba(0,229,255,.06);
}
.ecosystem-button b{color:#78f5ff}
.ecosystem-button:hover{
  background:linear-gradient(180deg,rgba(0,229,255,.26),rgba(0,107,130,.23));
  box-shadow:0 0 38px rgba(0,229,255,.60),inset 0 0 30px rgba(0,229,255,.10);
}

/* HUB / INDUSTRIES */
.divisions,
.ecosystem-page,
.ecosystem-stage{
  background:
    radial-gradient(circle at 50% 38%,rgba(0,229,255,.075),transparent 29%),
    linear-gradient(180deg,#020609,#061018 50%,#020609)!important;
}
.ecosystem-page{
  color:#f2fbff;
}
.ecosystem-eyebrow,
.corporate-wordmark-inline{color:#65efff!important}
.section-title h2{color:#eefcff}
.section-rule{color:#00e5ff}
.section-rule span{
  background:linear-gradient(90deg,transparent,#00e5ff,transparent);
}
.section-title p{color:#8faab6}
.division-card{color:#f3fbff}
.division-card p{color:#7fb4c0}
.hex-frame{
  background:linear-gradient(145deg,#78f5ff,#007d98 44%,#00e5ff 72%,#004d61);
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.52)) drop-shadow(0 0 8px rgba(0,229,255,.16));
}
.hex-frame img{
  background:
    radial-gradient(circle at 50% 44%,rgba(18,31,38,.98),rgba(5,12,17,.96) 62%,rgba(1,5,8,.98));
}
.division-card:hover .hex-frame{
  filter:drop-shadow(0 0 13px color-mix(in srgb,var(--accent) 70%,transparent)) drop-shadow(0 18px 18px rgba(0,0,0,.55));
}

/* ALL INTERIOR / DIVISION PAGES */
.interior,
.division-page,
.tech-page,
.images-page{
  color:#eefaff!important;
  background:
    radial-gradient(circle at 50% 0,rgba(0,229,255,.07),transparent 30%),
    linear-gradient(180deg,#03080c,#071118 48%,#020609)!important;
}
.interior-hero,
.division-hero,
.about-page .about-hero{
  border-bottom-color:rgba(0,229,255,.22)!important;
  background:
    radial-gradient(circle at 50% 20%,rgba(0,229,255,.08),transparent 34%),
    linear-gradient(180deg,rgba(4,11,16,.96),rgba(2,7,10,.99))!important;
}
.interior-hero small,
.division-page small,
.tech-hero small,
.tech-feature small{color:#56efff!important}
.interior-hero h1,
.interior-body h2,
.team-intro h2,
.division-page h1,
.division-page h2,
.division-page h3{color:#f1fbff!important}
.interior-hero p,
.interior-body p,
.team-intro p,
.division-page p{color:#a4b6bf!important}
.division-line{background:#00e5ff!important}
.division-page a{color:#68f1ff!important}

/* ABOUT */
.about-page .about-video-section{
  background:linear-gradient(180deg,#03090d,#050d12)!important;
}
.about-page .about-video-placeholder{
  border-color:rgba(0,229,255,.42)!important;
  background:rgba(0,229,255,.025)!important;
  box-shadow:0 14px 42px rgba(0,0,0,.38),0 0 25px rgba(0,229,255,.06)!important;
  color:#62f0ff!important;
}
.about-page .about-video-placeholder small{color:#78909a!important}
.about-page .about-body{background:transparent!important}
.about-page .about-body p{color:#a9bac2!important}
.about-page .about-emphasis{color:#eefcff!important}
.about-page .about-closing{
  border-top-color:rgba(0,229,255,.24)!important;
}
.about-page .about-closing p:last-child{color:#68efff!important}
.about-page .about-crest-watermark{opacity:.055!important}
.about-page .about-crest-watermark img{
  filter:grayscale(1) brightness(1.8) sepia(.15) hue-rotate(145deg) saturate(4)!important;
}

/* GENERIC CARDS / GRIDS / CONTACT */
.principle-grid article,
.initiative-grid article,
.contact-grid a,
.service-card,
.tech-service-grid article,
.images-album-card{
  color:#eefaff!important;
  background:linear-gradient(145deg,rgba(8,18,24,.92),rgba(3,9,13,.96))!important;
  border-color:rgba(0,229,255,.20)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.34)!important;
}
.principle-grid b,
.initiative-grid b,
.contact-grid small{color:#5ff0ff!important}
.principle-grid p,
.initiative-grid p{color:#9eb1bb!important}
.contact-grid{
  background:rgba(0,229,255,.16)!important;
}

/* TECH PAGE */
.tech-page{background:#03090d!important;color:#effcff!important}
.tech-hero{
  border-bottom-color:rgba(0,229,255,.32)!important;
  background:
    radial-gradient(circle at 76% 47%,rgba(0,229,255,.13),transparent 28%),
    radial-gradient(circle at 20% 30%,rgba(19,42,51,.34),transparent 35%),
    linear-gradient(180deg,#050b10,#020609)!important;
}
.tech-hero h1,
.tech-section-title h2,
.tech-feature h2,
.tech-cta h2{color:#f4fcff!important}
.tech-hero p,
.tech-feature p,
.tech-service-grid p,
.tech-process-grid p,
.tech-cta p{color:#9fb3bd!important}
.tech-button{
  border-color:#00e5ff!important;
  background:rgba(0,229,255,.06)!important;
  color:#62f0ff!important;
  box-shadow:0 0 18px rgba(0,229,255,.10);
}
.tech-artifact,
.tech-core,
.tech-hero-seal{
  background:linear-gradient(145deg,#7bf6ff 0%,#006f88 24%,#00dff8 47%,#003a49 72%,#55ecff 100%)!important;
  filter:drop-shadow(0 28px 28px rgba(0,0,0,.55)) drop-shadow(0 0 20px rgba(0,229,255,.22))!important;
}
.tech-artifact::before{
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 2px,transparent 2px 7px),
    radial-gradient(circle at center,rgba(0,229,255,.20),transparent 42%),
    linear-gradient(145deg,#07151c,#02070a)!important;
}
.tech-outcomes{
  border-color:rgba(0,229,255,.26)!important;
  background:linear-gradient(90deg,#020609,#07151c 50%,#020609)!important;
}
.tech-section{
  background:radial-gradient(circle at 50% 0,rgba(0,229,255,.06),transparent 40%)!important;
}
.tech-feature{
  border-color:rgba(0,229,255,.18)!important;
  background:linear-gradient(180deg,rgba(5,13,18,.96),rgba(2,7,10,.98))!important;
}
.tech-process{background:rgba(0,229,255,.025)!important}
.tech-cta{
  border-color:rgba(0,229,255,.42)!important;
  background:
    radial-gradient(circle at center,rgba(0,229,255,.065),transparent 48%),
    linear-gradient(180deg,#061017,#02070a)!important;
  box-shadow:inset 0 0 0 8px rgba(0,229,255,.018),0 14px 35px rgba(0,0,0,.42)!important;
}

/* IMAGES PORTFOLIO — preserve the Earth/globe itself */
.images-page,
.images-portfolio,
.images-category-stage,
.images-album{
  background-color:#02070a!important;
  color:#edfaff!important;
}
.images-portfolio-header,
.images-category-nav{
  border-color:rgba(0,229,255,.16)!important;
}
.images-category-nav button{
  color:#97aeb8!important;
}
.images-category-nav button:hover,
.images-category-nav button.active{
  color:#70f2ff!important;
  border-color:#00e5ff!important;
}
.constellation-lines{stroke:rgba(88,235,255,.32)!important}
.constellation-stars{fill:#eafbff!important}
.constellation text{fill:rgba(88,235,255,.72)!important}

/* CYANIZE GENERIC GOLD DECORATIVE ELEMENTS WITHOUT ALTERING
   THE INDIVIDUAL DIVISION IDENTITY COLORS */
[style*="191,142,49"]{border-color:rgba(0,229,255,.30)!important}

/* SCROLLBAR */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#020609}
::-webkit-scrollbar-thumb{
  background:linear-gradient(#006f88,#00dff8,#006f88);
  border:2px solid #020609;
}

/* MOBILE DARK THEME */
@media(max-width:900px){
  .site-header{background:rgba(2,7,10,.97)!important}
  .ecosystem-page,.ecosystem-stage{background:#02070a!important}
}