/* Eagles Nest Tabernacle — responsive / mobile layer
   Overrides the design's fixed inline styles below 820px. */

html, body { overflow-x: hidden; }
img, figure, video { max-width: 100%; }

/* Hamburger button is hidden on desktop */
.en-burger { display: none; }

@media (max-width: 820px) {

  /* ---- Collapse multi-column grids to a single column ---- */
  [style*="grid-template-columns:1.4fr 1fr 1fr"],
  [style*="grid-template-columns:1.05fr 1fr"],
  [style*="grid-template-columns:0.9fr 1.1fr"],
  [style*="grid-template-columns:1.05fr 0.95fr"],
  [style*="grid-template-columns:1fr 1.05fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns:repeat(2"] {
    grid-template-columns: 1fr !important;
  }

  /* ---- Gallery: two columns instead of six, flexible row height ---- */
  [style*="grid-template-columns:repeat(6"] {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-auto-rows: 46vw !important;
  }
  /* Items that spanned 3-4 columns can't span more than the 2 we now have */
  [style*="grid-column:span 3"],
  [style*="grid-column:span 4"] { grid-column: span 2 !important; }
  [style*="grid-row:span 2"] { grid-row: span 1 !important; }

  /* ---- Mobile navigation (hamburger) ---- */
  .en-burger {
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    gap: 5px; width: 44px; height: 44px; padding: 0;
    background: none; border: none; cursor: pointer; color: inherit;
    position: relative; z-index: 3;
  }
  .en-burger span {
    display: block; width: 25px; height: 2px; background: currentColor;
    transition: transform .3s ease, opacity .2s ease;
  }
  nav.menu-open .en-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  nav.menu-open .en-burger span:nth-child(2) { opacity: 0; }
  nav.menu-open .en-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* The inline links row becomes a dropdown panel */
  nav > .en-navlinks {
    position: absolute; top: 100%; left: 0; right: 0;
    display: none !important;
    flex-direction: column !important; align-items: stretch !important; gap: 0 !important;
    background: rgba(251, 247, 238, .98);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    padding: 6px clamp(22px, 6vw, 40px) 18px;
    box-shadow: 0 22px 34px -20px rgba(41, 32, 26, .55);
    border-top: 1px solid rgba(176, 137, 76, .2);
  }
  nav.menu-open > .en-navlinks { display: flex !important; }

  nav > .en-navlinks a {
    color: #2A2118 !important;
    padding: 15px 4px !important;
    border-bottom: 1px solid rgba(176, 137, 76, .16);
    font-size: 18px !important;
    transform: none !important;
    text-align: left;
  }
  /* The "Plan a Visit" button keeps its gold look, full width */
  nav > .en-navlinks a:last-child {
    margin-top: 12px; border-bottom: none; text-align: center;
    color: #FBF7EE !important;
  }
}

/* Small phones: a touch more breathing room */
@media (max-width: 460px) {
  [style*="grid-template-columns:repeat(6"] { grid-template-columns: repeat(2, 1fr) !important; grid-auto-rows: 44vw !important; }
}
