:root{--bg:#0b0f14;--panel:#0f141a;--ink:#e7edf5;--sub:#99a7b8;--line:#22323f;--gold:#9e8331}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,Inter,Arial,sans-serif}
.container{max-width:1120px;margin:0 auto;padding:0 16px}a{color:inherit}
.site-header{position:sticky;top:0;z-index:50;background:#0d1319cc;backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.hdr{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.logo{display:flex;gap:.6rem;align-items:center;color:var(--ink);text-decoration:none;font-weight:800}
.logo img{height:38px;width:auto;display:block}.logo .word{font-size:1.1rem;letter-spacing:.02em}
.nav a{color:var(--ink);text-decoration:none;margin-left:14px;padding:8px 12px;border-radius:12px}
.nav a[aria-current="page"]{background:#141b23;border:1px solid var(--line)}.nav a:hover{background:#121922}
.site-footer{border-top:1px solid var(--line);padding:24px 0;margin-top:40px;color:var(--sub)}
.hero{position:relative;overflow:clip;padding:48px 0 28px}
.hero--gold h1{background:linear-gradient(180deg,#c7a954 0%,#927b36 80%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tag{display:inline-block;color:var(--sub);font-size:.95rem;margin-bottom:.35rem}.lead{color:var(--sub);max-width:70ch}
.hero-cta{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;color:var(--ink)}
.chip{display:inline-block;margin:.25rem .35rem .25rem 0;padding:.25rem .6rem;border-radius:999px;border:1px solid var(--line);color:var(--sub);font-size:.9rem}
.cards{display:grid;gap:14px}@media (min-width:700px){.cards{grid-template-columns:repeat(3,1fr)}}
.btn{display:inline-block;border:1px solid var(--line);padding:.6rem 1rem;border-radius:12px;color:var(--ink);text-decoration:none;background:#101720}
.btn:hover{background:#121e28}.btn.btn--primary{background:var(--gold);color:#111;border-color:#000;font-weight:800}
.work-grid{display:grid;gap:10px;margin-top:10px}@media (min-width:640px){.work-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:900px){.work-grid{grid-template-columns:repeat(3,1fr)}}
.work-item{display:block;background:#0d1319;border:1px solid var(--line);border-radius:12px;overflow:hidden}.work-item img{display:block;width:100%;height:auto}
.work-item .cap{border-top:1px solid var(--line);color:var(--sub);font-size:.95rem}
.contact{display:grid;gap:16px}@media (min-width:820px){.contact{grid-template-columns:2fr 1fr}}
.quote-section{padding:8px 0 8px}.quote-section--standalone{padding:20px 0 8px}.quote-intro{display:grid;gap:16px;margin-bottom:18px}@media (min-width:920px){.quote-intro{grid-template-columns:1.35fr .85fr;align-items:start}}.quote-points ul{margin:0;padding-left:1.1rem;color:var(--sub)}.quote-points li+li{margin-top:.45rem}.quote-layout{align-items:start}.quote-form{padding:18px}.quote-form-grid{display:grid;gap:12px;margin-bottom:6px}@media (min-width:780px){.quote-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.quote-form textarea{min-height:170px}.quote-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:8px}.subtle{color:var(--sub);font-size:.95rem}.quote-contact-card{position:sticky;top:86px}.quote-hours p{margin:.2rem 0}.quote-home-cta{padding:8px 0 18px}.quote-home-cta__card{display:grid;gap:16px;align-items:center}@media (min-width:820px){.quote-home-cta__card{grid-template-columns:1.3fr .7fr}}.quote-home-cta__actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-start}.hero--compact{padding-bottom:18px}.flash-wrap{padding-top:18px}.flash{border:1px solid var(--line);border-radius:14px;padding:14px 16px}.flash--success{background:#13261a;color:#d9f5de;border-color:#2d6a3f}.flash--error{background:#2b1616;color:#ffd6d6;border-color:#7a2f2f}
label{display:block;color:var(--sub);margin:.4rem 0 .25rem;font-weight:600}input,textarea,select{width:100%;padding:.8rem .85rem;border-radius:12px;border:1px solid var(--line);background:#0d1319;color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}input::placeholder,textarea::placeholder{color:#718194}input:focus,textarea:focus,select:focus{outline:none;border-color:#9e8331;box-shadow:0 0 0 3px rgba(158,131,49,.18)}textarea{min-height:140px;resize:vertical}
.consent-line{display:flex;align-items:flex-start;gap:.5rem;flex-wrap:wrap;line-height:1.4}.consent-line span{flex:1 1 0;min-width:0;overflow-wrap:anywhere}
#lb{position:fixed;inset:0;background:rgba(0,0,0,.88);display:none;z-index:9999}#lb.open{display:block}#lb .frame{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(8px,2vw,20px)}#lb img{display:block;max-width:96vw;max-height:82vh;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.35)}#lb .x,#lb .p,#lb .n{position:absolute;top:50%;transform:translateY(-50%);background:rgba(12,14,18,.6);color:#fff;border:1px solid #333;border-radius:10px;padding:.8rem 1rem;font-weight:700;cursor:pointer}#lb .x{top:10px;right:10px;transform:none;border-radius:999px}#lb .p{left:1rem}#lb .n{right:1rem}


/* Header/mobile tagline placement tweak */
@media (max-width: 780px){
  .site-header .hdr{ padding-bottom: 4px; }
  .site-header .tagline{
    display:block;
    margin-top:6px;
    margin-bottom:2px;
    line-height:1.25;
  }
  .site-header .brand-mark{ height:36px; }
}

/* Header logo sizing */
.brand-mark{ height:42px; width:auto; display:block; image-rendering:auto; }
@media (max-width:780px){ .brand-mark{ height:36px; } }

/* Subtle halo so PNG reads on dark headers (no weird SVG compositing) */
:root{ --logoHalo: rgba(255,255,255,.28); }
html[data-theme="dark"]{ --logoHalo: rgba(0,0,0,.35); }

.brand-mark{
  filter:
    drop-shadow(0 0 1px var(--logoHalo))
    drop-shadow(0 1px 2px var(--logoHalo));
}



/* /css/patch.css — hero watermark (gate), no HTML changes needed */

/* Ensure hero content sits above the watermark */
.hero{ position: relative; }
.hero .container{ position: relative; z-index: 1; }

/* Gate watermark as a CSS pseudo-element */
.hero::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6vh;                  /* sits slightly below the text */
  transform:translateX(-50%);
  width:min(1600px, 130vw);     /* responsive, but capped */
  height:48vh;                  /* aspect handled via background-size */
  pointer-events:none;
  z-index:0;
  background-image:url("/images/gate.png");
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:contain;

  /* visibility */
  opacity:.18;                  /* visible by default so you can verify */
  mix-blend-mode:screen;        /* plays nice on dark */
}

/* On light theme, behave like ink */
html[data-theme="light"] .hero::after{
  mix-blend-mode:multiply;
  opacity:.14;
}

/* Soften / hide as viewport shrinks */
@media (max-width:1100px){ .hero::after{ opacity:.12; } }
@media (max-width:980px){  .hero::after{ display:none; } }

