/* =============================================================
   Sharp Engineers — holding page
   Loaded after style.css and relies on its tokens (--gold, --fh,
   --gut and friends). Nothing here touches the main site's rules.
   ============================================================= */

.landing{
  position:relative;overflow:hidden;
  display:flex;align-items:center;
  padding:clamp(40px,6.4vh,84px) 0;
  min-height:100vh;
  min-height:100svh;          /* so collapsing mobile chrome can't overflow */
}
.landing__bg{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;filter:grayscale(.5) contrast(1.04)
}
/* Left-weighted scrim, matching the home hero: heaviest under the copy,
   clearing toward the right so the building still reads. */
.landing::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(25,39,43,.93) 0%,rgba(25,39,43,.78) 36%,
                          rgba(25,39,43,.42) 68%,rgba(25,39,43,.28) 100%),
    linear-gradient(180deg,rgba(25,39,43,.45),transparent 28%)
}
.landing__inner{position:relative;z-index:2;width:100%}
.landing__copy{max-width:min(640px,58%)}

.landing__logo{
  height:clamp(68px,8.4vw,96px);width:auto;
  margin:0 0 clamp(24px,4.4vh,44px)
}

.landing__eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--fb);font-size:12px;font-weight:400;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gold);
  margin:0 0 18px
}
.landing__eyebrow::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 0 4px rgba(198,154,45,.18)
}

.landing h1{color:var(--white);text-wrap:balance}
.landing__lede{
  margin:clamp(16px,2.2vh,24px) 0 0;
  font-family:var(--fh);font-weight:400;
  font-size:clamp(16px,1.5vw,20px);line-height:1.55;
  color:rgba(255,255,255,.84);max-width:46ch
}

/* indeterminate "in progress" rule — the only moving part on the page */
.landing__bar{
  position:relative;height:2px;width:min(260px,70%);
  background:rgba(255,255,255,.16);overflow:hidden;
  margin:clamp(24px,3.4vh,36px) 0 0
}
.landing__bar::after{
  content:"";position:absolute;top:0;left:0;height:100%;width:38%;
  background:var(--gold);animation:landing-slide 2.6s cubic-bezier(.5,0,.5,1) infinite
}
@keyframes landing-slide{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(300%)}
}

.landing__chips{display:flex;flex-wrap:wrap;gap:8px;margin:clamp(24px,3.4vh,36px) 0 0;padding:0;list-style:none}
.landing__chips li{
  border:1px solid rgba(255,255,255,.3);border-radius:25px;
  padding:4px 15px;font-size:13px;color:rgba(255,255,255,.86)
}

.landing__cta{display:flex;flex-wrap:wrap;gap:12px;margin:clamp(26px,3.6vh,38px) 0 0}

.landing__meta{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:clamp(18px,2.6vw,34px);
  margin:clamp(28px,4vh,44px) 0 0;padding:clamp(22px,3vh,30px) 0 0;
  border-top:1px solid rgba(255,255,255,.2)
}
.landing__meta h6{
  font-family:var(--fb);font-size:11px;font-weight:400;letter-spacing:.17em;
  text-transform:uppercase;color:var(--gold);margin:0 0 9px
}
.landing__meta p{margin:0;font-size:14.5px;line-height:1.65;color:rgba(255,255,255,.8)}
.landing__meta a{transition:color .3s}
.landing__meta a:hover{color:var(--gold)}

/* discreet link through to the build — delete before this goes live */
.landing__peek{
  position:absolute;z-index:2;left:var(--gut);bottom:clamp(16px,3vh,28px);
  font-size:12.5px;color:rgba(255,255,255,.45);transition:color .3s
}
.landing__peek:hover{color:var(--gold)}

@media(max-width:900px){
  .landing__copy{max-width:none}
  /* a 90deg scrim leaves the right edge of a phone too light for white type
     once the copy runs the full width */
  .landing::after{
    background:
      linear-gradient(90deg,rgba(25,39,43,.9),rgba(25,39,43,.72) 60%,rgba(25,39,43,.62)),
      linear-gradient(180deg,rgba(25,39,43,.45),transparent 32%)
  }
  .landing{padding-bottom:clamp(64px,12vh,96px)}
}
@media(max-width:480px){
  .landing__meta{grid-template-columns:1fr;gap:18px}
  .landing__cta .pill{flex:1 1 auto;justify-content:center}
}

@media(prefers-reduced-motion:reduce){
  .landing__bar::after{animation:none;width:100%;opacity:.55}
}
