/* =========================================
   HERO
   ========================================= */
#hero{
  min-height:100vh;
  padding:0;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:stretch;
}
.hero-bg{position:absolute;inset:0;z-index:0}
/* Subtle grid lines */
.hero-grid-lines{
  position:absolute;inset:0;
  background-image:
    linear-gradient(var(--border2) 1px,transparent 1px),
    linear-gradient(90deg,var(--border2) 1px,transparent 1px);
  background-size:80px 80px;
  opacity:0.45;
}
.hero-bg-photo{
  position:absolute;
  inset:0 0 0 auto;
  width:70%;
  background-image:url('../../backgrounds/hiro img.png');
  background-size:auto 100%;
  background-position:right center;
  background-repeat:no-repeat;
  z-index:1;
}
.hero-bg-photo::before{
  content:'';
  position:absolute;inset:0;
  background:rgba(0,0,0,0.34);
}
.hero-bg-photo::after{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(90deg,var(--bg) 0%, rgba(13,13,12,0.82) 14%, rgba(13,13,12,0.46) 28%, rgba(13,13,12,0.16) 40%, rgba(13,13,12,0.04) 52%, rgba(13,13,12,0) 64%);
}
.hero-content{
  position:relative;z-index:10;
  width:100%;
  min-height:100vh;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding:clamp(108px,12vh,136px) 60px clamp(64px,9vh,88px);
  max-width:760px;
}
@media (max-height: 920px) and (min-width: 1025px){
  .hero-content{
    padding-top:136px;
    padding-bottom:68px;
  }
}
/* Main title area */
.hero-title-block{padding-bottom:0;max-width:620px}
.hero-eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:11px;letter-spacing:3px;color:var(--accent);
  text-transform:uppercase;font-weight:400;
  margin-bottom:20px;
  display:flex;align-items:center;gap:10px;
}
.hero-eyebrow::before{content:'';display:block;width:32px;height:1px;background:var(--accent)}
.hero-h1{
  font-family:'PT Serif',serif;
  font-size:clamp(52px,6.5vw,88px);
  font-weight:400;
  line-height:1.05;
  color:var(--text);
  margin-bottom:8px;
  letter-spacing:-0.5px;
}
.hero-h1 em{font-style:italic;color:var(--text2)}
.hero-h1-sub{
  font-family:'Manrope',sans-serif;
  font-size:clamp(14px,1.5vw,18px);
  font-weight:300;
  color:var(--text3);
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:28px;
}
.hero-desc{
  font-size:16px;color:var(--text2);
  line-height:1.75;max-width:560px;
  font-weight:400;
  margin-bottom:30px;
}
.hero-desc-line{display:block}
.hero-desc-line-nowrap{white-space:nowrap}
.hero-btn-primary{
  background:var(--accent);color:#fff;
  padding:14px 32px;
  font-size:12px;font-weight:700;
  text-decoration:none;letter-spacing:1.5px;text-transform:uppercase;
  transition:all 0.2s;
  white-space:nowrap;
}
.hero-btn-primary:hover{background:var(--accent-hi)}