/* Cyb3r Club - mobile responsive overrides.
   The homepage sections are inline-styled React, so these use !important to reflow. */

@media (max-width: 860px){
  .cc-hero-grid,.cc-intel-grid,.cc-book-grid{grid-template-columns:1fr!important;gap:30px!important}
  .cc-pillars-grid{grid-template-columns:1fr 1fr!important}
}

@media (max-width: 760px){
  header,section,footer{padding-left:20px!important;padding-right:20px!important}
  .cc-nav{padding-left:18px!important;padding-right:18px!important}
  /* keep only Booking reachable in the nav (rest is a scroll away) */
  .cc-nav-links a{display:none!important}
  .cc-nav-links a:last-child{display:inline-flex!important}
  .cc-hero-grid h1{font-size:clamp(36px,10.5vw,52px)!important}
  section h2{font-size:clamp(27px,7.5vw,36px)!important}
  /* stack the email signup */
  .cc-recruit-form{flex-direction:column!important}
}

@media (max-width: 460px){
  .cc-pillars-grid,.cc-book-facets{grid-template-columns:1fr!important}
}