/* ═══════════════════════════════════════════════════════════════════════════
   Our Operation — Compass Virtual Airlines
   user/themes/compass-virtual/css/operations.css

   The three-brand tabs: Compass Mainline, Compass Express and Compass Cargo.

   ⚑ Lifted out of the page on 2026-09-16 so nothing under
   user/pages/…/operations/ carries a <style> or <script> tag, which Grav 2's
   markdown tagfilter escapes.

   ⚑ Class prefix is ops- and is used by this page alone. These four pages were
   converted together because they were all named default.md, not because they
   share anything: their prefixes are ops-, ul-, np- and aip-, and no rule here
   appears in any of the others.
   ═══════════════════════════════════════════════════════════════════════════ */

.ops-banner{background:linear-gradient(135deg,#1a3a4a 0%,#4a7a8a 100%);padding:24px 28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;border-radius:8px;margin-bottom:16px;color:white;position:relative;overflow:hidden}
.ops-banner::before{content:"";position:absolute;top:-30px;right:-30px;width:200px;height:200px;background:radial-gradient(circle,rgba(200,150,46,0.18) 0%,transparent 70%)}
.ops-banner h1{font-size:24px;font-weight:500;margin:0 0 4px;color:white;position:relative}
.ops-banner p{font-size:13px;color:rgba(255,255,255,0.7);margin:0;position:relative;max-width:640px;line-height:1.5}
.ops-intro{padding:0 4px 18px;color:#4a4f5a;font-size:14px;line-height:1.65}
.ops-intro p{margin:0 0 12px}
.ops-intro p:last-child{margin-bottom:0}
.ops-tabs{display:flex;border-bottom:2px solid #e8f0f3;margin-bottom:20px;flex-wrap:wrap;gap:0}
.ops-tab{padding:10px 20px;font-size:14px;font-weight:500;color:#8a9099;cursor:pointer;border:none;background:none;border-bottom:2px solid transparent;margin-bottom:-2px;font-family:inherit}
.ops-tab:hover{color:#4a7a8a}
.ops-tab.active{color:#4a7a8a;border-bottom-color:#c8962e}
.ops-panel{display:none;padding:8px 4px 0}
.ops-panel.active{display:block}
.ops-panel h3{font-size:17px;color:#4a7a8a;margin:18px 0 10px;font-weight:500}
.ops-panel h3:first-child{margin-top:4px}
.ops-panel p{font-size:14px;line-height:1.7;color:#333;margin:0 0 12px}
.ops-panel p:last-child{margin-bottom:0}
.ops-panel ul{margin:0 0 14px;padding-left:22px}
.ops-panel li{font-size:14px;line-height:1.65;color:#333;margin-bottom:4px}
.ops-fleet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:14px 0 18px}
.ops-fleet-cell{padding:10px 12px;background:#f7fafc;border-radius:6px;border-left:3px solid #c8962e;font-size:13px}
.ops-fleet-cell strong{display:block;color:#4a7a8a;font-size:13px;margin-bottom:2px}
.ops-fleet-cell span{color:#8a9099;font-size:12px}
.ops-callout{padding:14px 18px;background:#fff7e6;border-left:3px solid #c8962e;border-radius:4px;margin:14px 0;font-size:13px;color:#5a4520;line-height:1.6}
.ops-callout strong{color:#4a7a8a}
.ops-route-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:14px 0 18px}
.ops-route-cell{padding:12px 14px;background:#e8f0f3;border-radius:6px;font-size:13px}
.ops-route-cell strong{display:block;color:#4a7a8a;font-size:14px;margin-bottom:4px;font-family:monospace}
.ops-route-cell span{color:#4a4f5a;font-size:12px;line-height:1.5}
