/* ═══════════════════════════════════════════
   GRINELY — Contact (fixed viewport, no scroll)
   ═══════════════════════════════════════════ */

body.page-contact{
  background:var(--dark);color:var(--white);
  overflow:hidden;
  height:100vh;height:100svh;
}
body.page-contact .nav-logo{color:var(--white)}
body.page-contact .nav-links a{color:var(--white);border-color:rgba(255,255,255,.1)}
body.page-contact .nav-links a:hover{border-color:rgba(255,255,255,.5)}
body.page-contact .nav-burger span{background:var(--white)}

/* Full page layout */
.contact-page{
  display:flex;flex-direction:column;
  height:100vh;height:100svh;
  width:100%;
}

/* Main content area */
.contact-main{
  flex:1;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  padding:calc(var(--nav-h) + 1rem) var(--gutter) 0;
  position:relative;
}
.contact-bg{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-weight:800;font-size:clamp(8rem,28vw,36rem);
  letter-spacing:-.04em;line-height:.8;
  color:rgba(255,255,255,.015);pointer-events:none;user-select:none;
  white-space:nowrap;
}
.contact-main h1{
  font-weight:800;
  font-size:clamp(2rem,6vw,4.5rem);
  letter-spacing:-.03em;line-height:1.05;
  margin-bottom:clamp(.8rem,2vh,1.5rem);
  animation:cUp .7s .2s both;
}
.contact-main p{
  font-size:clamp(.75rem,1vw,.9rem);
  color:rgba(255,255,255,.35);
  max-width:420px;line-height:1.6;
  margin-bottom:clamp(1.5rem,3vh,2.5rem);
  animation:cUp .7s .35s both;
}

/* Big email */
.contact-email{
  display:inline-block;
  font-weight:800;
  font-size:clamp(1rem,2.5vw,2.2rem);
  letter-spacing:-.01em;
  color:var(--white);
  position:relative;
  padding-bottom:.1em;
  animation:cUp .7s .5s both;
  transition:opacity .2s;
}
.contact-email::after{
  content:'';position:absolute;
  bottom:0;left:0;width:100%;height:1.5px;
  background:var(--white);
  transform:scaleX(0);transform-origin:right;
  transition:transform .4s cubic-bezier(.25,.46,.45,.94);
}
.contact-email:hover::after{transform:scaleX(1);transform-origin:left}
.contact-email:hover{opacity:.7}

@keyframes cUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* Bottom info strip */
.contact-strip{
  flex-shrink:0;
  border-top:1px solid rgba(255,255,255,.06);
  display:grid;grid-template-columns:repeat(3,1fr);
}
.contact-cell{
  padding:clamp(1.2rem,2.5vh,2rem) var(--gutter);
  border-right:1px solid rgba(255,255,255,.06);
  text-align:center;
}
.contact-cell:last-child{border-right:none}
.contact-cell-label{
  font-family:var(--mono);font-size:.45rem;
  letter-spacing:.15em;text-transform:uppercase;
  color:rgba(255,255,255,.2);
  margin-bottom:.5rem;
}
.contact-cell a,.contact-cell p{
  font-size:clamp(.7rem,.9vw,.85rem);
  color:rgba(255,255,255,.6);
  line-height:1.5;
  transition:color .2s;
}
.contact-cell a:hover{color:var(--white)}

.contact-social{
  display:flex;gap:1.2rem;justify-content:center;
}
.contact-social a{
  font-family:var(--mono);font-size:.55rem;
  letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.3);
  padding-bottom:1px;
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:color .2s,border-color .2s;
}
.contact-social a:hover{color:var(--white);border-color:rgba(255,255,255,.3)}

/* RESPONSIVE */
@media(max-width:768px){
  .contact-strip{grid-template-columns:1fr}
  .contact-cell{
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,.06);
    padding:clamp(.8rem,1.5vh,1.2rem) var(--gutter);
  }
  .contact-cell:last-child{border-bottom:none}
}
@media(max-width:480px){
  .contact-main h1{font-size:clamp(1.6rem,8vw,2.5rem)}
  .contact-email{font-size:clamp(.85rem,4.5vw,1.3rem)}
}