/* Session 5 — frontend hardening / edge-case stability
   Scope: public CSS only. No backend, admin, database, content or JS changes. */

/* Keep the custom desktop cursor, but restore the native cursor on touch/mobile.
   This prevents awkward invisible cursor behavior on hybrid devices and improves accessibility. */
@media (hover:none), (pointer:coarse), (max-width:900px){
  body{cursor:auto !important;}
  a,button,input,textarea,select,label,[role="button"]{cursor:pointer !important;}
  #cur,#cur-ring{display:none !important;}
}

/* Respect reduced-motion users and avoid heavy animation jank on weaker devices. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
    transition-duration:.001ms !important;
  }
  .hero-slide,.news-track{transition:none !important;}
}

/* Prevent background/overlay effects from creating accidental horizontal scroll. */
html,body{max-width:100%;overflow-x:hidden;}
body{min-height:100%;}
img,svg,video,canvas{max-width:100%;height:auto;}

/* Session 10 repair note:
   Do NOT use content-visibility:auto on anchor target sections (#services, #about, etc.).
   It can make browsers estimate off-screen section geometry, causing wrong first-tap nav scrolling. */


/* More predictable image boxes for dynamic/CMS/RSS content. */
.hero-slide,
.news-img,
.cms-image,
.cms-card-img,
.pcms-card-img,
.svc-img,
.modal-gallery img,
.cms-gallery img{
  background-color:rgba(7,19,38,.72);
}
.news-img img,
.cms-gallery img,
.modal-gallery img{
  object-fit:cover;
}
.news-img{aspect-ratio:16/9;height:auto;min-height:132px;}
.cms-card-img,.pcms-card-img{aspect-ratio:16/9;height:auto;min-height:130px;}
.cms-image{aspect-ratio:16/9;height:auto;}

/* Keep dynamic text from breaking cards when RSS/CMS content is long. */
.news-title,
.cms-card h3,
.pcms-card h3,
.svc-card h3,
.proc-card h3{
  overflow-wrap:break-word;
  hyphens:auto;
}
.news-summary,
.cms-card p,
.pcms-card p,
.svc-card p,
.proc-card p{
  overflow-wrap:break-word;
}

/* Better tap targets and form behavior on mobile without changing desktop look. */
button,
.lang-btn,
.news-btn,
.cms-cta,
.pcms-cta,
.n-btn,
.m-nav a,
.bottom-nav a{
  -webkit-tap-highlight-color:rgba(0,200,248,.18);
}
input,textarea,select{font-size:16px;}
textarea{resize:vertical;}

/* Safe-area support for modern phones with gesture bars/notches. */
@supports (padding:max(0px)){
  .bottom-nav{
    padding-bottom:max(0px,env(safe-area-inset-bottom));
    height:calc(62px + max(0px,env(safe-area-inset-bottom)));
  }
  @media(max-width:700px){
    body{padding-bottom:max(72px,calc(72px + env(safe-area-inset-bottom)));}
    footer{padding-bottom:max(4.5rem,calc(4.5rem + env(safe-area-inset-bottom))) !important;}
  }
}

/* Keyboard accessibility: visible focus without visually damaging the design. */
:focus-visible{
  outline:2px solid rgba(93,239,255,.95);
  outline-offset:4px;
  box-shadow:0 0 0 4px rgba(0,200,248,.12);
}
.news-btn:focus-visible,
.lang-btn:focus-visible,
.bottom-nav a:focus-visible{
  border-radius:10px;
}

/* Stabilize grids when an admin/content entry is shorter or longer than expected. */
.svc-grid,.proc-grid,.cms-cards,.pcms-grid,.ab-focus-grid{
  align-items:stretch;
}
.svc-card,.proc-card,.cms-card,.pcms-card,.news-card{
  min-width:0;
}

/* Small mobile polish: keep cards readable and avoid cramped CTA rows. */
@media(max-width:600px){
  .news-img{min-height:118px;}
  .cms-card-img,.pcms-card-img{min-height:116px;}
  .cms-image{min-height:190px;}
  .cms-cta-row{gap:1.1rem;}
  .cms-cta,.pcms-cta{width:100%;justify-content:center;text-align:center;}
  .news-controls{padding-bottom:.2rem;}
}
