:root {
      color-scheme: light dark;
      --paper: #f7f4ed;
      --ink: #182b25;
      --muted: #53645d;
      --panel: #ece8dd;
      --panel-2: #dfdbd0;
      --line: #c9c5ba;
      --accent: #9c4d36;
      --accent-ink: #fffaf4;
      --forest: #203c33;
      --gold: #b58b4b;
      --shadow: 0 24px 55px rgba(29, 38, 33, .14);
      --max: 1180px;
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --paper: #131a17;
        --ink: #f3f0e8;
        --muted: #b7c0ba;
        --panel: #1c2722;
        --panel-2: #26332d;
        --line: #405048;
        --accent: #cf765b;
        --accent-ink: #160e0b;
        --forest: #d6e4dc;
        --gold: #d6ad69;
        --shadow: 0 24px 55px rgba(0, 0, 0, .3);
      }
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      overflow-x: hidden;
      background: var(--paper);
      color: var(--ink);
      font-family: "Libre Franklin", ui-sans-serif, system-ui, sans-serif;
      line-height: 1.6;
      text-rendering: optimizeLegibility;
    }
    img { display: block; max-width: 100%; }
    a { color: inherit; }
    a:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
    .wrap { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; }
    .site-nav {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 24px;
      min-height: 92px;
      font-size: .86rem;
      font-weight: 600;
      border-bottom: 1px solid var(--line);
    }
    .site-nav a { text-decoration: none; }
    .site-nav a:not(.nav-cta):hover { color: var(--accent); }
    .brand {
      margin-right: auto;
      flex: 0 0 auto;
      display: block;
      padding: 6px;
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 8px;
      box-shadow: 0 5px 16px rgba(29, 38, 33, .13);
    }
    .brand img { width: 86px; height: auto; }
    .nav-contact {
      display: grid;
      justify-items: center;
      gap: 3px;
    }
    .nav-cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 0 18px;
      border: 0;
      background: var(--ink);
      color: var(--paper);
      border-radius: 4px;
      font: inherit;
      cursor: pointer;
    }
    .hero {
      display: grid;
      grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
      gap: clamp(38px, 7vw, 100px);
      align-items: center;
      min-height: 700px;
      padding-block: 66px 92px;
    }
    .hero-copy { position: relative; z-index: 2; }
    .eyebrow {
      margin: 0 0 22px;
      color: var(--accent);
      font-size: .76rem;
      font-weight: 700;
      letter-spacing: .13em;
      text-transform: uppercase;
    }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, .serif { font-family: "Lora", Georgia, serif; }
    h1 {
      margin-bottom: 24px;
      font-size: clamp(3.25rem, 6vw, 5.7rem);
      line-height: .99;
      letter-spacing: -.055em;
      font-weight: 600;
    }
    .hero-lede {
      max-width: 570px;
      margin-bottom: 32px;
      color: var(--muted);
      font-size: clamp(1.05rem, 1.7vw, 1.25rem);
      line-height: 1.65;
    }
    .actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
    .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 50px;
      padding: 0 22px;
      border: 1px solid var(--ink);
      border-radius: 4px;
      font-size: .9rem;
      font-weight: 700;
      text-decoration: none;
      transition: background-color .2s ease, color .2s ease;
    }
    .button.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
    .button.primary:hover { background: var(--ink); border-color: var(--ink); color: var(--paper); }
    .button.secondary:hover { background: var(--ink); color: var(--paper); }
    .hero-art {
      position: relative;
      min-height: 590px;
    }
    .hero-main {
      position: absolute;
      inset: 0 9% 0 7%;
      width: 84%;
      height: 100%;
      object-fit: cover;
      object-position: 50% 44%;
      box-shadow: var(--shadow);
    }
    .hero-inset {
      position: absolute;
      width: 36%;
      right: 0;
      bottom: -28px;
      border: 10px solid var(--paper);
      box-shadow: 0 16px 40px rgba(25, 34, 30, .18);
      aspect-ratio: 4 / 5;
      object-fit: cover;
      object-position: center 43%;
    }
    .hero-note {
      position: absolute;
      left: 0;
      top: 42px;
      width: 155px;
      padding: 17px 16px;
      background: var(--paper);
      border-top: 3px solid var(--accent);
      box-shadow: 0 10px 30px rgba(25, 34, 30, .1);
      color: var(--muted);
      font-size: .74rem;
      line-height: 1.5;
    }
    .hero-note strong { display: block; color: var(--ink); font-size: 1rem; }
    .rule { border: 0; border-top: 1px solid var(--line); margin: 0; }
    .intro {
      display: grid;
      grid-template-columns: .72fr 1.28fr;
      gap: clamp(40px, 8vw, 120px);
      padding-block: 100px;
    }
    .section-num { color: var(--accent); font-size: .8rem; font-weight: 700; }
    h2 {
      margin-bottom: 26px;
      font-size: clamp(2.2rem, 4.2vw, 4rem);
      line-height: 1.08;
      letter-spacing: -.035em;
      font-weight: 600;
    }
    .intro-copy > p { max-width: 720px; color: var(--muted); font-size: 1.08rem; }
    .process {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 0;
      margin-top: 48px;
      border-block: 1px solid var(--line);
    }
    .process span {
      position: relative;
      padding: 22px 10px 22px 25px;
      font-size: .8rem;
      font-weight: 700;
    }
    .process span:not(:last-child)::after {
      content: "";
      position: absolute;
      right: 0;
      top: 19px;
      width: 1px;
      height: calc(100% - 38px);
      background: var(--line);
    }
    .portfolio { background: var(--ink); color: var(--paper); padding-block: 100px; }
    @media (prefers-color-scheme: dark) {
      .portfolio { background: #e9e5dc; color: #1a2a24; }
    }
    .portfolio-head {
      display: flex;
      justify-content: space-between;
      align-items: end;
      gap: 28px;
      margin-bottom: 42px;
    }
    .portfolio-head h2 { max-width: 680px; margin-bottom: 0; }
    .portfolio-head p { max-width: 350px; margin-bottom: 6px; color: color-mix(in srgb, currentColor 72%, transparent); }
    .gallery {
      display: grid;
      grid-template-columns: 1.15fr .85fr .85fr;
      grid-template-rows: 330px 330px;
      grid-auto-rows: 300px;
      gap: 14px;
    }
    .gallery figure { position: relative; margin: 0; min-width: 0; overflow: hidden; background: #cfcac0; }
    .gallery figure:first-child { grid-row: 1 / 3; }
    .gallery figure:nth-child(2) { grid-column: 2 / 4; }
    .gallery figure:nth-child(3) { grid-column: 2; }
    .gallery figure:nth-child(4) { grid-column: 3; }
    .gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
    .gallery figure:first-child img { object-position: 50% 42%; }
    .gallery figure:nth-child(2) img { object-position: 50% 44%; }
    .gallery figure:nth-child(3) img { object-position: 50% 37%; }
    .gallery figure:nth-child(4) img { object-position: 50% 32%; }
    .gallery figure:hover img { transform: scale(1.018); }
    .gallery figcaption {
      position: absolute;
      left: 13px;
      bottom: 13px;
      padding: 7px 10px;
      background: rgba(18, 28, 24, .86);
      color: #fff;
      font-size: .72rem;
      font-weight: 600;
    }

    .inventory { padding-block: 110px; background: var(--panel); }
    .inventory-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
      gap: 36px;
      align-items: end;
      margin-bottom: 46px;
    }
    .inventory-head h2 { margin-bottom: 0; }
    .inventory-overview { display: grid; gap: 18px; }
    .inventory-intro { margin-bottom: 0; color: var(--muted); font-size: 1rem; }
    .delivery-badge {
      display: flex;
      align-items: center;
      gap: 16px;
      width: 100%;
      padding: 16px 18px;
      background: var(--accent);
      color: var(--accent-ink);
      box-shadow: 6px 6px 0 color-mix(in srgb, var(--gold) 72%, transparent);
    }
    .delivery-badge svg {
      flex: 0 0 52px;
      width: 52px;
      height: 52px;
      stroke: currentColor;
    }
    .delivery-badge strong {
      display: block;
      font-family: "Lora", Georgia, serif;
      font-size: 1.35rem;
      line-height: 1.05;
    }
    .delivery-badge span {
      display: block;
      margin-top: 5px;
      font-size: .76rem;
      font-weight: 600;
    }
    .inventory-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
    }
    .inventory-card {
      display: flex;
      flex-direction: column;
      min-width: 0;
      padding: 28px;
      background: var(--paper);
      border-top: 3px solid var(--accent);
      box-shadow: 0 8px 22px rgba(29, 38, 33, .07);
    }
    .inventory-card-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 18px;
      align-items: start;
      margin-bottom: 15px;
    }
    .inventory-media {
      position: relative;
      margin: 0 0 24px;
      overflow: hidden;
      background: var(--panel-2);
    }
    .inventory-media > img,
    .inventory-gallery-stage img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }
    .inventory-gallery-stage {
      position: relative;
      overflow: hidden;
      cursor: zoom-in;
    }
    .inventory-gallery-stage img {
      transition: opacity .16s ease;
    }
    .inventory-gallery-stage:focus-visible {
      outline: 3px solid var(--gold);
      outline-offset: -3px;
    }
    .gallery-arrow {
      position: absolute;
      z-index: 2;
      top: 50%;
      width: 38px;
      height: 44px;
      padding: 0;
      border: 0;
      background: rgba(18, 28, 24, .82);
      color: #fff;
      font: 700 1.45rem/1 Georgia, serif;
      cursor: pointer;
      transform: translateY(-50%);
    }
    .gallery-arrow:hover { background: var(--accent); }
    .gallery-arrow:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
    .gallery-arrow.prev { left: 10px; }
    .gallery-arrow.next { right: 10px; }
    .gallery-dots {
      position: absolute;
      z-index: 2;
      left: 50%;
      bottom: 10px;
      display: flex;
      justify-content: center;
      gap: 7px;
      padding: 7px 9px;
      background: rgba(18, 28, 24, .78);
      border-radius: 999px;
      transform: translateX(-50%);
    }
    .gallery-dot {
      width: 8px;
      height: 8px;
      padding: 0;
      border: 1px solid #fff;
      border-radius: 50%;
      background: transparent;
      cursor: pointer;
    }
    .gallery-dot[aria-current="true"] { background: #fff; }
    .gallery-count {
      position: absolute;
      z-index: 2;
      top: 10px;
      right: 10px;
      padding: 4px 8px;
      background: rgba(18, 28, 24, .78);
      color: #fff;
      font-size: .68rem;
      font-weight: 700;
    }
    .lightbox {
      position: fixed;
      z-index: 1000;
      inset: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      width: 100%;
      max-width: 100vw;
      overflow: hidden;
      padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
      background: rgba(8, 12, 10, .96);
      color: #fff;
    }
    .lightbox[hidden] { display: none; }
    .lightbox-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      width: 100%;
      min-width: 0;
      min-height: 48px;
      padding-bottom: 10px;
    }
    .lightbox-title {
      min-width: 0;
      overflow: hidden;
      margin: 0;
      font-family: "Libre Franklin", ui-sans-serif, system-ui, sans-serif;
      font-size: .82rem;
      font-weight: 600;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .lightbox-close {
      flex: 0 0 auto;
      width: 42px;
      height: 42px;
      padding: 0;
      border: 1px solid rgba(255,255,255,.6);
      background: transparent;
      color: #fff;
      font: 400 1.8rem/1 sans-serif;
      cursor: pointer;
    }
    .lightbox-stage {
      position: relative;
      display: grid;
      place-items: center;
      width: 100%;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      touch-action: pan-y;
    }
    .lightbox-image {
      display: block;
      width: auto;
      max-width: min(1100px, 100%);
      height: auto;
      max-height: calc(100vh - 150px);
      object-fit: contain;
      user-select: none;
    }
    .lightbox .gallery-arrow.prev { left: 2px; }
    .lightbox .gallery-arrow.next { right: 2px; }
    .lightbox-dots {
      display: flex;
      justify-content: center;
      gap: 9px;
      min-height: 42px;
      padding-top: 16px;
    }
    .lightbox-dots .gallery-dot { width: 10px; height: 10px; }
    .lightbox-dots[hidden],
    .lightbox .gallery-arrow[hidden] { display: none; }
    body.lightbox-open { overflow: hidden; }
    .inventory-card h3 {
      margin: 0;
      font-family: "Lora", Georgia, serif;
      font-size: 1.18rem;
      line-height: 1.3;
    }
    .inventory-price {
      margin: 1px 0 0;
      color: var(--accent);
      font-family: "Lora", Georgia, serif;
      font-size: 1.22rem;
      font-weight: 600;
      white-space: nowrap;
    }
    .inventory-blurb {
      margin: 0 0 24px;
      color: var(--muted);
      font-size: .88rem;
      line-height: 1.65;
    }
    .inventory-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 9px;
      margin-top: auto;
    }
    .inventory-actions .button {
      min-height: 44px;
      padding-inline: 12px;
      font-size: .76rem;
      text-align: center;
    }
    .inventory-actions .text-button {
      border-color: var(--accent);
      background: var(--accent);
      color: var(--accent-ink);
    }
    .inventory-actions .text-button:hover {
      border-color: var(--ink);
      background: var(--ink);
      color: var(--paper);
    }
    .contact-copy {
      font-family: inherit;
      cursor: pointer;
    }
    .contact-number {
      color: var(--muted);
      font-size: .7rem;
      line-height: 1.35;
      text-align: center;
    }
    .inventory-actions .contact-number { grid-column: 2; }
    .final .contact-number { color: color-mix(in srgb, currentColor 78%, transparent); }
    .services { padding-block: 110px; }
    .services-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: clamp(36px, 7vw, 100px);
      align-items: start;
    }
    .service-copy { position: sticky; top: 30px; }
    .service-copy p { max-width: 540px; color: var(--muted); font-size: 1.06rem; }
    .service-detail { border-top: 1px solid var(--line); }
    .detail {
      display: grid;
      grid-template-columns: 50px 1fr;
      gap: 18px;
      padding: 30px 0;
      border-bottom: 1px solid var(--line);
    }
    .detail-index { color: var(--accent); font-weight: 700; }
    .detail h3 { margin-bottom: 7px; font-size: 1.05rem; }
    .detail p { margin: 0; color: var(--muted); font-size: .94rem; }
    .colors { margin-top: 38px; padding: 28px; background: var(--panel); }
    .colors h3 { margin-bottom: 18px; font-size: .92rem; }
    .swatches { display: flex; flex-wrap: wrap; gap: 10px 18px; }
    .swatch { display: inline-flex; align-items: center; gap: 8px; font-size: .77rem; font-weight: 600; }
    .dot { width: 15px; height: 15px; border-radius: 50%; border: 1px solid rgba(40,40,40,.25); }
    .location { padding-block: 100px; background: var(--panel); }
    .location-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 90px); align-items: center; }
    .map-frame { padding: 14px; background: #fff; box-shadow: var(--shadow); transform: rotate(-.6deg); }
    .location-copy p { color: var(--muted); }
    .address {
      margin: 30px 0;
      padding-block: 22px;
      border-block: 1px solid var(--line);
      font-size: 1rem;
    }
    .address strong { display: block; color: var(--ink); margin-bottom: 4px; }
    .facts { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 32px; }
    .fact strong { display: block; color: var(--accent); font-family: "Lora", Georgia, serif; font-size: 1.55rem; }
    .fact span { color: var(--muted); font-size: .8rem; }
    .final { padding-block: 105px; }
    .final-inner {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 40px;
      align-items: center;
      padding: 56px;
      background: var(--forest);
      color: var(--paper);
    }
    @media (prefers-color-scheme: dark) {
      .final-inner { background: #d8e1dc; color: #14251f; }
    }
    .final h2 { max-width: 770px; margin: 0; }
    .final p { margin: 14px 0 0; color: color-mix(in srgb, currentColor 75%, transparent); }
    .final-actions {
      display: grid;
      gap: 10px;
      min-width: 250px;
    }
    .final .button { border-color: currentColor; }
    .final .button:hover { background: currentColor; color: var(--forest); }
    footer {
      display: flex;
      justify-content: space-between;
      gap: 30px;
      padding-block: 30px 50px;
      color: var(--muted);
      border-top: 1px solid var(--line);
      font-size: .76rem;
    }
    footer a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
    @media (max-width: 900px) {
      .hero { grid-template-columns: 1fr; min-height: 0; padding-top: 48px; }
      .hero-copy { max-width: 680px; }
      .hero-art { min-height: 600px; }
      .intro { grid-template-columns: 1fr; gap: 24px; }
      .process { grid-template-columns: repeat(3, 1fr); }
      .process span:nth-child(3)::after { display: none; }
      .process span:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
      .inventory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .services-grid, .location-grid { grid-template-columns: 1fr; }
      .service-copy { position: static; }
      .portfolio-head { align-items: start; flex-direction: column; }
      .final-inner { grid-template-columns: 1fr; padding: 42px; }
    }
    @media (max-width: 680px) {
      .wrap { width: min(100% - 28px, var(--max)); }
      .site-nav { justify-content: space-between; gap: 12px; min-height: 74px; overflow: hidden; }
      .site-nav > a:not(.brand):not(.nav-cta) { display: none; }
      .brand { padding: 5px; }
      .brand img { width: 70px; }
      .site-nav .nav-contact { margin-left: auto; max-width: 230px; }
      .site-nav .nav-cta { min-height: 38px; padding: 7px 11px; font-size: .72rem; line-height: 1.25; }
      .site-nav .contact-number { font-size: .64rem; }
      .hero { gap: 42px; padding-block: 42px 70px; }
      h1 { font-size: clamp(3rem, 16vw, 4.5rem); }
      .hero-art { min-height: 470px; margin-inline: -14px; }
      .hero-main { inset: 0 4% 0 0; width: 91%; }
      .hero-note { left: 10px; top: 24px; width: 135px; }
      .hero-inset { width: 42%; right: 0; bottom: -22px; border-width: 7px; }
      .actions { align-items: stretch; }
      .button { flex: 1 1 100%; }
      .intro, .inventory, .services, .location, .final { padding-block: 74px; }
      .inventory-head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 34px; }
      .inventory-grid { grid-template-columns: 1fr; }
      .inventory-card { padding: 24px 20px; }
      .gallery-arrow { width: 42px; height: 48px; }
      .lightbox { padding-inline: 8px; }
      .lightbox-image { max-width: 100%; max-height: calc(100vh - 160px); }
      .lightbox .gallery-arrow { top: auto; bottom: 8px; transform: none; }
      .inventory-actions { grid-template-columns: 1fr; }
      .inventory-actions .contact-number { grid-column: 1; }
      .process { grid-template-columns: repeat(2, 1fr); }
      .process span { padding-left: 16px; }
      .process span:nth-child(3)::after { display: block; }
      .process span:nth-child(2n)::after { display: none; }
      .process span:nth-child(4) { border-bottom: 1px solid var(--line); }
      .gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 430px 240px 240px; grid-auto-rows: 240px; }
      .gallery figure:first-child { grid-column: 1 / 3; grid-row: 1; }
      .gallery figure:nth-child(2) { grid-column: 1 / 3; grid-row: 2; }
      .gallery figure:nth-child(3) { grid-column: 1; grid-row: 3; }
      .gallery figure:nth-child(4) { grid-column: 2; grid-row: 3; }
      .gallery figcaption { font-size: .66rem; }
      .colors { margin-inline: -14px; padding: 24px 18px; }
      .location-grid { gap: 48px; }
      .map-frame { padding: 8px; }
      .facts { grid-template-columns: 1fr; }
      .final-inner { margin-inline: -14px; padding: 38px 26px; }
      footer { flex-direction: column; gap: 10px; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition: none !important; }
    }