/* ==========================================================================
   Lev Developments LLC — Blueprint design system
   Deep blueprint navy pulled from the reference mockup: ~#04265C
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&display=swap");

:root {
  /* Navy palette */
  --navy-base:    #04265c;   /* rich blueprint navy (mockup) */
  --navy-deep:    #01173a;   /* deep end of gradient / vignette */
  --navy-light:   #0a3576;   /* lighter shimmer area */
  --navy-panel:   #06285f;   /* slightly raised surfaces */

  /* Ink */
  --white:        #ffffff;
  --white-90:     rgba(255,255,255,0.90);
  --white-70:     rgba(255,255,255,0.70);
  --white-55:     rgba(255,255,255,0.55);
  --line:         rgba(255,255,255,0.22);   /* visible thin line work */
  --line-soft:    rgba(255,255,255,0.12);   /* faint dividers/borders */
  --grid-line:    rgba(255,255,255,0.06);   /* blueprint graph paper */

  /* Type */
  --serif:  "Libre Baskerville", Georgia, "Times New Roman", serif;
  --display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:   "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --mono:   "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;

  /* Metrics */
  --maxw: 1180px;
  --gutter: clamp(20px, 5vw, 56px);
  --nav-h: 74px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--white-90);
  background-color: var(--navy-base);
  line-height: 1.65;
  font-size: 17px;
  letter-spacing: 0.01em;
  overflow-x: hidden;
  min-height: 100vh;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

/* ==========================================================================
   Background: navy gradient + blueprint grid + faint grain
   ========================================================================== */
body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}
/* gradient wash + vignette — subtle lift near top, darker sheet edges */
body::before {
  background:
    radial-gradient(120% 85% at 22% 8%, var(--navy-light) 0%, rgba(10,53,118,0) 50%),
    radial-gradient(130% 120% at 50% 40%, rgba(0,0,0,0) 55%, rgba(1,15,40,0.55) 100%),
    linear-gradient(150deg, var(--navy-base) 0%, var(--navy-base) 50%, var(--navy-deep) 100%);
}
/* blueprint graph paper — thin white grid lines, very low opacity */
body::after {
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px),
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size:
    160px 160px, 160px 160px,   /* major grid */
    32px 32px, 32px 32px;       /* minor grid */
  background-position: -1px -1px, -1px -1px, -1px -1px, -1px -1px;
  opacity: 0.9;
}
/* grain / noise overlay */
.grain {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.045;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Layout helpers
   ========================================================================== */
.wrap { max-width: var(--maxw); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.section { padding: clamp(64px, 9vw, 120px) 0; position: relative; }
.section--tight { padding: clamp(48px, 6vw, 80px) 0; }

/* Thin architectural corner brackets on section edges */
.bracketed { position: relative; }
.bracketed > .wrap { position: relative; }
.bracketed::before,
.bracketed::after {
  content: "";
  position: absolute;
  width: 26px; height: 26px;
  border: 1px solid var(--line);
  pointer-events: none;
}
.bracketed::before { top: 26px; left: 26px; border-right: 0; border-bottom: 0; }
.bracketed::after  { bottom: 26px; right: 26px; border-left: 0; border-top: 0; }

/* Crop-mark corners variant (all four) */
.crop { position: relative; }
.crop .crop-mark { position: absolute; width: 18px; height: 18px; pointer-events: none; opacity: 0.5; }
.crop .crop-mark::before, .crop .crop-mark::after { content:""; position:absolute; background: var(--line); }
.crop .crop-mark::before { width: 100%; height: 1px; top: 0; }
.crop .crop-mark::after  { width: 1px; height: 100%; left: 0; }
.crop .tl { top: 12px; left: 12px; }
.crop .tr { top: 12px; right: 12px; transform: scaleX(-1); }
.crop .bl { bottom: 12px; left: 12px; transform: scaleY(-1); }
.crop .br { bottom: 12px; right: 12px; transform: scale(-1); }

/* ==========================================================================
   Typography
   ========================================================================== */
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 700; color: var(--white); line-height: 1.15; margin: 0 0 0.5em; letter-spacing: 0.005em; }
h1 { font-size: clamp(2.3rem, 6vw, 4.1rem); font-weight: 400; }
h2 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); font-weight: 400; }
h3 { font-size: clamp(1.15rem, 2vw, 1.4rem); }
h4 { font-size: 1.05rem; }
p { margin: 0 0 1.1em; color: var(--white-70); }
.lead { font-size: clamp(1.05rem, 1.7vw, 1.28rem); color: var(--white-90); line-height: 1.7; }
strong { color: var(--white-90); font-weight: 600; }

/* Mono label / eyebrow — drafting annotation style */
.label {
  font-family: var(--mono);
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--white-55);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.label::before {
  content: "";
  width: 26px; height: 1px;
  background: var(--line);
  display: inline-block;
}
.label--plain::before { display: none; }

.eyebrow { margin-bottom: 22px; }

/* ==========================================================================
   Dimension-line divider (tick marks + line) instead of <hr>
   ========================================================================== */
.dim-rule {
  --tick: 7px;
  border: 0;
  height: var(--tick);
  margin: 0;
  position: relative;
  background:
    linear-gradient(var(--line), var(--line)) center/100% 1px no-repeat;
}
.dim-rule::before,
.dim-rule::after {
  content: "";
  position: absolute;
  top: 0;
  width: 1px; height: var(--tick);
  background: var(--line);
}
.dim-rule::before { left: 0; }
.dim-rule::after  { right: 0; }
/* center tick */
.dim-rule.dim-rule--center { background-position: center; }

/* small inline dimension divider between hero + intro etc. */
.dim-span {
  display: flex; align-items: center; gap: 0;
  color: var(--white-55);
  font-family: var(--mono);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
}
.dim-span .seg { flex: 1; height: 1px; background: var(--line-soft); position: relative; }
.dim-span .seg::before, .dim-span .seg::after { content:""; position:absolute; top:-3px; width:1px; height:7px; background: var(--line); }
.dim-span .seg::before { left: 0; }
.dim-span .seg::after { right: 0; }
.dim-span .txt { padding: 0 14px; white-space: nowrap; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 15px 26px;
  border: 1px solid var(--line);
  color: var(--white);
  background: transparent;
  cursor: pointer;
  transition: background-color .25s ease, border-color .25s ease, transform .25s ease;
  position: relative;
}
.btn svg { width: 15px; height: 15px; }
.btn:hover { background: rgba(255,255,255,0.06); border-color: var(--white-70); }
.btn--solid { background: var(--white); color: var(--navy-deep); border-color: var(--white); }
.btn--solid:hover { background: var(--white-90); transform: translateY(-1px); }
.btn-row { display: flex; flex-wrap: wrap; gap: 16px; }

/* ==========================================================================
   Navigation
   ========================================================================== */
.nav {
  position: sticky; top: 0; z-index: 50;
  height: var(--nav-h);
  display: flex; align-items: center;
  background: rgba(13,23,64,0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line-soft);
}
.nav .wrap { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.brand { display: flex; align-items: center; gap: 14px; }
.brand img.brand-logo { height: 40px; width: auto; display: block; }
.brand svg { width: 40px; height: 40px; flex: none; }
.brand .brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand .brand-name { font-family: var(--serif); font-size: 1.16rem; color: var(--white); letter-spacing: 0.01em; }
.brand .brand-sub { font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--white-55); margin-top: 5px; }

.nav-links { display: flex; align-items: center; gap: 6px; }
.nav-links a {
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.02rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--white-70);
  padding: 10px 15px;
  transition: color .2s ease;
  position: relative;
}
.nav-links a:hover { color: var(--white); }
.nav-links a.active { color: var(--white); }
.nav-links a.active::after {
  content: ""; position: absolute; left: 15px; right: 15px; bottom: 4px; height: 1.5px; background: var(--white-70);
}
.nav-cta { color: var(--white) !important; }
.nav-cta:hover { color: var(--white) !important; }

.nav-toggle {
  display: none;
  background: transparent; border: 1px solid var(--line-soft);
  width: 44px; height: 40px; cursor: pointer; padding: 0;
  align-items: center; justify-content: center;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
  content: ""; display: block; width: 20px; height: 1.5px; background: var(--white); position: relative; transition: transform .25s ease, opacity .2s ease;
}
.nav-toggle span::before { position: absolute; top: -6px; }
.nav-toggle span::after  { position: absolute; top: 6px; }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after  { transform: translateY(-6px) rotate(-45deg); }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero { position: relative; padding: clamp(70px, 12vw, 150px) 0 clamp(56px, 8vw, 110px); overflow: hidden; }
.hero .wrap { position: relative; z-index: 2; }
.hero h1 { max-width: 16ch; }
.hero .lead { max-width: 52ch; margin-top: 8px; }
.hero .btn-row { margin-top: 40px; }
.hero-meta {
  margin-top: 54px;
  display: flex; flex-wrap: wrap; gap: 0;
  border: 1px solid var(--line-soft);
}
.hero-meta .cell {
  flex: 1 1 180px; padding: 20px 24px;
  border-right: 1px solid var(--line-soft);
}
.hero-meta .cell:last-child { border-right: 0; }
.hero-meta .k { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-55); margin-bottom: 8px; }
.hero-meta .v { font-family: var(--serif); font-size: 1.05rem; color: var(--white); }

/* faint blueprint linework accent in hero corner */
.hero-figure { position: absolute; top: 0; right: 0; width: min(46vw, 560px); height: 100%; z-index: 1; opacity: 0.5; pointer-events: none; }
.hero-figure svg { width: 100%; height: 100%; }

/* ==========================================================================
   HOME HERO — blueprint "sheet" masthead (reference mockup)
   ========================================================================== */
.home-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: clamp(22px, 3vw, 40px) clamp(22px, 4vw, 60px) clamp(40px, 5vw, 64px);
  overflow: hidden;
}
/* thin sheet frame + corner ticks */
.home-hero::before {
  content: "";
  position: absolute;
  inset: clamp(14px, 1.6vw, 26px);
  border: 1px solid var(--line-soft);
  pointer-events: none;
}
.sheet-corner { position: absolute; width: 26px; height: 26px; pointer-events: none; z-index: 3; }
.sheet-corner::before, .sheet-corner::after { content:""; position:absolute; background: var(--line); }
.sheet-corner::before { width: 100%; height: 1px; }
.sheet-corner::after  { width: 1px; height: 100%; }
.sheet-corner.tl { top: clamp(14px,1.6vw,26px); left: clamp(14px,1.6vw,26px); }
.sheet-corner.tr { top: clamp(14px,1.6vw,26px); right: clamp(14px,1.6vw,26px); }
.sheet-corner.tr::before { right: 0; } .sheet-corner.tr::after { right: 0; }
.sheet-corner.bl { bottom: clamp(14px,1.6vw,26px); left: clamp(14px,1.6vw,26px); }
.sheet-corner.bl::before { bottom: 0; } .sheet-corner.bl::after { bottom: 0; }
.sheet-corner.br { bottom: clamp(14px,1.6vw,26px); right: clamp(14px,1.6vw,26px); }
.sheet-corner.br::before { right: 0; bottom: 0; } .sheet-corner.br::after { right: 0; bottom: 0; }

/* masthead: logo + nav */
.hh-masthead {
  position: relative; z-index: 4;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: clamp(6px,1vw,14px) clamp(8px,1.5vw,26px);
}
.hh-logo img { height: clamp(64px, 8vw, 118px); width: auto; display: block; }
.hh-nav.nav-links { position: static; background: none; transform: none; padding: 0; max-height: none; border: 0; }
.hh-nav.nav-links a { border: 0; }

/* body: two columns */
.hh-body {
  position: relative; z-index: 2;
  flex: 1;
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) 1.18fr;
  gap: clamp(24px, 4vw, 60px);
  align-items: center;
  padding: clamp(20px,3vw,48px) clamp(10px,2vw,40px) clamp(10px,2vw,30px);
}
.hh-left { max-width: 520px; }
.hh-title {
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(2.9rem, 6.4vw, 5.4rem);
  line-height: 1.02;
  letter-spacing: 0.005em;
  color: var(--white);
  margin: 0 0 26px;
}
.hh-rule {
  height: 1px; border: 0; margin: 0 0 26px; width: 100%;
  background-image: linear-gradient(90deg, var(--line) 45%, transparent 0);
  background-size: 10px 1px; background-repeat: repeat-x;
}
.hh-lead {
  font-family: var(--sans);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.19em;
  font-size: clamp(0.76rem, 1vw, 0.9rem);
  line-height: 2;
  color: var(--white-70);
  max-width: 40ch;
  margin: 0 0 38px;
}
.hh-cta-row { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.cta-box {
  display: inline-flex; align-items: center; gap: 16px;
  font-family: var(--display); font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.22em;
  font-size: 1rem; color: var(--white);
  padding: 16px 30px; border: 1px solid var(--line);
  transition: background-color .25s ease, border-color .25s ease;
}
.cta-box:hover { background: rgba(255,255,255,0.06); border-color: var(--white-70); }
.cta-box svg { width: 20px; height: 12px; }
.hh-leader {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--sans); text-transform: uppercase; letter-spacing: 0.2em;
  font-size: 0.66rem; color: var(--white-55); line-height: 1.7;
}
.hh-leader::before { content:""; width: 26px; height: 1px; background: var(--line); display: inline-block; }

/* right column: stacked house callouts */
.hh-callouts { display: flex; flex-direction: column; gap: clamp(8px, 1.6vw, 22px); }
.hh-callouts img { width: 100%; height: auto; display: block; }

/* LEV circle badge */
.lev-badge {
  position: relative; z-index: 4;
  width: 62px; height: 62px; border-radius: 50%;
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--display); font-weight: 600; letter-spacing: 0.14em;
  font-size: 0.9rem; color: var(--white);
  margin-left: clamp(8px,1.5vw,26px);
}

@media (max-width: 900px) {
  .home-hero { min-height: auto; }
  .hh-body { grid-template-columns: 1fr; gap: 30px; padding-top: 30px; }
  .hh-left { max-width: none; }
  .hh-callouts { order: 2; }
  .lev-badge { margin-top: 30px; }
  .hh-masthead .nav-toggle { display: inline-flex; }
  .hh-nav.nav-links {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    flex-direction: column; align-items: center; justify-content: center; gap: 6px;
    background: rgba(1,15,40,0.97); backdrop-filter: blur(12px);
    transform: translateY(-120%); transition: transform .32s cubic-bezier(.4,0,.2,1);
    z-index: 60; padding: 40px;
  }
  .hh-nav.nav-links.open { transform: translateY(0); }
  .hh-nav.nav-links a { font-size: 1.4rem; padding: 14px; }
  .hh-masthead .nav-toggle { position: relative; z-index: 61; }
}
@media (max-width: 520px) {
  .hh-logo img { height: 54px; }
  .hh-title { font-size: clamp(2.4rem, 11vw, 3.2rem); }
}

/* ==========================================================================
   Grids & cards
   ========================================================================== */
.grid { display: grid; gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }

.card {
  background: linear-gradient(160deg, rgba(255,255,255,0.028), rgba(255,255,255,0));
  padding: clamp(28px, 3.4vw, 42px);
  position: relative;
  transition: background-color .3s ease;
}
.card:hover { background: rgba(255,255,255,0.04); }
.card .idx { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.2em; color: var(--white-55); margin-bottom: 20px; }
.card .icon { width: 40px; height: 40px; margin-bottom: 22px; color: var(--white); }
.card .icon svg { width: 100%; height: 100%; }
.card h3 { margin-bottom: 12px; }
.card p { margin-bottom: 0; font-size: 0.96rem; }
.card ul { margin: 16px 0 0; padding: 0; list-style: none; }
.card ul li { font-size: 0.9rem; color: var(--white-70); padding: 7px 0 7px 20px; position: relative; border-top: 1px solid var(--line-soft); }
.card ul li:first-child { border-top: 0; }
.card ul li::before { content: ""; position: absolute; left: 0; top: 15px; width: 9px; height: 1px; background: var(--line); }

/* Section intro block */
.section-head { max-width: 720px; margin-bottom: clamp(40px, 5vw, 64px); }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head.center .label { justify-content: center; }
.section-head p { margin-bottom: 0; }

/* ==========================================================================
   Feature / split rows
   ========================================================================== */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.split.reverse .split-media { order: 2; }
.split-media {
  aspect-ratio: 4 / 3;
  border: 1px solid var(--line-soft);
  position: relative;
  display: flex; align-items: center; justify-content: center;
}

/* Numbered process list */
.steps { display: grid; gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); }
.step { background: var(--navy-base); padding: 28px clamp(20px,3vw,34px); display: grid; grid-template-columns: 64px 1fr; gap: 20px; align-items: start; }
.step .n { font-family: var(--serif); font-size: 1.8rem; color: var(--white); opacity: 0.5; line-height: 1; }
.step h4 { margin-bottom: 6px; }
.step p { margin: 0; font-size: 0.94rem; }

/* ==========================================================================
   Portfolio placeholders
   ========================================================================== */
.portfolio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.plot {
  aspect-ratio: 4 / 3;
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(var(--grid-line) 1px, transparent 1px) 0 0 / 28px 28px;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 22px;
  transition: border-color .3s ease, background-color .3s ease;
}
.plot:hover { border-color: var(--white-70); }
.plot .plot-mark {
  position: absolute; top: 20px; left: 20px;
  width: 34px; height: 34px; opacity: 0.6;
}
.plot .plot-mark::before, .plot .plot-mark::after { content:""; position:absolute; background: var(--line); }
.plot .plot-mark::before { width: 34px; height: 1px; top: 0; left: 0; }
.plot .plot-mark::after  { width: 1px; height: 34px; top: 0; left: 0; }
.plot .plot-diag { position:absolute; inset:0; opacity:0.35; }
.plot .plot-cat { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-55); }
.plot .plot-title { font-family: var(--serif); font-size: 1.15rem; color: var(--white); margin-top: 6px; }
.plot .plot-note { position:absolute; top: 22px; right: 20px; font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.14em; color: var(--white-55); text-align: right; }

/* ==========================================================================
   Service-area list
   ========================================================================== */
.area-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.area-list { columns: 2; column-gap: 40px; margin: 24px 0 0; padding: 0; list-style: none; }
.area-list li { font-family: var(--sans); color: var(--white-70); padding: 11px 0 11px 22px; position: relative; border-bottom: 1px solid var(--line-soft); break-inside: avoid; font-size: 0.96rem; }
.area-list li::before { content: ""; position: absolute; left: 0; top: 19px; width: 10px; height: 1px; background: var(--line); }
.area-map { border: 1px solid var(--line-soft); aspect-ratio: 1/1; position: relative; }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 5vw, 72px); align-items: start; }
.form-field { margin-bottom: 22px; }
.form-field label { display: block; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--white-55); margin-bottom: 10px; }
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--line-soft);
  color: var(--white);
  font-family: var(--sans);
  font-size: 1rem;
  padding: 13px 15px;
  transition: border-color .2s ease, background-color .2s ease;
}
.form-field textarea { resize: vertical; min-height: 130px; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  outline: none; border-color: var(--white-70); background: rgba(255,255,255,0.05);
}
.form-field select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='white' stroke-opacity='0.6'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center; padding-right: 38px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-note { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.05em; color: var(--white-55); margin-top: 4px; }
.form-status { display:none; margin-top: 18px; padding: 14px 16px; border: 1px solid var(--line); font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.04em; color: var(--white); background: rgba(255,255,255,0.04); }
.form-status.show { display: block; }
.field-error { border-color: rgba(255,120,120,0.6) !important; }

.contact-cards { display: grid; gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); }
.contact-cards .cc { background: var(--navy-base); padding: 24px 26px; display: flex; gap: 18px; align-items: flex-start; }
.contact-cards .cc .icon { width: 26px; height: 26px; color: var(--white); flex: none; margin-top: 3px; }
.contact-cards .cc .k { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-55); margin-bottom: 6px; }
.contact-cards .cc .v { font-family: var(--serif); font-size: 1.15rem; color: var(--white); }
.contact-cards .cc a.v:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ==========================================================================
   CTA band
   ========================================================================== */
.cta-band { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); text-align: center; }
.cta-band h2 { max-width: 20ch; margin-left: auto; margin-right: auto; }
.cta-band .lead { max-width: 46ch; margin: 0 auto 34px; }
.cta-band .btn-row { justify-content: center; }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer { border-top: 1px solid var(--line-soft); padding: clamp(48px, 6vw, 76px) 0 40px; }
.footer-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; margin-bottom: 48px; }
.footer .brand { margin-bottom: 20px; }
.footer-col h4 { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-55); font-weight: 400; margin-bottom: 18px; }
.footer-col a, .footer-col p { display: block; color: var(--white-70); font-size: 0.94rem; margin-bottom: 11px; }
.footer-col a:hover { color: var(--white); }
.footer p.small { color: var(--white-55); font-size: 0.9rem; max-width: 34ch; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; padding-top: 26px; border-top: 1px solid var(--line-soft); }
.footer-bottom p { margin: 0; font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.08em; color: var(--white-55); }

/* ==========================================================================
   Utilities
   ========================================================================== */
.mono { font-family: var(--mono); }
.tick-list { list-style: none; margin: 0; padding: 0; }
.tick-list li { position: relative; padding: 12px 0 12px 30px; border-bottom: 1px solid var(--line-soft); color: var(--white-70); }
.tick-list li:last-child { border-bottom: 0; }
.tick-list li::before { content: ""; position: absolute; left: 0; top: 19px; width: 16px; height: 1px; background: var(--line); }
.tick-list li strong { display: block; color: var(--white); font-family: var(--serif); font-size: 1.05rem; margin-bottom: 2px; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 960px) {
  .footer-top { grid-template-columns: 1fr 1fr; }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .nav-toggle { display: inline-flex; }
  .nav-links {
    position: fixed; top: var(--nav-h); left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: rgba(13,23,64,0.97);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line-soft);
    padding: 12px var(--gutter) 26px;
    transform: translateY(-140%);
    transition: transform .32s cubic-bezier(.4,0,.2,1);
    max-height: calc(100vh - var(--nav-h)); overflow-y: auto;
  }
  .nav-links.open { transform: translateY(0); }
  .nav-links a { padding: 15px 4px; border-bottom: 1px solid var(--line-soft); font-size: 0.82rem; }
  .nav-links a.active::after { display: none; }
  .nav-cta { margin: 16px 4px 0; text-align: center; justify-content: center; }
  .split, .area-grid, .contact-grid { grid-template-columns: 1fr; }
  .split.reverse .split-media { order: 0; }
  .grid--3, .portfolio { grid-template-columns: repeat(2, 1fr); }
  .hero-figure { opacity: 0.28; width: 70vw; }
}
@media (max-width: 560px) {
  body { font-size: 16px; }
  .grid--3, .grid--2, .grid--4, .portfolio { grid-template-columns: 1fr; }
  .hero-meta { flex-direction: column; }
  .hero-meta .cell { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .hero-meta .cell:last-child { border-bottom: 0; }
  .form-row { grid-template-columns: 1fr; }
  .area-list { columns: 1; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; }
  .brand .brand-sub { display: none; }
  .bracketed::before, .bracketed::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---- Embedded LEV wordmark (kept in CSS so it ships as text) ---- */
.brand-logo,.hh-logo-img{background-image:url("data:image/png;base64,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");background-repeat:no-repeat;background-position:left center;background-size:contain;display:block}
.brand-logo{height:40px;width:150px}
.hh-logo-img{height:clamp(64px,8vw,118px);width:clamp(105px,13vw,194px)}
