:root {
      --black:      #1C1814;      /* warm deep espresso       */
      --white:      #FAF7F2;      /* warm linen               */
      --gold:       #B5634A;      /* terracotta / clay        */
      --gold-light: #F5EAE2;      /* warm blush tint          */
      --gold-mid:   #C9A27E;      /* muted warm brass         */
      --gray:       #7A6E65;      /* warm medium gray         */
      --border:     #E2D7CE;      /* warm border              */
      --card:       #FAF5F0;      /* warm cream card          */
    }

    *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

    html { scroll-behavior: smooth; }

    body {
      font-family: 'DM Sans', sans-serif;
      background: var(--white);
      color: var(--black);
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }

    /* ─── NAV ─────────────────────────────────── */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 100;
      height: 68px;
      padding: 0 52px;
      display: flex; align-items: center; justify-content: space-between;
      background: rgba(250,247,242,0.94);
      backdrop-filter: blur(16px);
      border-bottom: 1px solid var(--border);
    }
    .logo {
      font-family: 'DM Serif Display', serif;
      font-size: 18px; letter-spacing: 0.01em;
      color: var(--black); text-decoration: none;
    }
    .logo-dot { color: var(--gold); }
    .nav-right { display: flex; align-items: center; gap: 32px; }
    .nav-link {
      font-size: 13px; color: var(--gray); text-decoration: none;
      letter-spacing: 0.04em; transition: color 0.2s;
    }
    .nav-link:hover { color: var(--black); }
    .btn-nav {
      background: var(--black); color: var(--white);
      border: none; padding: 10px 22px;
      font-family: 'DM Sans', sans-serif; font-size: 12px;
      font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
      cursor: pointer; transition: background 0.2s; text-decoration: none;
    }
    .btn-nav:hover { background: var(--gold); }

    /* ─── HERO ────────────────────────────────── */
    .hero {
      margin-top: 68px;
      min-height: calc(100vh - 68px);
      display: grid; grid-template-columns: 55% 45%;
    }
    .hero-left {
      display: flex; flex-direction: column; justify-content: center;
      padding: 80px 64px 80px 52px;
    }
    .eyebrow {
      font-size: 10.5px; font-weight: 600;
      letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 28px;
      display: flex; align-items: center; gap: 12px;
    }
    .eyebrow::before {
      content: ''; display: block;
      width: 28px; height: 1px; background: var(--gold);
    }
    h1 {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(50px, 5.5vw, 78px);
      line-height: 1.03; letter-spacing: -0.01em;
      color: var(--black); margin-bottom: 6px;
    }
    h1 em { font-style: italic; color: var(--gold); }
    .hero-sub {
      font-size: 16px; color: var(--gray);
      font-weight: 300; line-height: 1.75;
      max-width: 440px; margin-top: 28px;
    }
    .hero-actions {
      display: flex; align-items: center; gap: 28px;
      margin-top: 44px;
    }
    .btn-primary {
      background: var(--black); color: var(--white);
      border: none; padding: 17px 38px;
      font-family: 'DM Sans', sans-serif; font-size: 12px;
      font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
      cursor: pointer; display: inline-flex; align-items: center; gap: 10px;
      transition: background 0.22s, transform 0.18s; text-decoration: none;
    }
    .btn-primary:hover { background: var(--gold); transform: translateY(-1px); }
    .btn-primary svg { transition: transform 0.18s; }
    .btn-primary:hover svg { transform: translateX(4px); }
    .hero-note { font-size: 13px; color: var(--gray); letter-spacing: 0.02em; }

    /* Hero right — dark panel */
    .hero-right {
      background: var(--black);
      position: relative; overflow: hidden;
      display: flex; align-items: flex-end;
    }
    .hero-canvas {
      position: absolute; inset: 0;
    }
    /* Abstract gold lines */
    .hero-line {
      position: absolute; background: var(--gold); opacity: 0.12;
    }
    /* Furniture SVG art */
    .hero-art-svg {
      position: absolute; inset: 0; width: 100%; height: 100%;
    }
    .hero-stats {
      position: relative; z-index: 2;
      padding: 52px; width: 100%;
    }
    .stat { margin-bottom: 8px; }
    .stat + .stat { margin-top: 28px; }
    .stat-num {
      font-family: 'DM Serif Display', serif;
      font-size: 52px; line-height: 1; color: var(--white);
    }
    .stat-label {
      font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
      color: rgba(255,255,255,0.38); margin-top: 4px;
    }
    .stat-rule { width: 36px; height: 1px; background: var(--gold); opacity: 0.5; margin: 24px 0; }

    /* ─── SECTION COMMONS ─────────────────────── */
    section { padding: 88px 52px; }
    .sec-header { margin-bottom: 52px; }
    .sec-label {
      font-size: 10.5px; font-weight: 600;
      letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 12px;
      display: flex; align-items: center; gap: 12px;
    }
    .sec-label::before { content: ''; width: 20px; height: 1px; background: var(--gold); display: block; }
    .sec-title {
      font-family: 'DM Serif Display', serif;
      font-size: 36px; color: var(--black);
    }

    /* ─── PROCESS ─────────────────────────────── */
    .process { border-top: 1px solid var(--border); }
    .process-grid {
      display: grid; grid-template-columns: repeat(5, 1fr);
    }
    .process-step {
      padding: 36px 28px;
      border-left: 1px solid var(--border);
      transition: background 0.2s;
    }
    .process-step:first-child { border-left: none; padding-left: 0; }
    .process-step:hover { background: var(--gold-light); }
    .step-num {
      font-family: 'DM Serif Display', serif;
      font-size: 42px; color: var(--gold); opacity: 0.6;
      line-height: 1; margin-bottom: 18px;
    }
    .step-title { font-size: 14px; font-weight: 600; margin-bottom: 10px; color: var(--black); }
    .process-step .step-desc { font-size: 13px; color: #1C1814; line-height: 1.65; font-weight: 400; }

    /* ─── CATEGORIES ──────────────────────────── */
    .categories-wrap {
      background: var(--black); color: var(--white);
    }
    .categories-wrap .sec-label { color: var(--gold-mid); }
    .categories-wrap .sec-label::before { background: var(--gold-mid); }
    .categories-wrap .sec-title { color: var(--white); }
    .cat-grid {
      display: grid; grid-template-columns: repeat(4, 1fr);
      gap: 1px; background: rgba(255,255,255,0.07);
    }
    .cat-card {
      background: var(--black); padding: 36px 30px;
      transition: background 0.2s;
    }
    .cat-card:hover { background: #1A1510; }
    .cat-icon { color: var(--gold); margin-bottom: 20px; }
    .cat-name { font-size: 15px; font-weight: 500; color: var(--white); margin-bottom: 8px; }
    .cat-items { font-size: 12.5px; color: rgba(255,255,255,0.38); line-height: 1.65; }

    /* ─── TIMELINE ────────────────────────────── */
    .timeline-wrap { border-top: 1px solid var(--border); }
    .timeline-track {
      display: flex; position: relative; margin-top: 52px;
    }
    .tl-item { flex: 1; padding-right: 36px; position: relative; }
    .tl-dot {
      width: 10px; height: 10px; border-radius: 50%;
      background: var(--gold); margin-bottom: 20px;
    }
    .tl-line {
      position: absolute; top: 4px; left: 10px; right: 0;
      height: 1px; background: var(--border);
    }
    .tl-item:last-child .tl-line { display: none; }
    .tl-week {
      font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 8px; font-weight: 500;
    }
    .tl-phase { font-size: 14px; font-weight: 600; margin-bottom: 6px; }
    .tl-detail { font-size: 13px; color: var(--gray); line-height: 1.6; font-weight: 300; }

    /* ─── TRUST STRIP ─────────────────────────── */
    .trust-strip {
      border-top: 1px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      gap: 64px; padding: 40px 52px;
    }
    .trust-item { text-align: center; }
    .trust-num {
      font-family: 'DM Serif Display', serif;
      font-size: 32px; color: var(--black);
    }
    .trust-lbl { font-size: 11.5px; color: var(--gray); margin-top: 4px; }
    .trust-div { width: 1px; height: 44px; background: var(--border); }

    /* ─── CTA SECTION ─────────────────────────── */
    .cta-section {
      background: var(--gold-light);
      border-top: 1px solid var(--border);
      text-align: center; padding: 108px 52px;
    }
    .cta-section h2 {
      font-family: 'DM Serif Display', serif;
      font-size: 56px; margin-bottom: 18px; color: var(--black);
    }
    .cta-section p { font-size: 16px; color: var(--gray); margin-bottom: 44px; font-weight: 300; }

    /* ─── FOOTER ──────────────────────────────── */
    footer {
      background: var(--black); padding: 32px 52px;
      display: flex; justify-content: space-between; align-items: center;
    }
    .footer-logo { font-family: 'DM Serif Display', serif; font-size: 17px; color: var(--white); }
    .footer-note { font-size: 12px; color: rgba(255,255,255,0.28); }

    /* ════════════════════════════════════════════
       INTAKE FLOW
    ════════════════════════════════════════════ */
    #intake { display: none; min-height: 100vh; background: var(--white); }

    .progress-bar {
      position: fixed; top: 0; left: 0; height: 2px;
      background: var(--gold); transition: width 0.4s ease; z-index: 300;
    }

    .intake-nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 200;
      height: 68px; padding: 0 52px;
      display: flex; align-items: center; justify-content: space-between;
      background: rgba(250,247,242,0.96); backdrop-filter: blur(16px);
      border-bottom: 1px solid var(--border);
    }
    .intake-logo { font-family: 'DM Serif Display', serif; font-size: 19px; }
    .step-pills { display: flex; gap: 5px; align-items: center; }
    .pill {
      height: 5px; border-radius: 3px; background: var(--border);
      transition: all 0.3s; width: 18px;
    }
    .pill.active { width: 32px; background: var(--gold); }
    .pill.done { background: var(--black); }
    .btn-back {
      background: none; border: none; cursor: pointer;
      display: flex; align-items: center; gap: 6px;
      font-family: 'DM Sans', sans-serif; font-size: 12.5px;
      color: var(--gray); letter-spacing: 0.03em;
      transition: color 0.18s;
    }
    .btn-back:hover { color: var(--black); }

    /* Step panels */
    .intake-body { padding-top: 68px; min-height: 100vh; display: flex; }
    .step-panel { display: none; width: 100%; }
    .step-panel.active { display: flex; }

    .step-left {
      width: 38%; background: var(--black); color: var(--white);
      padding: 72px 52px;
      display: flex; flex-direction: column; justify-content: center;
      position: sticky; top: 68px;
      height: calc(100vh - 68px);
    }
    .step-right {
      flex: 1; padding: 64px 52px; overflow-y: auto;
    }
    .step-eyebrow {
      font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 18px; font-weight: 600;
      display: flex; align-items: center; gap: 10px;
    }
    .step-eyebrow::before { content:''; width:16px; height:1px; background:var(--gold); }
    .step-heading {
      font-family: 'DM Serif Display', serif;
      font-size: 38px; line-height: 1.1; margin-bottom: 18px;
    }
    .step-desc {
      font-size: 14.5px; color: rgba(255,255,255,0.52);
      font-weight: 300; line-height: 1.75;
    }
    .step-tip {
      margin-top: 40px; padding: 18px 20px;
      border-left: 2px solid var(--gold);
      background: rgba(181,99,74,0.08);
    }
    .step-tip p { font-size: 12.5px; color: rgba(255,255,255,0.4); line-height: 1.65; }
    .step-tip strong { color: var(--gold); font-weight: 500; }

    /* ── Room grid ── */
    .room-grid {
      display: grid; grid-template-columns: repeat(2, 1fr);
      gap: 10px; margin-bottom: 36px;
    }
    .room-card {
      border: 1.5px solid var(--border); padding: 18px 20px;
      cursor: pointer; display: flex; align-items: center; gap: 14px;
      background: var(--card); transition: all 0.18s;
    }
    .room-card:hover { border-color: var(--gold); }
    .room-card.selected { border-color: var(--black); background: var(--black); color: var(--white); }
    .room-card.selected .room-icon { color: var(--gold); }
    .room-icon { color: var(--gray); flex-shrink: 0; transition: color 0.18s; }
    .room-card:hover .room-icon { color: var(--gold); }
    .room-name { font-size: 13.5px; font-weight: 500; }

    /* ── Upload ── */
    .upload-zone {
      border: 2px dashed var(--border); padding: 56px 40px;
      text-align: center; cursor: pointer; position: relative;
      background: var(--card); transition: all 0.2s; margin-bottom: 20px;
    }
    .upload-zone:hover, .upload-zone.drag-over { border-color: var(--gold); background: var(--gold-light); }
    .upload-zone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
    .upload-icon { color: var(--gold); margin-bottom: 14px; }
    .upload-title { font-size: 15px; font-weight: 500; margin-bottom: 6px; }
    .upload-hint { font-size: 12.5px; color: var(--gray); }
    .upload-preview {
      display: none; align-items: center; gap: 14px;
      padding: 14px 18px; background: var(--gold-light);
      border: 1px solid var(--gold-mid); margin-bottom: 20px;
    }
    .upload-preview.show { display: flex; }
    .upload-fname { font-size: 13.5px; font-weight: 500; }
    .upload-fsize { font-size: 12px; color: var(--gray); }
    .btn-clear { margin-left: auto; background: none; border: none; cursor: pointer; color: var(--gray); font-size: 12px; font-family: 'DM Sans', sans-serif; transition: color 0.18s; }
    .btn-clear:hover { color: var(--black); }

    /* ── Style cards ── */
    .style-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 36px; }
    .style-card { cursor: pointer; border: 2px solid transparent; transition: all 0.18s; overflow: hidden; position: relative; }
    .style-card:hover { border-color: var(--gold); }
    .style-card.selected { border-color: var(--black); }
    .style-card.selected::after {
      content: '✓'; position: absolute; top: 8px; right: 8px;
      width: 22px; height: 22px; background: var(--black);
      color: white; display: flex; align-items: center; justify-content: center;
      font-size: 11px; border-radius: 50%;
    }
    .swatch { height: 140px; position: relative; overflow: hidden; background: var(--gold-light); }
    .swatch img { width:100%; height:100%; object-fit:cover; display:block; transition: transform 0.4s ease; }
    .style-card:hover .swatch img { transform: scale(1.05); }
    /* CSS fallback backgrounds (shown while images load or on error) */
    .swatch-japandi       { background: #E8DFD2; }
    .swatch-contemporary  { background: #D8D8D8; }
    .swatch-midcentury    { background: #C8905A; }
    .swatch-transitional  { background: #C8BEB0; }
    .swatch-coastal       { background: #A8CEDD; }
    .swatch-industrial    { background: #5A5A5A; }
    .swatch-maximalist    { background: #7A3A90; }
    .swatch-scandi        { background: #D8DCD8; }
    .style-info { padding: 13px 14px; background: white; border-top: 1px solid var(--border); }
    .style-name { font-size: 13px; font-weight: 600; margin-bottom: 2px; }
    .style-kw { font-size: 11.5px; color: var(--gray); }

    /* ── Quote panel ── */
    .quote-panel {
      border: 1.5px solid var(--border); overflow: hidden;
      margin-top: 14px; animation: fadeSlide 0.28s ease;
    }
    @keyframes fadeSlide {
      from { opacity: 0; transform: translateY(-6px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .quote-head {
      padding: 22px 26px; display: flex; justify-content: space-between; align-items: center;
      background: var(--black); color: var(--white);
    }
    .quote-tier-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--gold); margin-bottom: 4px; font-weight: 600; }
    .quote-tier-name { font-family: 'DM Serif Display', serif; font-size: 18px; color: var(--white); }
    .quote-total-num { font-family: 'DM Serif Display', serif; font-size: 34px; color: var(--white); text-align: right; }
    .quote-total-lbl { font-size: 10px; color: rgba(255,255,255,0.38); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 3px; text-align: right; }
    .quote-meta {
      padding: 0; border-bottom: 1px solid var(--border);
    }
    .quote-meta-text { font-size: 12.5px; color: var(--gray); padding: 13px 26px; }
    .btn-breakdown {
      display: flex; align-items: center; justify-content: space-between;
      width: 100%; gap: 8px; background: var(--gold-light);
      border: none; border-top: 1px solid var(--border);
      padding: 14px 26px; font-family: 'DM Sans', sans-serif;
      font-size: 13px; font-weight: 600; color: var(--black); cursor: pointer;
      letter-spacing: 0.02em; transition: all 0.18s; white-space: nowrap;
    }
    .btn-breakdown:hover { background: #EDD8CA; }
    .btn-breakdown .bd-left { display: flex; align-items: center; gap: 8px; }
    .btn-breakdown svg { transition: transform 0.22s; flex-shrink: 0; }
    .btn-breakdown.open svg { transform: rotate(180deg); }
    .quote-breakdown { display: none; }
    .q-room-section { padding: 18px 26px 0; }
    .q-room-name {
      font-size: 10px; font-weight: 600; letter-spacing: 0.14em;
      text-transform: uppercase; color: var(--gold); margin-bottom: 10px;
      padding-bottom: 8px; border-bottom: 1px solid var(--border);
      display: flex; align-items: center; gap: 7px;
    }
    .q-row {
      display: flex; justify-content: space-between; align-items: center;
      padding: 8px 0; font-size: 13px; border-bottom: 1px solid #F2EBE4;
    }
    .q-row:last-of-type { border-bottom: none; margin-bottom: 4px; }
    .q-row-price { color: var(--gray); font-variant-numeric: tabular-nums; }
    .q-room-sub {
      display: flex; justify-content: space-between; align-items: center;
      margin: 0 0 18px; padding: 9px 26px; background: var(--gold-light);
      font-size: 12px; font-weight: 600; color: var(--black);
      border-top: 1px solid var(--border);
    }
    .quote-totals { padding: 18px 26px; border-top: 1.5px solid var(--border); background: white; }
    .q-total-row {
      display: flex; justify-content: space-between;
      padding: 7px 0; font-size: 13px; border-bottom: 1px solid #F2EBE4;
      color: var(--gray);
    }
    .q-total-row.grand {
      border-bottom: none; font-weight: 600; font-size: 15px;
      color: var(--black); padding-top: 14px; margin-top: 6px;
      border-top: 1.5px solid var(--border);
    }
    .q-total-row.grand span:last-child { color: var(--gold); }
    .quote-disclaimer {
      padding: 11px 26px; background: var(--gold-light);
      font-size: 11px; color: var(--gray); line-height: 1.55;
      border-top: 1px solid var(--border);
    }

    /* ── Piece list ── */
    .pieces-section { margin-bottom: 36px; }
    .pieces-room-label {
      font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
      color: var(--gold); padding-bottom: 10px;
      border-bottom: 1px solid var(--border); margin-bottom: 10px;
      display: flex; align-items: center; gap: 8px;
    }
    .piece-item {
      display: flex; align-items: center; gap: 12px;
      padding: 13px 16px; background: var(--card);
      border: 1.5px solid var(--border); cursor: pointer;
      transition: all 0.15s; margin-bottom: 7px;
    }
    .piece-item:hover { border-color: var(--gold); }
    .piece-item.selected { border-color: var(--black); background: var(--white); }
    .piece-checkbox {
      width: 17px; height: 17px; border: 1.5px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; transition: all 0.15s;
    }
    .piece-checkbox svg { visibility: hidden; }
    .piece-item.selected .piece-checkbox { background: var(--black); border-color: var(--black); color: white; }
    .piece-item.selected .piece-checkbox svg { visibility: visible; }
    .piece-name { flex: 1; font-size: 13.5px; }
    .piece-tag { font-size: 10px; padding: 2px 8px; background: var(--gold-light); color: var(--gold); font-weight: 600; letter-spacing: 0.06em; }

    /* ── Tier cards ── */
    .tier-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 36px; }
    .tier-card {
      border: 1.5px solid var(--border); padding: 26px 28px;
      cursor: pointer; display: flex; gap: 22px;
      align-items: flex-start; background: var(--card);
      transition: all 0.2s; position: relative;
    }
    .tier-card:hover { border-color: var(--gold-mid); }
    .tier-card.selected { border-color: var(--black); background: var(--black); color: var(--white); }
    .tier-radio {
      width: 19px; height: 19px; border-radius: 50%;
      border: 1.5px solid var(--border); flex-shrink: 0;
      margin-top: 3px; transition: all 0.2s; position: relative;
    }
    .tier-card.selected .tier-radio { border-color: var(--gold); background: var(--gold); }
    .tier-card.selected .tier-radio::after {
      content: ''; position: absolute; top: 50%; left: 50%;
      transform: translate(-50%,-50%); width: 7px; height: 7px;
      border-radius: 50%; background: var(--black);
    }
    .tier-body { flex: 1; }
    .tier-badge {
      display: inline-block; font-size: 9.5px; font-weight: 700;
      letter-spacing: 0.14em; text-transform: uppercase;
      padding: 3px 9px; margin-bottom: 11px;
    }
    .tier-card:not(.selected) .tier-badge { background: var(--gold-light); color: var(--gold); }
    .tier-card.selected .tier-badge { background: var(--gold); color: var(--black); }
    .tier-name { font-family: 'DM Serif Display', serif; font-size: 22px; margin-bottom: 8px; }
    .tier-desc { font-size: 13px; line-height: 1.65; margin-bottom: 14px; }
    .tier-card:not(.selected) .tier-desc { color: var(--gray); }
    .tier-card.selected .tier-desc { color: rgba(255,255,255,0.54); }
    .tier-features { display: flex; flex-wrap: wrap; gap: 6px; }
    .tier-feat { font-size: 11.5px; padding: 3px 9px; }
    .tier-card:not(.selected) .tier-feat { background: var(--gold-light); color: var(--black); }
    .tier-card.selected .tier-feat { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.75); }
    .tier-right { flex-shrink: 0; text-align: right; }
    .tier-price { font-family: 'DM Serif Display', serif; font-size: 26px; }
    .tier-card:not(.selected) .tier-price { color: var(--black); }
    .tier-price-lbl { font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; margin-top: 4px; }
    .tier-card:not(.selected) .tier-price-lbl { color: var(--gray); }
    .tier-card.selected .tier-price-lbl { color: rgba(255,255,255,0.4); }

    /* ── Form inputs ── */
    .form-group { margin-bottom: 22px; }
    .form-label {
      display: block; font-size: 10px; font-weight: 600;
      letter-spacing: 0.14em; text-transform: uppercase;
      color: var(--gray); margin-bottom: 8px;
    }
    .opt-tag { font-size: 9px; color: var(--border); margin-left: 6px; letter-spacing: 0; text-transform: none; font-weight: 400; }
    .form-input {
      width: 100%; padding: 13px 16px;
      border: 1.5px solid var(--border); background: var(--card);
      font-family: 'DM Sans', sans-serif; font-size: 14.5px;
      color: var(--black); outline: none; transition: border-color 0.18s;
      appearance: none;
    }
    .form-input:focus { border-color: var(--black); }
    .form-input::placeholder { color: #C8C4BE; }
    .form-input:invalid { border-color: var(--border); }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    textarea.form-input { resize: vertical; min-height: 110px; }

    /* ── Step footer ── */
    .step-footer {
      display: flex; justify-content: space-between; align-items: center;
      margin-top: 36px; padding-top: 22px; border-top: 1px solid var(--border);
    }
    .step-counter { font-size: 12px; color: var(--gray); }
    .btn-skip {
      background: none; border: none; cursor: pointer;
      font-family: 'DM Sans', sans-serif; font-size: 12.5px;
      color: var(--gray); text-decoration: underline;
      transition: color 0.18s;
    }
    .btn-skip:hover { color: var(--black); }

    /* ─── CONFIRMATION ────────────────────────── */
    #confirmation {
      display: none; min-height: 100vh;
      background: var(--black); color: var(--white);
      align-items: center; justify-content: center;
      flex-direction: column; text-align: center; padding: 80px 52px;
    }
    #confirmation.show { display: flex; }
    .confirm-check {
      width: 76px; height: 76px; border: 1.5px solid var(--gold);
      border-radius: 50%; display: flex; align-items: center; justify-content: center;
      color: var(--gold); margin: 0 auto 36px;
    }
    .confirm-title {
      font-family: 'DM Serif Display', serif;
      font-size: 54px; margin-bottom: 18px;
    }
    .confirm-sub {
      font-size: 16px; color: rgba(255,255,255,0.46);
      font-weight: 300; max-width: 500px; margin: 0 auto 52px; line-height: 1.75;
    }
    .confirm-steps { display: flex; gap: 60px; margin-bottom: 52px; }
    .cs-num { font-family: 'DM Serif Display', serif; font-size: 34px; color: var(--gold); margin-bottom: 6px; }
    .cs-lbl { font-size: 12px; color: rgba(255,255,255,0.38); letter-spacing: 0.05em; }
    .btn-ghost {
      background: none; border: 1.5px solid rgba(255,255,255,0.2);
      color: var(--white); padding: 14px 34px;
      font-family: 'DM Sans', sans-serif; font-size: 12px;
      font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
      cursor: pointer; transition: all 0.2s;
    }
    .btn-ghost:hover { border-color: var(--gold); color: var(--gold); }

    /* ─── RESPONSIVE ──────────────────────────── */
    @media (max-width: 960px) {
      nav, section, footer { padding-left: 28px; padding-right: 28px; }
      nav { padding-top: 0; padding-bottom: 0; }
      .hero { grid-template-columns: 1fr; }
      .hero-right { display: none; }
      .hero-left { padding: 72px 28px; }
      .process-grid { grid-template-columns: 1fr 1fr; gap: 2px; }
      .process-step { border-left: none; border-top: 1px solid var(--border); padding-left: 0; }
      .process-step:first-child { border-top: none; }
      .cat-grid { grid-template-columns: 1fr 1fr; }
      .trust-strip { gap: 28px; padding: 36px 28px; flex-wrap: wrap; }
      .step-left { display: none; }
      .step-right { padding: 40px 28px; }
      .style-grid { grid-template-columns: 1fr 1fr; }
      .confirm-steps { gap: 32px; }
      .intake-nav { padding: 0 28px; }
    }
