/* Add-on pages: tactical-graphics-cesium, -arcgis, -exchange and -tak. Builds on tactical-graphics.css. */
.tga-hero{padding-bottom:64px}
.tga-hero-layout{position:relative;z-index:2;max-width:900px}
.tga-back{display:block;width:fit-content;margin-bottom:22px;color:rgba(255,255,255,.6);font-size:.88rem;font-weight:600}
.tga-back:hover{color:#fff}
.tga-lead{max-width:760px;color:rgba(255,255,255,.72);font-size:1.1rem;line-height:1.75}
.tga-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:8px 0 0;max-width:760px}
.tga-facts div{padding:16px 18px;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);background:rgba(0,0,0,.22)}
.tga-facts dt{color:#fff;font-size:1.5rem;font-weight:750;letter-spacing:-.02em}
.tga-facts dd{margin:4px 0 0;color:rgba(255,255,255,.6);font-size:.85rem;line-height:1.45}
.tga-clips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 28px}
.tga-clip video{display:block;width:100%;aspect-ratio:16/9;border-radius:var(--radius);background:var(--navy-950);box-shadow:0 14px 40px rgba(2,10,24,.18)}
/* A still in place of a clip (the TAK page): the whole picture, letterboxed, opening in the lightbox. */
.tga-shot{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius);background:var(--navy-950);box-shadow:0 14px 40px rgba(2,10,24,.18);cursor:zoom-in}
.tga-shot img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--transition)}
.tga-shot:hover img,.tga-shot:focus-visible img{transform:scale(1.02)}
/* A wide still (a strip of panes): the full row, the picture at its own shape above its text. */
.tga-clip-wide{grid-column:1/-1}
.tga-clip-wide .tga-shot{aspect-ratio:auto}
.tga-clip-wide .tga-shot img{height:auto;object-fit:initial}
.tga-clip-wide p{max-width:820px}
/* A tall still (a WinTAK pane): the full row, the picture at its own shape beside its text. */
.tga-clip-tall{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:28px 44px;align-items:center}
.tga-clip-tall .tga-shot{aspect-ratio:auto;background:none}
.tga-clip-tall .tga-shot img{height:auto;object-fit:initial}
.tga-clip-tall h3{margin-top:0}
.tga-clip h3{margin:16px 0 6px;color:var(--gray-900);font-size:1.12rem;font-weight:700}
.tga-clip p{color:var(--text-body);font-size:.95rem;line-height:1.65}
.tga-details{background:var(--gray-50)}
.tga-columns{display:grid;grid-template-columns:1.1fr .9fr;gap:56px}
.tga-columns h2{margin:12px 0 18px;color:var(--gray-900);font-size:clamp(1.6rem,3vw,2.1rem);font-weight:750;letter-spacing:-.02em}
.tga-columns p{color:var(--text-body);line-height:1.75}
.tga-columns p a{color:var(--accent);font-weight:600}
.tga-subhead{margin-top:36px!important}
.tga-list{margin:0;padding:0;list-style:none}
.tga-list li{position:relative;margin-bottom:12px;padding-left:22px;color:var(--text-body);line-height:1.65}
.tga-list li:before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:2px;background:var(--accent)}
@media(max-width:1000px){.tga-columns{grid-template-columns:1fr;gap:40px}}
@media(max-width:720px){.tga-clips{grid-template-columns:1fr}.tga-clip-tall{grid-template-columns:1fr}.tga-clip-tall .tga-shot{max-width:340px}.tga-facts{grid-template-columns:1fr}}