:root {
      --gw-primary: #0B8A6A;
      --gw-accent: #FFD166;
      --gw-bg: #F4F7F5;
      --gw-text: #1F2933;
      --gw-radius-lg: 1rem;
    }
    body {
      font-family: Inter, Arial, sans-serif;
      color: var(--gw-text);
      background-color: var(--gw-bg);
    }
    h1, h2, h3, h4, h5 {
      font-family: Poppins, system-ui, sans-serif;
    }
    .btn-gw-primary {
      background-color: var(--gw-primary);
      border-color: var(--gw-primary);
      color: #fff;
      border-radius: var(--gw-radius-lg);
    }
    .btn-gw-primary:hover {
      background-color: #086852;
      border-color: #086852;
      color: #fff;
    }
    .btn-gw-outline {
      border-radius: var(--gw-radius-lg);
      border: 1px solid var(--gw-primary);
      color: var(--gw-primary);
      background-color: transparent;
    }
    .btn-gw-outline:hover {
      background-color: rgba(11,138,106,0.08);
      color: var(--gw-primary);
    }
    .btn-gw-ghost {
      border-radius: var(--gw-radius-lg);
      border: 1px solid transparent;
      color: var(--gw-primary);
      background-color: transparent;
    }
    .btn-gw-ghost:hover {
      background-color: rgba(11,138,106,0.06);
      color: var(--gw-primary);
    }
    .section-padding {
      padding-top: 4rem;
      padding-bottom: 4rem;
    }
    .bg-gw-light {
      background-color: #ffffff;
    }
    .bg-gw-color {
      background-color: #E3F2ED;
    }
    .hero {
      min-height: 90vh;
      display: flex;
      align-items: center;
      background: radial-gradient(circle at top left, rgba(11,138,106,0.18), transparent 55%), radial-gradient(circle at bottom right, rgba(0,137,193,0.18), transparent 55%);
    }
    .hero-visual {
      background: rgba(255,255,255,0.7);
      border-radius: var(--gw-radius-lg);
      padding: 2rem;
      backdrop-filter: blur(8px);
    }
    .badge-accent {
      background-color: var(--gw-accent);
      color: #7C4A00;
      font-weight: 600;
      border-radius: 999px;
      padding: 0.35rem 0.85rem;
      font-size: 0.8rem;
    }
    .card-advantage {
      border-radius: var(--gw-radius-lg);
      border: 1px solid #E1E7EC;
      background-color: #ffffff;
      height: 100%;
    }
    .card-advantage .icon {
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background-color: rgba(11,138,106,0.08);
      color: var(--gw-primary);
      margin-bottom: 0.75rem;
    }
    .faq-item {
      border-radius: var(--gw-radius-lg);
      border: 1px solid #D8E2EC;
      background-color: #ffffff;
      margin-bottom: 1rem;
    }
    .pricing-card {
      border-radius: var(--gw-radius-lg);
      border: 1px solid #D8E2EC;
      background-color: #ffffff;
      height: 100%;
    }
    .pricing-card.highlight {
      border-width: 2px;
      border-color: var(--gw-primary);
      box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
      position: relative;
      overflow: hidden;
    }
    .pricing-card.highlight::before {
      content: "Most popular";
      position: absolute;
      top: 1rem;
      right: -3.5rem;
      transform: rotate(45deg);
      background-color: var(--gw-primary);
      color: #fff;
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      padding: 0.35rem 3.5rem;
    }
    .portfolio-card {
      border-radius: var(--gw-radius-lg);
      overflow: hidden;
      border: 1px solid #D8E2EC;
      background-color: #ffffff;
      height: 100%;
    }
    .portfolio-card img {
      width: 100%;
      height: 200px;
      object-fit: cover;
    }
    .newsletter-section {
      background: linear-gradient(135deg, rgba(11,138,106,0.12), rgba(0,102,204,0.14));
    }
    .newsletter-inner {
      border-radius: var(--gw-radius-lg);
      background: rgba(255,255,255,0.88);
      backdrop-filter: blur(10px);
    }
    .cta-card {
      border-radius: var(--gw-radius-lg);
      background-color: #ffffff;
      border: 1px solid #D8E2EC;
    }
    footer {
      background-color: #0B1726;
      color: #E5E7EB;
    }
    footer a {
      color: #E5E7EB;
      text-decoration: none;
    }
    footer a:hover {
      text-decoration: underline;
    }
    .cookie-banner {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 1080;
      background: #111827;
      color: #F9FAFB;
      padding: 0.85rem 1rem;
      font-size: 0.85rem;
    }
    .cookie-banner a {
      color: #93C5FD;
    }
    .cookie-banner .btn {
      font-size: 0.8rem;
    }
    @media (max-width: 991.98px) {
      .hero {
        padding-top: 5rem;
      }
    }

img {
    max-width: 100%;
    height: auto;
}