/* Snap Service Center v1.0.0
   Colors use MyCityGov AAA-documented pairs:
   #1b365d on #FFFFFF  (AAA) - text / borders on white cards
   #FFFFFF on #1b365d  (AAA) - text on navy hover fill
*/
.ssc-portal{
  --ssc-navy:#1b365d;
  --ssc-navy-2:#12315e;
  --ssc-ink:#1b365d;
  --ssc-muted:#4a5568;
  --ssc-border:#d0d3d4;
  --ssc-card:#ffffff;
  --ssc-bg:#f5f6f8;
  --ssc-max:1254px;
  --ssc-cols:3;

  box-sizing:border-box;
  width:100%;
  background:var(--ssc-bg);
  padding:3rem 1.25rem;
  font-family:inherit;
}
.ssc-portal *{box-sizing:border-box}

.ssc-inner{
  max-width:var(--ssc-max);
  margin:0 auto;
  text-align:center;
}

.ssc-title{
  margin:0;
  color:var(--ssc-navy);
  font-size:clamp(1.6rem,3.4vw,2.25rem);
  font-weight:800;
  line-height:1.1;
}
.ssc-sub{
  margin:.6rem auto 0;
  max-width:52rem;
  color:var(--ssc-muted);
  font-size:1.05rem;
  line-height:1.55;
}

.ssc-grid{
  margin-top:2rem;
  display:grid;
  grid-template-columns:repeat(var(--ssc-cols),minmax(0,1fr));
  gap:1rem;
}

/* Tile = anchor. bg + text declared together in every state. */
.ssc-tile{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.85rem;
  padding:1.75rem 1.25rem;
  background:var(--ssc-card);
  color:var(--ssc-ink);
  border:1px solid var(--ssc-border);
  border-radius:.9rem;
  text-decoration:none;
  font-weight:700;
  font-size:1.05rem;
  transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
/* LVHA order: link -> visited -> hover -> active */
.ssc-tile:link{background:var(--ssc-card);color:var(--ssc-ink)}
.ssc-tile:visited{background:var(--ssc-card);color:var(--ssc-ink)}
.ssc-tile:hover{
  background:var(--ssc-navy);
  color:#ffffff;
  border-color:var(--ssc-navy);
  transform:translateY(-3px);
  box-shadow:0 14px 30px -18px rgba(27,54,93,.65);
}
.ssc-tile:active{
  background:var(--ssc-navy-2);
  color:#ffffff;
  border-color:var(--ssc-navy-2);
  transform:translateY(-1px);
}
.ssc-tile:focus-visible{
  outline:3px solid var(--ssc-navy);
  outline-offset:3px;
}

.ssc-tile-ico{display:inline-flex;color:inherit}
.ssc-ico{width:38px;height:38px;display:block}
.ssc-tile-label{color:inherit;line-height:1.25}

/* Responsive columns */
@media(max-width:1000px){
  .ssc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .ssc-grid{grid-template-columns:1fr}
}

/* Original behavior: hidden on mobile when enabled */
@media(max-width:768px){
  .ssc-portal.ssc-hide-mobile{display:none}
}

@media(prefers-reduced-motion:reduce){
  .ssc-tile{transition:none}
  .ssc-tile:hover,.ssc-tile:active{transform:none}
}