/* ============================================================
   LARP — SHARED DESIGN SYSTEM
   Pure black/white, Swiss/brutalist-luxury. No external JS deps.
   ============================================================ */
:root{
  --white:#ffffff;
  --black:#000000;
  --line:rgba(0,0,0,.14);
  --line-strong:rgba(0,0,0,.32);
  --font-display:'Archivo Black','Arial Black',Impact,sans-serif;
  --font-body:'Inter',Arial,sans-serif;
  --font-mono:'JetBrains Mono',monospace;
  --ease: cubic-bezier(.16,1,.3,1);
  --nav-h: 84px;
  --gutter: clamp(24px,6.5vw,96px);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
html,body{width:100%;background:var(--white);color:var(--black);}
body{
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  min-height:100svh;
  overflow-x:hidden;
  overflow-x:clip;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
/* Remove the blue browser tap-highlight box on touch devices.
   Keyboard focus indication is preserved via :focus-visible below. */
a,button,input,select,textarea,label,summary{-webkit-tap-highlight-color:transparent;}
button{font-family:inherit;background:none;border:none;cursor:pointer;color:inherit;}
input{font-family:inherit;color:inherit;}
ul{list-style:none;}
::selection{background:var(--black);color:var(--white);}
:focus-visible{outline:2px solid var(--black);outline-offset:3px;}

.wrap{width:100%;padding-inline:var(--gutter);}
.hairline{width:100%;height:1px;background:var(--black);opacity:.14;}

/* ============ NAV ============ */
.nav{
  position:fixed;top:0;left:0;width:100%;height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  padding-inline:clamp(20px,5vw,44px);
  z-index:500;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-logo{font-family:var(--font-display);font-size:17px;letter-spacing:-.01em;}
.nav-links{display:flex;align-items:center;gap:clamp(18px,2.4vw,34px);}
.nav-link{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  position:relative;padding-bottom:3px;
}
.nav-link::after{
  content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--black);
  transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease);
}
.nav-link:hover::after,.nav-link.is-active::after{transform:scaleX(1);transform-origin:left;}
.nav-link.is-active{opacity:1;}
.nav-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--black);border-radius:999px;padding:9px 16px;
  transition:background .3s var(--ease),color .3s var(--ease);
}
.nav-cta:hover{background:var(--black);color:var(--white);}
.nav-burger{display:none;flex-direction:column;gap:5px;width:26px;z-index:1200;}
.nav-burger span{display:block;width:100%;height:1.5px;background:var(--black);transition:transform .3s var(--ease),opacity .3s var(--ease);}
.nav-mobile{
  position:fixed;inset:0;background:var(--white);z-index:1100;
  display:flex;flex-direction:column;justify-content:center;gap:22px;padding:0 clamp(24px,7vw,48px);
  transform:translateY(-100%);transition:transform .45s var(--ease);
}
.nav-mobile.is-open{transform:translateY(0);}
.nav-mobile a{font-family:var(--font-display);font-size:clamp(30px,9vw,44px);text-transform:uppercase;}
.nav-mobile .nav-mobile-sub{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;opacity:.5;margin-top:28px;}

@media (max-width:820px){
  .nav-links{display:none;}
  .nav-burger{display:flex;}
}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  padding:15px 28px;border-radius:999px;border:1px solid var(--black);
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);
}
.btn-solid{background:var(--black);color:var(--white);}
.btn-solid:hover{transform:translateY(-2px);}
.btn-outline:hover{background:var(--black);color:var(--white);}
.btn svg{width:13px;height:13px;transition:transform .3s var(--ease);}
.btn:hover svg{transform:translateX(3px);}
.btn-small{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  padding:11px 20px;border-radius:999px;border:1px solid var(--black);
  display:inline-flex;align-items:center;gap:8px;
  transition:background .3s var(--ease),color .3s var(--ease);
}
.btn-small:hover{background:var(--black);color:var(--white);}
.btn-block{width:100%;justify-content:center;}
.btn-ghost-text{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;
  border-bottom:1px solid var(--black);padding-bottom:2px;
}

/* ============ PAGE HERO / HEADER (inner pages) ============ */
.page-head{
  padding:calc(var(--nav-h) + clamp(48px,9vw,96px)) 0 clamp(36px,6vw,64px);
}
.page-eyebrow{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;opacity:.55;
  margin-bottom:14px;
}
.page-title{
  font-family:var(--font-display);
  font-size:clamp(40px,9vw,108px);
  line-height:.92;text-transform:uppercase;letter-spacing:-.01em;
}
.page-sub{
  font-family:var(--font-body);font-size:clamp(14px,1.6vw,17px);
  max-width:560px;margin-top:18px;opacity:.7;
}

/* ============ FOOTER ============ */
.site-footer{
  border-top:1px solid var(--line);
  padding:clamp(36px,6vw,56px) 0 clamp(24px,4vw,32px);
  margin-top:clamp(60px,10vw,120px);
  text-align:center;
}
.footer-row{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;align-items:flex-end;}
.footer-word{font-family:var(--font-display);font-size:clamp(38px,8vw,72px);text-transform:uppercase;line-height:.9;}
.footer-meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.5;max-width:64ch;margin-inline:auto;}
.footer-meta a{text-decoration:underline;text-underline-offset:3px;opacity:1;}
.footer-links{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;}
.footer-links a{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.6;}
.footer-links a:hover{opacity:1;}

/* ============ FORMS ============ */
.form-field{margin-bottom:22px;}
.form-label{
  display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  opacity:.55;margin-bottom:9px;
}
.form-input{
  width:100%;border:none;border-bottom:1.5px solid var(--black);
  padding:12px 2px;font-family:var(--font-body);font-size:19px;background:transparent;
  transition:padding .25s var(--ease);
}
.form-input:focus{outline:none;padding-bottom:11px;}
.form-input::placeholder{color:rgba(0,0,0,.28);}
.form-note{font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;opacity:.5;margin-top:10px;}
.form-error{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.05em;color:var(--black);margin-top:10px;padding:10px 0;border-top:1px solid var(--line);}

/* ============ UTIL ============ */
.reveal{opacity:0;transform:translateY(16px);animation:revealIn .8s var(--ease) forwards;}
@keyframes revealIn{to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){
  .reveal{animation:none;opacity:1;transform:none;}
  html{scroll-behavior:auto;}
}
.dot{width:9px;height:9px;border-radius:50%;background:var(--black);display:inline-block;}
.center-col{display:flex;flex-direction:column;align-items:center;text-align:center;}