/* Canonical hero system. Blender provides imagery; HTML owns content and controls. */
.hero,.hero-subpage,.cert-hero {
  position:relative; isolation:isolate; overflow:hidden;
  padding:calc(var(--header-height) + 3.5rem) 0 4rem;
  background:radial-gradient(ellipse at 80% 50%,#e7eee6 0,transparent 55%),var(--surface);
}
.hero>.container,.hero-subpage>.container {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;gap:2.5rem;}
.hero-content,.hero-subpage-content {min-width:0;max-width:39rem;}
.hero h1,.hero-subpage h1 {font-size:clamp(2.25rem,3.5vw,3.7rem);line-height:1.07;letter-spacing:-.045em;font-weight:750;margin:0 0 1.5rem;max-width:16ch;text-wrap:balance;}
.hero--home h1 {font-size:clamp(2.6rem,3.65vw,3.85rem);}
.hero-chip {display:inline-flex;align-items:center;gap:.65rem;color:var(--primary);font-size:.74rem;font-weight:750;letter-spacing:.09em;text-transform:uppercase;margin-bottom:1.25rem;}
.hero-chip::before {content:'';width:1.3rem;height:2px;background:currentColor;}
.hero-lead {font-size:1.075rem;line-height:1.7;color:var(--on-surface-variant);max-width:35rem;margin-bottom:1.5rem;}
.hero-support,.hero-note {font-size:.9rem;color:var(--on-surface-variant);line-height:1.65;max-width:35rem;margin:0 0 1.25rem;}
.hero-support--strong {font-weight:550;}
.hero-ctas {display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0 1rem;}
.hero-ctas .btn {font-size:.9rem;}
.hero-title-lock {white-space:normal;}
.hero-subpage-visual,.hero-visual {position:relative;min-width:0;}
.hero-subpage-visual picture,.hero-visual-frame {display:block;width:100%;}
.hero-subpage-visual img,.hero-visual-img {width:100%;height:auto;object-fit:contain;}
.hero-subpage--about .hero-subpage-visual {max-width:25rem;justify-self:center;}
.hero-subpage--about .hero-subpage-visual img {border-radius:1rem;max-height:32rem;object-fit:cover;object-position:center 20%;}
.hero-subpage--survey .hero-subpage-visual {max-width:30rem;justify-self:center;}
.cert-hero .container {position:relative;z-index:1;}
.cert-hero-panel {max-width:53rem;margin:auto;text-align:center;}
.cert-hero h1 {font-size:clamp(2.4rem,4vw,4rem);line-height:1.1;margin-bottom:1.25rem;}
.hero-motion-field {position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.52;mask-image:linear-gradient(90deg,transparent 25%,#000 85%);}
/* Asset, semantic hotspots and a stable explanation panel. */
.system-hero {min-width:0;}
.system-stage {position:relative;aspect-ratio:6/5;}
.system-stage>picture,.system-stage>.module-lift {position:absolute;inset:0;display:block;}
.system-stage img {display:block;width:100%;height:100%;object-fit:contain;}
.system-stage>picture img {filter:drop-shadow(0 14px 13px rgba(13,54,34,.16));}
.system-stage>.module-lift {pointer-events:none;display:none;transition:transform .3s;}
.system-stage.is-layered>picture {visibility:hidden;}
.system-stage.is-layered>.module-lift {display:block;position:absolute;inset:0;}
.system-stage>.module-lift.is-active {transform:translateY(-4px);}
.is-premium .system-stage {isolation:isolate;}
.module-float {position:absolute;inset:0;filter:drop-shadow(0 11px 10px rgba(13,54,34,.14));}
.module-float img {position:absolute;inset:0;transition:opacity .65s ease;}
.module-float .module-active {opacity:0;}
.module-lift.is-active .module-active {opacity:1;}
.module-lift.is-active .module-idle {opacity:0;}
.is-premium[data-motion=active] .module-float {animation:module-float 8.6s ease-in-out infinite;will-change:transform;}
.is-premium[data-motion=active] .module-lift[data-module=hub] .module-float {--float-x:.35px;--float-y:-1.9px;animation-duration:9.2s;animation-delay:-2.1s;}
.is-premium[data-motion=active] .module-lift[data-module=training] .module-float {--float-x:-.45px;--float-y:-2.4px;animation-duration:8.1s;animation-delay:-4.7s;}
.is-premium[data-motion=active] .module-lift[data-module=implementation] .module-float {--float-x:.5px;--float-y:-1.5px;animation-duration:10.1s;animation-delay:-1.2s;}
.is-premium[data-motion=active] .module-lift[data-module=web] .module-float {--float-x:-.3px;--float-y:-2.2px;animation-duration:8.8s;animation-delay:-5.8s;}
.is-premium[data-motion=active] .module-lift[data-module=security] .module-float {--float-x:.25px;--float-y:-1.7px;animation-duration:9.7s;animation-delay:-3.4s;}
.is-premium[data-motion=active] .module-lift[data-module=agents] .module-float {--float-x:-.4px;--float-y:-2px;animation-duration:8.4s;animation-delay:-6.2s;}
.is-premium[data-state=expanded] .module-lift.is-active .module-float {animation:glass-shimmer 4s ease-in-out infinite;}
@keyframes module-float {0%,100% {transform:translate3d(0,0,0);}46% {transform:translate3d(var(--float-x,0),var(--float-y,-1.8px),0);}76% {transform:translate3d(0,.35px,0);}}
@keyframes glass-shimmer {0%,100% {filter:drop-shadow(0 11px 10px rgba(13,54,34,.14)) brightness(1);}50% {filter:drop-shadow(0 13px 11px rgba(13,54,34,.17)) brightness(1.035);}}
.is-premium[data-motion=active] .module-lift.is-active .module-active {animation:module-arrival 2.25s cubic-bezier(.2,.8,.2,1) both;}
@keyframes module-arrival {0% {filter:brightness(1);}36% {filter:brightness(1.13) saturate(1.08);}100% {filter:brightness(1) saturate(1);}}
.is-premium .system-hotspot {width:16%;height:16%;border-radius:18%;}
.is-premium .system-hotspot[data-module=hub] {width:28%;height:25%;}
.is-premium .system-hotspot span {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);}
.is-premium .system-hotspot:is(:hover,:focus-visible,.is-active) span {background:#f6f3eedb;color:var(--primary);}
.system-paths {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;}
.system-paths path {fill:none;stroke:#167551;stroke-width:.27;opacity:0;stroke-dasharray:1 1.4;}
.system-paths path.is-active {opacity:.7;animation:system-signal 3s linear infinite;}
.is-premium .system-paths path {stroke:#baffdf;stroke-width:.45;stroke-dasharray:12 88;filter:drop-shadow(0 0 2px #1feb9b);}
.is-premium .system-paths path.is-active {opacity:1;animation:optical-pulse 2.05s cubic-bezier(.18,.72,.22,1) both;will-change:stroke-dashoffset,opacity;}
.system-node {fill:#d5ffe8;opacity:0;filter:drop-shadow(0 0 2px #1feb9b);}
.system-node.is-active {animation:node-activation 2.05s ease-out both;will-change:opacity;}
.system-node.node-1 {animation-delay:.48s;}
.system-node.node-2 {animation-delay:.96s;}
@keyframes node-activation {0%,18%,100% {opacity:0;}28%,47% {opacity:1;}}
@keyframes optical-pulse {0% {stroke-dashoffset:100;opacity:.18;}15%,72% {opacity:1;}100% {stroke-dashoffset:-100;opacity:.18;}}
@keyframes system-signal {to {stroke-dashoffset:-12;}}
.system-hotspot {position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:3;display:grid;place-items:center;min-width:44px;min-height:44px;padding:.35rem .55rem;border:0;background:transparent;color:var(--primary);font:inherit;cursor:pointer;}
.system-hotspot span {display:block;padding:.3rem .55rem;border-radius:.45rem;background:rgba(246,243,238,.96);box-shadow:0 1px 5px #143d1d10;font-size:.68rem;line-height:1.25;font-weight:750;white-space:nowrap;border:1px solid #0f5a351a;transition:background .2s,transform .2s;}
.system-hotspot:is(:hover,:focus-visible,.is-active) span {background:var(--primary);color:white;transform:translateY(-2px);}
.system-hotspot:focus-visible {outline:2px solid var(--primary);outline-offset:0;border-radius:.7rem;}
.system-explanation {min-height:7.25rem;padding:1rem 1.1rem;border-top:1px solid #0f5a3526;display:grid;gap:.35rem;align-content:start;}
.system-explanation strong {font-size:.9rem;}
.system-explanation p {font-size:.82rem;line-height:1.6;color:var(--on-surface-variant);margin:0;}
.system-explanation a {font-size:.8rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.system-caption {display:flex;justify-content:space-between;gap:.75rem;font-size:.67rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:0 1.1rem .6rem;}
.system-details {font-size:.84rem;margin:.5rem 1.1rem 0;}
.system-details summary {cursor:pointer;min-height:32px;color:var(--primary);font-weight:650;}
.system-details ul {display:grid;gap:.65rem;list-style:none;padding:.5rem 0 0;}
.system-details li a {font-weight:700;text-decoration:underline;}
.system-details li p {font-size:.82rem;color:var(--on-surface-variant);margin:.15rem 0 0;}
.system-hotspot[hidden],.system-explanation[hidden] {display:none;}
.system-hero[data-motion=static] .system-paths [data-module] {animation:none;}
.system-hero[data-motion=static] .module-lift.is-active {transform:none;}
.system-hero[data-motion=static] .module-float {animation:none;filter:none;transform:none;}
/* The complete program is retained. A local table of contents reduces searching. */
.local-nav {position:sticky;top:var(--header-height);z-index:10;background:#f6f3eef5;border-block:1px solid var(--outline-variant);backdrop-filter:blur(10px);}
.local-nav>.container {display:flex;gap:.3rem;padding-block:.45rem;overflow-x:auto;scrollbar-width:thin;}
.local-nav a {flex:0 0 auto;padding:.55rem .75rem;min-height:42px;font-size:.8rem;font-weight:650;border-radius:.5rem;}
.local-nav a:hover {background:var(--primary-fixed-dim);}
.portfolio-index {display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0;}
.portfolio-index a {font-size:.8rem;padding:.4rem .7rem;border:1px solid var(--outline-variant);border-radius:2rem;min-height:38px;display:flex;align-items:center;}
.selected-work {display:grid;grid-template-columns:1.25fr 1fr;gap:2.5rem;align-items:center;padding:2rem 0;border-top:1px solid var(--outline-variant);}
.selected-work img {width:100%;border:1px solid var(--outline-variant);border-radius:.75rem;}
.selected-work h3 {font-size:clamp(1.6rem,2.5vw,2.2rem);line-height:1.15;margin:.6rem 0 1rem;letter-spacing:-.035em;}
.selected-work p {font-size:.95rem;color:var(--on-surface-variant);margin-bottom:1rem;}
.selected-work dl {display:grid;gap:.7rem;margin:1.2rem 0;}
.selected-work dt {font-size:.7rem;font-weight:750;text-transform:uppercase;letter-spacing:.07em;color:var(--primary);}
.selected-work dd {font-size:.9rem;margin-top:.2rem;}
.selected-work a {font-size:.9rem;font-weight:700;text-decoration:underline;text-underline-offset:4px;}
.case-flow {display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:1.25rem 0 0;padding:1rem 0 0;border-top:1px solid var(--outline-variant);}
.case-flow li {font-size:.8rem;color:var(--primary);font-weight:650;}
.case-flow li+li::before {content:'→';margin-right:.6rem;}
.case-study--featured {border-left:3px solid var(--primary);}
.cert-preview img {width:100%;height:100%;object-fit:contain;background:white;}
.cert-preview>a {display:block;height:100%;}
.cert-description {font-size:.85rem;margin:0 0 1rem;color:var(--on-surface-variant);}
@media (max-width:959px) {
  .hero,.hero-subpage {padding:calc(var(--header-height) + 2rem) 0 2.5rem;}
  .hero>.container,.hero-subpage>.container {grid-template-columns:1fr;gap:1rem;}
  .hero h1,.hero-subpage h1 {font-size:clamp(2.3rem,5.5vw,3.5rem);max-width:21ch;}
  .hero-content,.hero-subpage-content {max-width:45rem;}
  .hero-lead {max-width:42rem;}
  .system-hero {width:min(100%,40rem);justify-self:center;}
  .system-stage {aspect-ratio:10/7;}
  .system-paths {display:none;}
  .system-hotspot {left:var(--mx);top:var(--my);}
  .system-hotspot span {font-size:.65rem;}
  .is-premium .system-hotspot:not([data-module=hub]) span {position:relative;width:auto;height:auto;clip-path:none;overflow:visible;background:#f6f3eef5;border:1px solid #0f5a351a;color:var(--primary);font-size:.66rem;line-height:1.15;text-align:center;white-space:normal;max-width:5.7rem;padding:.2rem .3rem;}
  .system-explanation {min-height:7.25rem;}
  .system-caption {padding-top:.35rem;}
  .hero-subpage-visual {width:min(100%,34rem);justify-self:center;}
  .hero-subpage--service .hero-subpage-visual {width:min(100%,29rem);}
  .hero-subpage--service .hero-subpage-visual img {max-height:19rem;}
  .hero-subpage--about .hero-subpage-visual {max-width:19rem;}
  .selected-work {gap:1.5rem;}
}
@media (max-width:600px) {
  .hero,.hero-subpage {padding-top:calc(var(--header-height) + 1.5rem);}
  .hero h1,.hero-subpage h1 {font-size:2.35rem;line-height:1.1;max-width:19ch;}
  .hero-lead {font-size:1rem;line-height:1.65;margin-bottom:1rem;}
  .hero-chip {font-size:.68rem;margin-bottom:1rem;}
  .hero-ctas {gap:.6rem;margin:1.1rem 0 .6rem;}
  .hero-ctas .btn {padding:.8rem 1rem;font-size:.84rem;min-height:46px;}
  .hero-support {font-size:.85rem;}
  .system-hotspot span {font-size:.6rem;padding:.25rem .4rem;white-space:normal;max-width:7rem;}
  .system-caption {font-size:.59rem;}
  .system-explanation {min-height:8rem;padding:.8rem;}
  .system-explanation p {font-size:.8rem;}
  .system-details {margin-inline:.8rem;}
  .selected-work {grid-template-columns:1fr;gap:1.1rem;padding:1.5rem 0;}
  .local-nav a {font-size:.75rem;padding:.5rem .6rem;}
}
@media (prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
  .system-paths path {animation:none;}
  .system-stage>.module-lift,.system-hotspot span {transition:none;transform:none;}
  .module-float,.module-float img {animation:none;transition:none;}
}