/* Smart Citizens — upcoming event popup (added 2026-10-07). Flyer colours. */
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&display=swap');
.scf-pop{--p-blue:#1C7FA8;--p-blue-d:#0F5F80;--p-green:#3E8E2B;--p-green-d:#2D6B1E;--p-yellow:#F7C530;--p-pink:#E8447A;--p-sky:#E4F3FB;--p-mint:#EAF6E3;--p-ink:#16384A;
  position:fixed;inset:0;z-index:10001;display:grid;place-items:center;padding:20px;background:rgba(10,30,40,.62);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;transition:opacity .35s ease}
.scf-pop.show{opacity:1}
.scf-pop-card{position:relative;display:grid;grid-template-columns:280px 1fr;width:min(100%,760px);max-height:calc(100vh - 40px);overflow:auto;background:linear-gradient(160deg,#fff 0%,var(--p-sky) 100%);border-radius:28px;box-shadow:0 40px 90px -30px rgba(0,0,0,.55);transform:translateY(24px) scale(.96);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.scf-pop.show .scf-pop-card{transform:none}
.scf-pop-art{position:relative;background:var(--p-mint);overflow:hidden;border-radius:28px 0 0 28px}
.scf-pop-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.scf-pop-bunting{position:absolute;left:0;right:0;top:0;height:26px;display:flex;justify-content:space-around;pointer-events:none}
.scf-pop-bunting i{width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:22px solid var(--c)}
.scf-pop-body{padding:34px 34px 28px;color:var(--p-ink);font-family:Karla,system-ui,sans-serif}
.scf-pop-tag{display:inline-flex;align-items:center;gap:8px;background:var(--p-pink);color:#fff;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
.scf-pop-tag::before{content:"";width:7px;height:7px;border-radius:50%;background:#fff;animation:scf-pop-ping 1.6s ease-out infinite}
@keyframes scf-pop-ping{0%{box-shadow:0 0 0 0 rgba(255,255,255,.8)}100%{box-shadow:0 0 0 8px rgba(255,255,255,0)}}
.scf-pop h2{font-family:Fredoka,system-ui,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(32px,4.4vw,44px);line-height:.95;color:var(--p-blue);margin:14px 0 14px}
.scf-pop h2 span{color:var(--p-green)}
.scf-pop-list{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}
.scf-pop-list li{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px}
.scf-pop-list svg{flex:0 0 30px;width:30px;height:30px;padding:6px;border-radius:9px;background:var(--p-blue);color:#fff}
.scf-pop-list li:nth-child(2) svg{background:var(--p-green)}
.scf-pop-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.scf-pop-chips span{font-size:13px;font-weight:800;padding:5px 11px;border-radius:999px;background:#fff;border:2px solid var(--b);color:var(--p-ink)}
.scf-pop-count{font-family:Fredoka,system-ui,sans-serif;font-weight:600;font-size:15px;color:var(--p-pink);margin:0 0 18px}
.scf-pop-ctas{display:flex;flex-wrap:wrap;gap:10px}
.scf-pop-ctas a{display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;text-decoration:none;padding:12px 18px;border-radius:999px;transition:translate .3s,background .3s}
.scf-pop-ctas a:hover{translate:0 -2px}
.scf-pop-ctas .p1{background:var(--p-green);color:#fff;box-shadow:0 12px 24px -12px rgba(62,142,43,.8)}
.scf-pop-ctas .p1:hover{background:var(--p-green-d)}
.scf-pop-ctas .p2{background:var(--p-blue);color:#fff}
.scf-pop-ctas .p3{border:2px solid var(--p-blue);color:var(--p-blue);background:#fff}
.scf-pop-ctas .p4{background:#02A95C;color:#fff;box-shadow:0 12px 24px -12px rgba(2,169,92,.75)}
.scf-pop-ctas .p4:hover{background:#028C4C}
.scf-pop-later{display:inline-block;margin-top:14px;background:none;border:0;padding:0;color:#5B7886;font-size:13px;text-decoration:underline;cursor:pointer}
.scf-pop-x{position:absolute;top:12px;right:12px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:var(--p-ink);font-size:24px;line-height:1;cursor:pointer;box-shadow:0 6px 16px -6px rgba(0,0,0,.35)}
.scf-pop-x:focus-visible,.scf-pop-ctas a:focus-visible,.scf-pop-later:focus-visible{outline:3px solid var(--p-yellow);outline-offset:3px}

@media (max-width:700px){
  .scf-pop{padding:12px;align-items:end}
  .scf-pop-card{grid-template-columns:1fr;border-radius:24px;max-height:calc(100vh - 24px)}
  .scf-pop-art{height:170px;border-radius:24px 24px 0 0}
  .scf-pop-art img{object-position:50% 22%}
  .scf-pop-body{padding:22px 20px 20px}
  .scf-pop-ctas a{flex:1 1 100%}
  .scf-pop-ctas .p3,.scf-pop-ctas .p4{flex:1 1 40%;padding:12px 10px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){.scf-pop,.scf-pop-card{transition:none}.scf-pop-tag::before{animation:none}}
