/* Cloud Security & Assurance — page-specific visuals and layout */
.cs-vis { width: 100%; max-width: 560px; margin-left: auto; }
.cs-tile { transition: stroke-opacity .4s; }
.cs-flag { animation: csPulse 2.6s ease-in-out infinite; }
.cs-fed { animation: csDash 3s linear infinite; }
@keyframes csPulse { 50% { opacity: .35; } }
@keyframes csDash { to { stroke-dashoffset: -36; } }
@media (max-width: 1080px) { .cs-vis { margin: 0; } }

.cs-intro { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.cs-intro h2 { max-width: 16ch; }
@media (max-width: 860px) { .cs-intro { grid-template-columns: 1fr; } }

.cs-night { background: var(--night); }
.cs-night h2 em { color: var(--gold); }
.cs-night .ucase { background: rgba(255,255,255,.03); border-radius: 0; }

/* tool vs assessment contrast */
.cs-vs { display: grid; grid-template-columns: 1fr 1fr; border-radius: 0; overflow: hidden; }
.cs-vs > div { padding: clamp(28px, 3.4vw, 48px); display: grid; gap: 14px; align-content: start; }
.cs-vs > div:first-child { background: var(--white); border: 1px solid var(--line); border-right: 0; }
.cs-vs > div:last-child { background: var(--night); }
.cs-vs p { font: 500 clamp(1.3rem, 1.05rem + .9vw, 1.9rem)/1.25 var(--sans); letter-spacing: -.025em; color: var(--muted); max-width: 30ch; }
.cs-vs > div:last-child p { color: #fff; }
.cs-vs > div:last-child .tag { color: var(--gold); }
@media (max-width: 760px) { .cs-vs { grid-template-columns: 1fr; } .cs-vs > div:first-child { border-right: 1px solid var(--line); border-bottom: 0; } }

.cs-ind { max-width: 42ch; margin-bottom: 18px; font-size: clamp(1.3rem, 1.05rem + .9vw, 1.9rem); line-height: 1.3; color: var(--ink); letter-spacing: -.02em; }

/* balanced grids */
@media (min-width: 1081px) { .caps { grid-template-columns: repeat(3, minmax(0, 1fr)); } .reqs { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ucases { grid-template-columns: repeat(3, minmax(0, 1fr)); } #outcomes .outcomes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.cap, .req, .ucase { border-radius: 0; }
#outcomes .outcomes { border-radius: 0; }

/* tighter vertical rhythm on this long flagship page */
.sec { padding-block: clamp(45px, 5vw, 74px); }
.shead { margin-bottom: clamp(32px, 4vw, 52px); }