.hero-copy strong{
  color:var(--oak-primary);
  font-weight:inherit
}

.hero-stage{
  position:relative;
  min-width:0;
  min-height:35rem;
  overflow:hidden
}

.hero-scene{
  position:absolute;
  inset:-2rem -3rem -2rem -1rem;
  width:calc(100% + 4rem);
  height:calc(100% + 4rem);
  object-fit:contain;
  filter:drop-shadow(0 28px 48px rgba(90,23,66,.09))
}

.hero-terminal{
  position:absolute;
  z-index:2;
  left:7%;
  right:0;
  top:15%;
  height:21rem;
  max-width:100%;
  overflow:hidden;
  border:1px solid rgba(105,45,82,.25);
  border-radius:var(--oak-radius-md);
  background:rgba(36,18,31,.95);
  box-shadow:var(--oak-shadow-dark);
  backdrop-filter:blur(18px)
}

.hero-terminal-head{
  height:2.8rem;
  display:flex;
  align-items:center;
  min-width:0;
  padding-inline:1rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#bdaab6;
  font:var(--oak-fs-0)/1 var(--oak-font-mono)
}

.hero-lights{
  display:flex;
  flex:none;
  gap:.45rem
}

.hero-lights i{
  width:.5rem;
  height:.5rem;
  border-radius:50%;
  background:#725c6b
}

.hero-lights i:first-child{
  background:var(--oak-accent);
  box-shadow:0 0 .8rem rgba(240,68,192,.7)
}

.hero-term-title{
  min-width:0;
  margin:auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  transform:translateX(-1rem)
}

.hero-terminal-body{
  height:18.2rem;
  max-width:100%;
  overflow:hidden;
  padding:1rem 1.2rem;
  color:#eadde6;
  font:.75rem/1.75 var(--oak-font-mono)
}

.hero-terminal-lines{
  min-width:max-content;
  animation:terminal-slide 12s ease-in-out infinite
}

.hero-terminal-lines div{
  min-height:1.3rem
}

.term-prompt{
  color:#f05cc2
}

.term-output{
  color:#b9a6b2
}

.term-ok{
  color:#f388d5
}

.term-dim{
  color:#806b79
}

@keyframes terminal-slide{
  0%,20%{transform:translateY(0)}
  35%,52%{transform:translateY(-4.6rem)}
  67%,84%{transform:translateY(-9.2rem)}
  96%,100%{transform:translateY(-13.8rem)}
}

.hero-chip{
  position:absolute;
  z-index:3;
  display:flex;
  align-items:center;
  min-width:0;
  max-width:100%;
  gap:.7rem;
  padding:.7rem .85rem;
  border:1px solid var(--oak-line-strong);
  border-radius:var(--oak-radius-sm);
  background:rgba(255,255,255,.86);
  box-shadow:var(--oak-shadow-sm);
  backdrop-filter:blur(16px)
}

.hero-chip strong,
.hero-chip small{
  display:block
}

.hero-chip strong{
  font:.75rem/1.5 var(--oak-font-mono)
}

.hero-chip small{
  color:var(--oak-soft);
  font-size:.65rem
}

.hero-chip-one{
  right:0;
  top:3%
}

.hero-chip-two{
  left:0;
  bottom:7%
}

.hero-chip-icon{
  width:2rem;
  height:2rem;
  display:grid;
  place-items:center;
  flex:none;
  border-radius:.65rem;
  color:var(--oak-primary);
  background:var(--oak-tint)
}

.hero-chip-icon svg{
  width:1rem
}

.hero-note{
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  margin-top:1.2rem;
  color:var(--oak-muted);
  font-size:var(--oak-fs-0)
}

.hero-note svg{
  width:1rem;
  flex:none;
  margin-top:.3rem;
  color:var(--oak-primary)
}

.trust-bar{
  border-block:1px solid var(--oak-line);
  background:rgba(255,255,255,.45)
}

.trust-inner{
  min-height:5.2rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem
}

.trust-items{
  display:flex;
  flex-wrap:wrap;
  min-width:0;
  gap:clamp(1rem,3vw,2rem)
}

.trust-item{
  display:flex;
  align-items:center;
  min-width:0;
  gap:.5rem;
  color:var(--oak-text);
  font-size:var(--oak-fs-1);
  font-weight:650
}

.trust-item svg{
  width:1rem;
  flex:none;
  color:var(--oak-primary)
}

.position-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:var(--oak-space-2)
}

.position-grid>*,
.position-side>*{
  min-width:0
}

.position-main{
  position:relative;
  min-height:22rem;
  overflow:hidden;
  padding:var(--oak-space-4)
}

.position-main::after{
  content:"PHYSICAL";
  position:absolute;
  right:-.5rem;
  bottom:-2rem;
  max-width:100%;
  color:rgba(197,26,131,.045);
  font:800 4.6rem/1 var(--oak-font-mono);
  letter-spacing:-.08em;
  pointer-events:none
}

.position-main p{
  position:relative;
  z-index:1;
  max-width:44rem
}

.position-main .oak-cluster{
  position:relative;
  z-index:1;
  margin-top:var(--oak-space-3)
}

.position-ratio{
  width:3.25rem;
  height:3.25rem;
  display:grid;
  place-items:center;
  margin-bottom:2.2rem;
  border-radius:1rem;
  color:#fff;
  background:var(--oak-ink);
  font:var(--oak-fs-1)/1 var(--oak-font-mono)
}

.position-side{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--oak-space-2)
}

.position-mini{
  padding:1.4rem
}

.position-mini svg{
  width:2rem;
  padding:.4rem;
  border-radius:.6rem;
  color:var(--oak-primary);
  background:var(--oak-tint)
}

.position-mini h3{
  margin:1.4rem 0 .5rem;
  font-size:var(--oak-fs-2)
}

.position-mini p{
  margin:0;
  font-size:var(--oak-fs-1)
}

.region-layout{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:var(--oak-space-4);
  align-items:center
}

.region-layout>*{
  min-width:0
}

.region-guides{
  display:grid;
  gap:var(--oak-space-1);
  margin-block:var(--oak-space-3)
}

.region-guides div{
  display:grid;
  grid-template-columns:7rem minmax(0,1fr);
  gap:var(--oak-space-2);
  padding-bottom:var(--oak-space-1);
  border-bottom:1px solid var(--oak-line)
}

.region-guides strong{
  font-family:var(--oak-font-heading);
  font-size:var(--oak-fs-1)
}

.region-guides span{
  color:var(--oak-muted);
  font-size:var(--oak-fs-1)
}

.region-map{
  position:relative;
  min-height:24rem;
  overflow:hidden
}

.region-map>svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%
}

.map-grid{
  stroke:var(--oak-primary);
  stroke-opacity:.08
}

.map-route{
  stroke:var(--oak-primary);
  stroke-opacity:.3;
  stroke-dasharray:5 7
}

.map-points{
  fill:var(--oak-primary)
}

.map-rings{
  fill:none;
  stroke:var(--oak-accent);
  stroke-opacity:.35
}

.region-list{
  position:absolute;
  left:1rem;
  right:1rem;
  bottom:1rem;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.4rem
}

.region-item{
  min-width:0;
  padding:.65rem;
  border:1px solid var(--oak-line);
  border-radius:.6rem;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(10px)
}

.region-item strong,
.region-item span{
  display:block
}

.region-item strong{
  font-size:.72rem
}

.region-item span{
  color:var(--oak-soft);
  font:.62rem/1.5 var(--oak-font-mono)
}

.usecase{
  min-height:22rem;
  display:flex;
  flex-direction:column;
  padding:var(--oak-space-3)
}

.usecase-index{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--oak-space-1);
  margin-bottom:2.2rem;
  color:var(--oak-soft);
  font:var(--oak-fs-0)/1 var(--oak-font-mono)
}

.usecase-index svg{
  width:1.2rem;
  flex:none;
  color:var(--oak-primary)
}

.usecase h3{
  font-size:var(--oak-fs-2)
}

.usecase p{
  font-size:var(--oak-fs-1)
}

.usecase-flow{
  margin-top:auto;
  padding-top:var(--oak-space-2);
  border-top:1px solid var(--oak-line);
  color:var(--oak-primary);
  font:.66rem/1.7 var(--oak-font-mono);
  overflow-wrap:anywhere
}

.workflow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  overflow:hidden
}

.workflow article{
  position:relative;
  min-width:0;
  padding:var(--oak-space-4)
}

.workflow article+article{
  border-left:1px solid var(--oak-line)
}

.step-num{
  width:2rem;
  height:2rem;
  display:grid;
  place-items:center;
  margin-bottom:2.4rem;
  border:1px solid var(--oak-line-strong);
  border-radius:.6rem;
  color:var(--oak-primary);
  background:var(--oak-tint);
  font:.7rem/1 var(--oak-font-mono)
}

.workflow h3{
  font-size:var(--oak-fs-2)
}

.workflow p{
  margin:0;
  font-size:var(--oak-fs-1)
}

.workflow-action{
  display:flex;
  flex-wrap:wrap;
  gap:var(--oak-space-2);
  margin-top:var(--oak-space-3)
}

.metric-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.7rem
}

.metric{
  min-width:0;
  padding:1.4rem
}

.metric label{
  display:block;
  margin-bottom:1.8rem;
  color:var(--oak-soft);
  font-size:var(--oak-fs-0)
}

.metric strong,
.metric span{
  display:block
}

.metric strong{
  font:700 var(--oak-fs-1)/1.4 var(--oak-font-mono);
  font-variant-numeric:tabular-nums
}

.metric span{
  margin-top:.35rem;
  color:var(--oak-muted);
  font-size:.7rem
}

.spec-boundary{
  margin-top:var(--oak-space-3)
}

.tools-layout{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:var(--oak-space-2)
}

.tools-layout>*{
  min-width:0
}

.tools-panel{
  padding:var(--oak-space-4)
}

.tools-panel>p{
  font-size:var(--oak-fs-1)
}

.tool-cloud{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.55rem;
  margin-top:var(--oak-space-3)
}

.tool{
  min-width:0;
  min-height:5rem;
  display:grid;
  place-items:center;
  padding:var(--oak-space-1);
  border:1px solid var(--oak-line);
  border-radius:.75rem;
  background:#fffbfd;
  font:.7rem/1.4 var(--oak-font-mono);
  text-align:center
}

.tool::before{
  content:"";
  width:.42rem;
  height:.42rem;
  border-radius:50%;
  background:var(--oak-primary);
  box-shadow:0 0 0 4px rgba(197,26,131,.08)
}

.stack-line{
  display:grid;
  grid-template-columns:7rem 1rem minmax(0,1fr);
  align-items:center;
  gap:var(--oak-space-1);
  padding:.8rem 0;
  border-bottom:1px solid var(--oak-line);
  font-size:var(--oak-fs-1)
}

.stack-line:last-child{
  border-bottom:0
}

.stack-line strong{
  font-family:var(--oak-font-mono);
  font-size:.7rem
}

.stack-line b{
  color:var(--oak-primary)
}

.tool-checks{
  display:grid;
  gap:var(--oak-space-1);
  margin-top:var(--oak-space-3);
  padding-top:var(--oak-space-3);
  border-top:1px solid var(--oak-line)
}

.tool-checks span{
  color:var(--oak-muted);
  font-size:var(--oak-fs-0)
}

.tool-checks code{
  color:var(--oak-primary)
}

.quote-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-block:1px solid var(--oak-line);
  background:rgba(255,255,255,.44)
}

.quote-strip blockquote{
  min-width:0;
  margin:0;
  padding:2.6rem
}

.quote-strip blockquote+blockquote{
  border-left:1px solid var(--oak-line)
}

.quote-mark{
  color:var(--oak-primary);
  font:2rem/1 Georgia,serif
}

.quote-strip p{
  min-height:9rem;
  margin:var(--oak-space-2) 0
}

.quote-strip strong,
.quote-strip span{
  display:block;
  font-size:var(--oak-fs-0)
}

.quote-strip span{
  color:var(--oak-soft)
}

.payment-layout{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:var(--oak-space-4);
  align-items:center
}

.payment-layout>*{
  min-width:0
}

.payment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem
}

.payment-card{
  min-width:0;
  padding:1.6rem
}

.payment-card:first-child{
  grid-row:span 2
}

.payment-icon{
  width:2.4rem;
  height:2.4rem;
  display:grid;
  place-items:center;
  margin-bottom:2rem;
  border-radius:.75rem;
  color:#fff;
  background:var(--oak-ink)
}

.payment-icon svg{
  width:1.1rem
}

.payment-card h3{
  font-size:var(--oak-fs-2)
}

.payment-card p{
  margin:0;
  font-size:var(--oak-fs-1)
}

@media(max-width:980px){
  .hero-stage{
    min-height:31rem
  }

  .position-grid,
  .region-layout,
  .tools-layout,
  .payment-layout{
    grid-template-columns:1fr
  }

  .metric-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .quote-strip p{
    min-height:11rem
  }
}

@media(max-width:768px){
  .hero-stage{
    min-height:27rem
  }

  .hero-terminal{
    left:0;
    height:19rem
  }

  .hero-chip-one{
    right:0
  }

  .hero-chip-two{
    bottom:0
  }

  .trust-inner{
    align-items:flex-start;
    flex-direction:column;
    padding-block:1.2rem
  }

  .position-side,
  .payment-grid{
    grid-template-columns:1fr
  }

  .payment-card:first-child{
    grid-row:auto
  }

  .region-list{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .workflow,
  .quote-strip{
    grid-template-columns:1fr
  }

  .workflow article+article,
  .quote-strip blockquote+blockquote{
    border-left:0;
    border-top:1px solid var(--oak-line)
  }

  .metric-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .tool-cloud{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .quote-strip p{
    min-height:0
  }
}

@media(max-width:390px){
  .hero-stage{
    min-height:25rem
  }

  .hero-scene{
    inset:-1rem;
    width:calc(100% + 2rem);
    height:calc(100% + 2rem)
  }

  .hero-terminal{
    top:12%;
    height:18rem
  }

  .hero-terminal-head{
    padding-inline:.7rem
  }

  .hero-terminal-body{
    height:15.2rem;
    padding:.8rem;
    font-size:.66rem
  }

  .hero-chip{
    gap:.45rem;
    padding:.55rem .65rem
  }

  .hero-chip-icon{
    width:1.7rem;
    height:1.7rem
  }

  .hero-chip strong{
    font-size:.65rem
  }

  .hero-chip small{
    font-size:.58rem
  }

  .position-main,
  .workflow article,
  .tools-panel,
  .quote-strip blockquote{
    padding:var(--oak-space-3)
  }

  .position-main::after{
    font-size:3.2rem
  }

  .region-guides div{
    grid-template-columns:1fr;
    gap:.2rem
  }

  .region-map{
    min-height:28rem
  }

  .region-list,
  .metric-grid{
    grid-template-columns:1fr
  }

  .stack-line{
    grid-template-columns:1fr;
    gap:.2rem
  }

  .stack-line b{
    display:none
  }

  .workflow-action{
    display:grid;
    grid-template-columns:1fr
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-terminal-lines{
    animation:none;
    transform:none
  }
}