:root{
  --bg:#06080d;
  --bg-soft:#0b0f18;
  --text:#f4f6fb;
  --muted:rgba(244,246,251,.78);
  --line:rgba(255,255,255,.16);
  --line-strong:rgba(255,255,255,.28);
  --panel:rgba(9,13,22,.84);
  --success:rgba(61,125,90,.18);
  --error:rgba(143,57,57,.18);
  --success-line:rgba(104,194,140,.45);
  --error-line:rgba(220,110,110,.45);
  --sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --serif: Iowan Old Style, Palatino Linotype, Book Antiqua, Palatino, Georgia, serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration-thickness:.07em;text-underline-offset:.16em}
a:hover{text-decoration-thickness:.1em}
img{display:block;max-width:100%;height:auto}
.skip-link{
  position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:.7rem .9rem;z-index:1000
}
.skip-link:focus{left:.75rem;top:.75rem}

.hero{
  position:relative;
  min-height:100svh;
  overflow:hidden;
  background:#04070d;
}
.hero__media{
  position:absolute;inset:-8svh 0 0 0;
  will-change:transform;
}
.hero__media img{
  width:100%;height:115%;object-fit:cover;
}
.image-window .parallax-media{
  position:absolute;
  inset:-18% 0;
  will-change:transform;
}
.image-window .parallax-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero__veil{
  position:absolute;inset:0;
  background:linear-gradient(to bottom, rgba(4,7,13,.18) 0%, rgba(4,7,13,.22) 18%, rgba(4,7,13,.58) 72%, rgba(4,7,13,.94) 100%);
}
.hero__chrome,
.subpage-header__bar{
  position:relative;z-index:3;
  display:flex;justify-content:space-between;gap:2rem;align-items:flex-start;
  padding:1.05rem 1.2rem 0;
}
.brand{
  font-family:var(--serif);
  font-size:clamp(.82rem,.9vw,1rem);
  line-height:1.2;
  letter-spacing:.02em;
  margin:0;
  font-weight:400;
  text-decoration:none;
}
.brand--small{display:inline-block}
.hero-nav{
  display:flex;gap:1rem;flex-wrap:wrap;justify-content:flex-end;
  font-size:.82rem;line-height:1.3
}
.hero-nav a{text-decoration:none;color:rgba(255,255,255,.82)}
.hero-nav a:hover{color:#fff}
.hero__axis{
  position:absolute;left:4.2rem;top:5.2rem;bottom:0;width:1px;background:linear-gradient(to bottom, rgba(255,255,255,.16), rgba(255,255,255,0));z-index:2
}

.statement{
  position:relative;
  margin:0;
  padding:clamp(3rem,10vw,8rem) 1.25rem clamp(2rem,6vw,4.4rem) clamp(4.8rem,14vw,10rem);
  background:var(--bg);
}
.statement p{
  margin:0;
  max-width:18ch;
  font-family:var(--serif);
  font-size:clamp(1.45rem,2.45vw,2.65rem);
  line-height:1.12;
  letter-spacing:-.02em;
}
.statement--two p{max-width:20ch}
.statement--three p{max-width:18ch}

.image-window{
  position:relative;
  min-height:42svh;
  overflow:hidden;
  margin:0 0 0 clamp(2rem,7vw,7rem);
  border-left:1px solid var(--line);
  background:var(--bg-soft);
}
.image-window--offset{margin-right:clamp(1rem,7vw,6rem)}
.image-window__line{
  position:absolute;left:0;top:0;bottom:0;width:1px;background:rgba(255,255,255,.2);z-index:2
}

.contact-panel{
  padding:clamp(3.2rem,8vw,5.5rem) 1.2rem clamp(4rem,10vw,6rem) clamp(4.8rem,14vw,10rem);
  background:var(--bg);
}
.contact-panel__rule{
  width:min(5rem,20vw);height:1px;background:var(--line-strong);margin-bottom:1.2rem
}
.contact-panel__email{
  display:inline-block;
  font-size:clamp(1.05rem,1.6vw,1.4rem);
  line-height:1.2;
  color:#fff;
  text-decoration:none;
  margin-bottom:1.1rem;
}
.contact-panel__email:hover{text-decoration:underline}
.contact-panel__nav{display:flex;flex-wrap:wrap;gap:.8rem 1.2rem;font-size:.92rem;color:var(--muted)}
.contact-panel__nav a{text-decoration:none}
.contact-panel__nav a:hover{color:#fff}

.subpage-header{position:relative;z-index:10;background:transparent}
.content-page{
  padding:1rem 1.2rem 4.5rem;
}
.content-page__intro{
  padding:3.5rem 0 2rem clamp(4.8rem,14vw,10rem);
  border-bottom:1px solid var(--line);
  margin-bottom:2rem;
}
.content-page__intro h1{
  margin:0 0 .7rem;font-family:var(--serif);font-weight:400;line-height:1.06;
  font-size:clamp(2rem,4vw,3.7rem);letter-spacing:-.02em
}
.content-page__intro p{margin:0;max-width:48rem;color:var(--muted);font-size:1rem;line-height:1.55}
.legal-page,
.contact-form,
.notice,
.legal-list{margin-left:clamp(4.8rem,14vw,10rem)}

.contact-form{max-width:42rem}
.form-field{margin:0 0 1.25rem}
.form-field label{display:block;margin-bottom:.45rem;font-size:.86rem;color:var(--muted)}
.form-field input,
.form-field textarea{
  width:100%;padding:.95rem 1rem;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text);
  font:inherit;border-radius:0
}
.form-field input:focus,
.form-field textarea:focus,
button:focus{outline:2px solid rgba(255,255,255,.55);outline-offset:2px}
.form-field--honeypot{
  position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden
}
.form-actions{display:flex;flex-wrap:wrap;gap:1rem 1.4rem;align-items:flex-start;justify-content:space-between;margin-top:1.5rem}
.form-note{margin:0;max-width:28rem;color:var(--muted);font-size:.92rem;line-height:1.5}
button{
  appearance:none;border:1px solid var(--line-strong);background:transparent;color:#fff;padding:.92rem 1.2rem;cursor:pointer;font:inherit
}
button:hover{background:rgba(255,255,255,.05)}
.notice{
  max-width:42rem;padding:1rem 1rem 1rem 1.1rem;border-left:1px solid var(--line-strong);margin-bottom:1.5rem
}
.notice p,.notice ul{margin:.2rem 0}
.notice ul{padding-left:1.15rem}
.notice--success{background:var(--success);border-color:var(--success-line)}
.notice--error{background:var(--error);border-color:var(--error-line)}

.legal-list{display:grid;gap:1rem;max-width:46rem}
.legal-list > div{display:grid;grid-template-columns:minmax(11rem,15rem) 1fr;gap:1rem;padding:0 0 1rem;border-bottom:1px solid var(--line)}
.legal-list dt{font-size:.86rem;color:var(--muted)}
.legal-list dd{margin:0;line-height:1.55}
.legal-copy section{max-width:48rem;margin:0 0 2rem clamp(4.8rem,14vw,10rem)}
.legal-copy h2{font-family:var(--serif);font-weight:400;font-size:1.5rem;line-height:1.2;margin:0 0 .65rem}
.legal-copy p{margin:.55rem 0;color:var(--text);line-height:1.62}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .hero__media,.image-window .parallax-media{transform:none !important}
}

@media (max-width: 900px){
  .hero__chrome,.subpage-header__bar{padding:1rem .9rem 0;gap:1rem}
  .hero-nav{gap:.75rem;max-width:48vw}
  .hero__axis{left:1.2rem;top:4.7rem}
  .statement{padding:2.8rem .9rem 1.8rem 1.8rem}
  .statement p{font-size:clamp(1.25rem,6.7vw,1.8rem);line-height:1.16;max-width:100%}
  .image-window{margin-left:1rem;min-height:34svh}
  .image-window--offset{margin-right:1rem}
  .contact-panel{padding:2.4rem .9rem 3rem 1.8rem}
  .contact-panel__email{font-size:1rem}
  .content-page{padding:1rem .9rem 3rem}
  .content-page__intro{padding:2.8rem 0 1.6rem 1.8rem}
  .legal-page,.contact-form,.notice,.legal-list,.legal-copy section{margin-left:1.8rem}
  .legal-list > div{grid-template-columns:1fr;gap:.3rem}
}

@media (max-width: 560px){
  .hero-nav{max-width:none;font-size:.8rem}
  .statement p{font-size:clamp(1.18rem,6.2vw,1.6rem)}
  .content-page__intro h1{font-size:clamp(1.75rem,8.4vw,2.7rem)}
  .content-page__intro p,.legal-copy p,.form-note,.legal-list dd{font-size:.96rem}
}
