/* AP Neural Web — Index Foundation Bundle */

/* SOURCE: tokens.css */
/* AP Neural Web — Design Tokens V1 */

:root {
    /* Brand */
    --ap-black: #08090b;
    --ap-black-soft: #101114;
    --ap-graphite: #18191d;
    --ap-surface: #24262c;
    --ap-line: #34363d;

    --ap-gray: #979aa2;
    --ap-gray-light: #c3c5ca;
    --ap-white: #f3f3f1;

    --ap-wine: #8b1538;
    --ap-wine-active: #b5204a;
    --ap-wine-deep: #580b23;
    --ap-wine-text: #cf5578;

    /* Semantic */
    --color-bg: var(--ap-black);
    --color-bg-soft: var(--ap-black-soft);
    --color-surface: var(--ap-graphite);
    --color-surface-elevated: var(--ap-surface);
    --color-border: var(--ap-line);

    --color-text: var(--ap-white);
    --color-text-soft: var(--ap-gray-light);
    --color-text-muted: var(--ap-gray);

    --color-accent: var(--ap-wine);
    --color-accent-hover: var(--ap-wine-active);
    --color-accent-deep: var(--ap-wine-deep);

    /* Typography */
    --font-display:
        "Space Grotesk",
        "Arial Narrow",
        "Segoe UI",
        sans-serif;

    --font-body:
        "Manrope",
        "Segoe UI",
        Arial,
        sans-serif;

    --font-mono:
        "SFMono-Regular",
        Consolas,
        "Liberation Mono",
        monospace;

    /* Fluid type */
    --text-xs: clamp(0.72rem, 0.68rem + 0.16vw, 0.82rem);
    --text-sm: clamp(0.84rem, 0.80rem + 0.18vw, 0.95rem);
    --text-base: clamp(1rem, 0.96rem + 0.18vw, 1.1rem);
    --text-lg: clamp(1.12rem, 1rem + 0.5vw, 1.4rem);

    --text-h3: clamp(1.55rem, 1.2rem + 1.4vw, 2.5rem);
    --text-h2: clamp(2.3rem, 1.6rem + 3vw, 5rem);
    --text-h1: clamp(3.2rem, 2rem + 5vw, 7.5rem);

    /* Layout */
    --container: 90rem;
    --gutter: clamp(1rem, 3vw, 3.5rem);
    --section-space: clamp(5rem, 9vw, 10rem);

    /* Shape */
    --radius-xs: 4px;
    --radius-sm: 7px;
    --radius-md: 14px;

    /* Motion */
    --ease-ap: cubic-bezier(0.22, 1, 0.36, 1);
    --duration-fast: 180ms;
    --duration-normal: 360ms;
    --duration-slow: 700ms;

    /* Layer */
    --z-header: 100;
    --z-overlay: 500;
}


/* SOURCE: base.css */
/* AP Neural Web — Base V1 */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    scroll-behavior: smooth;
    color-scheme: dark;
    background: var(--color-bg);
}

body {
    margin: 0;
    min-width: 320px;
    min-height: 100vh;
    overflow-x: hidden;

    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.6;

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

    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

::selection {
    color: var(--ap-white);
    background: var(--ap-wine);
}

img,
picture,
svg,
video,
canvas {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

button,
input,
textarea,
select {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    color: inherit;
}

h1,
h2,
h3,
h4,
p {
    margin-top: 0;
}

h1,
h2,
h3,
h4 {
    font-family: var(--font-display);
    line-height: 0.96;
    text-wrap: balance;
}

p {
    text-wrap: pretty;
}

:focus-visible {
    outline: 2px solid var(--color-accent-hover);
    outline-offset: 4px;
}

.skip-link {
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 9999;

    padding: 0.7rem 1rem;

    color: var(--ap-white);
    background: var(--ap-wine);

    transform: translateY(-180%);
    transition: transform var(--duration-fast) var(--ease-ap);
}

.skip-link:focus {
    transform: translateY(0);
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


/* SOURCE: layout.css */
/* AP Neural Web — Layout V1 */

.ap-container {
    width: min(
        calc(100% - (var(--gutter) * 2)),
        var(--container)
    );

    margin-inline: auto;
}

.ap-section {
    position: relative;
    padding-block: var(--section-space);
}

.ap-grid {
    display: grid;
}

.ap-section-number {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;

    margin-bottom: 1.5rem;

    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.16em;

    color: var(--color-text-muted);
    text-transform: uppercase;
}

.ap-section-number::before {
    content: "";
    width: 1.8rem;
    height: 1px;
    background: var(--color-accent);
}

.site-main {
    position: relative;
    isolation: isolate;
}


/* SOURCE: components.css */
/* AP Neural Web — Components V1 */

.ap-button {
    --button-bg: transparent;
    --button-border: var(--color-border);
    --button-text: var(--color-text);

    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;

    min-height: 3.4rem;
    padding: 0.9rem 1.15rem;

    overflow: hidden;

    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;

    color: var(--button-text);
    background: var(--button-bg);

    border: 1px solid var(--button-border);
    border-radius: var(--radius-sm);

    cursor: pointer;

    transition:
        border-color var(--duration-normal) var(--ease-ap),
        background var(--duration-normal) var(--ease-ap),
        transform var(--duration-normal) var(--ease-ap);
}

.ap-button::after {
    content: "→";

    position: relative;
    z-index: 2;

    transition:
        transform var(--duration-normal) var(--ease-ap);
}

.ap-button:hover::after {
    transform: translateX(0.35rem);
}

.ap-button:active {
    transform: translateY(1px);
}

.ap-button--primary {
    --button-bg: var(--color-accent);
    --button-border: var(--color-accent);
    --button-text: var(--ap-white);
}

.ap-button--primary:hover {
    --button-bg: var(--color-accent-hover);
    --button-border: var(--color-accent-hover);
}

.ap-button--secondary:hover {
    border-color: var(--color-accent);
}

.ap-text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;

    font-size: var(--text-sm);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ap-text-link::after {
    content: "";
    width: clamp(2.5rem, 6vw, 6rem);
    height: 1px;

    background:
        linear-gradient(
            90deg,
            var(--color-accent) 0 35%,
            var(--color-border) 35% 100%
        );

    transition:
        width var(--duration-normal) var(--ease-ap);
}

.ap-text-link:hover::after {
    width: clamp(3.5rem, 8vw, 8rem);
}


/* ================================================================
   AP NEURAL WEB — HEADER / NAVIGATION V1
================================================================ */

.site-header {
    position: fixed;
    top: 0;
    left: 0;

    z-index: var(--z-header);

    width: 100%;

    pointer-events: none;
}

.site-header__inner {
    position: relative;
    z-index: 3;

    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: clamp(1rem, 2.5vw, 2.5rem);

    min-height: 5.6rem;

    pointer-events: auto;

    border: 1px solid transparent;

    transition:
        min-height var(--duration-normal) var(--ease-ap),
        width var(--duration-normal) var(--ease-ap),
        padding var(--duration-normal) var(--ease-ap),
        margin-top var(--duration-normal) var(--ease-ap),
        background var(--duration-normal) var(--ease-ap),
        border-color var(--duration-normal) var(--ease-ap),
        border-radius var(--duration-normal) var(--ease-ap);
}


/* ------------------------------------------------
   Compact header
------------------------------------------------ */

.site-header.is-compact .site-header__inner {
    min-height: 4.4rem;

    margin-top: 0.7rem;
    padding-inline: clamp(0.8rem, 2vw, 1.15rem);

    background: rgba(8, 9, 11, 0.94);

    border-color: rgba(151, 154, 162, 0.18);
    border-radius: 10px;

    box-shadow:
        0 0.7rem 2rem rgba(0, 0, 0, 0.18);
}


/* ------------------------------------------------
   Brand
------------------------------------------------ */

.site-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;

    width: max-content;

    color: var(--color-text);

    transition:
        opacity var(--duration-fast) var(--ease-ap);
}

.site-brand:hover {
    opacity: 0.82;
}

.site-brand__mark {
    display: grid;
    place-items: center;

    width: 2.55rem;
    min-width: 2.55rem;
    aspect-ratio: 1;
    flex: 0 0 2.55rem;

    border: 0;
    border-radius: 0;

    transition:
        transform var(--duration-normal) var(--ease-ap),
        opacity var(--duration-normal) var(--ease-ap);
}

.site-brand__mark img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}

.site-brand:hover .site-brand__mark {
    transform: scale(1.04);
}

.site-brand__name {
    display: flex;
    flex-direction: column;

    font-family: var(--font-display);
    font-size: 0.72rem;
    line-height: 1;
    letter-spacing: 0.1em;

    text-transform: uppercase;
}

.site-brand__name strong {
    font-weight: 700;
}

.site-brand__name span {
    margin-top: 0.22rem;

    font-size: 0.62rem;
    font-weight: 500;

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


/* ------------------------------------------------
   Desktop navigation
------------------------------------------------ */

.desktop-nav {
    justify-self: center;
}

.desktop-nav__list {
    display: flex;
    align-items: center;
    gap: clamp(1.05rem, 1.8vw, 2rem);

    margin: 0;
    padding: 0;

    list-style: none;
}

.desktop-nav a {
    position: relative;

    display: inline-flex;

    padding-block: 0.55rem;

    font-size: var(--text-sm);
    font-weight: 550;

    color: var(--color-text-soft);

    transition:
        color var(--duration-fast) var(--ease-ap);
}

.desktop-nav a::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0.18rem;
    left: 0;

    height: 1px;

    background: var(--color-accent);

    transform: scaleX(0);
    transform-origin: right;

    transition:
        transform var(--duration-normal) var(--ease-ap);
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible {
    color: var(--color-text);
}

.desktop-nav a:hover::after,
.desktop-nav a:focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}

.site-header__cta {
    justify-self: end;

    min-height: 2.8rem;
    padding: 0.7rem 0.9rem;

    font-size: 0.72rem;
}


/* ------------------------------------------------
   Mobile menu trigger — AP compact system V2
------------------------------------------------ */

.menu-toggle {
    position: relative;

    display: none;
    justify-self: end;
    align-items: center;
    gap: .55rem;

    min-height: 2.7rem;
    padding: .28rem .3rem .28rem .72rem;

    overflow: hidden;

    color: var(--color-text);
    background:
        linear-gradient(
            145deg,
            rgba(24,25,29,.76),
            rgba(8,9,11,.88)
        );

    border: 1px solid rgba(151,154,162,.22);
    border-radius: 999px;

    box-shadow:
        inset 0 1px 0 rgba(243,243,241,.035),
        0 .45rem 1.4rem rgba(0,0,0,.16);

    cursor: pointer;

    transition:
        border-color var(--duration-normal) var(--ease-ap),
        background var(--duration-normal) var(--ease-ap),
        transform var(--duration-fast) var(--ease-ap),
        box-shadow var(--duration-normal) var(--ease-ap);
}

.menu-toggle::before {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            110deg,
            transparent 0%,
            rgba(181,32,74,.10) 38%,
            rgba(181,32,74,.22) 50%,
            transparent 68%
        );

    transform: translateX(-115%);

    transition:
        transform 620ms var(--ease-ap);

    pointer-events: none;
}

.menu-toggle:hover,
.menu-toggle:focus-visible {
    border-color: rgba(181,32,74,.58);
    background:
        linear-gradient(
            145deg,
            rgba(24,25,29,.92),
            rgba(88,11,35,.18)
        );

    box-shadow:
        inset 0 1px 0 rgba(243,243,241,.05),
        0 .55rem 1.7rem rgba(0,0,0,.22),
        0 0 0 1px rgba(181,32,74,.06);
}

.menu-toggle:hover::before,
.menu-toggle:focus-visible::before,
.menu-toggle[aria-expanded="true"]::before {
    transform: translateX(115%);
}

.menu-toggle:active {
    transform: scale(.965);
}

.menu-toggle__label {
    position: relative;
    z-index: 1;

    font-family: var(--font-mono);
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .12em;

    color: rgba(243,243,241,.82);
    text-transform: uppercase;
}

.menu-toggle__icon {
    position: relative;
    z-index: 1;

    display: grid;
    place-items: center;

    width: 2.05rem;
    height: 2.05rem;

    border: 1px solid rgba(151,154,162,.26);
    border-radius: 50%;

    background: rgba(8,9,11,.72);

    transition:
        border-color var(--duration-normal) var(--ease-ap),
        transform 520ms var(--ease-ap),
        background var(--duration-normal) var(--ease-ap);
}

.menu-toggle__icon::before {
    content: "";

    position: absolute;
    inset: .34rem;

    border: 1px solid rgba(151,154,162,.20);
    border-top-color: var(--color-accent-hover);
    border-right-color: var(--color-accent);
    border-radius: 50%;

    transform: rotate(-38deg);

    transition:
        transform 620ms var(--ease-ap),
        opacity var(--duration-normal) var(--ease-ap);
}

.menu-toggle__icon::after {
    content: "";

    position: absolute;
    right: .15rem;
    top: 50%;

    width: .27rem;
    aspect-ratio: 1;

    background: var(--color-accent-hover);
    border-radius: 50%;

    box-shadow: 0 0 .6rem rgba(181,32,74,.55);

    transform: translateY(-50%);

    transition:
        transform 520ms var(--ease-ap),
        opacity var(--duration-normal) var(--ease-ap);
}

.menu-toggle__icon span {
    position: absolute;
    left: 50%;

    width: .78rem;
    height: 1px;

    background: currentColor;

    transform-origin: center;

    transition:
        top var(--duration-normal) var(--ease-ap),
        width var(--duration-normal) var(--ease-ap),
        transform 520ms var(--ease-ap);
}

.menu-toggle__icon span:first-child {
    top: .78rem;
    transform: translateX(-50%);
}

.menu-toggle__icon span:last-child {
    top: 1.22rem;
    transform: translateX(-50%);
}

.menu-toggle[aria-expanded="true"] {
    border-color: rgba(181,32,74,.72);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon {
    border-color: rgba(181,32,74,.66);
    background: rgba(88,11,35,.20);
    transform: rotate(90deg);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon::before {
    transform: rotate(220deg) scale(.82);
    opacity: .72;
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon::after {
    transform: translate(-.18rem, -50%) scale(.82);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:first-child {
    top: 1rem;
    width: .9rem;
    transform: translateX(-50%) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:last-child {
    top: 1rem;
    width: .9rem;
    transform: translateX(-50%) rotate(-45deg);
}


/* ------------------------------------------------
   Mobile menu — compact floating AP panel
------------------------------------------------ */

.mobile-menu {
    position: fixed;
    inset: 0;

    z-index: 2;

    display: flex;
    justify-content: flex-end;
    align-items: flex-start;

    padding:
        5rem
        max(.75rem, var(--gutter))
        .8rem;

    overflow: hidden;

    pointer-events: none;

    color: var(--color-text);
    background: rgba(8,9,11,.48);

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

    opacity: 0;
    visibility: hidden;

    transition:
        opacity 260ms var(--ease-ap),
        visibility 260ms var(--ease-ap);
}

.mobile-menu.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.mobile-menu__inner {
    position: relative;

    display: flex;
    flex-direction: column;

    width: min(88vw, 24rem);
    max-height: calc(100svh - 5.8rem);
    min-height: 0;

    margin-left: auto;
    padding: 1rem 1rem 1.05rem;

    overflow-y: auto;
    overscroll-behavior: contain;

    background:
        radial-gradient(
            circle at 92% 10%,
            rgba(139,21,56,.16),
            transparent 28%
        ),
        linear-gradient(
            155deg,
            rgba(24,25,29,.97),
            rgba(8,9,11,.985) 62%,
            rgba(16,8,11,.99)
        );

    border: 1px solid rgba(151,154,162,.20);
    border-radius: 18px;

    box-shadow:
        0 1.4rem 4.5rem rgba(0,0,0,.48),
        inset 0 1px 0 rgba(243,243,241,.035);

    opacity: 0;

    transform:
        translate3d(1.6rem, -.35rem, 0)
        scale(.975);

    transform-origin: top right;

    transition:
        opacity 300ms var(--ease-ap),
        transform 420ms var(--ease-ap);
}

.mobile-menu__inner::before {
    content: "";

    position: absolute;
    top: 0;
    right: 1rem;

    width: 4.8rem;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--color-accent-hover)
        );

    opacity: .86;
}

.mobile-menu.is-open .mobile-menu__inner {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.mobile-menu__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;

    min-height: 2rem;
    padding: 0 .1rem .65rem;

    font-family: var(--font-mono);
    font-size: .58rem;
    letter-spacing: .14em;

    color: rgba(151,154,162,.72);
    text-transform: uppercase;

    border-bottom: 1px solid rgba(151,154,162,.14);
}

.mobile-menu__meta span:last-child {
    display: grid;
    place-items: center;

    width: 1.55rem;
    aspect-ratio: 1;

    color: var(--color-accent-hover);

    border: 1px solid rgba(181,32,74,.35);
    border-radius: 50%;
}

.mobile-nav {
    margin-top: .55rem;
}

.mobile-nav__list {
    margin: 0;
    padding: 0;

    perspective: 900px;
    list-style: none;
}

.mobile-nav__list li {
    border-bottom: 1px solid rgba(151,154,162,.105);

    opacity: 0;
    transform: translateX(.8rem) rotateY(-5deg);
    transform-origin: right center;

    transition:
        opacity 280ms var(--ease-ap),
        transform 420ms var(--ease-ap),
        border-color 220ms ease;
}

.mobile-menu.is-open .mobile-nav__list li {
    opacity: 1;
    transform: translateX(0) rotateY(0);
}

.mobile-menu.is-open .mobile-nav__list li:nth-child(1) { transition-delay: 40ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(2) { transition-delay: 70ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(3) { transition-delay: 100ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(4) { transition-delay: 130ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(5) { transition-delay: 160ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(6) { transition-delay: 190ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(7) { transition-delay: 220ms; }
.mobile-menu.is-open .mobile-nav__list li:nth-child(8) { transition-delay: 250ms; }

.mobile-nav__list a {
    position: relative;

    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) auto;
    align-items: center;
    gap: .25rem;

    min-height: 3.15rem;
    padding-inline: .15rem .25rem;

    color: var(--color-text);

    transition:
        padding-left 240ms var(--ease-ap),
        background 240ms var(--ease-ap),
        color 240ms var(--ease-ap);
}

.mobile-nav__list a::before {
    content: "";

    position: absolute;
    left: -.35rem;
    top: 50%;

    width: 2px;
    height: 0;

    background: var(--color-accent-hover);
    border-radius: 2px;

    transform: translateY(-50%);

    transition:
        height 260ms var(--ease-ap),
        box-shadow 260ms var(--ease-ap);
}

.mobile-nav__list a::after {
    content: "↗";

    font-family: var(--font-mono);
    font-size: .72rem;

    color: var(--color-accent-hover);

    opacity: 0;
    transform: translate(-.4rem, .25rem);

    transition:
        opacity 220ms ease,
        transform 280ms var(--ease-ap);
}

.mobile-nav__list a:hover,
.mobile-nav__list a:focus-visible {
    padding-left: .45rem;
    background: rgba(181,32,74,.045);
}

.mobile-nav__list a:hover::before,
.mobile-nav__list a:focus-visible::before,
.mobile-nav__list a[aria-current="page"]::before {
    height: 1.2rem;
    box-shadow: 0 0 .8rem rgba(181,32,74,.30);
}

.mobile-nav__list a:hover::after,
.mobile-nav__list a:focus-visible::after {
    opacity: 1;
    transform: translate(0, 0);
}

.mobile-nav__list a > span {
    font-family: var(--font-mono);
    font-size: .56rem;
    letter-spacing: .08em;

    color: rgba(151,154,162,.62);
}

.mobile-nav__list strong {
    position: relative;

    width: max-content;
    max-width: 100%;

    font-family: var(--font-display);
    font-size: clamp(1rem, 3.8vw, 1.28rem);
    font-weight: 520;
    letter-spacing: -.025em;

    transition:
        color 220ms ease,
        transform 260ms var(--ease-ap);
}

.mobile-nav__list strong::after {
    display: none;
}

.mobile-nav__list a[aria-current="page"] strong {
    color: var(--color-accent-hover);
}

.mobile-menu__action {
    margin-top: .85rem;
}

.mobile-menu__action .ap-button {
    min-height: 2.8rem;
    padding: .68rem .9rem;

    font-size: .68rem;
}

.mobile-menu__signature {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .8rem;

    margin-top: .85rem;
    padding-top: .85rem;

    font-family: var(--font-mono);
    font-size: .56rem;
    letter-spacing: .09em;

    color: rgba(151,154,162,.58);
    text-transform: uppercase;

    border-top: 1px solid rgba(151,154,162,.10);
}

.mobile-menu__route {
    position: relative;

    display: block;
    height: 1px;

    overflow: hidden;

    background: rgba(151,154,162,.18);
}

.mobile-menu__route i {
    position: absolute;
    top: 50%;
    left: 0;

    width: 38%;
    height: 1px;

    background: var(--color-accent);

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

    transition:
        transform 900ms var(--ease-ap) 120ms;
}

.mobile-menu.is-open .mobile-menu__route i {
    transform: translate(0, -50%);
}

.mobile-menu__route i::after {
    content: "";

    position: absolute;
    top: 50%;
    right: -.18rem;

    width: .34rem;
    aspect-ratio: 1;

    background: var(--color-accent-hover);
    border-radius: 50%;

    box-shadow: 0 0 .7rem rgba(181,32,74,.42);

    transform: translateY(-50%);
}

body.menu-open {
    overflow: hidden;
}



/* AP FOOTER ACTIVE NORMALIZATION V2 START */


/* ================================================================
   FOOTER / PÁGINA ACTUAL

   UNA SOLA REGLA PARA TODA AP NEURAL WEB.
================================================================ */

.site-footer__nav a {
    position: relative;
}


/* ------------------------------------------------
   Página actual
------------------------------------------------ */

.site-footer__nav
a[aria-current="page"] {

    color:
        var(--color-text);

    transform:
        none;
}


/* ------------------------------------------------
   Línea activa

   - visible permanentemente
   - ancho completo del texto
   - no depende del hover
------------------------------------------------ */

.site-footer__nav
a[aria-current="page"]::after {

    content: "";

    position: absolute;

    left: 0;
    right: auto;

    bottom: -.34rem;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #8B1538 0%,
            #B5204A 55%,
            #8B1538 100%
        );

    opacity: 1;

    transform:
        scaleX(1);

    transform-origin:
        left center;

    box-shadow:
        0 0 .42rem
        rgba(181,32,74,.20);

    pointer-events: none;
}


/* ================================================================
   HOVER

   Los enlaces normales conservan su efecto.
================================================================ */

@media (hover:hover) and (pointer:fine) {

    .site-footer__nav
    a:not([aria-current="page"]) {

        transition:
            color 240ms ease,
            transform 260ms ease;
    }


    .site-footer__nav
    a:not([aria-current="page"]):hover {

        color:
            var(--color-text);

        transform:
            translateX(.15rem);
    }


    /*
    La página actual NO modifica su marcador
    cuando se pasa el mouse.
    */

    .site-footer__nav
    a[aria-current="page"]:hover {

        color:
            var(--color-text);

        transform:
            none;
    }


    .site-footer__nav
    a[aria-current="page"]:hover::after {

        width: 100%;

        opacity: 1;

        transform:
            scaleX(1);
    }

}


/* ================================================================
   MÓVIL

   Se conserva exactamente el mismo lenguaje.
================================================================ */

@media (max-width:767px) {

    .site-footer__nav
    a[aria-current="page"]::after {

        bottom: -.30rem;

        width: 100%;

        transform:
            scaleX(1);
    }

}


/* AP FOOTER ACTIVE NORMALIZATION V2 END */



/* ================================================================
   AP SEARCH + ACCESSIBILITY LAYER V1
   Visible, useful content for people first; search engines read the same HTML.
================================================================ */

:root {
    --ap-wine-text: #CF5578;
}

.ap-section-number,
.site-footer__nav strong,
.legal-eyebrow,
.legal-index__label,
.legal-section__number,
.legal-primary-contact > span {
    color: var(--ap-wine-text);
}

.ap-service-searchline {
    max-width: 52rem;
    margin: -0.7rem 0 1.8rem;
    color: var(--color-text-soft);
    font-size: .92rem;
    line-height: 1.75;
}

.ap-search-faq {
    position: relative;
    border-top: 1px solid rgba(151,154,162,.09);
    border-bottom: 1px solid rgba(151,154,162,.09);
    background: rgba(8,9,11,.72);
}

.ap-search-faq__head {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(18rem,.48fr);
    gap: clamp(2rem,7vw,7rem);
    align-items: end;
    margin-bottom: clamp(2.5rem,5vw,4rem);
}

.ap-search-faq__head h2,
.ap-presence h2 {
    max-width: 14ch;
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(2.5rem,5vw,5.2rem);
    line-height: .96;
    letter-spacing: -.05em;
    text-transform: uppercase;
}

.ap-search-faq__head > p,
.ap-presence__copy > p {
    margin: 0;
    color: var(--color-text-soft);
    line-height: 1.75;
}

.ap-faq {
    border-top: 1px solid rgba(151,154,162,.12);
}

.ap-faq__item {
    border-bottom: 1px solid rgba(151,154,162,.10);
}

.ap-faq__item summary {
    display: grid;
    grid-template-columns: 2.8rem minmax(0,1fr) auto;
    gap: 1rem;
    align-items: center;
    min-height: 5.6rem;
    padding: 1rem .2rem;
    cursor: pointer;
    list-style: none;
}

.ap-faq__item summary::-webkit-details-marker { display:none; }
.ap-faq__item summary > span {
    color: var(--ap-wine-text);
    font-family: var(--font-mono);
    font-size: .6rem;
}
.ap-faq__item summary strong {
    font-family: var(--font-display);
    font-size: clamp(1rem,1.5vw,1.25rem);
    line-height: 1.35;
    text-transform: uppercase;
}
.ap-faq__item summary i {
    color: var(--ap-wine-text);
    font-style: normal;
    font-size: 1.25rem;
    transition: transform 220ms var(--ease-ap);
}
.ap-faq__item[open] summary i { transform: rotate(45deg); }
.ap-faq__answer {
    max-width: 54rem;
    padding: 0 3.8rem 1.5rem;
}
.ap-faq__answer p {
    margin: 0;
    color: var(--color-text-muted);
    line-height: 1.8;
}

.ap-presence {
    position: relative;
    border-top: 1px solid rgba(151,154,162,.09);
    background: linear-gradient(90deg,rgba(88,11,35,.035),transparent 55%);
}
.ap-presence__grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(18rem,.65fr);
    gap: clamp(3rem,8vw,8rem);
    align-items: start;
}
.ap-presence__services {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1.5rem;
}
.ap-presence__services a {
    padding: .65rem .8rem;
    border: 1px solid rgba(151,154,162,.12);
    color: var(--color-text-soft);
    font-size: .78rem;
    transition: border-color 180ms ease,color 180ms ease,background 180ms ease;
}
@media (hover:hover) and (pointer:fine) {
    .ap-presence__services a:hover {
        color: var(--ap-white);
        border-color: rgba(207,85,120,.42);
        background: rgba(88,11,35,.08);
    }
}

.ap-area-served {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgba(151,154,162,.08);
    border-bottom: 1px solid rgba(151,154,162,.08);
    background: rgba(8,9,11,.82);
}
.ap-area-served__inner {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.ap-area-served__inner > span {
    color: var(--ap-wine-text);
    font-family: var(--font-mono);
    font-size: .58rem;
    letter-spacing: .12em;
}
.ap-area-served__inner p {
    margin: 0;
    color: var(--color-text-muted);
    font-size: .82rem;
    text-align: right;
}

.ap-honeypot {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.diagnostic-privacy a {
    color: var(--ap-wine-text);
    text-decoration: underline;
    text-underline-offset: .18em;
}

@media (max-width: 767px) {
    .ap-search-faq__head,
    .ap-presence__grid { grid-template-columns: 1fr; }
    .ap-faq__item summary { grid-template-columns: 2rem minmax(0,1fr) auto; gap:.65rem; }
    .ap-faq__answer { padding-left: 2.65rem; padding-right: .2rem; }
    .ap-area-served__inner { align-items:flex-start; flex-direction:column; gap:.45rem; }
    .ap-area-served__inner p { text-align:left; }
}

@media (prefers-reduced-motion: reduce) {
    .ap-faq__item summary i,
    .ap-presence__services a { transition:none !important; }
}


/* AP SEMANTIC PARENT NAV V2 START */
/* A service detail belongs to Soluciones, but only the exact service is aria-current=page. */
.desktop-nav a[data-nav-active="true"] {
    color: var(--color-text);
}
.desktop-nav a[data-nav-active="true"]::after {
    transform: scaleX(1);
    transform-origin: left;
}
.mobile-nav__list a[data-nav-active="true"]::before {
    height: 1.2rem;
    box-shadow: 0 0 .8rem rgba(181,32,74,.30);
}
.mobile-nav__list a[data-nav-active="true"] strong {
    color: var(--color-accent-hover);
}
.site-footer__nav a[data-nav-active="true"] {
    color: var(--color-text);
    transform: none;
}
.site-footer__nav a[data-nav-active="true"]::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -.34rem;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg,#8B1538 0%,#B5204A 55%,#8B1538 100%);
    opacity: 1;
    transform: scaleX(1);
    transform-origin: left center;
    box-shadow: 0 0 .42rem rgba(181,32,74,.20);
    pointer-events: none;
}
@media (hover:hover) and (pointer:fine) {
    .site-footer__nav a[data-nav-active="true"]:hover {
        color: var(--color-text);
        transform: none;
    }
}
@media (max-width:767px) {
    .site-footer__nav a[data-nav-active="true"]::after { bottom: -.30rem; }
}
/* AP SEMANTIC PARENT NAV V2 END */


/* AP SOCIAL HEADER CSS START */


/* ================================================================
   AP NEURAL WEB — SOCIAL HEADER
   Desktop:
   desde el inicio de "Soluciones"
   hasta el final de "Empresa".

   Móvil:
   ancho útil de logo -> menú.

   Cinco iconos:
   TikTok / Facebook / Instagram / WhatsApp / Correo
================================================================ */

.site-social-row {

    --ap-social-left: 50%;
    --ap-social-width: min(38rem, 64vw);
    --ap-social-shift: -50%;
    --ap-social-icon-size: 56px;

    position: relative;

    z-index: 4;

    display: block;

    width: 100%;
    height: calc(var(--ap-social-icon-size) + 1.9rem);

    margin: 0;

    overflow: hidden;

    pointer-events: none;

    transition:
        height 460ms cubic-bezier(.22,1,.36,1),
        opacity 260ms ease,
        transform 460ms cubic-bezier(.22,1,.36,1);
}



/* ================================================================
   BANDA
================================================================ */

.site-social-strip {

    position: absolute;

    top: .26rem;
    left: var(--ap-social-left);

    width: var(--ap-social-width);
    max-width: calc(100% - .8rem);

    display: grid;

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

    align-items: center;

    min-height: calc(var(--ap-social-icon-size) + .8rem);

    transform:
        translateX(var(--ap-social-shift))
        translateY(0);

    pointer-events: auto;

    border-top:
        1px solid
        rgba(151,154,162,.10);

    border-bottom:
        1px solid
        rgba(151,154,162,.10);

    background:
        linear-gradient(
            90deg,
            rgba(8,9,11,0),
            rgba(8,9,11,.90) 8%,
            rgba(8,9,11,.90) 92%,
            rgba(8,9,11,0)
        );

    box-shadow:
        0 1rem 2.6rem rgba(0,0,0,.22);

    backdrop-filter:
        blur(10px);

    -webkit-backdrop-filter:
        blur(10px);

    opacity: 1;

    transition:
        left 380ms cubic-bezier(.22,1,.36,1),
        width 380ms cubic-bezier(.22,1,.36,1),
        transform 460ms cubic-bezier(.22,1,.36,1),
        opacity 240ms ease;
}



/* ================================================================
   ENLACES
================================================================ */

.site-social-strip__link {

    position: relative;

    display: grid;
    place-items: center;

    width: 100%;
    height: calc(var(--ap-social-icon-size) + .7rem);

    opacity: .96;

    outline-offset: 3px;

    animation:
        apSocialFloat 4.2s ease-in-out infinite;

    transition:
        opacity 220ms ease,
        transform 300ms cubic-bezier(.22,1,.36,1),
        filter 300ms ease;
}


.site-social-strip__link:nth-child(2) {
    animation-delay: .35s;
}

.site-social-strip__link:nth-child(3) {
    animation-delay: .7s;
}

.site-social-strip__link:nth-child(4) {
    animation-delay: 1.05s;
}

.site-social-strip__link:nth-child(5) {
    animation-delay: 1.4s;
}


.site-social-strip__link img {

    display: block;

    width: var(--ap-social-icon-size);
    height: var(--ap-social-icon-size);

    max-width: 92%;
    max-height: 92%;

    aspect-ratio: 1;

    object-fit: contain;

    transform:
        translateZ(0)
        scale(1.08);

    user-select: none;

    pointer-events: none;

    filter:
        drop-shadow(0 .45rem .9rem rgba(0,0,0,.34));

    transition:
        transform 280ms cubic-bezier(.22,1,.36,1),
        filter 280ms ease;
}


/* sin líneas divisorias */

.site-social-strip__link::before,
.site-social-strip__link::after {
    content: none !important;
}


@media (hover:hover) and (pointer:fine) {

    .site-social-strip__link:hover {
        opacity: 1;
        transform: translateY(-2px);
    }

    .site-social-strip__link:hover img {
        transform: translateZ(0) scale(1.14);
        filter:
            drop-shadow(0 .6rem 1rem rgba(0,0,0,.44));
    }

}


.site-social-strip__link:focus-visible {
    opacity: 1;
    outline: 1px solid var(--color-accent-hover);
}



/* ================================================================
   SCROLL COMPACTO
================================================================ */

.site-header.is-compact .site-social-row {
    height: calc(var(--ap-social-icon-size) + 1.45rem);
}

.site-header.is-compact .site-social-strip {
    top: .16rem;
}



/* ================================================================
   MÓVIL
================================================================ */

@media (max-width:1099px) {

    .site-social-row {
        height: calc(var(--ap-social-icon-size) + 1.25rem);
        margin-top: -.08rem;
        opacity: 1;
        transform: translateY(0);
    }

    .site-social-strip {
        top: .1rem;
        max-width: 100%;
        background:
            linear-gradient(
                90deg,
                rgba(8,9,11,0),
                rgba(8,9,11,.95) 6%,
                rgba(8,9,11,.95) 94%,
                rgba(8,9,11,0)
            );
    }

}


@media (max-width:479px) {

    .site-social-row {
        height: calc(var(--ap-social-icon-size) + 1.05rem);
    }

}



/* ================================================================
   PESTAÑA MÓVIL AL ABRIR MENÚ
================================================================ */

@media (max-width:1099px) {

    body.menu-open .site-social-row {
        height: 0;
        opacity: 0;
        pointer-events: none;
    }

    body.menu-open .site-social-strip {
        opacity: 0;
        pointer-events: none;
        transform:
            translateX(var(--ap-social-shift))
            translateY(-135%);
    }

    .site-header:has(.menu-toggle[aria-expanded="true"]) .site-social-row {
        height: 0;
        opacity: 0;
        pointer-events: none;
    }

    .site-header:has(.menu-toggle[aria-expanded="true"]) .site-social-strip {
        opacity: 0;
        pointer-events: none;
        transform:
            translateX(var(--ap-social-shift))
            translateY(-135%);
    }

}



/* ================================================================
   ANIMACIÓN FLOTANTE
================================================================ */

@keyframes apSocialFloat {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-3px); }
    100% { transform: translateY(0); }
}



/* ================================================================
   REDUCED MOTION
================================================================ */

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

    .site-social-row,
    .site-social-strip,
    .site-social-strip__link,
    .site-social-strip__link img {
        transition: none !important;
        animation: none !important;
    }

}


/* AP SOCIAL HEADER CSS END */


/* AP FOOTER SOCIAL CONTACTS CSS START */


/* ================================================================
   CONTACTOS REALES EN FOOTER
================================================================ */

.site-footer__contacts {

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap:
        .55rem
        .65rem;

    width: 100%;

    max-width: 34rem;

    margin-top:
        clamp(
            1.35rem,
            3vw,
            2.2rem
        );

    padding-top: 1rem;

    border-top:
        1px solid
        rgba(151,154,162,.11);
}



/* Email usa todo el ancho */

.site-footer__contact--email {

    grid-column:
        1 / -1;
}



/* ================================================================
   ENLACE
================================================================ */

.site-footer__contact {

    display: grid;

    grid-template-columns:
        2rem
        minmax(0,1fr);

    align-items: center;

    gap: .65rem;

    min-width: 0;

    padding:
        .55rem
        .45rem;

    color:
        var(--color-text-muted);

    border-radius:
        .35rem;

    transition:
        color 220ms ease,
        background-color 220ms ease,
        transform 260ms var(--ease-ap);
}



/* ================================================================
   ICONO NORMAL / MONOCROMO
================================================================ */

.site-footer__contact-icon {

    display: grid;
    place-items: center;

    width: 2rem;
    height: 2rem;

    color:
        rgba(243,243,241,.72);

    transition:
        color 220ms ease,
        transform 260ms var(--ease-ap);
}


.site-footer__contact-icon svg {

    display: block;

    width: 1.18rem;
    height: 1.18rem;

    overflow: visible;

    fill: currentColor;

    stroke: none;
}


/* Instagram / WhatsApp / correo usan línea */

.site-footer__contact:nth-child(3)
.site-footer__contact-icon svg,

.site-footer__contact:nth-child(4)
.site-footer__contact-icon svg,

.site-footer__contact--email
.site-footer__contact-icon svg {

    fill: none;

    stroke: currentColor;

    stroke-width: 1.65;

    stroke-linecap: round;

    stroke-linejoin: round;
}


.site-footer__contact:nth-child(4)
.site-footer__contact-icon svg path:last-child {

    fill: currentColor;

    stroke: none;
}


.site-footer__contact-fill {

    fill: currentColor;

    stroke: none;
}



/* ================================================================
   TEXTO
================================================================ */

.site-footer__contact-copy {

    display: flex !important;

    flex-direction: column;

    gap: .1rem !important;

    min-width: 0;
}


.site-footer__contact-copy small {

    font-family:
        var(--font-mono);

    font-size: .54rem;

    line-height: 1.2;

    letter-spacing: .09em;

    color:
        rgba(151,154,162,.62);

    text-transform: uppercase;
}


.site-footer__contact-copy strong {

    display: block;

    overflow: hidden;

    min-width: 0;

    font-family:
        var(--font-body) !important;

    font-size:
        clamp(
            .68rem,
            .8vw,
            .78rem
        ) !important;

    font-weight: 600 !important;

    line-height: 1.35;

    letter-spacing: 0 !important;

    color:
        rgba(243,243,241,.80);

    text-transform: none !important;

    text-overflow: ellipsis;

    white-space: nowrap;
}



/* ================================================================
   HOVER PC
================================================================ */

@media (hover:hover) and (pointer:fine) {

    .site-footer__contact:hover {

        color:
            var(--color-text);

        background:
            rgba(255,255,255,.025);

        transform:
            translateY(-1px);
    }


    .site-footer__contact:hover
    .site-footer__contact-icon {

        color:
            var(--color-accent-hover);

        transform:
            translateY(-1px);
    }


    .site-footer__contact:hover
    .site-footer__contact-copy strong {

        color:
            var(--color-text);
    }

}



/* ================================================================
   REDES GRANDES DEL HEADER:
   RECOGERSE ANTES DE LLEGAR AL FOOTER
================================================================ */

.site-header.is-near-footer
.site-social-row {

    height: 0 !important;

    opacity: 0;

    pointer-events: none;

    transform:
        translateY(-.5rem);
}


body
.site-header.is-near-footer
.site-social-strip {

    opacity: 0;

    pointer-events: none;

    transform:
        translateX(
            var(--ap-social-shift)
        )
        translateY(-140%) !important;
}



/* ================================================================
   MÓVIL
================================================================ */

@media (max-width:767px) {

    .site-footer__contacts {

        grid-template-columns: 1fr;

        gap: .35rem;

        max-width: none;

        margin-top: 1.35rem;

        padding-top: .85rem;
    }


    .site-footer__contact--email {

        grid-column: auto;
    }


    .site-footer__contact {

        grid-template-columns:
            2.2rem
            minmax(0,1fr);

        gap: .65rem;

        padding:
            .55rem
            .15rem;
    }


    .site-footer__contact-icon {

        width: 2.2rem;
        height: 2.2rem;
    }


    .site-footer__contact-icon svg {

        width: 1.25rem;
        height: 1.25rem;
    }


    .site-footer__contact-copy strong {

        font-size:
            .76rem !important;

        white-space: normal;

        overflow-wrap: anywhere;
    }

}



/* ================================================================
   REDUCED MOTION
================================================================ */

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

    .site-footer__contact,
    .site-footer__contact-icon,
    .site-header.is-near-footer
    .site-social-row,
    .site-header.is-near-footer
    .site-social-strip {

        transition: none !important;
    }

}


/* AP FOOTER SOCIAL CONTACTS CSS END */


/* SOURCE: animations.css */
/* AP Neural Web — Motion Foundation V3 / fail-open */

[data-ap-reveal] {
    opacity: 1;
    transform: none;
}

.js.ap-reveal-ready [data-ap-reveal] {
    opacity: 0;
    transform: translateY(1rem);
    transition:
        opacity var(--duration-slow) var(--ease-ap),
        transform var(--duration-slow) var(--ease-ap);
}

.js.ap-reveal-ready [data-ap-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
    [data-ap-reveal] { opacity: 1 !important; transform: none !important; }
}