/* mobile.css - FINAL "ANTI-SQUISH" VERSION */

/* --- 1. GLOBAL SAFETY & RESETS --- */
html, body, 
.dmBody, 
.dmInner, 
.dmOuter, 
.dmLayoutWrapper, 
.dmRespRow, 
.dmRespColsWrapper {
    width: 100% !important;
    min-width: 0 !important;    
    max-width: 100vw !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Fix Video Hero */
.hero-video-wrapper {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
}
.hero-video-wrapper iframe {
    width: 100% !important;
    max-width: none !important;
}

/* --- 2. GLOBAL COLUMN RESET --- */
/* Forces columns to stack vertically instead of side-by-side */
.dmRespCol {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: auto !important;
    float: none !important;
    display: block !important;
    min-height: auto !important;
}

/* --- 3. FIX BUTTONS & TILES (Keep Centered) --- */
*#dm *.dmBody div.u_1817751962 .dmRespCol, /* Buttons */
*#dm *.dmBody div.u_1568750159 .dmRespCol  /* Tiles */
{
    width: 90% !important; 
    max-width: 350px !important; 
    margin: 0 auto 20px auto !important;
}
/* --- 4. WE LOVE KAYAKING - FINAL FIX (MOBILE + TABLET) --- */
div#1634285036,          /* Row */
div#1290291432,          /* Wrapper */
div#1648180249,          /* Column */
div#1648180249 *,        /* Everything inside */
.dmRespCol[id="1648180249"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    float: none !important;
    flex: none !important;
}

/* Kill any leftover inline padding Duda injects */
div#1648180249[style*="padding"],
div#1290291432[style*="padding"],
div#1634285036[style*="padding"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* Ensure the text paragraph inside expands too */
div#1648180249 .dmNewParagraph {
    display: block !important;
    width: 100% !important;
    white-space: normal !important; /* Prevents text from staying on one line */
}

/* --- 5. FOOTER REPAIR --- */
/* Force footer containers to stack */
.dmFooterContainer, 
#dm_footer, 
footer, 
.footer-section,
.dmFooterContainer .dmRespRow,
.dmFooterContainer .dmRespColsWrapper {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    height: auto !important;
    flex: none !important;
}

.dmFooterContainer .dmRespCol, 
#dm_footer .dmRespCol {
    width: 100% !important;
    margin-bottom: 30px !important;
    display: block !important;
    text-align: center !important;
    padding: 0 15px !important;
}

/* --- 6. ABOUT US & SLIDER FIX (Reverse Column Row) --- */
/* Fixes the About Us section and Image Slider */
div#1386330993,
div#1494034805 {
    display: block !important;
    width: 100% !important;
}

/* Adds padding to the About Us Text */
div#AboutUsHomePage {
    padding: 30px 20px !important;
}

/* Ensures the Slider/Image fits the screen */
div#1302966328 {
    padding: 0 !important;
    width: 100% !important;
}

/* Add this to the very end of mobile.css */
div#1648180249,
div#1648180249 * {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
}

/* FIX MOBILE HAMBURGER MENU ON HOME PAGE ONLY */
@media (max-width: 768px) {
  .dmHeader, #dmNav, .dmMobileMenuButton {
    position: relative !important;
    z-index: 99999 !important;   /* force menu on top of everything */
  }
  
  .hero-video-wrapper, .dmRespRow.fullBleedMode {
    pointer-events: none !important;  /* let taps pass through hero */
    z-index: 0 !important;            /* push hero behind menu */
  }
  
  .dmMobileMenuButton * {
    pointer-events: auto !important;  /* but let the button itself be tappable */
  }
}

/* FINAL IPHONE HAMBURGER FIX – 100% GUARANTEED */
@media (max-width: 768px) {
  /* Force the hamburger button to the absolute top layer */
  .dmMobileMenuButton,
  .dmMobileMenuButton *,
  #dmNav a[href*="javascript:void(0)"] {
    position: relative !important;
    z-index: 999999 !important;
    pointer-events: auto !important;
  }

  /* Kill any invisible overlay from logo or header */
  .dmHeader .dmLogo,
  .dmHeader,
  .dmHeader::before,
  .dmHeader::after {
    pointer-events: none !important;
  }

  /* But make sure the logo itself is still tappable if you want it to go home */
  .dmHeader .dmLogo a {
    pointer-events: auto !important;
  }
}
/* IPHONE SAFARI HAMBURGER FIX – clears cache ghosts & forces taps */
@media only screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 3) {  /* iPhone Pro Max */
  .dmMobileMenuButton {
    position: fixed !important;     /* force it out of flow */
    top: 20px !important;           /* position above header */
    right: 20px !important;
    z-index: 1000000 !important;    /* nuclear z-index */
    background: rgba(255,255,255,0.95) !important;  /* make it visible if hidden */
    padding: 12px !important;
    border-radius: 8px !important;
    pointer-events: auto !important;
  }
  
  .dmMobileMenuButton::before {  /* force the 3 lines to show */
    content: '☰' !important;      /* Unicode hamburger if Duda's SVG fails */
    font-size: 28px !important;
    color: #000 !important;
  }
  
  /* Kill any iPhone-specific overlay */
  body::before, .dmHeader::before {
    pointer-events: none !important;
  }
}