/* aadex studios — coming soon | blue field, left lockup */
@font-face { font-family:'Lydian'; src:url('/assets/lydian.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'PlexMono'; src:url('/assets/plex-300.ttf') format('truetype'); font-weight:300; font-display:swap; }
@font-face { font-family:'PlexMono'; src:url('/assets/plex-500.ttf') format('truetype'); font-weight:500; font-display:swap; }

:root{
  --paper:#EAE5E1; --ink:#120D07; --clay:#CC4B2D; --ochre:#A1863C; --label:#6E5A28;
  --blue:#0B349B;
  --field:#0B349B; --on:#EAE5E1; --accent:#A1863C; --panel:#A1863C;
  --pad-x:clamp(20px, 5vw, 72px);
  --h1:clamp(34px, 8vw, 64px);
  --gap:clamp(14px, 2.4vh, 20px);
  --safe-l:max(var(--pad-x), env(safe-area-inset-left));
  --safe-r:max(var(--pad-x), env(safe-area-inset-right));
}
*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  background:var(--paper); color:var(--ink);
  font-family:'PlexMono', ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight:300; font-size:14px; line-height:1.75;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
.caps{ font-size:10px; letter-spacing:.3em; text-transform:uppercase; }

/* ---------- hero ---------- */
.hero{ display:grid; grid-template-columns:1.15fr .85fr; min-height:100svh; }
@supports not (min-height:100svh){ .hero{ min-height:100vh; } }

.field{
  background:var(--field); color:var(--on);
  padding:clamp(34px,6vh,64px) var(--safe-r) 0 var(--safe-l);
  display:flex; flex-direction:column;
}
.lock{ align-self:flex-start; margin-left:-1.5%; }
.lock svg{ height:clamp(180px, 32vh, 320px); width:auto; display:block; }

.copy{ margin-top:clamp(22px,4.5vh,56px); padding-bottom:clamp(30px,5vh,52px); }
h1{
  font-family:'Lydian', Georgia, serif; font-weight:400;
  font-size:var(--h1); line-height:1.04; letter-spacing:.005em; text-wrap:balance;
}
.sub{ margin-top:var(--gap); max-width:46ch; opacity:.9; font-size:clamp(13px,3.4vw,14px); }
.loc{ margin-top:var(--gap); opacity:.75; }
.soon{ margin-top:var(--gap); display:inline-block; font-weight:500;
  border-bottom:2px solid var(--accent); padding-bottom:4px; }

.strip{ margin-top:auto; display:flex; height:14px;
  margin-inline:calc(var(--safe-l) * -1) calc(var(--safe-r) * -1); }
.strip span{ flex:1; }

.side{ background:var(--panel); overflow:hidden; }
.side img{ width:100%; height:100%; object-fit:cover; }

/* ---------- contact ---------- */
.details{
  padding:clamp(36px,7vh,80px) var(--safe-r) clamp(36px,7vh,80px) var(--safe-l);
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:clamp(20px,3vw,32px) clamp(24px,4vw,60px);
  border-bottom:1px solid rgba(18,13,7,.2);
}
.details b{ display:block; font-weight:500; font-size:9.5px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--label); margin-bottom:4px; }
.details span{ font-size:clamp(13px,3.6vw,13.5px); }
.details a{ display:inline-block; text-decoration:none;
  border-bottom:1px solid var(--ink); padding:2px 0; min-height:24px; }
.details a + a{ margin-left:16px; }
.details a:hover{ color:var(--clay); border-color:var(--clay); }

/* ---------- footer ---------- */
footer{
  padding:22px var(--safe-r) calc(30px + env(safe-area-inset-bottom)) var(--safe-l);
  display:flex; justify-content:space-between; align-items:center; gap:14px 26px; flex-wrap:wrap;
}
footer .enku svg{ height:24px; width:auto; }
footer p{ font-size:9.5px; color:rgba(18,13,7,.72); max-width:56ch; }

/* ---------- responsive ---------- */
@media (min-width:901px){ :root{ --h1:clamp(44px, 4.4vw, 82px); } }
@media (min-width:1600px){
  :root{ --pad-x:clamp(72px, 5vw, 112px); }
  .lock svg{ height:clamp(260px, 30vh, 360px); }
}
@media (max-width:900px){
  .hero{ grid-template-columns:1fr; min-height:0; }
  .side{ aspect-ratio:4/3; }
  .lock svg{ height:clamp(170px, 26vh, 240px); }
}
@media (max-width:1199px){ .details{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:540px){
  .side{ aspect-ratio:1/1; }
  .lock svg{ height:clamp(150px, 22vh, 200px); }
  footer{ flex-direction:column; align-items:flex-start; gap:12px; }
}
@media (max-width:380px){ .details{ grid-template-columns:1fr; } }
@media (max-height:520px) and (orientation:landscape){
  .hero{ min-height:0; }
  .lock svg{ height:130px; }
  .field{ padding-top:34px; }
}
@media (prefers-reduced-motion:reduce){ *{ transition:none !important; animation:none !important; } }
a:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }
.field a:focus-visible{ outline-color:var(--paper); }