:root {
      --green-950: #051f10;
      --green-900: #0a3d1f;
      --green-800: #0f4c2c;
      --gold: #d4af37;
      --gold-light: #e5c158;
      --text: #1f2937;
      --muted: #64748b;
      --line: #e5e7eb;
      --soft: #f8fafc;
      --white: #ffffff;
      --shadow: 0 18px 50px rgba(15, 23, 42, 0.14);
      --shadow-soft: 0 12px 28px rgba(15, 23, 42, 0.1);
      --radius: 22px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: 'Outfit', Arial, sans-serif;
      color: var(--text);
      background: var(--white);
      line-height: 1.55;
    }
    img { display: block; max-width: 100%; }
    a { color: inherit; text-decoration: none; }
    button, input, select { font: inherit; }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, h3 { line-height: 1.12; letter-spacing: -0.04em; }
    h1 { font-size: clamp(2.35rem, 6vw, 3rem); margin-bottom: 1rem; }
    h2 { font-size: clamp(2rem, 4vw, 1.45rem); margin-bottom: 0.8rem; }
    h3 { font-size: 1.35rem; margin-bottom: 0.7rem; }

    .container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
    .section { padding: 76px 0; }
    .section-tight { padding: 48px 0; }
    .center { text-align: center; }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      padding: 0.55rem 0.85rem;
      border-radius: 999px;
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.65rem;
      min-height: 52px;
      padding: 0.9rem 1.45rem;
      border-radius: 14px;
      border: 0;
      cursor: pointer;
      font-weight: 800;
      letter-spacing: 0.03em;
      transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
      box-shadow: var(--shadow-soft);
    }
    .btn:hover { transform: translateY(-2px); }
    .btn-gold { background: var(--gold); color: var(--green-800); }
    .btn-gold:hover { background: var(--gold-light); }
    .btn-green { background: var(--green-800); color: var(--white); }
    .btn-green:hover { background: var(--green-900); }
    .btn-white { background: var(--white); color: var(--green-800); }
    .muted { color: var(--muted); }
    .stars { display: inline-flex; gap: 0.16rem; color: var(--gold); }
    .icon { width: 1.15em; height: 1.15em; display: inline-block; vertical-align: -0.18em; }

    .hero {
      position: relative;
      min-height: 760px;
      color: var(--white);
      overflow: hidden;
      background: var(--green-900);
    }
    .hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(10,61,31,.94), rgba(10,61,31,.74), rgba(10,61,31,.45)), url('../images/hero.jpg') center/cover;
    }
    .hero::after {
      content: '';
      position: absolute;
      width: 520px;
      height: 520px;
      right: -180px;
      top: -160px;
      background: radial-gradient(circle, rgba(212,175,55,.32), transparent 62%);
    }
    .hero-inner {
      position: relative;
      z-index: 1;
      min-height: 760px;
      display: grid;
      grid-template-columns: 1.08fr 0.92fr;
      align-items: center;
      gap: 56px;
      padding: 54px 0;
    }
    .hero-copy p { color: #ecfdf5; font-size: 1.16rem; max-width: 700px; }
    .badge-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 1.1rem; }
    .badge-glass { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(14px); }
    .badge-gold { background: rgba(212,175,55,.92); color: var(--green-800); }
    .check-list { list-style: none; padding: 0; margin: 1.5rem 0 1.8rem; display: grid; gap: 0.7rem; }
    .check-list li { display: flex; gap: 0.65rem; align-items: flex-start; font-size: 1.05rem; }
    .check-list li::before { content: '✓'; color: #86efac; font-weight: 900; }
    .proof-strip { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 1.35rem; }
    .proof-chip {
      display: inline-flex;
      align-items: center;
      gap: 0.55rem;
      padding: 0.62rem 0.9rem;
      border-radius: 999px;
      background: rgba(255,255,255,.14);
      border: 1px solid rgba(255,255,255,.2);
      color: #f8fafc;
      font-size: 0.92rem;
      font-weight: 700;
      backdrop-filter: blur(10px);
    }
    .proof-chip svg {
      width: 16px;
      height: 16px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      flex: 0 0 auto;
    }

    .lead-card {
      background: var(--white);
      color: var(--text);
      border-radius: var(--radius);
      padding: clamp(1.3rem, 3vw, 2rem);
      box-shadow: 0 30px 80px rgba(0,0,0,.26);
      border: 1px solid rgba(255,255,255,.3);
    }
    .lead-card .eyebrow { background: rgba(15,76,44,.08); color: var(--green-800); }
    .lead-card h2 { color: #111827; font-size: clamp(1.9rem, 3vw, 2.55rem); }
    .form-grid { display: grid; gap: 0.85rem; }
    .honeypot {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      opacity: 0;
    }
    label { display: block; margin-bottom: 0.35rem; color: #374151; font-weight: 700; font-size: 0.92rem; }
    input, select {
      width: 100%;
      border: 1px solid #d1d5db;
      background: #f9fafb;
      padding: 0.78rem 0.86rem;
      border-radius: 12px;
      outline: 0;
    }
    input:focus, select:focus { border-color: var(--green-800); box-shadow: 0 0 0 4px rgba(15,76,44,.12); }
    .safe-note { display: flex; justify-content: center; gap: 0.4rem; color: #6b7280; font-size: 0.82rem; margin: 0.2rem 0 0; }

    .soft-bg { background: linear-gradient(180deg, #f8fafc, #ffffff); }
    .dark-bg { background: linear-gradient(180deg, var(--green-900), var(--green-950)); color: var(--white); }
    .gold-bg { background: linear-gradient(135deg, var(--green-900), var(--green-800), var(--green-900)); color: var(--white); }
    .section-head { max-width: 780px; margin: 0 auto 42px; text-align: center; }
    .section-head p { color: var(--muted); font-size: 1.12rem; }
    .dark-bg .section-head p, .gold-bg .section-head p { color: #d1fae5; }

    .review-grid, .benefit-grid, .gallery-grid, .service-grid, .stats-grid, .area-grid, .contact-grid {
      display: grid;
      gap: 22px;
    }
    .review-grid { grid-template-columns: repeat(3, 1fr); }
    .stats-grid { grid-template-columns: repeat(4, 1fr); margin-top: 34px; }
    .benefit-grid { grid-template-columns: repeat(3, 1fr); }
    .service-grid { grid-template-columns: repeat(2, 1fr); }
    .gallery-grid { grid-template-columns: repeat(3, 1fr); }
    .area-grid { grid-template-columns: repeat(4, 1fr); }
    .contact-grid { grid-template-columns: repeat(3, 1fr); }

    .card {
      background: var(--white);
      border: 1px solid #eef2f7;
      border-radius: 18px;
      padding: 1.45rem;
      box-shadow: var(--shadow-soft);
    }
    .review-card {
      display: flex;
      flex-direction: column;
      gap: 0.9rem;
      height: 100%;
    }
    .review-card p { color: #4b5563; margin: 0; }
    .review-meta { border-top: 1px solid var(--line); padding-top: 0.9rem; margin-top: auto; }
    .review-grid-compact { grid-template-columns: repeat(4, 1fr); margin-top: 1.35rem; }
    .review-card-compact { padding: 1.15rem; gap: 0.7rem; }
    .review-card-compact p { font-size: 0.95rem; }
    .project-label { color: var(--green-800); font-weight: 800; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 0.15rem; }
    .stat-card { text-align: center; padding: 1.3rem 1rem; }
    .stat-number { color: var(--green-800); font-size: 2.3rem; font-weight: 800; line-height: 1; }

    .carousel-wrap { max-width: 1020px; margin: 0 auto; }
    .carousel-stage { position: relative; }
    .carousel-frame { height: clamp(280px, 46vw, 430px); border-radius: 22px; overflow: hidden; box-shadow: var(--shadow); background: #e5e7eb; }
    .carousel-frame img { width: 100%; height: 100%; object-fit: cover; }
    .carousel-caption {
      margin-top: 12px;
      padding: 1rem 1.05rem 1.08rem;
      border-radius: 18px;
      background: var(--white);
      border: 1px solid #eef2f7;
      box-shadow: var(--shadow-soft);
    }
    .carousel-caption p { margin: 0; color: #374151; line-height: 1.6; }
    .carousel-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 44px;
      height: 44px;
      border-radius: 50%;
      border: 0;
      background: rgba(255,255,255,.94);
      color: #111827;
      cursor: pointer;
      box-shadow: var(--shadow-soft);
      font-size: 1.7rem;
      line-height: 1;
    }
    .carousel-btn.prev { left: 12px; }
    .carousel-btn.next { right: 12px; }
    .dots { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; gap: 8px; }
    .dot { width: 9px; height: 9px; border-radius: 999px; border: 0; background: rgba(255,255,255,.55); cursor: pointer; transition: width 180ms ease, background 180ms ease; }
    .dot.active { width: 28px; background: var(--white); }

    .benefit-card { text-align: center; box-shadow: none; border: 0; }
    .benefit-icon, .area-icon, .contact-icon {
      width: 68px;
      height: 68px;
      border-radius: 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1rem;
      background: linear-gradient(135deg, rgba(15,76,44,.1), rgba(15,76,44,.18));
      color: var(--green-800);
      font-weight: 900;
      font-size: 1.5rem;
    }
    .benefit-icon svg, .area-icon svg, .contact-icon svg {
      width: 32px;
      height: 32px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.9;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .service-card {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 18px;
      padding: 1.55rem;
      backdrop-filter: blur(12px);
    }
    .service-card p { color: #d1d5db; }
    .service-card ul { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: 0.45rem; color: #e5e7eb; }
    .service-card li::before { content: '✓'; color: var(--gold); font-weight: 900; margin-right: 0.5rem; }

    .project-card {
      overflow: hidden;
      border-radius: 18px;
      background: var(--white);
      border: 1px solid #eef2f7;
      box-shadow: var(--shadow-soft);
    }
    .project-media {
      position: relative;
      aspect-ratio: 4 / 3;
      overflow: hidden;
    }
    .project-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 700ms ease;
    }
    .project-card:hover .project-media img { transform: scale(1.08); }
    .project-caption {
      margin: 0;
      padding: 1rem 1rem 1.08rem;
      color: #374151;
      font-size: 0.96rem;
      line-height: 1.6;
      border-top: 1px solid #eef2f7;
    }
    .area-card { background: linear-gradient(135deg, #f8fafc, #ffffff); border: 1px solid #eef2f7; border-radius: 24px; padding: 2rem; box-shadow: var(--shadow-soft); }
    .area-item { display: flex; gap: 0.6rem; align-items: center; color: #374151; font-weight: 600; }
    .area-item::before { content: ''; width: 7px; height: 7px; background: var(--gold); border-radius: 50%; flex: 0 0 auto; }
    .area-foot { text-align: center; border-top: 1px solid var(--line); margin-top: 1.7rem; padding-top: 1.3rem; }
    .area-foot a { color: var(--green-800); text-decoration: underline; font-weight: 700; }
    .area-proof { border-top: 1px solid var(--line); margin-top: 1.7rem; padding-top: 1.7rem; }
    .area-proof-head { text-align: center; margin-bottom: 1rem; }
    .area-proof-head h3 { margin-bottom: 0.35rem; font-size: 1.35rem; }

    .cta-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin: 2rem 0 2.5rem; }
    .contact-block { text-align: center; color: #d1fae5; }
    .contact-block h3 { color: var(--white); font-size: 1.05rem; }
    .contact-icon { background: transparent; color: var(--gold); margin-bottom: 0.45rem; }
    .footer-note { border-top: 1px solid rgba(255,255,255,.2); margin-top: 2rem; padding-top: 1.3rem; color: #bbf7d0; font-size: 0.82rem; letter-spacing: 0.05em; }

    .thanks-hero {
      min-height: 100vh;
      display: grid;
      place-items: center;
      padding: 48px 16px;
      background: linear-gradient(135deg, var(--green-900), var(--green-800));
      color: var(--white);
      text-align: center;
    }
    .thanks-card {
      width: min(560px, 100%);
      padding: clamp(1.6rem, 5vw, 2.4rem);
      border-radius: var(--radius);
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(255,255,255,.2);
      box-shadow: var(--shadow);
      backdrop-filter: blur(12px);
    }
    .thanks-card h1 { font-size: clamp(2.1rem, 5vw, 3rem); }
    .thanks-card p { color: #ecfdf5; font-size: 1.08rem; }

    .floating-call {
      position: fixed;
      z-index: 50;
      right: 22px;
      bottom: 22px;
      width: 60px;
      height: 60px;
      border-radius: 999px;
      background: var(--gold);
      color: var(--green-800);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 18px 44px rgba(0,0,0,.24);
      transition: transform 180ms ease, background 180ms ease;
    }
    .floating-call:hover { transform: scale(1.08); background: var(--gold-light); }
    .floating-label {
      position: absolute;
      right: calc(100% + 12px);
      top: 50%;
      transform: translateY(-50%);
      white-space: nowrap;
      background: var(--green-800);
      color: var(--white);
      border-radius: 12px;
      padding: 0.6rem 0.9rem;
      opacity: 0;
      pointer-events: none;
      transition: opacity 180ms ease;
      font-size: 0.9rem;
    }
    .floating-call:hover .floating-label { opacity: 1; }

    @media (max-width: 900px) {
      .hero, .hero-inner { min-height: auto; }
      .hero-inner { grid-template-columns: 1fr; padding: 44px 0 58px; }
      .review-grid, .benefit-grid, .service-grid, .gallery-grid, .contact-grid { grid-template-columns: 1fr; }
      .review-grid-compact { grid-template-columns: repeat(2, 1fr); }
      .stats-grid, .area-grid { grid-template-columns: repeat(2, 1fr); }
      .section { padding: 58px 0; }
      .hero-copy p { font-size: 1.04rem; }
      .proof-strip { justify-content: center; }
    }

    @media (max-width: 560px) {
      .container { width: min(100% - 24px, 1180px); }
      h1 { font-size: 2.35rem; }
      .review-grid-compact,
      .stats-grid, .area-grid { grid-template-columns: 1fr; }
      .badge-row { align-items: stretch; }
      .eyebrow { width: 100%; justify-content: center; text-align: center; }
      .proof-chip { width: 100%; justify-content: center; }
      .btn { width: 100%; }
      .floating-label { display: none; }
      .lead-card { padding: 1.1rem; }
    }