/* ============ CYBER ESSENTIALS FOOTER BADGE + DIALOG ============
   Kept out of site.css so it ships under a fresh filename (assets are cached 30 days). */

/* Footer: badge pinned to the bottom-right of the link grid, just above the divider.
   The grid's last row only fills its left-hand column(s) at every breakpoint, so this corner is free. */
.footer-grid{position:relative}
.ce-badge{position:absolute; right:0; bottom:36px; display:block; padding:0; margin:0; border:0; background:none; cursor:pointer; border-radius:10px; line-height:0; transition:transform .2s ease, filter .2s ease; filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
.ce-badge img{width:auto; height:104px}
@media (max-width:600px){
  .ce-badge{bottom:24px}
  .ce-badge img{height:112px}
}
.ce-badge:hover{transform:translateY(-2px); filter:drop-shadow(0 8px 20px rgba(0,0,0,.45))}
.ce-badge:focus-visible{outline:2px solid var(--blue-2); outline-offset:4px}

/* Dialog */
html.ce-open{overflow:hidden}
.ce-dialog{width:min(560px, calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid var(--line-2); border-radius:24px; background:linear-gradient(165deg, var(--navy-2), var(--navy) 85%); color:var(--ink-soft); box-shadow:0 30px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.02) inset; overflow:auto}
.ce-dialog::backdrop{background:rgba(4,12,24,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px)}
.ce-dialog[open]{animation:ce-in .22s cubic-bezier(.2,.8,.2,1)}
.ce-dialog[open]::backdrop{animation:ce-fade .22s ease}
@keyframes ce-in{from{opacity:0; transform:translateY(12px) scale(.98)} to{opacity:1; transform:none}}
@keyframes ce-fade{from{opacity:0} to{opacity:1}}

.ce-inner{position:relative; padding:36px 36px 32px}
.ce-close{position:absolute; top:16px; right:16px; display:grid; place-items:center; width:36px; height:36px; padding:0; border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--ink-mute); cursor:pointer; transition:all .2s}
.ce-close:hover{color:#fff; background:rgba(255,255,255,.08); border-color:var(--line-2)}
.ce-close:focus-visible{outline:2px solid var(--blue-2); outline-offset:2px}
.ce-close svg{width:14px; height:14px}

.ce-head{display:flex; align-items:center; gap:22px; padding-right:40px; padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid var(--line)}
.ce-head img{width:auto; height:88px; flex:none; filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
.ce-head .eyebrow{margin-bottom:10px}
.ce-head h2{font-size:24px; line-height:1.15; letter-spacing:-.02em}
.ce-lead{font-size:16px; line-height:1.6; color:var(--ink-bright); margin-bottom:24px}

.ce-section + .ce-section{margin-top:20px}
.ce-section h3{font-size:15px; letter-spacing:-.005em; margin-bottom:6px}
.ce-section p{font-size:14.5px; line-height:1.65; color:var(--ink-mute)}

.ce-link{display:flex; align-items:center; gap:16px; margin-top:28px; padding:16px 18px; border:1px solid var(--line-2); border-radius:14px; background:rgba(255,255,255,.03); transition:background .2s, border-color .2s}
.ce-link:hover{background:rgba(91,168,238,.08); border-color:rgba(91,168,238,.4)}
.ce-link:focus-visible{outline:2px solid var(--blue-2); outline-offset:2px}
.ce-link-icon{display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:10px; background:rgba(91,168,238,.12); color:var(--blue-2)}
.ce-link-icon svg{width:20px; height:20px}
.ce-link-text{display:flex; flex-direction:column; gap:2px; min-width:0}
.ce-link-text strong{color:#fff; font-size:14.5px; font-weight:600}
.ce-link-text span{font-size:12.5px; color:var(--ink-mute)}
.ce-link-arrow{margin-left:auto; flex:none; width:16px; height:16px; color:var(--ink-mute); transition:transform .2s, color .2s}
.ce-link:hover .ce-link-arrow{color:#fff; transform:translate(2px,-2px)}

@media (max-width:560px){
  .ce-inner{padding:28px 22px 24px}
  .ce-head{flex-direction:column; align-items:flex-start; gap:16px; padding-right:0}
  .ce-head img{height:72px}
  .ce-head h2{font-size:21px}
}
@media (prefers-reduced-motion:reduce){
  .ce-dialog[open], .ce-dialog[open]::backdrop{animation:none}
  .ce-badge, .ce-badge:hover{transition:none; transform:none}
}