/* cybersecurity: estilos migrados preservando el diseño original. */

/* ==========================================================
   CYBERSECURITY
   PROJECT SENTINEL — COMPLETE ARTICLE DESIGN
   ========================================================== */


/* ==========================================================
   1. VARIABLES Y CONFIGURACIÓN GENERAL
   ========================================================== */

body.article-page.cybersecurity-page {
    --sentinel-bg: #0c1016;
    --sentinel-bg-soft: #10151d;
    --sentinel-panel: #151b24;
    --sentinel-panel-light: #1b222d;
    --sentinel-panel-deep: #090d12;

    --sentinel-border: rgba(145, 160, 180, 0.16);
    --sentinel-border-strong: rgba(145, 160, 180, 0.28);

    --sentinel-text: #f4f6f8;
    --sentinel-muted: #8b96a5;
    --sentinel-muted-soft: #667180;

    --sentinel-green: #38db8c;
    --sentinel-green-soft: rgba(56, 219, 140, 0.12);

    --sentinel-gold: #c69849;
    --sentinel-gold-light: #e2bd73;

    --sentinel-yellow: #f0c94b;
    --sentinel-red: #ff667a;
    --sentinel-blue: #63a8ff;

    overflow-x: hidden;

    background: var(--sentinel-bg);
    color: var(--sentinel-text);
}


body.article-page.cybersecurity-page main {
    overflow: hidden;
}


body.article-page.cybersecurity-page * {
    box-sizing: border-box;
}


body.article-page.cybersecurity-page button,
body.article-page.cybersecurity-page a {
    -webkit-tap-highlight-color: transparent;
}


.sentinel-content-shell {
    width: min(1380px, calc(100% - 80px));
    margin: 0 auto;
}


.sentinel-eyebrow {
    margin: 0;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.18em;

    text-transform: uppercase;
}


.sentinel-eyebrow.warning {
    color: var(--sentinel-yellow);
}



/* ==========================================================
   2. HERO
   ========================================================== */

body.article-page .sentinel-hero {
    position: relative;

    min-height: calc(100vh - 90px);
    padding-top: 110px;

    overflow: hidden;

    background:
        radial-gradient(circle at 75% 32%,
            rgba(56, 219, 140, 0.08),
            transparent 28%),
        radial-gradient(circle at 20% 34%,
            rgba(198, 152, 73, 0.08),
            transparent 30%),
        linear-gradient(145deg,
            #0a0e14 0%,
            #0d1219 52%,
            #10161e 100%);

    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-grid {
    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(rgba(255, 255, 255, 0.025) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px);

    background-size: 56px 56px;

    mask-image:
        linear-gradient(to bottom,
            black 0%,
            rgba(0, 0, 0, 0.75) 72%,
            transparent 100%);

    pointer-events: none;
}


body.article-page .sentinel-scan {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(90deg,
            transparent,
            rgba(56, 219, 140, 0.85),
            transparent);

    box-shadow:
        0 0 24px rgba(56, 219, 140, 0.42);

    animation:
        sentinel-scan-move 8s linear infinite;

    pointer-events: none;
}


@keyframes sentinel-scan-move {

    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(900px);
    }

}

body.article-page .sentinel-hero-shell {
    position: relative;
    z-index: 5;

    width: min(1460px, calc(100% - 80px));
    min-height: 760px;
    margin: 0 auto;
    padding-bottom: 80px;
}

/* ==========================================================
   3. TEXTO DEL HERO
   ========================================================== */

body.article-page .sentinel-hero-copy {
    position: relative;
    z-index: 8;

    width: min(560px, 43%);
    min-width: 0;
    padding-top: 70px;
}

body.article-page .sentinel-live-label {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    padding: 10px 14px;

    background: rgba(56, 219, 140, 0.06);

    border: 1px solid rgba(56, 219, 140, 0.23);
    border-radius: 3px;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.14em;

    text-transform: uppercase;
}


body.article-page .sentinel-live-dot,
body.article-page .sentinel-status-dot {
    flex: 0 0 auto;

    width: 7px;
    height: 7px;

    background: var(--sentinel-green);

    border-radius: 50%;

    box-shadow:
        0 0 0 6px rgba(56, 219, 140, 0.1),
        0 0 18px rgba(56, 219, 140, 0.75);

    animation:
        sentinel-pulse 2s ease-in-out infinite;
}


@keyframes sentinel-pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.42;
        transform: scale(0.72);
    }

}


body.article-page .sentinel-reference {
    margin: 34px 0 0;

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.54rem;
    letter-spacing: 0.18em;

    text-transform: uppercase;
}


body.article-page .sentinel-hero h1 {
    margin: 30px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: clamp(5.2rem, 7vw, 8.6rem);
    font-weight: 500;
    line-height: 0.73;
    letter-spacing: -0.055em;

    text-transform: uppercase;
}


body.article-page .sentinel-hero h1 span {
    display: block;
}


body.article-page .sentinel-outline-word {
    margin-left: 7%;

    color: transparent;

    -webkit-text-stroke:
        1px rgba(244, 246, 248, 0.68);

}


body.article-page .sentinel-hero-description {
    max-width: 600px;
    margin: 44px 0 0;

    color: var(--sentinel-muted);

    font-size: 0.88rem;
    line-height: 1.9;
}


body.article-page .sentinel-hero-actions {
    display: flex;
    align-items: center;
    gap: 28px;

    margin-top: 38px;
}


body.article-page .sentinel-primary-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 46px;
    padding: 0 21px;

    background: var(--sentinel-green);

    border: 1px solid var(--sentinel-green);

    color: #07110c;

    font-family: monospace;
    font-size: 0.56rem;
    font-weight: 700;
    letter-spacing: 0.12em;

    text-decoration: none;
    text-transform: uppercase;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background-color 0.3s ease;
}


body.article-page .sentinel-primary-link:hover {
    background: #63eba8;

    box-shadow:
        0 14px 35px rgba(56, 219, 140, 0.2);

    transform: translateY(-3px);
}


body.article-page .sentinel-hero-actions>span {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.5rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}



/* ==========================================================
   4. CENTRO DE OPERACIONES
   ========================================================== */

body.article-page .sentinel-command-center {
    position: absolute;
    top: 10px;
    left: 46%;
    right: -2%;
    z-index: 6;

    min-width: 0;
    min-height: 660px;

    overflow: hidden;

    background:
        linear-gradient(150deg,
            rgba(25, 32, 42, 0.98),
            rgba(11, 15, 21, 0.99));

    border: 1px solid var(--sentinel-border-strong);
    border-radius: 4px;

    box-shadow:
        0 40px 110px rgba(0, 0, 0, 0.42),
        0 0 80px rgba(56, 219, 140, 0.035);

    transform: rotate(0.7deg);
}


body.article-page .sentinel-command-center::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        repeating-linear-gradient(to bottom,
            transparent 0,
            transparent 3px,
            rgba(255, 255, 255, 0.012) 4px);

    pointer-events: none;
}


body.article-page .sentinel-command-center::after {
    content: "SENTINEL";

    position: absolute;
    top: 84px;
    right: -25px;
    z-index: 0;

    color: rgba(56, 219, 140, 0.025);

    font-family: monospace;
    font-size: 6.8rem;
    font-weight: 700;
    letter-spacing: 0.11em;

    writing-mode: vertical-rl;

    pointer-events: none;
}


body.article-page .sentinel-command-topbar {
    position: relative;
    z-index: 5;

    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 58px;
    padding: 0 23px;

    background: rgba(255, 255, 255, 0.018);

    border-bottom: 1px solid var(--sentinel-border);

    font-family: monospace;
    font-size: 0.52rem;
    letter-spacing: 0.14em;

    text-transform: uppercase;
}


body.article-page .sentinel-command-topbar>div {
    display: flex;
    align-items: center;
    gap: 12px;
}


body.article-page .sentinel-command-topbar strong {
    color: var(--sentinel-muted);
    font-weight: 500;
}


body.article-page .sentinel-live-status {
    color: var(--sentinel-green);
}



/* ==========================================================
   5. MAPA
   ========================================================== */

body.article-page .sentinel-map {
    position: relative;
    z-index: 4;

    height: 410px;
    margin: 22px;

    overflow: hidden;

    background:
        radial-gradient(circle at 50% 50%,
            rgba(56, 219, 140, 0.075),
            transparent 45%),
        linear-gradient(145deg,
            rgba(18, 25, 33, 0.9),
            rgba(10, 14, 19, 0.96));

    border: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-map-grid {
    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(rgba(56, 219, 140, 0.035) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(56, 219, 140, 0.035) 1px,
            transparent 1px);

    background-size: 34px 34px;
}


body.article-page .sentinel-map-radar {
    position: absolute;
    top: 50%;
    left: 52%;

    width: 300px;
    height: 300px;

    border: 1px solid rgba(56, 219, 140, 0.08);
    border-radius: 50%;

    transform: translate(-50%, -50%);
}


body.article-page .sentinel-map-radar::before,
body.article-page .sentinel-map-radar::after {
    content: "";

    position: absolute;
    top: 50%;
    left: 50%;

    border: 1px solid rgba(56, 219, 140, 0.07);
    border-radius: 50%;

    transform: translate(-50%, -50%);
}


body.article-page .sentinel-map-radar::before {
    width: 205px;
    height: 205px;
}


body.article-page .sentinel-map-radar::after {
    width: 108px;
    height: 108px;
}


body.article-page .sentinel-land {
    position: absolute;
    z-index: 2;

    background: rgba(120, 139, 157, 0.12);

    border: 1px solid rgba(130, 151, 170, 0.15);

    filter:
        drop-shadow(0 0 14px rgba(56, 219, 140, 0.045));
}


body.article-page .land-america {
    top: 29%;
    left: 10%;

    width: 145px;
    height: 115px;

    clip-path:
        polygon(3% 26%,
            31% 5%,
            67% 12%,
            98% 40%,
            80% 69%,
            62% 100%,
            29% 88%,
            9% 60%);
}


body.article-page .land-europe {
    top: 23%;
    left: 42%;

    width: 95px;
    height: 70px;

    clip-path:
        polygon(8% 20%,
            38% 3%,
            76% 8%,
            100% 40%,
            74% 84%,
            32% 100%,
            0 57%);
}


body.article-page .land-africa {
    top: 43%;
    left: 45%;

    width: 108px;
    height: 140px;

    clip-path:
        polygon(14% 0,
            81% 8%,
            100% 38%,
            70% 78%,
            46% 100%,
            19% 75%,
            0 30%);
}


body.article-page .land-asia {
    top: 23%;
    right: 8%;

    width: 195px;
    height: 125px;

    clip-path:
        polygon(2% 33%,
            27% 3%,
            64% 10%,
            100% 38%,
            86% 78%,
            54% 95%,
            18% 100%,
            7% 68%);
}


body.article-page .land-australia {
    right: 12%;
    bottom: 11%;

    width: 82px;
    height: 58px;

    clip-path:
        polygon(13% 17%,
            67% 0,
            100% 41%,
            79% 88%,
            34% 100%,
            0 57%);
}


body.article-page .sentinel-route {
    position: absolute;
    z-index: 3;

    height: 1px;

    background:
        linear-gradient(90deg,
            transparent,
            rgba(56, 219, 140, 0.78),
            transparent);

    transform-origin: left;

    animation:
        sentinel-route-glow 3s ease-in-out infinite;
}


body.article-page .route-one {
    top: 43%;
    left: 24%;

    width: 220px;

    transform: rotate(-8deg);
}


body.article-page .route-two {
    top: 35%;
    left: 49%;

    width: 260px;

    transform: rotate(4deg);
}


body.article-page .route-three {
    top: 47%;
    left: 49%;

    width: 270px;

    transform: rotate(23deg);
}


body.article-page .route-four {
    top: 58%;
    left: 50%;

    width: 265px;

    transform: rotate(36deg);
}


@keyframes sentinel-route-glow {

    0%,
    100% {
        opacity: 0.25;
    }

    50% {
        opacity: 1;
    }

}


body.article-page .sentinel-location {
    position: absolute;
    z-index: 5;

    color: var(--sentinel-muted);

    font-family: monospace;
    font-size: 0.46rem;

    white-space: nowrap;
}


body.article-page .sentinel-location>span {
    display: block;

    width: 8px;
    height: 8px;

    background: var(--sentinel-green);

    border-radius: 50%;

    box-shadow:
        0 0 0 7px rgba(56, 219, 140, 0.09),
        0 0 18px rgba(56, 219, 140, 0.8);

    animation:
        sentinel-location-pulse 2.4s ease-in-out infinite;
}


@keyframes sentinel-location-pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.4;
        transform: scale(0.68);
    }

}


body.article-page .sentinel-location small {
    position: absolute;
    top: 14px;
    left: 0;

    color: var(--sentinel-muted);

    font-family: monospace;
    font-size: 0.46rem;
    letter-spacing: 0.05em;
}


body.article-page .location-new-york {
    top: 40%;
    left: 24%;
}


body.article-page .location-paris {
    top: 33%;
    left: 49%;
}


body.article-page .location-tokyo {
    top: 39%;
    right: 13%;
}


body.article-page .location-singapore {
    right: 22%;
    bottom: 25%;
}


body.article-page .location-sydney {
    right: 12%;
    bottom: 10%;
}


body.article-page .sentinel-map-badge {
    position: absolute;
    z-index: 7;

    min-width: 130px;
    padding: 15px 17px;

    background: rgba(10, 15, 20, 0.82);

    border: 1px solid var(--sentinel-border);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}


body.article-page .sentinel-map-badge span,
body.article-page .sentinel-map-badge small {
    display: block;
}


body.article-page .sentinel-map-badge span {
    font-family: monospace;
    font-size: 1.3rem;
    font-weight: 600;
}


body.article-page .sentinel-map-badge small {
    margin-top: 6px;

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.44rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}


body.article-page .badge-blocked {
    top: 20px;
    left: 20px;
}


body.article-page .badge-blocked span {
    color: var(--sentinel-yellow);
}


body.article-page .badge-secure {
    right: 20px;
    bottom: 20px;
}


body.article-page .badge-secure span {
    color: var(--sentinel-green);
}



/* ==========================================================
   6. CONSOLA
   ========================================================== */

body.article-page .sentinel-console {
    position: relative;
    z-index: 5;

    margin: 0 22px 22px;

    background: rgba(8, 12, 17, 0.82);

    border: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-console-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 38px;
    padding: 0 14px;

    border-bottom: 1px solid var(--sentinel-border);

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.46rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-log {
    display: grid;
    grid-template-columns: 75px 62px 1fr;
    align-items: center;
    gap: 14px;

    min-height: 38px;
    padding: 0 14px;

    border-bottom: 1px solid rgba(145, 160, 180, 0.09);

    font-family: monospace;
    font-size: 0.49rem;
}


body.article-page .sentinel-log:last-child {
    border-bottom: 0;
}


body.article-page .sentinel-log time {
    color: #586474;
}


body.article-page .sentinel-log-code {
    font-weight: 700;
    letter-spacing: 0.08em;
}


body.article-page .sentinel-log-code.safe {
    color: var(--sentinel-green);
}


body.article-page .sentinel-log-code.warning {
    color: var(--sentinel-yellow);
}


body.article-page .sentinel-log-code.neutral {
    color: var(--sentinel-blue);
}


body.article-page .sentinel-log p {
    margin: 0;

    color: var(--sentinel-muted);
}



/* ==========================================================
   7. BARRA DE ESTADO
   ========================================================== */

body.article-page .sentinel-status-bar {
    position: relative;
    z-index: 7;

    display: grid;
    grid-template-columns: repeat(5, 1fr);

    width: 100%;

    background: rgba(7, 10, 14, 0.96);

    border-top: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-status-item {
    display: flex;
    align-items: center;
    gap: 14px;

    min-height: 84px;
    padding: 0 26px;

    border-right: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-status-item:last-child {
    border-right: 0;
}


body.article-page .status-light {
    flex: 0 0 auto;

    width: 8px;
    height: 8px;

    border-radius: 50%;
}


body.article-page .status-light.safe {
    background: var(--sentinel-green);

    box-shadow:
        0 0 14px rgba(56, 219, 140, 0.75);
}


body.article-page .status-light.warning {
    background: var(--sentinel-yellow);

    box-shadow:
        0 0 14px rgba(240, 201, 75, 0.65);
}


body.article-page .status-light.danger {
    background: var(--sentinel-red);

    box-shadow:
        0 0 14px rgba(255, 102, 122, 0.65);
}


body.article-page .sentinel-status-item small,
body.article-page .sentinel-status-item strong {
    display: block;

    font-family: monospace;
}


body.article-page .sentinel-status-item small {
    color: var(--sentinel-muted-soft);

    font-size: 0.46rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-status-item strong {
    margin-top: 7px;

    color: var(--sentinel-text);

    font-size: 0.58rem;
    font-weight: 600;

    text-transform: uppercase;
}



/* ==========================================================
   8. SECURITY BRIEFING
   ========================================================== */

body.article-page .sentinel-briefing {
    padding: 145px 0;

    background:
        linear-gradient(180deg,
            #10151c,
            #0c1016);

    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-briefing .sentinel-content-shell {
    display: grid;
    grid-template-columns:
        120px minmax(0, 1.15fr) minmax(320px, 0.85fr);

    gap: 70px;
}


body.article-page .sentinel-section-number span,
body.article-page .sentinel-section-number small {
    display: block;
}


body.article-page .sentinel-section-number span {
    color: var(--sentinel-gold);

    font-family: monospace;
    font-size: 2.9rem;
    font-weight: 500;
}


body.article-page .sentinel-section-number small {
    margin-top: 16px;

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.47rem;
    letter-spacing: 0.13em;

    text-transform: uppercase;
}


body.article-page .sentinel-briefing-heading h2 {
    margin: 23px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: clamp(3.4rem, 5vw, 5.7rem);
    font-weight: 500;
    line-height: 0.94;
}


body.article-page .sentinel-briefing-copy {
    padding-top: 42px;

    border-top: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-briefing-copy p {
    margin: 0;

    color: var(--sentinel-muted);

    font-size: 0.82rem;
    line-height: 1.9;
}


body.article-page .sentinel-briefing-copy p+p {
    margin-top: 27px;
}



/* ==========================================================
   9. ENCABEZADOS DE SECCIÓN
   ========================================================== */

body.article-page .sentinel-section-heading {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr) minmax(300px, 0.85fr);

    align-items: end;
    gap: 85px;
}


body.article-page .sentinel-section-heading h2 {
    max-width: 850px;
    margin: 22px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: clamp(3.4rem, 5.3vw, 6rem);
    font-weight: 500;
    line-height: 0.93;
}


body.article-page .sentinel-section-heading>p {
    margin: 0;
    padding-top: 26px;

    border-top: 1px solid var(--sentinel-border);

    color: var(--sentinel-muted);

    font-size: 0.8rem;
    line-height: 1.85;
}



/* ==========================================================
   10. SECURITY LAYERS
   ========================================================== */

body.article-page .sentinel-layers {
    padding: 145px 0 160px;

    background: #0d1219;
}


body.article-page .sentinel-layer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;

    margin-top: 90px;
}


body.article-page .sentinel-layer-card {
    position: relative;

    min-height: 360px;
    padding: 32px;

    overflow: hidden;

    background:
        linear-gradient(145deg,
            rgba(24, 31, 41, 0.92),
            rgba(14, 19, 26, 0.96));

    border: 1px solid var(--sentinel-border);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}


body.article-page .sentinel-layer-card::after {
    content: "";

    position: absolute;
    right: -55px;
    bottom: -55px;

    width: 150px;
    height: 150px;

    border: 1px solid rgba(56, 219, 140, 0.08);
    border-radius: 50%;
}


body.article-page .sentinel-layer-card:hover {
    border-color: rgba(56, 219, 140, 0.4);

    box-shadow:
        0 25px 65px rgba(0, 0, 0, 0.24);

    transform: translateY(-8px);
}


body.article-page .sentinel-layer-index {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.52rem;
    letter-spacing: 0.1em;
}


body.article-page .sentinel-layer-icon {
    display: grid;
    place-items: center;

    width: 62px;
    height: 62px;
    margin-top: 42px;

    background: var(--sentinel-green-soft);

    border: 1px solid rgba(56, 219, 140, 0.22);

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
}


body.article-page .sentinel-layer-card h3 {
    margin: 30px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: 2.25rem;
    font-weight: 500;
}


body.article-page .sentinel-layer-card p {
    margin: 20px 0 0;

    color: var(--sentinel-muted);

    font-size: 0.74rem;
    line-height: 1.78;
}


body.article-page .sentinel-card-status {
    display: inline-block;

    margin-top: 30px;
    padding: 8px 10px;

    background: rgba(56, 219, 140, 0.06);

    border: 1px solid rgba(56, 219, 140, 0.18);

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.45rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}



/* ==========================================================
   11. PASSWORDS
   ========================================================== */

body.article-page .sentinel-passwords {
    padding: 150px 0;

    background:
        radial-gradient(circle at 76% 50%,
            rgba(198, 152, 73, 0.09),
            transparent 30%),
        #10151c;

    border-top: 1px solid var(--sentinel-border);
    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-password-layout {
    display: grid;
    grid-template-columns:
        minmax(0, 0.9fr) minmax(500px, 1.1fr);

    align-items: center;
    gap: 100px;
}


body.article-page .sentinel-password-copy h2,
body.article-page .sentinel-maintenance-copy h2,
body.article-page .sentinel-wifi-copy h2 {
    margin: 24px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: clamp(3.3rem, 5vw, 5.6rem);
    font-weight: 500;
    line-height: 0.94;
}


body.article-page .sentinel-password-copy>p:not(.sentinel-eyebrow),
body.article-page .sentinel-maintenance-copy>p:not(.sentinel-eyebrow),
body.article-page .sentinel-wifi-copy>p:not(.sentinel-eyebrow) {
    max-width: 610px;
    margin: 30px 0 0;

    color: var(--sentinel-muted);

    font-size: 0.8rem;
    line-height: 1.88;
}


body.article-page .sentinel-password-note {
    margin-top: 42px;
    padding: 22px 0 22px 26px;

    border-left: 2px solid var(--sentinel-gold);
}


body.article-page .sentinel-password-note span,
body.article-page .sentinel-password-note strong {
    display: block;
}


body.article-page .sentinel-password-note span {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.48rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-password-note strong {
    margin-top: 10px;

    color: var(--sentinel-gold-light);

    font-size: 0.77rem;
    font-weight: 500;
}


body.article-page .sentinel-password-console {
    padding: 26px;

    background: #0a0e13;

    border: 1px solid var(--sentinel-border-strong);

    box-shadow:
        0 35px 90px rgba(0, 0, 0, 0.32);
}


body.article-page .sentinel-console-title {
    display: flex;
    justify-content: space-between;

    padding-bottom: 18px;

    border-bottom: 1px solid var(--sentinel-border);

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.49rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-console-title span:last-child {
    color: var(--sentinel-green);
}


body.article-page .sentinel-password-row {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 27px;
}


body.article-page .sentinel-password-row small,
body.article-page .sentinel-password-row strong {
    display: block;

    font-family: monospace;
}


body.article-page .sentinel-password-row small {
    color: var(--sentinel-muted-soft);

    font-size: 0.46rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}


body.article-page .sentinel-password-row strong {
    margin-top: 7px;

    color: var(--sentinel-text);

    font-size: 0.67rem;
    font-weight: 500;
}


body.article-page .sentinel-password-row>span {
    font-family: monospace;
    font-size: 0.52rem;
    font-weight: 600;

    text-transform: uppercase;
}


body.article-page .sentinel-password-row.weak>span {
    color: var(--sentinel-red);
}


body.article-page .sentinel-password-row.medium>span {
    color: var(--sentinel-yellow);
}


body.article-page .sentinel-password-row.strong>span {
    color: var(--sentinel-green);
}


body.article-page .sentinel-strength-track {
    height: 5px;
    margin-top: 12px;

    background: #1b222c;
}


body.article-page .sentinel-strength-track span {
    display: block;
    height: 100%;
}


body.article-page .sentinel-strength-track.weak span {
    width: 22%;

    background: var(--sentinel-red);
}


body.article-page .sentinel-strength-track.medium span {
    width: 58%;

    background: var(--sentinel-yellow);
}


body.article-page .sentinel-strength-track.strong span {
    width: 96%;

    background:
        linear-gradient(90deg,
            var(--sentinel-gold),
            var(--sentinel-green));

    box-shadow:
        0 0 18px rgba(56, 219, 140, 0.28);
}


body.article-page .sentinel-password-result {
    display: flex;
    align-items: center;
    gap: 13px;

    margin-top: 30px;
    padding: 17px;

    background: rgba(56, 219, 140, 0.05);

    border: 1px solid rgba(56, 219, 140, 0.17);
}


body.article-page .sentinel-password-result p {
    margin: 0;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.5rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}



/* ==========================================================
   12. HTTPS
   ========================================================== */

body.article-page .sentinel-https {
    padding: 150px 0 165px;

    background: #0c1016;
}


body.article-page .sentinel-tunnel {
    display: grid;
    grid-template-columns:
        170px 1fr 210px 1fr 170px;

    align-items: center;
    gap: 25px;

    margin-top: 95px;
}


body.article-page .sentinel-tunnel-node,
body.article-page .sentinel-tunnel-lock {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 190px;
    padding: 25px;

    background:
        linear-gradient(145deg,
            #171e27,
            #0f141b);

    border: 1px solid var(--sentinel-border);

    text-align: center;
}


body.article-page .sentinel-node-icon {
    display: grid;
    place-items: center;

    width: 55px;
    height: 55px;

    background: rgba(99, 168, 255, 0.08);

    border: 1px solid rgba(99, 168, 255, 0.22);

    color: var(--sentinel-blue);

    font-family: monospace;
    font-size: 0.64rem;
}


body.article-page .sentinel-tunnel-node small,
body.article-page .sentinel-tunnel-node strong,
body.article-page .sentinel-tunnel-lock span,
body.article-page .sentinel-tunnel-lock strong {
    display: block;
}


body.article-page .sentinel-tunnel-node small {
    margin-top: 22px;

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.44rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-tunnel-node strong {
    margin-top: 8px;

    color: var(--sentinel-text);

    font-size: 0.7rem;
}


body.article-page .sentinel-tunnel-lock {
    min-height: 230px;

    background:
        radial-gradient(circle,
            rgba(56, 219, 140, 0.1),
            transparent 68%),
        #111820;

    border-color: rgba(56, 219, 140, 0.3);
}


body.article-page .sentinel-tunnel-lock span {
    display: grid;
    place-items: center;

    width: 75px;
    height: 75px;

    border: 1px solid rgba(56, 219, 140, 0.4);
    border-radius: 50%;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.75rem;
    font-weight: 700;

    box-shadow:
        0 0 35px rgba(56, 219, 140, 0.1);
}


body.article-page .sentinel-tunnel-lock strong {
    margin-top: 25px;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 0.52rem;
    letter-spacing: 0.09em;

    text-transform: uppercase;
}


body.article-page .sentinel-tunnel-connection {
    position: relative;

    height: 2px;

    background:
        linear-gradient(90deg,
            rgba(99, 168, 255, 0.2),
            var(--sentinel-green),
            rgba(99, 168, 255, 0.2));
}


body.article-page .sentinel-tunnel-connection small {
    position: absolute;
    top: 18px;
    left: 50%;

    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.42rem;
    letter-spacing: 0.08em;

    white-space: nowrap;
    text-transform: uppercase;

    transform: translateX(-50%);
}


body.article-page .sentinel-data-pulse {
    position: absolute;
    top: 50%;

    width: 7px;
    height: 7px;

    background: var(--sentinel-green);

    border-radius: 50%;

    box-shadow:
        0 0 14px rgba(56, 219, 140, 0.8);

    transform: translateY(-50%);

    animation:
        sentinel-data-move 3s linear infinite;
}


body.article-page .pulse-two {
    animation-delay: 1s;
}


body.article-page .pulse-three {
    animation-delay: 2s;
}


@keyframes sentinel-data-move {

    from {
        left: 0;
        opacity: 0;
    }

    15% {
        opacity: 1;
    }

    85% {
        opacity: 1;
    }

    to {
        left: 100%;
        opacity: 0;
    }

}



/* ==========================================================
   13. MAINTENANCE
   ========================================================== */

body.article-page .sentinel-maintenance {
    padding: 155px 0;

    background:
        linear-gradient(145deg,
            #111720,
            #0d1219);

    border-top: 1px solid var(--sentinel-border);
    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-maintenance-layout {
    display: grid;
    grid-template-columns:
        minmax(520px, 1.05fr) minmax(0, 0.95fr);

    align-items: center;
    gap: 95px;
}


body.article-page .sentinel-maintenance-panel {
    background: #090d12;

    border: 1px solid var(--sentinel-border-strong);

    box-shadow:
        0 30px 80px rgba(0, 0, 0, 0.28);
}


body.article-page .sentinel-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 55px;
    padding: 0 20px;

    border-bottom: 1px solid var(--sentinel-border);

    font-family: monospace;
    font-size: 0.49rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-panel-header span {
    color: var(--sentinel-muted);
}


body.article-page .sentinel-panel-header strong {
    color: var(--sentinel-yellow);
    font-weight: 500;
}


body.article-page .sentinel-update-item {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: 18px;

    min-height: 90px;
    padding: 0 21px;

    border-bottom: 1px solid rgba(145, 160, 180, 0.1);
}


body.article-page .sentinel-update-item:last-child {
    border-bottom: 0;
}


body.article-page .sentinel-update-item strong,
body.article-page .sentinel-update-item small {
    display: block;
}


body.article-page .sentinel-update-item strong {
    color: var(--sentinel-text);

    font-size: 0.67rem;
    font-weight: 500;
}


body.article-page .sentinel-update-item small {
    margin-top: 7px;

    color: var(--sentinel-muted-soft);

    font-size: 0.52rem;
}


body.article-page .sentinel-update-item>span:last-child {
    color: var(--sentinel-muted);

    font-family: monospace;
    font-size: 0.47rem;
    letter-spacing: 0.07em;

    text-transform: uppercase;
}


body.article-page .sentinel-permission-list {
    display: grid;
    gap: 14px;

    margin-top: 40px;
}


body.article-page .sentinel-permission-list span {
    position: relative;

    padding: 15px 17px 15px 42px;

    background: rgba(255, 255, 255, 0.018);

    border: 1px solid var(--sentinel-border);

    color: var(--sentinel-muted);

    font-size: 0.68rem;
    line-height: 1.55;
}


body.article-page .sentinel-permission-list span::before {
    content: "✓";

    position: absolute;
    top: 50%;
    left: 17px;

    color: var(--sentinel-green);

    font-family: monospace;

    transform: translateY(-50%);
}



/* ==========================================================
   14. BACKUPS
   ========================================================== */

body.article-page .sentinel-backups {
    padding: 150px 0 165px;

    background: #0b0f15;
}


body.article-page .sentinel-backup-timeline {
    display: grid;
    grid-template-columns: repeat(5, 1fr) 1.35fr;

    margin-top: 95px;

    background: var(--sentinel-border);

    border: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-backup-day,
body.article-page .sentinel-backup-summary {
    min-height: 220px;
    padding: 26px;

    background: #111720;

    border-right: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-backup-summary {
    border-right: 0;

    background:
        linear-gradient(145deg,
            rgba(56, 219, 140, 0.08),
            #10161e);
}


body.article-page .sentinel-backup-day small,
body.article-page .sentinel-backup-day span,
body.article-page .sentinel-backup-day strong,
body.article-page .sentinel-backup-summary small,
body.article-page .sentinel-backup-summary strong {
    display: block;
}


body.article-page .sentinel-backup-day small,
body.article-page .sentinel-backup-summary small {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.46rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-backup-day span {
    margin-top: 48px;

    color: var(--sentinel-green);

    font-family: monospace;
    font-size: 2.1rem;
}


body.article-page .sentinel-backup-day.active span {
    color: var(--sentinel-yellow);
}


body.article-page .sentinel-backup-day strong {
    margin-top: 28px;

    color: var(--sentinel-text);

    font-size: 0.65rem;
    font-weight: 500;
}


body.article-page .sentinel-backup-summary {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}


body.article-page .sentinel-backup-summary strong {
    margin-top: 16px;

    color: var(--sentinel-green);

    font-family: "Cormorant Garamond", serif;
    font-size: 2rem;
    font-weight: 500;
}



/* ==========================================================
   15. PUBLIC WI-FI
   ========================================================== */

body.article-page .sentinel-wifi {
    padding: 155px 0;

    background:
        radial-gradient(circle at 77% 50%,
            rgba(255, 102, 122, 0.08),
            transparent 29%),
        #11151c;

    border-top: 1px solid var(--sentinel-border);
    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-wifi-layout {
    display: grid;
    grid-template-columns:
        minmax(0, 0.88fr) minmax(540px, 1.12fr);

    align-items: center;
    gap: 95px;
}


body.article-page .sentinel-network-diagram {
    position: relative;

    display: grid;
    grid-template-columns:
        1fr 100px 1fr 100px 1fr;

    align-items: center;
    gap: 12px;

    min-height: 430px;
    padding: 42px;

    background:
        linear-gradient(145deg,
            #171d26,
            #0c1117);

    border: 1px solid var(--sentinel-border-strong);
}


body.article-page .sentinel-network-node {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-height: 170px;
    padding: 23px;

    border: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-network-node.trusted {
    background: rgba(56, 219, 140, 0.055);
}


body.article-page .sentinel-network-node.public {
    background: rgba(240, 201, 75, 0.055);

    border-color: rgba(240, 201, 75, 0.23);
}


body.article-page .sentinel-network-node.attacker {
    background: rgba(255, 102, 122, 0.055);

    border-color: rgba(255, 102, 122, 0.25);
}


body.article-page .sentinel-network-node span {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.47rem;
    letter-spacing: 0.1em;
}


body.article-page .sentinel-network-node strong {
    margin-top: 20px;

    color: var(--sentinel-text);

    font-size: 0.67rem;
    font-weight: 500;
    line-height: 1.45;
}


body.article-page .sentinel-network-path {
    position: relative;

    height: 2px;

    background:
        repeating-linear-gradient(90deg,
            var(--sentinel-red) 0,
            var(--sentinel-red) 8px,
            transparent 8px,
            transparent 15px);
}


body.article-page .sentinel-network-path small {
    position: absolute;
    top: 18px;
    left: 50%;

    color: var(--sentinel-red);

    font-family: monospace;
    font-size: 0.4rem;
    letter-spacing: 0.06em;

    text-align: center;
    text-transform: uppercase;

    transform: translateX(-50%);
}


body.article-page .sentinel-network-alert {
    position: absolute;
    right: 28px;
    bottom: 25px;

    display: flex;
    align-items: center;
    gap: 15px;

    padding: 16px 18px;

    background: rgba(36, 14, 19, 0.94);

    border: 1px solid rgba(255, 102, 122, 0.35);

    box-shadow:
        0 20px 50px rgba(0, 0, 0, 0.32);
}


body.article-page .sentinel-network-alert>span {
    display: grid;
    place-items: center;

    width: 32px;
    height: 32px;

    background: var(--sentinel-red);

    border-radius: 50%;

    color: white;

    font-family: monospace;
    font-weight: 700;
}


body.article-page .sentinel-network-alert strong,
body.article-page .sentinel-network-alert small {
    display: block;
}


body.article-page .sentinel-network-alert strong {
    color: var(--sentinel-red);

    font-size: 0.6rem;
}


body.article-page .sentinel-network-alert small {
    margin-top: 5px;

    color: var(--sentinel-muted);

    font-size: 0.48rem;
}



/* ==========================================================
   16. PHISHING
   ========================================================== */

body.article-page .sentinel-phishing {
    padding: 150px 0 165px;

    background: #0b0f15;
}


body.article-page .sentinel-email-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;

    margin-top: 95px;
}


body.article-page .sentinel-email-card {
    padding: 30px;

    background:
        linear-gradient(145deg,
            #161c25,
            #10151c);

    border: 1px solid var(--sentinel-border);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease;
}


body.article-page .sentinel-email-card:hover {
    transform: translateY(-6px);
}


body.article-page .sentinel-email-card.legitimate:hover {
    border-color: rgba(56, 219, 140, 0.35);
}


body.article-page .sentinel-email-card.fraudulent:hover {
    border-color: rgba(255, 102, 122, 0.4);
}


body.article-page .sentinel-email-top {
    display: flex;
    align-items: center;
    gap: 14px;

    padding-bottom: 21px;

    border-bottom: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-email-top strong {
    color: var(--sentinel-text);

    font-family: monospace;
    font-size: 0.53rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}


body.article-page .sentinel-email-field {
    display: grid;
    grid-template-columns: 75px 1fr;
    gap: 18px;

    margin-top: 20px;
}


body.article-page .sentinel-email-field small {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.47rem;
    letter-spacing: 0.07em;

    text-transform: uppercase;
}


body.article-page .sentinel-email-field span {
    color: var(--sentinel-text);

    font-size: 0.64rem;
}


body.article-page .sentinel-email-card>p {
    margin: 30px 0 0;
    padding: 22px;

    background: rgba(255, 255, 255, 0.018);

    border: 1px solid rgba(145, 160, 180, 0.1);

    color: var(--sentinel-muted);

    font-size: 0.7rem;
    line-height: 1.75;
}


body.article-page .sentinel-email-result {
    margin-top: 23px;
    padding: 11px 13px;

    font-family: monospace;
    font-size: 0.48rem;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}


body.article-page .sentinel-email-result.safe {
    background: rgba(56, 219, 140, 0.06);

    border: 1px solid rgba(56, 219, 140, 0.2);

    color: var(--sentinel-green);
}


body.article-page .sentinel-email-result.danger {
    background: rgba(255, 102, 122, 0.06);

    border: 1px solid rgba(255, 102, 122, 0.23);

    color: var(--sentinel-red);
}


body.article-page .sentinel-phishing-checklist {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;

    margin-top: 40px;

    background: var(--sentinel-border);

    border: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-phishing-checklist span {
    position: relative;

    min-height: 105px;
    padding: 25px 24px 25px 50px;

    background: #111720;

    color: var(--sentinel-muted);

    font-size: 0.65rem;
    line-height: 1.6;
}


body.article-page .sentinel-phishing-checklist span::before {
    content: "✓";

    position: absolute;
    top: 25px;
    left: 23px;

    color: var(--sentinel-green);

    font-family: monospace;
}



/* ==========================================================
   17. FINAL REPORT
   ========================================================== */

body.article-page .sentinel-report {
    position: relative;

    min-height: 760px;
    padding: 145px 0;

    overflow: hidden;

    background:
        linear-gradient(145deg,
            #080b0f,
            #121820);

    border-top: 1px solid var(--sentinel-border);
}


body.article-page .sentinel-report::before {
    content: "SYSTEM SECURE";

    position: absolute;
    bottom: -30px;
    left: 50%;

    color: rgba(255, 255, 255, 0.022);

    font-family: monospace;
    font-size: clamp(6rem, 14vw, 15rem);
    font-weight: 700;
    letter-spacing: 0.04em;

    white-space: nowrap;

    transform: translateX(-50%);
}


body.article-page .sentinel-report-glow {
    position: absolute;
    top: -300px;
    left: 50%;

    width: 850px;
    height: 850px;

    background:
        radial-gradient(circle,
            rgba(56, 219, 140, 0.12),
            transparent 68%);

    transform: translateX(-50%);

    pointer-events: none;
}


body.article-page .sentinel-report-layout {
    position: relative;
    z-index: 4;

    display: grid;
    grid-template-columns:
        minmax(0, 0.9fr) minmax(500px, 1.1fr);

    align-items: center;
    gap: 100px;
}


body.article-page .sentinel-report-copy h2 {
    margin: 25px 0 0;

    color: var(--sentinel-text);

    font-family: "Cormorant Garamond", serif;
    font-size: clamp(3.8rem, 6vw, 6.7rem);
    font-weight: 500;
    line-height: 0.9;
}


body.article-page .sentinel-report-copy>p:not(.sentinel-eyebrow) {
    max-width: 590px;
    margin: 34px 0 0;

    color: var(--sentinel-muted);

    font-size: 0.82rem;
    line-height: 1.85;
}


body.article-page .sentinel-report-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;

    margin-top: 40px;
    padding: 16px 20px 16px 24px;

    background: var(--sentinel-green);

    color: #07110c;

    font-family: monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.1em;

    text-decoration: none;
    text-transform: uppercase;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


body.article-page .sentinel-report-button:hover {
    box-shadow:
        0 18px 40px rgba(56, 219, 140, 0.2);

    transform: translateY(-4px);
}


body.article-page .sentinel-report-button span {
    font-size: 1rem;
}


body.article-page .sentinel-report-console {
    padding: 28px;

    background: rgba(7, 10, 14, 0.88);

    border: 1px solid var(--sentinel-border-strong);

    box-shadow:
        0 40px 100px rgba(0, 0, 0, 0.4);
}


body.article-page .sentinel-report-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-bottom: 20px;

    border-bottom: 1px solid var(--sentinel-border);

    font-family: monospace;
    font-size: 0.5rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-report-top span {
    color: var(--sentinel-muted);
}


body.article-page .sentinel-report-top strong {
    color: var(--sentinel-green);
    font-weight: 600;
}


body.article-page .sentinel-report-row {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 62px;

    border-bottom: 1px solid rgba(145, 160, 180, 0.1);

    font-family: monospace;
    font-size: 0.54rem;
    letter-spacing: 0.06em;

    text-transform: uppercase;
}


body.article-page .sentinel-report-row span {
    color: var(--sentinel-muted-soft);
}


body.article-page .sentinel-report-row strong {
    color: var(--sentinel-text);
    font-weight: 500;
}


body.article-page .sentinel-report-row strong.safe {
    color: var(--sentinel-green);
}


body.article-page .sentinel-report-score {
    margin-top: 30px;
}


body.article-page .sentinel-report-score>span {
    color: var(--sentinel-muted-soft);

    font-family: monospace;
    font-size: 0.47rem;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}


body.article-page .sentinel-report-score>strong {
    display: block;

    margin-top: 15px;

    color: var(--sentinel-green);

    font-family: "Cormorant Garamond", serif;
    font-size: 4.2rem;
    font-weight: 500;
    line-height: 1;
}


body.article-page .sentinel-report-score>div {
    height: 6px;
    margin-top: 20px;

    background: #1c232d;
}


body.article-page .sentinel-report-score>div span {
    display: block;

    width: 98.7%;
    height: 100%;

    background:
        linear-gradient(90deg,
            var(--sentinel-gold),
            var(--sentinel-green));

    box-shadow:
        0 0 20px rgba(56, 219, 140, 0.3);
}



/* ==========================================================
   18. RESPONSIVE — PORTÁTIL
   ========================================================== */

@media (max-width: 1250px) {

    .sentinel-content-shell {
        width: calc(100% - 50px);
    }

    body.article-page .sentinel-hero-shell {
        width: calc(100% - 50px);
    }

    body.article-page .sentinel-hero-copy {
        width: 45%;
    }

    body.article-page .sentinel-command-center {
        left: 43%;
        right: -1%;
    }

    body.article-page .sentinel-hero h1 {
        font-size: clamp(4.8rem, 7vw, 7rem);
    }

    body.article-page .sentinel-map {
        height: 370px;
    }

    body.article-page .sentinel-password-layout,
    body.article-page .sentinel-maintenance-layout,
    body.article-page .sentinel-wifi-layout,
    body.article-page .sentinel-report-layout {
        gap: 60px;
    }

    body.article-page .sentinel-layer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    body.article-page .sentinel-tunnel {
        grid-template-columns:
            145px 1fr 180px 1fr 145px;
    }

    body.article-page .sentinel-backup-timeline {
        grid-template-columns: repeat(3, 1fr);
    }

    body.article-page .sentinel-backup-summary {
        grid-column: span 2;
    }

}

/* ==========================================================
   19. RESPONSIVE — TABLET
   ========================================================== */

@media (max-width: 950px) {

    body.article-page .sentinel-hero-shell {
        min-height: auto;
    }

    body.article-page .sentinel-hero-copy {
        width: 100%;
        max-width: 820px;
        padding-top: 30px;
    }

    body.article-page .sentinel-command-center {
        position: relative;
        inset: auto;

        width: 100%;
        margin-top: 70px;

        transform: none;
    }


    body.article-page .sentinel-status-bar {
        grid-template-columns: repeat(3, 1fr);
    }


    body.article-page .sentinel-status-item {
        border-bottom: 1px solid var(--sentinel-border);
    }


    body.article-page .sentinel-briefing .sentinel-content-shell {
        grid-template-columns:
            90px 1fr;
    }


    body.article-page .sentinel-briefing-copy {
        grid-column: 2;
    }


    body.article-page .sentinel-section-heading {
        grid-template-columns: 1fr;
        gap: 40px;
    }


    body.article-page .sentinel-password-layout,
    body.article-page .sentinel-maintenance-layout,
    body.article-page .sentinel-wifi-layout,
    body.article-page .sentinel-report-layout {
        grid-template-columns: 1fr;
    }


    body.article-page .sentinel-password-console,
    body.article-page .sentinel-maintenance-panel,
    body.article-page .sentinel-network-diagram,
    body.article-page .sentinel-report-console {
        width: 100%;
    }


    body.article-page .sentinel-tunnel {
        grid-template-columns: 1fr;
        gap: 24px;
    }


    body.article-page .sentinel-tunnel-connection {
        width: 2px;
        height: 70px;
        margin: 0 auto;

        background:
            linear-gradient(to bottom,
                rgba(99, 168, 255, 0.2),
                var(--sentinel-green),
                rgba(99, 168, 255, 0.2));
    }


    body.article-page .sentinel-data-pulse {
        left: 50%;

        animation:
            sentinel-data-move-vertical 3s linear infinite;
    }


    @keyframes sentinel-data-move-vertical {

        from {
            top: 0;
            opacity: 0;
        }

        15% {
            opacity: 1;
        }

        85% {
            opacity: 1;
        }

        to {
            top: 100%;
            opacity: 0;
        }

    }


    body.article-page .sentinel-tunnel-connection small {
        top: 50%;
        left: 25px;

        transform: translateY(-50%);
    }


    body.article-page .sentinel-network-diagram {
        grid-template-columns: 1fr;
        gap: 25px;
    }


    body.article-page .sentinel-network-path {
        width: 2px;
        height: 65px;
        margin: 0 auto;

        background:
            repeating-linear-gradient(to bottom,
                var(--sentinel-red) 0,
                var(--sentinel-red) 8px,
                transparent 8px,
                transparent 15px);
    }


    body.article-page .sentinel-network-path small {
        top: 50%;
        left: 22px;

        width: 130px;

        transform: translateY(-50%);
    }


    body.article-page .sentinel-email-grid {
        grid-template-columns: 1fr;
    }


    body.article-page .sentinel-phishing-checklist {
        grid-template-columns: repeat(2, 1fr);
    }

}



/* ==========================================================
   20. RESPONSIVE — MÓVIL
   ========================================================== */

@media (max-width: 650px) {

    .sentinel-content-shell,
    body.article-page .sentinel-hero-shell {
        width: calc(100% - 30px);
    }


    body.article-page .sentinel-hero {
        padding-top: 90px;
    }


    body.article-page .sentinel-hero-shell {
        min-height: auto;
        padding-bottom: 60px;
    }


    body.article-page .sentinel-live-label {
        font-size: 0.49rem;
    }


    body.article-page .sentinel-hero h1 {
        font-size: clamp(4rem, 20vw, 6rem);
    }


    body.article-page .sentinel-outline-word {
        margin-left: 0;
    }


    body.article-page .sentinel-hero-description {
        font-size: 0.78rem;
    }


    body.article-page .sentinel-hero-actions {
        align-items: flex-start;
        flex-direction: column;
    }


    body.article-page .sentinel-primary-link {
        width: 100%;
    }


    body.article-page .sentinel-command-center {
        min-height: auto;
    }


    body.article-page .sentinel-command-topbar {
        padding: 0 14px;

        font-size: 0.44rem;
    }


    body.article-page .sentinel-map {
        height: 330px;
        margin: 14px;
    }


    body.article-page .sentinel-map-badge {
        min-width: 105px;
        padding: 11px 12px;
    }


    body.article-page .sentinel-map-badge span {
        font-size: 1rem;
    }


    body.article-page .sentinel-console {
        margin: 0 14px 14px;
    }


    body.article-page .sentinel-log {
        grid-template-columns: 58px 48px 1fr;
        gap: 8px;

        padding: 0 8px;

        font-size: 0.41rem;
    }


    body.article-page .sentinel-status-bar {
        grid-template-columns: 1fr;
    }


    body.article-page .sentinel-status-item {
        border-right: 0;
    }


    body.article-page .sentinel-briefing,
    body.article-page .sentinel-layers,
    body.article-page .sentinel-passwords,
    body.article-page .sentinel-https,
    body.article-page .sentinel-maintenance,
    body.article-page .sentinel-backups,
    body.article-page .sentinel-wifi,
    body.article-page .sentinel-phishing,
    body.article-page .sentinel-report {
        padding: 95px 0;
    }


    body.article-page .sentinel-briefing .sentinel-content-shell {
        grid-template-columns: 1fr;
        gap: 32px;
    }


    body.article-page .sentinel-briefing-copy {
        grid-column: auto;
    }


    body.article-page .sentinel-briefing-heading h2,
    body.article-page .sentinel-section-heading h2,
    body.article-page .sentinel-password-copy h2,
    body.article-page .sentinel-maintenance-copy h2,
    body.article-page .sentinel-wifi-copy h2,
    body.article-page .sentinel-report-copy h2 {
        font-size: 3.2rem;
    }


    body.article-page .sentinel-layer-grid {
        grid-template-columns: 1fr;
        margin-top: 60px;
    }


    body.article-page .sentinel-layer-card {
        min-height: auto;
    }


    body.article-page .sentinel-password-layout,
    body.article-page .sentinel-maintenance-layout,
    body.article-page .sentinel-wifi-layout,
    body.article-page .sentinel-report-layout {
        gap: 60px;
    }


    body.article-page .sentinel-password-console {
        padding: 20px;
    }


    body.article-page .sentinel-backup-timeline {
        grid-template-columns: 1fr;
    }


    body.article-page .sentinel-backup-day,
    body.article-page .sentinel-backup-summary {
        min-height: 180px;

        border-right: 0;
        border-bottom: 1px solid var(--sentinel-border);
    }


    body.article-page .sentinel-backup-summary {
        grid-column: auto;
    }


    body.article-page .sentinel-network-diagram {
        padding: 25px 20px 110px;
    }


    body.article-page .sentinel-network-alert {
        right: 20px;
        bottom: 20px;
        left: 20px;
    }


    body.article-page .sentinel-email-card {
        padding: 22px;
    }


    body.article-page .sentinel-email-field {
        grid-template-columns: 1fr;
        gap: 7px;
    }


    body.article-page .sentinel-phishing-checklist {
        grid-template-columns: 1fr;
    }


    body.article-page .sentinel-report-button {
        width: 100%;
    }

}



/* ==========================================================
   21. MOVIMIENTO REDUCIDO
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    body.article-page .sentinel-scan,
    body.article-page .sentinel-live-dot,
    body.article-page .sentinel-status-dot,
    body.article-page .sentinel-route,
    body.article-page .sentinel-location>span,
    body.article-page .sentinel-data-pulse {
        animation: none;
    }

}

/* ==========================================================
   CORRECCIÓN DEL CONTENEDOR GENERAL DE CYBERSECURITY
   ========================================================== */

html,
body.article-page.cybersecurity-page {
    width: 100%;
    max-width: none;
    margin: 0;
}

body.article-page.cybersecurity-page main {
    display: block;

    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

body.article-page.cybersecurity-page main>section {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
}

body.article-page.cybersecurity-page .sentinel-hero {
    width: 100%;
    max-width: none;
}

body.article-page.cybersecurity-page .sentinel-hero-shell {
    width: min(1460px, calc(100% - 80px));
    max-width: none;
    margin-right: auto;
    margin-left: auto;
}

body.article-page.cybersecurity-page .sentinel-status-bar {
    width: 100%;
    max-width: none;
}

body.article-page.cybersecurity-page .article-container {
    width: 100%;
    max-width: none;
}

/* ==========================================================
   IVORY THEME — CYBERSECURITY
   ========================================================== */

body.article-page.cybersecurity-page:not(.dark-theme) {
    --sentinel-bg: #f4efe6;
    --sentinel-bg-soft: #eee7dc;
    --sentinel-panel: #f8f4ed;
    --sentinel-panel-light: #eee7dc;
    --sentinel-panel-deep: #e7ded0;

    --sentinel-border: rgba(62, 53, 43, 0.14);
    --sentinel-border-strong: rgba(62, 53, 43, 0.24);

    --sentinel-text: #171411;
    --sentinel-muted: #6f675f;
    --sentinel-muted-soft: #91877c;

    --sentinel-green: #26875d;
    --sentinel-green-soft: rgba(38, 135, 93, 0.1);

    --sentinel-gold: #b7863c;
    --sentinel-gold-light: #9b6e2e;

    --sentinel-yellow: #b88a1d;
    --sentinel-red: #b84b5c;
    --sentinel-blue: #496f9a;

    background: var(--sentinel-bg);
    color: var(--sentinel-text);
}


/* HERO */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-hero {
    background:
        radial-gradient(circle at 75% 32%,
            rgba(38, 135, 93, 0.1),
            transparent 29%),
        radial-gradient(circle at 20% 34%,
            rgba(183, 134, 60, 0.13),
            transparent 31%),
        linear-gradient(145deg,
            #f7f2e9 0%,
            #eee6da 54%,
            #e5d9c8 100%);

    border-bottom-color: var(--sentinel-border);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-grid {
    background-image:
        linear-gradient(rgba(38, 32, 26, 0.04) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(38, 32, 26, 0.04) 1px,
            transparent 1px);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-outline-word {
    -webkit-text-stroke:
        1px rgba(23, 20, 17, 0.48);

}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-live-label {
    background: rgba(38, 135, 93, 0.06);
}


/* CENTRO DE OPERACIONES */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-command-center {
    background:
        linear-gradient(150deg,
            rgba(255, 252, 247, 0.96),
            rgba(235, 227, 216, 0.98));

    box-shadow:
        0 38px 90px rgba(75, 57, 34, 0.16),
        0 0 80px rgba(38, 135, 93, 0.04);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-command-center::before {
    background:
        repeating-linear-gradient(to bottom,
            transparent 0,
            transparent 3px,
            rgba(31, 25, 19, 0.018) 4px);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-command-center::after {
    color: rgba(38, 135, 93, 0.035);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-command-topbar {
    background: rgba(255, 255, 255, 0.35);
}


/* MAPA */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-map {
    background:
        radial-gradient(circle at 50% 50%,
            rgba(38, 135, 93, 0.08),
            transparent 47%),
        linear-gradient(145deg,
            rgba(246, 241, 233, 0.95),
            rgba(225, 216, 203, 0.98));
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-map-grid {
    background-image:
        linear-gradient(rgba(38, 135, 93, 0.04) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(38, 135, 93, 0.04) 1px,
            transparent 1px);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-land {
    background: rgba(78, 83, 77, 0.12);
    border-color: rgba(67, 67, 60, 0.16);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-map-badge {
    background: rgba(249, 245, 238, 0.88);
}


/* CONSOLA */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-console {
    background: rgba(244, 238, 229, 0.9);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-log {
    border-bottom-color: rgba(62, 53, 43, 0.09);
}


/* BARRA DE ESTADO */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-status-bar {
    background: #e9e1d5;
}


/* SECCIONES GENERALES */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-briefing,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-layers,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-passwords,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-https,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-maintenance,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-backups,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-wifi,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-phishing,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-report {
    background: #f4efe6;
}


/* TARJETAS Y PANELES */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-layer-card,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-password-console,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-tunnel-node,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-tunnel-lock,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-maintenance-panel,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-backup-day,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-backup-summary,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-network-diagram,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-email-card,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-report-console {
    background:
        linear-gradient(145deg,
            rgba(255, 252, 247, 0.96),
            rgba(235, 227, 216, 0.98));

    box-shadow:
        0 24px 60px rgba(78, 59, 34, 0.09);
}


/* ELEMENTOS INTERNOS */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-email-card>p,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-permission-list span,
body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-phishing-checklist span {
    background: rgba(255, 255, 255, 0.34);
}


/* CIERRE */

body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-report {
    background:
        linear-gradient(145deg,
            #e9e0d3,
            #f7f2ea);
}


body.article-page.cybersecurity-page:not(.dark-theme) .sentinel-report::before {
    color: rgba(23, 20, 17, 0.035);
}