:root {
        color-scheme: light;
        --bg: #f7f5ee;
        --surface: #fffdf8;
        --ink: #1e2a22;
        --muted: #4f6157;
        --line: #d9e1d8;
        --accent: #1f5a3d;
        --accent-2: #8ea97a;
        --accent-soft: #e8efe3;
      }
      * { box-sizing: border-box; }
      html { scroll-behavior: smooth; }
      body {
        margin: 0;
        font-family: Georgia, "Times New Roman", serif;
        color: var(--ink);
        background:
          radial-gradient(circle at 8% 0%, rgba(142, 169, 122, 0.2), transparent 28%),
          radial-gradient(circle at 100% 12%, rgba(31, 90, 61, 0.1), transparent 24%),
          var(--bg);
      }
      .wrap { width: min(1120px, calc(100% - 32px)); margin: 0 auto; }

      .topbar {
        position: sticky;
        top: 0;
        z-index: 10;
        backdrop-filter: blur(8px);
        background: rgba(247, 245, 238, 0.9);
        border-bottom: 1px solid var(--line);
      }
      .nav {
        min-height: 68px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
      }
      .brand {
        font-weight: 700;
        letter-spacing: 0.01em;
        text-decoration: none;
        color: var(--ink);
      }
      .nav-links {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        align-items: center;
      }
      .nav-links a {
        color: var(--muted);
        text-decoration: none;
        font-size: 0.95rem;
      }
      .nav-links a:hover,
      .nav-links a:focus-visible { color: var(--accent); }

      .hero { padding: 82px 0 56px; }
      .eyebrow {
        display: inline-block;
        padding: 8px 12px;
        border-radius: 999px;
        background: var(--accent-soft);
        color: var(--accent);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
      h1 {
        margin: 18px 0 14px;
        max-width: 760px;
        font-size: clamp(2rem, 5vw, 4rem);
        line-height: 1.1;
      }
      .lead {
        max-width: 760px;
        margin: 0;
        font-size: 1.12rem;
        line-height: 1.7;
        color: var(--muted);
      }
      .actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
      .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 13px 18px;
        border-radius: 12px;
        text-decoration: none;
        font-weight: 700;
      }
      .btn-primary { background: var(--accent); color: #fff; }
      .btn-secondary { border: 1px solid var(--line); color: var(--ink); background: rgba(255, 255, 255, 0.75); }

      .section { padding: 20px 0 38px; }
      .section h2 { margin: 0 0 14px; font-size: 1.7rem; }
      .section-intro { margin: 0 0 18px; color: var(--muted); max-width: 760px; line-height: 1.65; }

      .grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
      .card {
        padding: 20px;
        border: 1px solid var(--line);
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 14px 30px rgba(30, 42, 34, 0.08);
      }
      .card h3 { margin: 0 0 8px; font-size: 1.05rem; }
      .card p { margin: 0; color: var(--muted); line-height: 1.6; }

      .steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
      .step-num {
        display: inline-block;
        width: 28px;
        height: 28px;
        border-radius: 999px;
        text-align: center;
        line-height: 28px;
        background: var(--accent-soft);
        color: var(--accent);
        font-weight: 700;
        margin-bottom: 8px;
      }

      .faq details {
        border: 1px solid var(--line);
        border-radius: 12px;
        padding: 14px 16px;
        background: rgba(255, 255, 255, 0.82);
      }
      .faq details + details { margin-top: 10px; }
      .faq summary { cursor: pointer; font-weight: 700; }
      .faq p { margin: 10px 0 0; color: var(--muted); }

      .cta {
        margin: 12px 0 72px;
        padding: 30px;
        border-radius: 22px;
        background: linear-gradient(135deg, #1b3f2d, #285f41);
        color: #fff;
      }
      .cta p { margin: 8px 0 0; color: rgba(255, 255, 255, 0.86); }
      .contact-list { margin: 14px 0 0; padding: 0; list-style: none; }
      .contact-list li { margin: 6px 0; }
      .contact-list a { color: #fff; }

      @media (max-width: 900px) {
        .grid, .steps { grid-template-columns: 1fr; }
        .hero { padding-top: 64px; }
      }