:root {
    --bg: #FAF8F4;
    --bg-alt: #F2EEE6;
    --surface: #FFFFFF;
    --ink: #1C1A17;
    --ink-2: #5B5650;
    --ink-3: #8C867E;
    --line: #E6E0D6;
    --accent: #E8641A;
    --accent-text: #B8430A;
    --accent-ink: #FFFFFF;
    --accent-soft: #FCEBDD;
    --dark: #1C1A17;
    --serif: "Source Serif 4", Georgia, serif;
    --sans: "Manrope", -apple-system, "Segoe UI", sans-serif;
    --wrap: 1120px;
  }
  * { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body { background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
  a { color: inherit; text-decoration: none; }
  .wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }

  /* Mockup flag */
  .mock { background: var(--dark); color: #F2EEE6; font-size: 13px; text-align: center; padding: 8px 16px; letter-spacing: .02em; }

  /* Nav */
  nav.top { position: sticky; top: 0; z-index: 10; background: rgba(250,248,244,.82); backdrop-filter: saturate(180%) blur(16px); -webkit-backdrop-filter: saturate(180%) blur(16px); border-bottom: 1px solid var(--line); }
  nav.top .wrap { display: flex; align-items: center; justify-content: space-between; height: 64px; }
  .logo { font-weight: 700; font-size: 20px; letter-spacing: -.01em; }
  .logo img { display: block; height: 34px; width: auto; }
  .links { display: flex; gap: 22px; font-size: 15px; color: var(--ink-2); }
  .links a:hover { color: var(--ink); }

  .btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; border-radius: 999px; padding: 12px 22px; white-space: nowrap; transition: transform .15s ease, background .15s ease; }
  .btn:hover { transform: translateY(-1px); }
  .btn-primary { background: var(--accent-text); color: var(--accent-ink); }
  .btn-primary:hover { background: #9C3808; }
  .btn-ghost { color: var(--ink); }
  .btn-ghost:hover { color: var(--accent-text); }
  .btn-sm { padding: 9px 18px; font-size: 14px; }

  /* Hero */
  .hero { padding: 112px 0 96px; }
  .hero .wrap { display: grid; grid-template-columns: 1.15fr .85fr; gap: 64px; align-items: center; }
  .eyebrow { font-size: 14px; font-weight: 600; color: var(--accent-text); letter-spacing: .04em; text-transform: uppercase; margin-bottom: 20px; }
  h1, h2, h3 { font-family: var(--serif); font-weight: 500; letter-spacing: -.02em; line-height: 1.08; }
  h1 { font-size: clamp(38px, 5.2vw, 64px); margin-bottom: 24px; }
  h1 span { display: block; }
  .lede { font-size: 20px; color: var(--ink-2); max-width: 34ch; margin-bottom: 36px; }
  .cta-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
  .proof { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 40px; font-size: 14px; color: var(--ink-3); }
  .proof b { color: var(--ink); font-weight: 600; }

  /* Path picker (hero visual) */
  .card-stack { position: relative; }
  .picker { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 28px 20px 16px; box-shadow: 0 30px 60px -30px rgba(60,40,20,.25); }
  .picker .title { font-family: var(--serif); font-size: 26px; margin: 0 8px 14px; }
  .path { display: flex; align-items: center; gap: 14px; padding: 13px 8px; border-top: 1px solid var(--line); border-radius: 12px; transition: background .15s ease; }
  .path:hover { background: var(--accent-soft); border-top-color: transparent; }
  .path:hover + .path { border-top-color: transparent; }
  .path .t { font-weight: 600; font-size: 15px; }
  .path .s { font-size: 13px; color: var(--ink-3); }
  .path .go { margin-left: auto; color: var(--ink-3); transition: transform .15s ease, color .15s ease; }
  .path:hover .go { color: var(--accent-text); transform: translateX(3px); }
  .badge { position: absolute; right: -18px; top: -44px; background: var(--dark); color: #F2EEE6; border-radius: 16px; padding: 14px 18px; font-size: 13px; line-height: 1.4; box-shadow: 0 20px 40px -20px rgba(0,0,0,.4); }
  .badge b { display: block; font-size: 15px; color: #fff; }

  /* Sections */
  section { padding: 120px 0; }
  .alt { background: var(--bg-alt); }
  .center { text-align: center; }
  h2 { font-size: clamp(36px, 4.6vw, 56px); margin-bottom: 20px; }
  .sub { font-size: 19px; color: var(--ink-2); max-width: 46ch; }
  .center .sub { margin: 0 auto; }

  /* Statement */
  .statement h2 { max-width: 18ch; margin: 0 auto 24px; }
  .statement .sub { max-width: 52ch; }

  /* Services */
  .grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 64px; }
  .svc { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 36px; display: flex; flex-direction: column; transition: border-color .2s ease, transform .2s ease; }
  .svc:hover { border-color: #D8CFC2; transform: translateY(-2px); }
  .svc h3 { font-size: 30px; margin-bottom: 8px; }
  .svc p { color: var(--ink-2); font-size: 16px; margin-bottom: 24px; }
  .svc ul { list-style: none; margin-top: auto; }
  .svc li { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-top: 1px solid var(--line); font-size: 15px; }
  .svc li span:last-child { color: var(--ink-3); white-space: nowrap; }
  .svc.wide { grid-column: 1 / -1; background: var(--dark); color: #F2EEE6; border-color: var(--dark); }
  .svc.wide h3 { color: #fff; }
  .svc.wide p { color: #C9C2B8; max-width: 52ch; }
  .svc.wide li { border-color: #3A3631; }
  .svc.wide li span:last-child { color: #A8A096; }
  .svc.wide .inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: end; }
  .svc.feature { border-color: #E9C9AE; box-shadow: 0 24px 48px -32px rgba(232,100,26,.35); }
  .svc.feature h3 { font-size: 36px; }
  .grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 20px; }
  .svc.small { padding: 28px; }
  .svc.small h3 { font-size: 24px; margin-bottom: 16px; }
  .grid3 + .grid { margin-top: 20px; }
  .fine { margin-top: 28px; font-size: 14px; color: var(--ink-3); text-align: center; }
  .fine a { color: var(--ink); border-bottom: 1px solid var(--line); }

  /* Steps */
  .steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin-top: 72px; }
  .num { font-family: var(--serif); font-size: 64px; color: var(--accent); line-height: 1; margin-bottom: 20px; }
  .steps h3 { font-size: 26px; margin-bottom: 12px; }
  .steps p { color: var(--ink-2); font-size: 16px; }

  /* Why */
  .why { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
  .photo { aspect-ratio: 4/5; border-radius: 28px; background: repeating-linear-gradient(135deg, #E9E3D8 0 12px, #E3DCCF 12px 24px); display: grid; place-items: center; color: var(--ink-3); font-size: 14px; text-align: center; padding: 24px; border: 1px dashed #CFC5B5; }
  .points { margin-top: 40px; display: grid; gap: 28px; }
  .points h4 { font-size: 18px; font-weight: 700; margin-bottom: 4px; }
  .points p { color: var(--ink-2); font-size: 16px; }

  /* Payment strip */
  .facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 56px; }
  .fact { border-top: 2px solid var(--ink); padding-top: 20px; }
  .fact h4 { font-size: 17px; font-weight: 700; margin-bottom: 6px; }
  .fact p { color: var(--ink-2); font-size: 15px; }

  /* Offices */
  .offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 56px; }
  .consult { max-width: 640px; margin: 48px auto 0; background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 32px; text-align: left; }
  .consult ul { list-style: none; margin-bottom: 16px; }
  .consult li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--line); font-size: 15px; }
  .consult li span:last-child { color: var(--ink-3); white-space: nowrap; }
  .consult p { color: var(--ink-2); font-size: 15px; margin-bottom: 20px; }
  a.office { display: block; transition: border-color .2s ease; }
  a.office:hover { border-color: #D8CFC2; }
  .office { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 28px; }
  .office .city { font-family: var(--serif); font-size: 26px; margin-bottom: 8px; }
  .office p { color: var(--ink-2); font-size: 15px; }
  .contact-row { display: flex; gap: 40px; flex-wrap: wrap; justify-content: center; margin-top: 40px; font-size: 16px; }
  .contact-row a { font-weight: 600; }
  .contact-row span { color: var(--ink-3); font-size: 14px; display: block; }

  /* Final CTA */
  .final { background: var(--dark); color: #F2EEE6; padding: 140px 0; }
  .final h2 { color: #fff; max-width: 16ch; margin: 0 auto 24px; }
  .final .sub { color: #C9C2B8; margin: 0 auto 40px; }

  footer { padding: 48px 0 64px; font-size: 13px; color: var(--ink-3); }
  footer .wrap { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; }

  /* Reveal on scroll */
  .js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
  .js .reveal.in { opacity: 1; transform: none; }
  @media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; transition: none; } }

  @media (max-width: 1360px) { .links { gap: 18px; font-size: 14px; } }
  @media (max-width: 1040px) { .links { display: none; } }
  @media (max-width: 900px) {
    .hero { padding: 64px 0 72px; }
    .hero .wrap, .why, .svc.wide .inner { grid-template-columns: 1fr; gap: 48px; }
    .badge { right: 12px; }
    section { padding: 80px 0; }
    .grid, .grid3, .steps, .facts, .offices { grid-template-columns: 1fr; }
    .steps { gap: 40px; }
    .photo { aspect-ratio: 4/3; }
    .final { padding: 96px 0; }
  }
  @media (max-width: 480px) {
    .wrap { padding: 0 16px; }
    .svc { padding: 28px 22px; }
    .lede { font-size: 18px; }
    .logo img { height: 26px; }
    .btn-sm { padding: 8px 14px; font-size: 13px; }
  }

  .nav-right { display: flex; align-items: center; gap: 10px; }
  .menu-btn { display: none; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; font-weight: 600; padding: 8px 14px; border-radius: 999px; cursor: pointer; }
  .menu-btn svg { width: 16px; height: 16px; }
  .mobile-menu { display: none; border-top: 1px solid var(--line); background: var(--bg); max-height: calc(100vh - 64px); overflow-y: auto; }
  .mobile-menu.open { display: block; }
  .mobile-menu a { display: block; padding: 14px 24px; border-bottom: 1px solid var(--line); font-size: 16px; color: var(--ink); }
  .mobile-menu a:last-child { border-bottom: 0; }
  .mobile-bar { display: none; }
  .mobile-bar .wa svg { width: 20px; height: 20px; }
  @media (max-width: 1040px) { .menu-btn { display: inline-flex; } }
  @media (min-width: 1041px) { .mobile-menu { display: none !important; } }
  @media (max-width: 900px) {
    .mobile-bar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; gap: 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(250,248,244,.96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid var(--line); }
    .mobile-bar .btn { justify-content: center; padding: 13px 16px; font-size: 15px; }
    .mobile-bar .book { flex: 1; }
    .mobile-bar .wa { flex: 0 0 auto; background: var(--surface); border: 1px solid var(--line); color: var(--ink); gap: 8px; }
    body { padding-bottom: 76px; }
    nav.top .nav-right .btn-sm { display: none; }
  }

  .links a.active { color: var(--ink); font-weight: 600; }
  .page-hero { padding: 96px 0 64px; }
  .page-hero h1 { font-size: clamp(40px, 5.4vw, 64px); max-width: 16ch; }
  .page-hero .lede { max-width: 46ch; }
  .chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
  .chip { background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px; font-size: 14px; color: var(--ink-2); transition: border-color .15s ease, color .15s ease; }
  .chip:hover { border-color: var(--accent-text); color: var(--accent-text); }
  .svc[id] { scroll-margin-top: 96px; }
  .svc h2 { font-size: 30px; margin-bottom: 8px; }
  .svc .price { font-size: 15px; color: var(--ink-3); margin: 0 0 16px; }
  .svc .more { margin-top: 20px; font-size: 15px; font-weight: 600; color: var(--accent-text); }
  .svc ul.plain li { justify-content: flex-start; }
  .svc ul.plain li span { color: var(--ink); white-space: normal; }
  .grid, .grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  @media (max-width: 900px) { .grid, .grid3 { grid-template-columns: minmax(0, 1fr); } }
  .svc.fee h2 { margin-bottom: 16px; }
  .svc.fee ul { margin-top: 0; }
  .note { margin-top: 20px; font-size: 15px; color: var(--ink-2); }
  .note a { color: var(--ink); border-bottom: 1px solid var(--line); }
  .grid.tight { margin-top: 48px; }
  .grid3.tight { margin-top: 48px; }
  .sec-head { margin-bottom: 8px; }
  section.short { padding: 96px 0; }
  .toggle-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
  .toggle-wrap { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--ink-3); }
  .cur-toggle { display: inline-flex; gap: 4px; padding: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; }
  .cur-toggle button { border: 0; background: transparent; font: inherit; font-size: 14px; font-weight: 600; padding: 8px 18px; border-radius: 999px; color: var(--ink-2); cursor: pointer; }
  .cur-toggle button[aria-pressed="true"] { background: var(--ink); color: #fff; }
  .price-big { font-family: var(--serif); font-size: 44px; line-height: 1; margin: 4px 0 18px; }
  .svc .btn { align-self: flex-start; margin-top: auto; }
  .grid3 .svc ul { margin-top: 0; margin-bottom: 24px; }
  footer .contact-mini a, footer .lic a { color: var(--ink-2); border-bottom: 1px solid var(--line); }
  footer .footer-links { display: flex; flex-wrap: wrap; gap: 10px 24px; padding-bottom: 28px; margin-bottom: 28px; border-bottom: 1px solid var(--line); font-size: 14px; }
  footer .footer-links a { color: var(--ink-2); }
  footer .footer-links a:hover { color: var(--accent-text); }
  .related { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
  .map { aspect-ratio: 3/1; border-radius: 20px; border: 1px dashed #CFC5B5; background: repeating-linear-gradient(135deg, #E9E3D8 0 12px, #E3DCCF 12px 24px); display: grid; place-items: center; color: var(--ink-3); font-size: 14px; }
  @media (max-width: 900px) { .page-hero { padding: 56px 0 48px; } section.short { padding: 72px 0; } .map { aspect-ratio: 4/3; } }