
:root{--red:#d21b29;--bg:#f4f2ed;--ink:#0b0b0b;--line:rgba(0,0,0,.12)}
*{box-sizing:border-box}
html{background:#0a0a0a}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Manrope",system-ui,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
.tech-shell{width:min(1440px,calc(100vw - 72px));margin-inline:auto}
.tech-header{position:fixed;top:0;left:0;right:0;z-index:1000;height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 30px;color:#fff;background:rgba(7,7,7,.84);border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px)}
.tech-header__logo img{height:54px;width:auto}.tech-header__nav{display:flex;gap:28px;font-size:12px;font-weight:700}.tech-header__cta{justify-self:end;font-size:12px;font-weight:700}
.tech-detail-hero{position:relative;min-height:760px;display:grid;align-items:end;overflow:hidden;background:#0c0c0c;color:#fff;padding:150px 0 86px}
.tech-detail-hero__media{position:absolute;inset:0;background:#111 center 42%/contain no-repeat;transform:scale(.97)}
.tech-detail-hero__veil{position:absolute;inset:0;background:radial-gradient(circle at 72% 28%,rgba(210,27,41,.18),transparent 28%),linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.34) 58%,rgba(0,0,0,.54)),linear-gradient(0deg,rgba(0,0,0,.78),transparent 50%)}
.tech-detail-hero__content{position:relative;z-index:2;max-width:900px}.tech-detail-kicker{display:inline-flex;align-items:center;gap:10px;font-size:10px;font-weight:800;letter-spacing:.22em;color:rgba(255,255,255,.6)}
.tech-detail-kicker:before{content:"";width:34px;height:1px;background:var(--red)}
.tech-detail-hero h1{margin:20px 0;font-family:"Space Grotesk";font-size:clamp(64px,8vw,132px);line-height:.82;letter-spacing:-.065em}
.tech-detail-hero p{max-width:690px;margin:0;color:rgba(255,255,255,.72);font-size:clamp(17px,1.5vw,22px);line-height:1.6}
.tech-detail-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}.tech-detail-btn{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:0 22px;border-radius:999px;font-size:12px;font-weight:800;transition:.3s ease}
.tech-detail-btn--light{background:#fff;color:#080808}.tech-detail-btn--ghost{border:1px solid rgba(255,255,255,.28);color:#fff}.tech-detail-btn:hover{transform:translateY(-2px)}
.tech-overview{padding:120px 0}.tech-overview__grid{display:grid;grid-template-columns:.8fr 1.6fr;gap:80px;align-items:start}.tech-section-kicker{font-size:10px;font-weight:800;letter-spacing:.22em;color:#77716b}
.tech-overview h2,.tech-library h2,.tech-cta h2{margin:0;font-family:"Space Grotesk";font-size:clamp(44px,5vw,78px);line-height:.94;letter-spacing:-.055em}
.tech-overview__copy p{margin:24px 0 0;max-width:760px;color:#69655f;line-height:1.75;font-size:17px}
.tech-capabilities{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tech-capability{padding:32px 24px}.tech-capability:not(:last-child){border-right:1px solid var(--line)}.tech-capability span{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.18em}
.tech-capability h3{margin:12px 0 8px;font-family:"Space Grotesk";font-size:26px;letter-spacing:-.035em}.tech-capability p{margin:0;color:#77716b;line-height:1.6;font-size:14px}
.tech-library{padding:110px 0 130px;background:#0b0b0b;color:#fff}.tech-library__head{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;align-items:end}.tech-library__head p{justify-self:end;max-width:500px;margin:0;color:rgba(255,255,255,.52);line-height:1.7}
.tech-library__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:58px}.tech-resource{min-height:360px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;padding:28px;border-radius:26px;border:1px solid rgba(255,255,255,.12);background:radial-gradient(circle at 78% 12%,rgba(210,27,41,.18),transparent 24%),linear-gradient(145deg,#171717,#0d0d0d);transition:.4s ease}
.tech-resource:hover{transform:translateY(-6px);border-color:rgba(210,27,41,.52)}.tech-resource__icon{position:absolute;top:24px;left:24px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.16);color:var(--red);font-size:20px}
.tech-resource small{font-size:9px;font-weight:800;letter-spacing:.18em;color:rgba(255,255,255,.42)}.tech-resource h3{margin:10px 0 8px;font-family:"Space Grotesk";font-size:34px;letter-spacing:-.04em}.tech-resource p{margin:0;color:rgba(255,255,255,.55);line-height:1.55;font-size:13px}.tech-resource__status{display:inline-flex;margin-top:20px;width:max-content;font-size:10px;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.64)}
.tech-gallery{padding:120px 0}.tech-gallery__visual{min-height:580px;border-radius:30px;background:#d8d5ce center/contain no-repeat;border:1px solid rgba(0,0,0,.08)}
.tech-cta{padding:110px 0;background:var(--red);color:#fff}.tech-cta__grid{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;align-items:end}.tech-cta p{margin:0;justify-self:end;max-width:480px;line-height:1.7;color:rgba(255,255,255,.78)}
.tech-footer{padding:28px 0 34px;background:#0b0b0b;color:rgba(255,255,255,.48);font-size:11px}.tech-footer__grid{display:flex;justify-content:space-between;gap:24px}
@media(max-width:1000px){.tech-shell{width:calc(100vw - 38px)}.tech-header{grid-template-columns:1fr auto;padding:0 18px}.tech-header__nav{display:none}.tech-detail-hero{min-height:680px}.tech-overview__grid,.tech-library__head,.tech-cta__grid{grid-template-columns:1fr}.tech-library__head p,.tech-cta p{justify-self:start}.tech-capabilities{grid-template-columns:1fr}.tech-capability:not(:last-child){border-right:0;border-bottom:1px solid var(--line)}.tech-library__grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.tech-detail-hero{min-height:620px;padding-bottom:62px}.tech-detail-hero h1{font-size:clamp(54px,16vw,84px)}.tech-library__grid{grid-template-columns:1fr}.tech-gallery__visual{min-height:380px}.tech-footer__grid{flex-direction:column}}


/* =========================================================
   PREMIUM TECHNOLOGY MOTION SYSTEM
   ========================================================= */
html.lenis,
html.lenis body{
  height:auto;
}

.lenis.lenis-smooth{
  scroll-behavior:auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent]{
  overscroll-behavior:contain;
}

.tech-header{
  transition:
    height .42s cubic-bezier(.2,.75,.2,1),
    background .42s ease,
    border-color .42s ease,
    box-shadow .42s ease;
}

.tech-header.is-scrolled{
  height:72px;
  background:rgba(7,7,7,.93);
  border-bottom-color:rgba(255,255,255,.08);
  box-shadow:0 16px 50px rgba(0,0,0,.14);
}

.tech-header__nav a,
.tech-header__cta{
  transition:opacity .25s ease,color .25s ease,transform .25s ease;
}

.tech-header__nav a:hover,
.tech-header__cta:hover{
  color:#fff;
  opacity:.72;
}

.tech-detail-hero__media{
  will-change:transform;
}

.tech-reveal,
.tech-stagger,
.tech-video-reveal{
  will-change:transform,opacity;
}

/* =========================================================
   GYPSUM VIDEO SHOWCASE
   ========================================================= */
.tech-video-showcase{
  position:relative;
  padding:120px 0 135px;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 18%,rgba(210,27,41,.08),transparent 25%),
    var(--bg);
}

.tech-video-showcase::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,0,0,.16),transparent);
}

.tech-video-showcase__head{
  display:grid;
  grid-template-columns:1.45fr .75fr;
  gap:70px;
  align-items:end;
  margin-bottom:58px;
}

.tech-video-showcase__head h2{
  margin:12px 0 0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(52px,6.2vw,96px);
  line-height:.88;
  letter-spacing:-.06em;
}

.tech-video-showcase__head p{
  max-width:460px;
  justify-self:end;
  margin:0 0 4px;
  color:#6c6862;
  font-size:15px;
  line-height:1.75;
}

.tech-video-stage{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/9;
  min-height:420px;
  border-radius:32px;
  background:#070707;
  box-shadow:
    0 38px 90px rgba(0,0,0,.18),
    0 0 0 1px rgba(0,0,0,.08);
  transform-origin:center center;
}

.tech-video-stage::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  border-radius:inherit;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.12),
    inset 0 -100px 140px rgba(0,0,0,.16);
}

.tech-video-player{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#050505;
}

.tech-video-play{
  position:absolute;
  left:50%;
  top:50%;
  z-index:4;
  display:flex;
  align-items:center;
  gap:16px;
  transform:translate(-50%,-50%);
  padding:13px 20px 13px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(7,7,7,.72);
  color:#fff;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  cursor:pointer;
  box-shadow:0 18px 55px rgba(0,0,0,.28);
  transition:
    opacity .28s ease,
    transform .36s cubic-bezier(.2,.75,.2,1),
    background .3s ease;
}

.tech-video-play:hover{
  transform:translate(-50%,-50%) scale(1.04);
  background:rgba(7,7,7,.88);
}

.tech-video-play.is-hidden{
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,-50%) scale(.92);
}

.tech-video-play__icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--red);
  color:#fff;
  font-size:14px;
  padding-left:2px;
  box-shadow:0 10px 28px rgba(210,27,41,.28);
}

.tech-video-play__text{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}

.tech-video-play__text strong{
  font-family:"Space Grotesk",sans-serif;
  font-size:12px;
  letter-spacing:.13em;
}

.tech-video-play__text small{
  color:rgba(255,255,255,.52);
  font-size:8px;
  font-weight:800;
  letter-spacing:.18em;
}

.tech-video-corner-label{
  position:absolute;
  left:25px;
  bottom:22px;
  z-index:3;
  display:flex;
  gap:10px;
  align-items:center;
  color:rgba(255,255,255,.68);
  pointer-events:none;
  font-size:8px;
  font-weight:800;
  letter-spacing:.18em;
}

.tech-video-corner-label span:first-child{
  color:var(--red);
}

.tech-video-corner-label span+span::before{
  content:"";
  display:inline-block;
  width:22px;
  height:1px;
  margin:0 10px 3px 0;
  background:rgba(255,255,255,.28);
}

/* More tactile brochure cards without becoming flashy */
.tech-resource{
  transform:translateZ(0);
}

.tech-resource::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(
    118deg,
    transparent 18%,
    rgba(255,255,255,.055) 45%,
    transparent 69%
  );
  transform:translateX(-45%);
  transition:opacity .35s ease,transform .7s cubic-bezier(.2,.75,.2,1);
}

.tech-resource:hover::before{
  opacity:1;
  transform:translateX(45%);
}

.tech-gallery__visual{
  overflow:hidden;
  will-change:transform;
}

@media(max-width:1000px){
  .tech-video-showcase__head{
    grid-template-columns:1fr;
    gap:26px;
  }

  .tech-video-showcase__head p{
    justify-self:start;
  }

  .tech-video-stage{
    min-height:0;
    border-radius:24px;
  }
}

@media(max-width:680px){
  .tech-video-showcase{
    padding:90px 0 100px;
  }

  .tech-video-showcase__head{
    margin-bottom:38px;
  }

  .tech-video-showcase__head h2{
    font-size:clamp(46px,14vw,68px);
  }

  .tech-video-play{
    gap:11px;
    padding:9px 14px 9px 9px;
  }

  .tech-video-play__icon{
    width:40px;
    height:40px;
  }

  .tech-video-corner-label{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .tech-header,
  .tech-resource,
  .tech-video-play{
    transition:none !important;
  }
}


/* =========================================================
   GYPSUM — MULTI VIDEO LIBRARY
   ========================================================= */
.tech-video-feature__meta{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px 34px;
  align-items:start;
  margin-top:24px;
  padding:0 8px;
}

.tech-video-feature__meta > span,
.tech-video-secondary__meta > span{
  color:var(--red);
  font-size:9px;
  font-weight:800;
  letter-spacing:.2em;
  white-space:nowrap;
}

.tech-video-feature__meta h3,
.tech-video-secondary__meta h3{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  letter-spacing:-.045em;
}

.tech-video-feature__meta h3{
  font-size:30px;
}

.tech-video-feature__meta p{
  grid-column:2;
  margin:-6px 0 0;
  max-width:680px;
  color:#6c6862;
  line-height:1.65;
  font-size:14px;
}

.tech-video-secondary-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  margin-top:72px;
}

.tech-video-secondary{
  min-width:0;
}

.tech-video-stage--secondary{
  aspect-ratio:16/9;
  min-height:0;
  border-radius:24px;
  box-shadow:
    0 24px 58px rgba(0,0,0,.14),
    0 0 0 1px rgba(0,0,0,.08);
}

.tech-video-play--compact{
  gap:11px;
  padding:9px 14px 9px 9px;
}

.tech-video-play--compact .tech-video-play__icon{
  width:40px;
  height:40px;
}

.tech-video-secondary__meta{
  padding:22px 6px 0;
}

.tech-video-secondary__meta h3{
  margin-top:8px;
  font-size:26px;
}

.tech-video-secondary__meta p{
  margin:9px 0 0;
  color:#6c6862;
  line-height:1.65;
  font-size:13px;
}

@media(max-width:820px){
  .tech-video-feature__meta{
    grid-template-columns:1fr;
    gap:9px;
  }

  .tech-video-feature__meta p{
    grid-column:auto;
    margin:0;
  }

  .tech-video-secondary-grid{
    grid-template-columns:1fr;
    margin-top:54px;
  }
}
/* PARGET TECHNOLOGY PERFORMANCE PASS */
.tech-header{
  -webkit-backdrop-filter:blur(10px) !important;
  backdrop-filter:blur(10px) !important;
  transition:
    height .38s cubic-bezier(.2,.75,.2,1),
    background .38s ease,
    border-color .38s ease,
    box-shadow .38s ease !important;
}

.tech-detail-hero__media,
.tech-reveal,
.tech-stagger,
.tech-video-reveal{
  will-change:auto !important;
}

.page-loader.is-hidden *{
  animation-play-state:paused !important;
}

.page-loader.is-removed{
  display:none !important;
}

@media(max-width:900px), (pointer:coarse){
  .tech-header{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    background:rgba(7,7,7,.94) !important;
  }
}
