@font-face {
  font-family: "Instrument Serif";
  src: url("/assets/instrument-serif.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("/assets/instrument-sans.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 650;
  font-display: swap;
}

:root { color-scheme:dark; background:#080d15; color:#f4f3f0; font-family:"Instrument Sans",sans-serif; }
* {box-sizing:border-box}
body {margin:0}
.frame {width:min(1220px,calc(100% - 8rem));margin-inline:auto}
header {position:relative;z-index:1;background:#080d15}
.bar {min-height:106px;display:flex;align-items:center;justify-content:space-between;gap:2rem;border-bottom:1px solid #ffffff36}
.brand {display:flex;align-items:center;gap:1rem;font-size:.93rem;font-weight:650;letter-spacing:.23em}
.brand img {width:54px;height:auto;filter:brightness(0) invert(1)}
.nav {display:flex;align-items:center;gap:1.7rem;color:#e4e7ed;font-size:.86rem;letter-spacing:.035em}
.nav span+span {border-left:1px solid #ffffff36;padding-left:1.7rem;font-size:.77rem;word-spacing:.7em}
.hero {position:relative;isolation:isolate;min-height:clamp(480px,54vw,690px);display:grid;align-items:center;background:#080d15 url('/assets/architecture.jpg') center right / cover no-repeat}
.hero::before {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080d15 0%,#080d15eb 30%,#080d1552 63%,transparent 100%)}
.hero-content {padding-block:5rem}
h1 {font:400 clamp(4.1rem,10vw,9rem)/.94 "Instrument Serif",serif;letter-spacing:-.035em;margin:0}
.line {width:58px;height:1px;background:#b8c9dd;margin:2rem 0 1.25rem}
.hero p {color:#d0d8e2;font-size:clamp(1rem,1.8vw,1.25rem);line-height:1.6;max-width:31rem;margin:0}
@media(max-width:740px){.frame{width:calc(100% - 2.8rem)}.bar{min-height:84px;gap:1rem}.brand{gap:.6rem;font-size:.77rem}.brand img{width:38px}.nav{gap:.65rem}.nav span+span{padding-left:.65rem;word-spacing:.22em}.hero{min-height:475px;background-position:62% center}.hero::before{background:linear-gradient(90deg,#080d15f2,#080d1582 74%,#080d1530)}.hero-content{padding-block:3.5rem}}
body {min-height:100vh;display:flex;flex-direction:column}
main {flex:1}
a {color:inherit;text-decoration:none}
a:hover {text-decoration:underline;text-underline-offset:.35em}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {outline:2px solid #aac5e0;outline-offset:4px}
.skip {position:absolute;top:1rem;left:1rem;z-index:5;padding:.65rem 1rem;background:#101b28;transform:translateY(-200%)}
.skip:focus {transform:none}
.languages {display:flex;gap:.8rem;border-left:1px solid #ffffff36;padding-left:1.3rem;font-size:.77rem}
.languages [aria-current] {text-decoration:underline;text-underline-offset:.35em}
footer {border-top:1px solid #ffffff25;padding:1.2rem 0;color:#b7c4d1;font-size:.82rem}
.inquiry {display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(2rem,7vw,7rem);padding-block:clamp(3rem,8vw,8rem)}
.inquiry h1 {font-size:clamp(3.4rem,6vw,6rem)}
.inquiry p {color:#d0d8e2;line-height:1.55}
form {display:grid;gap:1rem;position:relative}
.field-grid {display:grid;grid-template-columns:1fr 1fr;gap:1rem}
label {display:grid;gap:.45rem;font-size:.9rem}
input,textarea {min-width:0;width:100%;font:inherit;background:#101923;color:#f4f3f0;border:1px solid #637284;border-radius:0;padding:.75rem}
textarea {resize:vertical}
button {width:fit-content;border:1px solid #a4b7cb;background:#e4ebf4;color:#091320;padding:.75rem 1rem;font:inherit;cursor:pointer}
button:hover {background:#fff}
.note {font-size:.85rem;margin:0}
.status {border-left:2px solid #aac5e0;padding-left:.8rem}
.trap {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:740px){.inquiry{grid-template-columns:1fr}.languages{padding-left:.6rem;gap:.45rem}}
@media(max-width:430px){.brand{letter-spacing:.1em}.nav{font-size:.77rem}.field-grid{grid-template-columns:1fr}}
/* Use the original symbol and spaced wordmark together in the hero. */
.hero-brand {
  display:flex;
  align-items:center;
  gap:clamp(.85rem,3vw,2.2rem);
  font:650 clamp(1.65rem,5vw,4.8rem)/1 "Instrument Sans",sans-serif;
  letter-spacing:.19em;
  text-transform:uppercase;
}
.hero-brand img {width:clamp(58px,10vw,132px);height:auto;filter:brightness(0) invert(1)}
.hero-brand span {white-space:nowrap}

.number {background:#f7f6f3;color:#141414;padding-block:clamp(3.4rem,8vw,7.6rem)}
.number .frame {
  display:grid;
  grid-template-columns:auto minmax(0,25rem);
  align-items:center;
  justify-content:center;
  gap:clamp(1rem,3.6vw,3.8rem);
}
.number h2 {
  display:flex;
  align-items:flex-start;
  font:400 clamp(6.5rem,15vw,14rem)/.8 "Instrument Sans",sans-serif;
  letter-spacing:-.075em;
  margin:0;
}
.number sup {font-size:.32em;line-height:1;margin-left:.14em}
.number p {
  font:500 clamp(.96rem,1.6vw,1.24rem)/1.23 "Instrument Sans",sans-serif;
  text-transform:uppercase;
  margin:0;
}
.number p span {color:#b92b23}
@media(max-width:620px){
  .number .frame{grid-template-columns:1fr;gap:1.65rem}
  .number p{max-width:28rem}
}
.hero p {max-width:43rem}
.hero-contact {display:inline-flex;align-items:center;gap:.65rem;margin-top:1.35rem;padding-bottom:.35rem;border-bottom:1px solid #a4b7cb;font-size:.95rem}
.hero-contact:hover {text-decoration:none;color:#c0d6ef;border-color:currentColor}
.contact-notice {margin-top:1.25rem;max-width:26rem}

.legal-content { width:min(46rem, calc(100% - 2.5rem)); margin-inline:auto; padding-block:clamp(2rem,7vw,5rem); line-height:1.65; }
.legal-content h1 { font-size:clamp(2.4rem,6vw,4.8rem); line-height:1.05; margin:0 0 1.6rem; }
.legal-content h2 { font-size:1.25rem; line-height:1.25; margin:1.6rem 0 .3rem; }
.legal-content p { margin:.25rem 0 .75rem; }
.legal-content a,.legal-links a,.form-note a { text-decoration:underline; text-underline-offset:.16em; }
.legal-links { display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin:.6rem 0; }

footer .legal-links { align-items:center; margin:.6rem 0 0; }
footer .legal-links .cookie-notice-link { margin:0; padding:0; }