:root{
  --bg:#050714;
  --text:#ffffff;
  --muted:rgba(255,255,255,.72);
  --line:rgba(255,255,255,.22);
  --primary:#7c3cff;
  --cyan:#19d2ff;
  --wa:#25D366;
  --wa-hover:#20c45a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--bg);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
.hero{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  flex-direction:column;
}
.hero::before{
  content:"";
  position:absolute;
  top:0;
  left:28px;
  width:1px;
  height:8px;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:rgba(25,210,255,.95);
  box-shadow:
    0 0 10px rgba(25,210,255,.45),
    0 0 18px rgba(25,210,255,.2);
  animation:linePulse 10s ease-in-out infinite;
}
.hero::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:28px;
  width:1px;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(124,60,255,0), rgba(124,60,255,.58) 24%, rgba(25,210,255,.7) 58%, rgba(25,210,255,0));
  box-shadow:
    0 0 14px rgba(25,210,255,.22),
    0 0 26px rgba(124,60,255,.16);
}
.code-stage{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 79% 24%, rgba(25,210,255,.13), transparent 28%),
    radial-gradient(circle at 91% 72%, rgba(124,60,255,.12), transparent 32%),
    linear-gradient(90deg, #050714 0%, #050714 38%, #071125 100%);
  perspective:1120px;
  transform:translateZ(0);
  contain:layout paint style;
}
.code-wall{
  position:absolute;
  inset:-9% -8% -12% 48%;
  opacity:.72;
  transform:perspective(1400px) rotateY(-18deg) rotateZ(-7deg) skewY(-2deg) scale(1.12);
  transform-origin:center right;
  filter:
    drop-shadow(0 0 18px rgba(25,210,255,.28))
    drop-shadow(0 0 44px rgba(25,210,255,.14));
  will-change:transform;
}
.code-track{
  --duration:42s;
  --offset:-28px;
  display:flex;
  flex-direction:column;
  gap:11px;
  width:min(980px,64vw);
  min-height:220%;
  transform:translate3d(0,var(--offset),0);
  animation:codeScroll var(--duration) linear infinite;
  will-change:transform;
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 9%, #000 90%, transparent 100%);
  mask-image:linear-gradient(180deg, transparent 0%, #000 9%, #000 90%, transparent 100%);
}
.code-line{
  display:block;
  width:max-content;
  max-width:100%;
  color:rgba(126,242,255,.84);
  font-family:"SFMono-Regular","Cascadia Code","Consolas","Liberation Mono",monospace;
  font-size:clamp(13px,.92vw,18px);
  line-height:1.36;
  letter-spacing:.012em;
  white-space:nowrap;
  text-shadow:0 0 12px rgba(25,210,255,.52), 0 0 32px rgba(25,210,255,.24);
  opacity:var(--line-opacity,.68);
  transform:translateZ(0);
}
.code-line.is-keyword{color:rgba(181,147,255,.78)}
.code-line.is-value{color:rgba(86,238,255,.9)}
.code-line.is-muted{color:rgba(111,178,202,.44)}
.code-glow{
  position:absolute;
  top:-6%;
  right:-18%;
  width:min(84vw,1480px);
  height:112%;
  background:
    radial-gradient(ellipse at 52% 28%, rgba(25,210,255,.31), transparent 50%),
    radial-gradient(ellipse at 70% 64%, rgba(0,224,255,.18), transparent 48%),
    radial-gradient(ellipse at 82% 42%, rgba(124,60,255,.15), transparent 48%);
  filter:blur(14px);
  opacity:.84;
  transform:translateZ(0);
}
.noise{
  position:absolute;
  inset:0;
  opacity:.055;
  mix-blend-mode:screen;
  background-image:
    linear-gradient(115deg, rgba(255,255,255,.07) 0 1px, transparent 1px 7px),
    radial-gradient(circle at 25% 35%, rgba(255,255,255,.4) 0 1px, transparent 1.5px);
  background-size:38px 38px, 19px 19px;
}
.hero-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  background:
    linear-gradient(90deg, rgba(3,6,18,.985) 0%, rgba(3,6,18,.96) 34%, rgba(3,6,18,.74) 49%, rgba(3,6,18,.26) 72%, rgba(3,6,18,.08) 100%),
    linear-gradient(180deg, rgba(3,6,18,.26), rgba(3,6,18,.04) 42%, rgba(3,6,18,.22));
}
@keyframes codeScroll{
  from{transform:translate3d(0,var(--offset),0)}
  to{transform:translate3d(0,calc(var(--offset) - 50%),0)}
}
.header{
  width:100%;
  padding:28px 58px 0 63px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  position:relative;
  z-index:3;
}
.brand{display:inline-flex;align-items:center}
.brand img{
  width:92px;
  height:auto;
  display:block;
  animation:logoReveal 800ms ease-out both, logoGlow 12s ease-in-out 800ms infinite;
}
.nav{
  display:flex;
  align-items:center;
  gap:34px;
  font-size:14px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.nav a{
  opacity:.9;
  transition:opacity .2s ease, color .2s ease, transform .2s ease;
}
.nav a:hover{opacity:1;color:var(--cyan);transform:translateY(-1px)}
.hero-content{
  width:min(900px,calc(100% - 172px));
  margin:clamp(130px,22vh,255px) 0 0 112px;
  position:relative;
  z-index:3;
}
h1{
  max-width:900px;
  margin:0;
  font-size:clamp(2.8rem,4.4vw,4.6rem);
  line-height:1.05;
  font-weight:500;
  letter-spacing:-.055em;
  white-space:nowrap;
  text-shadow:0 8px 48px rgba(0,0,0,.58);
}
.cursor{
  display:inline-block;
  width:3px;
  height:.9em;
  margin-left:8px;
  background:linear-gradient(180deg,var(--cyan),var(--primary));
  transform:translateY(.12em);
  animation:blink 1s steps(2,start) infinite;
}
.lead{
  max-width:760px;
  margin:24px 0 0;
  color:var(--muted);
  font-size:18px;
  line-height:1.72;
  font-weight:500;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin-top:36px;
}
.btn{
  min-width:154px;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:52px;
  padding:0 26px;
  border-radius:7px;
  font-size:16px;
  font-weight:800;
  letter-spacing:-.01em;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:linear-gradient(135deg,#6f38ff 0%,#19d2ff 100%);
  box-shadow:
    0 18px 44px rgba(25,210,255,.22),
    0 10px 26px rgba(124,60,255,.24),
    inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-primary:hover{
  box-shadow:
    0 22px 52px rgba(25,210,255,.28),
    0 14px 30px rgba(124,60,255,.28),
    inset 0 1px 0 rgba(255,255,255,.28);
}
.btn-outline{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
}
.btn-outline:hover{
  border-color:rgba(0,229,255,.45);
  background:rgba(255,255,255,.06);
  box-shadow:
    0 14px 34px rgba(25,210,255,.10),
    0 10px 28px rgba(124,60,255,.10),
    inset 0 1px 0 rgba(255,255,255,.12);
}
.mini-tags{
  margin-top:31px;
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  color:rgba(255,255,255,.7);
  font-size:15px;
  font-weight:700;
}
.hero-social{
  position:absolute;
  left:112px;
  bottom:34px;
  z-index:3;
  width:40px;
  height:40px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.84);
  background:rgba(5,7,20,.45);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 12px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  transition:color .2s ease, transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.hero-social svg{
  width:18px;
  height:18px;
  display:block;
  fill:currentColor;
}
.hero-social:hover{
  color:#fff;
  border-color:rgba(25,210,255,.62);
  background:linear-gradient(135deg,rgba(124,60,255,.2),rgba(25,210,255,.12)),rgba(5,7,20,.5);
  box-shadow:0 16px 34px rgba(25,210,255,.16),0 12px 30px rgba(124,60,255,.18);
  transform:translateY(-2px);
}
.wa-fab{
  position:fixed;
  right:18px;
  bottom:18px;
  width:56px;
  height:56px;
  border-radius:999px;
  background:var(--wa);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:120;
  box-shadow:0 12px 28px rgba(0,0,0,.35),0 2px 10px rgba(0,0,0,.25);
  opacity:0;
  transform:translateY(12px) scale(.96);
  pointer-events:none;
  transition:opacity .22s ease, transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.wa-fab svg{
  width:26px;
  height:26px;
  display:block;
  transform:translateX(.2px) translateY(.2px);
}
.wa-fab svg path{fill:#fff}
.wa-fab.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
  animation:waPulse 2.8s ease-in-out infinite;
}
.wa-fab:hover{
  background:var(--wa-hover);
  box-shadow:0 16px 34px rgba(0,0,0,.4),0 3px 12px rgba(0,0,0,.28);
  animation:none;
}
@keyframes blink{50%{opacity:0}}
@keyframes linePulse{
  0%,84%,100%{opacity:0;transform:translateY(0)}
  3%{opacity:.95}
  15%{opacity:.95;transform:translateY(100vh)}
  18%{opacity:0;transform:translateY(100vh)}
}
@keyframes logoReveal{
  from{opacity:0;transform:translateY(-10px);filter:none}
  to{opacity:1;transform:translateY(0);filter:none}
}
@keyframes logoGlow{
  0%,81%,100%{filter:none}
  88%,94%{filter:drop-shadow(0 0 14px rgba(25,210,255,.34)) drop-shadow(0 0 20px rgba(124,60,255,.22))}
}
@keyframes waPulse{
  0%,100%{box-shadow:0 12px 28px rgba(0,0,0,.35),0 0 0 0 rgba(37,211,102,.2)}
  50%{box-shadow:0 12px 28px rgba(0,0,0,.35),0 0 0 10px rgba(37,211,102,0)}
}
@media (hover:hover) and (pointer:fine){
  .wa-fab::before{
    content:attr(data-tip);
    position:absolute;
    right:66px;
    top:50%;
    transform:translateY(-50%) translateX(6px);
    padding:8px 10px;
    border-radius:12px;
    background:rgba(10,14,28,.78);
    border:1px solid rgba(255,255,255,.14);
    color:rgba(255,255,255,.92);
    font-size:12px;
    font-weight:700;
    letter-spacing:-.01em;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
    backdrop-filter:blur(10px);
  }
  .wa-fab::after{
    content:"";
    position:absolute;
    right:58px;
    top:50%;
    width:10px;
    height:10px;
    transform:translateY(-50%) rotate(45deg);
    background:rgba(10,14,28,.78);
    border-left:1px solid rgba(255,255,255,.14);
    border-bottom:1px solid rgba(255,255,255,.14);
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
  }
  .wa-fab:hover::before{opacity:1;transform:translateY(-50%) translateX(0)}
  .wa-fab:hover::after{opacity:1}
}
@media (max-width:900px){
  .hero::before{left:24px}
  .hero::after{left:24px}
  .header{padding:22px 24px 0 59px}
  .brand img{width:78px}
  .nav{gap:18px;font-size:12px}
  .hero-content{width:calc(100% - 104px);margin:120px 0 0 88px}
  h1{white-space:normal}
  .lead{font-size:16px}
  .mini-tags{gap:14px;font-size:13px}
  .hero-social{left:88px;bottom:24px}
  .code-wall{inset:-8% -18% -10% 52%;opacity:.42;transform:perspective(1200px) rotateY(-15deg) rotateZ(-6deg) skewY(-1deg) scale(1)}
  .code-track{width:min(720px,68vw)}
  .hero-overlay{background:linear-gradient(90deg, rgba(3,6,18,.99), rgba(3,6,18,.94) 55%, rgba(3,6,18,.42))}
}
@media (max-width:620px){
  .hero::before{left:20px}
  .hero::after{left:20px}
  .hero{min-height:760px}
  .header{align-items:flex-start}
  .nav{flex-direction:column;align-items:flex-end;gap:12px}
  .hero-content{width:calc(100% - 78px);margin:104px 0 0 70px}
  h1{font-size:45px;letter-spacing:-.045em}
  .hero-actions{gap:12px}.btn{width:100%}
  .hero-social{left:70px}
  .code-wall{inset:-8% -48% -10% 58%;opacity:.2;transform:perspective(1000px) rotateY(-12deg) rotateZ(-5deg) skewY(-1deg) scale(.88)}
  .code-track{width:86vw}
  .code-glow{right:-42%;opacity:.34}
  .wa-fab{right:14px;bottom:14px;width:52px;height:52px}
}

.portfolio{
  position:relative;
  overflow:hidden;
  padding:96px 48px 110px;
  background:
    radial-gradient(circle at 20% 0%, rgba(124,60,255,.18), transparent 34%),
    radial-gradient(circle at 84% 18%, rgba(25,210,255,.12), transparent 30%),
    linear-gradient(180deg,#050714 0%,#070a18 48%,#040612 100%);
  color:var(--text);
}
.portfolio::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(180deg, transparent, #000 16%, #000 72%, transparent);
  opacity:.42;
}
.portfolio-heading{
  position:relative;
  z-index:2;
  max-width:820px;
  margin:0 auto 46px;
  text-align:center;
}
.section-kicker{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 12px;
  border:1px solid rgba(25,210,255,.28);
  border-radius:999px;
  background:rgba(255,255,255,.05);
  color:rgba(25,210,255,.94);
  font-size:12px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  backdrop-filter:blur(10px);
}
.portfolio h2{
  margin:18px 0 0;
  font-size:clamp(2.2rem,4.5vw,4.8rem);
  line-height:.98;
  font-weight:700;
  letter-spacing:-.055em;
}
.portfolio-heading p{
  max-width:680px;
  margin:20px auto 0;
  color:var(--muted);
  font-size:18px;
  line-height:1.65;
  font-weight:500;
}
.portfolio-panels{
  position:relative;
  z-index:1;
  display:flex;
  gap:18px;
  min-height:min(760px,calc(100vh - 150px));
}
.project-card{
  position:relative;
  flex:1 1 0;
  min-width:0;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.15);
  background:#07101f;
  box-shadow:0 28px 70px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
  isolation:isolate;
  transition:flex .55s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.project-card:hover{
  flex:1.75 1 0;
  border-color:rgba(25,210,255,.42);
  box-shadow:0 34px 90px rgba(0,0,0,.42), 0 0 44px rgba(25,210,255,.12), inset 0 1px 0 rgba(255,255,255,.14);
  transform:translateY(-3px);
}
.project-media,
.project-media img,
.project-scrim{
  position:absolute;
  inset:0;
}
.project-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:brightness(.72) saturate(1.05);
  transform:scale(1.01);
  transition:filter .45s ease, transform .55s ease, opacity .45s ease;
}
.project-card:hover .project-media img{
  filter:brightness(1.03) saturate(1.18);
  transform:scale(1.045);
}
.project-media-slides img,
.project-mockup-slides img{
  opacity:0;
  animation:none;
}
.project-media-slides img:first-child,
.project-mockup-slides img:first-child{
  opacity:1;
}
.project-card:hover .project-media-slides img,
.project-card:hover .project-mockup-slides img{
  animation:portfolioSlide 14s infinite;
}
.project-media-slides img:nth-child(1),
.project-mockup-slides img:nth-child(1){animation-delay:0s}
.project-media-slides img:nth-child(2),
.project-mockup-slides img:nth-child(2){animation-delay:3.5s}
.project-media-slides img:nth-child(3),
.project-mockup-slides img:nth-child(3){animation-delay:7s}
.project-media-slides img:nth-child(4),
.project-mockup-slides img:nth-child(4){animation-delay:10.5s}
.project-scrim{
  z-index:1;
  background:linear-gradient(180deg, rgba(3,6,18,.15), rgba(3,6,18,.58) 42%, rgba(3,6,18,.88)), linear-gradient(90deg, rgba(3,6,18,.72), rgba(3,6,18,.2));
  transition:background .35s ease;
}
.project-card:hover .project-scrim{
  background:linear-gradient(180deg, rgba(3,6,18,.06), rgba(3,6,18,.46) 44%, rgba(3,6,18,.82)), linear-gradient(90deg, rgba(3,6,18,.76), rgba(3,6,18,.12));
}
.project-copy{
  position:absolute;
  z-index:3;
  left:clamp(22px,3vw,42px);
  right:clamp(22px,3vw,42px);
  bottom:clamp(26px,5vh,56px);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  transition:align-items .35s ease, text-align .35s ease, transform .35s ease;
}
.project-card:hover .project-copy{
  align-items:flex-start;
  text-align:left;
  transform:translateY(-8px);
}
.project-status{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(5,7,20,.46);
  color:rgba(255,255,255,.86);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  backdrop-filter:blur(12px);
}
.project-status.is-live{
  border-color:rgba(37,211,102,.35);
  color:#baf8d0;
}
.project-copy h3{
  margin:18px 0 0;
  font-size:clamp(2.1rem,4vw,4.4rem);
  line-height:.95;
  letter-spacing:-.055em;
  font-weight:700;
  text-shadow:0 10px 44px rgba(0,0,0,.55);
}
.project-copy p{
  max-width:560px;
  margin:18px 0 0;
  color:rgba(255,255,255,.78);
  font-size:16px;
  line-height:1.65;
  font-weight:500;
}
.project-features{
  display:grid;
  gap:9px;
  max-width:360px;
  margin:20px 0 0;
  padding:0;
  list-style:none;
  color:rgba(255,255,255,.84);
  font-size:14px;
  font-weight:700;
  opacity:0;
  transform:translateY(12px);
  max-height:0;
  overflow:hidden;
  transition:opacity .35s ease, transform .35s ease, max-height .35s ease;
}
.project-features li::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:10px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  box-shadow:0 0 14px rgba(25,210,255,.44);
}
.case-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-top:22px;
  padding:0 18px;
  border-radius:7px;
  background:linear-gradient(135deg,#6f38ff 0%,#19d2ff 100%);
  color:#fff;
  font-size:14px;
  font-weight:800;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  box-shadow:0 16px 36px rgba(25,210,255,.18), inset 0 1px 0 rgba(255,255,255,.22);
  transition:opacity .35s ease, transform .35s ease;
}
.project-card:hover .project-features,
.project-card:hover .case-link{
  opacity:1;
  transform:translateY(0);
  max-height:150px;
  pointer-events:auto;
}
.project-mockup{
  position:absolute;
  z-index:2;
  top:10%;
  right:clamp(18px,3vw,48px);
  width:min(48%,560px);
  aspect-ratio:16/10;
  padding:10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  background:linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.045));
  box-shadow:0 28px 80px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(16px);
  opacity:0;
  transform:translateY(20px) scale(.94) rotate(-1.4deg);
  transition:opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}
.project-card:hover .project-mockup{
  opacity:1;
  transform:translateY(0) scale(1) rotate(0deg);
}
.project-mockup img{
  position:absolute;
  inset:10px;
  width:calc(100% - 20px);
  height:calc(100% - 20px);
  object-fit:contain;
  object-position:center center;
  border-radius:5px;
  background:rgba(3,6,18,.74);
}
@keyframes portfolioSlide{
  0%,19%{opacity:1}
  25%,94%{opacity:0}
  100%{opacity:1}
}
@media (max-width:980px){
  .portfolio{padding:78px 22px 88px}
  .portfolio-panels{flex-direction:column;min-height:0}
  .project-card{min-height:620px;flex:unset}
  .project-card:hover{flex:unset;transform:none}
  .project-copy,.project-card:hover .project-copy{align-items:flex-start;text-align:left;transform:none}
  .project-features,.case-link{opacity:1;transform:none;max-height:180px;pointer-events:auto}
  .project-mockup{top:24px;right:22px;width:min(58%,460px);opacity:1;transform:none}
}
@media (max-width:620px){
  .portfolio{padding:64px 16px 76px}
  .portfolio-heading{text-align:left;margin-bottom:30px}
  .portfolio-heading p{font-size:16px}
  .project-card{min-height:680px}
  .project-media img{object-fit:cover}
  .project-mockup{left:18px;right:18px;top:22px;width:auto;aspect-ratio:16/10}
  .project-copy{left:22px;right:22px;bottom:28px}
  .project-copy h3{font-size:42px}
}
.nav a.active{
  color:var(--cyan);
  opacity:1;
}

.home-cta{
  position:relative;
  overflow:hidden;
  padding:92px 48px 98px;
  text-align:center;
  background:
    radial-gradient(circle at 18% 0%, rgba(124,60,255,.18), transparent 34%),
    radial-gradient(circle at 82% 12%, rgba(25,210,255,.12), transparent 30%),
    linear-gradient(180deg,#050714 0%,#070a18 58%,#040612 100%);
}
.home-cta::before,
.portfolio-page::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(180deg, transparent, #000 16%, #000 78%, transparent);
  opacity:.38;
}
.home-cta > *{
  position:relative;
  z-index:1;
}
.home-cta h2{
  max-width:780px;
  margin:18px auto 0;
  font-size:clamp(2rem,4.2vw,4.1rem);
  line-height:1;
  font-weight:700;
  letter-spacing:-.055em;
}
.home-cta p{
  max-width:720px;
  margin:20px auto 32px;
  color:var(--muted);
  font-size:18px;
  line-height:1.65;
  font-weight:500;
}

.site-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:34px 58px 38px 63px;
  border-top:1px solid rgba(255,255,255,.1);
  background:#040612;
  color:rgba(255,255,255,.82);
}
.site-footer strong{
  display:block;
  color:#fff;
  font-size:18px;
  letter-spacing:-.02em;
}
.site-footer p{
  margin:8px 0 0;
  color:rgba(255,255,255,.58);
  font-size:14px;
  line-height:1.5;
}
.footer-link{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  border-radius:7px;
  border:1px solid rgba(25,210,255,.32);
  color:#fff;
  font-size:14px;
  font-weight:800;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.footer-link:hover{
  transform:translateY(-2px);
  border-color:rgba(25,210,255,.58);
  box-shadow:0 14px 34px rgba(25,210,255,.12), inset 0 1px 0 rgba(255,255,255,.12);
}

.work-page{
  min-height:100vh;
  background:#050714;
}
.work-hero{
  position:relative;
  min-height:72vh;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  flex-direction:column;
}
.work-hero::before{
  content:"";
  position:absolute;
  top:0;
  left:28px;
  bottom:0;
  width:1px;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(124,60,255,0), rgba(124,60,255,.56) 26%, rgba(25,210,255,.72) 62%, rgba(25,210,255,0));
  box-shadow:0 0 14px rgba(25,210,255,.22),0 0 26px rgba(124,60,255,.16);
}
.work-hero-content{
  width:min(980px,calc(100% - 172px));
  margin:clamp(96px,16vh,170px) 0 96px 112px;
  position:relative;
  z-index:3;
}
.work-hero-content h1{
  max-width:940px;
  white-space:normal;
}
.work-hero-content p{
  max-width:760px;
  margin:24px 0 0;
  color:var(--muted);
  font-size:18px;
  line-height:1.72;
  font-weight:500;
}
.reveal-on-load{
  animation:workIntro .75s cubic-bezier(.2,.8,.2,1) both;
}

.portfolio-page{
  position:relative;
  overflow:hidden;
  padding:96px 48px 112px;
  background:
    radial-gradient(circle at 24% 4%, rgba(124,60,255,.2), transparent 34%),
    radial-gradient(circle at 82% 14%, rgba(25,210,255,.13), transparent 32%),
    linear-gradient(180deg,#050714 0%,#070a18 46%,#040612 100%);
}
.portfolio-heading-wide{
  max-width:920px;
  margin-bottom:42px;
}
.portfolio-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.portfolio-card{
  position:relative;
  min-height:620px;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.16);
  background:#07101f;
  box-shadow:0 28px 70px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08);
  isolation:isolate;
  transform:translateY(28px) scale(.975);
  opacity:0;
  transition:transform .45s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.portfolio-card.is-visible{
  animation:projectCardIn .72s cubic-bezier(.2,.8,.2,1) both;
  animation-delay:var(--delay,0ms);
}
.portfolio-card:hover{
  transform:translateY(-6px) scale(1.01);
  border-color:rgba(25,210,255,.46);
  box-shadow:0 36px 94px rgba(0,0,0,.46), 0 0 50px rgba(25,210,255,.13), inset 0 1px 0 rgba(255,255,255,.14);
}
.portfolio-card-bg,
.portfolio-card-overlay{
  position:absolute;
  inset:0;
}
.portfolio-card-bg{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:brightness(.62) saturate(1.08);
  transform:scale(1.02);
  transition:transform .7s cubic-bezier(.2,.8,.2,1), filter .45s ease;
}
.portfolio-card:hover .portfolio-card-bg{
  transform:scale(1.07);
  filter:brightness(.82) saturate(1.18);
}
.portfolio-card-overlay{
  z-index:1;
  background:
    linear-gradient(180deg, rgba(3,6,18,.08), rgba(3,6,18,.52) 38%, rgba(3,6,18,.9)),
    linear-gradient(90deg, rgba(3,6,18,.78), rgba(3,6,18,.2));
  backdrop-filter:blur(.2px);
}
.portfolio-card-content{
  position:absolute;
  z-index:2;
  left:clamp(24px,3vw,38px);
  right:clamp(24px,3vw,38px);
  bottom:clamp(28px,5vw,48px);
}
.portfolio-card h3{
  margin:18px 0 0;
  font-size:clamp(2.35rem,4.3vw,4.55rem);
  line-height:.94;
  letter-spacing:-.055em;
  font-weight:700;
  text-shadow:0 10px 44px rgba(0,0,0,.58);
}
.portfolio-card p{
  max-width:560px;
  margin:18px 0 0;
  color:rgba(255,255,255,.8);
  font-size:16px;
  line-height:1.65;
  font-weight:500;
}

@keyframes workIntro{
  from{opacity:0;transform:translateY(22px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes projectCardIn{
  from{opacity:0;transform:translateY(34px) scale(.965)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media (max-width:1120px){
  .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portfolio-card{min-height:560px}
}
@media (max-width:900px){
  .work-hero::before{left:24px}
  .work-hero-content{width:calc(100% - 104px);margin:92px 0 76px 88px}
  .portfolio-page,.home-cta{padding-left:22px;padding-right:22px}
  .site-footer{padding:30px 24px 34px 59px}
}
@media (max-width:720px){
  .portfolio-grid{grid-template-columns:1fr}
  .portfolio-card{min-height:560px}
  .site-footer{align-items:flex-start;flex-direction:column}
}
@media (max-width:620px){
  .work-hero{min-height:720px}
  .work-hero::before{left:20px}
  .work-hero-content{width:calc(100% - 78px);margin:82px 0 68px 70px}
  .work-hero-content h1{font-size:45px;letter-spacing:-.045em}
  .work-hero-content p,.home-cta p{font-size:16px}
  .portfolio-page{padding:68px 16px 76px}
  .portfolio-heading-wide{text-align:left;margin-bottom:30px}
  .portfolio-card{min-height:520px}
  .portfolio-card h3{font-size:42px}
}
@media (prefers-reduced-motion:reduce){
    .code-track{animation:none}
  .reveal-on-load,
  .portfolio-card.is-visible{
    animation:none;
  }
  .portfolio-card,
  .portfolio-card.is-visible{
    opacity:1;
    transform:none;
  }
  .portfolio-card,
  .portfolio-card-bg,
  .footer-link,
  .nav a{
    transition:none;
  }
}

.work-gallery-page{
  min-height:100vh;
  overflow:hidden;
  background:#050714;
  color:var(--text);
}
.work-gallery-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:86px;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:18px 46px 16px 54px;
  background:linear-gradient(180deg, rgba(5,7,20,.88), rgba(5,7,20,.42) 72%, rgba(5,7,20,0));
  backdrop-filter:blur(10px);
}
.work-gallery-header .brand img{
  width:82px;
  animation:logoReveal 800ms ease-out both, logoGlow 12s ease-in-out 800ms infinite;
}
.work-gallery-nav{
  display:flex;
  align-items:center;
  gap:32px;
  color:rgba(255,255,255,.86);
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.work-gallery-nav a,
.work-gallery-nav span{
  opacity:.9;
  transition:opacity .2s ease, color .2s ease, transform .2s ease;
}
.work-gallery-nav a:hover{
  opacity:1;
  color:var(--cyan);
  transform:translateY(-1px);
}
.work-gallery-nav span{
  cursor:default;
}
.work-gallery{
  min-height:100vh;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  background:#050714;
}
.work-column{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  border-right:1px solid rgba(255,255,255,.13);
  background:#07101f;
  opacity:0;
  transform:translateY(28px) scale(.985);
}
.work-column:last-child{
  border-right:0;
}
.work-column.is-visible{
  animation:workColumnIn .78s cubic-bezier(.2,.8,.2,1) both;
  animation-delay:var(--delay,0ms);
}
.work-column-bg,
.work-column-overlay{
  position:absolute;
  inset:0;
}
.work-column-bg{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:brightness(.52) saturate(1.08);
  transform:scale(1.02);
  transition:transform .75s cubic-bezier(.2,.8,.2,1), filter .45s ease;
}
.work-column-overlay{
  z-index:1;
  background:
    linear-gradient(180deg, rgba(5,7,20,.38), rgba(5,7,20,.32) 34%, rgba(5,7,20,.86)),
    radial-gradient(circle at 50% 62%, rgba(25,210,255,.14), transparent 36%),
    linear-gradient(90deg, rgba(5,7,20,.48), rgba(5,7,20,.2));
  transition:background .35s ease;
}
.work-column::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:border-color .3s ease, box-shadow .3s ease;
}
.work-column-content{
  position:absolute;
  z-index:3;
  left:clamp(24px,3.2vw,52px);
  right:clamp(24px,3.2vw,52px);
  top:50%;
  transform:translateY(-42%);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  text-shadow:0 14px 48px rgba(0,0,0,.72);
  transition:transform .35s ease, opacity .35s ease;
}
.work-column h1{
  margin:18px 0 0;
  max-width:520px;
  white-space:normal;
  font-size:clamp(2.45rem,4.7vw,5rem);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:700;
}
.work-column p{
  max-width:390px;
  margin:18px auto 0;
  color:rgba(255,255,255,.78);
  font-size:16px;
  line-height:1.55;
  font-weight:600;
  opacity:.88;
  transition:opacity .35s ease;
}
.work-column .project-status{
  min-height:24px;
  padding:0 10px;
  font-size:10px;
  letter-spacing:.1em;
  background:rgba(5,7,20,.36);
}
.work-column:hover .work-column-bg{
  transform:scale(1.07);
  filter:brightness(.72) saturate(1.16);
}
.work-column:hover .work-column-overlay{
  background:
    linear-gradient(180deg, rgba(5,7,20,.28), rgba(5,7,20,.22) 34%, rgba(5,7,20,.76)),
    radial-gradient(circle at 50% 62%, rgba(25,210,255,.18), transparent 38%),
    linear-gradient(90deg, rgba(5,7,20,.42), rgba(5,7,20,.14));
}
.work-column:hover::after{
  border-color:rgba(25,210,255,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 0 46px rgba(25,210,255,.12);
}
.work-column:hover .work-column-content{
  transform:translateY(-46%);
}
.work-column:hover p{
  opacity:1;
}

@keyframes workColumnIn{
  from{opacity:0;transform:translateY(34px) scale(.965)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media (max-width:900px){
  .work-gallery-page{
    overflow:auto;
  }
  .work-gallery-header{
    height:78px;
    padding:16px 22px 14px 28px;
  }
  .work-gallery-header .brand img{
    width:72px;
  }
  .work-gallery-nav{
    gap:18px;
    font-size:12px;
  }
  .work-gallery{
    display:block;
  }
  .work-column{
    min-height:70vh;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.13);
  }
  .work-column-content{
    top:54%;
  }
  .work-column h1{
    font-size:clamp(2.4rem,12vw,4.1rem);
  }
}
@media (max-width:560px){
  .work-gallery-header{
    align-items:center;
    height:76px;
    padding:14px 16px 12px 20px;
  }
  .work-gallery-nav{
    gap:12px;
    font-size:11px;
    letter-spacing:.06em;
  }
  .work-gallery-header .brand img{
    width:64px;
  }
  .work-column{
    min-height:70vh;
  }
  .work-column-content{
    left:22px;
    right:22px;
  }
}
@media (prefers-reduced-motion:reduce){
  .work-column,
  .work-column.is-visible{
    animation:none;
    opacity:1;
    transform:none;
  }
  .work-column-bg,
  .work-column-content,
  .work-gallery-nav a{
    transition:none;
  }
}

.work-gallery{
  height:100vh;
  min-height:100vh;
  padding-top:86px;
}
.work-column{
  min-height:calc(100vh - 86px);
}
@media (max-width:900px){
  .work-gallery{
    height:auto;
    min-height:100vh;
    padding-top:78px;
  }
  .work-column{
    min-height:70vh;
  }
}
@media (max-width:560px){
  .work-gallery{
    padding-top:76px;
  }
}

.work-gallery-shell{
  min-height:100vh;
  height:100vh;
  overflow:hidden;
  background:#050714;
}
.work-gallery-shell .header{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:30;
}
.work-gallery-shell .nav{
  text-shadow:0 8px 28px rgba(0,0,0,.6);
}
.work-gallery-shell .nav a{
  opacity:.96;
}
.work-gallery-page .wa-fab{
  z-index:140;
}
.work-gallery-shell .work-gallery{
  position:absolute;
  inset:0;
  z-index:1;
  height:100%;
  min-height:100%;
  padding-top:0;
}
.work-gallery-shell .work-column{
  min-height:100vh;
}
.work-column-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-top:24px;
  padding:0 18px;
  border-radius:7px;
  border:1px solid rgba(25,210,255,.32);
  background:linear-gradient(135deg, rgba(124,60,255,.16), rgba(25,210,255,.10)), rgba(5,7,20,.38);
  color:#fff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.02em;
  box-shadow:0 16px 36px rgba(0,0,0,.26), 0 0 26px rgba(25,210,255,.08), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(12px);
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .28s ease, transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.work-column:hover .work-column-action{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.work-column-action:hover{
  border-color:rgba(25,210,255,.62);
  box-shadow:0 18px 42px rgba(0,0,0,.3), 0 0 34px rgba(25,210,255,.14), inset 0 1px 0 rgba(255,255,255,.16);
}

@media (max-width:900px){
  .work-gallery-shell{
    height:auto;
    min-height:100vh;
    overflow:visible;
  }
  .work-gallery-shell .work-gallery{
    position:relative;
    height:auto;
    min-height:0;
    padding-top:0;
  }
  .work-gallery-shell .work-column{
    min-height:70vh;
  }
  .work-column-action{
    opacity:1;
    transform:none;
    pointer-events:auto;
  }
}
@media (max-width:620px){
  .work-gallery-shell .header{
    position:absolute;
  }
}
@media (prefers-reduced-motion:reduce){
  .work-column-action{
    transition:none;
  }
}

.work-gallery-shell .brand{
  padding:8px 10px;
  margin:-8px -10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  background:linear-gradient(135deg, rgba(5,7,20,.58), rgba(5,7,20,.32));
  box-shadow:0 14px 34px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
}
.work-gallery-shell .nav{
  padding:12px 16px;
  margin:-12px -16px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  background:linear-gradient(135deg, rgba(5,7,20,.62), rgba(5,7,20,.34));
  box-shadow:0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
}
.work-gallery-shell .work-gallery{
  left:29px;
  width:calc(100% - 29px);
}
.work-gallery-shell .work-column-action{
  white-space:nowrap;
}

@media (max-width:900px){
  .work-gallery-shell .work-gallery{
    left:auto;
    width:auto;
    margin-left:25px;
  }
}
@media (max-width:620px){
  .work-gallery-shell .brand{
    padding:6px 8px;
    margin:-6px -8px;
  }
  .work-gallery-shell .nav{
    padding:10px 12px;
    margin:-10px -12px;
  }
  .work-gallery-shell .work-gallery{
    margin-left:21px;
  }
}
.work-gallery-shell .work-gallery{
  right:auto;
}
@media (max-width:900px){
  .work-gallery-shell .work-gallery{
    right:auto;
  }
}

.work-gallery-shell .header{
  background:linear-gradient(180deg, rgba(5,7,20,.42), rgba(5,7,20,.18) 62%, rgba(5,7,20,0));
  backdrop-filter:blur(2px);
}
.work-gallery-shell .brand{
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.52)) drop-shadow(0 0 18px rgba(25,210,255,.12));
}
.work-gallery-shell .nav{
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  text-shadow:0 4px 18px rgba(0,0,0,.92), 0 0 18px rgba(25,210,255,.16);
}
.work-gallery-shell .nav a{
  color:rgba(255,255,255,.94);
}
.project-logo{
  width:min(92%,520px);
  margin:0 auto 18px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.project-logo-image{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center center;
  filter:drop-shadow(0 14px 42px rgba(0,0,0,.66)) drop-shadow(0 0 18px rgba(25,210,255,.1));
}
.project-logo-image--dentguard{
  max-width:min(100%,430px);
  max-height:clamp(82px,13vh,146px);
}
.project-logo-image--americana{
  max-width:min(100%,450px);
  max-height:clamp(88px,14vh,158px);
}
.project-logo-image--green{
  max-width:min(100%,280px);
  max-height:clamp(120px,17vh,192px);
}
.work-column-content .project-status{
  margin-top:2px;
}
.work-column-content p{
  margin-top:16px;
}

@media (max-width:620px){
  .work-gallery-shell .brand,
  .work-gallery-shell .nav{
    padding:0;
    margin:0;
    border:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
  }
}

.work-gallery-shell .brand{
  transform:translateX(6px);
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.42));
}
.work-gallery-shell .brand img{
  animation:logoReveal 800ms ease-out both;
  filter:none;
}

@media (max-width:620px){
  .work-gallery-shell .brand{
    transform:translateX(4px);
  }
}

.work-gallery-shell .brand{
  transform:translateX(14px);
  filter:none;
  text-shadow:none;
}
.work-gallery-shell .brand img{
  animation:none;
  filter:none;
}
.work-gallery-shell .nav a:hover{
  opacity:1;
  color:var(--cyan);
  transform:translateY(-1px);
}

.work-column[data-project]{
  cursor:pointer;
}
.work-column[data-project]:focus-visible{
  outline:2px solid rgba(25,210,255,.72);
  outline-offset:-6px;
}
.project-status--advanced{
  border-color:rgba(124,60,255,.48);
  background:linear-gradient(135deg, rgba(124,60,255,.22), rgba(25,210,255,.12)), rgba(5,7,20,.44);
  color:#d9d2ff;
  box-shadow:0 0 24px rgba(124,60,255,.16), inset 0 1px 0 rgba(255,255,255,.12);
}
.project-status--development{
  border-color:rgba(245,185,75,.46);
  background:linear-gradient(135deg, rgba(245,185,75,.2), rgba(255,255,255,.06)), rgba(5,7,20,.44);
  color:#ffe1a3;
  box-shadow:0 0 24px rgba(245,185,75,.14), inset 0 1px 0 rgba(255,255,255,.12);
}
.project-status--live,
.project-status.is-live{
  border-color:rgba(37,211,102,.42);
  background:linear-gradient(135deg, rgba(37,211,102,.2), rgba(25,210,255,.08)), rgba(5,7,20,.44);
  color:#baf8d0;
  box-shadow:0 0 24px rgba(37,211,102,.14), inset 0 1px 0 rgba(255,255,255,.12);
}
.project-detail-overlay{
  position:fixed;
  inset:0;
  z-index:180;
  display:grid;
  place-items:center;
  padding:clamp(18px,3vw,42px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease, visibility .28s ease;
}
.project-detail-overlay.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.project-detail-backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,6,18,.72);
  backdrop-filter:blur(18px);
}
.project-detail-panel{
  position:relative;
  z-index:1;
  width:min(1120px,100%);
  max-height:min(780px,calc(100vh - 36px));
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.15);
  border-radius:10px;
  background:linear-gradient(135deg, rgba(11,15,32,.94), rgba(5,7,20,.92));
  box-shadow:0 32px 110px rgba(0,0,0,.56), 0 0 54px rgba(25,210,255,.1), inset 0 1px 0 rgba(255,255,255,.1);
  transform:translateY(18px) scale(.985);
  transition:transform .32s cubic-bezier(.2,.8,.2,1);
}
.project-detail-overlay.is-open .project-detail-panel{
  transform:translateY(0) scale(1);
}
.project-detail-media{
  position:relative;
  min-height:520px;
  background:#07101f;
  overflow:hidden;
}
.project-detail-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(5,7,20,.02), rgba(5,7,20,.46)), radial-gradient(circle at 50% 22%, rgba(25,210,255,.16), transparent 36%);
  pointer-events:none;
}
.project-detail-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  filter:brightness(.82) saturate(1.12);
}
.project-detail-content{
  padding:clamp(30px,4vw,54px);
  overflow:auto;
}
.project-detail-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:3;
  min-height:38px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:7px;
  background:rgba(5,7,20,.58);
  color:#fff;
  font:inherit;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  backdrop-filter:blur(12px);
  transition:border-color .2s ease, transform .2s ease, background .2s ease;
}
.project-detail-close:hover{
  border-color:rgba(25,210,255,.56);
  background:rgba(5,7,20,.74);
  transform:translateY(-1px);
}
.project-detail-status{
  margin-bottom:18px;
}
.project-detail-content h2{
  margin:0;
  font-size:clamp(2.5rem,5vw,5.2rem);
  line-height:.92;
  font-weight:700;
  letter-spacing:-.06em;
  text-shadow:0 14px 42px rgba(0,0,0,.52);
}
.project-detail-description{
  margin:22px 0 0;
  color:rgba(255,255,255,.78);
  font-size:17px;
  line-height:1.72;
  font-weight:500;
}
.project-detail-section{
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.12);
}
.project-detail-section h3{
  margin:0 0 14px;
  color:rgba(255,255,255,.94);
  font-size:13px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.project-detail-section ul{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.project-detail-section li{
  position:relative;
  padding-left:18px;
  color:rgba(255,255,255,.78);
  font-size:15px;
  line-height:1.45;
  font-weight:600;
}
.project-detail-section li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:6px;
  height:6px;
  border-radius:999px;
  background:var(--cyan);
  box-shadow:0 0 14px rgba(25,210,255,.52);
}
.project-detail-solution{
  margin-top:28px;
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.045);
}
.project-detail-solution span{
  display:block;
  color:rgba(255,255,255,.56);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.project-detail-solution strong{
  display:block;
  margin-top:8px;
  color:#fff;
  font-size:18px;
  line-height:1.35;
}
.project-detail-cta{
  width:100%;
  min-height:50px;
  margin-top:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  border-radius:7px;
  background:linear-gradient(135deg,#6f38ff 0%,#19d2ff 100%);
  color:#fff;
  font-size:14px;
  font-weight:800;
  box-shadow:0 18px 44px rgba(25,210,255,.2), 0 10px 26px rgba(124,60,255,.22), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .2s ease, box-shadow .2s ease;
}
.project-detail-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 52px rgba(25,210,255,.26), 0 14px 30px rgba(124,60,255,.26), inset 0 1px 0 rgba(255,255,255,.26);
}
body.project-detail-lock{
  overflow:hidden;
}
@media (max-width:900px){
  .project-detail-panel{
    max-height:calc(100vh - 28px);
    grid-template-columns:1fr;
    overflow:auto;
  }
  .project-detail-media{
    min-height:clamp(260px,42vh,420px);
  }
  .project-detail-content{
    overflow:visible;
  }
}
@media (max-width:620px){
  .project-detail-overlay{
    padding:12px;
  }
  .project-detail-panel{
    border-radius:8px;
  }
  .project-detail-close{
    top:12px;
    right:12px;
  }
  .project-detail-content{
    padding:28px 22px 24px;
  }
  .project-detail-description{
    font-size:16px;
  }
}
@media (prefers-reduced-motion:reduce){
  .project-detail-overlay,
  .project-detail-panel,
  .project-detail-close,
  .project-detail-cta{
    transition:none;
  }
}

/* ===== LADevLabs code-scroll background - matched to original reference ===== */
.code-stage{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 56% 36%, rgba(25,210,255,.105), transparent 46%),radial-gradient(ellipse at 72% 52%, rgba(64,196,255,.16), transparent 58%),radial-gradient(ellipse at 34% 58%, rgba(25,210,255,.045), transparent 48%),radial-gradient(circle at 16% 18%, rgba(64,168,255,.10), transparent 34%),linear-gradient(90deg,#04070f 0%,#050816 31%,#060b17 58%,#050914 78%,#03060d 100%);perspective:1400px;transform-style:preserve-3d;contain:layout paint style;}
.code-stage::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 58% 50%, rgba(25,210,255,.075), transparent 52%),radial-gradient(ellipse at 76% 42%, rgba(87,217,255,.10), transparent 44%),linear-gradient(90deg, rgba(5,8,22,0) 0%, rgba(5,8,22,.035) 36%, rgba(5,8,22,.12) 56%, rgba(5,8,22,.32) 78%, rgba(5,8,22,.54) 100%);}
.code-glow{position:absolute;inset:-18% -18% -16% 30%;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 62% 48%, rgba(65,210,255,.26), transparent 52%),radial-gradient(ellipse at 42% 54%, rgba(25,210,255,.13), transparent 58%),radial-gradient(ellipse at 74% 18%, rgba(124,60,255,.10), transparent 50%);filter:blur(30px);opacity:.82;}
.code-wall{position:absolute;inset:-7% -6% -10% 50%;z-index:2;transform-origin:center right;transform:perspective(1400px) rotateY(-15deg) skewY(-1deg);filter:saturate(1.22);opacity:1;will-change:transform;}
.code-wall::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg, rgba(255,255,255,.02) 0%, transparent 16%, transparent 80%, rgba(95,215,255,.05) 100%);mix-blend-mode:screen;opacity:.58;}
.code-track{position:absolute;top:0;left:0;right:0;min-height:100%;height:auto;width:auto;display:flex;flex-direction:column;gap:.02rem;padding:2.2rem 8% 2.2rem 10%;transform:translateY(100vh);animation:drift var(--speed,76s) linear infinite;will-change:transform;-webkit-mask-image:none;mask-image:none;}
.loop-spacer{height:var(--spacer-height,36vh);flex:0 0 auto;}
.code-line{min-height:1.03rem;display:flex;align-items:center;width:max-content;max-width:none;padding:0;white-space:nowrap;font-size:clamp(12px,.78vw,16px);line-height:1.2;font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;letter-spacing:.02em;color:rgba(188,242,255,.96);text-shadow:0 0 10px rgba(82,210,255,.28),0 0 24px rgba(82,210,255,.12);filter:saturate(1.24);opacity:.8;transform-origin:left center;animation:linePulseSoft var(--pulse,8.5s) ease-in-out infinite, codeGlitch var(--glitch,13s) ease-in-out infinite;}
.code-line:nth-child(4n){opacity:.88}.code-line:nth-child(7n){color:rgba(145,216,255,.98)}.code-line:nth-child(5n){opacity:.94}.code-line .dim{color:rgba(158,204,232,.9)}.code-line .hot{color:rgba(219,250,255,.98);text-shadow:0 0 14px rgba(118,230,255,.32)}.code-line .marker{color:rgba(106,225,255,.9)}
.noise{position:absolute;inset:0;z-index:5;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.01) 1px, transparent 1px);background-size:100% 4px,4px 100%;opacity:.04;mix-blend-mode:soft-light;}
.hero-overlay{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg, rgba(4,7,14,.99) 0%, rgba(5,8,22,.965) 26%, rgba(5,8,22,.82) 43%, rgba(5,8,22,.54) 58%, rgba(5,8,22,.24) 76%, rgba(5,8,22,.08) 100%),radial-gradient(ellipse at 48% 52%, rgba(25,210,255,.055), transparent 48%),linear-gradient(180deg, rgba(255,255,255,.018) 0%, transparent 22%, transparent 78%, rgba(255,255,255,.01) 100%);}
@keyframes drift{from{transform:translateY(100vh)}to{transform:translateY(-100%)}}
@keyframes linePulseSoft{0%,100%{opacity:.54}25%{opacity:.74}50%{opacity:.62}75%{opacity:.8}}
@keyframes codeGlitch{0%,92%,100%{opacity:.8}93%{opacity:.88}94%{opacity:.78}}
@media (max-width:1024px){.code-wall{inset:-6% -10% -8% 52%}}
@media (max-width:780px){.code-stage::before{background:linear-gradient(180deg, rgba(5,8,22,.06), rgba(5,8,22,.28) 36%, rgba(5,8,22,.72) 100%)}.code-wall{inset:-2% -12% -18% 44%;transform:perspective(1200px) rotateY(-11deg)}.loop-spacer{height:28vh}}
@media (max-width:520px){.code-stage{opacity:.76}.code-wall{inset:0 -22% -16% 34%;transform:perspective(1100px) rotateY(-8deg)}.loop-spacer{height:18vh}}
@media (prefers-reduced-motion:reduce){.code-track{animation:none;transform:translateY(0)}}

/* ===== LADevLabs team page ===== */
.team-body{
  min-height:100vh;
  background:#050714;
}
.team-page{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(ellipse at 70% 12%, rgba(25,210,255,.13), transparent 38%),
    radial-gradient(ellipse at 86% 36%, rgba(124,60,255,.14), transparent 34%),
    radial-gradient(ellipse at 22% 76%, rgba(25,210,255,.08), transparent 42%),
    linear-gradient(180deg,#050714 0%,#060918 48%,#040612 100%);
  color:var(--text);
}
.team-page::before{
  content:"";
  position:absolute;
  top:0;
  left:28px;
  width:1px;
  height:8px;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:rgba(25,210,255,.95);
  box-shadow:0 0 10px rgba(25,210,255,.45),0 0 18px rgba(25,210,255,.2);
  animation:linePulse 10s ease-in-out infinite;
}
.team-page::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:28px;
  width:1px;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(124,60,255,0), rgba(124,60,255,.58) 24%, rgba(25,210,255,.7) 58%, rgba(25,210,255,0));
  box-shadow:0 0 14px rgba(25,210,255,.22),0 0 26px rgba(124,60,255,.16);
}
.team-ambient{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.024) 1px, transparent 1px),
    radial-gradient(ellipse at 78% 18%, rgba(25,210,255,.18), transparent 34%),
    radial-gradient(ellipse at 66% 44%, rgba(124,60,255,.13), transparent 38%);
  background-size:86px 86px,86px 86px,auto,auto;
  mask-image:linear-gradient(180deg,#000 0%,#000 72%,transparent 100%);
  opacity:.6;
}
.team-ambient::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(5,7,20,.94) 0%, rgba(5,7,20,.76) 42%, rgba(5,7,20,.24) 100%);
}
.team-header,
.team-hero,
.team-section,
.team-hero{
  width:min(960px,calc(100% - 172px));
  margin:clamp(96px,16vh,180px) 0 0 112px;
  padding-bottom:72px;
}
.team-kicker{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  color:rgba(153,111,255,.96);
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.team-hero h1,
.team-section h2{
  margin:14px 0 0;
  max-width:920px;
  font-size:clamp(2.65rem,5.2vw,5.4rem);
  line-height:.98;
  font-weight:700;
  letter-spacing:-.06em;
  text-shadow:0 14px 54px rgba(0,0,0,.58);
}
.team-hero h1 span{
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.team-hero p{
  max-width:760px;
  margin:24px 0 0;
  color:rgba(255,255,255,.74);
  font-size:18px;
  line-height:1.72;
  font-weight:500;
}
.team-section{
  padding:0 58px 96px 112px;
}
.team-section h2{
  max-width:980px;
  font-size:clamp(2rem,3.6vw,3.65rem);
  letter-spacing:-.055em;
}
.team-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  margin-top:30px;
}
.team-card{
  position:relative;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(124,60,255,.34);
  background:linear-gradient(180deg, rgba(10,15,32,.74), rgba(5,7,20,.88));
  box-shadow:0 26px 74px rgba(0,0,0,.34),0 0 36px rgba(25,210,255,.08),inset 0 1px 0 rgba(255,255,255,.1);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.team-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(124,60,255,.12), transparent 42%, rgba(25,210,255,.08));
  opacity:.72;
}
.team-card:hover{
  transform:translateY(-5px);
  border-color:rgba(25,210,255,.5);
  box-shadow:0 34px 92px rgba(0,0,0,.42),0 0 48px rgba(25,210,255,.13),inset 0 1px 0 rgba(255,255,255,.14);
}
.team-photo{
  position:relative;
  z-index:1;
  aspect-ratio:16/11;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(124,60,255,.2), rgba(25,210,255,.09)),#07101f;
}
.team-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(5,7,20,0), rgba(5,7,20,.68));
}
.team-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.04) brightness(.84);
}
.team-photo--placeholder{
  display:grid;
  place-items:center;
}
.team-photo--placeholder span{
  width:104px;
  height:104px;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid rgba(25,210,255,.38);
  background:radial-gradient(circle at 35% 24%, rgba(25,210,255,.24), transparent 42%),linear-gradient(135deg, rgba(124,60,255,.28), rgba(5,7,20,.76));
  color:#fff;
  font-size:34px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:0 0 42px rgba(25,210,255,.14),inset 0 1px 0 rgba(255,255,255,.14);
}
.team-card-copy{
  position:relative;
  z-index:1;
  padding:22px 22px 26px;
}
.team-card h3{
  margin:0;
  color:#fff;
  font-size:28px;
  line-height:1;
  letter-spacing:-.04em;
}
.team-role{
  margin:8px 0 0;
  color:rgba(25,210,255,.92);
  font-size:14px;
  font-weight:800;
  letter-spacing:.02em;
}
.team-role::after{
  content:"";
  display:block;
  width:34px;
  height:2px;
  margin-top:14px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--primary),var(--cyan));
  box-shadow:0 0 16px rgba(25,210,255,.32);
}
.team-card-copy > p:last-child{
  margin:18px 0 0;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.62;
  font-weight:500;
}
@media (max-width:980px){
  .team-page::before,.team-page::after{left:24px}
  .team-header{padding:22px 24px 0 59px}
  .team-hero{width:calc(100% - 104px);margin:104px 0 0 88px;padding-bottom:58px}
  .team-section{padding:0 24px 76px 88px}
  .team-grid{grid-template-columns:1fr;max-width:620px}
}
@media (max-width:620px){
  .team-page::before,.team-page::after{left:20px}
  .team-header{align-items:flex-start}
  .team-header .nav{flex-direction:column;align-items:flex-end;gap:12px}
  .team-hero{width:calc(100% - 78px);margin:88px 0 0 70px;padding-bottom:46px}
  .team-hero h1{font-size:44px;letter-spacing:-.045em}
  .team-hero p{font-size:16px}
  .team-section{padding:0 16px 64px 70px}
  .team-section h2{font-size:34px;letter-spacing:-.045em}
  .team-grid{gap:18px}
  .team-card-copy{padding:20px 18px 22px}
}
@media (prefers-reduced-motion:reduce){
  .team-card{transition:none}
}
/* ===== Compact team page alignment with home ===== */
.team-page{
  min-height:100vh;
}
@media (min-width:981px){
  .team-page{
    overflow:hidden;
  }
  .team-hero{
    width:min(880px,calc(100% - 172px));
    margin:clamp(64px,10vh,112px) 0 0 112px;
    padding-bottom:26px;
  }
  .team-hero h1{
    max-width:780px;
    font-size:clamp(2.9rem,4.4vw,5rem);
    line-height:1.02;
  }
  .team-hero p{
    max-width:720px;
    margin-top:18px;
    font-size:17px;
    line-height:1.62;
  }
  .team-section{
    padding:0 58px 40px 112px;
  }
  .team-section h2{
    max-width:920px;
    margin-top:8px;
    font-size:clamp(1.75rem,2.55vw,2.85rem);
    line-height:1.05;
  }
  .team-grid{
    gap:18px;
    margin-top:22px;
  }
  .team-card{
    min-height:360px;
  }
  .team-photo{
    aspect-ratio:16/8.6;
  }
  .team-card-copy{
    padding:18px 20px 20px;
  }
  .team-card h3{
    font-size:24px;
  }
  .team-role{
    margin-top:6px;
    font-size:13px;
  }
  .team-role::after{
    margin-top:10px;
  }
  .team-card-copy > p:last-child{
    margin-top:13px;
    font-size:14px;
    line-height:1.52;
  }
}
.team-photo--image img,
.team-photo img{
  object-fit:cover;
  object-position:center;
  border-radius:0;
}
.team-photo--placeholder{
  aspect-ratio:16/8.6;
}
@media (max-width:980px){
  .team-page{
    overflow:hidden auto;
  }
  .team-hero{
    margin-top:92px;
    padding-bottom:34px;
  }
  .team-section{
    padding-bottom:58px;
  }
}
@media (max-width:620px){
  .team-hero{
    margin-top:82px;
    padding-bottom:32px;
  }
}
/* ===== Team compact full-screen final pass ===== */
.team-body{
  min-height:100vh;
  overflow:hidden;
}
.team-page{
  min-height:100vh;
  height:100vh;
  overflow:hidden;
}
.team-header{
  width:100%;
  margin:0;
  padding:28px 58px 0 63px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}
.team-header .brand img{
  width:92px;
}
.team-header .nav{
  display:flex;
  align-items:center;
  gap:34px;
  font-size:14px;
}
.team-hero{
  width:min(820px,calc(100% - 172px));
  margin:clamp(34px,5.4vh,58px) 0 0 112px;
  padding:0;
}
.team-hero .team-kicker{
  min-height:22px;
  font-size:11px;
}
.team-hero h1{
  max-width:760px;
  margin-top:10px;
  font-size:clamp(2.4rem,3.8vw,4.2rem);
  line-height:1.05;
  letter-spacing:-.052em;
}
.team-hero p{
  max-width:700px;
  margin-top:16px;
  font-size:16px;
  line-height:1.56;
}
.team-section{
  padding:clamp(24px,3.2vh,34px) 58px 0 112px;
}
.team-section .team-kicker{
  min-height:22px;
  font-size:11px;
}
.team-section h2{
  max-width:920px;
  margin-top:8px;
  font-size:clamp(1.55rem,2.45vw,2.65rem);
  line-height:1.08;
  letter-spacing:-.048em;
}
.team-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:18px;
}
.team-card{
  min-height:0;
  max-height:340px;
}
.team-photo,
.team-photo--placeholder{
  height:142px;
  aspect-ratio:auto;
}
.team-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.06) brightness(.88);
}
.team-photo--placeholder span{
  width:76px;
  height:76px;
  font-size:25px;
}
.team-card-copy{
  padding:16px 18px 18px;
}
.team-card h3{
  font-size:23px;
}
.team-role{
  margin-top:5px;
  font-size:12px;
}
.team-role::after{
  width:30px;
  margin-top:9px;
}
.team-card-copy > p:last-child{
  margin-top:11px;
  font-size:13px;
  line-height:1.45;
}
@media (max-width:980px){
  .team-body,
  .team-page{
    height:auto;
    min-height:100vh;
    overflow:auto;
  }
  .team-header{
    padding:22px 24px 0 59px;
  }
  .team-header .brand img{
    width:78px;
  }
  .team-header .nav{
    gap:18px;
    font-size:12px;
  }
  .team-hero{
    width:calc(100% - 104px);
    margin:72px 0 0 88px;
  }
  .team-section{
    padding:34px 24px 72px 88px;
  }
  .team-grid{
    grid-template-columns:1fr;
    max-width:620px;
  }
  .team-card{
    max-height:none;
  }
  .team-photo,
  .team-photo--placeholder{
    height:auto;
    aspect-ratio:16/9;
  }
}
@media (max-width:620px){
  .team-header{
    align-items:flex-start;
  }
  .team-header .nav{
    flex-direction:column;
    align-items:flex-end;
    gap:12px;
  }
  .team-hero{
    width:calc(100% - 78px);
    margin:64px 0 0 70px;
  }
  .team-hero h1{
    font-size:40px;
  }
  .team-section{
    padding:30px 16px 64px 70px;
  }
  .team-section h2{
    font-size:30px;
  }
}
/* ===== Team final proportion tuning ===== */
@media (min-width:981px){
  .team-hero{
    margin-top:clamp(30px,4.6vh,50px);
  }
  .team-hero h1{
    font-size:clamp(2.2rem,3.3vw,3.9rem);
    line-height:1.04;
  }
  .team-hero p{
    margin-top:12px;
    font-size:15px;
    line-height:1.5;
  }
  .team-section{
    margin-top:clamp(22px,3.4vh,38px);
    padding-top:0;
    padding-bottom:0;
  }
  .team-section h2{
    font-size:clamp(1.8rem,3vw,3rem);
    line-height:1.08;
    margin-bottom:18px;
  }
  .team-grid{
    margin-top:0;
    gap:16px;
  }
  .team-card{
    max-height:320px;
  }
  .team-photo,
  .team-photo--placeholder{
    height:134px;
  }
  .team-card-copy{
    padding:14px 16px 16px;
  }
  .team-card h3{
    font-size:22px;
  }
  .team-role{
    margin-top:4px;
    font-size:12px;
  }
  .team-role::after{
    margin-top:8px;
  }
  .team-card-copy > p:last-child{
    margin-top:9px;
    font-size:12.5px;
    line-height:1.4;
  }
}
@media (max-width:980px){
  .team-hero{
    padding-bottom:22px;
  }
  .team-section{
    padding-top:24px;
  }
}
/* ===== Team clarity and card scale final pass ===== */
.team-ambient,
.team-ambient::after{
  z-index:0;
}
.team-header,
.team-hero,
.team-section{
  position:relative;
  z-index:4;
}
.team-ambient{
  opacity:.42;
}
.team-ambient::after{
  background:linear-gradient(90deg, rgba(5,7,20,.82) 0%, rgba(5,7,20,.58) 42%, rgba(5,7,20,.16) 100%);
}
.team-hero h1,
.team-section h2,
.team-card h3{
  color:#fff;
}
.team-hero p,
.team-card-copy > p:last-child{
  color:rgba(255,255,255,.8);
}
.team-photo::after{
  opacity:.42;
  background:linear-gradient(180deg, rgba(5,7,20,0), rgba(5,7,20,.34));
}
.team-photo img{
  filter:saturate(1.08) brightness(1.02);
}
@media (min-width:981px){
  .team-section h2{
    max-width:620px;
    font-size:clamp(1.35rem,1.85vw,2.05rem);
    line-height:1.08;
    margin-bottom:16px;
  }
  .team-grid{
    gap:18px;
  }
  .team-card{
    max-height:350px;
  }
  .team-photo,
  .team-photo--placeholder{
    height:154px;
  }
  .team-card-copy{
    padding:16px 18px 18px;
  }
  .team-card h3{
    font-size:24px;
  }
  .team-card-copy > p:last-child{
    font-size:13px;
    line-height:1.46;
  }
}
/* ===== Team text column alignment final pass ===== */
@media (min-width:981px){
  .team-hero,
  .team-section{
    width:min(720px,calc(100% - 172px));
    max-width:720px;
  }
  .team-hero h1,
  .team-hero p,
  .team-section h2{
    max-width:720px;
  }
  .team-section h2{
    font-size:clamp(1.15rem,1.55vw,1.75rem);
    line-height:1.1;
    font-weight:700;
  }
  .team-grid{
    width:720px;
    max-width:calc(100vw - 170px);
  }
}
/* ===== Team 3D split gallery ===== */
.team-showcase{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:minmax(420px,45%) minmax(0,55%);
  gap:clamp(28px,4vw,70px);
  width:min(1440px,calc(100% - 126px));
  height:calc(100vh - 120px);
  margin:clamp(28px,4.8vh,54px) 0 0 112px;
  align-items:center;
}
.team-showcase__content{min-width:0}
.team-showcase .team-hero,
.team-showcase .team-section{
  width:100%;
  max-width:720px;
  margin:0;
  padding:0;
}
.team-showcase .team-section{margin-top:clamp(24px,3.8vh,42px)}
.team-showcase .team-grid{
  width:100%;
  max-width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.team-showcase__gallery{
  position:relative;
  min-width:0;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:auto;
}
.team-3d-gallery{
  position:relative;
  width:min(100%,720px);
  height:min(680px,100%);
  min-height:520px;
  perspective:1200px;
  isolation:isolate;
}
.team-3d-gallery::before,
.team-3d-gallery::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
}
.team-3d-gallery::before{
  inset:4% 2% 6%;
  background:radial-gradient(circle at 48% 38%, rgba(25,210,255,.2), transparent 42%),radial-gradient(circle at 74% 62%, rgba(124,60,255,.18), transparent 48%);
  filter:blur(22px);
  opacity:.9;
}
.team-3d-gallery::after{
  inset:0;
  background:linear-gradient(180deg, var(--bg) 0%, transparent 14%, transparent 84%, var(--bg) 100%);
  z-index:3;
}
.team-3d-gallery__boxes{
  position:absolute;
  inset:-12% 2% -12% 0;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  transform:rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  transform-style:preserve-3d;
  will-change:transform;
}
.team-3d-gallery__column{
  --gallery-speed:32s;
  --gallery-offset:0px;
  overflow:hidden;
  border-radius:28px;
  transform:translateY(var(--gallery-offset));
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  mask-image:linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}
.team-3d-gallery__track{
  display:flex;
  flex-direction:column;
  gap:18px;
  animation:teamGalleryDrift var(--gallery-speed) linear infinite;
  will-change:transform;
}
.team-3d-gallery__column:nth-child(2) .team-3d-gallery__track{animation-direction:reverse}
.team-3d-gallery__column.is-paused .team-3d-gallery__track,
.team-3d-gallery__column.is-static .team-3d-gallery__track{animation-play-state:paused}
.team-3d-gallery__photo{
  appearance:none;
  border:1px solid rgba(255,255,255,.1);
  padding:0;
  width:100%;
  aspect-ratio:4/5;
  border-radius:20px;
  overflow:hidden;
  cursor:zoom-in;
  background:rgba(255,255,255,.04);
  box-shadow:0 24px 58px rgba(0,0,0,.36),0 0 26px rgba(25,210,255,.08),inset 0 1px 0 rgba(255,255,255,.12);
  transform:translateZ(0) scale(1);
  transition:opacity .28s ease,transform .28s ease,border-color .28s ease,box-shadow .28s ease,filter .28s ease;
}
.team-3d-gallery__photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.06) contrast(1.02) brightness(.95);
  transition:filter .28s ease,transform .28s ease;
}
.team-3d-gallery__photo.is-active{
  position:relative;
  z-index:2;
  opacity:1;
  transform:translateZ(52px) scale(1.08);
  border-color:rgba(25,210,255,.5);
  box-shadow:0 34px 76px rgba(0,0,0,.46),0 0 44px rgba(25,210,255,.24),inset 0 1px 0 rgba(255,255,255,.2);
}
.team-3d-gallery__photo.is-active img{filter:saturate(1.16) contrast(1.04) brightness(1.04)}
.team-3d-gallery.is-hovering .team-3d-gallery__photo.is-muted{
  opacity:.36;
  filter:grayscale(.24);
}
.team-3d-gallery__lightbox{
  position:fixed;
  inset:0;
  z-index:180;
  display:grid;
  place-items:center;
  padding:clamp(22px,4vw,56px);
  background:rgba(2,4,12,.84);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(18px);
  transition:opacity .22s ease;
}
.team-3d-gallery__lightbox img{
  max-width:min(980px,92vw);
  max-height:86vh;
  display:block;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 40px 110px rgba(0,0,0,.66),0 0 56px rgba(25,210,255,.14);
  object-fit:contain;
  transform:scale(.96);
  transition:transform .22s ease;
}
.team-3d-gallery.is-zoomed .team-3d-gallery__lightbox{
  opacity:1;
  pointer-events:auto;
}
.team-3d-gallery.is-zoomed .team-3d-gallery__lightbox img{transform:scale(1)}
.team-3d-gallery__close{
  position:fixed;
  top:22px;
  right:22px;
  z-index:190;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  opacity:0;
  pointer-events:none;
  cursor:pointer;
  background:rgba(5,7,20,.72);
  box-shadow:0 18px 46px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(14px);
  transition:opacity .2s ease,transform .2s ease,border-color .2s ease;
}
.team-3d-gallery__close::before,
.team-3d-gallery__close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:2px;
  border-radius:999px;
  background:#fff;
  transform:translate(-50%,-50%) rotate(45deg);
}
.team-3d-gallery__close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.team-3d-gallery.is-zoomed .team-3d-gallery__close{
  opacity:1;
  pointer-events:auto;
}
.team-3d-gallery__close:hover{
  transform:scale(1.06);
  border-color:rgba(25,210,255,.5);
}
@keyframes teamGalleryDrift{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(0,-50%,0)}
}
@media (max-width:1180px){
  .team-showcase{
    grid-template-columns:minmax(390px,48%) minmax(0,52%);
    gap:30px;
    width:calc(100% - 88px);
    margin-left:88px;
  }
  .team-3d-gallery{min-height:480px}
  .team-3d-gallery__boxes{gap:14px}
}
@media (max-width:980px){
  .team-showcase{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    width:calc(100% - 112px);
    height:auto;
    margin:72px 24px 72px 88px;
  }
  .team-showcase .team-hero{
    width:100%;
    margin:0;
  }
  .team-showcase .team-section{
    width:100%;
    margin-top:34px;
    padding:0;
  }
  .team-showcase .team-grid{
    grid-template-columns:1fr;
    max-width:620px;
  }
  .team-showcase__gallery{
    height:440px;
    margin-top:18px;
  }
  .team-3d-gallery{
    width:100%;
    height:100%;
    min-height:0;
  }
  .team-3d-gallery__boxes{
    inset:2% -10% 0;
    gap:14px;
    transform:rotateX(8deg) rotateY(-8deg) rotateZ(4deg);
  }
}
@media (max-width:620px){
  .team-showcase{
    width:calc(100% - 86px);
    margin:64px 16px 64px 70px;
    gap:24px;
  }
  .team-showcase__gallery{
    height:310px;
    margin-top:4px;
  }
  .team-3d-gallery__boxes{
    inset:0 -34% 0 0;
    display:flex;
    gap:14px;
    overflow:hidden;
    transform:none;
  }
  .team-3d-gallery__column{
    min-width:54%;
    border-radius:22px;
    transform:translateY(0);
  }
  .team-3d-gallery__column:nth-child(3){display:none}
  .team-3d-gallery__track{gap:14px}
  .team-3d-gallery__photo{
    border-radius:18px;
    aspect-ratio:4/4.8;
  }
}
@media (prefers-reduced-motion:reduce){
  .team-3d-gallery__track{animation:none}
  .team-3d-gallery__photo,
  .team-3d-gallery__photo img,
  .team-3d-gallery__lightbox,
  .team-3d-gallery__lightbox img{transition:none}
}
@media (min-width:981px){
  .team-showcase{
    height:calc(100vh - 148px);
    margin-top:clamp(18px,3vh,32px);
  }
}

/* ===== Team gallery correction pass ===== */
.team-header{
  z-index:30;
}
.team-showcase{
  grid-template-columns:minmax(390px,42%) minmax(0,58%);
  gap:clamp(32px,5vw,92px);
  width:calc(100% - 112px);
  overflow:visible;
}
.team-showcase__content{
  position:relative;
  z-index:12;
  max-width:660px;
}
.team-showcase .team-hero,
.team-showcase .team-section{
  max-width:660px;
}
.team-showcase .team-grid{
  max-width:660px;
}
.team-showcase__gallery{
  z-index:3;
  justify-content:flex-end;
  overflow:visible;
  transform:translateX(clamp(34px,5.6vw,92px));
}
.team-3d-gallery{
  width:min(100%,760px);
  max-width:760px;
  overflow:visible;
}
.team-3d-gallery::after{
  display:none;
}
.team-3d-gallery::before{
  z-index:0;
  inset:8% -4% 8% 8%;
  background:radial-gradient(circle at 54% 40%, rgba(25,210,255,.18), transparent 44%),radial-gradient(circle at 82% 64%, rgba(124,60,255,.16), transparent 46%);
  filter:blur(24px);
}
.team-3d-gallery__boxes{
  z-index:2;
  right:-18px;
  left:auto;
  width:min(720px,100%);
  transform:translateX(18px) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
}
.team-3d-gallery__column{
  -webkit-mask-image:none;
  mask-image:none;
}
.team-3d-gallery__lightbox{
  z-index:180;
}
.team-3d-gallery__close{
  z-index:190;
}
@media (min-width:1280px){
  .team-showcase__gallery{
    transform:translateX(clamp(70px,7vw,126px));
  }
  .team-3d-gallery__boxes{
    right:-34px;
    transform:translateX(30px) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (max-width:1180px){
  .team-showcase{
    grid-template-columns:minmax(370px,44%) minmax(0,56%);
    gap:28px;
  }
  .team-showcase__gallery{
    transform:translateX(34px);
  }
}
@media (max-width:980px){
  .team-showcase{
    overflow:visible;
  }
  .team-showcase__content,
  .team-showcase .team-hero,
  .team-showcase .team-section,
  .team-showcase .team-grid{
    max-width:620px;
  }
  .team-showcase__gallery{
    z-index:3;
    justify-content:center;
    transform:none;
    overflow:hidden;
  }
  .team-3d-gallery{
    max-width:none;
    overflow:hidden;
  }
  .team-3d-gallery::before,
  .team-3d-gallery::after{
    display:none;
  }
  .team-3d-gallery__boxes{
    left:0;
    right:auto;
    width:auto;
    transform:rotateX(8deg) rotateY(-8deg) rotateZ(4deg);
  }
}
@media (max-width:620px){
  .team-3d-gallery__boxes{
    transform:none;
  }
}

/* ===== Team gallery viewport fit pass ===== */
body{
  overflow-x:hidden;
}
.team-body,
.team-page{
  overflow-x:hidden;
}
@media (min-width:981px){
  .team-showcase{
    grid-template-columns:minmax(390px,44%) minmax(0,56%);
    gap:clamp(30px,4vw,70px);
    width:calc(100% - 112px);
    max-width:calc(100vw - 112px);
  }
  .team-showcase__content{
    max-width:650px;
  }
  .team-showcase .team-hero,
  .team-showcase .team-section,
  .team-showcase .team-grid{
    max-width:650px;
  }
  .team-showcase__gallery{
    justify-content:flex-end;
    justify-self:end;
    width:100%;
    max-width:min(48vw,720px);
    transform:translateX(0);
    overflow:visible;
  }
  .team-3d-gallery{
    width:100%;
    max-width:min(48vw,720px);
    transform:scale(.94);
    transform-origin:center right;
    overflow:visible;
  }
  .team-3d-gallery__boxes{
    left:auto;
    right:0;
    width:100%;
    max-width:100%;
    transform:rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (min-width:1280px){
  .team-showcase__gallery{
    max-width:min(47vw,720px);
    transform:translateX(0);
  }
  .team-3d-gallery{
    max-width:min(47vw,720px);
  }
  .team-3d-gallery__boxes{
    right:0;
    transform:rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (max-width:1180px) and (min-width:981px){
  .team-showcase__gallery{
    max-width:min(46vw,640px);
    transform:translateX(0);
  }
  .team-3d-gallery{
    max-width:min(46vw,640px);
    transform:scale(.9);
  }
}
.team-3d-gallery__lightbox{
  position:fixed;
  inset:0;
  z-index:180;
  display:grid;
  place-items:center;
  width:100vw;
  height:100vh;
  padding:clamp(18px,3vw,44px);
  overflow:hidden;
}
.team-3d-gallery__lightbox img{
  width:auto;
  height:auto;
  max-width:92vw;
  max-height:88vh;
  object-fit:contain;
  border-radius:18px;
  transform:none;
}
.team-3d-gallery.is-zoomed .team-3d-gallery__lightbox img{
  transform:none;
}
.team-3d-gallery__close{
  top:18px;
  right:18px;
}
@media (max-width:980px){
  .team-showcase__gallery,
  .team-3d-gallery,
  .team-3d-gallery__boxes{
    max-width:none;
    transform:none;
  }
  .team-3d-gallery__boxes{
    transform:rotateX(8deg) rotateY(-8deg) rotateZ(4deg);
  }
}
@media (max-width:620px){
  .team-3d-gallery__boxes{
    transform:none;
  }
  .team-3d-gallery__lightbox img{
    max-width:92vw;
    max-height:84vh;
  }
}

/* ===== Team gallery lightbox containment fix ===== */
@media (min-width:981px){
  .team-showcase__gallery{
    transform:none;
  }
  .team-3d-gallery{
    transform:none;
  }
  .team-3d-gallery__boxes{
    transform:scale(.94) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
    transform-origin:center right;
  }
}
@media (min-width:1280px){
  .team-showcase__gallery{
    transform:none;
  }
  .team-3d-gallery__boxes{
    right:0;
    transform:scale(.94) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (max-width:1180px) and (min-width:981px){
  .team-showcase__gallery,
  .team-3d-gallery{
    transform:none;
  }
  .team-3d-gallery__boxes{
    transform:scale(.9) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}

/* ===== Team gallery centered column and modal final pass ===== */
@media (min-width:981px){
  .team-showcase{
    display:grid;
    grid-template-columns:minmax(620px,760px) minmax(420px,1fr);
    column-gap:clamp(28px,3.4vw,58px);
    align-items:center;
    width:calc(100% - 126px);
    max-width:calc(100vw - 126px);
    margin-left:112px;
    overflow:visible;
  }
  .team-showcase__content{
    width:100%;
    max-width:760px;
    justify-self:start;
  }
  .team-showcase .team-hero,
  .team-showcase .team-section,
  .team-showcase .team-grid{
    max-width:760px;
  }
  .team-showcase__gallery{
    width:min(42vw,680px);
    max-width:680px;
    min-width:420px;
    justify-self:center;
    justify-content:center;
    transform:none;
    overflow:visible;
  }
  .team-3d-gallery{
    width:100%;
    max-width:680px;
    transform:none;
    overflow:visible;
  }
  .team-3d-gallery__boxes{
    left:0;
    right:0;
    width:100%;
    max-width:100%;
    margin:auto;
    transform:scale(.9) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
    transform-origin:center center;
  }
}
@media (min-width:1280px){
  .team-showcase__gallery{
    width:min(42vw,680px);
    max-width:680px;
    transform:none;
  }
  .team-3d-gallery__boxes{
    right:0;
    transform:scale(.92) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (max-width:1180px) and (min-width:981px){
  .team-showcase{
    grid-template-columns:minmax(560px,680px) minmax(360px,1fr);
    width:calc(100% - 100px);
    max-width:calc(100vw - 100px);
    margin-left:88px;
  }
  .team-showcase__gallery{
    width:min(40vw,600px);
    min-width:360px;
  }
  .team-3d-gallery__boxes{
    transform:scale(.84) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
.team-3d-gallery__lightbox,
.team-3d-gallery__close{
  display:none;
}
.team-gallery-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:48px;
  background:rgba(2,6,18,.88);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(16px);
  transition:opacity .2s ease;
}
.team-gallery-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.team-gallery-modal img{
  display:block;
  max-width:92vw;
  max-height:86vh;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 40px 110px rgba(0,0,0,.66),0 0 56px rgba(25,210,255,.14);
}
.team-gallery-modal__close{
  position:fixed;
  top:18px;
  right:18px;
  z-index:10000;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  cursor:pointer;
  background:rgba(5,7,20,.78);
  box-shadow:0 18px 46px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(14px);
}
.team-gallery-modal__close::before,
.team-gallery-modal__close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:2px;
  border-radius:999px;
  background:#fff;
  transform:translate(-50%,-50%) rotate(45deg);
}
.team-gallery-modal__close::after{
  transform:translate(-50%,-50%) rotate(-45deg);
}
.team-gallery-modal-open{
  overflow:hidden;
}
@media (max-width:980px){
  .team-showcase__gallery{
    width:100%;
    min-width:0;
    max-width:none;
    justify-self:auto;
    overflow:hidden;
  }
  .team-3d-gallery{
    max-width:none;
  }
  .team-3d-gallery__boxes{
    margin:0;
    transform:rotateX(8deg) rotateY(-8deg) rotateZ(4deg);
    transform-origin:center center;
  }
  .team-gallery-modal{
    padding:28px;
  }
  .team-gallery-modal img{
    max-width:92vw;
    max-height:84vh;
  }
}
@media (max-width:620px){
  .team-3d-gallery__boxes{
    transform:none;
  }
  .team-gallery-modal{
    padding:20px;
  }
}

/* ===== Team gallery local zoom final pass ===== */
.team-showcase__gallery,
.team-3d-gallery{
  position:relative;
  overflow:visible;
}
.team-3d-gallery{
  min-height:620px;
}
.team-gallery-modal{
  display:none;
}
.team-gallery-local-modal{
  position:absolute;
  inset:0;
  z-index:20;
  display:grid;
  place-items:center;
  padding:24px;
  border-radius:28px;
  background:rgba(2,6,18,.72);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(6px);
  transition:opacity .2s ease;
}
.team-gallery-local-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.team-gallery-local-modal img{
  display:block;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 32px 86px rgba(0,0,0,.56),0 0 44px rgba(25,210,255,.12);
}
.team-gallery-local-modal__close{
  position:absolute;
  top:16px;
  right:16px;
  z-index:21;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  cursor:pointer;
  background:rgba(5,7,20,.78);
  box-shadow:0 16px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(12px);
}
.team-gallery-local-modal__close::before,
.team-gallery-local-modal__close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:17px;
  height:2px;
  border-radius:999px;
  background:#fff;
  transform:translate(-50%,-50%) rotate(45deg);
}
.team-gallery-local-modal__close::after{
  transform:translate(-50%,-50%) rotate(-45deg);
}
.team-3d-gallery.is-local-zoomed .team-3d-gallery__boxes{
  opacity:.24;
  pointer-events:none;
}
.team-3d-gallery.is-local-zoomed .team-3d-gallery__column .team-3d-gallery__track{
  animation-play-state:paused;
}
@media (max-width:1180px) and (min-width:981px){
  .team-3d-gallery{
    min-height:560px;
  }
}
@media (max-width:980px){
  .team-showcase__gallery{
    overflow:hidden;
  }
  .team-3d-gallery{
    min-height:440px;
    overflow:hidden;
  }
  .team-gallery-local-modal{
    padding:18px;
    border-radius:22px;
  }
}
@media (max-width:620px){
  .team-3d-gallery{
    min-height:310px;
  }
  .team-gallery-local-modal{
    padding:14px;
    border-radius:20px;
  }
  .team-gallery-local-modal__close{
    top:12px;
    right:12px;
    width:38px;
    height:38px;
  }
}


/* ===== Team gallery balanced placement ===== */
@media (min-width:981px){
  .team-showcase{
    display:grid;
    grid-template-columns:minmax(620px,54vw) minmax(440px,1fr);
    column-gap:clamp(32px,5vw,90px);
    align-items:center;
  }
  .team-showcase__gallery{
    position:relative;
    justify-self:center;
    align-self:center;
    width:min(40vw,640px);
    max-width:640px;
    min-width:420px;
    min-height:620px;
    transform:translateX(-40px);
    overflow:visible;
  }
  .team-3d-gallery{
    position:relative;
    width:100%;
    max-width:640px;
    min-height:620px;
    overflow:visible;
    transform:none;
  }
  .team-3d-gallery__boxes{
    left:0;
    right:auto;
    width:100%;
    max-width:100%;
    margin:0;
    transform:scale(.9) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
    transform-origin:center center;
  }
  .team-gallery-local-modal{
    position:absolute;
    inset:0;
    z-index:30;
    display:grid;
    place-items:center;
    padding:28px;
    background:rgba(2,6,18,.78);
    border-radius:28px;
    transform:none;
  }
  .team-gallery-local-modal img{
    max-width:92%;
    max-height:78%;
    width:auto;
    height:auto;
    object-fit:contain;
  }
}
@media (max-width:1180px) and (min-width:981px){
  .team-showcase{
    grid-template-columns:minmax(560px,54vw) minmax(380px,1fr);
    column-gap:clamp(26px,4vw,56px);
  }
  .team-showcase__gallery{
    width:min(38vw,580px);
    min-width:360px;
    min-height:560px;
    transform:translateX(-24px);
  }
  .team-3d-gallery{
    min-height:560px;
  }
  .team-3d-gallery__boxes{
    transform:scale(.84) rotateX(14deg) rotateY(-15deg) rotateZ(10deg);
  }
}
@media (max-width:980px){
  .team-showcase__gallery{
    width:100%;
    min-width:0;
    min-height:440px;
    transform:none;
  }
  .team-3d-gallery{
    min-height:440px;
  }
  .team-gallery-local-modal img{
    max-width:92%;
    max-height:80%;
  }
}
@media (max-width:620px){
  .team-showcase__gallery,
  .team-3d-gallery{
    min-height:310px;
  }
}

/* ===== Team card contact icons ===== */
.team-socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
}
.team-socials a{
  width:34px;
  height:34px;
  display:inline-grid;
  place-items:center;
  border-radius:999px;
  color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.team-socials a:hover{
  color:#00d4ff;
  transform:translateY(-2px);
  border-color:rgba(0,212,255,.45);
  box-shadow:0 0 18px rgba(0,212,255,.20),inset 0 1px 0 rgba(255,255,255,.1);
  background:rgba(0,212,255,.08);
}
.team-socials svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.team-socials svg text{
  fill:currentColor;
  stroke:none;
  font-family:"Inter",system-ui,sans-serif;
}
@media (min-width:981px){
  .team-socials{
    margin-top:12px;
  }
  .team-socials a{
    width:32px;
    height:32px;
  }
  .team-socials svg{
    width:16px;
    height:16px;
  }
}
.team-card-copy > p:last-of-type{
  margin:11px 0 0;
  color:rgba(255,255,255,.8);
  font-size:13px;
  line-height:1.46;
  font-weight:500;
}
@media (min-width:981px){
  .team-card-copy > p:last-of-type{
    margin-top:9px;
    font-size:13px;
    line-height:1.46;
  }
}

/* ===== Team social icons containment fix ===== */
.team-card{
  height:auto;
  min-height:0;
  max-height:none;
  overflow:hidden;
}
.team-card-copy{
  display:flex;
  flex-direction:column;
  overflow:visible;
  padding-bottom:22px;
}
.team-socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
  padding-bottom:4px;
  flex:0 0 auto;
}
.team-socials a{
  flex:0 0 34px;
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  display:inline-grid;
  place-items:center;
  overflow:visible;
}
@media (min-width:981px){
  .team-card{
    height:auto;
    min-height:0;
    max-height:none;
  }
  .team-card-copy{
    padding-bottom:22px;
  }
  .team-socials{
    margin-top:14px;
    padding-bottom:2px;
  }
  .team-socials a{
    flex-basis:32px;
    width:32px;
    height:32px;
    min-width:32px;
    min-height:32px;
  }
}

/* ===== Hero social group ===== */
.social-links{
  position:absolute;
  left:112px;
  bottom:34px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:14px;
}
.social-links .hero-social{
  position:relative;
  left:auto;
  bottom:auto;
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.social-links .hero-social svg{
  width:18px;
  height:18px;
}
@media (max-width:900px){
  .social-links{
    left:88px;
    bottom:24px;
  }
}
@media (max-width:620px){
  .social-links{
    left:70px;
  }
}

/* ===== Hero institutional location ===== */
.hero-location{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:20px;
  margin-bottom:28px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  font-weight:500;
  transition:color .2s ease;
}
.hero-location:hover{
  color:#fff;
}
.hero-location svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
  color:#38bdf8;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 10px rgba(56,189,248,.18));
}
.hero-location span{
  display:inline-block;
}

/* ===== Hero location visibility tweak ===== */
.hero-location{
  color:#ffffff;
}
.hero-location svg{
  color:#22d3ee;
  flex-shrink:0;
}
.hero-location span{
  color:rgba(255,255,255,.92);
}

/* ===== Team premium carousel final pass ===== */
.team-showcase__gallery .team-3d-gallery,
.team-3d-gallery__boxes,
.team-gallery-local-modal,
.team-gallery-modal{
  display:none !important;
}

@media (min-width:981px){
  .team-showcase{
    grid-template-columns:minmax(520px,46%) minmax(540px,1fr);
    column-gap:clamp(34px,5vw,86px);
    align-items:center;
    width:calc(100% - 126px);
    max-width:calc(100vw - 126px);
    margin-left:112px;
  }

  .team-showcase__content{
    max-width:760px;
  }

  .team-showcase .team-hero,
  .team-showcase .team-section,
  .team-showcase .team-grid{
    max-width:760px;
  }

  .team-showcase__gallery{
    width:100%;
    max-width:none;
    min-width:0;
    min-height:560px;
    align-self:center;
    justify-self:stretch;
    justify-content:stretch;
    overflow:visible;
    transform:none;
  }
}

.team-carousel{
  position:relative;
  width:100%;
  min-height:560px;
  height:min(64vh,680px);
  overflow:hidden;
  isolation:isolate;
  border-radius:32px;
  background:#050a18;
  border:1px solid rgba(111,76,255,.42);
  box-shadow:
    0 34px 92px rgba(0,0,0,.55),
    0 0 58px rgba(24,200,255,.12),
    0 0 86px rgba(109,76,255,.13),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(24,200,255,.08);
}

.team-carousel::before,
.team-carousel::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
}

.team-carousel::before{
  background:
    radial-gradient(circle at 82% 18%, rgba(109,76,255,.34), transparent 32%),
    radial-gradient(circle at 18% 74%, rgba(24,200,255,.20), transparent 36%),
    linear-gradient(135deg, rgba(109,76,255,.26), rgba(24,200,255,.10) 38%, rgba(2,6,18,.72) 100%);
  mix-blend-mode:color;
  opacity:.78;
}

.team-carousel::after{
  background:
    linear-gradient(90deg, rgba(2,6,18,.58), rgba(2,6,18,.12) 44%, rgba(2,6,18,.42)),
    linear-gradient(180deg, rgba(2,6,18,.10), rgba(2,6,18,.58));
  opacity:.9;
}

.team-carousel__viewport{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  border-radius:inherit;
}

.team-carousel__track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .72s cubic-bezier(.22,.8,.2,1);
  will-change:transform;
}

.team-carousel__slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden;
  background:#060b19;
}

.team-carousel__slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:grayscale(.64) saturate(.58) contrast(1.02) brightness(.78);
  transform:scale(1.018);
}

.team-carousel__control{
  position:absolute;
  top:50%;
  z-index:4;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid rgba(120,95,255,.58);
  color:#fff;
  cursor:pointer;
  background:linear-gradient(135deg, rgba(109,76,255,.26), rgba(24,200,255,.14)), rgba(6,10,24,.42);
  box-shadow:0 16px 38px rgba(0,0,0,.34), 0 0 20px rgba(24,200,255,.13), inset 0 1px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(14px);
  transform:translateY(-50%);
  transition:transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.team-carousel__control span{
  display:block;
  font-size:42px;
  line-height:1;
  transform:translateY(-2px);
}

.team-carousel__control--prev{left:28px}
.team-carousel__control--next{right:28px}

.team-carousel__control:hover{
  border-color:rgba(24,200,255,.78);
  background:linear-gradient(135deg, rgba(109,76,255,.38), rgba(24,200,255,.22)), rgba(6,10,24,.58);
  box-shadow:0 18px 44px rgba(0,0,0,.38), 0 0 28px rgba(24,200,255,.20), 0 0 34px rgba(109,76,255,.16), inset 0 1px 0 rgba(255,255,255,.20);
}

.team-carousel__control--prev:hover{transform:translate(-2px,-50%)}
.team-carousel__control--next:hover{transform:translate(2px,-50%)}

.team-carousel__dots{
  position:absolute;
  left:50%;
  bottom:26px;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  transform:translateX(-50%);
}

.team-carousel__dot{
  width:9px;
  height:9px;
  padding:0;
  border:0;
  border-radius:999px;
  cursor:pointer;
  background:rgba(255,255,255,.38);
  box-shadow:0 0 0 1px rgba(255,255,255,.08);
  transition:width .22s ease, background .22s ease, box-shadow .22s ease, transform .22s ease;
}

.team-carousel__dot:hover{
  transform:scale(1.18);
  background:rgba(24,200,255,.76);
}

.team-carousel__dot.is-active{
  width:22px;
  background:linear-gradient(135deg, #6d4cff, #18c8ff);
  box-shadow:0 0 18px rgba(24,200,255,.42), 0 0 24px rgba(109,76,255,.28);
}

@media (max-width:1180px) and (min-width:981px){
  .team-showcase{
    grid-template-columns:minmax(500px,48%) minmax(430px,1fr);
    width:calc(100% - 100px);
    max-width:calc(100vw - 100px);
    margin-left:88px;
    column-gap:clamp(24px,4vw,52px);
  }

  .team-showcase__gallery,
  .team-carousel{
    min-height:520px;
  }
}

@media (max-width:980px){
  .team-showcase{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    width:calc(100% - 112px);
    height:auto;
    margin:72px 24px 72px 88px;
  }

  .team-showcase__gallery{
    width:100%;
    min-width:0;
    min-height:0;
    height:auto;
    margin-top:26px;
    overflow:visible;
    transform:none;
  }

  .team-carousel{
    min-height:430px;
    height:430px;
    border-radius:28px;
  }
}

@media (max-width:620px){
  .team-showcase{
    width:calc(100% - 86px);
    margin:64px 16px 64px 70px;
    gap:24px;
  }

  .team-showcase__gallery{
    margin-top:8px;
  }

  .team-carousel{
    min-height:320px;
    height:320px;
    border-radius:24px;
  }

  .team-carousel__control{
    width:40px;
    height:40px;
  }

  .team-carousel__control span{
    font-size:36px;
  }

  .team-carousel__control--prev{left:14px}
  .team-carousel__control--next{right:14px}
  .team-carousel__dots{bottom:18px;gap:9px}
}

@media (prefers-reduced-motion:reduce){
  .team-carousel__track,
  .team-carousel__control,
  .team-carousel__dot{
    transition:none;
  }
}


.team-carousel__slide.is-missing{
  background:
    radial-gradient(circle at 28% 24%, rgba(109,76,255,.24), transparent 34%),
    radial-gradient(circle at 76% 72%, rgba(24,200,255,.18), transparent 38%),
    linear-gradient(135deg, #050714, #071226 62%, #050714);
}

.team-carousel__slide.is-missing img{
  display:none;
}


/* ===== Team desktop vertical alignment tweak ===== */
@media (min-width:981px){
  .team-showcase{
    align-items:center;
    margin-top:calc(clamp(18px,3vh,32px) - 80px);
  }

  .team-showcase__content,
  .team-showcase__gallery{
    align-self:center;
  }
}


/* ===== Team carousel no-arrows and right-side alignment ===== */
.team-carousel__control,
.team-carousel__control--prev,
.team-carousel__control--next{
  display:none !important;
}

@media (min-width:981px){
  .team-showcase__gallery{
    transform:translateY(80px);
  }

  .team-carousel{
    transform:none;
  }
}


/* ===== Team carousel desktop fine tune ===== */
@media (min-width:981px){
  .team-showcase__gallery{
    min-height:515px;
    transform:translateY(110px);
  }

  .team-carousel{
    min-height:515px;
    height:min(58vh,625px);
  }
}


/* ===== Contact page ===== */
.contact-body{
  min-height:100vh;
  overflow-x:hidden;
  background:#050714;
}

.contact-page{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  color:#fff;
  background:
    radial-gradient(circle at 82% 64%, rgba(109,76,255,.22), transparent 32%),
    radial-gradient(circle at 88% 18%, rgba(24,200,255,.12), transparent 28%),
    linear-gradient(115deg, #050714 0%, #060917 48%, #071226 100%);
}

.contact-page::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.18;
  background-image:linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:74px 74px;
  mask-image:linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
}

.contact-ambient{
  position:absolute;
  right:-12vw;
  bottom:-18vh;
  z-index:-1;
  width:min(820px,62vw);
  height:min(620px,58vh);
  pointer-events:none;
  background:
    radial-gradient(ellipse at 58% 52%, rgba(109,76,255,.55), transparent 48%),
    radial-gradient(ellipse at 38% 64%, rgba(24,200,255,.30), transparent 42%),
    url("assets/fondo web ladevlabs red neuronal.webp") center/cover no-repeat;
  opacity:.46;
  filter:blur(.2px) saturate(1.1);
  mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse at 52% 55%, #000 0%, rgba(0,0,0,.8) 38%, transparent 76%);
  mask-image:radial-gradient(ellipse at 52% 55%, #000 0%, rgba(0,0,0,.8) 38%, transparent 76%);
}

.contact-header{
  z-index:5;
}

.contact-header .nav a{
  position:relative;
  padding-bottom:9px;
}

.contact-header .nav a.is-active{
  opacity:1;
  color:#fff;
}

.contact-header .nav a.is-active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, #8c45ff, #18c8ff);
  box-shadow:0 0 16px rgba(24,200,255,.35);
}

.contact-shell{
  position:relative;
  z-index:1;
  width:min(100% - 142px, 1420px);
  min-height:calc(100vh - 132px);
  margin:34px auto 0;
  display:grid;
  grid-template-columns:minmax(390px, .92fr) minmax(560px, 1.18fr);
  gap:clamp(58px,7vw,120px);
  align-items:center;
}

.contact-info{
  max-width:560px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.contact-kicker{
  color:#b36cff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.24em;
  text-transform:uppercase;
  text-shadow:0 0 18px rgba(124,60,255,.24);
}

.contact-info h1{
  margin:20px 0 0;
  max-width:650px;
  white-space:normal;
  font-size:clamp(3.1rem,5vw,5.15rem);
  line-height:.98;
  font-weight:800;
  letter-spacing:-.055em;
}

.contact-info h1 span{
  display:block;
  background:linear-gradient(100deg, #8c45ff 0%, #19d2ff 94%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.contact-lead{
  max-width:610px;
  margin:22px 0 0;
  color:rgba(255,255,255,.86);
  font-size:18px;
  line-height:1.62;
  font-weight:500;
}

.contact-list{
  display:grid;
  gap:22px;
  margin-top:42px;
}

.contact-item{
  display:flex;
  align-items:center;
  gap:18px;
  color:#fff;
}

.contact-item__icon,
.contact-form-heading__icon,
.contact-response-card__icon{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(109,76,255,.46);
  background:linear-gradient(135deg, rgba(109,76,255,.16), rgba(24,200,255,.08)), rgba(8,13,31,.62);
  box-shadow:0 18px 44px rgba(0,0,0,.24), 0 0 22px rgba(24,200,255,.10), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}

.contact-item__icon{
  width:62px;
  height:62px;
  border-radius:14px;
}

.contact-item svg,
.contact-response-card svg,
.contact-form-heading svg,
.contact-submit svg,
.contact-safe svg,
.contact-socials svg{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.contact-item__icon svg{
  width:31px;
  height:31px;
  color:#19d2ff;
  filter:drop-shadow(0 0 10px rgba(25,210,255,.30));
}

.contact-item strong{
  display:block;
  margin-bottom:7px;
  color:#a866ff;
  font-size:16px;
  font-weight:800;
}

.contact-item small{
  display:block;
  color:#fff;
  font-size:18px;
  font-weight:500;
}

.contact-response-card{
  width:min(100%,440px);
  margin-top:42px;
  padding:16px;
  display:flex;
  align-items:center;
  gap:18px;
  border:1px solid rgba(109,76,255,.34);
  border-radius:14px;
  background:linear-gradient(135deg, rgba(109,76,255,.12), rgba(24,200,255,.04)), rgba(7,11,27,.56);
  box-shadow:0 26px 70px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(16px);
}

.contact-response-card__icon{
  width:66px;
  height:66px;
  border-radius:14px;
}

.contact-response-card__icon svg{
  width:40px;
  height:40px;
  color:#19d2ff;
}

.contact-response-card strong{
  display:block;
  color:#fff;
  font-size:15px;
  line-height:1.35;
}

.contact-response-card strong b{
  color:#19d2ff;
}

.contact-response-card small{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.68);
  font-size:13px;
  line-height:1.5;
}

.contact-socials{
  display:flex;
  gap:18px;
  margin-top:76px;
}

.contact-socials a{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#fff;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  transition:transform .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.contact-socials a:hover{
  color:#19d2ff;
  border-color:rgba(24,200,255,.56);
  box-shadow:0 0 24px rgba(24,200,255,.16), inset 0 1px 0 rgba(255,255,255,.10);
  transform:translateY(-2px);
}

.contact-socials svg{
  width:24px;
  height:24px;
}

.contact-socials a:nth-child(2) svg{
  fill:currentColor;
  stroke:none;
}

.contact-form-card{
  width:100%;
  max-width:720px;
  justify-self:end;
  padding:36px 40px 38px;
  border:1px solid rgba(109,76,255,.42);
  border-radius:18px;
  background:linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018)), rgba(6,10,26,.70);
  box-shadow:0 34px 96px rgba(0,0,0,.42), 0 0 70px rgba(109,76,255,.10), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
}

.contact-form-heading{
  display:flex;
  align-items:center;
  gap:22px;
  margin-bottom:34px;
}

.contact-form-heading__icon{
  width:64px;
  height:64px;
  border-radius:14px;
}

.contact-form-heading__icon svg{
  width:34px;
  height:34px;
  color:#19d2ff;
}

.contact-form-heading h2{
  margin:0;
  font-size:24px;
  line-height:1.15;
  letter-spacing:-.03em;
}

.contact-form-heading p{
  margin:8px 0 0;
  color:rgba(255,255,255,.72);
  font-size:16px;
  line-height:1.45;
}

.contact-form{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
}

.contact-form label{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.contact-form label span{
  color:#fff;
  font-size:14px;
  font-weight:800;
}

.contact-form input,
.contact-form textarea{
  width:100%;
  border:1px solid rgba(109,76,255,.34);
  border-radius:7px;
  background:rgba(4,8,23,.52);
  color:#fff;
  outline:none;
  font:inherit;
  font-size:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.contact-form input{
  min-height:86px;
  padding:31px 22px 18px;
}

.contact-form textarea{
  min-height:166px;
  padding:18px 22px;
  resize:vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:rgba(255,255,255,.48);
}

.contact-form input:hover,
.contact-form textarea:hover{
  border-color:rgba(24,200,255,.42);
}

.contact-form input:focus,
.contact-form textarea:focus{
  border-color:rgba(24,200,255,.76);
  background:rgba(8,13,31,.72);
  box-shadow:0 0 0 3px rgba(24,200,255,.10), 0 0 24px rgba(109,76,255,.12), inset 0 1px 0 rgba(255,255,255,.08);
}

.contact-form__full,
.contact-submit{
  grid-column:1 / -1;
}

.contact-submit{
  min-height:52px;
  margin-top:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:0;
  border-radius:7px;
  color:#fff;
  cursor:pointer;
  font:inherit;
  font-size:16px;
  font-weight:800;
  background:linear-gradient(100deg, #8c45ff 0%, #19d2ff 100%);
  box-shadow:0 18px 44px rgba(24,200,255,.20), 0 12px 34px rgba(109,76,255,.22), inset 0 1px 0 rgba(255,255,255,.24);
  transition:transform .2s ease, box-shadow .2s ease;
}

.contact-submit svg{
  width:22px;
  height:22px;
}

.contact-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 56px rgba(24,200,255,.30), 0 16px 42px rgba(109,76,255,.28), inset 0 1px 0 rgba(255,255,255,.28);
}

.contact-safe{
  display:flex;
  align-items:center;
  gap:10px;
  margin:30px 0 0;
  color:rgba(255,255,255,.62);
  font-size:14px;
  line-height:1.45;
}

.contact-safe svg{
  width:18px;
  height:18px;
  flex:0 0 auto;
  color:rgba(255,255,255,.54);
}

@media (max-width:1180px){
  .contact-shell{
    width:calc(100% - 88px);
    grid-template-columns:minmax(350px,.9fr) minmax(500px,1.1fr);
    gap:40px;
  }

  .contact-form-card{
    padding:30px;
  }
}

@media (max-width:980px){
  .contact-page{
    min-height:100vh;
    overflow:auto;
  }

  .contact-shell{
    width:calc(100% - 112px);
    min-height:0;
    margin:72px 24px 86px 88px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:34px;
  }

  .contact-info,
  .contact-form-card{
    max-width:none;
    width:100%;
  }

  .contact-form-card{
    justify-self:auto;
  }

  .contact-socials{
    margin-top:36px;
  }

  .contact-ambient{
    width:86vw;
    right:-28vw;
    bottom:-10vh;
    opacity:.34;
  }
}

@media (max-width:620px){
  .contact-shell{
    width:calc(100% - 86px);
    margin:64px 16px 82px 70px;
  }

  .contact-info h1{
    font-size:43px;
  }

  .contact-lead,
  .contact-item small{
    font-size:16px;
  }

  .contact-item__icon{
    width:54px;
    height:54px;
  }

  .contact-form-card{
    padding:22px;
    border-radius:16px;
  }

  .contact-form-heading{
    align-items:flex-start;
    gap:14px;
    margin-bottom:26px;
  }

  .contact-form-heading__icon{
    width:52px;
    height:52px;
  }

  .contact-form{
    grid-template-columns:1fr;
  }

  .contact-form input{
    min-height:74px;
    padding:28px 18px 15px;
  }

  .contact-response-card{
    align-items:flex-start;
  }
}


/* ===== Contact compact desktop pass ===== */
.contact-page::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:28px;
  width:1px;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(124,60,255,0), rgba(124,60,255,.58) 24%, rgba(25,210,255,.7) 58%, rgba(25,210,255,0));
  box-shadow:0 0 14px rgba(25,210,255,.22), 0 0 26px rgba(124,60,255,.16);
}

.contact-socials{
  display:none !important;
}

@media (min-width:981px){
  .contact-page{
    height:100vh;
  }

  .contact-shell{
    width:min(100% - 142px, 1360px);
    min-height:calc(100vh - 118px);
    margin:12px auto 0;
    grid-template-columns:minmax(370px,.9fr) minmax(540px,1.08fr);
    gap:clamp(44px,6vw,92px);
    align-items:center;
  }

  .contact-info{
    max-width:535px;
  }

  .contact-kicker{
    font-size:12px;
  }

  .contact-info h1{
    margin-top:14px;
    font-size:clamp(2.65rem,4.15vw,4.45rem);
    line-height:.98;
  }

  .contact-lead{
    margin-top:16px;
    font-size:16px;
    line-height:1.55;
  }

  .contact-list{
    gap:16px;
    margin-top:30px;
  }

  .contact-item{
    gap:15px;
  }

  .contact-item__icon{
    width:54px;
    height:54px;
    border-radius:13px;
  }

  .contact-item__icon svg{
    width:28px;
    height:28px;
  }

  .contact-item strong{
    margin-bottom:5px;
    font-size:15px;
  }

  .contact-item small{
    font-size:16px;
  }

  .contact-response-card{
    width:min(100%,420px);
    margin-top:30px;
    padding:14px;
    gap:16px;
  }

  .contact-response-card__icon{
    width:56px;
    height:56px;
    border-radius:13px;
  }

  .contact-response-card__icon svg{
    width:34px;
    height:34px;
  }

  .contact-response-card strong{
    font-size:14px;
  }

  .contact-response-card small{
    margin-top:5px;
    font-size:12px;
    line-height:1.45;
  }

  .contact-form-card{
    max-width:680px;
    padding:28px 32px 26px;
    border-radius:17px;
  }

  .contact-form-heading{
    gap:18px;
    margin-bottom:24px;
  }

  .contact-form-heading__icon{
    width:54px;
    height:54px;
    border-radius:13px;
  }

  .contact-form-heading__icon svg{
    width:30px;
    height:30px;
  }

  .contact-form-heading h2{
    font-size:22px;
  }

  .contact-form-heading p{
    margin-top:6px;
    font-size:15px;
  }

  .contact-form{
    gap:14px 16px;
  }

  .contact-form label{
    gap:8px;
  }

  .contact-form label span{
    font-size:13px;
  }

  .contact-form input{
    min-height:64px;
    padding:24px 18px 12px;
    font-size:15px;
  }

  .contact-form textarea{
    min-height:112px;
    padding:15px 18px;
    font-size:15px;
  }

  .contact-submit{
    min-height:48px;
    font-size:15px;
  }

  .contact-safe{
    margin-top:20px;
    font-size:13px;
  }
}

@media (max-width:900px){
  .contact-page::after{
    left:24px;
  }
}

@media (max-width:620px){
  .contact-page::after{
    left:20px;
  }
}


/* ===== Contact form/title fine tune ===== */
.contact-header .nav a.is-active::after{
  display:none;
}

@media (min-width:981px){
  .contact-info h1{
    max-width:640px;
    font-size:clamp(2.75rem,4.1vw,4.35rem);
    line-height:1.02;
    font-weight:800;
    letter-spacing:-.055em;
  }

  .contact-info h1 span{
    display:block;
  }

  .contact-form input{
    min-height:51px;
    padding:16px 16px 9px;
  }

  .contact-form textarea{
    min-height:96px;
    padding:13px 16px;
  }

  .contact-form label{
    gap:6px;
  }
}

@media (max-width:620px){
  .contact-info h1{
    font-size:44px;
    line-height:1.02;
  }
}


/* ===== Contact validation states ===== */
.contact-form input.is-invalid,
.contact-form textarea.is-invalid{
  border-color:rgba(255,92,122,.78);
  box-shadow:0 0 0 3px rgba(255,92,122,.10), 0 0 22px rgba(255,92,122,.14), inset 0 1px 0 rgba(255,255,255,.06);
}

.contact-form input.is-valid,
.contact-form textarea.is-valid{
  border-color:rgba(24,200,255,.58);
  box-shadow:0 0 0 3px rgba(24,200,255,.08), 0 0 20px rgba(24,200,255,.10), inset 0 1px 0 rgba(255,255,255,.06);
}

.contact-field-error{
  min-height:16px;
  color:#ff7891;
  font-size:12px;
  line-height:1.35;
  font-weight:700;
  text-shadow:0 0 14px rgba(255,92,122,.16);
}

.contact-submit:disabled{
  cursor:not-allowed;
  opacity:.58;
  transform:none;
  box-shadow:0 10px 28px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.10);
}

.contact-submit:disabled:hover{
  transform:none;
  box-shadow:0 10px 28px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.10);
}

.contact-form-status{
  min-height:20px;
  margin:14px 0 0;
  color:rgba(255,255,255,.70);
  font-size:13px;
  line-height:1.45;
  font-weight:700;
}

.contact-form-status.is-pending{
  color:#9fdfff;
}

.contact-form-status.is-success{
  color:#79f2c0;
}

.contact-form-status.is-error{
  color:#ff7891;
}

@media (min-width:981px){
  .contact-field-error{
    min-height:14px;
    font-size:11px;
  }

  .contact-form-status{
    margin-top:10px;
    font-size:12px;
  }
}


/* ===== Error pages ===== */
.error-body{
  min-height:100vh;
  overflow:hidden;
  background:#050714;
}

.error-page{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  color:#fff;
  background:
    radial-gradient(circle at 76% 22%, rgba(24,200,255,.12), transparent 30%),
    radial-gradient(circle at 20% 78%, rgba(109,76,255,.16), transparent 34%),
    linear-gradient(115deg, #050714 0%, #060917 48%, #071226 100%);
}

.error-page::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.16;
  background-image:linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:74px 74px;
  mask-image:linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
}

.error-page::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:28px;
  width:1px;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(124,60,255,0), rgba(124,60,255,.58) 24%, rgba(25,210,255,.7) 58%, rgba(25,210,255,0));
  box-shadow:0 0 14px rgba(25,210,255,.22), 0 0 26px rgba(124,60,255,.16);
}

.error-ambient{
  position:absolute;
  right:-12vw;
  bottom:-18vh;
  z-index:-1;
  width:min(760px,60vw);
  height:min(560px,54vh);
  pointer-events:none;
  background:
    radial-gradient(ellipse at 58% 52%, rgba(109,76,255,.52), transparent 48%),
    radial-gradient(ellipse at 38% 64%, rgba(24,200,255,.28), transparent 42%),
    url("assets/fondo web ladevlabs red neuronal.webp") center/cover no-repeat;
  opacity:.42;
  filter:saturate(1.08);
  mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse at 52% 55%, #000 0%, rgba(0,0,0,.78) 38%, transparent 76%);
  mask-image:radial-gradient(ellipse at 52% 55%, #000 0%, rgba(0,0,0,.78) 38%, transparent 76%);
}

.error-header{
  z-index:4;
}

.error-shell{
  position:relative;
  z-index:1;
  flex:1;
  width:min(100% - 112px, 980px);
  margin:0 auto;
  display:grid;
  place-items:center;
  padding:clamp(42px,6vh,78px) 0;
}

.error-code{
  position:absolute;
  z-index:-1;
  top:50%;
  left:50%;
  transform:translate(-50%,-52%);
  font-size:clamp(9rem,22vw,19rem);
  line-height:.8;
  font-weight:800;
  letter-spacing:-.08em;
  color:transparent;
  background:linear-gradient(115deg, rgba(140,69,255,.42), rgba(24,200,255,.36));
  -webkit-background-clip:text;
  background-clip:text;
  filter:blur(.2px) drop-shadow(0 0 44px rgba(24,200,255,.12));
  opacity:.42;
  user-select:none;
}

.error-card{
  width:min(100%,620px);
  padding:42px;
  text-align:center;
  border:1px solid rgba(109,76,255,.42);
  border-radius:18px;
  background:linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.018)), rgba(6,10,26,.72);
  box-shadow:0 34px 96px rgba(0,0,0,.42), 0 0 70px rgba(109,76,255,.12), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
}

.error-kicker{
  display:inline-block;
  color:#b36cff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.24em;
  text-transform:uppercase;
  text-shadow:0 0 18px rgba(124,60,255,.24);
}

.error-card h1{
  margin:18px 0 0;
  max-width:none;
  white-space:normal;
  font-size:clamp(2.45rem,4.6vw,4.25rem);
  line-height:1;
  font-weight:800;
  letter-spacing:-.055em;
}

.error-card p{
  max-width:500px;
  margin:18px auto 0;
  color:rgba(255,255,255,.78);
  font-size:17px;
  line-height:1.6;
  font-weight:500;
}

.error-actions{
  display:flex;
  justify-content:center;
  gap:16px;
  margin-top:30px;
}

@media (max-width:900px){
  .error-page::after{left:24px}
  .error-shell{width:calc(100% - 112px);margin-left:88px;margin-right:24px}
}

@media (max-width:620px){
  .error-body{overflow:auto}
  .error-page{min-height:760px}
  .error-page::after{left:20px}
  .error-shell{width:calc(100% - 86px);margin:0 16px 0 70px;place-items:center stretch}
  .error-card{padding:30px 22px;text-align:left}
  .error-card h1{font-size:42px}
  .error-actions{flex-direction:column;align-items:stretch}
  .error-actions .btn{width:100%}
  .error-code{font-size:38vw;opacity:.30}
}


/* ===== Contact title and lead alignment ===== */
.contact-lead{
  color:rgba(255,255,255,.78);
  font-size:17px;
  line-height:1.55;
  font-weight:500;
}

.contact-info h1 span{
  white-space:nowrap;
}

@media (min-width:981px){
  .contact-shell{
    grid-template-columns:minmax(470px,1fr) minmax(500px,.98fr);
    gap:clamp(34px,4.8vw,74px);
  }

  .contact-info{
    max-width:680px;
  }

  .contact-info h1{
    max-width:680px;
  }

  .contact-form-card{
    max-width:640px;
  }
}

@media (max-width:620px){
  .contact-info h1 span{
    white-space:normal;
  }
}


/* ===== Team member photo framing ===== */
.team-photo--andy img{
  object-position:center 35%;
}

.team-photo--lu img{
  object-position:center 30%;
}


/* ===== Hero split typewriter ===== */
.hero-title #typewriter{
  display:inline-block;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.hero-title .cursor{
  background:var(--cyan);
  box-shadow:0 0 14px rgba(25,210,255,.42);
}
/* Proyectos premium redesign */
.projects-page{
  min-height:100vh;
  overflow-x:hidden;
  background:var(--bg);
}

.projects-page-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at 82% 18%, rgba(25,210,255,.14), transparent 30%),
    radial-gradient(circle at 78% 84%, rgba(124,60,255,.16), transparent 34%),
    linear-gradient(115deg, #050714 0%, #050714 46%, #071427 100%);
}

.projects-page-shell::after{
  z-index:4;
}

.projects-page-shell::before{
  z-index:4;
}

.projects-ambient{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}

.projects-ambient::before{
  content:"";
  position:absolute;
  right:-12%;
  bottom:-24%;
  width:min(820px,70vw);
  aspect-ratio:1;
  background:
    radial-gradient(circle at 48% 44%, rgba(25,210,255,.2), transparent 26%),
    radial-gradient(circle at 54% 48%, rgba(124,60,255,.28), transparent 42%),
    url("assets/fondo web ladevlabs red neuronal.webp") center/cover no-repeat;
  opacity:.42;
  filter:blur(.4px) saturate(1.08);
  mix-blend-mode:screen;
  transform:rotate(-7deg);
}

.projects-ambient::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(5,7,20,.96) 0%, rgba(5,7,20,.84) 42%, rgba(5,7,20,.5) 100%),
    linear-gradient(180deg, rgba(5,7,20,.08), rgba(5,7,20,.72));
}

.projects-header{
  z-index:5;
}

.projects-shell{
  width:min(1360px,calc(100% - 150px));
  margin:clamp(52px,7vh,78px) auto 84px;
  position:relative;
  z-index:2;
}

.projects-hero{
  max-width:1040px;
  margin-bottom:34px;
}

.projects-kicker{
  display:block;
  margin-bottom:16px;
  color:#b377ff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.28em;
  text-transform:uppercase;
}

.projects-hero h1{
  max-width:1120px;
  margin:0;
  font-size:clamp(2.85rem,4.3vw,4.65rem);
  line-height:1.03;
  font-weight:800;
  letter-spacing:-.055em;
  white-space:normal;
  text-shadow:0 8px 48px rgba(0,0,0,.58);
}

.projects-hero h1 span{
  display:inline-block;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.projects-hero p{
  max-width:780px;
  margin:18px 0 0;
  color:var(--muted);
  font-size:18px;
  line-height:1.68;
  font-weight:500;
}

.projects-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  align-items:stretch;
}

.project-card-premium{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:540px;
  border:1px solid rgba(124,60,255,.35);
  border-radius:26px;
  background:rgba(8,12,28,.86);
  box-shadow:
    0 26px 72px rgba(0,0,0,.42),
    0 0 0 1px rgba(25,210,255,.08),
    0 0 36px rgba(124,60,255,.15);
  cursor:pointer;
  isolation:isolate;
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease var(--delay,0ms), transform .7s ease var(--delay,0ms), border-color .24s ease, box-shadow .24s ease;
}

.project-card-premium::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    radial-gradient(circle at 24% 18%, rgba(124,60,255,.2), transparent 34%),
    radial-gradient(circle at 82% 4%, rgba(25,210,255,.14), transparent 30%);
  opacity:.9;
  z-index:2;
}

.project-card-premium.is-visible{
  opacity:1;
  transform:translateY(0);
}

.project-card-premium:hover,
.project-card-premium:focus-visible{
  transform:translateY(-7px);
  border-color:rgba(25,210,255,.52);
  box-shadow:
    0 34px 92px rgba(0,0,0,.5),
    0 0 0 1px rgba(25,210,255,.14),
    0 0 46px rgba(124,60,255,.22);
  outline:none;
}

.project-card-media{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#070b18;
  z-index:0;
}

.project-card-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(6,10,25,.3), rgba(5,7,20,.82) 52%, rgba(4,7,19,.92)),
    linear-gradient(135deg, rgba(109,76,255,.36), rgba(24,200,255,.15) 48%, rgba(3,7,20,.7)),
    radial-gradient(circle at 72% 16%, rgba(25,210,255,.18), transparent 36%);
  opacity:.96;
  z-index:1;
}

.project-card-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  filter:grayscale(.18) saturate(.74) contrast(.95) brightness(.82);
  transform:scale(1.02);
  transition:transform .55s ease, filter .55s ease;
}

.project-card-premium:hover .project-card-media img{
  transform:scale(1.09);
  filter:grayscale(.06) saturate(.84) contrast(1) brightness(.9);
}

.project-card-body{
  position:relative;
  z-index:3;
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  padding:clamp(26px,3.6vh,40px) 24px 24px;
  text-align:center;
}

.project-card-center{
  display:flex;
  flex:1;
  width:100%;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
}

.project-card-logo{
  width:min(86%,300px);
  height:clamp(94px,12.5vh,136px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.project-card-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  filter:drop-shadow(0 10px 26px rgba(4,7,20,.55)) drop-shadow(0 0 18px rgba(25,210,255,.15));
}

.project-card-logo--dentguard img{
  transform:scale(1.16);
}

.project-card-logo--americana img{
  transform:scale(1.03);
}

.project-card-logo--green img{
  transform:scale(1.02);
}

.project-card-premium .project-status{
  flex:0 0 auto;
  margin-top:2px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(11,19,46,.56);
  border:1px solid rgba(25,210,255,.26);
  color:rgba(255,255,255,.88);
  font-size:11px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:normal;
}

.project-status--advanced{box-shadow:0 0 22px rgba(124,60,255,.14)}
.project-status--development{box-shadow:0 0 22px rgba(25,210,255,.12)}
.project-status--live{box-shadow:0 0 22px rgba(37,211,102,.12)}

.project-card-body p{
  margin:0;
  max-width:300px;
  color:rgba(255,255,255,.76);
  font-size:15px;
  line-height:1.52;
  font-weight:560;
  text-shadow:0 10px 28px rgba(0,0,0,.32);
}

.project-card-points{
  display:none;
}

.project-card-action{
  width:min(210px,100%);
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 18px;
  border:1px solid rgba(25,210,255,.22);
  border-radius:15px;
  color:#fff;
  font-size:14px;
  font-weight:800;
  letter-spacing:.02em;
  background:linear-gradient(135deg, rgba(124,60,255,.88), rgba(25,210,255,.8));
  box-shadow:0 14px 30px rgba(25,210,255,.14), 0 0 30px rgba(124,60,255,.2), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.project-card-action:hover,
.project-card-action:focus-visible{
  transform:translateY(-2px);
  filter:saturate(1.08);
  box-shadow:0 18px 36px rgba(25,210,255,.18), 0 0 38px rgba(124,60,255,.26), inset 0 1px 0 rgba(255,255,255,.26);
  outline:none;
}

.projects-page .project-detail-overlay{
  background:rgba(2,5,16,.72);
  backdrop-filter:blur(18px);
}

.projects-page .project-detail-panel,
.project-detail-overlay .project-detail-panel{
  width:min(1040px,calc(100vw - 42px));
  max-height:min(760px,calc(100vh - 46px));
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr);
  overflow:hidden;
  border:1px solid rgba(124,60,255,.42);
  border-radius:30px;
  background:
    linear-gradient(145deg, rgba(13,18,42,.94), rgba(5,9,23,.96)),
    rgba(255,255,255,.04);
  box-shadow:
    0 34px 110px rgba(0,0,0,.64),
    0 0 0 1px rgba(25,210,255,.08),
    0 0 54px rgba(124,60,255,.18);
}

.project-detail-overlay .project-detail-media{
  min-height:100%;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 46%, rgba(25,210,255,.08), transparent 44%),
    linear-gradient(180deg, rgba(6,10,24,.94), rgba(4,8,20,.98));
}

.project-detail-overlay .project-detail-media::after{
  background:
    linear-gradient(180deg, rgba(5,7,20,.06), rgba(5,7,20,.38)),
    linear-gradient(135deg, rgba(124,60,255,.3), rgba(25,210,255,.18) 48%, rgba(5,7,20,.5));
  opacity:.7;
}

.project-detail-overlay .project-detail-media img{
  width:100%;
  height:100%;
  padding:26px;
  object-fit:contain;
  object-position:center;
  filter:grayscale(.08) saturate(.9) contrast(.98) brightness(.92);
}

.project-detail-overlay .project-detail-content{
  padding:42px;
  background:
    radial-gradient(circle at 85% 8%, rgba(25,210,255,.12), transparent 28%),
    radial-gradient(circle at 12% 100%, rgba(124,60,255,.12), transparent 32%);
}

.project-detail-overlay .project-detail-close{
  top:18px;
  right:18px;
  min-width:44px;
  height:44px;
  padding:0 16px;
  border:1px solid rgba(25,210,255,.3);
  border-radius:999px;
  background:rgba(8,13,29,.72);
  color:rgba(255,255,255,.9);
  backdrop-filter:blur(12px);
  box-shadow:0 12px 28px rgba(0,0,0,.28), 0 0 22px rgba(124,60,255,.12);
}

.project-detail-overlay .project-detail-close:hover{
  color:#fff;
  border-color:rgba(25,210,255,.58);
  background:rgba(16,24,52,.86);
}

.project-detail-overlay .project-detail-content h2{
  font-size:clamp(2.2rem,3vw,3.35rem);
  letter-spacing:-.05em;
}

.project-detail-overlay .project-detail-description{
  color:rgba(255,255,255,.76);
}

.project-detail-overlay .project-detail-section,
.project-detail-overlay .project-detail-solution{
  border:1px solid rgba(124,60,255,.24);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}

.project-detail-overlay .project-detail-section{
  padding:18px 22px 20px;
}

.project-detail-overlay .project-detail-section h3{
  margin:0 0 14px;
}

.project-detail-overlay .project-detail-section ul{
  padding-left:18px;
}

.project-detail-overlay .project-detail-section li{
  padding-left:24px;
}

.project-detail-overlay .project-detail-cta{
  border-radius:17px;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  box-shadow:0 18px 38px rgba(25,210,255,.18), 0 0 32px rgba(124,60,255,.18);
}

@media (max-width:1120px){
  .projects-shell{
    width:min(1040px,calc(100% - 92px));
  }

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

  .project-card-premium{
    min-height:460px;
  }

  .project-detail-overlay .project-detail-panel{
    grid-template-columns:1fr;
    max-height:calc(100vh - 34px);
    overflow:auto;
  }

  .project-detail-overlay .project-detail-media{
    min-height:300px;
  }
}

@media (max-width:760px){
  .projects-shell{
    width:calc(100% - 42px);
    margin:54px 18px 78px 64px;
  }

  .projects-grid{
    grid-template-columns:1fr;
  }

  .projects-hero{
    margin-bottom:26px;
  }

  .projects-hero h1{
    font-size:clamp(2.35rem,12vw,3.3rem);
    line-height:1.02;
  }

  .projects-hero p{
    font-size:16px;
    line-height:1.62;
  }

  .project-card-premium{
    min-height:430px;
  }

  .project-card-body{
    padding:22px 18px 18px;
  }

  .project-card-logo{
    width:min(86%,250px);
    height:90px;
  }

  .project-card-body p{
    font-size:14px;
    line-height:1.48;
  }

  .project-card-action{
    width:min(220px,100%);
  }

  .project-detail-overlay .project-detail-content{
    padding:30px 22px 24px;
  }

  .project-detail-overlay .project-detail-media{
    min-height:220px;
  }
}

@media (prefers-reduced-motion:reduce){
  .project-card-premium,
  .project-card-media img,
  .project-card-action{
    transition:none;
  }
}

/* ===== Proyectos compact desktop fit ===== */
@media (min-width:1121px){
  .projects-page{
    overflow:hidden;
  }

  .projects-page-shell{
    min-height:100vh;
    max-height:100vh;
    overflow:hidden;
  }

  .projects-shell{
    width:min(1440px,calc(100% - 120px));
    margin:clamp(8px,1.4vh,16px) auto clamp(40px,4.6vh,55px);
    flex:1 1 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
  }

  .projects-hero{
    max-width:1180px;
    margin-bottom:clamp(9px,1.3vh,14px);
  }

  .projects-kicker{
    margin-bottom:7px;
    font-size:12px;
    letter-spacing:.26em;
  }

  .projects-hero h1{
    max-width:1220px;
    font-size:clamp(2.16rem,2.72vw,3.08rem);
    line-height:.98;
  }

  .projects-hero p{
    max-width:760px;
    margin-top:8px;
    font-size:14px;
    line-height:1.32;
  }

  .projects-grid{
    gap:clamp(16px,1.2vw,22px);
    flex:1 1 auto;
    min-height:0;
    padding-bottom:clamp(22px,calc(70px - 4.4vh),40px);
  }

  .project-card-premium{
    min-height:0;
    height:100%;
    border-radius:24px;
  }

  .project-card-premium:hover,
  .project-card-premium:focus-visible{
    transform:translateY(-5px);
  }

  .project-card-body{
    padding:clamp(22px,2.8vh,38px) 20px 20px;
  }

  .project-card-center{
    gap:14px;
  }

  .project-card-logo{
    width:min(88%,292px);
    height:clamp(110px,13.6vh,152px);
    padding:0;
    border-radius:0;
  }

  .project-card-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
  }

  .project-card-logo--green img,
  .project-card-logo--americana img{
    max-height:none;
  }

  .project-card-premium .project-status{
    padding:8px 12px;
    font-size:10px;
    letter-spacing:.08em;
  }

  .project-card-body p{
    max-width:294px;
    font-size:14px;
    line-height:1.46;
  }

  .project-card-action{
    min-height:42px;
    padding:11px 16px;
    border-radius:13px;
    font-size:13px;
  }
}

@media (min-width:1121px) and (max-height:940px){
  .projects-header{
    padding-top:20px;
  }

  .projects-header .brand img{
    width:78px;
  }

  .projects-shell{
    margin-top:8px;
    margin-bottom:42px;
  }

  .projects-hero{
    margin-bottom:8px;
  }

  .projects-grid{
    padding-bottom:30px;
  }

  .projects-hero h1{
    font-size:clamp(1.95rem,2.36vw,2.62rem);
  }

  .projects-hero p{
    margin-top:5px;
    font-size:13px;
    line-height:1.26;
  }

  .project-card-premium{
    height:100%;
  }

  .project-card-body{
    padding:18px 16px 16px;
  }

  .project-card-logo{
    height:112px;
  }

  .project-card-body p{
    font-size:13px;
    line-height:1.34;
  }

  .project-card-action{
    min-height:39px;
  }
}

/* ===== Project modal image clarity ===== */
.project-detail-overlay .project-detail-media{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:linear-gradient(145deg, rgba(4,7,18,.96), rgba(8,13,30,.94));
}

.project-detail-overlay .project-detail-media::after{
  display:none;
  content:none;
}

.project-detail-overlay .project-detail-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  filter:none;
  opacity:1;
  mix-blend-mode:normal;
  transform:none;
  image-rendering:auto;
}

@media (max-width:1120px){
  .project-detail-overlay .project-detail-media{
    padding:14px;
  }
}

/* ===== Project card and modal slideshows ===== */
.project-card-media .project-card-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  opacity:0;
  filter:grayscale(.2) saturate(.72) contrast(.96) brightness(.82);
  transform:scale(1.02);
  transition:opacity .7s ease, transform .55s ease, filter .55s ease;
}

.project-card-media .project-card-slide.is-active{
  opacity:1;
}

.project-card-premium:hover .project-card-media .project-card-slide.is-active{
  transform:scale(1.075);
  filter:grayscale(.08) saturate(.82) contrast(1) brightness(.88);
}

.project-detail-overlay .project-detail-media{
  position:relative;
}

.project-detail-overlay .project-detail-media img{
  transition:opacity .28s ease;
}

.project-detail-overlay .project-detail-media img.is-fading{
  opacity:0;
}

.project-detail-dots{
  position:absolute;
  left:50%;
  bottom:18px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:8px 10px;
  border:1px solid rgba(25,210,255,.18);
  border-radius:999px;
  background:rgba(5,8,20,.58);
  box-shadow:0 12px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  transform:translateX(-50%);
}

.project-detail-dots[hidden]{
  display:none;
}

.project-detail-dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.42);
  cursor:pointer;
  transition:width .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.project-detail-dot.is-active{
  width:22px;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  box-shadow:0 0 14px rgba(25,210,255,.42);
}

.project-detail-dot:hover,
.project-detail-dot:focus-visible{
  background:rgba(255,255,255,.86);
  outline:none;
  transform:translateY(-1px);
}

@media (prefers-reduced-motion:reduce){
  .project-card-media .project-card-slide,
  .project-detail-overlay .project-detail-media img,
  .project-detail-dot{
    transition:none;
  }
}

/* ===== Project detail software-first modal ===== */
@media (min-width:1121px){
  .project-detail-overlay .project-detail-panel{
    width:min(1420px,calc(100vw - 52px));
    max-height:min(840px,calc(100vh - 48px));
    grid-template-columns:minmax(0,69fr) minmax(330px,31fr);
  }
}

.project-detail-overlay .project-detail-media{
  padding:0;
  min-height:clamp(520px,76vh,820px);
  background:
    radial-gradient(circle at 18% 18%, rgba(124,60,255,.28), transparent 32%),
    radial-gradient(circle at 82% 28%, rgba(25,210,255,.2), transparent 34%),
    linear-gradient(145deg, rgba(4,8,24,.98), rgba(11,15,42,.94) 48%, rgba(3,7,20,.98));
  cursor:default;
}

.project-detail-overlay .project-detail-media img{
  padding:0;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  transform:scale(1);
  transform-origin:center;
  transition:opacity .28s ease, transform .38s ease;
  will-change:transform, opacity;
}


.project-detail-arrow{
  position:absolute;
  top:50%;
  z-index:4;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(25,210,255,.24);
  border-radius:999px;
  color:#fff;
  background:rgba(5,9,24,.48);
  box-shadow:0 14px 34px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(14px);
  cursor:pointer;
  transform:translateY(-50%);
  transition:transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.project-detail-arrow[hidden]{
  display:none;
}

.project-detail-arrow--prev{left:18px}
.project-detail-arrow--next{right:18px}

.project-detail-arrow:hover,
.project-detail-arrow:focus-visible{
  background:linear-gradient(135deg, rgba(124,60,255,.38), rgba(25,210,255,.22));
  border-color:rgba(25,210,255,.58);
  box-shadow:0 18px 40px rgba(0,0,0,.38), 0 0 26px rgba(25,210,255,.18);
  outline:none;
}

.project-detail-arrow--prev:hover,
.project-detail-arrow--prev:focus-visible{
  transform:translateY(-50%) translateX(-2px);
}

.project-detail-arrow--next:hover,
.project-detail-arrow--next:focus-visible{
  transform:translateY(-50%) translateX(2px);
}

.project-detail-dots{
  bottom:20px;
  gap:7px;
  padding:9px 12px;
  border-color:rgba(255,255,255,.12);
  background:rgba(8,12,28,.54);
  box-shadow:0 16px 38px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.14);
}

.project-detail-dot{
  width:7px;
  height:7px;
  background:rgba(255,255,255,.42);
}

.project-detail-dot.is-active{
  width:26px;
}

.project-detail-overlay .project-detail-content{
  padding:clamp(30px,3vw,42px);
}











@media (max-width:1120px){
  .project-detail-overlay .project-detail-panel{
    grid-template-columns:1fr;
  }

  .project-detail-overlay .project-detail-media{
    min-height:clamp(300px,48vh,520px);
  }

  .project-detail-arrow{
    width:40px;
    height:40px;
  }




}

@media (max-width:620px){
  .project-detail-arrow{
    width:36px;
    height:36px;
  }

  .project-detail-arrow--prev{left:10px}
  .project-detail-arrow--next{right:10px}

  .project-detail-dots{
    bottom:12px;
    max-width:calc(100% - 28px);
    overflow:hidden;
  }
}

@media (prefers-reduced-motion:reduce){
  .project-detail-overlay .project-detail-media img,
  .project-detail-arrow,
}

/* ===== Title descender rendering fix ===== */
.hero-title,
.projects-hero h1,
.contact-info h1{
  line-height:1.1;
  overflow:visible;
}

.hero-title #typewriter,
.projects-hero h1 span,
.contact-info h1 span{
  line-height:1.1;
  overflow:visible;
}

.hero-title #typewriter{
  display:inline;
}

/* ===== Unified site navigation component ===== */
.header,
.team-header,
.contact-header,
.projects-header,
.error-header{
  width:100%;
  padding:28px 58px 0 63px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  position:relative;
  z-index:40;
}

.header .brand,
.team-header .brand,
.contact-header .brand,
.projects-header .brand,
.error-header .brand{
  display:inline-flex;
  align-items:center;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  transform:none;
  filter:none;
}

.header .brand img,
.team-header .brand img,
.contact-header .brand img,
.projects-header .brand img,
.error-header .brand img{
  width:92px;
  height:auto;
  display:block;
}

.header .nav,
.team-header .nav,
.contact-header .nav,
.projects-header .nav,
.error-header .nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:34px;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  text-shadow:none;
  font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;
  font-weight:800;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.header .nav a,
.team-header .nav a,
.contact-header .nav a,
.projects-header .nav a,
.error-header .nav a{
  position:static;
  display:inline-flex;
  align-items:center;
  padding:0;
  margin:0;
  color:rgba(255,255,255,.94);
  opacity:.9;
  font:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  transition:opacity .2s ease, color .2s ease, transform .2s ease;
}

.header .nav a:hover,
.team-header .nav a:hover,
.contact-header .nav a:hover,
.projects-header .nav a:hover,
.error-header .nav a:hover{
  opacity:1;
  color:var(--cyan);
  transform:translateY(-1px);
}

.header .nav a::after,
.team-header .nav a::after,
.contact-header .nav a::after,
.projects-header .nav a::after,
.error-header .nav a::after{
  display:none;
  content:none;
}

@media (max-width:900px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    padding:22px 24px 0 59px;
  }

  .header .brand img,
  .team-header .brand img,
  .contact-header .brand img,
  .projects-header .brand img,
  .error-header .brand img{
    width:78px;
  }

  .header .nav,
  .team-header .nav,
  .contact-header .nav,
  .projects-header .nav,
  .error-header .nav{
    gap:18px;
    font-size:12px;
  }
}

@media (max-width:620px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    align-items:flex-start;
  }

  .header .nav,
  .team-header .nav,
  .contact-header .nav,
  .projects-header .nav,
  .error-header .nav{
    flex-direction:column;
    align-items:flex-end;
    gap:12px;
  }
}

/* ===== Contact world background ===== */
.contact-page{
  background:
    linear-gradient(90deg, rgba(5,7,20,.96) 0%, rgba(5,7,20,.88) 42%, rgba(5,7,20,.70) 100%),
    radial-gradient(circle at 74% 26%, rgba(25,210,255,.16), transparent 34%),
    radial-gradient(circle at 86% 78%, rgba(124,60,255,.18), transparent 36%),
    url("assets/fondo web ladevlabs-mundo.webp") center/cover no-repeat fixed;
}

.contact-page::before{
  background:
    linear-gradient(180deg, rgba(5,7,20,.18), rgba(5,7,20,.62)),
    linear-gradient(90deg, rgba(5,7,20,.14), rgba(5,7,20,.42));
}

.contact-ambient{
  opacity:.24;
}

@media (max-width:900px){
  .contact-page{
    background:
      linear-gradient(180deg, rgba(5,7,20,.94), rgba(5,7,20,.82)),
      radial-gradient(circle at 72% 20%, rgba(25,210,255,.13), transparent 36%),
      radial-gradient(circle at 84% 76%, rgba(124,60,255,.15), transparent 38%),
      url("assets/fondo web ladevlabs-mundo.webp") center/cover no-repeat;
  }
}

/* ===== Projects neural background ===== */
.projects-page-shell{
  background:
    linear-gradient(90deg, rgba(5,7,20,.96) 0%, rgba(5,7,20,.88) 42%, rgba(5,7,20,.76) 100%),
    radial-gradient(circle at 78% 20%, rgba(25,210,255,.14), transparent 34%),
    radial-gradient(circle at 84% 82%, rgba(124,60,255,.18), transparent 38%),
    url("assets/fondo web ladevlabs red neuronal.webp") center/cover no-repeat fixed;
}

.projects-ambient::before{
  opacity:.18;
}

.projects-ambient::after{
  background:
    linear-gradient(90deg, rgba(5,7,20,.72) 0%, rgba(5,7,20,.48) 46%, rgba(5,7,20,.62) 100%),
    linear-gradient(180deg, rgba(5,7,20,.16), rgba(5,7,20,.58));
}

@media (max-width:900px){
  .projects-page-shell{
    background:
      linear-gradient(180deg, rgba(5,7,20,.95), rgba(5,7,20,.82)),
      radial-gradient(circle at 72% 18%, rgba(25,210,255,.12), transparent 36%),
      radial-gradient(circle at 84% 78%, rgba(124,60,255,.16), transparent 38%),
      url("assets/fondo web ladevlabs red neuronal.webp") center/cover no-repeat;
  }
}

/* ===== Projects background sharpness fix ===== */
.projects-page-shell{
  background-image:url("assets/fondo web ladevlabs red neuronal.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
}

.projects-ambient::before{
  background:
    radial-gradient(circle at 78% 20%, rgba(25,210,255,.14), transparent 34%),
    radial-gradient(circle at 84% 82%, rgba(124,60,255,.18), transparent 38%);
  opacity:1;
  filter:none;
  transform:none;
  mix-blend-mode:screen;
}

.projects-ambient::after{
  background:
    linear-gradient(90deg, rgba(5,7,20,.96) 0%, rgba(5,7,20,.88) 42%, rgba(5,7,20,.76) 100%),
    linear-gradient(180deg, rgba(5,7,20,.10), rgba(5,7,20,.58));
}

@media (min-width:1673px){
  .projects-page-shell{
    background-size:100% auto;
    background-position:center top;
  }
}

@media (max-width:900px){
  .projects-page-shell{
    background-image:url("assets/fondo web ladevlabs red neuronal.webp");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:scroll;
  }

  .projects-ambient::after{
    background:
      linear-gradient(180deg, rgba(5,7,20,.95), rgba(5,7,20,.82)),
      radial-gradient(circle at 72% 18%, rgba(25,210,255,.12), transparent 36%),
      radial-gradient(circle at 84% 78%, rgba(124,60,255,.16), transparent 38%);
  }
}

/* ===== Team page background image ===== */
.team-page{
  background:
    linear-gradient(rgba(6,10,22,.78), rgba(6,10,22,.84)),
    url("assets/fondo web ladevlabs team.webp") center center/cover no-repeat fixed;
}

.team-ambient{
  opacity:.36;
}

.team-ambient::after{
  background:linear-gradient(90deg, rgba(5,7,20,.82) 0%, rgba(5,7,20,.58) 42%, rgba(5,7,20,.22) 100%);
}

@media (max-width:900px){
  .team-page{
    background:
      linear-gradient(rgba(6,10,22,.82), rgba(6,10,22,.88)),
      url("assets/fondo web ladevlabs team.webp") center center/cover no-repeat scroll;
  }
}

/* ===== Global background art direction ===== */
/* Index: generated code background, kept sharp and more visible */
.code-stage{
  opacity:1;
  filter:none;
  background:
    radial-gradient(ellipse at 70% 46%, rgba(25,210,255,.22), transparent 54%),
    radial-gradient(ellipse at 48% 56%, rgba(124,60,255,.08), transparent 52%),
    linear-gradient(90deg,#04070f 0%,#050816 30%,#060b17 58%,#050914 78%,#03060d 100%);
}

.code-wall{
  opacity:1;
  filter:saturate(1.18);
}

.code-glow{
  opacity:.88;
  filter:blur(24px);
}

.hero-overlay{
  background:
    linear-gradient(90deg, rgba(4,7,14,.92) 0%, rgba(5,8,22,.82) 28%, rgba(5,8,22,.58) 48%, rgba(5,8,22,.22) 72%, rgba(5,8,22,.06) 100%),
    radial-gradient(ellipse at 70% 46%, rgba(25,210,255,.10), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.012) 0%, transparent 24%, rgba(5,8,22,.20) 100%);
}

/* Proyectos: neural image most visible, sharp, overlay separated */
.projects-page-shell{
  background-image:url("assets/fondo web ladevlabs red neuronal.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
}

.projects-ambient::before{
  background:
    radial-gradient(circle at 78% 20%, rgba(25,210,255,.12), transparent 34%),
    radial-gradient(circle at 84% 82%, rgba(124,60,255,.14), transparent 38%);
  opacity:1;
  filter:none;
  transform:none;
  mix-blend-mode:screen;
}

.projects-ambient::after{
  background:
    linear-gradient(90deg, rgba(5,7,20,.84) 0%, rgba(5,7,20,.70) 42%, rgba(5,7,20,.58) 100%),
    linear-gradient(180deg, rgba(5,7,20,.06), rgba(5,7,20,.42));
}

/* Equipo: office/team mood, medium overlay */
.team-page{
  background:
    linear-gradient(rgba(6,10,22,.64), rgba(6,10,22,.72)),
    url("assets/fondo web ladevlabs team.webp") center center/cover no-repeat fixed;
}

.team-ambient{
  opacity:.30;
  filter:none;
}

.team-ambient::after{
  background:linear-gradient(90deg, rgba(5,7,20,.76) 0%, rgba(5,7,20,.50) 42%, rgba(5,7,20,.20) 100%);
}

/* Contacto: world background subtle, form remains protagonist */
.contact-page{
  background:
    linear-gradient(90deg, rgba(5,7,20,.92) 0%, rgba(5,7,20,.86) 42%, rgba(5,7,20,.78) 100%),
    radial-gradient(circle at 74% 26%, rgba(25,210,255,.10), transparent 34%),
    radial-gradient(circle at 86% 78%, rgba(124,60,255,.12), transparent 36%),
    url("assets/fondo web ladevlabs-mundo.webp") center/cover no-repeat fixed;
}

.contact-page::before{
  background:
    linear-gradient(180deg, rgba(5,7,20,.22), rgba(5,7,20,.68)),
    linear-gradient(90deg, rgba(5,7,20,.20), rgba(5,7,20,.50));
}

.contact-ambient{
  opacity:.18;
  filter:none;
}

@media (min-width:1673px){
  .projects-page-shell{
    background-size:100% auto;
    background-position:center top;
  }
}

@media (max-width:900px){
  .projects-page-shell{
    background-image:url("assets/fondo web ladevlabs red neuronal.webp");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:scroll;
  }

  .team-page{
    background:
      linear-gradient(rgba(6,10,22,.72), rgba(6,10,22,.80)),
      url("assets/fondo web ladevlabs team.webp") center center/cover no-repeat scroll;
  }

  .contact-page{
    background:
      linear-gradient(180deg, rgba(5,7,20,.92), rgba(5,7,20,.86)),
      radial-gradient(circle at 72% 20%, rgba(25,210,255,.09), transparent 36%),
      radial-gradient(circle at 84% 76%, rgba(124,60,255,.10), transparent 38%),
      url("assets/fondo web ladevlabs-mundo.webp") center/cover no-repeat;
  }
}

/* ===== Project modal non-interactive images ===== */
.project-detail-overlay .project-detail-media,
.project-detail-overlay .project-detail-media img{
  cursor:default;
}



/* ===== Responsive stability audit pass ===== */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

img,
svg,
video,
canvas{
  max-width:100%;
}

.hero,
.projects-page-shell,
.team-page,
.contact-page,
.error-page{
  width:100%;
}

.hero-content{
  width:min(1180px,calc(100% - 172px));
}

.hero-title{
  max-width:min(1180px,calc(100vw - 172px));
  white-space:normal;
  text-wrap:balance;
}

.hero-title #typewriter{
  white-space:normal;
}

.projects-hero h1,
.team-hero h1,
.contact-info h1,
.error-card h1{
  overflow:visible;
  text-wrap:balance;
}

.projects-shell,
.team-showcase,
.contact-shell,
.error-shell{
  min-width:0;
}

.project-card-premium,
.team-card,
.contact-form-card,
.contact-response,
.error-card{
  min-width:0;
}

@media (max-width:1366px) and (min-width:981px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    padding-top:22px;
  }

  .hero-content{
    margin-top:clamp(104px,17vh,150px);
  }

  .hero-title{
    max-width:calc(100vw - 168px);
  }

  .team-showcase{
    grid-template-columns:minmax(510px,53%) minmax(360px,1fr);
  }

  .team-showcase__gallery,
  .team-carousel{
    min-height:clamp(430px,56vh,510px);
  }

  .contact-shell{
    gap:clamp(28px,3vw,44px);
    grid-template-columns:minmax(390px,.96fr) minmax(480px,1.04fr);
  }
}

@media (max-width:1120px){
  .projects-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .project-card-premium{
    height:auto;
    min-height:460px;
  }

  .project-detail-overlay .project-detail-panel{
    grid-template-columns:1fr;
    width:min(920px,calc(100vw - 28px));
    max-height:calc(100vh - 28px);
    overflow:auto;
  }

  .project-detail-overlay .project-detail-media{
    min-height:clamp(300px,46vh,480px);
  }
}

@media (max-width:980px){
  .hero,
  .projects-page-shell,
  .team-page,
  .contact-page,
  .error-page{
    min-height:100svh;
    height:auto;
    overflow-x:hidden;
  }

  .hero-content{
    width:calc(100% - 112px);
    margin:clamp(104px,14vh,140px) 24px 96px 88px;
  }

  .hero-title{
    max-width:100%;
    white-space:normal;
  }

  .hero-actions{
    max-width:560px;
  }

  .projects-shell,
  .team-showcase,
  .contact-shell{
    width:calc(100% - 112px);
    max-width:none;
    margin-left:88px;
    margin-right:24px;
  }

  .team-showcase{
    grid-template-columns:1fr;
    gap:34px;
    padding-bottom:70px;
  }

  .team-showcase__content,
  .team-showcase__gallery{
    min-width:0;
    width:100%;
  }

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

  .team-showcase__gallery,
  .team-carousel{
    min-height:clamp(360px,48vh,500px);
    transform:none;
  }

  .contact-shell{
    grid-template-columns:1fr;
    gap:28px;
    padding-bottom:72px;
  }

  .contact-info,
  .contact-form-card{
    width:100%;
    max-width:none;
  }

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

  .error-shell{
    width:calc(100% - 112px);
    margin-left:88px;
    margin-right:24px;
  }
}

@media (max-width:834px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    gap:20px;
  }

  .header .nav,
  .team-header .nav,
  .contact-header .nav,
  .projects-header .nav,
  .error-header .nav{
    gap:14px;
    font-size:11px;
  }

  .projects-grid{
    grid-template-columns:1fr;
  }

  .project-card-premium{
    min-height:0;
  }

  .project-card-media{
    height:clamp(190px,32vw,260px);
  }

  .team-showcase .team-grid{
    grid-template-columns:1fr;
    max-width:620px;
  }
}

@media (max-width:620px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    padding:18px 16px 0 56px;
    gap:12px;
  }

  .header .brand img,
  .team-header .brand img,
  .contact-header .brand img,
  .projects-header .brand img,
  .error-header .brand img{
    width:70px;
  }

  .header .nav,
  .team-header .nav,
  .contact-header .nav,
  .projects-header .nav,
  .error-header .nav{
    gap:8px;
    font-size:10px;
    line-height:1.05;
  }

  .hero-content{
    width:calc(100% - 84px);
    margin:clamp(92px,15vh,118px) 14px 92px 70px;
  }

  .hero-title{
    font-size:clamp(2.35rem,11.5vw,3.05rem);
    line-height:1.12;
    letter-spacing:-.045em;
  }

  .hero-actions{
    gap:12px;
  }

  .hero-actions .btn{
    width:100%;
  }

  .hero-social{
    left:70px;
    bottom:24px;
  }

  .projects-shell,
  .team-showcase,
  .contact-shell,
  .error-shell{
    width:calc(100% - 86px);
    margin-left:70px;
    margin-right:16px;
  }

  .projects-shell{
    margin-top:46px;
    margin-bottom:78px;
  }

  .projects-hero h1,
  .team-hero h1,
  .contact-info h1,
  .error-card h1{
    font-size:clamp(2.35rem,10.5vw,3.05rem);
    line-height:1.12;
    letter-spacing:-.045em;
  }

  .projects-hero p,
  .team-hero p,
  .contact-lead,
  .error-card p{
    font-size:16px;
    line-height:1.58;
  }

  .project-card-body,
  .contact-form-card,
  .error-card{
    padding:22px;
  }

  .project-detail-overlay{
    padding:10px;
  }

  .project-detail-overlay .project-detail-panel{
    width:100%;
    max-height:calc(100svh - 20px);
    border-radius:18px;
  }

  .project-detail-overlay .project-detail-media{
    min-height:clamp(220px,38vh,330px);
  }

  .project-detail-overlay .project-detail-content{
    padding:24px 18px 20px;
  }

  .project-detail-overlay .project-detail-content h2{
    font-size:clamp(2rem,10vw,2.75rem);
    line-height:1.08;
  }

  .team-showcase{
    margin-top:46px;
    gap:26px;
    padding-bottom:70px;
  }

  .team-showcase .team-hero,
  .team-showcase .team-section{
    width:100%;
    margin-left:0;
    margin-right:0;
  }

  .team-showcase__gallery,
  .team-carousel{
    min-height:clamp(280px,42vh,380px);
  }

  .team-card__photo,
  .team-photo{
    min-height:150px;
  }

  .contact-shell{
    margin-top:46px;
    padding-bottom:78px;
  }

  .contact-form{
    grid-template-columns:1fr;
  }

  .contact-form input,
  .contact-form textarea{
    min-height:48px;
    font-size:16px;
  }

  .contact-form textarea{
    min-height:126px;
  }

  .contact-items,
  .contact-response{
    max-width:100%;
  }

  .error-shell{
    min-height:calc(100svh - 100px);
    padding:44px 0 72px;
  }

  .error-actions{
    flex-direction:column;
  }

  .error-actions .btn{
    width:100%;
  }
}

@media (max-width:390px){
  .header,
  .team-header,
  .contact-header,
  .projects-header,
  .error-header{
    padding-left:50px;
    padding-right:12px;
  }

  .header .brand img,
  .team-header .brand img,
  .contact-header .brand img,
  .projects-header .brand img,
  .error-header .brand img{
    width:64px;
  }

  .header .nav,
  .team-header .nav,
  .contact-header .nav,
  .projects-header .nav,
  .error-header .nav{
    font-size:9px;
    gap:7px;
  }

  .hero-content,
  .projects-shell,
  .team-showcase,
  .contact-shell,
  .error-shell{
    width:calc(100% - 74px);
    margin-left:62px;
    margin-right:12px;
  }

  .hero-title,
  .projects-hero h1,
  .team-hero h1,
  .contact-info h1,
  .error-card h1{
    font-size:clamp(2.05rem,10.8vw,2.55rem);
  }
}

/* ===== Responsive tap target stability ===== */
.header .nav a,
.team-header .nav a,
.contact-header .nav a,
.projects-header .nav a,
.error-header .nav a{
  min-height:32px;
  display:inline-flex;
  align-items:center;
}

.team-carousel__dot,
.project-detail-dot{
  position:relative;
  min-width:24px;
  min-height:24px;
  width:24px;
  height:24px;
  display:inline-grid;
  place-items:center;
  background:transparent;
}

.team-carousel__dot::before,
.project-detail-dot::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.42);
  transition:width .2s ease, background .2s ease, box-shadow .2s ease;
}

.team-carousel__dot.is-active::before,
.project-detail-dot.is-active::before{
  width:22px;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  box-shadow:0 0 14px rgba(25,210,255,.42);
}

.team-carousel__dot.is-active,
.project-detail-dot.is-active{
  width:24px;
}

/* ===== Team carousel dots containment ===== */
.team-carousel__dots{
  max-width:calc(100% - 24px);
  flex-wrap:wrap;
  gap:4px;
}

@media (max-width:620px){
  .team-carousel__dots{
    bottom:12px;
    max-width:calc(100% - 20px);
    row-gap:2px;
  }
}

/* ===== Desktop inline typewriter fix ===== */
@media (min-width:981px){
  .hero-content{
    width:min(1280px,calc(100% - 172px));
  }

  .hero-title{
    max-width:none;
    width:max-content;
    white-space:nowrap;
    text-wrap:normal;
    overflow:visible;
    line-height:1.1;
  }

  .hero-title #typewriter{
    display:inline;
    white-space:nowrap;
    text-wrap:normal;
    overflow:visible;
    line-height:1.1;
  }

  .hero-title .cursor{
    display:inline-block;
    vertical-align:-.08em;
  }
}

@media (max-width:980px){
  .hero-title,
  .hero-title #typewriter{
    white-space:normal;
    text-wrap:balance;
  }
}

/* ===== Team notebook height tuning ===== */
@media (min-width:981px) and (max-width:1600px) and (max-height:920px){
  .team-page{
    overflow-x:hidden;
    overflow-y:visible;
  }

  .team-showcase{
    height:auto;
    min-height:calc(100vh - 84px);
    margin:clamp(2px,.5vh,10px) 0 0 112px;
    align-items:stretch;
    column-gap:clamp(24px,3.5vw,52px);
  }

  .team-showcase__content{
    padding-top:0;
  }

  .team-showcase .team-hero,
  .team-showcase .team-section{
    max-width:760px;
  }

  .team-showcase .team-hero{
    padding-top:clamp(10px,1.2vh,20px);
    padding-bottom:20px;
  }

  .team-showcase .team-hero h1{
    max-width:760px;
    font-size:clamp(2.5rem,4.2vw,4.25rem);
    line-height:.96;
  }

  .team-showcase .team-hero p{
    max-width:640px;
    margin-top:16px;
    font-size:16px;
    line-height:1.62;
  }

  .team-showcase .team-section{
    margin-top:18px;
  }

  .team-showcase .team-section h2{
    font-size:clamp(1.65rem,2.8vw,2.7rem);
    line-height:1.04;
  }

  .team-showcase .team-grid{
    gap:18px;
  }

  .team-card{
    min-height:0;
  }

  .team-photo{
    aspect-ratio:16/9.8;
  }

  .team-card-copy{
    padding:18px 18px 20px;
  }

  .team-showcase__gallery{
    height:100%;
    min-height:620px;
    align-self:stretch;
    transform:none;
    margin-top:clamp(14px,2vh,28px);
  }

  .team-carousel{
    height:100%;
    min-height:620px;
  }
}

@media (max-height:760px) and (min-width:1024px){
  .team-page{
    overflow-x:hidden;
    overflow-y:visible;
  }

  .team-showcase{
    height:auto;
    min-height:calc(100vh - 72px);
    margin:2px 0 0 112px;
    align-items:stretch;
    column-gap:clamp(20px,3vw,44px);
  }

  .team-showcase__content{
    padding-top:0;
  }

  .team-showcase .team-hero{
    padding-top:20px;
    padding-bottom:18px;
  }

  .team-showcase .team-hero h1{
    font-size:clamp(2.25rem,3.95vw,3.85rem);
    line-height:.96;
  }

  .team-showcase .team-hero p{
    max-width:620px;
    margin-top:14px;
    font-size:15px;
  }

  .team-showcase .team-section{
    margin-top:14px;
    padding-bottom:44px;
  }

  .team-showcase .team-grid{
    gap:16px;
  }

  .team-photo{
    aspect-ratio:16/10;
  }

  .team-card-copy{
    padding:18px 18px 16px;
  }

  .team-showcase__gallery{
    height:100%;
    min-height:560px;
    align-self:stretch;
    transform:none;
    margin-top:clamp(10px,1.6vh,18px);
  }

  .team-carousel{
    height:100%;
    min-height:560px;
  }
}

/* ===== Contact notebook height tuning ===== */
@media (min-width:981px) and (max-width:1600px) and (max-height:920px){
  .contact-page{
    height:auto;
    min-height:100vh;
    overflow-x:hidden;
    overflow-y:visible;
  }

  .contact-shell{
    min-height:calc(100vh - 98px);
    margin:8px auto 28px;
    gap:clamp(30px,4vw,56px);
    align-items:flex-start;
  }

  .contact-info{
    gap:0;
    padding-top:clamp(18px,2.2vh,28px);
  }

  .contact-info h1{
    margin-top:12px;
    font-size:clamp(2.75rem,4.35vw,4.45rem);
    line-height:.95;
  }

  .contact-lead{
    margin-top:14px;
    font-size:15px;
    line-height:1.52;
  }

  .contact-list{
    gap:14px;
    margin-top:24px;
  }

  .contact-item{
    gap:14px;
  }

  .contact-response-card{
    margin-top:24px;
    padding:12px 14px;
    gap:14px;
  }

  .contact-form-card{
    padding:24px 26px 22px;
    max-width:660px;
  }

  .contact-form-heading{
    gap:16px;
    margin-bottom:20px;
  }

  .contact-form-heading__icon{
    width:50px;
    height:50px;
  }

  .contact-form-heading__icon svg{
    width:28px;
    height:28px;
  }

  .contact-form-heading h2{
    font-size:20px;
    line-height:1.12;
  }

  .contact-form-heading p{
    margin-top:5px;
    font-size:14px;
    line-height:1.42;
  }

  .contact-form{
    gap:12px 14px;
  }

  .contact-form label{
    gap:6px;
  }

  .contact-form label span{
    font-size:13px;
  }

  .contact-form input{
    min-height:54px;
    padding:18px 16px 10px;
    font-size:15px;
  }

  .contact-form textarea{
    min-height:92px;
    padding:12px 16px;
    font-size:15px;
  }

  .contact-submit{
    min-height:46px;
    font-size:15px;
  }

  .contact-safe{
    margin-top:18px;
    font-size:12px;
  }
}

@media (min-width:1024px) and (max-height:780px){
  .contact-page{
    height:auto;
    min-height:100vh;
    overflow-x:hidden;
    overflow-y:visible;
  }

  .contact-shell{
    min-height:calc(100vh - 88px);
    margin:4px auto 22px;
    gap:clamp(24px,3.2vw,44px);
    align-items:flex-start;
  }

  .contact-info{
    padding-top:14px;
  }

  .contact-info h1{
    font-size:clamp(2.45rem,3.95vw,4rem);
    line-height:.95;
  }

  .contact-lead{
    margin-top:12px;
  }

  .contact-list{
    margin-top:20px;
    gap:12px;
  }

  .contact-response-card{
    margin-top:20px;
    padding:11px 12px;
  }

  .contact-form-card{
    padding:22px 24px 20px;
  }

  .contact-form-heading{
    margin-bottom:16px;
  }

  .contact-form{
    gap:10px 12px;
  }

  .contact-form label{
    gap:5px;
  }

  .contact-form input{
    min-height:50px;
    padding:16px 16px 9px;
  }

  .contact-form textarea{
    min-height:80px;
    padding:11px 16px;
  }

  .contact-submit{
    min-height:44px;
  }

  .contact-safe{
    margin-top:16px;
  }
}

/* ===== Global preloader ===== */
body.is-loading{
  overflow:hidden;
}

.site-preloader{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(circle at 18% 22%, rgba(123,67,255,.24), transparent 0 28%),
    radial-gradient(circle at 82% 26%, rgba(24,200,255,.18), transparent 0 24%),
    radial-gradient(circle at 50% 78%, rgba(123,67,255,.12), transparent 0 26%),
    linear-gradient(180deg, #050611 0%, #070b17 54%, #04050d 100%);
  overflow:hidden;
  opacity:1;
  visibility:visible;
  transition:opacity .62s ease, visibility .62s ease;
}

.site-preloader::before,
.site-preloader::after{
  content:"";
  position:absolute;
  inset:-18%;
  pointer-events:none;
}

.site-preloader::before{
  background:
    radial-gradient(circle at 16% 28%, rgba(255,255,255,.12) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.1) 0 1px, transparent 2px),
    radial-gradient(circle at 80% 74%, rgba(255,255,255,.12) 0 1px, transparent 2px),
    radial-gradient(circle at 44% 64%, rgba(24,200,255,.14) 0 1px, transparent 2px),
    radial-gradient(circle at 24% 78%, rgba(123,67,255,.18) 0 1px, transparent 2px);
  background-size:280px 280px, 300px 300px, 320px 320px, 240px 240px, 260px 260px;
  opacity:.8;
  filter:blur(.2px);
  animation:preloaderFloat 16s ease-in-out infinite alternate;
}

.site-preloader::after{
  background:
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(24,200,255,.08) 1px, transparent 1px),
    radial-gradient(circle, rgba(24,200,255,.08), transparent 56%);
  background-size:160px 160px, 160px 160px, 100% 100%;
  background-position:center;
  opacity:.12;
  mix-blend-mode:screen;
  mask-image:radial-gradient(circle at center, #000 0 44%, transparent 82%);
  animation:preloaderScan 10s linear infinite;
}

.site-preloader__card{
  position:relative;
  z-index:1;
  width:min(460px, calc(100vw - 40px));
  padding:clamp(28px, 4vw, 40px);
  border:1px solid rgba(123,67,255,.24);
  border-radius:28px;
  background:linear-gradient(180deg, rgba(10,13,24,.84), rgba(6,9,18,.62));
  box-shadow:
    0 0 0 1px rgba(24,200,255,.08),
    0 24px 80px rgba(0,0,0,.5),
    0 0 80px rgba(123,67,255,.12);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  text-align:center;
  overflow:hidden;
}

.site-preloader__card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:
    radial-gradient(circle at 18% 10%, rgba(123,67,255,.28), transparent 24%),
    radial-gradient(circle at 82% 20%, rgba(24,200,255,.2), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.08), transparent 34%, rgba(255,255,255,.05));
  opacity:.7;
  pointer-events:none;
}

.site-preloader__logo{
  position:relative;
  z-index:1;
  display:block;
  width:min(180px, 46vw);
  margin:0 auto 14px;
  filter:drop-shadow(0 0 22px rgba(24,200,255,.24));
}

.site-preloader__copy{
  position:relative;
  z-index:1;
  margin:0;
  color:#f4f6ff;
  font-size:clamp(1rem, 1.5vw, 1.1rem);
  font-weight:700;
  letter-spacing:-.02em;
}

.site-preloader__progress{
  position:relative;
  z-index:1;
  margin-top:22px;
  display:grid;
  gap:10px;
  justify-items:stretch;
}

.site-preloader__bar{
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(148,162,255,.18);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);
}

.site-preloader__bar-fill{
  display:block;
  width:100%;
  height:100%;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .18s linear;
  border-radius:inherit;
  background:linear-gradient(90deg, var(--primary), var(--cyan));
  box-shadow:0 0 18px rgba(24,200,255,.55), 0 0 30px rgba(123,67,255,.32);
}

.site-preloader__percent{
  color:#b7c0e2;
  font-size:12px;
  font-weight:800;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.site-preloader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

@keyframes preloaderFloat{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(2.5%, -1.8%, 0) scale(1.03)}
}

@keyframes preloaderScan{
  0%{transform:translate3d(0,0,0)}
  100%{transform:translate3d(0,2.5%,0)}
}

@media (max-width:640px){
  .site-preloader{
    padding:18px;
  }

  .site-preloader__card{
    width:min(100%, 360px);
    padding:24px 22px 22px;
    border-radius:24px;
  }

  .site-preloader__logo{
    width:min(150px, 52vw);
    margin-bottom:12px;
  }

  .site-preloader__copy{
    font-size:15px;
    line-height:1.35;
  }

  .site-preloader__progress{
    margin-top:18px;
  }

  .site-preloader__bar{
    height:9px;
  }

  .site-preloader__percent{
    letter-spacing:.18em;
  }
}


/* =========================================================
   NOTEBOOK RESPONSIVE NORMALIZATION
   Applies only to 1366/1440/1536 notebook-like screens
   ========================================================= */
@media (min-width:981px) and (max-width:1600px) and (max-height:920px){
  :root{
    --notebook-page-top:150px;
    --notebook-projects-top:36px;
    --notebook-team-top:34px;
    --notebook-contact-top:45px;
  }

  .hero-content{
    margin-top:var(--notebook-page-top);
  }

  .projects-page .projects-shell{
    margin-top:var(--notebook-projects-top);
  }

  .team-page .team-showcase{
    margin-top:var(--notebook-team-top);
  }

  .contact-page .contact-shell{
    margin-top:8px;
  }

  .contact-page .contact-info{
    padding-top:45px;
  }

  .contact-page .contact-form-card{
    padding:24px 26px 22px;
  }

  .contact-page .contact-form{
    gap:12px 14px;
  }

  .contact-page .contact-form textarea{
    min-height:92px;
  }
}

@media (min-width:1024px) and (max-height:780px){
  :root{
    --notebook-page-top:165px;
    --notebook-projects-top:30px;
    --notebook-team-top:28px;
    --notebook-contact-top:55px;
  }

  .hero-content{
    margin-top:var(--notebook-page-top);
  }

  .projects-page .projects-shell{
    margin-top:var(--notebook-projects-top);
  }

  .team-page .team-showcase{
    margin-top:var(--notebook-team-top);
  }

  .contact-page .contact-shell{
    margin-top:4px;
  }

  .contact-page .contact-info{
    padding-top:55px;
  }

  .contact-page .contact-form-card{
    padding:22px 24px 20px;
  }

  .contact-page .contact-form{
    gap:10px 12px;
  }

  .contact-page .contact-form textarea{
    min-height:80px;
  }
}

@media (max-width:620px){
  .hero-content{
    width:calc(100% - 84px);
    max-width:calc(100vw - 84px);
    box-sizing:border-box;
    margin-left:70px;
    margin-right:14px;
  }

  .hero-actions{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    flex-direction:column;
    align-items:stretch;
  }

  .hero-actions .btn{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    padding-left:16px;
    padding-right:16px;
  }

  .hero-title{
    font-size:clamp(2.1rem,9.5vw,2.6rem);
    line-height:1.05;
    letter-spacing:-.042em;
  }

  .hero-title #typewriter{
    display:block;
    min-height:calc(3 * 1.05em);
    line-height:1.05;
    white-space:normal;
    text-wrap:balance;
  }

  .lead{
    margin-top:14px;
  }

  .hero-title .cursor{
    display:none;
  }
}

.contact-honeypot{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;}