/* ============================================================
   DUPAVI — Página «Consultor SEO Nacional» (/consultor-seo-nacional/)
   Concepto: «una arquitectura que escala». Competir en todo el país
   depende de la estructura: un mapa del sitio (inicio → categorías →
   páginas) que se dibuja nivel a nivel y marca el camino prioritario.
   Animación firma «ramificar».

   - Solo lo propio de esta página (prefijo .nac-). La estructura, el
     acordeón, el formulario y el motor de animaciones están en
     servicios-base.css (prefijo .srv-).
   - assets/js/seo-nacional.js añade el árbol del hero y el de la cita.
   ============================================================ */

:root {
    --nac-ico-tree:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-2.5a1 1 0 0 1-.8-.4l-.9-1.2A1 1 0 0 0 15 3h-2a1 1 0 0 0-1 1v5a1 1 0 0 0 1 1Z'/%3E%3Cpath d='M20 21a1 1 0 0 0 1-1v-3a1 1 0 0 0-1-1h-2.9a1 1 0 0 1-.88-.55l-.42-.85a1 1 0 0 0-.92-.6H13a1 1 0 0 0-1 1v5a1 1 0 0 0 1 1Z'/%3E%3Cpath d='M3 5a2 2 0 0 0 2 2h3'/%3E%3Cpath d='M3 3v13a2 2 0 0 0 2 2h3'/%3E%3C/svg%3E");
    --nac-ico-search:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
    --nac-ico-merge:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='18' r='3'/%3E%3Ccircle cx='6' cy='6' r='3'/%3E%3Cpath d='M6 21V9a9 9 0 0 0 9 9'/%3E%3C/svg%3E");
    --nac-ico-scan:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7V5a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M17 3h2a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M21 17v2a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M7 21H5a2 2 0 0 1-2-2v-2'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='m16 16-1.9-1.9'/%3E%3C/svg%3E");
    --nac-ico-link:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
    --nac-ico-file:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cpath d='M10 9H8'/%3E%3Cpath d='M16 13H8'/%3E%3Cpath d='M16 17H8'/%3E%3C/svg%3E");
    --nac-ico-bag:       url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E");
    --nac-ico-briefcase: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3Crect width='20' height='14' x='2' y='6' rx='2'/%3E%3C/svg%3E");
    --nac-ico-trend:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 7 13.5 15.5 8.5 10.5 2 17'/%3E%3Cpolyline points='16 7 22 7 22 13'/%3E%3C/svg%3E");
    --nac-ico-target:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
}

/* Ritmo vertical (sustituye el hueco genérico de 24px que pone WordPress) */
.nac-hero-main > *,
.nac-expect > *,
.nac-thesis .srv-wrap > *,
.nac-thesis-body > *,
.nac-pillar > *,
.nac-scenario > * { margin-top: 0 !important; }

/* ============================================================
   1 · HERO — texto a la izquierda, mapa del sitio a la derecha
   y lo que puedes esperar en una franja debajo
   ============================================================ */
.wp-block-group.srv-scene.nac-hero {
    overflow: hidden;
    padding: clamp(5rem, 9vw, 7.5rem) 0 clamp(4.5rem, 8vw, 6.5rem);
}
.nac-hero::after {                       /* brillo azul suave detrás del árbol */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 40% 55% at 78% 38%, rgba(40, 94, 168, 0.22) 0%, transparent 70%);
}
.nac-hero .srv-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    align-items: center;
    column-gap: clamp(3rem, 7vw, 7rem);
}
.nac-hero-main { grid-column: 1; grid-row: 1; }
.nac-hero h1 {
    font-size: clamp(2.1rem, 3.8vw, 3.2rem);
    line-height: 1.08;
    letter-spacing: -0.025em;
    margin-bottom: 1.6rem;
    max-width: 20ch;
}
.nac-hero .nac-hero-lead {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1.1rem, 1.5vw, 1.22rem);
    font-weight: 500;
    line-height: 1.5;
    max-width: 52ch;
    margin-bottom: 1rem;
}
.nac-hero .nac-hero-body { font-size: 0.97rem; max-width: 56ch; margin-bottom: 0; }
.nac-hero-main > .wp-block-buttons { margin-top: 2.5rem !important; }

/* El mapa del sitio (lo añade seo-nacional.js) */
.nac-tree { grid-column: 2; grid-row: 1; position: relative; z-index: 1; }
.nac-tree svg { display: block; width: 100%; max-width: 440px; height: auto; margin: 0 auto; overflow: visible; }
.nac-tree .nac-e { fill: none; stroke: rgba(255, 255, 255, 0.2); stroke-width: 1.5; }
.nac-tree .nac-n { fill: var(--c-dark); stroke: rgba(255, 255, 255, 0.42); stroke-width: 1.5; }
.nac-tree .nac-n0 { fill: rgba(126, 179, 247, 0.16); stroke: var(--srv-blue-soft); }
.nac-tree .nac-hl { fill: none; stroke: var(--srv-blue-soft); stroke-width: 2; }
.nac-tree .nac-hl-n { fill: var(--srv-blue-soft); stroke: var(--srv-blue-soft); }
.nac-tree .nac-ring { fill: none; stroke: var(--srv-blue-soft); stroke-width: 1.2; opacity: 0; transform-box: fill-box; transform-origin: center; }

/* Lo que puedes esperar: tres columnas bajo el hero */
.nac-expect {
    grid-column: 1 / -1;
    margin-top: clamp(3.5rem, 6vw, 5rem) !important;
    padding-top: 2.25rem;
    border-top: 1px solid var(--srv-line-dark);
}
.nac-hero .nac-expect-title {
    margin-bottom: 1.5rem;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 600;
}
.nac-checks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.nac-checks li {
    position: relative;
    margin: 0;
    padding-left: 1.85rem;
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.92rem;
    line-height: 1.6;
}
.nac-checks li strong { display: block; margin-bottom: 0.3rem; color: #ffffff; font-weight: 600; }
.nac-checks li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.2rem;
    width: 17px;
    height: 17px;
    background-color: var(--srv-blue-soft);
    -webkit-mask: var(--srv-ico-check) center / contain no-repeat;
            mask: var(--srv-ico-check) center / contain no-repeat;
}

/* ============================================================
   2 · QUÉ ES REALMENTE — tesis limpia, en dos columnas
   ============================================================ */
.nac-thesis .srv-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto 1fr;        /* la frase queda pegada a su título */
    column-gap: clamp(3rem, 7vw, 7rem);
    align-items: start;
}
.nac-thesis h2 { grid-column: 1; margin-bottom: 1.5rem; }
.nac-thesis .nac-thesis-statement {
    grid-column: 1;
    margin-bottom: 0;
    color: var(--c-ink);
    font-size: clamp(1.6rem, 2.8vw, 2.25rem);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.015em;
    max-width: 20ch;
    text-wrap: balance;
}
.nac-thesis-body { grid-column: 2; grid-row: 1 / span 2; padding-top: 0.4rem; }
.nac-thesis-body p { max-width: 56ch; margin-bottom: 1.1rem; }
.nac-thesis-body p:last-child { margin-bottom: 0; color: var(--c-ink); font-weight: 500; }

/* ============================================================
   3 · DECISIONES — seis tarjetas (icono junto al título)
   ============================================================ */
.nac-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}
.nac-pillars-grid > * { margin: 0 !important; }
.nac-pillar {
    position: relative;
    overflow: hidden;
    background-color: var(--c-white);
    border: 1px solid var(--c-border);
    border-radius: 14px;
    padding: 1.9rem 1.9rem 1.8rem;
    transition: border-color 0.4s ease, box-shadow 0.5s ease;
}
.nac-pillar::before {                    /* rama superior que crece al pasar el ratón */
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: var(--c-action);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.6s var(--ease-premium);
}
.nac-pillar h3 {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-bottom: 0.8rem;
    font-size: 1.08rem;
    line-height: 1.35;
}
.nac-pillar h3::before {
    content: "";
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    background-color: var(--c-action);
    -webkit-mask: var(--nac-ico) center / contain no-repeat;
            mask: var(--nac-ico) center / contain no-repeat;
}
.nac-pillar p { margin-bottom: 0; font-size: 0.93rem; max-width: none; }
.nac-icon-tree      { --nac-ico: var(--nac-ico-tree); }
.nac-icon-search    { --nac-ico: var(--nac-ico-search); }
.nac-icon-merge     { --nac-ico: var(--nac-ico-merge); }
.nac-icon-scan      { --nac-ico: var(--nac-ico-scan); }
.nac-icon-link      { --nac-ico: var(--nac-ico-link); }
.nac-icon-file      { --nac-ico: var(--nac-ico-file); }
.nac-icon-bag       { --nac-ico: var(--nac-ico-bag); }
.nac-icon-briefcase { --nac-ico: var(--nac-ico-briefcase); }
.nac-icon-trend     { --nac-ico: var(--nac-ico-trend); }
.nac-icon-target    { --nac-ico: var(--nac-ico-target); }

/* Cita: una rama que se abre en tres y la frase */
.wp-block-group.srv-scene.nac-quote-scene { padding: clamp(4.5rem, 8vw, 6.5rem) 0; }
.nac-quote.wp-block-quote {
    max-width: 880px;
    margin: 0 auto !important;
    padding: 0;
    border: none;
    text-align: center;
}
.nac-mini { display: block; width: 120px; height: 56px; margin: 0 auto 1.9rem; overflow: visible; }
.nac-mini .nac-e { fill: none; stroke: rgba(255, 255, 255, 0.25); stroke-width: 1.5; }
.nac-mini .nac-n { fill: var(--c-dark); stroke: rgba(255, 255, 255, 0.45); stroke-width: 1.5; }
.nac-mini .nac-hl-n { fill: var(--srv-blue-soft); stroke: var(--srv-blue-soft); }
.nac-quote.wp-block-quote p {
    max-width: none;
    margin: 0 auto;
    color: #ffffff;
    font-size: clamp(1.35rem, 2.5vw, 1.95rem);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.01em;
    text-wrap: balance;
}

/* ============================================================
   4 · ESCENARIOS — cuatro tarjetas con icono en baldosa azul
   ============================================================ */
.nac-scenarios-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}
.nac-scenarios-grid > * { margin: 0 !important; }
.nac-scenario {
    position: relative;
    background-color: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: 14px;
    padding: 1.9rem 2rem 1.9rem calc(2rem + 42px + 1.25rem);
    transition: border-color 0.4s ease, background-color 0.4s ease, transform 0.5s var(--ease-premium);
}
.nac-scenario::before {                  /* baldosa azul */
    content: "";
    position: absolute;
    top: 1.9rem;
    left: 2rem;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background-color: var(--c-action);
}
.nac-scenario::after {                   /* icono blanco */
    content: "";
    position: absolute;
    top: calc(1.9rem + 11px);
    left: calc(2rem + 11px);
    width: 20px;
    height: 20px;
    background-color: #ffffff;
    -webkit-mask: var(--nac-ico) center / contain no-repeat;
            mask: var(--nac-ico) center / contain no-repeat;
}
.nac-scenario h3 { margin-bottom: 0.6rem; padding-top: 0.45rem; font-size: 1.1rem; line-height: 1.35; }
.nac-scenario p { margin-bottom: 0; font-size: 0.93rem; max-width: none; }
.nac-scenario a {
    color: var(--c-action);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ============================================================
   TABLET Y MÓVIL
   ============================================================ */
@media (max-width: 1024px) {
    .nac-hero .srv-wrap { grid-template-columns: minmax(0, 1fr); row-gap: 3rem; }
    .nac-tree { grid-column: 1; grid-row: 2; }
    .nac-tree svg { max-width: 380px; margin: 0; }
    .nac-expect { grid-row: 3; margin-top: 0 !important; }
    .nac-pillars-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
    .nac-hero h1 { max-width: none; }
    .nac-checks { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
    .nac-thesis .srv-wrap { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
    .nac-thesis-body { grid-column: 1; grid-row: auto; padding-top: 1.75rem; }
    .nac-pillars-grid,
    .nac-scenarios-grid { grid-template-columns: minmax(0, 1fr); }
    .nac-pillar { padding: 1.6rem 1.5rem; }
    .nac-scenario { padding: calc(1.6rem + 42px + 1.1rem) 1.5rem 1.6rem; }
    .nac-scenario::before { top: 1.6rem; left: 1.5rem; }
    .nac-scenario::after  { top: calc(1.6rem + 11px); left: calc(1.5rem + 11px); }
    .nac-scenario h3 { padding-top: 0; }
}

/* ============================================================
   ANIMACIONES PROPIAS — «ramificar»
   Usan el motor común (servicios-base.css): html.srv-motion, .srv-in,
   fotogramas srv* y fill «backwards».
   ============================================================ */
@keyframes nacDraw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes nacPing { 0% { opacity: 0.9; transform: scale(1); } 100% { opacity: 0; transform: scale(2.6); } }
@keyframes nacSweep {                    /* la rama recorre la tarjeta de izquierda a derecha */
    0%   { transform: scaleX(0); transform-origin: left center; }
    50%  { transform: scaleX(1); transform-origin: left center; }
    51%  { transform: scaleX(1); transform-origin: right center; }
    100% { transform: scaleX(0); transform-origin: right center; }
}

/* ── 1 · Hero: el texto sube; el árbol crece nivel a nivel y se marca el camino ── */
html.srv-motion .nac-hero:not(.srv-in) .nac-hero-main > *,
html.srv-motion .nac-tree:not(.srv-in),
html.srv-motion .nac-expect:not(.srv-in) > * { opacity: 0; }
html.srv-motion .nac-hero h1 { --srv-base: 250ms; }
html.srv-motion .nac-hero.srv-in .nac-hero-main > :not(h1) { animation: srvRise 1.3s var(--ease-premium) calc(500ms + var(--i, 0) * 150ms) backwards; }
.nac-tree .nac-e,
.nac-tree .nac-hl,
.nac-mini .nac-e { stroke-dasharray: 1; }
html.srv-motion .nac-tree.srv-in .nac-n0 { animation: srvPop 0.8s var(--ease-premium) 200ms backwards; }
html.srv-motion .nac-tree.srv-in .nac-e1 { animation: nacDraw 0.9s var(--ease-premium) calc(500ms + var(--i, 0) * 120ms) backwards; }
html.srv-motion .nac-tree.srv-in .nac-n1 { animation: srvPop 0.7s var(--ease-premium) calc(1100ms + var(--i, 0) * 120ms) backwards; }
html.srv-motion .nac-tree.srv-in .nac-e2 { animation: nacDraw 0.8s var(--ease-premium) calc(1400ms + var(--i, 0) * 70ms) backwards; }
html.srv-motion .nac-tree.srv-in .nac-n2 { animation: srvPop 0.6s var(--ease-premium) calc(1900ms + var(--i, 0) * 70ms) backwards; }
html.srv-motion .nac-tree.srv-in .nac-hl { animation: nacDraw 1.2s var(--ease-premium) calc(2600ms + var(--i, 0) * 350ms) backwards; }
html.srv-motion .nac-tree.srv-in .nac-hl-n { animation: srvPop 0.7s var(--ease-premium) 3300ms backwards; }
html.srv-motion .nac-tree.srv-in .nac-ring { animation: nacPing 1.8s ease-out 3500ms 2; }
html.srv-motion .nac-expect.srv-in > .nac-expect-title { animation: srvRise 1.1s var(--ease-premium) backwards; }
html.srv-motion .nac-expect.srv-in .nac-checks li { animation: srvRise 1.1s var(--ease-premium) calc(200ms + var(--i, 0) * 160ms) backwards; }
html.srv-motion .nac-expect:not(.srv-in) .nac-checks li { opacity: 0; }

/* ── 2 · Tesis: la frase principal y después el resto ── */
html.srv-motion .nac-thesis:not(.srv-in) .srv-wrap > *,
html.srv-motion .nac-thesis:not(.srv-in) .nac-thesis-body > * { opacity: 0; }
html.srv-motion .nac-thesis.srv-in .srv-wrap > h2 { animation: srvRise 1.2s var(--ease-premium) backwards; }
html.srv-motion .nac-thesis.srv-in .nac-thesis-statement { animation: srvRise 1.3s var(--ease-premium) 200ms backwards; }
html.srv-motion .nac-thesis.srv-in .nac-thesis-body > * { animation: srvRise 1.2s var(--ease-premium) calc(600ms + var(--i, 0) * 180ms) backwards; }

/* ── 3 · Decisiones: las tarjetas se abren en abanico y su rama crece ── */
html.srv-motion .nac-pillar:not(.srv-in) { opacity: 0; }
html.srv-motion .nac-pillar.srv-in { animation: srvStep 1.3s var(--ease-premium) calc(var(--i, 0) * 140ms) backwards; }
html.srv-motion .nac-pillar.srv-in::before { animation: nacSweep 1.4s cubic-bezier(0.65, 0, 0.35, 1) calc(500ms + var(--i, 0) * 140ms) backwards; }

/* Cita: la rama se abre y aparece la frase */
html.srv-motion .nac-quote:not(.srv-in) p,
html.srv-motion .nac-quote:not(.srv-in) .nac-mini { opacity: 0; }
html.srv-motion .nac-quote.srv-in .nac-mini .nac-n0 { animation: srvPop 0.7s var(--ease-premium) backwards; }
html.srv-motion .nac-quote.srv-in .nac-mini .nac-e { animation: nacDraw 0.9s var(--ease-premium) calc(300ms + var(--i, 0) * 120ms) backwards; }
html.srv-motion .nac-quote.srv-in .nac-mini .nac-n1 { animation: srvPop 0.6s var(--ease-premium) calc(900ms + var(--i, 0) * 120ms) backwards; }
html.srv-motion .nac-quote.srv-in p { animation: srvRise 1.3s var(--ease-premium) 1100ms backwards; }

/* ── 4 · Escenarios: suben en cascada y la baldosa aparece ── */
html.srv-motion .nac-scenario:not(.srv-in) { opacity: 0; }
html.srv-motion .nac-scenario.srv-in { animation: srvStep 1.3s var(--ease-premium) calc(var(--i, 0) * 180ms) backwards; }
html.srv-motion .nac-scenario.srv-in::before,
html.srv-motion .nac-scenario.srv-in::after { animation: srvPop 0.9s var(--ease-premium) calc(450ms + var(--i, 0) * 180ms) backwards; }

/* ── Interacción: ratón en PC / tarjeta del centro de la pantalla en móvil ── */
@media (hover: hover) {
    .nac-pillar:hover { border-color: rgba(40, 94, 168, 0.3); box-shadow: 0 14px 32px rgba(17, 24, 39, 0.05); }
    .nac-pillar:hover::before { transform: scaleX(1); }
    .nac-scenario:hover { background-color: var(--c-white); border-color: rgba(40, 94, 168, 0.3); transform: translateY(-3px); }
}
.nac-pillar.is-focus { border-color: rgba(40, 94, 168, 0.3); }
.nac-pillar.is-focus::before { transform: scaleX(1); }
.nac-scenario.is-focus { background-color: var(--c-white); border-color: rgba(40, 94, 168, 0.3); }