/* Smart Citizens — responsive / mobile fixes (added 2026-10-06). Loaded last. */

/* The site HTML sits inside 4 nested Elementor containers that each add 10px side padding.
   Remove it so sections run full width (fixes sideways scrolling on phones). */
body.elementor-page .e-con{
  --padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;
  --margin-top:0px;--margin-bottom:0px;--content-width:100%;--container-max-width:100%;
  padding:0!important;margin:0!important;max-width:none!important;
}
body.elementor-page .elementor-widget-text-editor{margin:0!important}
html,body{overflow-x:clip}
img,video,canvas,svg{max-width:100%}

/* tablets */
@media (max-width:1024px){
  .scf-hall .wrap{gap:48px}
}

/* phones */
@media (max-width:760px){
  .wrap{padding-left:20px!important;padding-right:20px!important}
  .section,.scf-latest,.scf-hall{padding-top:72px!important;padding-bottom:72px!important}

  /* long email/address lines must wrap instead of widening the page */
  section.contact .wrap{grid-template-columns:minmax(0,1fr)!important;gap:36px!important}
  .cline,.cline *{overflow-wrap:anywhere;word-break:break-word}
  form.cform{padding:24px 20px!important}

  /* impact numbers: two per row */
  .impact-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .impact-grid .icard{padding:20px 16px!important}
  .impact-grid .icard .big{font-size:26px!important}
  .impact-grid .icard .cap{font-size:13px!important;line-height:1.45!important}

  /* gallery: compact 2-column mosaic */
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:150px!important;grid-auto-flow:dense!important;gap:10px!important}
  .gallery-grid .gitem{grid-column:auto!important;grid-row:auto!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important}
  .gallery-grid .gitem.g-wide{grid-column:span 2!important}
  .gallery-grid .gitem.g-tall{grid-row:span 2!important}
  .gallery-grid .gitem img{width:100%;height:100%;object-fit:cover}

  /* hall video: smaller frame so it fits on screen */
  .scf-hall-stage{width:min(100%,250px)!important}
  .scf-hall-price{left:-18px!important;top:24px!important;padding:10px 14px!important}
  .scf-hall-price b{font-size:26px!important}
  .scf-hall-tag{display:none!important}
  .scf-hall-facts{grid-template-columns:1fr!important;gap:10px!important}
  .scf-hall-facts li{display:flex;align-items:baseline;gap:10px;padding:14px 16px!important}
  .scf-hall-facts b{font-size:19px!important;margin:0!important;flex:0 0 auto}
  .scf-hall-ctas .btn{flex:1 1 auto;text-align:center}

  /* hero buttons full width, easier to tap */
  .hero-ctas{display:flex;flex-direction:column;gap:12px}
  .hero-ctas .btn{text-align:center;width:100%}

  /* footer: link columns side by side */
  footer .wrap{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:32px 20px!important}
  footer .wrap > .foot-brand,footer .wrap > div:last-child{grid-column:1 / -1}

  /* 3D: keep it flat and calm on touch screens */
  .about-photos{transform-style:flat!important;perspective:none!important}
  .scf-orbit{opacity:.45}
  #scf-top{width:46px;height:46px}
  #scf-top svg.ring{width:54px;height:54px}
}

/* small phones */
@media (max-width:380px){
  .impact-grid .icard .big{font-size:22px!important}
  .scf-hero-hall{padding:8px 12px 8px 8px}
}