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

    :root {
      --sage:    #4a6741;
      --sage-lt: #d8e8d4;
      --sage-pale:#f0f6ee;
      --sand:    #c8a96e;
      --sand-lt: #f5e9d4;
      --sand-pale:#fdf8f0;
      --ink:     #1c1c18;
      --ink-mid: #3a3a30;
      --ink-lt:  #6b6b58;
      --cream:   #faf7f2;
      --cream2:  #f2ede4;
      --red:     #8b2e2e;
      --red-pale:#fdf3f3;
      --border:  rgba(200,169,110,0.2);
      --radius:  10px;
    }

    body {
      font-family: 'Cormorant Garamond', Georgia, serif;
      background: var(--cream);
      color: var(--ink);
      font-size: 18px;
      line-height: 1.85;
    }

    /* NAV BAR */
    .topbar {
      background: var(--ink);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 12px 28px;
    }
    .topbar .brand {
      font-family: 'Jost', sans-serif;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--sand);
      text-decoration: none;
    }
    .topbar .breadcrumb {
      font-family: 'Jost', sans-serif;
      font-size: 11px;
      color: #706040;
      letter-spacing: .06em;
    }

    /* HERO */
    .hero {
      background: var(--ink);
      padding: 80px 24px 70px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .hero::after {
      content: 'वास्तु';
      position: absolute;
      bottom: -20px;
      right: 5%;
      font-family: 'Cormorant Garamond', serif;
      font-size: 180px;
      font-weight: 700;
      color: rgba(200,169,110,0.05);
      pointer-events: none;
      line-height: 1;
    }
    .hero-pill {
      display: inline-block;
      font-family: 'Jost', sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--sand);
      border: 1px solid rgba(200,169,110,0.35);
      border-radius: 20px;
      padding: 4px 14px;
      margin-bottom: 24px;
    }
    .hero h1 {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(28px, 5.5vw, 56px);
      font-weight: 700;
      line-height: 1.12;
      color: #fff;
      max-width: 900px;
      margin: 0 auto 22px;
      position: relative;
    }
    .hero h1 em {
      font-style: italic;
      color: var(--sand);
    }
    .hero-deck {
      font-family: 'Cormorant Garamond', serif;
      font-style: italic;
      font-size: 19px;
      color: #b0a090;
      max-width: 640px;
      margin: 0 auto 30px;
      position: relative;
    }
    .hero-meta {
      font-family: 'Jost', sans-serif;
      font-size: 11px;
      letter-spacing: .07em;
      color: #5a5040;
      position: relative;
    }
    .hero-meta span { margin: 0 10px; }

    /* CONTAINER */
    .wrap { max-width: 800px; margin: 0 auto; padding: 0 24px; }

    /* QUICK ANSWER */
    .quick-box {
      margin: 52px 0 0;
      background: var(--sage-pale);
      border: 1.5px solid var(--sage);
      border-radius: var(--radius);
      padding: 26px 32px;
    }
    .quick-box .qb-label {
      font-family: 'Jost', sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--sage);
      margin-bottom: 10px;
    }
    .quick-box p {
      font-size: 17px;
      color: var(--ink-mid);
      line-height: 1.72;
      margin: 0;
    }

    /* BODY */
    .body-wrap { padding: 56px 0 80px; }
    .body-wrap p { color: var(--ink-mid); margin-bottom: 24px; }

    /* HEADINGS */
    h2 {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(24px, 3.5vw, 34px);
      font-weight: 700;
      color: var(--ink);
      margin: 64px 0 20px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--border);
    }
    h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      font-weight: 600;
      color: var(--ink);
      margin: 38px 0 12px;
    }

    /* VASTU GRID — visual zones */
    .vastu-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      background: var(--border);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      overflow: hidden;
      margin: 32px 0;
      font-family: 'Jost', sans-serif;
    }
    .vg-cell {
      background: #fff;
      padding: 18px 16px;
      text-align: center;
    }
    .vg-cell.highlight { background: var(--sand-lt); }
    .vg-cell.sage-bg   { background: var(--sage-pale); }
    .vg-dir {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--ink-lt);
      margin-bottom: 4px;
    }
    .vg-room {
      font-size: 13px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 2px;
    }
    .vg-why {
      font-size: 11px;
      color: var(--ink-lt);
      line-height: 1.45;
    }
    .grid-center { background: var(--sage-pale); }
    .grid-caption {
      font-family: 'Jost', sans-serif;
      font-size: 12px;
      color: var(--ink-lt);
      text-align: center;
      margin-top: 8px;
      font-style: italic;
    }

    /* TABLES */
    .tbl-wrap {
      overflow-x: auto;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      margin: 28px 0;
    }
    table {
      width: 100%;
      border-collapse: collapse;
      font-family: 'Jost', sans-serif;
      font-size: 14px;
    }
    thead tr { background: var(--ink); }
    thead th {
      padding: 13px 18px;
      text-align: left;
      color: var(--sand);
      font-weight: 500;
      letter-spacing: .04em;
    }
    tbody tr:nth-child(odd)  { background: #fff; }
    tbody tr:nth-child(even) { background: var(--cream2); }
    tbody td {
      padding: 11px 18px;
      color: var(--ink-mid);
      border-top: 1px solid var(--border);
      vertical-align: top;
    }
    tbody td:first-child { font-weight: 500; color: var(--ink); }
    .tick { color: var(--sage); font-weight: 700; }
    .cross { color: var(--red); font-weight: 700; }

    /* CALLOUTS */
    .callout {
      border-radius: var(--radius);
      padding: 20px 26px;
      margin: 30px 0;
    }
    .callout .cl-label {
      font-family: 'Jost', sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .18em;
      text-transform: uppercase;
      margin-bottom: 8px;
    }
    .callout p { font-size: 16px; margin-bottom: 0; line-height: 1.7; }

    .cl-tip  { background: var(--sage-pale); border-left: 4px solid var(--sage); }
    .cl-tip  .cl-label { color: var(--sage); }
    .cl-tip  p { color: #2e4a2a; }

    .cl-warn { background: var(--red-pale); border-left: 4px solid var(--red); }
    .cl-warn .cl-label { color: var(--red); }
    .cl-warn p { color: #5a1818; }

    .cl-gold { background: var(--sand-lt); border-left: 4px solid var(--sand); }
    .cl-gold .cl-label { color: #8a6020; }
    .cl-gold p { color: var(--ink-mid); }

    /* DARK CARD */
    .dark-card {
      background: var(--ink);
      border-radius: 14px;
      padding: 38px 38px 32px;
      margin: 40px 0;
      color: #fff;
    }
    .dark-card .dc-badge {
      font-family: 'Jost', sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--sand);
      margin-bottom: 10px;
    }
    .dark-card h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      color: #fff;
      margin: 0 0 16px;
    }
    .dark-card p { color: #b0a080; font-size: 16px; margin-bottom: 0; }
    .dc-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap: 12px;
      margin-top: 22px;
    }
    .dc-item {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(200,169,110,0.2);
      border-radius: 8px;
      padding: 14px 16px;
    }
    .dc-item .di-label {
      font-family: 'Jost', sans-serif;
      font-size: 10px;
      color: #7a6848;
      letter-spacing: .06em;
      margin-bottom: 5px;
    }
    .dc-item .di-val {
      font-family: 'Jost', sans-serif;
      font-size: 15px;
      font-weight: 500;
      color: var(--sand);
    }

    /* CHECKLIST */
    .checklist { list-style: none; margin: 18px 0 26px; }
    .checklist li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 9px 0;
      border-bottom: 1px solid var(--border);
      color: var(--ink-mid);
      font-size: 17px;
      line-height: 1.65;
    }
    .checklist li:last-child { border-bottom: none; }
    .checklist li::before {
      content: '✓';
      flex-shrink: 0;
      width: 22px; height: 22px;
      background: var(--sage);
      color: #fff;
      border-radius: 50%;
      font-size: 11px;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 3px;
      font-family: 'Jost', sans-serif;
    }

    /* PULL QUOTE */
    .pullquote {
      font-family: 'Cormorant Garamond', serif;
      font-style: italic;
      font-size: 22px;
      line-height: 1.55;
      color: var(--sage);
      border-left: 4px solid var(--sage);
      padding: 14px 26px;
      margin: 36px 0;
      background: var(--sage-pale);
      border-radius: 0 8px 8px 0;
    }

    /* IMG BLOCK */
    .img-block {
      background: var(--cream2);
      border: 1px dashed var(--sand);
      border-radius: var(--radius);
      padding: 28px;
      margin: 30px 0;
      text-align: center;
      font-family: 'Jost', sans-serif;
    }
    .img-block .ib-icon { font-size: 26px; color: var(--sand); margin-bottom: 10px; }
    .img-block .ib-caption { font-size: 13px; color: var(--ink-lt); line-height: 1.55; }
    .img-block .ib-alt { font-size: 11px; color: #9a8c6a; margin-top: 6px; font-style: italic; }

    /* FAQ */
    .faq-item { border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 14px; overflow: hidden; }
    .faq-q { background: var(--cream2); padding: 16px 22px; font-family: 'Jost', sans-serif; font-size: 15px; font-weight: 500; color: var(--ink); }
    .faq-a { padding: 14px 22px; font-size: 16px; color: var(--ink-mid); line-height: 1.7; }

    /* CONCLUSION */
    .conclusion {
      background: var(--cream2);
      border-top: 3px solid var(--sand);
      padding: 40px 38px;
      border-radius: 0 0 12px 12px;
      margin-top: 44px;
    }
    .conclusion h2 { border: none; padding: 0; margin-top: 0; font-size: 28px; }

    /* CTA */
    .cta {
      background: var(--sage);
      border-radius: 14px;
      padding: 38px 42px;
      margin: 50px 0;
      text-align: center;
      color: #fff;
    }
    .cta h3 { font-family: 'Cormorant Garamond', serif; font-size: 26px; color: #fff; margin: 0 0 12px; }
    .cta p { color: rgba(255,255,255,0.72); font-size: 16px; margin-bottom: 22px; }
    .cta a {
      display: inline-block;
      background: var(--sand);
      color: var(--ink);
      font-family: 'Jost', sans-serif;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .06em;
      padding: 12px 28px;
      border-radius: 6px;
      text-decoration: none;
    }

    /* FOOTER */
    footer {
      background: var(--ink);
      color: #5a5040;
      text-align: center;
      padding: 30px 24px;
      font-family: 'Jost', sans-serif;
      font-size: 12px;
      line-height: 1.8;
    }
    footer a { color: var(--sand); text-decoration: none; }

    @media (max-width: 600px) {
      .hero { padding: 56px 20px 50px; }
      .hero::after { display: none; }
      .dark-card { padding: 26px 20px; }
      .conclusion { padding: 28px 20px; }
      .cta { padding: 28px 20px; }
      .vastu-grid { grid-template-columns: repeat(3, 1fr); }
    }