/* service_devops.html — extracted internal + inline styles */

    /* ---- Terminal ---- */
    .dv-term { background:#0b1220; border-radius:1rem; box-shadow:0 2rem 4rem rgba(11,18,32,.4); overflow:hidden;
        font-family:'SFMono-Regular',ui-monospace,Menlo,Consolas,monospace; }
    .dv-term__bar { display:flex; align-items:center; padding:.75rem .95rem; background:#111a2e; border-bottom:1px solid #1c2740; }
    .dv-term__dot { width:.62rem; height:.62rem; border-radius:50%; margin-right:.4rem; }
    .dv-term__title { color:#7c89a8; font-size:.74rem; margin-left:.6rem; }
    .dv-term__body { padding:1.1rem 1.25rem; font-size:.78rem; line-height:1.9; }
    .dv-term__body .ln { white-space:nowrap; overflow:hidden; }
    .c-green{color:#4ade80;} .c-cyan{color:#38bdf8;} .c-gray{color:#7f8fb2;} .c-yellow{color:#fbbf24;}
    .c-white{color:#e6ecf7;} .c-pink{color:#f472b6;} .c-red{color:#fb7185;}
    .dv-cursor{ display:inline-block; width:.52rem; height:.95rem; background:#4ade80; vertical-align:-1px; animation:dvblink 1.1s steps(1) infinite; }
    @keyframes dvblink{50%{opacity:0;}}

    /* ---- CI/CD Pipeline ---- */
    .dv-pipe{ display:flex; align-items:flex-start; flex-wrap:wrap; overflow-x:clip; }
    .dv-stage{ flex:1 1 0; min-width:120px; text-align:center; position:relative; padding:0 .2rem; }
    .dv-stage::after{ content:''; position:absolute; top:1.75rem; left:50%; width:100%; height:4px;
        background:linear-gradient(90deg,#22c55e,#38bdf8); z-index:0; border-radius:4px; }
    .dv-stage:last-child::after{ display:none; }
    .dv-stage__ic{ position:relative; z-index:1; width:3.5rem; height:3.5rem; border-radius:50%; margin:0 auto .85rem;
        display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.25rem;
        box-shadow:0 .7rem 1.5rem rgba(34,197,94,.28); }
    .dv-pass{ display:inline-block; font-size:.66rem; font-weight:700; color:#16a34a; background:#dcfce7;
        border-radius:2rem; padding:.14rem .55rem; margin-top:.45rem; }

    /* ---- Feature cards ---- */
    .dv-feat{ background:#fff; border:1px solid #eef0f6; border-radius:1.1rem; height:100%;
        transition:transform .32s ease, box-shadow .32s ease, border-color .32s ease; }
    .dv-feat:hover{ transform:translateY(-.55rem); box-shadow:0 1.7rem 3.2rem rgba(15,23,42,.16); border-color:transparent; }
    .dv-feat__ic{ width:3.5rem; height:3.5rem; border-radius:.95rem; display:flex; align-items:center; justify-content:center; }
    .dv-tag{ display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.03em; padding:.2rem .6rem;
        border-radius:2rem; margin-top:.7rem; }

    /* ---- Dark ops band ---- */
    .dv-dark{ background:radial-gradient(1200px 500px at 15% 10%,#16233d 0%,#0b1220 55%); }
    .dv-metric{ border:1px solid #1e2b47; border-radius:1rem; background:rgba(255,255,255,.025); }
    .dv-live{ display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; color:#4ade80; font-weight:700; }
    .dv-live .pulse{ width:.5rem; height:.5rem; border-radius:50%; background:#4ade80; box-shadow:0 0 0 0 rgba(74,222,128,.7); animation:dvpulse 1.6s infinite; }
    @keyframes dvpulse{ 70%{box-shadow:0 0 0 .5rem rgba(74,222,128,0);} 100%{box-shadow:0 0 0 0 rgba(74,222,128,0);} }

    /* ---- Backup / dedup visual ---- */
    .dv-blk{ height:1.35rem; border-radius:.35rem; }
    .dv-chip2{ display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border-radius:2rem; background:#fff;
        box-shadow:0 .4rem 1.1rem rgba(15,23,42,.08); font-weight:600; font-size:.82rem; margin:.28rem; }

    /* ---- Scaling diagram ---- */
    .dv-node{ border-radius:.7rem; background:#fff; border:1px solid #e6e9f2; box-shadow:0 .5rem 1.3rem rgba(15,23,42,.07);
        display:flex; align-items:center; justify-content:center; font-weight:700; color:#5f6ac4; }
    .dv-lb{ background:linear-gradient(120deg,#0ea5e9,#22c55e); color:#fff; border:0; }

/* ---- generated classes for inline styles ---- */
.gen-1{ top: 9%; left: 3%; }
.gen-2{ bottom: 5%; right: 2%; }
.gen-3{ z-index: 2; }
.gen-4{ bottom: -1.5rem; right: -1rem; width: 92%; height: 90%; z-index: 0 !important; }
.gen-5{ z-index: 1; }
.gen-6{ background:#ff5f57; }
.gen-7{ background:#febc2e; }
.gen-8{ background:#28c840; }
.gen-9{ top: 4%; left: -1.7rem; z-index: 2; max-width: 11.5rem; }
.gen-10{ bottom: 3%; right: -1.7rem; z-index: 2; max-width: 12rem; }
.gen-11{ z-index: 3; }
.gen-12{ background:linear-gradient(135deg,#845ef7,#5f3dc4); }
.gen-13{ background:linear-gradient(135deg,#4dabf7,#1c7ed6); }
.gen-14{ background:linear-gradient(135deg,#22b8cf,#0c8599); }
.gen-15{ background:linear-gradient(135deg,#20c997,#0ca678); }
.gen-16{ background:linear-gradient(135deg,#51cf66,#2f9e44); }
.gen-17{ width:3.2rem; }
.gen-18{ background:linear-gradient(90deg,#5f3dc4,#845ef7); }
.gen-19{ width:4.5rem; }
.gen-20{ width:14%;background:#38bdf8; }
.gen-21{ width:9%;background:#38bdf8; }
.gen-22{ width:11%;background:#38bdf8; }
.gen-23{ width:7%;background:#38bdf8; }
.gen-24{ width:2.6rem;height:2.6rem; }
.gen-25{ width:3.6rem;height:3.6rem; }
.gen-26{ width:4.8rem;height:4.8rem; }
.gen-27{ width:100%;height:2.2rem; }
.gen-28{ width:2.6rem;height:3rem; }
.gen-29{ height:.35rem;background:#1e2b47; }
.gen-30{ width:32%; }
.gen-31{ width:58%; }
.gen-32{ height: 130px; }
