.sf-gg-stories{display:grid;gap:36px;margin:0 0 40px}
.sf-gg-story{
  background:#fff;
  border:1px solid #dce6f1;
  border-radius:22px;
  padding:28px;
  box-shadow:0 10px 28px rgba(16,32,51,.04);
}
.sf-gg-story-head h3{
  margin:0 0 10px;
  font-size:28px;
  line-height:1.2;
  color:#10233d;
}
.sf-gg-story-head p{
  margin:0;
  color:#5d6b80;
  line-height:1.65;
  font-size:16px;
  max-width:900px;
}
.sf-gg-story-block{margin-top:26px}
.sf-gg-story-label{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:6px 14px;
  margin:0 0 14px;
  border-radius:999px;
  background:#0d223d;
  color:#fff;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-family:verdanaFull,Verdana,Arial,sans-serif;
  font-weight:bold;
}
.sf-gg-story-after .sf-gg-story-label{background:#16c2a5}
.sf-gg-story-hero{margin:0 0 16px}
.sf-gg-story-hero .sf-gg-thumb{width:100%}
.sf-gg-story-hero .sf-gg-thumb-media{aspect-ratio:16/9}
.sf-gg-story-split,
.sf-gg-story-after-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.sf-gg-story-after-grid{grid-template-columns:1fr}
.sf-gg-story-pairs{
  display:grid;
  gap:16px;
}
.sf-gg-story-pairs-equal .sf-gg-story-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  align-items:stretch;
}
.sf-gg-story-pairs-equal .sf-gg-pair-before,
.sf-gg-story-pairs-equal .sf-gg-pair-after{
  min-width:0;
  display:flex;
}
.sf-gg-story-pairs-equal .sf-gg-thumb{
  width:100%;
  display:flex;
  flex-direction:column;
}
.sf-gg-story-pairs-equal .sf-gg-thumb-media{
  /* Matched project photos are 1024×700 */
  aspect-ratio:1024 / 700;
  width:100%;
}
.sf-gg-story-pairs-equal .sf-gg-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.sf-gg-story-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  align-items:stretch;
}
.sf-gg-pair-before .sf-gg-cap:before{
  content:"← ";
  opacity:.55;
}
.sf-gg-pair-after .sf-gg-thumb{
  border-color:#16c2a5;
}
.sf-gg-pair-after .sf-gg-cap{
  color:#0f6b56;
}
.sf-gg-pair-empty{
  min-height:1px;
}
.sf-gg-story-slider{margin-top:28px;max-width:720px}
.sf-gg-story-video{margin-top:26px}
.sf-gg-video-title{
  margin:0 0 8px;
  font-size:20px;
  color:#10233d;
  line-height:1.3;
}
.sf-gg-video-cap{
  margin:0 0 14px;
  color:#5d6b80;
  line-height:1.6;
  font-size:15px;
  max-width:820px;
}
.sf-gg-video-wrap{
  border-radius:18px;
  overflow:hidden;
  background:#0b1e36;
  border:1px solid #dce6f1;
  box-shadow:0 10px 28px rgba(16,32,51,.06);
  aspect-ratio:16/9;
}
.sf-gg-video{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#0b1e36;
}
.sf-gg-video-credit{
  margin:10px 0 0;
  font-size:13px;
  font-weight:800;
  color:#5d6b80;
}
@media (max-width:700px){
  .sf-gg-story{padding:20px}
  .sf-gg-story-split{grid-template-columns:1fr}
  /* Keep before|after side-by-side on mobile; equal square thumbs */
  .sf-gg-story-pair{grid-template-columns:1fr 1fr;gap:10px}
  .sf-gg-story-pairs-equal .sf-gg-cap{font-size:12px;padding:10px 12px}
  .sf-gg-story-head h3{font-size:24px}
}

/* SpecialForce — Graffiti Removal gallery */
.sf-gg-section .sf-gg-label{
  font-size:13px;
  color:#16c2a5;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.16em;
  margin-bottom:14px;
}
.sf-gg-comparisons{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  margin:0 0 40px;
}
.sf-gg-card{
  background:#fff;
  border:1px solid #dce6f1;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(16,32,51,.04);
}
.sf-gg-card-body{padding:18px 20px 22px}
.sf-gg-card h3{
  margin:0 0 8px;
  font-size:22px;
  line-height:1.25;
  color:#10233d;
}
.sf-gg-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  margin:0 0 10px;
  font-size:13px;
  font-weight:800;
  color:#5d6b80;
}
.sf-gg-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.sf-gg-card p{
  margin:0;
  color:#5d6b80;
  line-height:1.6;
  font-size:15px;
}

/* Before / After comparison slider */
.sf-ba{
  position:relative;
  aspect-ratio:4/3;
  background:#0b1e36;
  overflow:hidden;
  user-select:none;
  touch-action:none;
}
.sf-ba img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
  display:block;
}
.sf-ba-after{z-index:1}
.sf-ba-before-wrap{
  position:absolute;
  inset:0 auto 0 0;
  z-index:2;
  width:50%;
  overflow:hidden;
}
.sf-ba-before{
  position:absolute !important;
  top:0;
  left:0;
  height:100% !important;
  width:100%;
  max-width:none !important;
  object-fit:cover;
  object-position:left center;
}
.sf-ba-handle{
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:3px;
  margin-left:-1.5px;
  background:#16c2a5;
  z-index:3;
  cursor:ew-resize;
}
.sf-ba-handle:before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:44px;
  height:44px;
  margin:-22px 0 0 -22px;
  border-radius:50%;
  border:2px solid #fff;
  background:#0d223d;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
}
.sf-ba-handle:after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:16px;
  height:12px;
  margin:-6px 0 0 -8px;
  background:
    linear-gradient(90deg,#fff 0 2px,transparent 2px 7px,#fff 7px 9px,transparent 9px 14px,#fff 14px 16px) center/16px 12px no-repeat;
}
.sf-ba-range{
  position:absolute;
  inset:0;
  z-index:4;
  width:100%;
  height:100%;
  margin:0;
  opacity:0;
  cursor:ew-resize;
}
.sf-ba-badge{
  position:absolute;
  top:12px;
  z-index:5;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  border:1px solid rgba(255,255,255,.45);
  background:rgba(7,24,44,.72);
  pointer-events:none;
}
.sf-ba-badge-before{left:12px}
.sf-ba-badge-after{right:12px}
.sf-ba:focus-within .sf-ba-handle,
.sf-ba-range:focus-visible + .sf-ba-handle{
  outline:2px solid #16c2a5;
  outline-offset:3px;
}

/* Standard grid */
.sf-gg-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.sf-gg-grid-title{
  margin:0 0 16px;
  font-size:22px;
  color:#10233d;
}
.sf-gg-thumb{
  display:block;
  width:100%;
  padding:0;
  border:1px solid #dce6f1;
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  cursor:pointer;
  text-align:left;
  font:inherit;
  color:inherit;
  box-shadow:0 10px 28px rgba(16,32,51,.04);
}
.sf-gg-thumb:focus-visible{
  outline:2px solid #16c2a5;
  outline-offset:3px;
}
.sf-gg-thumb-media{
  aspect-ratio:4/3;
  background:#e8eef5;
  overflow:hidden;
}
.sf-gg-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.sf-gg-thumb figcaption,
.sf-gg-thumb .sf-gg-cap{
  display:block;
  padding:14px 16px;
  font-weight:800;
  color:#314257;
  line-height:1.45;
  font-size:15px;
}

/* Lightbox */
.sf-gg-lightbox{
  position:fixed;
  inset:0;
  z-index:5000;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(7,24,45,.92);
  padding:30px;
}
.sf-gg-lightbox.open{display:flex}
.sf-gg-lightbox-content{
  position:relative;
  max-width:min(1100px,86vw);
  max-height:86vh;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.sf-gg-lightbox-content img{
  max-width:100%;
  max-height:78vh;
  object-fit:contain;
  border-radius:18px;
  box-shadow:0 30px 90px rgba(0,0,0,.45);
  background:#fff;
}
.sf-gg-lightbox-caption{
  margin-top:14px;
  color:#fff;
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  text-align:center;
}
.sf-gg-lightbox-caption strong{font-size:18px}
.sf-gg-lightbox-caption span{color:#d6e4f4;font-weight:800}
.sf-gg-lightbox-close,
.sf-gg-lightbox-arrow{
  border:1px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.12);
  color:#fff;
  cursor:pointer;
  z-index:5010;
}
.sf-gg-lightbox-close{
  position:absolute;
  top:22px;
  right:26px;
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:36px;
  line-height:1;
}
.sf-gg-lightbox-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:58px;
  height:58px;
  border-radius:50%;
  font-size:48px;
  line-height:1;
}
.sf-gg-lightbox-close:hover,
.sf-gg-lightbox-arrow:hover,
.sf-gg-lightbox-close:focus-visible,
.sf-gg-lightbox-arrow:focus-visible{
  background:rgba(255,255,255,.24);
  outline:2px solid #16c2a5;
  outline-offset:2px;
}
.sf-gg-lightbox-prev{left:24px}
.sf-gg-lightbox-next{right:24px}
body.sf-gg-no-scroll{overflow:hidden}

@media (max-width:1000px){
  .sf-gg-comparisons{grid-template-columns:1fr 1fr}
  .sf-gg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .sf-gg-comparisons{grid-template-columns:1fr}
  .sf-gg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sf-gg-lightbox{padding:18px}
  .sf-gg-lightbox-arrow{
    width:46px;
    height:46px;
    font-size:38px;
    top:auto;
    bottom:22px;
    transform:none;
  }
  .sf-gg-lightbox-prev{left:22px}
  .sf-gg-lightbox-next{right:22px}
  .sf-gg-lightbox-close{top:14px;right:14px;width:44px;height:44px}
  .sf-gg-lightbox-content img{max-height:70vh}
}
@media (max-width:420px){
  .sf-gg-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion: reduce){
  .sf-ba-handle{transition:none}
}