@layer components {
  .wga-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wga-spacing-sm);
    padding: var(--wga-spacing-md) var(--wga-spacing-xl);
    font-size: var(--wga-font-size-base);
    font-weight: var(--wga-font-weight-medium);
    border-radius: var(--wga-border-radius-lg);
    transition: all var(--wga-transition-base);
    cursor: pointer;
    border: 2px solid transparent;
  }

  .wga-btn--primary {
    background-color: var(--wga-color-accent-primary);
    color: var(--wga-color-text-inverse);
  }

  .wga-btn--primary:hover {
    background-color: var(--wga-color-forest-light);
    transform: translateY(-2px);
    box-shadow: var(--wga-shadow-md);
    text-decoration: none;
  }

  .wga-btn--secondary {
    background-color: transparent;
    color: var(--wga-color-accent-primary);
    border-color: var(--wga-color-accent-primary);
  }

  .wga-btn--secondary:hover {
    background-color: var(--wga-color-accent-primary);
    color: var(--wga-color-text-inverse);
    text-decoration: none;
  }

  .wga-card {
    background-color: var(--wga-color-bg-primary);
    border-radius: var(--wga-border-radius-xl);
    padding: var(--wga-spacing-xl);
    box-shadow: var(--wga-shadow-md);
    transition: all var(--wga-transition-base);
  }

  .wga-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--wga-shadow-xl);
  }

  .wga-card--featured {
    padding: 0;
    overflow: hidden;
  }

  .wga-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    inline-size: 64px;
    block-size: 64px;
    background-color: var(--wga-color-dew-main);
    border-radius: var(--wga-border-radius-full);
    margin-block-end: var(--wga-spacing-md);
    color: var(--wga-color-accent-primary);
  }

  .wga-card__img {
    inline-size: 100%;
    block-size: 200px;
    object-fit: cover;
  }

  .wga-card__body {
    padding: var(--wga-spacing-xl);
  }

  .wga-card__title {
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-card__text {
    color: var(--wga-color-text-secondary);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-card__text:last-child {
    margin-block-end: 0;
  }

  .wga-hero {
    position: relative;
    min-block-size: 80vh;
    display: flex;
    align-items: center;
    overflow: hidden;
  }

  .wga-hero__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
  }

  .wga-hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(26, 47, 35, 0.8) 0%, rgba(39, 174, 96, 0.6) 100%);
  }

  .wga-hero__img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
  }

  .wga-hero__content {
    position: relative;
    z-index: 1;
    color: var(--wga-color-text-inverse);
    max-inline-size: 600px;
  }

  .wga-hero__title {
    font-size: var(--wga-font-size-5xl);
    margin-block-end: var(--wga-spacing-lg);
    color: var(--wga-color-text-inverse);
  }

  .wga-hero__text {
    font-size: var(--wga-font-size-xl);
    margin-block-end: var(--wga-spacing-xl);
    color: var(--wga-color-dew-light);
  }

  .wga-cta {
    text-align: center;
    padding: var(--wga-spacing-2xl);
  }

  .wga-cta__title {
    color: var(--wga-color-text-inverse);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-cta__text {
    font-size: var(--wga-font-size-lg);
    color: var(--wga-color-dew-light);
    margin-block-end: var(--wga-spacing-xl);
    max-inline-size: 70ch;
    margin-inline: auto;
  }

  .wga-timeline {
    position: relative;
    padding-inline-start: var(--wga-spacing-xl);
  }

  .wga-timeline::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    inset-block-end: 0;
    inline-size: 2px;
    background-color: var(--wga-color-accent-primary);
  }

  .wga-timeline__item {
    position: relative;
    padding-block-end: var(--wga-spacing-xl);
  }

  .wga-timeline__marker {
    position: absolute;
    inset-inline-start: calc(-1 * var(--wga-spacing-xl) - 6px);
    inset-block-start: 0;
    inline-size: 16px;
    block-size: 16px;
    background-color: var(--wga-color-accent-primary);
    border: 3px solid var(--wga-color-bg-primary);
    border-radius: var(--wga-border-radius-full);
  }

  .wga-timeline__title {
    margin-block-end: var(--wga-spacing-sm);
  }

  .wga-timeline__text {
    color: var(--wga-color-text-secondary);
  }

  .wga-form {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-lg);
    max-inline-size: 600px;
    margin-inline: auto;
  }

  .wga-form__group {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-sm);
  }

  .wga-form__label {
    font-weight: var(--wga-font-weight-medium);
    color: var(--wga-color-text-primary);
  }

  .wga-form__input,
  .wga-form__textarea {
    padding: var(--wga-spacing-md);
    border: 2px solid var(--wga-color-border-light);
    border-radius: var(--wga-border-radius-md);
    background-color: var(--wga-color-bg-primary);
    color: var(--wga-color-text-primary);
    transition: border-color var(--wga-transition-fast);
  }

  .wga-form__input:focus,
  .wga-form__textarea:focus {
    outline: none;
    border-color: var(--wga-color-accent-primary);
  }

  .wga-form__input:invalid:not(:placeholder-shown),
  .wga-form__textarea:invalid:not(:placeholder-shown) {
    border-color: #e74c3c;
  }

  .wga-form__textarea {
    min-block-size: 150px;
    resize: vertical;
  }

  .wga-form__checkbox-group {
    display: flex;
    align-items: flex-start;
    gap: var(--wga-spacing-sm);
  }

  .wga-form__checkbox {
    margin-block-start: 4px;
  }

  .wga-form__error {
    color: #e74c3c;
    font-size: var(--wga-font-size-sm);
  }

  .wga-img {
    inline-size: 100%;
    block-size: auto;
    border-radius: var(--wga-border-radius-lg);
  }

  .wga-text {
    color: var(--wga-color-text-secondary);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-back-to-top {
    position: fixed;
    inset-block-end: var(--wga-spacing-xl);
    inset-inline-end: var(--wga-spacing-xl);
    inline-size: 48px;
    block-size: 48px;
    background-color: var(--wga-color-accent-primary);
    color: var(--wga-color-text-inverse);
    border-radius: var(--wga-border-radius-full);
    box-shadow: var(--wga-shadow-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--wga-transition-base);
    z-index: var(--wga-z-index-fixed);
  }

  .wga-back-to-top:hover {
    transform: translateY(-4px);
    box-shadow: var(--wga-shadow-xl);
  }

  .wga-back-to-top[hidden] {
    display: none;
  }

  .wga-faq {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-faq__item {
    background-color: var(--wga-color-bg-primary);
    border: 1px solid var(--wga-color-border-light);
    border-radius: var(--wga-border-radius-lg);
    padding: var(--wga-spacing-lg);
  }

  .wga-faq__question {
    font-size: var(--wga-font-size-lg);
    font-weight: var(--wga-font-weight-medium);
    color: var(--wga-color-text-primary);
    padding-inline-end: var(--wga-spacing-xl);
    position: relative;
  }

  .wga-faq__question::after {
    content: "+";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 0;
    font-size: var(--wga-font-size-2xl);
    color: var(--wga-color-accent-primary);
    transition: transform var(--wga-transition-base);
  }

  .wga-faq__item[open] .wga-faq__question::after {
    transform: rotate(45deg);
  }

  .wga-faq__answer {
    padding-block-start: var(--wga-spacing-md);
    color: var(--wga-color-text-secondary);
  }

  .wga-faq__answer p {
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-faq__answer p:last-child {
    margin-block-end: 0;
  }

  .wga-faq__answer ul {
    padding-inline-start: var(--wga-spacing-lg);
    margin-block: var(--wga-spacing-sm);
  }

  .wga-faq__answer li {
    margin-block-end: var(--wga-spacing-xs);
  }

  /* Adding missing component styles for all HTML classes */

  /* Body */
  .wga-body {
    display: flex;
    flex-direction: column;
    min-block-size: 100vh;
  }

  /* Buttons - alias for wga-btn */
  .wga-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wga-spacing-sm);
    padding: var(--wga-spacing-md) var(--wga-spacing-xl);
    font-size: var(--wga-font-size-base);
    font-weight: var(--wga-font-weight-medium);
    border-radius: var(--wga-border-radius-lg);
    transition: all var(--wga-transition-base);
    cursor: pointer;
    border: 2px solid transparent;
  }

  .wga-button--primary {
    background-color: var(--wga-color-accent-primary);
    color: var(--wga-color-text-inverse);
  }

  .wga-button--primary:hover {
    background-color: var(--wga-color-forest-light);
    transform: translateY(-2px);
    box-shadow: var(--wga-shadow-md);
    text-decoration: none;
  }

  .wga-button--secondary {
    background-color: transparent;
    color: var(--wga-color-accent-primary);
    border-color: var(--wga-color-accent-primary);
  }

  .wga-button--secondary:hover {
    background-color: var(--wga-color-accent-primary);
    color: var(--wga-color-text-inverse);
    text-decoration: none;
  }

  .wga-button--full {
    inline-size: 100%;
  }

  /* Section titles and intros */
  .wga-section-title {
    font-size: var(--wga-font-size-3xl);
    font-weight: var(--wga-font-weight-bold);
    color: var(--wga-color-text-primary);
    margin-block-end: var(--wga-spacing-lg);
    text-align: center;
  }

  .wga-section-intro {
    font-size: var(--wga-font-size-lg);
    color: var(--wga-color-text-secondary);
    text-align: center;
    max-inline-size: 70ch;
    margin-inline: auto;
    margin-block-end: var(--wga-spacing-2xl);
  }

  /* Hero section */
  .wga-hero__grid {
    display: grid;
    gap: var(--wga-spacing-2xl);
    align-items: center;
  }

  @media (min-width: 768px) {
    .wga-hero__grid {
      grid-template-columns: 1fr 1fr;
    }
  }

  .wga-hero__subtitle {
    font-size: var(--wga-font-size-lg);
    color: var(--wga-color-dew-light);
    margin-block-end: var(--wga-spacing-xl);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-hero__actions {
    display: flex;
    gap: var(--wga-spacing-md);
    flex-wrap: wrap;
  }

  .wga-hero__media {
    border-radius: var(--wga-border-radius-xl);
    overflow: hidden;
    box-shadow: var(--wga-shadow-xl);
  }

  .wga-hero__image {
    inline-size: 100%;
    block-size: auto;
    display: block;
  }

  /* Page hero */
  .wga-page-hero {
    padding-block: var(--wga-spacing-3xl);
    background: linear-gradient(180deg, var(--wga-color-dew-main) 0%, transparent 100%);
    text-align: center;
  }

  .wga-page-hero__title {
    font-size: var(--wga-font-size-4xl);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-page-hero__subtitle {
    font-size: var(--wga-font-size-lg);
    color: var(--wga-color-text-secondary);
    max-inline-size: 70ch;
    margin-inline: auto;
  }

  /* Features section */
  .wga-features {
    padding-block: var(--wga-spacing-3xl);
  }

  .wga-features__grid {
    display: grid;
    gap: var(--wga-spacing-xl);
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  }

  /* Timeline additions */
  .wga-timeline__image {
    inline-size: 100%;
    block-size: auto;
    border-radius: var(--wga-border-radius-lg);
    margin-block-start: var(--wga-spacing-md);
  }

  /* Guide intro */
  .wga-guide-intro {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-guide-intro__grid {
    display: grid;
    gap: var(--wga-spacing-2xl);
    align-items: center;
  }

  @media (min-width: 768px) {
    .wga-guide-intro__grid {
      grid-template-columns: 1fr 1fr;
    }
  }

  .wga-guide-intro__content {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-guide-intro__text {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-guide-intro__media {
    border-radius: var(--wga-border-radius-xl);
    overflow: hidden;
    box-shadow: var(--wga-shadow-lg);
  }

  .wga-guide-intro__image {
    inline-size: 100%;
    block-size: auto;
    display: block;
  }

  /* Mosaic grid */
  .wga-mosaic {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-mosaic__grid {
    display: grid;
    gap: var(--wga-spacing-lg);
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  }

  .wga-mosaic__card {
    background-color: var(--wga-color-bg-primary);
    border-radius: var(--wga-border-radius-xl);
    overflow: hidden;
    box-shadow: var(--wga-shadow-md);
    transition: all var(--wga-transition-base);
  }

  .wga-mosaic__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--wga-shadow-xl);
  }

  .wga-mosaic__card--large {
    grid-column: span 1;
  }

  @media (min-width: 768px) {
    .wga-mosaic__card--large {
      grid-column: span 2;
    }
  }

  .wga-mosaic__card--wide {
    grid-column: span 1;
  }

  @media (min-width: 768px) {
    .wga-mosaic__card--wide {
      grid-column: span 2;
    }
  }

  .wga-mosaic__image {
    inline-size: 100%;
    block-size: 250px;
    object-fit: cover;
    display: block;
  }

  .wga-mosaic__content {
    padding: var(--wga-spacing-xl);
  }

  .wga-mosaic__title {
    font-size: var(--wga-font-size-xl);
    margin-block-end: var(--wga-spacing-sm);
  }

  .wga-mosaic__text {
    color: var(--wga-color-text-secondary);
  }

  /* Plants section */
  .wga-plants {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-plants__grid {
    display: grid;
    gap: var(--wga-spacing-xl);
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  }

  .wga-plants__card {
    background-color: var(--wga-color-bg-primary);
    border-radius: var(--wga-border-radius-xl);
    padding: var(--wga-spacing-xl);
    box-shadow: var(--wga-shadow-md);
    transition: all var(--wga-transition-base);
  }

  .wga-plants__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--wga-shadow-xl);
  }

  .wga-plants__header {
    display: flex;
    align-items: center;
    gap: var(--wga-spacing-md);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-plants__icon {
    flex-shrink: 0;
    color: var(--wga-color-accent-primary);
  }

  .wga-plants__title {
    font-size: var(--wga-font-size-xl);
    margin: 0;
  }

  .wga-plants__text {
    color: var(--wga-color-text-secondary);
    margin-block-end: var(--wga-spacing-sm);
  }

  .wga-plants__text:last-child {
    margin-block-end: 0;
  }

  /* Wildlife section */
  .wga-wildlife {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-wildlife__grid {
    display: grid;
    gap: var(--wga-spacing-2xl);
    align-items: start;
  }

  @media (min-width: 768px) {
    .wga-wildlife__grid {
      grid-template-columns: 1fr 1fr;
    }
  }

  .wga-wildlife__content {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-xl);
  }

  .wga-wildlife__intro {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-wildlife__tracks,
  .wga-wildlife__signs {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-wildlife__subtitle {
    font-size: var(--wga-font-size-xl);
    font-weight: var(--wga-font-weight-bold);
    color: var(--wga-color-text-primary);
  }

  .wga-wildlife__list {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-sm);
    padding-inline-start: var(--wga-spacing-lg);
    list-style: none;
  }

  .wga-wildlife__list li {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-wildlife__media {
    border-radius: var(--wga-border-radius-xl);
    overflow: hidden;
    box-shadow: var(--wga-shadow-lg);
  }

  .wga-wildlife__image {
    inline-size: 100%;
    block-size: auto;
    display: block;
  }

  /* Safety section */
  .wga-safety {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-safety__content {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-xl);
  }

  .wga-safety__intro {
    font-size: var(--wga-font-size-lg);
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-safety__rules,
  .wga-safety__warning {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-safety__subtitle {
    font-size: var(--wga-font-size-xl);
    font-weight: var(--wga-font-weight-bold);
    color: var(--wga-color-text-primary);
  }

  .wga-safety__list {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
    padding-inline-start: var(--wga-spacing-lg);
    counter-reset: safety-counter;
    list-style: none;
  }

  .wga-safety__item {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
    counter-increment: safety-counter;
    position: relative;
  }

  .wga-safety__item::before {
    content: counter(safety-counter) ". ";
    font-weight: var(--wga-font-weight-bold);
    color: var(--wga-color-accent-primary);
  }

  .wga-safety__warning {
    background-color: #fff3cd;
    border-inline-start: 4px solid #ffc107;
    padding: var(--wga-spacing-lg);
    border-radius: var(--wga-border-radius-md);
  }

  .wga-safety__text {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  /* Journal section */
  .wga-journal {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-journal__intro {
    display: grid;
    gap: var(--wga-spacing-2xl);
    align-items: center;
    margin-block-end: var(--wga-spacing-3xl);
  }

  @media (min-width: 768px) {
    .wga-journal__intro {
      grid-template-columns: 1fr 1fr;
    }
  }

  .wga-journal__image {
    inline-size: 100%;
    block-size: auto;
    border-radius: var(--wga-border-radius-xl);
    box-shadow: var(--wga-shadow-lg);
  }

  .wga-journal__content {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-journal__content p {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-journal__grid {
    display: grid;
    gap: var(--wga-spacing-xl);
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  }

  /* Tips section */
  .wga-tips {
    padding-block: var(--wga-spacing-2xl);
  }

  .wga-tips__grid {
    display: grid;
    gap: var(--wga-spacing-2xl);
    align-items: center;
  }

  @media (min-width: 768px) {
    .wga-tips__grid {
      grid-template-columns: 1fr 1fr;
    }
  }

  .wga-tips__content {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
  }

  .wga-tips__list {
    display: flex;
    flex-direction: column;
    gap: var(--wga-spacing-md);
    list-style: none;
    padding: 0;
  }

  .wga-tips__item {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
  }

  .wga-tips__media {
    border-radius: var(--wga-border-radius-xl);
    overflow: hidden;
    box-shadow: var(--wga-shadow-lg);
  }

  .wga-tips__image {
    inline-size: 100%;
    block-size: auto;
    display: block;
  }

  /* Contact section */
  .wga-contact {
    padding-block: var(--wga-spacing-3xl);
    background-color: var(--wga-color-bg-secondary);
  }

  /* Form additions */
  .wga-form__required {
    color: #e74c3c;
  }

  .wga-form__honeypot {
    position: absolute;
    inset-inline-start: -9999px;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
  }

  .wga-form__checkbox {
    display: flex;
    align-items: flex-start;
    gap: var(--wga-spacing-sm);
  }

  .wga-form__checkbox input[type="checkbox"] {
    margin-block-start: 4px;
    flex-shrink: 0;
  }

  .wga-form__checkbox-text {
    color: var(--wga-color-text-secondary);
    font-size: var(--wga-font-size-sm);
  }

  /* Disclaimer section */
  .wga-disclaimer {
    padding-block: var(--wga-spacing-2xl);
    background-color: #fff3cd;
  }

  .wga-disclaimer__content {
    max-inline-size: 800px;
    margin-inline: auto;
    text-align: center;
  }

  .wga-disclaimer__title {
    font-size: var(--wga-font-size-xl);
    margin-block-end: var(--wga-spacing-md);
    color: #856404;
  }

  .wga-disclaimer__text {
    color: #856404;
    line-height: var(--wga-line-height-relaxed);
  }

  /* Footer additions */
  .wga-footer__tagline {
    color: var(--wga-color-mist-main);
    font-size: var(--wga-font-size-base);
  }

  .wga-footer__heading {
    font-size: var(--wga-font-size-lg);
    margin-block-end: var(--wga-spacing-md);
    color: var(--wga-color-text-inverse);
  }

  .wga-footer__legal {
    font-size: var(--wga-font-size-sm);
    color: var(--wga-color-mist-main);
  }

  /* Legal pages */
  .wga-legal {
    padding-block: var(--wga-spacing-3xl);
  }

  .wga-legal__title {
    font-size: var(--wga-font-size-4xl);
    margin-block-end: var(--wga-spacing-sm);
  }

  .wga-legal__updated {
    color: var(--wga-color-text-secondary);
    font-size: var(--wga-font-size-sm);
    margin-block-end: var(--wga-spacing-xl);
  }

  .wga-legal__content {
    max-inline-size: 800px;
    margin-inline: auto;
  }

  .wga-legal__section {
    margin-block-end: var(--wga-spacing-2xl);
  }

  .wga-legal__section-title {
    font-size: var(--wga-font-size-2xl);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-legal__text {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
    margin-block-end: var(--wga-spacing-md);
  }

  .wga-legal__text:last-child {
    margin-block-end: 0;
  }

  .wga-legal__list {
    padding-inline-start: var(--wga-spacing-xl);
    margin-block: var(--wga-spacing-md);
  }

  .wga-legal__list li {
    color: var(--wga-color-text-secondary);
    line-height: var(--wga-line-height-relaxed);
    margin-block-end: var(--wga-spacing-sm);
  }
}

.bg {
  background: url('../../img/img1.png') no-repeat center center;
}

.whit {
  color: white;
}

.bg1 {
  background: url('../../img/img4.png') no-repeat center center;
}