/* ==========================================================
   09. BUTTONS
   ========================================================== */

.ent-btn {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 0.65rem;

  min-height: 46px;
  padding: 0.8rem 1.35rem;

  font-family: var(--ent-font-body);
  font-size: 0.72rem;
  font-weight: var(--ent-weight-bold);

  line-height: 1;

  letter-spacing: 0.10em;
  text-transform: uppercase;

  color: var(--ent-forest);
  background: transparent;

  border: 1px solid var(--ent-forest);
  border-radius: var(--ent-radius-sm);

  text-decoration: none;
  cursor: pointer;

  transition:
    background var(--ent-speed-fast) ease,
    color var(--ent-speed-fast) ease,
    border-color var(--ent-speed-fast) ease,
    transform var(--ent-speed-fast) ease;
}

.ent-btn:hover,
.ent-btn:focus-visible {
  background: var(--ent-forest);
  color: var(--ent-white);
}


/* Solid */

.ent-btn--solid {
  background: var(--ent-forest);
  color: var(--ent-white);
}

.ent-btn--solid:hover,
.ent-btn--solid:focus-visible {
  background: var(--ent-moss);
  border-color: var(--ent-moss);
}


/* Light */

.ent-btn--light {
  color: var(--ent-white);
  border-color: rgba(255, 255, 255, 0.70);
}

.ent-btn--light:hover,
.ent-btn--light:focus-visible {
  color: var(--ent-forest);
  background: var(--ent-white);
  border-color: var(--ent-white);
}


/* Cream */

.ent-btn--cream {
  color: var(--ent-forest);

  background: var(--ent-cream);
  border-color: var(--ent-cream);
}

.ent-btn--cream:hover,
.ent-btn--cream:focus-visible {
  color: var(--ent-white);

  background: var(--ent-forest);
  border-color: var(--ent-forest);
}



/* ----------------------------------------------------------
   GUTENBERG BUTTONS — GLOBAL ORANGE VARIANTS

   Apply to the Buttons parent block (or a single Button):
   ent-btn-primary = solid rust (existing class)
   ent-button-primary = alias for previously assigned Gutenberg class
   ent-btn-outline = transparent, rust outline
   ---------------------------------------------------------- */

.wp-block-buttons.ent-btn-primary .wp-block-button__link,
.wp-block-buttons.ent-button-primary .wp-block-button__link,
.wp-block-buttons.ent-btn-outline .wp-block-button__link,
.wp-block-button.ent-btn-primary .wp-block-button__link,
.wp-block-button.ent-button-primary .wp-block-button__link,
.wp-block-button.ent-btn-outline .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 46px;
  padding: 13px 22px !important;
  border: 2px solid var(--ent-rust) !important;
  border-radius: var(--ent-radius-sm) !important;
  font-family: var(--ent-font-body) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background-color 180ms ease, color 180ms ease,
              border-color 180ms ease;
}

/* Solid rust — support the established class and prior alias */
.wp-block-buttons.ent-btn-primary .wp-block-button__link,
.wp-block-buttons.ent-button-primary .wp-block-button__link,
.wp-block-button.ent-btn-primary .wp-block-button__link,
.wp-block-button.ent-button-primary .wp-block-button__link {
  background: var(--ent-rust) !important;
  color: var(--ent-white) !important;
}

/* Transparent with orange border */
.wp-block-buttons.ent-btn-outline .wp-block-button__link,
.wp-block-button.ent-btn-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--ent-forest-dark) !important;
}

/* Both variants share hover and keyboard focus */
.wp-block-buttons:is(.ent-btn-primary, .ent-button-primary, .ent-btn-outline) .wp-block-button__link:hover,
.wp-block-button:is(.ent-btn-primary, .ent-button-primary, .ent-btn-outline) .wp-block-button__link:hover {
  background: var(--ent-forest-dark) !important;
  border-color: var(--ent-forest-dark) !important;
  color: var(--ent-white) !important;
}

.wp-block-buttons:is(.ent-btn-primary, .ent-button-primary, .ent-btn-outline) .wp-block-button__link:focus-visible,
.wp-block-button:is(.ent-btn-primary, .ent-button-primary, .ent-btn-outline) .wp-block-button__link:focus-visible {
  outline: 2px solid var(--ent-forest-dark);
  outline-offset: 3px;
}


/* Specificity fix: the reusable split section has its own outlined
   button rule. Primary buttons within it remain solid rust. */
.ent-section.ent-section-split .wp-block-button:is(.ent-btn-primary, .ent-button-primary) .wp-block-button__link,
.ent-section.ent-section-split .wp-block-buttons:is(.ent-btn-primary, .ent-button-primary) .wp-block-button__link {
  background: var(--ent-rust) !important;
  color: var(--ent-white) !important;
  border: 2px solid var(--ent-rust) !important;
  border-radius: var(--ent-radius-sm, 4px) !important;
  padding: 13px 22px !important;
}

.ent-section.ent-section-split .wp-block-button:is(.ent-btn-primary, .ent-button-primary) .wp-block-button__link:is(:hover, :focus-visible),
.ent-section.ent-section-split .wp-block-buttons:is(.ent-btn-primary, .ent-button-primary) .wp-block-button__link:is(:hover, :focus-visible) {
  background: var(--ent-forest-dark) !important;
  border-color: var(--ent-forest-dark) !important;
  color: var(--ent-white) !important;
}


/* ==========================================================
   10. TEXT LINKS
   ========================================================== */

/* Standard text links */

a.ent-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;

  font-family: var(--ent-font-body);
  font-size: var(--ent-text-xs);
  font-weight: var(--ent-weight-bold);

  letter-spacing: 0.10em;
  text-transform: uppercase;

  color: var(--ent-forest);
  text-decoration: none;
}

a.ent-link::after {
  content: "→";
  transition:
    transform var(--ent-speed-fast) var(--ent-ease);
}

a.ent-link:hover::after {
  transform: translateX(4px);
}

a.ent-link--light {
  color: var(--ent-white);
}


/* ----------------------------------------------------------
   CIRCULAR ARROW VARIATION

   Gutenberg Paragraph Advanced classes:
   ent-link ent-link--circle
   ---------------------------------------------------------- */

p.ent-link--circle {
  display: block;
  width: 100%;
  margin-top: auto !important;
  margin-bottom: 0 !important;
}

/* Link label and layout */

p.ent-link--circle > a {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px;

  width: 100%;

  font-family: var(--ent-font-body);
  font-size: var(--ent-text-xs);
  font-weight: var(--ent-weight-bold);
  letter-spacing: 0.10em;
  text-transform: uppercase;

  color: var(--ent-forest);

  /* Use a border rather than text-decoration.
     This prevents the arrow from inheriting
     an underline. */

  text-decoration: none !important;
  border: 0 !important;
  padding: 0 !important;
}

/* Circular arrow */

p.ent-link--circle > a::after {
  content: "→" !important;

  display: grid !important;
  place-items: center;

  flex: 0 0 38px;
  width: 38px;
  height: 38px;

  border: 2px solid var(--ent-rust);
  border-radius: 50%;

  font-family: var(--ent-font-body);
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;

  color: var(--ent-forest);
  text-decoration: none !important;

  transition:
    transform var(--ent-speed-fast) var(--ent-ease);
}

p.ent-link--circle > a:hover::after {
  transform: translateX(3px);
}






/* ==========================================================
   11. IMAGE SYSTEM
   ========================================================== */

.ent-image {
  display: block;

  width: 100%;
  height: auto;
}

.ent-image--cover {
  width: 100%;
  height: 100%;

  object-fit: cover;
}

.ent-image-frame {
  position: relative;

  overflow: hidden;
}

.ent-image-frame img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition:
    transform var(--ent-speed-slow) var(--ent-ease);
}

.ent-image-frame:hover img {
  transform: scale(1.025);
}


/* ==========================================================
   12. IMAGE OVERLAYS
   ========================================================== */

.ent-overlay {
  position: absolute;
  inset: 0;

  pointer-events: none;
}

.ent-overlay--light {
  background: var(--ent-overlay-light);
}

.ent-overlay--medium {
  background: var(--ent-overlay-medium);
}

.ent-overlay--dark {
  background: var(--ent-overlay-dark);
}

.ent-overlay--gradient {
  background:
    linear-gradient(
      90deg,
      rgba(7, 28, 23, 0.82) 0%,
      rgba(7, 28, 23, 0.48) 42%,
      rgba(7, 28, 23, 0.06) 75%
    );
}


/* ==========================================================
   13. RULES / DIVIDERS
   ========================================================== */

.ent-rule {
  display: block;

  width: 42px;
  height: 1px;

  margin-block: var(--ent-space-4);

  background: currentColor;

  opacity: 0.5;
}

.ent-divider {
  width: 100%;
  height: 1px;

  border: 0;

  background: var(--ent-border);
}


/* ==========================================================
   14. SURFACES
   ========================================================== */

.ent-surface {
  background: var(--ent-white);
}

.ent-surface--cream {
  background: var(--ent-cream);
}

.ent-surface--forest {
  background: var(--ent-forest);
  color: var(--ent-white);
}

.ent-surface--moss {
  background: var(--ent-moss);
  color: var(--ent-white);
}


/* ==========================================================
   15. COLOR UTILITIES
   ========================================================== */

.ent-bg-forest {
  background-color: var(--ent-forest);
}

.ent-bg-moss {
  background-color: var(--ent-moss);
}

.ent-bg-cream {
  background-color: var(--ent-cream);
}

.ent-bg-light {
  background-color: var(--ent-cream-light);
}

.ent-bg-white {
  background-color: var(--ent-white);
}

.ent-text-forest {
  color: var(--ent-forest);
}

.ent-text-light {
  color: var(--ent-white);
}

.ent-text-muted {
  color: var(--ent-muted);
}

.ent-text-rust {
  color: var(--ent-rust);
}


/* ==========================================================
   16. TEXT UTILITIES
   ========================================================== */

.ent-text-center {
  text-align: center;
}

.ent-text-left {
  text-align: left;
}

.ent-text-right {
  text-align: right;
}

.ent-uppercase {
  text-transform: uppercase;

  letter-spacing: var(--ent-tracking-label);
}

.ent-italic {
  font-style: italic;
}

.ent-no-margin {
  margin: 0;
}


/* ==========================================================
   17. SPACING UTILITIES
   ========================================================== */

.ent-mt-0 {
  margin-top: 0;
}

.ent-mt-4 {
  margin-top: var(--ent-space-4);
}

.ent-mt-6 {
  margin-top: var(--ent-space-6);
}

.ent-mt-8 {
  margin-top: var(--ent-space-8);
}

.ent-mb-0 {
  margin-bottom: 0;
}

.ent-mb-4 {
  margin-bottom: var(--ent-space-4);
}

.ent-mb-6 {
  margin-bottom: var(--ent-space-6);
}

.ent-mb-8 {
  margin-bottom: var(--ent-space-8);
}


/* ==========================================================
   18. ACCESSIBILITY
   ========================================================== */

.ent-btn:focus-visible,
.ent-link:focus-visible,
a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

.ent-sr-only {
  position: absolute;

  width: 1px;
  height: 1px;

  padding: 0;
  margin: -1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

  white-space: nowrap;

  border: 0;
}


/* ==========================================================
   GRAVITY FORMS — CONTACT FORM (FORM ID 1)
   Scoped to this form; other Gravity Forms are unaffected.
   ========================================================== */

#gform_wrapper_1 {
  --gf-ctrl-bg-color: var(--ent-white);
  --gf-ctrl-border-color: var(--ent-border);
  --gf-ctrl-border-radius: var(--ent-radius-md);
  --gf-ctrl-font-family: var(--ent-font-body);
  --gf-ctrl-font-size: 16px;
  --gf-label-color-primary: var(--ent-forest-dark);
  color: var(--ent-charcoal);
  font-family: var(--ent-font-body);
}

#gform_wrapper_1 .gform_fields {
  row-gap: 22px;
}

#gform_wrapper_1 .gfield_label,
#gform_wrapper_1 .ginput_complex label {
  color: var(--ent-forest-dark);
  font-family: var(--ent-font-body);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

#gform_wrapper_1 .ginput_complex label {
  font-size: 12px;
  font-weight: 500;
  color: var(--ent-muted);
}

#gform_wrapper_1 :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea) {
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  background: var(--ent-white);
  border: 1px solid var(--ent-border);
  border-radius: var(--ent-radius-md);
  color: var(--ent-charcoal);
  font-family: var(--ent-font-body);
  font-size: 15px;
  line-height: 1.45;
  box-shadow: none;
}

#gform_wrapper_1 textarea {
  height: 160px !important;
  min-height: 160px;
  resize: vertical;
}

#gform_wrapper_1 :is(input, select, textarea):focus-visible {
  border-color: var(--ent-rust);
  outline: 2px solid var(--ent-rust);
  outline-offset: 1px;
}

#gform_wrapper_1 .gform_footer {
  margin-top: 24px;
  padding: 0;
}

#gform_wrapper_1 :is(input.gform_button, button.gform_button, input[type="submit"]) {
  min-height: 46px;
  padding: 13px 24px !important;
  background: var(--ent-rust) !important;
  border: 2px solid var(--ent-rust) !important;
  border-radius: var(--ent-radius-sm) !important;
  color: var(--ent-white) !important;
  font-family: var(--ent-font-body) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: none !important;
  transition: background-color 180ms ease, border-color 180ms ease;
}

#gform_wrapper_1 :is(input.gform_button, button.gform_button, input[type="submit"]):hover {
  background: var(--ent-forest-dark) !important;
  border-color: var(--ent-forest-dark) !important;
}

#gform_wrapper_1 :is(input.gform_button, button.gform_button, input[type="submit"]):focus-visible {
  outline: 2px solid var(--ent-forest-dark);
  outline-offset: 3px;
}

/* ==========================================================
   19. RESPONSIVE — TABLET
   ========================================================== */

@media (max-width: 1024px) {

  .ent-grid--4,
  .ent-grid--6 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}


/* ==========================================================
   20. RESPONSIVE — MOBILE
   ========================================================== */

@media (max-width: 782px) {

  :root {
    --ent-gutter: 20px;
  }


  /* Sections */

  .ent-section {
    padding-block: 64px;
  }

  .ent-section--compact {
    padding-block: 40px;
  }


  /* Typography */

  .ent-display {
    font-size: clamp(3.25rem, 15vw, 5rem);
    line-height: 0.92;
  }

  .ent-lead {
    font-size: 1.05rem;
  }


  /* Grid */

  .ent-grid--2,
  .ent-grid--3,
  .ent-grid--4,
  .ent-grid--6 {
    grid-template-columns: 1fr;
  }


  /* Buttons */

  .ent-btn {
    min-height: 44px;
  }

}


/* ==========================================================
   21. REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

}


/* Explore Natural Tunnel — reusable park event cards */
.ent-park-events {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.ent-park-event {
  min-width: 0;
  background: var(--ent-white, #fff);
  border: 1px solid var(--ent-border-light, #e8e4dd);
  border-radius: 6px;
  overflow: hidden;
}
.ent-park-event__image { aspect-ratio: 1.6; overflow: hidden; }
.ent-park-event__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ent-park-event__body { padding: 22px; }
.ent-park-event__date {
  margin: 0 0 12px !important;
  font: 700 12px/1.5 var(--ent-font-body, sans-serif);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ent-rust, #bd7353);
}
.ent-park-event h3 {
  margin: 0 0 10px !important;
  font: 800 clamp(19px, 2vw, 25px)/1.12 var(--ent-font-body, sans-serif);
  color: var(--ent-forest-dark, #09231d);
}
.ent-park-event__body > p:not(.ent-park-event__date) {
  margin: 0 0 16px !important;
  font: 400 15px/1.6 var(--ent-font-body, sans-serif);
}
.ent-park-event__body > a {
  font: 700 12px/1.3 var(--ent-font-body, sans-serif);
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
  color: var(--ent-rust, #bd7353);
}
@media (max-width: 900px) { .ent-park-events { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 600px) { .ent-park-events { grid-template-columns: minmax(0,1fr); } }





/* ==========================================================
   NATURAL TUNNEL — STATISTICS
   ========================================================== */

.ent-tunnel-stats.wp-block-columns {
  display: flex;
  width: 100%;
  gap: 0 !important;
  align-items: stretch;
}

/* Individual statistic columns */

.ent-tunnel-stats > .wp-block-column {
  flex: 1 1 0 !important;
  min-width: 0;
  padding: 12px 20px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;

  text-align: center;
}

/* Vertical separators */

.ent-tunnel-stats > .wp-block-column + .wp-block-column {
  border-left: 1px solid #d4d4cd;
}

/* Large statistic numbers */

.ent-tunnel-stats h2 {
  font-family: "Manrope", sans-serif;
  font-size: clamp(38px, 3.2vw, 54px);
  font-weight: 800;
  letter-spacing: -0.055em;
  line-height: 1.05;
  color: var(--ent-forest-dark);

  margin: 0 0 12px !important;
  text-align: center;
}

/* Shared paragraph styling */

.ent-tunnel-stats p {
  font-family: "Manrope", sans-serif;
  text-align: center;
  margin: 0;
}

/* Rust-colored labels */

.ent-tunnel-stats p:nth-of-type(1) {
  color: var(--ent-rust);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;

  margin: 0 0 12px !important;
}

/* Descriptive text */

.ent-tunnel-stats p:nth-of-type(2) {
  color: var(--ent-forest-dark);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.6;

  max-width: 180px;
  margin: 0 auto !important;
  text-align: center;
}

/* Tablet and mobile */

@media (max-width: 781px) {

  .ent-tunnel-stats.wp-block-columns {
    flex-direction: column;
  }

  .ent-tunnel-stats > .wp-block-column {
    width: 100%;
    padding: 24px 16px;
  }

  .ent-tunnel-stats > .wp-block-column + .wp-block-column {
    border-left: 0;
    border-top: 1px solid #d4d4cd;
  }

  .ent-tunnel-stats h2 {
    font-size: 42px;
  }

  .ent-tunnel-stats p:nth-of-type(2) {
    max-width: 260px;
  }
}




/* ==========================================================
   NATURAL TUNNEL — DAILY PROGRAM LISTINGS
   ========================================================== */

.ent-daily-program.wp-block-columns {
  display: flex;
  align-items: flex-start;
  gap: 32px !important;
  padding: 32px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(9, 35, 29, 0.12);
}

/* Icon column */
.ent-daily-program > .wp-block-column:first-child {
  flex: 0 0 110px !important;
  max-width: 110px;
  text-align: center;
}

.ent-daily-program > .wp-block-column:first-child img {
  display: block;
  width: 88px;
  height: 88px;
  object-fit: contain;
  margin: 0 auto;
}

/* Content column — keep everything left-aligned */
.ent-daily-program > .wp-block-column:nth-child(2) {
  flex: 1 1 0 !important;
  min-width: 0;
  text-align: left !important;
}

.ent-daily-program > .wp-block-column:nth-child(2) > * {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Program title */
.ent-daily-program h2 {
  font-family: "Manrope", sans-serif;
  font-size: clamp(25px, 2.2vw, 30px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.035em;
  color: var(--ent-forest-dark);
  margin: 0 0 14px !important;
}

/* Supporting information */
.ent-daily-program p {
  font-family: "Manrope", sans-serif;
  margin: 0 0 8px !important;
  line-height: 1.5;
}

/* Date and location */
.ent-daily-program p:nth-of-type(1),
.ent-daily-program p:nth-of-type(2) {
  color: #66736e;
  font-size: 13px;
  font-weight: 500;
}

/* Description */
.ent-daily-program p:nth-of-type(3) {
  color: var(--ent-forest-dark);
  font-size: 15px;
  line-height: 1.65;
  margin-top: 14px !important;
  margin-bottom: 0 !important;
  max-width: 760px;
}

/* Mobile */
@media (max-width: 781px) {
  .ent-daily-program.wp-block-columns {
    gap: 16px !important;
    padding: 26px 0 !important;
  }

  .ent-daily-program > .wp-block-column:first-child {
    flex: 0 0 72px !important;
    max-width: 72px;
  }

  .ent-daily-program > .wp-block-column:first-child img {
    width: 64px;
    height: 64px;
  }

  .ent-daily-program h2 {
    font-size: 23px;
  }
}
