
  :root{
    --ink:#15171b;
    --ink-soft:#2a2d33;
    --panel:#1b1e22;
    --stone:#eeece6;
    --stone-2:#e3e0d7;
    --stone-line: rgba(21,23,27,0.14);
    --paper-line: rgba(238,236,230,0.18);
    --gold:#b08d3e;
    --gold-light:#d9bd7c;
    --sienna:#b23a1a;
    --sienna-dark:#8c2c12;
    --sienna-light:#e56a3e;
    --radius: 2px;
    --maxw: 1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--stone);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{
    font-family:'Fraunces',serif;
    font-weight:600;
    line-height:1.05;
    margin:0;
    letter-spacing:-0.01em;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .mono{font-family:'IBM Plex Mono',monospace;letter-spacing:0.04em;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

  /* ---------- Signature seam: a stitched thread running the length of the page ---------- */
  main{ position:relative; }
  .seam{
    position:absolute; top:0; bottom:0; left:26px; width:1px;
    background-image: repeating-linear-gradient(
      to bottom,
      var(--gold) 0, var(--gold) 5px,
      transparent 5px, transparent 13px
    );
    opacity:0.4; z-index:2; pointer-events:none;
  }
  .seam::before, .seam::after{
    content:""; position:absolute; left:50%; transform:translateX(-50%);
    width:7px; height:7px; border-radius:50%; background:var(--gold);
  }
  .seam::before{ top:-3px; }
  .seam::after{ bottom:-3px; }
  @media (max-width:980px){ .seam{ display:none; } }
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:12px;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--sienna);
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
  }
  .eyebrow::before{
    content:"";
    width:22px;height:1px;background:var(--sienna);
    display:inline-block;
  }
  .eyebrow.on-dark{color:var(--gold-light);}
  .eyebrow.on-dark::before{background:var(--gold-light);}

  /* ---------- Ruler / tape-measure signature motif ---------- */
  .ruler{
    width:100%;
    height:26px;
    position:relative;
    background-image:
      repeating-linear-gradient(
        to right,
        var(--stone-line) 0, var(--stone-line) 1px,
        transparent 1px, transparent 20px
      ),
      repeating-linear-gradient(
        to right,
        var(--stone-line) 0, var(--stone-line) 1px,
        transparent 1px, transparent 100px
      );
    background-size: 20px 10px, 100px 18px;
    background-repeat:repeat-x;
    background-position: left top, left bottom;
    opacity:0.9;
  }
  .ruler.dark{
    background-image:
      repeating-linear-gradient(to right, var(--paper-line) 0, var(--paper-line) 1px, transparent 1px, transparent 20px),
      repeating-linear-gradient(to right, var(--paper-line) 0, var(--paper-line) 1px, transparent 1px, transparent 100px);
  }
  .ruler-label{
    position:absolute; top:2px; left:24px;
    font-family:'IBM Plex Mono',monospace;
    font-size:10px; letter-spacing:0.1em; text-transform:uppercase;
    color: var(--ink-soft); opacity:0.55;
  }
  .ruler.dark .ruler-label{ color:var(--stone); opacity:0.5; }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(21,23,27,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--paper-line);
    overflow:visible;
  }
  .nav-row{
    display:flex; align-items:center; justify-content:space-between;
    height:84px;
  }
  .logo-mark{ display:flex; align-items:center; overflow:visible; }
  .logo-mark img{ height:98px; width:auto; display:block; }
  .logo{
    font-family:'Fraunces',serif;
    font-weight:700;
    font-size:21px;
    letter-spacing:-0.01em;
    display:flex; flex-direction:column; line-height:1;
  }
  .logo span{
    font-family:'IBM Plex Mono',monospace;
    font-weight:400;
    font-size:9px;
    letter-spacing:0.24em;
    color:var(--sienna);
    margin-top:3px;
  }
  nav.primary-nav{
    display:flex; align-items:center; gap:32px;
  }
  nav.primary-nav a{
    font-size:14px; font-weight:500; color:rgba(238,236,230,0.75);
    position:relative; padding:4px 0;
  }
  nav.primary-nav a:hover{color:var(--gold-light);}
  nav.primary-nav a.active{ color:var(--gold-light); }

  /* ---------- Nav dropdown (Services) ---------- */
  .nav-item{ position:relative; }
  .nav-item > a{ display:flex; align-items:center; gap:6px; cursor:pointer; }
  .nav-item > a .caret{ font-size:9px; opacity:0.6; transition:transform .2s ease; }
  .nav-item:hover > a .caret{ transform:rotate(180deg); }
  .nav-dropdown{
    position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px);
    min-width:240px; background:var(--panel); border:1px solid var(--paper-line);
    padding:8px; opacity:0; visibility:hidden; transition:opacity .18s ease, transform .18s ease;
    box-shadow:0 18px 40px -12px rgba(0,0,0,0.5);
  }
  .nav-item:hover .nav-dropdown{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
  .nav-dropdown a{
    display:block; padding:11px 14px; font-size:13.5px; color:rgba(238,236,230,0.8);
    border-left:2px solid transparent;
  }
  .nav-dropdown a:hover{ color:var(--gold-light); border-left-color:var(--gold); background:rgba(255,255,255,0.03); }

  /* ---------- Breadcrumb ---------- */
  .breadcrumb{
    background:var(--ink); border-bottom:1px solid var(--paper-line); padding:16px 0;
  }
  .breadcrumb .wrap{ display:flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; }
  .breadcrumb a{ color:rgba(238,236,230,0.55); }
  .breadcrumb a:hover{ color:var(--gold-light); }
  .breadcrumb span.sep{ color:rgba(238,236,230,0.3); }
  .breadcrumb span.current{ color:var(--gold-light); }

  /* ---------- Page hero (subpages) ---------- */
  .page-hero{
    background:var(--ink); color:var(--stone); padding:64px 0 60px; position:relative; overflow:hidden;
  }
  .page-hero::before{
    content:"";
    position:absolute; inset:0;
    background: radial-gradient(ellipse 800px 460px at 88% 10%, rgba(178,58,26,0.28), transparent 60%);
    pointer-events:none;
  }
  .page-hero .wrap{ position:relative; z-index:1; }
  .page-hero h1{ font-size:clamp(32px,4.6vw,52px); color:var(--stone); max-width:18ch; }
  .page-hero p.lede{ font-size:16px; line-height:1.7; color:rgba(238,236,230,0.75); max-width:52ch; margin:18px 0 30px; }
  .page-hero-cta{ display:flex; gap:14px; flex-wrap:wrap; }

  /* ---------- Service detail layout ---------- */
  .detail-grid{ display:grid; grid-template-columns:1.2fr 0.8fr; gap:56px; align-items:start; }
  .detail-copy h2{ font-size:clamp(24px,3vw,32px); margin-bottom:16px; }
  .detail-copy p{ font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin-bottom:20px; max-width:62ch; }
  .detail-copy h2 + p{ margin-top:0; }
  .benefit-list{ list-style:none; padding:0; margin:24px 0 0; display:grid; gap:14px; }
  .benefit-list li{ display:flex; gap:14px; align-items:flex-start; font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
  .benefit-list .mk{ flex-shrink:0; width:22px; height:22px; border:1px solid var(--sienna); color:var(--sienna); display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:11px; margin-top:1px; }
  .spec-panel{
    border:1px solid var(--stone-line); background:var(--stone-2); padding:28px;
  }
  .spec-panel-title{ font-family:'Fraunces',serif; font-size:19px; margin-bottom:4px; }
  .spec-panel-sub{ font-size:12.5px; color:var(--ink-soft); margin-bottom:18px; }
  .spec-panel .spec-row{
    display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px dashed var(--stone-line);
    font-size:13px;
  }
  .spec-panel .spec-row .k{ font-family:'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft); font-size:11px; }
  .spec-panel .spec-row .v{ text-align:right; color:var(--ink); font-weight:500; }
  .spec-panel .btn{ margin-top:22px; }

  .compare-strip{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--stone-line); border:1px solid var(--stone-line); margin-top:16px;
  }
  .compare-card{ background:var(--stone); padding:22px 20px; }
  .compare-card.is-this{ background:var(--ink); color:var(--stone); }
  .compare-card h5{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--sienna); margin-bottom:8px; }
  .compare-card.is-this h5{ color:var(--gold-light); }
  .compare-card p{ font-size:13px; line-height:1.55; color:var(--ink-soft); margin:0; }
  .compare-card.is-this p{ color:rgba(238,236,230,0.75); }

  /* ---------- Detailed head-to-head comparison table ---------- */
  .vs-panel{
    border:1px solid var(--stone-line); background:var(--stone-2); margin-top:16px;
  }
  .vs-head{
    display:grid; grid-template-columns:1.3fr 1fr 1fr;
    background:var(--ink); color:var(--stone);
  }
  .vs-head > div{ padding:16px 18px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; }
  .vs-head .vs-col-winner{ color:var(--gold-light); background:rgba(176,141,62,0.12); }
  .vs-row{
    display:grid; grid-template-columns:1.3fr 1fr 1fr;
    border-top:1px solid var(--stone-line);
  }
  .vs-row > div{ padding:16px 18px; font-size:13.5px; line-height:1.5; }
  .vs-row .vs-label{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-soft); display:flex; align-items:center; }
  .vs-row .vs-winner{ background:rgba(178,58,26,0.05); color:var(--ink); font-weight:500; border-left:2px solid var(--sienna); }
  .vs-row .vs-other{ color:var(--ink-soft); }
  @media (max-width:700px){
    .vs-head{ display:none; }
    .vs-row{ grid-template-columns:1fr; border-top:2px solid var(--stone-line); padding:14px 18px 16px; }
    .vs-row .vs-label{ padding:0 0 8px; font-weight:600; color:var(--sienna); font-size:12px; }
    .vs-row > div:not(.vs-label){ padding:10px 0 0; border-left:none; }
    .vs-row .vs-winner{ border-left:none; border-top:1px dashed var(--stone-line); }
    .vs-row .vs-other{ border-top:1px dashed var(--stone-line); }
    .vs-row [data-label]::before{
      content:attr(data-label); display:block; font-family:'IBM Plex Mono',monospace;
      font-size:10px; text-transform:uppercase; letter-spacing:0.05em; color:var(--sienna); margin-bottom:4px;
    }
    .vs-row .vs-other[data-label]::before{ color:var(--ink-soft); }
  }

  .related-services{ background:var(--stone-2); }
  .related-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--stone-line); border:1px solid var(--stone-line); }
  .related-card{ background:var(--stone); padding:24px 22px; display:flex; flex-direction:column; gap:10px; transition:background .2s ease; }
  .related-card:hover{ background:var(--stone-2); }
  .related-card .rc-num{ font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--sienna); }
  .related-card h4{ font-size:16.5px; }
  .related-card span.go{ font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--sienna); margin-top:auto; }

  @media (max-width:980px){
    .nav-dropdown{ display:none; }
    .detail-grid{ grid-template-columns:1fr; gap:32px; }
    .related-grid{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width:560px){
    .related-grid{ grid-template-columns:1fr; }
  }
  .header-cta{
    display:flex; align-items:center; gap:14px;
  }
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-family:'Inter',sans-serif; font-weight:700; font-size:14px;
    padding:13px 22px; border-radius:var(--radius);
    border:1px solid transparent; cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
    white-space:nowrap;
  }
  .btn-primary{
    background:var(--sienna); color:#fff;
    box-shadow: 3px 3px 0 var(--sienna-dark);
  }
  .btn-primary:hover{ transform:translate(-2px,-2px); box-shadow:5px 5px 0 var(--sienna-dark); }
  .btn-ghost{
    background:transparent; border-color:var(--ink);
    color:var(--ink);
  }
  .btn-ghost:hover{ background:var(--ink); color:var(--stone); }
  .header-cta .btn-ghost{ border-color:var(--paper-line); color:var(--stone); }
  .header-cta .btn-ghost:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
  .btn-on-dark{
    background:var(--gold); color:var(--ink);
    box-shadow:3px 3px 0 rgba(217,189,124,0.35);
  }
  .btn-on-dark:hover{ transform:translate(-2px,-2px); box-shadow:5px 5px 0 rgba(217,189,124,0.35); }
  .btn-sm{ padding:10px 16px; font-size:13px; }
  .btn-block{ width:100%; }

  .hamburger{
    display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;
  }
  .hamburger span{ width:22px; height:2px; background:var(--stone); display:block; }

  /* ---------- Hero ---------- */
  .hero{
    position:relative;
    background:var(--ink);
    color:var(--stone);
    padding:76px 0 0;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(ellipse 900px 500px at 85% 15%, rgba(178,58,26,0.35), transparent 60%),
      radial-gradient(ellipse 700px 500px at 10% 90%, rgba(176,141,62,0.22), transparent 60%);
    pointer-events:none;
  }
  .hero-watermark{
    position:absolute; top:50%; right:-60px; transform:translateY(-50%);
    width:520px; max-width:45vw; opacity:0.07; pointer-events:none; z-index:0;
  }
  .hero-grid{
    position:relative; z-index:1;
    display:grid; grid-template-columns: 1.15fr 0.85fr; gap:56px;
    align-items:center;
    padding:56px 0 60px;
  }
  .hero h1{
    font-size:clamp(38px, 5.6vw, 68px);
    color:var(--stone);
  }
  .hero h1 em{
    font-style:normal; color:var(--gold-light);
  }
  .hero p.lede{
    font-size:17px; line-height:1.6; color:rgba(238,236,230,0.78);
    max-width:46ch; margin:22px 0 32px;
  }
  .hero-cta-row{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:38px;}
  .trust-row{
    display:flex; align-items:center; gap:22px; flex-wrap:wrap;
    font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:rgba(238,236,230,0.75);
    padding-top:24px; border-top:1px solid var(--paper-line);
  }
  .trust-row strong{ color:var(--gold-light); font-weight:600; }
  .stars{ color:var(--gold-light); letter-spacing:2px; }

  .hero-panel{
    position:relative; z-index:1;
    border:1px solid var(--paper-line);
    padding:26px;
    background:rgba(255,255,255,0.03);
  }
  .spec-card{
    display:flex; justify-content:space-between; align-items:baseline;
    padding:13px 0; border-bottom:1px dashed var(--paper-line);
    font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  }
  .spec-card:last-child{border-bottom:none;}
  .spec-card .k{ color:rgba(238,236,230,0.55); text-transform:uppercase; letter-spacing:0.08em; font-size:11px;}
  .spec-card .v{ color:var(--stone); font-weight:500; text-align:right;}
  .hero-panel-title{
    font-family:'Fraunces',serif; font-size:19px; margin-bottom:6px; color:var(--stone);
  }
  .hero-panel-sub{ font-size:12.5px; color:rgba(238,236,230,0.55); margin-bottom:18px;}
  .hero-quote{ padding:28px; }
  .hero-quote .field input, .hero-quote .field select{ padding:11px 12px; font-size:13.5px; }
  .hero-quote-note{
    margin-top:14px; font-size:12px; text-align:center; color:rgba(238,236,230,0.5);
  }
  .hero-quote-note a{ color:var(--gold-light); text-decoration:underline; text-underline-offset:2px; }
  .hero-quote .form-success{ padding:20px 4px; }
  .hero-quote .form-success .check{ font-size:24px; margin-bottom:10px; }

  /* ---------- Bridge / legacy section ---------- */
  .bridge{
    background:var(--stone); padding:78px 0;
    border-bottom:1px solid var(--stone-line);
  }
  .bridge-grid{ display:grid; grid-template-columns: 0.9fr 1.1fr; gap:60px; align-items:start;}
  .bridge h2{ font-size:clamp(28px,3.4vw,42px); margin-bottom:20px;}
  .bridge p{ font-size:16px; line-height:1.7; color:var(--ink-soft); max-width:52ch;}
  .timeline{
    display:flex; flex-direction:column; gap:0;
    border-left:1px solid var(--stone-line);
    padding-left:28px;
  }
  .tl-item{ position:relative; padding-bottom:34px;}
  .tl-item:last-child{padding-bottom:0;}
  .tl-item::before{
    content:""; position:absolute; left:-33px; top:4px;
    width:9px;height:9px;border-radius:50%;
    background:var(--sienna); border:2px solid var(--stone);
    outline:1px solid var(--sienna);
  }
  .tl-item.now::before{ background:var(--gold); outline-color:var(--gold);}
  .tl-eyebrow{ font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--sienna); margin-bottom:6px;}
  .tl-item.now .tl-eyebrow{color:var(--gold);}
  .tl-item h4{ font-size:19px; margin-bottom:6px;}
  .tl-item p{ font-size:14.5px; color:var(--ink-soft); margin:0; max-width:44ch; line-height:1.6;}

  /* ---------- Section shells ---------- */
  section{ position:relative; }
  .section-pad{ padding:84px 0; }
  .section-head{
    max-width:640px; margin-bottom:52px;
  }
  .section-head h2{ font-size:clamp(28px,3.6vw,44px); }
  .section-head p{ font-size:16px; color:var(--ink-soft); line-height:1.65; margin-top:14px;}
  .on-dark .section-head p{ color:rgba(238,236,230,0.72);}

  /* ---------- Services ---------- */
  .services{ background:var(--stone);}
  .service-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--stone-line); border:1px solid var(--stone-line);}
  .service-card{
    background:var(--stone); padding:34px 30px 30px;
    display:flex; flex-direction:column;
    transition: box-shadow .25s ease, transform .25s ease;
  }
  .service-card:hover{
    box-shadow: 0 2px 0 var(--stone-line), 0 6px 0 -2px var(--stone-line), 0 14px 24px -8px rgba(21,23,27,0.18);
    transform: translateY(-3px);
  }
  .layer-stack{ display:flex; flex-direction:column-reverse; gap:3px; width:34px; margin-bottom:18px; }
  .layer-stack span{ display:block; height:3px; background:var(--sienna); }
  .layer-stack span:nth-child(1){ opacity:0.35; width:60%; }
  .layer-stack span:nth-child(2){ opacity:0.55; width:75%; }
  .layer-stack span:nth-child(3){ opacity:0.8; width:90%; }
  .layer-stack span:nth-child(4){ opacity:1; width:100%; height:4px; }
  .service-num{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--sienna); margin-bottom:22px;}
  .service-card h3{ font-size:23px; margin-bottom:12px;}
  .service-card p{ font-size:14.5px; line-height:1.65; color:var(--ink-soft); margin-bottom:22px; flex-grow:1;}
  .service-list{ list-style:none; padding:0; margin:0 0 24px; font-size:13.5px; color:var(--ink-soft);}
  .service-list li{ padding:7px 0; border-top:1px dashed var(--stone-line); display:flex; gap:9px;}
  .service-list li::before{ content:"—"; color:var(--sienna); flex-shrink:0;}
  .service-card .btn{ align-self:flex-start;}

  .service-grid.five{ grid-template-columns:repeat(3,1fr); }
  .service-card.wide{ grid-column: span 2; }
  .service-card.wide .service-list, .service-card.wide p{ max-width:60ch; }
  @media (min-width:981px) and (max-width:1180px){ .service-grid.five{ grid-template-columns:repeat(2,1fr); } .service-card.wide{ grid-column: span 2; } }


  .process{ background:var(--ink); color:var(--stone);}
  .process-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:36px; margin-top:10px;}
  .process-step .step-no{
    font-family:'Fraunces',serif; font-size:15px; color:var(--gold-light);
    display:flex; align-items:center; gap:12px; margin-bottom:16px;
  }
  .process-step .step-no .line{ width:32px; height:1px; background:var(--paper-line);}
  .process-step h4{ font-size:19px; margin-bottom:10px; color:var(--stone);}
  .process-step p{ font-size:14px; color:rgba(238,236,230,0.68); line-height:1.6; margin:0;}

  /* ---------- Why trust bar ---------- */
  .why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--stone-line); border-top:1px solid var(--stone-line); border-bottom:1px solid var(--stone-line);}
  .why-card{ background:var(--stone); padding:30px 26px; text-align:left; position:relative; overflow:hidden; }
  .why-card::before{
    content:""; position:absolute; left:0; bottom:0; width:100%; height:3px;
    background:linear-gradient(to right, var(--sienna) 0%, var(--gold) 100%);
    transform:scaleX(0); transform-origin:left; transition:transform .35s ease;
  }
  .why-card:hover::before{ transform:scaleX(1); }
  .why-card .n{ font-family:'Fraunces',serif; font-size:34px; color:var(--sienna); margin-bottom:6px;}
  .why-card .l{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft);}


  /* ---------- Gallery ---------- */
  .gallery{ background:var(--stone-2);}
  .gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; gap:12px;}
  .gallery-tile{
    position:relative; overflow:hidden;
    display:flex; align-items:flex-end;
    padding:16px;
    color:var(--stone);
  }
  .gallery-tile span{
    font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:0.05em;
    background:rgba(21,23,27,0.55); padding:6px 10px; backdrop-filter:blur(3px);
  }
  .gallery-tile.tall{ grid-row: span 2; }
  .g1{ background:linear-gradient(135deg,#2a2d33,#15171b);}
  .g2{ background:linear-gradient(135deg,#b23a1a,#8c2c12);}
  .g3{ background:linear-gradient(135deg,#b08d3e,#8a6c2c);}
  .g4{ background:linear-gradient(135deg,#3a3d43,#1b1e22);}
  .g5{ background:linear-gradient(135deg,#8c2c12,#2a2d33);}
  .g6{ background:linear-gradient(135deg,#d9bd7c,#b08d3e);}
  .g7{ background:linear-gradient(135deg,#1b1e22,#b23a1a);}
  .g8{ background:linear-gradient(135deg,#6f5423,#d9bd7c);}

  /* ---------- Testimonials ---------- */
  .testimonials{ background:var(--stone);}
  .t-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  .t-card{ border:1px solid var(--stone-line); padding:28px; background:var(--stone-2);}
  .t-stars{ color:var(--sienna); letter-spacing:3px; font-size:14px; margin-bottom:16px;}
  .t-card p{ font-size:15px; line-height:1.65; color:var(--ink); margin:0 0 18px; font-family:'Fraunces',serif; font-weight:400;}
  .t-name{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.05em;}

  /* ---------- Service area ---------- */
  .area{ background:var(--ink); color:var(--stone);}
  .area-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
  .chip-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px;}
  .chip{
    font-family:'IBM Plex Mono',monospace; font-size:12.5px;
    border:1px solid var(--paper-line); padding:8px 14px;
    color:var(--stone);
  }


  /* ---------- Partnership ---------- */
  .partner{ background:var(--ink); color:var(--stone); }
  .partner-top{ max-width:680px; margin-bottom:56px; }
  .partner-pair{
    display:grid; grid-template-columns:1fr auto 1fr;
    align-items:center; gap:0;
    border:1px solid var(--paper-line);
  }
  .partner-brand{ padding:38px 34px; }
  .partner-brand.right{ border-left:1px solid var(--paper-line); }
  .partner-x{
    font-family:'Fraunces',serif; font-size:22px; color:var(--gold-light);
    width:60px; text-align:center; align-self:stretch;
    display:flex; align-items:center; justify-content:center;
    border-left:1px solid var(--paper-line); border-right:1px solid var(--paper-line);
    background:rgba(176,141,62,0.08);
  }
  .partner-mark{ font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold-light); margin-bottom:10px; }
  .partner-brand h3{ font-size:24px; color:var(--stone); margin-bottom:12px; }
  .partner-brand p{ font-size:14.5px; line-height:1.65; color:rgba(238,236,230,0.72); margin:0 0 16px; }
  .partner-brand ul{ list-style:none; padding:0; margin:0; font-size:13.5px; color:rgba(238,236,230,0.65); }
  .partner-brand ul li{ padding:6px 0; display:flex; gap:8px; }
  .partner-brand ul li::before{ content:"—"; color:var(--gold-light); flex-shrink:0; }
  .partner-note{
    display:flex; align-items:center; gap:24px; flex-wrap:wrap;
    margin-top:32px; padding-top:28px; border-top:1px solid var(--paper-line);
    font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:rgba(238,236,230,0.6);
  }
  .partner-note strong{ color:var(--gold-light); }
  @media (max-width:820px){
    .partner-pair{ grid-template-columns:1fr; }
    .partner-x{ border:none; border-top:1px solid var(--paper-line); border-bottom:1px solid var(--paper-line); padding:10px 0; width:100%; }
    .partner-brand.right{ border-left:none; }
  }


  .faq{ background:var(--stone);}
  .faq-list{ max-width:760px; }
  .faq-item{ border-bottom:1px solid var(--stone-line); }
  .faq-q{
    width:100%; text-align:left; background:none; border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 4px; font-family:'Fraunces',serif; font-size:17px; color:var(--ink);
  }
  .faq-q .plus{ font-family:'IBM Plex Mono',monospace; font-size:18px; color:var(--sienna); transition:transform .2s ease;}
  .faq-item.open .plus{ transform:rotate(45deg);}
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .25s ease;}
  .faq-a p{ padding:0 4px 22px; font-size:14.5px; line-height:1.65; color:var(--ink-soft); margin:0; max-width:62ch;}

  /* ---------- Contact / form ---------- */
  .contact{ background:var(--stone-2); }
  .contact-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:52px; align-items:start;}
  .contact-info h2{ font-size:clamp(26px,3.2vw,36px); margin-bottom:16px;}
  .contact-info p{ font-size:15px; line-height:1.7; color:var(--ink-soft); margin-bottom:26px; max-width:44ch;}
  .info-line{ display:flex; gap:14px; padding:16px 0; border-top:1px solid var(--stone-line); }
  .info-line:last-child{border-bottom:1px solid var(--stone-line);}
  .info-line .lab{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--sienna); width:100px; flex-shrink:0; padding-top:2px;}
  .info-line .val{ font-size:14.5px; color:var(--ink); line-height:1.6;}
  .info-line .val a{ text-decoration:underline; text-underline-offset:3px; }
  .badge-soon{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; background:var(--gold); color:var(--ink); padding:3px 8px; margin-left:8px; vertical-align:middle;}

  .form-panel{ background:var(--ink); color:var(--stone); padding:38px; border:1px solid var(--ink);}
  .form-panel h3{ font-size:22px; margin-bottom:6px; color:var(--stone);}
  .form-panel .sub{ font-size:13.5px; color:rgba(238,236,230,0.6); margin-bottom:26px;}
  .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
  .field{ display:flex; flex-direction:column; gap:7px;}
  .field.full{ grid-column:1 / -1; }
  .field label{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:rgba(238,236,230,0.6);}
  .field input, .field select, .field textarea{
    background:rgba(255,255,255,0.04); border:1px solid var(--paper-line);
    color:var(--stone); font-family:'Inter',sans-serif; font-size:14px;
    padding:12px 13px; border-radius:var(--radius); outline:none;
  }
  .field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--gold-light); }
  .field textarea{ resize:vertical; min-height:90px;}
  .form-note{ font-size:12px; color:rgba(238,236,230,0.5); margin-top:14px; line-height:1.6;}
  .form-success{ display:none; text-align:center; padding:40px 10px;}
  .form-success.show{ display:block; }
  .form-success .check{ font-size:32px; color:var(--gold-light); margin-bottom:14px; font-family:'Fraunces',serif;}

  /* ---------- CTA band ---------- */
  .cta-band{ background:var(--ink); color:var(--stone); padding:76px 0; text-align:center; }
  .cta-band h2{ font-size:clamp(26px,3.4vw,40px); margin-bottom:16px; }
  .cta-band p{ font-size:15.5px; color:rgba(238,236,230,0.72); max-width:52ch; margin:0 auto 30px; }
  .cta-band .cta-row{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

  .cta-form-panel{
    max-width:520px; margin:0 auto; text-align:left;
    border:1px solid var(--paper-line); background:rgba(255,255,255,0.03);
    padding:30px;
  }
  .cta-form-panel .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
  .cta-form-panel .field.full{ grid-column:1 / -1; }
  .cta-form-panel .form-success{ padding:24px 4px; }
  .cta-form-panel .form-success .check{ font-size:26px; margin-bottom:10px; }
  @media (max-width:560px){
    .cta-form-panel .form-row{ grid-template-columns:1fr; }
    .cta-form-panel{ padding:24px; }
  }

  /* ---------- Footer ---------- */
  footer{ background:var(--ink); color:rgba(238,236,230,0.65); padding:60px 0 30px;}
  .footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; margin-bottom:50px;}
  .footer-logo{ font-family:'Fraunces',serif; font-weight:700; font-size:20px; color:var(--stone); margin-bottom:14px;}
  .footer-grid p{ font-size:13.5px; line-height:1.7; max-width:32ch;}
  .footer-col h5{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--gold-light); margin-bottom:16px;}
  .footer-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px;}
  .footer-col a{ font-size:13.5px; }
  .footer-col a:hover{ color:var(--stone); }
  .footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid var(--paper-line); font-size:12.5px; flex-wrap:wrap; gap:14px;}
  .socials{ display:flex; gap:16px;}

  /* ---------- Mobile sticky CTA ---------- */
  .mobile-cta{
    display:none; position:fixed; bottom:0; left:0; right:0; z-index:60;
    background:var(--ink); padding:12px 16px; border-top:1px solid var(--paper-line);
  }

  /* ================= RESPONSIVE ================= */
  /* Nav/chrome switches to mobile pattern at 980px — dropdown nav needs the room */
  @media (max-width: 980px){
    nav.primary-nav{ display:none; }
    .header-cta .btn-ghost{ display:none; }
    .hamburger{ display:flex; }
    .hero-grid{ grid-template-columns:1fr; gap:40px; padding:36px 0 48px;}
    .bridge-grid{ grid-template-columns:1fr; gap:36px;}
    .process-grid{ grid-template-columns:1fr 1fr; gap:30px;}
    .why-grid{ grid-template-columns:1fr 1fr;}
    .gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px;}
    .t-grid{ gap:20px;}
    .area-grid{ grid-template-columns:1fr; gap:30px;}
    .contact-grid{ grid-template-columns:1fr; gap:36px;}
    .form-row{ grid-template-columns:1fr;}
    .footer-grid{ grid-template-columns:1fr 1fr; gap:32px;}
    .mobile-cta{ display:block; }
    body{ padding-bottom:74px; }
    .section-pad{ padding:60px 0; }
  }

  /* Tablet tier (641px–980px): grids that would otherwise be empty or cramped
     as a single wide column show two columns instead. */
  @media (max-width:980px) and (min-width:641px){
    .service-grid{ grid-template-columns:repeat(2,1fr); }
    .service-grid.five{ grid-template-columns:repeat(2,1fr); }
    .service-card.wide{ grid-column: span 2; }
    .t-grid{ grid-template-columns:repeat(2,1fr); }
    .compare-strip{ grid-template-columns:repeat(2,1fr); }
    .compare-strip .compare-card:last-child:nth-child(odd){ grid-column: span 2; }
  }

  /* Phone tier: everything drops to a single column */
  @media (max-width:640px){
    .service-grid{ grid-template-columns:1fr; }
    .service-grid.five{ grid-template-columns:1fr; }
    .service-card.wide{ grid-column: span 1; }
    .t-grid{ grid-template-columns:1fr; }
    .compare-strip{ grid-template-columns:1fr; }
  }

  @media (max-width:560px){
    .process-grid{ grid-template-columns:1fr;}
    .why-grid{ grid-template-columns:1fr;}
    .footer-grid{ grid-template-columns:1fr;}
    .wrap{ padding:0 18px; }
  }

  /* Mobile nav drawer */
  .mobile-drawer{
    position:fixed; inset:0; background:var(--ink); z-index:70;
    display:flex; flex-direction:column; padding:24px;
    transform:translateX(100%); transition:transform .25s ease;
  }
  .mobile-drawer.open{ transform:translateX(0); }
  .mobile-drawer .drawer-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:40px;}
  .mobile-drawer a{ font-family:'Fraunces',serif; font-size:26px; color:var(--stone); padding:16px 0; border-bottom:1px solid var(--paper-line);}
  .close-drawer{ background:none; border:none; color:var(--stone); font-size:28px; cursor:pointer;}

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ transition:none !important; }
  }
