﻿  @import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;600;700&family=Work+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=JetBrains+Mono:wght@500;600;700&display=swap');

  :root{
    --paper:#F5F6F9;
    --paper-2:#E8EAF0;
    --surface:#FFFFFF;
    --ink:#0A0A0A;
    --ink-2:#000000;
    --blue:#4169E1;
    --blue-strong:#2E4EB8;
    --blue-tint:#A9BBF0;
    --text:#101114;
    --text-muted:#585D68;
    --line:#DADDE6;
    --on-ink:#F5F6F9;
    --on-ink-muted:#9BA3B4;

    --font-display:'Josefin Sans','Arial Narrow',sans-serif;
    --font-body:'Work Sans',-apple-system,'Segoe UI',sans-serif;
    --font-mono:'JetBrains Mono','Consolas',monospace;

    color-scheme: light;
  }

  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#0E0F12;
      --paper-2:#17181D;
      --surface:#1B1C22;
      --ink:#000000;
      --ink-2:#000000;
      --blue:#6E8CEE;
      --blue-strong:#8FA6F2;
      --blue-tint:#8FA6F2;
      --text:#EEEFF3;
      --text-muted:#A6ABB8;
      --line:#2B2D35;
      --on-ink:#F5F6F9;
      --on-ink-muted:#9BA3B4;
      color-scheme: dark;
    }
  }
  :root[data-theme="dark"]{
    --paper:#0E0F12;
    --paper-2:#17181D;
    --surface:#1B1C22;
    --ink:#000000;
    --ink-2:#000000;
    --blue:#6E8CEE;
    --blue-strong:#8FA6F2;
    --blue-tint:#8FA6F2;
    --text:#EEEFF3;
    --text-muted:#A6ABB8;
    --line:#2B2D35;
    --on-ink:#F5F6F9;
    --on-ink-muted:#9BA3B4;
    color-scheme: dark;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--text);
    font-family:var(--font-body);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
  }

  h1,h2,h3{
    font-family:var(--font-display);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.02em;
    line-height:1.02;
    text-wrap:balance;
    margin:0;
  }
  a{color:var(--blue);}
  img{max-width:100%; display:block;}
  .eyebrow{
    font-family:var(--font-mono);
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--blue);
    display:flex;
    align-items:center;
    gap:0.55em;
    margin-bottom:0.9em;
  }
  .eyebrow::before{ content:""; width:1.3em; height:2px; background:var(--blue); display:inline-block; }
  .on-ink .eyebrow, .on-blue .eyebrow{ color:#FFFFFF; }
  .on-ink .eyebrow::before, .on-blue .eyebrow::before{ background:#FFFFFF; }
  .lede{
    font-size:1.14rem;
    color:var(--text-muted);
    max-width:58ch;
  }
  .on-ink .lede{ color:var(--on-ink-muted); }
  .on-blue .lede{ color:rgba(255,255,255,0.88); }
  p{max-width:65ch;}
  .wrap{
    max-width:1160px;
    margin:0 auto;
    padding-inline:1.5rem;
  }
  button{font-family:inherit;}

  /* ---------- Logo mark: shared-valley WV ---------- */
  .logo-mark{ display:block; }
  .logo-mark .peak-a{ stroke:var(--ink); }
  .logo-mark .peak-b{ stroke:var(--blue); }
  .on-ink .logo-mark .peak-a{ stroke:var(--on-ink); }
  .on-ink .logo-mark .peak-b{ stroke:var(--blue-tint); }

  /* ---------- Nav ---------- */
  header.site-nav{
    position:sticky; top:env(safe-area-inset-top, 0px); z-index:50;
    background:var(--paper);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    max-width:1160px; margin:0 auto; padding-inline:1.5rem;
    display:flex; align-items:center; justify-content:space-between;
    height:68px; gap:1rem;
  }
  .wordmark{
    display:flex; align-items:center; gap:0.85rem;
    text-decoration:none; white-space:nowrap;
  }
  .wordmark .logo-mark{ width:34px; height:26px; flex:none; }
  .wordmark .lockup{ display:flex; flex-direction:column; line-height:1.05; }
  .wordmark .lockup .line1{
    font-family:var(--font-display); font-weight:700; font-size:1.15rem;
    letter-spacing:0.02em; text-transform:uppercase; color:var(--text);
  }
  .wordmark .lockup .line2{
    font-family:var(--font-mono); font-weight:600; font-size:0.6rem;
    letter-spacing:0.16em; text-transform:uppercase; color:var(--blue);
    margin-top:0.2rem;
  }
  nav.links{ display:flex; gap:1.6rem; align-items:center; }
  nav.links a{
    font-family:var(--font-mono); font-size:0.76rem; letter-spacing:0.05em;
    text-transform:uppercase; text-decoration:none; color:var(--text-muted);
    padding:0.4rem 0; border-bottom:2px solid transparent;
    transition:color .15s, border-color .15s;
  }
  nav.links a:hover, nav.links a:focus-visible{ color:var(--text); }
  nav.links a.active{ color:var(--text); border-color:var(--blue); }
  nav.links a:focus-visible{ outline:2px solid var(--blue); outline-offset:3px; }
  .nav-cta{ display:flex; align-items:center; gap:0.9rem; }
  .nav-toggle{ display:none; background:none; border:1px solid var(--line); color:var(--text); padding:0.45rem 0.65rem; font-family:var(--font-mono); font-size:0.75rem; letter-spacing:.05em; cursor:pointer; }

  @media (max-width:820px){
    nav.links{
      position:absolute; top:68px; left:0; right:0;
      background:var(--paper); border-bottom:1px solid var(--line);
      flex-direction:column; align-items:flex-start; gap:0;
      padding:0.5rem 1.5rem 1rem;
      display:none;
    }
    nav.links.open{ display:flex; }
    nav.links a{ width:100%; padding:0.7rem 0; border-bottom:1px solid var(--line); }
    nav.links a.active{ border-bottom:1px solid var(--blue); }
    .nav-toggle{ display:block; }
    .nav-cta .btn-outline{ display:none; }
  }

  /* ---------- Sections ---------- */
  section.page{ display:block; }
  

  .band{ padding-block:4.5rem; }
  .band.tight{ padding-block:2.75rem; }

  .band-ink{ background:var(--ink); color:var(--on-ink); }
  .band-line{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .band-alt{ background:var(--paper-2); }

  .text-muted{ color:var(--text-muted); }

  .btn{
    display:inline-flex; align-items:center; gap:.5rem;
    font-family:var(--font-mono); font-size:0.8rem; letter-spacing:0.06em;
    text-transform:uppercase; text-decoration:none;
    padding:0.9rem 1.5rem; border:1px solid transparent;
    cursor:pointer; transition:opacity .15s, background .15s, color .15s, border-color .15s;
  }
  .btn-blue{ background:var(--blue); color:#FFFFFF; }
  .btn-blue:hover{ background:var(--blue-strong); }
  .btn-white{ background:#FFFFFF; color:var(--ink); }
  .btn-white:hover{ background:#E4E7EF; }
  .btn-line{ border-color:rgba(255,255,255,0.55); color:#FFFFFF; background:transparent; }
  .btn-line:hover{ border-color:#FFFFFF; }
  .btn-outline{ border-color:var(--line); color:var(--text); background:transparent; }
  .btn-outline:hover{ border-color:var(--blue); color:var(--blue); }

  /* ---------- Photo hero (full-bleed, dark gradient overlay) ---------- */
  .photo-hero{ position:relative; overflow:hidden; background:var(--ink); color:#FFFFFF; }
  .photo-hero img.bg{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  }
  .photo-hero::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(100deg, rgba(6,7,9,0.94) 0%, rgba(6,7,9,0.78) 38%, rgba(10,20,45,0.35) 75%, rgba(10,20,45,0.15) 100%);
  }
  .photo-hero .wrap{ position:relative; z-index:1; padding-block:5.5rem; }
  .photo-hero h1{ font-size:clamp(2.3rem, 5.2vw, 4rem); color:#FFFFFF; margin-top:0.6rem; max-width:16ch; }
  .photo-hero-sm .wrap{ padding-block:3.75rem; }
  .photo-hero-sm h1{ font-size:clamp(2rem, 4.4vw, 3rem); max-width:20ch; }
  .hero-ctas{ display:flex; gap:1rem; margin-top:2rem; flex-wrap:wrap; }
  @media (max-width:600px){
    .photo-hero .wrap{ padding-block:3.5rem; }
  }

  /* ---------- Stat strip ---------- */
  .stat-strip{ display:flex; flex-wrap:wrap; }
  .stat-item{
    flex:1 1 220px; padding:1.4rem 1.6rem;
    border-left:1px solid var(--line);
    font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.07em;
    text-transform:uppercase; color:var(--text-muted);
  }
  .stat-item:first-child{ border-left:none; }
  .stat-item strong{
    display:block; font-family:var(--font-display); font-weight:700;
    font-size:1.5rem; text-transform:none; letter-spacing:0; color:var(--text);
    margin-top:0.2rem; line-height:1;
  }
  @media (max-width:600px){ .stat-item{ flex:1 1 50%; border-left:none; border-top:1px solid var(--line); } .stat-item:nth-child(2n){ border-left:1px solid var(--line); } }

  /* grids */
  .grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2.5rem; }
  .grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; margin-top:2.5rem; }
  @media (max-width:820px){ .grid-3, .grid-2{ grid-template-columns:1fr; } }

  h2.section-title{ font-size:clamp(1.8rem,3.6vw,2.6rem); }
  .section-head{ max-width:70ch; }

  /* plan cards */
  .card-plan{ background:var(--surface); border:1px solid var(--line); border-top:4px solid var(--blue); padding:1.85rem; }
  .card-plan h3{ font-size:1.28rem; margin-bottom:0.6rem; text-transform:none; letter-spacing:0; }
  .card-plan p{ font-size:0.95rem; color:var(--text-muted); margin:0; }

  /* ---------- Alternating photo/text service blocks ---------- */
  .value-row{ display:grid; grid-template-columns:1fr 1.05fr; gap:2.75rem; align-items:center; margin-top:3.25rem; }
  .value-row:first-of-type{ margin-top:2.75rem; }
  .value-row.reverse .value-photo{ order:2; }
  @media (max-width:820px){ .value-row, .value-row.reverse{ grid-template-columns:1fr; } .value-row.reverse .value-photo{ order:0; } }

  .value-photo{
    position:relative; aspect-ratio:4/3; overflow:hidden;
    clip-path:polygon(9% 0, 100% 0, 100% 100%, 0 100%);
  }
  @media (max-width:820px){ .value-photo{ clip-path:none; } }
  .value-photo img{ width:100%; height:100%; object-fit:cover; }
  .value-photo .tag-badge{
    position:absolute; left:1.2rem; bottom:1.1rem;
    font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase;
    color:#FFFFFF; background:rgba(10,10,10,0.72); padding:0.45rem 0.75rem;
  }

  .value-copy h3{ font-size:1.55rem; margin-bottom:0.75rem; text-transform:none; letter-spacing:0; }
  .value-copy p{ color:var(--text-muted); }

  /* ---------- Selected experience band ---------- */
  .exp-band{ background:var(--blue); color:#FFFFFF; }
  .exp-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:1.5rem; }
  .exp-name{ font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(2rem,5vw,3.2rem); color:#FFFFFF; line-height:1; }
  .exp-meta{ font-family:var(--font-mono); font-size:0.85rem; letter-spacing:0.04em; color:rgba(255,255,255,0.85); text-transform:uppercase; margin-top:0.6rem; }
  .exp-stats{ display:flex; gap:2.5rem; flex-wrap:wrap; margin-top:2.25rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,0.3); }
  .exp-stats div{ display:flex; flex-direction:column; }
  .exp-stats strong{ font-family:var(--font-display); font-weight:700; font-size:2.4rem; line-height:1; }
  .exp-stats span{ font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase; color:rgba(255,255,255,0.8); margin-top:0.4rem; }

  /* credibility strip */
  .credibility{
    display:flex; flex-wrap:wrap; gap:0.6rem 1.1rem; justify-content:center;
    padding-block:1.5rem;
  }
  .cred-chip{
    font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--text-muted); border:1px solid var(--line); padding:0.4rem 0.8rem;
  }

  /* process timeline */
  .timeline{ margin-top:3rem; display:flex; flex-direction:column; }
  .step{ display:grid; grid-template-columns:60px 1fr; gap:1.5rem; position:relative; padding-bottom:2.75rem; }
  .step:last-child{ padding-bottom:0; }
  .step-num{
    width:52px; height:52px; border:1px solid var(--blue); color:var(--blue);
    font-family:var(--font-mono); font-weight:600; font-size:1.05rem;
    display:flex; align-items:center; justify-content:center;
    background:var(--surface); z-index:1;
  }
  .step::before{ content:""; position:absolute; left:25px; top:52px; bottom:0; width:1px; background:var(--line); }
  .step:last-child::before{ display:none; }
  .step h3{ font-size:1.22rem; margin-bottom:0.5rem; text-transform:none; letter-spacing:0; }
  .step p{ color:var(--text-muted); font-size:0.95rem; margin:0; }

  /* footer */
  footer{ background:var(--ink-2); color:var(--on-ink); padding-block:3.25rem 2rem; }
  .footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:2rem; }
  @media (max-width:700px){ .footer-grid{ grid-template-columns:1fr; } }
  footer h4{ font-family:var(--font-mono); font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--on-ink-muted); margin:0 0 0.9rem; }
  footer a{ color:var(--on-ink); text-decoration:none; }
  footer a:hover{ color:var(--blue-tint); }
  footer .fine{ margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid #202124; font-family:var(--font-mono); font-size:0.74rem; color:var(--on-ink-muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.5rem; }
  footer p{ color:var(--on-ink-muted); font-size:0.9rem; margin:0 0 0.5rem; }
  footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.5rem; font-size:0.9rem; }
  .footer-chips{ display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:1rem; }
  .footer-chips span{ font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.05em; text-transform:uppercase; border:1px solid #26282C; padding:0.3rem 0.65rem; color:var(--on-ink-muted); }

  .placeholder{ color:var(--text-muted); font-style:italic; border-bottom:1px dashed var(--line); padding-bottom:1px; }
  .on-ink .placeholder{ color:var(--on-ink-muted); border-bottom-color:#33353A; }

  .cta-band{ text-align:center; }
  .cta-band h2{ font-size:clamp(1.6rem,3.4vw,2.2rem); }
  .cta-band .btn{ margin-top:1.5rem; }

  /* ---------- Quote form ---------- */
  .contact-layout{ display:grid; grid-template-columns:1.5fr 1fr; gap:1.5rem; margin-top:2.5rem; align-items:start; }
  .contact-side{ display:flex; flex-direction:column; gap:1.5rem; }
  @media (max-width:820px){ .contact-layout{ grid-template-columns:1fr; } }
  .quote-form{ display:flex; flex-direction:column; gap:1.1rem; }
  .quote-form h3{ font-size:1.28rem; text-transform:none; letter-spacing:0; margin:0; }
  .quote-form label{ display:flex; flex-direction:column; gap:0.4rem; font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
  .quote-form input, .quote-form select, .quote-form textarea{
    font-family:var(--font-body); font-size:1rem; letter-spacing:0; text-transform:none;
    color:var(--text); background:var(--paper); border:1px solid var(--line);
    padding:0.7rem 0.8rem; width:100%; border-radius:0;
  }
  .quote-form textarea{ resize:vertical; min-height:120px; }
  .quote-form input:focus-visible, .quote-form select:focus-visible, .quote-form textarea:focus-visible{ outline:2px solid var(--blue); outline-offset:1px; border-color:var(--blue); }
  .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
  @media (max-width:600px){ .field-row{ grid-template-columns:1fr; } }
  .quote-form .btn{ align-self:flex-start; }
  .form-note{ font-size:0.85rem; color:var(--text-muted); margin:0; }
  .hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

  /* v2 fixes */
  .logo-mark .peak-a{ stroke:var(--text); }
  .on-ink .logo-mark .peak-a{ stroke:var(--on-ink); }
  @media (max-width:820px){ .nav-cta{ display:none; } }
