:root {
  --ink:#070809;
  --paper:#f1f0eb;
  --white:#fff;
  --cyan:#29aae1;
  --bronze:#bd9065;
  --rollover:#b08961;
  --muted:#687078;
  --line:rgba(7,8,9,.15);
  --side:clamp(24px,6.2vw,104px);
  --header-height:96px;
}

* { box-sizing:border-box; }
html { width:100%; max-width:100%; overflow-x:hidden; scroll-behavior:smooth; background:var(--paper); }
body { width:100%; max-width:100%; margin:0; padding-top:var(--header-height); overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
body.menu-open { overflow:hidden; }
img { display:block; max-width:100%; height:auto; }
button, a { font:inherit; }
a { color:inherit; }
a:focus-visible, button:focus-visible { outline:3px solid var(--cyan); outline-offset:4px; }

.site-header { position:fixed; z-index:20; isolation:isolate; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; min-height:var(--header-height); padding:14px var(--side); border-bottom:1px solid var(--line); background:transparent; }
.site-header::before { content:""; position:absolute; z-index:-1; inset:0; pointer-events:none; background:rgba(255,255,255,.82); -webkit-backdrop-filter:blur(12px) saturate(135%); backdrop-filter:blur(12px) saturate(135%); }
.site-logo { display:block; width:clamp(210px,22vw,280px); }
.site-logo img { width:100%; height:auto; }
.menu-toggle { position:fixed; z-index:32; top:max(32px,env(safe-area-inset-top)); right:max(32px,env(safe-area-inset-right)); display:block; width:auto; height:auto; padding:7px 0; border:0; background:transparent; color:var(--ink); cursor:pointer; }
.menu-toggle-label { display:block; font-family:Arial,Helvetica,sans-serif; font-size:1.12rem; font-weight:400; line-height:1; letter-spacing:-.015em; transition:color 220ms ease,transform 220ms ease; }
.menu-toggle-icon { display:none; }
.menu-toggle:hover .menu-toggle-label { color:var(--cyan); transform:translateY(-1px); }
.menu-toggle.is-open { color:#111; }
.menu-panel { position:fixed; z-index:31; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:clamp(6px,1.3vh,18px); width:100%; height:100vh; height:100dvh; padding:clamp(126px,17vh,190px) var(--side) clamp(70px,10vh,110px); overflow:auto; background:var(--rollover); opacity:0; transform:translateY(-4%) scale(1.015); visibility:hidden; transition:opacity 480ms ease,transform 680ms cubic-bezier(.16,1,.3,1),visibility 680ms; }
.menu-panel.is-open { opacity:1; transform:translateY(0) scale(1); visibility:visible; }
.menu-panel > a:not(.menu-brand) { display:flex; align-items:center; min-height:0; padding:0; color:#111; font-size:clamp(3.15rem,5.6vw,6.9rem); font-weight:800; line-height:.88; letter-spacing:-.065em; text-decoration:none; transition:color 220ms ease,transform 380ms cubic-bezier(.16,1,.3,1); }
.menu-panel > a:not(.menu-brand):hover { color:var(--cyan); transform:translateX(12px); }
.menu-brand { position:absolute; top:max(25px,env(safe-area-inset-top)); left:max(var(--side),env(safe-area-inset-left)); display:block; width:clamp(210px,22vw,290px); min-height:0; }
.menu-brand img { width:100%; height:auto; }
.menu-meta { position:absolute; right:max(var(--side),env(safe-area-inset-right)); bottom:max(28px,env(safe-area-inset-bottom)); margin:0; color:#111; font-size:clamp(.75rem,1vw,.9rem); font-weight:700; line-height:1.45; text-align:right; text-transform:uppercase; letter-spacing:.08em; }

.project-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(420px,.92fr); align-items:stretch; width:100%; min-width:0; max-width:100%; background:var(--paper); }
.project-story { min-width:0; max-width:100%; padding:clamp(80px,9vw,142px) clamp(36px,7vw,118px) clamp(90px,11vw,160px) var(--side); }
.project-intro { width:100%; min-width:0; max-width:800px; }
.eyebrow { margin:0 0 26px; color:var(--cyan); font-size:.82rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
h1, h2 { margin:0; font-weight:800; letter-spacing:-.06em; line-height:.9; text-transform:uppercase; }
h1 { max-width:790px; font-size:clamp(2.8rem,3.6vw,4.3rem); }
.headline-opening { color:var(--ink); }
.headline-accent { color:var(--bronze); }
.intro-copy { max-width:680px; margin:42px 0 0; color:var(--muted); font-size:clamp(1.05rem,1.5vw,1.35rem); line-height:1.6; }

.process-card { max-width:700px; margin-top:74px; padding:42px 46px 48px; border:1px solid var(--line); background:var(--white); }
.process-card .eyebrow { margin-bottom:28px; }
.process-list { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.process-list li { display:grid; grid-template-columns:62px minmax(0,1fr); gap:18px; align-items:baseline; padding:18px 0; border-bottom:1px solid var(--line); }
.process-list li:first-child { padding-top:0; }
.process-list li:last-child { padding-bottom:0; border-bottom:0; }
.process-list span { color:var(--bronze); font-size:1.7rem; font-weight:800; letter-spacing:-.04em; }
.process-list strong { font-size:clamp(1rem,1.45vw,1.28rem); line-height:1.3; }
.process-card-dark { background:var(--ink); color:var(--white); }
.process-card-dark .process-list li { border-color:rgba(255,255,255,.2); }
.process-card-dark .process-list span { color:var(--cyan); }

.contact-column { position:relative; width:100%; min-width:0; max-width:100%; border-left:1px solid var(--line); background:var(--white); }
.contact-card { position:sticky; top:var(--header-height); width:100%; min-width:0; max-width:100%; min-height:calc(100vh - var(--header-height)); padding:clamp(74px,8vw,130px) clamp(38px,5.5vw,88px) 90px; }
.contact-card h2 { max-width:500px; font-size:clamp(3.2rem,5vw,5.6rem); }
.contact-card h2 span { color:var(--bronze); }
.book-call-button { display:inline-flex; align-items:center; justify-content:center; min-width:200px; min-height:50px; margin-top:42px; padding:14px 28px; border:1px solid var(--cyan); border-radius:2px; background:var(--cyan); color:var(--white); font-size:.8rem; font-weight:800; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; transition:background 180ms ease,border-color 180ms ease,transform 180ms ease; }
.book-call-button:hover { border-color:var(--rollover); background:var(--rollover); transform:translateY(-2px); }
.contact-copy { max-width:540px; margin:28px 0 40px; color:var(--muted); font-size:1.05rem; line-height:1.6; }
.form-wrap { width:100%; min-width:0; max-width:100%; min-height:480px; overflow:hidden; padding-top:34px; border-top:1px solid var(--line); }
.hs-form-frame { width:100%; min-width:0; max-width:100%; min-height:440px; overflow:hidden; }
.hs-form-frame iframe { display:block; width:100% !important; min-width:0 !important; max-width:100% !important; border:0; }
.form-fallback { margin:0; color:var(--muted); line-height:1.6; }
.form-fallback a { color:var(--cyan); font-weight:700; }

footer { display:grid; justify-items:start; gap:12px; padding:64px var(--side) 74px; border-top:1px solid var(--line); background:var(--white); color:#5f676d; }
footer img { width:240px; height:auto; margin-bottom:18px; }
footer p { margin:0; font-size:.82rem; line-height:1.45; }

@media (min-width:1101px) {
  .headline-opening { white-space:nowrap; }
}

@media (max-width:1100px) {
  .project-layout { grid-template-columns:1fr; }
  .project-story { padding-right:var(--side); }
  .project-intro, .process-card { max-width:none; }
  .contact-column { border-top:1px solid var(--line); border-left:0; }
  .contact-card { position:static; min-height:0; padding:clamp(74px,9vw,110px) var(--side) clamp(80px,10vw,120px); }
}

@media (max-width:600px) {
  :root { --header-height:86px; }
  .site-header { min-height:var(--header-height); padding:18px max(76px,calc(58px + env(safe-area-inset-right))) 18px max(18px,env(safe-area-inset-left)); }
  .site-logo { width:210px; }
  .menu-toggle { top:max(24px,env(safe-area-inset-top)); right:max(20px,env(safe-area-inset-right)); }
  .menu-toggle-label { display:none; }
  .menu-toggle-icon { position:relative; display:block; width:28px; height:22px; }
  .menu-toggle-icon > span { position:absolute; left:0; display:block; width:28px; height:2px; border-radius:999px; background:currentColor; transform-origin:center; transition:top 240ms cubic-bezier(.16,1,.3,1),transform 300ms cubic-bezier(.16,1,.3,1),opacity 180ms ease; }
  .menu-toggle-icon > span:nth-child(1) { top:2px; }
  .menu-toggle-icon > span:nth-child(2) { top:10px; }
  .menu-toggle-icon > span:nth-child(3) { top:18px; }
  .menu-toggle.is-open .menu-toggle-icon > span:nth-child(1) { top:10px; transform:rotate(45deg); }
  .menu-toggle.is-open .menu-toggle-icon > span:nth-child(2) { opacity:0; }
  .menu-toggle.is-open .menu-toggle-icon > span:nth-child(3) { top:10px; transform:rotate(-45deg); }
  .menu-panel { justify-content:flex-start; gap:14px; padding:max(122px,calc(100px + env(safe-area-inset-top))) max(20px,env(safe-area-inset-right)) max(96px,calc(70px + env(safe-area-inset-bottom))) max(20px,env(safe-area-inset-left)); }
  .menu-panel > a:not(.menu-brand) { font-size:clamp(2.65rem,12.6vw,4.2rem); line-height:.92; }
  .menu-brand { top:max(18px,env(safe-area-inset-top)); left:max(20px,env(safe-area-inset-left)); width:min(210px,56vw); }
  .menu-meta { right:max(20px,env(safe-area-inset-right)); bottom:max(20px,env(safe-area-inset-bottom)); font-size:.68rem; }
  .project-layout { display:block; }
  .project-story { width:100%; padding:70px max(20px,env(safe-area-inset-right)) 88px max(20px,env(safe-area-inset-left)); }
  h1 { max-width:100%; font-size:clamp(2.1rem,9.6vw,2.65rem); line-height:.94; }
  .headline-opening { white-space:normal; }
  .intro-copy { margin-top:32px; }
  .process-card { margin-top:52px; padding:32px 26px 36px; }
  .process-list li { grid-template-columns:48px minmax(0,1fr); gap:12px; }
  .process-list span { font-size:1.35rem; }
  .contact-card { width:100%; padding:70px max(20px,env(safe-area-inset-right)) 76px max(20px,env(safe-area-inset-left)); overflow:hidden; }
  .contact-card h2 { max-width:100%; overflow-wrap:break-word; font-size:clamp(2.7rem,13vw,3.7rem); }
  .contact-copy { max-width:100%; }
  .book-call-button { width:100%; min-width:0; }
  .form-wrap { min-height:420px; }
  .hs-form-frame { min-height:390px; }
  footer { justify-items:center; text-align:center; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .menu-panel, .menu-toggle-label, .menu-toggle-icon > span, .menu-panel > a, .book-call-button { transition:none; }
}
