/* PCForge: neutral presentation shared with the Mainframe-inspired hero. */
:root {
    --background: #f3f3f3;
    --foreground: #3b3b3b;
    --surface: #fdfdfd;
    --navy: #323232;
    --ink: #3b3b3b;
    --muted: #737373;
    --blue: #858585;
    --line: #e1e1e1;
    --surface-page: var(--background);
    --surface-default: var(--surface);
    --surface-raised: #fff;
    --surface-interactive: #f0f0f0;
    --text-primary: var(--foreground);
    --text-secondary: var(--muted);
    --border-default: var(--line);
    --accent: var(--blue);
    --accent-hover: #707070;
    --focus-ring: #9d9d9d;
    --status-success: #477b68;
    --status-warning: #8a641b;
    --status-error: #a33d4b;
    --proto-ink: #353535;
    --proto-blue: #858585;
    --proto-blue-soft: #f0f0f0;
    --proto-paper: #f3f3f3;
    --proto-card: #fdfdfd;
    --proto-line: #e1e1e1;
    --proto-text: #3b3b3b;
    --proto-muted: #737373;
    --proto-green: #477b68;
    --proto-green-soft: #e9f3ef;
    --proto-warm: #8a641b;
    --proto-warm-soft: #fff4df;
}

body {
    background: var(--background);
    color: var(--foreground);
    font-family: "DM Sans", "Segoe UI", Arial, sans-serif;
}
.site-header, .site-footer { background: var(--navy); }
.logo b, nav a[aria-current="page"] { color: #cccccc; }
nav a[aria-current="page"] { border-color: #b0b0b0; }
.site-header a:hover, .site-footer a:hover { color: #dedede; }
.button { background: var(--accent); }
.button:hover { background: var(--accent-hover); }
.text-link:hover, .text-button:hover, .product-detail:hover,
.proto-tool a:hover, .proto-way-copy > span:last-child { color: #747474; }
:focus-visible { outline-color: #9d9d9d; }

input, select, .tool-select, .budget-number {
    border-color: #d7d7d7;
    background-color: #fdfdfd;
}
input:focus, select:focus, .tool-select:focus, .budget-number:focus {
    border-color: #a7a7a7;
}

.site-footer { color: #e3e3e3; }
.home-page, .components-hub-page, .category-page { background: var(--background); }
.header-dialog { border-color: #e1e1e1; background: #fdfdfd; color: #3b3b3b; }
.header-dialog-close { background: #efefef; color: #3b3b3b; }
.header-search-result:hover { border-color: #bebebe; background: #f6f6f6; }
.profile-icon-large { background: #f0f0f0; color: #858585; }

/* Los paneles de componentes conservan sus colores propios. */
.category-cpu, .category-cpu:hover, .product-photo.photo-cpu { background: #cdd4df; }
.category-gpu, .category-gpu:hover, .product-photo.photo-gpu { background: #cbd7d2; }
.category-ram, .category-ram:hover, .product-photo.photo-ram { background: #ded5c7; }

/* Inicio: tarjetas neutras y violeta oscuro, en consonancia con la cabecera. */
.idea-blue { background: #3e3e3e; color: #fdfdfd; }
.idea-blue p { color: #e3e3e3; }
.idea-blue a:hover { color: #e1e1e1; }
.idea-sand { background: #fdfdfd; color: #3b3b3b; border: 1px solid var(--line); }
.idea-sand p { color: var(--muted); }
.idea-sand .text-link { color: #747474; }

/* Portada: foto nítida en una franja propia, sin máscara ni degradado. */
.home-page .hardware-feature {
    display: grid;
    grid-template-rows: auto minmax(280px, 1fr);
    align-content: stretch;
    background: #20242b;
}
.home-page .feature-copy { position: relative; z-index: 1; padding-bottom: 28px; }
.home-page .feature-photo {
    position: relative;
    isolation: isolate;
    inset: auto;
    z-index: 0;
    width: 100%;
    height: 100%;
    min-height: 280px;
    overflow: hidden;
}
.home-page .feature-photo::after {
    position: absolute;
    inset: 66% 0 0;
    z-index: 1;
    background: linear-gradient(to bottom, transparent, rgba(32,36,43,.48) 48%, #20242b 100%);
    content: "";
    pointer-events: none;
}
.home-page .feature-photo img {
    mask-image: none;
    -webkit-mask-image: none;
    filter: none;
    object-position: center 63%;
}
.home-page .idea-card .text-link,
.home-page .idea-card .text-link:hover {
    border-bottom: 0;
    text-decoration: none;
}
.home-page .idea-stack {
    align-content: start;
    grid-template-rows: auto auto;
}
.home-page .idea-card {
    min-height: 0;
    padding-block: 28px;
}

.journey-card,
.journey-card:nth-child(2),
.journey-card:nth-child(3) {
    background: #fdfdfd;
    color: #3b3b3b;
    border: 1px solid var(--line);
}
.journey-card > p:not(.journey-label) { color: var(--muted); }
.journey-card .text-link { color: #747474; }
.journey-card.journey-active {
    background: #3e3e3e;
    color: #fdfdfd;
    border-color: #3e3e3e;
}
.journey-card.journey-active > p:not(.journey-label) { color: #e3e3e3; }
.journey-card.journey-active .text-link { color: #fdfdfd; }
.journey-card.journey-active .text-link:hover { color: #e1e1e1; }

.product-card, .hub-category-card, .category-product-card,
.home-build-card, .proto-tool { border-color: var(--line); }
.filters, .empty-state { background: #eaeaea; }
.product-category, .category-eyebrow, .hub-category-copy > span { color: #858585; }

.prototype-v2 { background: var(--proto-paper); color: var(--proto-text); }
.proto-tool { background-color: var(--proto-card); }
.proto-tool:nth-child(even) { background: #f5f5f5; }
.proto-tool-header { border-color: #e6e6e6; }
.proto-tool-header h2, .prototype-v2 .proto-v2-copy h1 { color: var(--proto-ink); }
.proto-v2-hero { background: #fdfdfd; border-color: var(--proto-line); }
.proto-v2-visual { background: linear-gradient(145deg, #e9e9e9, #dfdfdf); }
.proto-v2-copy .eyebrow, .proto-tool-header .index { color: #858585; }
.prototype-v2 .proto-v2-copy > p:not(.eyebrow) { color: #656565; }
.proto-tool-badge { background: #f0f0f0; color: #747474; }
.compare-v2-box, .detail-v2, .smart-config, .builder-field { background-color: #f5f5f5; }
.compare-helper { background: #f0f0f0; color: #5c5c5c; }
.comparison-table > span:nth-child(-n+3) { background: #3d3d3d; }
.comparison-table > span:nth-child(n+4):nth-child(-n+6) { background: #efefef; }
.smart-v2-top { background: #353535; }
.smart-choice.is-selected { border-color: #a7a7a7; background: #f3f3f3; }
.smart-choice-icon { background: #f0f0f0; color: #858585; }
.budget-range { accent-color: #858585; }
.proto-way { border-color: var(--proto-line); }
.proto-way-image { background: #e9e9e9; }
.proto-way-image--contain { padding: 12px; }

/* Modo oscuro: tinta ciruela y superficies lavanda profundas, sin negro puro. */
html[data-theme="dark"] {
    color-scheme: dark;
    --background: #191919;
    --foreground: #f3f3f3;
    --surface: #242424;
    --navy: #242424;
    --ink: #f3f3f3;
    --muted: #bbbbbb;
    --blue: #c1c1c1;
    --line: #404040;
    --surface-page: var(--background);
    --surface-default: var(--surface);
    --surface-raised: #2c2c2c;
    --surface-interactive: #383838;
    --text-primary: var(--foreground);
    --text-secondary: var(--muted);
    --border-default: var(--line);
    --accent: var(--blue);
    --accent-hover: #d4d4d4;
    --focus-ring: #dddddd;
    --status-success: #8fc2a9;
    --status-warning: #e4bf70;
    --status-error: #f08e9b;
    --proto-ink: #f3f3f3;
    --proto-blue: #c1c1c1;
    --proto-blue-soft: #383838;
    --proto-paper: #191919;
    --proto-card: #242424;
    --proto-line: #404040;
    --proto-text: #f3f3f3;
    --proto-muted: #bbbbbb;
    --proto-green-soft: #263a34;
    --proto-warm-soft: #433723;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .home-page,
html[data-theme="dark"] .components-hub-page,
html[data-theme="dark"] .category-page,
html[data-theme="dark"] .prototype-v2 {
    background: var(--background);
    color: var(--foreground);
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-footer { background: #242424; }
html[data-theme="dark"] .site-header a:hover,
html[data-theme="dark"] .site-footer a:hover { color: #dedede; }
html[data-theme="dark"] .site-header .header-icon-button { color: #e8e8e8; }
html[data-theme="dark"] .site-header .header-icon-button:hover { background: #3a3a3a; color: #fff; }

html[data-theme="dark"] .header-dialog,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .hub-category-card,
html[data-theme="dark"] .category-product-card,
html[data-theme="dark"] .catalog-product-card,
html[data-theme="dark"] .home-build-card,
html[data-theme="dark"] .idea-sand,
html[data-theme="dark"] .journey-card,
html[data-theme="dark"] .proto-tool,
html[data-theme="dark"] .proto-v2-hero,
html[data-theme="dark"] .smart-config,
html[data-theme="dark"] .builder-field,
html[data-theme="dark"] .compare-v2-box,
html[data-theme="dark"] .detail-v2 {
    border-color: var(--line);
    background-color: var(--surface);
    color: var(--foreground);
}

html[data-theme="dark"] .comparator-body .compare-v2-product,
html[data-theme="dark"] .compare-compatibility-item { border-color: var(--line); background: var(--surface); }
html[data-theme="dark"] .comparator-body .compare-v2-product-image { background: #323232; }
html[data-theme="dark"] .comparison-row:not(.comparison-head) > span:first-child { background: var(--surface); }
html[data-theme="dark"] .comparison-row.is-different > span { background: color-mix(in srgb, #858585 22%, var(--surface)); }
html[data-theme="dark"] .compare-build-context { border-color: var(--line); background: #323232; }
html[data-theme="dark"] .compatibility-status { background: #282828; }

html[data-theme="dark"] .hub-category-card:hover,
html[data-theme="dark"] .catalog-product-card:hover,
html[data-theme="dark"] .product-card:hover { color: var(--foreground); }
html[data-theme="dark"] .components-hub .hub-category-copy > strong b { border-color: #535353; background: #383838; color: #dedede; }
html[data-theme="dark"] .components-hub .hub-category-card:hover .hub-category-copy > strong b,
html[data-theme="dark"] .components-hub .hub-category-card:focus-visible .hub-category-copy > strong b { border-color: #a4a4a4; background: #868686; color: #fff; }
html[data-theme="dark"] .hub-category-media,
html[data-theme="dark"] .catalog-product-media,
html[data-theme="dark"] .comparison-image,
html[data-theme="dark"] .product-photo,
html[data-theme="dark"] .proto-v2-visual,
html[data-theme="dark"] .proto-way-image {
    background: #2d2d2d;
}
html[data-theme="dark"] .prototype-v2 .proto-way {
    border-color: #454545;
    background: #242424;
    color: #f3f3f3;
}
html[data-theme="dark"] .prototype-v2 .proto-way-copy h3 { color: #f3f3f3; }
html[data-theme="dark"] .prototype-v2 .proto-way-copy p { color: #c9c9c9; }
html[data-theme="dark"] .prototype-v2 .proto-way-copy > span:last-child { color: #d2d2d2; }
html[data-theme="dark"] .prototype-v2 .proto-way:hover { border-color: #7e7e7e; background: #2d2d2d; }
html[data-theme="dark"] .hub-category-media img { mix-blend-mode: normal; }
html[data-theme="dark"] .hub-category-copy p,
html[data-theme="dark"] .catalog-product-specs,
html[data-theme="dark"] .comparison-table td,
html[data-theme="dark"] .comparison-note,
html[data-theme="dark"] .category-section-heading > p,
html[data-theme="dark"] .hub-section-heading > p,
html[data-theme="dark"] .header-search-status,
html[data-theme="dark"] .header-profile-dialog > p:not(.eyebrow),
html[data-theme="dark"] .prototype-v2 .proto-v2-copy > p:not(.eyebrow) {
    color: var(--muted);
}

html[data-theme="dark"] .filters,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .proto-tool:nth-child(even),
html[data-theme="dark"] .compare-helper,
html[data-theme="dark"] .smart-choice-icon,
html[data-theme="dark"] .profile-icon-large,
html[data-theme="dark"] .header-dialog-close {
    background: #323232;
    color: #e8e8e8;
}
html[data-theme="dark"] .header-search-result,
html[data-theme="dark"] .search-result,
html[data-theme="dark"] .smart-choice,
html[data-theme="dark"] .journey-card,
html[data-theme="dark"] .idea-sand {
    border-color: var(--line);
    background: #282828;
    color: var(--foreground);
}
html[data-theme="dark"] .header-search-result:hover,
html[data-theme="dark"] .site-header .component-menu-item:hover,
html[data-theme="dark"] .site-header .component-menu-item:focus-visible,
html[data-theme="dark"] .smart-choice.is-selected {
    border-color: #7f7f7f;
    background: #383838;
    color: var(--foreground);
}

html[data-theme="dark"] .header-search-topbar,
html[data-theme="dark"] .header-search-suggestions { border-color: var(--line); }
html[data-theme="dark"] .header-search-dialog { background: #232323; }
html[data-theme="dark"] .header-search-topbar { background: var(--navy); color: #f7f7f7; }
html[data-theme="dark"] .header-search-topbar input { color: var(--foreground); }
html[data-theme="dark"] .header-search-topbar input::placeholder { color: var(--muted); }
html[data-theme="dark"] .header-search-product-media { background: #f8f8f8; }
html[data-theme="dark"] .header-search-product > span:not(.header-search-product-media) { color: var(--muted); }
html[data-theme="dark"] .header-search-suggestion { color: var(--foreground); }
html[data-theme="dark"] .header-search-suggestion:hover,
html[data-theme="dark"] .header-search-suggestion:focus-visible,
html[data-theme="dark"] .header-search-product:hover strong,
html[data-theme="dark"] .header-search-product:focus-visible strong { color: #d5d5d5; }

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .tool-select,
html[data-theme="dark"] .budget-number {
    border-color: #545454;
    background-color: #1d1d1d;
    color: #f3f3f3;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #9f9f9f; }
html[data-theme="dark"] .header-search-topbar input,
html[data-theme="dark"] .header-search-topbar input:focus {
    border: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
}
html[data-theme="dark"] .header-search-topbar input::-webkit-search-cancel-button {
    display: none;
    -webkit-appearance: none;
    appearance: none;
}
html[data-theme="dark"] .component-mega-menu {
    border-color: #464646;
    background: #242424;
    color: var(--foreground);
}
html[data-theme="dark"] .component-menu-intro h2,
html[data-theme="dark"] .site-header .component-menu-item { color: var(--foreground); }
html[data-theme="dark"] .component-menu-intro > p:not(.eyebrow),
html[data-theme="dark"] .component-menu-item small { color: #bbbbbb; }
html[data-theme="dark"] .component-menu-icon { background: #383838; color: #d2d2d2; }

html[data-theme="dark"] .comparison-scroll,
html[data-theme="dark"] .comparison-table,
html[data-theme="dark"] .comparison-table thead th,
html[data-theme="dark"] .comparison-table tbody tr,
html[data-theme="dark"] .comparison-table tbody tr:nth-child(odd) {
    background: #242424;
}
html[data-theme="dark"] .comparison-scroll,
html[data-theme="dark"] .comparison-table th,
html[data-theme="dark"] .comparison-table td,
html[data-theme="dark"] .catalog-product-footer { border-color: var(--line); }
html[data-theme="dark"] .comparison-table .comparison-label,
html[data-theme="dark"] .comparison-table .comparison-product,
html[data-theme="dark"] .catalog-product-heading h3,
html[data-theme="dark"] .hub-category-copy h3 { color: var(--foreground); }
html[data-theme="dark"] .comparison-table .comparison-image { background: #323232; }
html[data-theme="dark"] .comparison-table .comparison-image img { mix-blend-mode: normal; }

html[data-theme="dark"] .idea-blue,
html[data-theme="dark"] .journey-card.journey-active,
html[data-theme="dark"] .smart-v2-top { background: #333333; color: #f3f3f3; }
html[data-theme="dark"] .idea-blue p,
html[data-theme="dark"] .journey-card.journey-active > p:not(.journey-label) { color: #e0e0e0; }
html[data-theme="dark"] .button { background: #979797; color: #fff; }
html[data-theme="dark"] .button:hover { background: #acacac; }
html[data-theme="dark"] .text-link,
html[data-theme="dark"] .text-button,
html[data-theme="dark"] .catalog-source,
html[data-theme="dark"] .category-filters .text-button,
html[data-theme="dark"] .product-category,
html[data-theme="dark"] .category-eyebrow,
html[data-theme="dark"] .hub-category-copy > span { color: #cdcdcd; }

html[data-theme="dark"] .category-card,
html[data-theme="dark"] .component-choice,
html[data-theme="dark"] .smart-result,
html[data-theme="dark"] .screen-placeholder,
html[data-theme="dark"] .builder-steps div,
html[data-theme="dark"] .fake-select,
html[data-theme="dark"] .choice-row span,
html[data-theme="dark"] .proto-build-feature,
html[data-theme="dark"] .proto-build-card,
html[data-theme="dark"] .proto-compare-item,
html[data-theme="dark"] .about-principles article,
html[data-theme="dark"] .about-person {
    border-color: var(--line);
    background: #242424;
    color: var(--foreground);
}
html[data-theme="dark"] .component-choice:nth-child(2n),
html[data-theme="dark"] .builder-steps div.active,
html[data-theme="dark"] .smart-result,
html[data-theme="dark"] .screen-placeholder,
html[data-theme="dark"] .proto-build-feature-media,
html[data-theme="dark"] .proto-build-card-media,
html[data-theme="dark"] .component-build-cta-media,
html[data-theme="dark"] .component-preview,
html[data-theme="dark"] .about-avatar {
    background: #323232;
}
html[data-theme="dark"] .component-preview.ficha-ram,
html[data-theme="dark"] .component-preview.ficha-storage,
html[data-theme="dark"] .component-preview.ficha-psu { background: #323232; }
html[data-theme="dark"] .component-banner-link,
html[data-theme="dark"] .category-card:hover { color: var(--foreground); }
html[data-theme="dark"] .home-page .home-component-banners .category-gpu,
html[data-theme="dark"] .home-page .home-component-banners .category-ram,
html[data-theme="dark"] .home-page .home-component-banners .category-card,
html[data-theme="dark"] .journey-card:nth-child(2),
html[data-theme="dark"] .journey-card:nth-child(3) {
    border-color: var(--line);
    background: #282828;
    color: var(--foreground);
}
html[data-theme="dark"] .journey-card > p:not(.journey-label),
html[data-theme="dark"] .about-person p,
html[data-theme="dark"] .about-principles p { color: var(--muted); }
html[data-theme="dark"] .about-page,
html[data-theme="dark"] .about-main { background: var(--background); color: var(--foreground); }
html[data-theme="dark"] .about-principles article,
html[data-theme="dark"] .about-person { box-shadow: 0 14px 32px #00000020; }
html[data-theme="dark"] .prototype-status.is-error { border-color: #69454d; background: #3c282e; color: #f0c2ca; }
html[data-theme="dark"] .proto-tool-header { border-color: var(--line); }
html[data-theme="dark"] .proto-v2-copy h1,
html[data-theme="dark"] .proto-tool-header h2,
html[data-theme="dark"] .proto-build-feature h2,
html[data-theme="dark"] .proto-build-card h3,
html[data-theme="dark"] .proto-compare-item h3,
html[data-theme="dark"] .about-principles h2,
html[data-theme="dark"] .about-person h3 { color: var(--foreground); }
html[data-theme="dark"] .proto-build-tag,
html[data-theme="dark"] .proto-tool-badge { background: #3e3e3e; color: #dddddd; }
html[data-theme="dark"] .comparison-table > span:nth-child(-n+3) { background: #333333; color: #f3f3f3; }
html[data-theme="dark"] .comparison-table > span:nth-child(n+4):nth-child(-n+6) { background: #2c2c2c; color: #e9e9e9; }
html[data-theme="dark"] .auth-tabs button.is-active { background: #474747; color: #e9e9e9; }

html[data-theme="dark"] .forbi-panel,
html[data-theme="dark"] .chatbot-panel,
html[data-theme="dark"] .forbi-chat,
html[data-theme="dark"] .chatbot-window {
    border-color: var(--line);
    background: #242424;
    color: var(--foreground);
}
html[data-theme="dark"] .account-page { background: #191919; color: #f3f3f3; }
html[data-theme="dark"] .account-layout {
    background:
        radial-gradient(ellipse at 8% 8%, rgba(167, 167, 167, .16), transparent 34%),
        radial-gradient(ellipse at 92% 88%, rgba(86, 150, 180, .12), transparent 38%),
        #191919;
}
html[data-theme="dark"] .account-card {
    border-color: #434343;
    background: rgba(36, 36, 36, .97);
    box-shadow: 0 18px 52px rgba(0, 0, 0, .25), 0 2px 8px rgba(0, 0, 0, .14);
}
html[data-theme="dark"] .account-brand .logo-word,
html[data-theme="dark"] .account-card h1,
html[data-theme="dark"] .member-panel h2,
html[data-theme="dark"] .member-name { color: #f3f3f3; }
html[data-theme="dark"] .account-intro,
html[data-theme="dark"] .account-benefits,
html[data-theme="dark"] .account-hint,
html[data-theme="dark"] .member-email,
html[data-theme="dark"] .member-note { color: #bbbbbb; }
html[data-theme="dark"] .account-form label { color: #eaeaea; }
html[data-theme="dark"] .account-form input { border-color: #545454; background: #1d1d1d; color: #f3f3f3; }
html[data-theme="dark"] .account-tabs { background: #323232; }
html[data-theme="dark"] .account-tabs button { color: #c6c6c6; }
html[data-theme="dark"] .account-tabs button.is-active { background: #474747; color: #e9e9e9; }
html[data-theme="dark"] .provider-button { border-color: #545454; background: #2c2c2c; color: #f3f3f3; }
html[data-theme="dark"] .provider-button:hover { border-color: #929292; background: #383838; }
html[data-theme="dark"] .account-divider { color: #bbbbbb; }
html[data-theme="dark"] .account-divider::before,
html[data-theme="dark"] .account-divider::after { background: #424242; }
html[data-theme="dark"] .account-benefits i { background: #383838; color: #d9d9d9; }
html[data-theme="dark"] .account-back { color: #cdcdcd; }

html[data-theme="dark"] .pcf-chat-panel { border-color: #535353; background: #242424; color: #f3f3f3; }
html[data-theme="dark"] .pcf-chat-header { border-color: #535353; background: #383838; color: #f3f3f3; }
html[data-theme="dark"] .pcf-chat-heading small { color: #d1d1d1; }
html[data-theme="dark"] .pcf-chat-close { background: #484848; color: #f3f3f3; }
html[data-theme="dark"] .pcf-chat-body { background: #242424; }
html[data-theme="dark"] .pcf-chat-bubble { border-color: #4a4a4a; background: #323232; color: #f3f3f3; }
html[data-theme="dark"] .pcf-chat-message.is-user .pcf-chat-bubble { background: #5f5f5f; border-color: #5f5f5f; color: #fff; }
html[data-theme="dark"] .pcf-chat-footer { border-color: #4a4a4a; background: #282828; }
html[data-theme="dark"] .pcf-chat-action { border-color: #535353; background: #383838; color: #e5e5e5; }
html[data-theme="dark"] .pcf-chat-input { border-color: #545454 !important; background: #1d1d1d !important; color: #f3f3f3 !important; }
html[data-theme="dark"] .pcf-chat-hint { color: #bbbbbb; }

.theme-toggle--floating {
    position: fixed;
    z-index: 1200;
    top: 18px;
    right: 20px;
    width: 44px;
    height: 44px;
    border: 1px solid #e1e1e1;
    background: #fdfdfd;
    color: #747474;
    box-shadow: 0 5px 20px #2424241c;
}
.theme-toggle--floating:hover { background: #f0f0f0; color: #585858; }
html[data-theme="dark"] .theme-toggle--floating {
    border-color: #545454;
    background: #323232;
    color: #e8e8e8;
}
html[data-theme="dark"] .theme-toggle--floating:hover { background: #424242; color: #fff; }
html[data-theme="dark"] .profile-hover-menu {
    border-color: #4a4a4a;
    background: #2c2c2c;
    color: #f3f3f3;
    box-shadow: 0 18px 38px #00000050;
}
html[data-theme="dark"] .profile-hover-menu::after { border-color: #4a4a4a; background: #2c2c2c; }
html[data-theme="dark"] .profile-hover-menu p { color: #c6c6c6; }
html[data-theme="dark"] .profile-menu-summary { border-color: #4a4a4a; }
html[data-theme="dark"] .profile-menu-summary strong { color: #f3f3f3; }
html[data-theme="dark"] .profile-menu-summary small { color: #bbbbbb; }
html[data-theme="dark"] .profile-menu-summary .profile-menu-eyebrow { color: #cdcdcd; }
html[data-theme="dark"] .profile-menu-count { background: #3e3e3e; color: #e2e2e2; }
html[data-theme="dark"] .profile-menu-links a { border-color: #424242; color: #eaeaea; }
html[data-theme="dark"] .profile-menu-signout { color: #d8d8d8; }
html[data-theme="dark"] .profile-hover-menu .profile-menu-secondary,
html[data-theme="dark"] .profile-hover-menu .profile-menu-secondary:hover { color: #d8d8d8; }
html[data-theme="dark"] .build-auth-notice { border-color: #535353; background: #323232; color: #f3f3f3; }
html[data-theme="dark"] .build-auth-notice p { color: #c6c6c6; }
html[data-theme="dark"] .build-compatibility.has-conflicts { border-left-color: #fb7185; color: #ffc2ce; }
html[data-theme="dark"] .build-compatibility.has-conflicts strong,
html[data-theme="dark"] .build-compatibility li.is-conflict > span { color: #ffc2ce; }
html[data-theme="dark"] .builder-save-blocked { border-color: #8f5361; border-left-color: #fb7185; background: #2d1d29; color: #f7e9ef; }
html[data-theme="dark"] .builder-save-blocked > strong { color: #ffc2ce; }
html[data-theme="dark"] .builder-save-blocked p,
html[data-theme="dark"] .builder-save-blocked ul { color: #e1cbd5; }
html[data-theme="dark"] .builder-save-blocked a { color: #e2e2e2; }

/* Paleta nocturna PCForge: superficies con profundidad y texto de alto contraste. */
html[data-theme="dark"] {
    --background: #131313;
    --foreground: #f9f9f9;
    --surface: #1f1f1f;
    --surface-raised: #282828;
    --surface-soft: #323232;
    --navy: #1a1a1a;
    --ink: #f9f9f9;
    --muted: #cccccc;
    --blue: #cdcdcd;
    --line: #454545;
    --proto-ink: #f9f9f9;
    --proto-blue: #cdcdcd;
    --proto-blue-soft: #3e3e3e;
    --proto-paper: #131313;
    --proto-card: #1f1f1f;
    --proto-line: #454545;
    --proto-text: #f9f9f9;
    --proto-muted: #cccccc;
    --proto-green: #68d5b0;
    --proto-green-soft: #17382f;
    --proto-warm: #ffc078;
    --proto-warm-soft: #402b23;
    --color-bg-page: #131313;
    --color-bg-card: #1f1f1f;
    --color-bg-media: #2d2d2d;
    --color-border: #454545;
    --color-text: #f9f9f9;
    --color-text-muted: #cccccc;
    --color-primary: #cdcdcd;
    --color-accent-soft: #3e3e3e;
    --color-media-blue: #2d2d2d;
    --color-media-beige: #2f2f2f;
    --color-media-green: #202d32;
    --color-media-lavender: #323232;
    color-scheme: dark;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .home-page,
html[data-theme="dark"] .components-hub-page,
html[data-theme="dark"] .category-page,
html[data-theme="dark"] .prototype-v2,
html[data-theme="dark"] .about-page,
html[data-theme="dark"] .about-main,
html[data-theme="dark"] .catalog-page,
html[data-theme="dark"] .catalog-page-body,
html[data-theme="dark"] .category-main,
html[data-theme="dark"] .account-page {
    background-color: var(--background);
    color: var(--foreground);
}

html[data-theme="dark"] :is(h1, h2, h3, h4, strong, label, legend, summary, dt),
html[data-theme="dark"] .catalog-product-heading h3,
html[data-theme="dark"] .catalog-price,
html[data-theme="dark"] .product-price,
html[data-theme="dark"] .product-body h3,
html[data-theme="dark"] .builder-selection strong,
html[data-theme="dark"] .smart-result strong,
html[data-theme="dark"] .comparison-table th,
html[data-theme="dark"] .comparison-table .comparison-product {
    color: #f9f9f9;
}

html[data-theme="dark"] :is(p, li, dd, figcaption, .section-intro, .catalog-note, .product-summary, .product-brand, .product-status, .catalog-product-specs, .comparison-note, .detail-note, .tool-note, .screen-muted, .prototype-intro, .about-person p, .about-principles p),
html[data-theme="dark"] .header-search-status,
html[data-theme="dark"] .header-profile-dialog > p:not(.eyebrow),
html[data-theme="dark"] .prototype-v2 .proto-v2-copy > p:not(.eyebrow) {
    color: #cccccc;
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-footer {
    background: #1a1a1a;
    color: #f6f6f6;
}
html[data-theme="dark"] .site-header a:hover,
html[data-theme="dark"] .site-footer a:hover { color: #e2e2e2; }
html[data-theme="dark"] .site-header .header-icon-button { color: #ececec; }
html[data-theme="dark"] .site-header .header-icon-button:hover { background: #333333; color: #fff; }

html[data-theme="dark"] :is(.product-card, .hub-category-card, .category-product-card, .catalog-product-card, .home-build-card, .proto-tool, .proto-v2-hero, .smart-config, .builder-field, .compare-v2-box, .detail-v2, .category-card, .component-choice, .smart-result, .screen-placeholder, .builder-steps div, .fake-select, .choice-row span, .proto-build-feature, .proto-build-card, .proto-compare-item, .about-principles article, .about-person, .prototype-screen, .prototype-card, .tool-card, .saved-build-card, .recommended-build, .smart-build-card, .build-suggestion, .builder-box, .builder-panel, .builder-summary, .comparison-scroll, .comparison-section, .ficha-preview, .compare-placeholder) {
    border-color: #454545;
    background-color: #1f1f1f;
    color: #f9f9f9;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] :is(.product-card, .hub-category-card, .category-product-card, .catalog-product-card, .home-build-card, .proto-tool, .category-card, .component-choice, .prototype-screen, .prototype-card, .tool-card, .saved-build-card, .smart-build-card, .build-suggestion, .builder-box, .builder-panel, .builder-summary):hover {
    border-color: #7e7e7e;
    background-color: #282828;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .28), 0 0 0 1px rgba(205, 205, 205, .1);
}

html[data-theme="dark"] :is(.filters, .category-filters, .empty-state, .proto-tool:nth-child(even), .compare-helper, .smart-choice-icon, .profile-icon-large, .header-dialog-close, .builder-steps div, .component-preview, .proto-build-feature-media, .proto-build-card-media, .component-build-cta-media, .about-avatar, .catalog-product-media, .comparison-image, .product-photo, .proto-v2-visual, .proto-way-image) {
    border-color: #454545;
    background-color: #2d2d2d;
    color: #f0f0f0;
}
html[data-theme="dark"] .category-extra-filters input {
    border-color: #535353;
    background: #232323;
    color: #f3f3f3;
    color-scheme: dark;
}
html[data-theme="dark"] :is(.hub-category-media, .component-feature-media, .component-build-cta-media, .category-hero-products, .featured-products, .lineup-product-media) {
    background-color: #2d2d2d;
}
html[data-theme="dark"] .components-hub .hub-category-card .hub-category-media { background-color: #2d2d2d; }
html[data-theme="dark"] :is(.hub-category-media img, .comparison-image img, .product-photo img) {
    mix-blend-mode: normal;
    filter: none;
}
html[data-theme="dark"] .components-hub .hub-category-card .hub-category-media img,
html[data-theme="dark"] .catalog-page-body .product-photo .local-product-image,
html[data-theme="dark"] .catalog-page-body .product-photo > img {
    mix-blend-mode: normal;
    filter: drop-shadow(0 14px 16px rgba(0, 0, 0, .24));
}
html[data-theme="dark"] :is(.components-guide, .component-build-cta, .component-feature, .about-purpose, .about-team, .prototipos-block) {
    border-color: #454545;
    background-color: #1f1f1f;
    color: #f9f9f9;
}
html[data-theme="dark"] .about-project-focus {
    border: 1px solid #454545;
    background: linear-gradient(145deg, #282828, #202020);
    color: #f9f9f9;
}
html[data-theme="dark"] .about-project-focus p:not(.eyebrow) { color: #e1e1e1; }

/* Sustituye las tarjetas pastel del modo claro por acentos ciruela y violeta. */
html[data-theme="dark"] :is(.category-cpu, .category-cpu:hover, .product-photo.photo-cpu, .category-gpu, .category-gpu:hover, .product-photo.photo-gpu, .category-ram, .category-ram:hover, .product-photo.photo-ram, .home-page .home-component-banners .category-gpu, .home-page .home-component-banners .category-ram, .home-page .home-component-banners .category-card, .journey-card, .journey-card:nth-child(2), .journey-card:nth-child(3), .idea-sand) {
    border-color: #454545;
    background: linear-gradient(145deg, #282828, #202020);
    color: #f9f9f9;
}
html[data-theme="dark"] :is(.idea-blue, .journey-card.journey-active, .smart-v2-top) {
    background: linear-gradient(135deg, #505050, #343434);
    border-color: #727272;
    color: #fff;
}
html[data-theme="dark"] :is(.idea-blue p, .journey-card.journey-active > p:not(.journey-label), .journey-card > p:not(.journey-label), .idea-sand p) { color: #e1e1e1; }

html[data-theme="dark"] :is(.text-link, .text-button, .catalog-source, .category-filters .text-button, .product-category, .category-eyebrow, .hub-category-copy > span, .proto-v2-copy .eyebrow, .proto-tool-header .index, .profile-menu-eyebrow, .catalog-product-heading .product-category) { color: #d4d4d4; }
html[data-theme="dark"] :is(.button, .button-primary, .btn-primary, .profile-menu-primary, .build-login-link) {
    border-color: transparent;
    background: #acacac;
    color: #181818;
}
html[data-theme="dark"] :is(.button, .button-primary, .btn-primary, .profile-menu-primary, .build-login-link):hover { background: #c1c1c1; color: #181818; }
html[data-theme="dark"] .button-dark { background: #3e3e3e; color: #f9f9f9; }
html[data-theme="dark"] .button-dark:hover { background: #4e4e4e; color: #fff; }

html[data-theme="dark"] :is(input, select, textarea, .tool-select, .budget-number, .pcf-chat-input) {
    border-color: #5a5a5a;
    background-color: #181818;
    color: #f9f9f9;
}
html[data-theme="dark"] :is(input, select, textarea, .tool-select, .budget-number):focus { border-color: #cdcdcd; box-shadow: 0 0 0 3px rgba(205, 205, 205, .16); }
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #acacac; }

html[data-theme="dark"] .comparison-table,
html[data-theme="dark"] .comparison-table thead th,
html[data-theme="dark"] .comparison-table tbody tr,
html[data-theme="dark"] .comparison-table tbody tr:nth-child(odd),
html[data-theme="dark"] .comparison-table > span:nth-child(n+4):nth-child(-n+6) {
    background: #1f1f1f;
    color: #ececec;
}
html[data-theme="dark"] .comparison-table > span:nth-child(-n+3) { background: #343434; color: #fff; }
html[data-theme="dark"] :is(.comparison-table th, .comparison-table td, .comparison-scroll, .catalog-product-footer, .proto-tool-header, .account-divider::before, .account-divider::after) { border-color: #454545; }

html[data-theme="dark"] :is(.header-dialog, .component-mega-menu, .profile-hover-menu, .forbi-panel, .chatbot-panel, .forbi-chat, .chatbot-window) {
    border-color: #4c4c4c;
    background: #232323;
    color: #f9f9f9;
    box-shadow: 0 20px 48px rgba(0, 0, 0, .4);
}
html[data-theme="dark"] :is(.header-search-result, .search-result, .smart-choice, .journey-card, .idea-sand, .profile-menu-links a) {
    border-color: #454545;
    background-color: #282828;
    color: #f6f6f6;
}
html[data-theme="dark"] :is(.header-search-result:hover, .site-header .component-menu-item:hover, .site-header .component-menu-item:focus-visible, .smart-choice.is-selected) {
    border-color: #acacac;
    background: #3e3e3e;
    color: #fff;
}
html[data-theme="dark"] .component-menu-icon,
html[data-theme="dark"] .proto-tool-badge,
html[data-theme="dark"] .proto-build-tag,
html[data-theme="dark"] .home-build-tag,
html[data-theme="dark"] .badge-soft,
html[data-theme="dark"] .status-tag { background: #3e3e3e; color: #e7e7e7; }

html[data-theme="dark"] .pcf-region-menu {
    border-color: #4c4c4c;
    background: #232323;
    color: #f9f9f9;
}
html[data-theme="dark"] :is(.pcf-language-option, .pcf-region-search) {
    border-color: #5a5a5a;
    background: #1a1a1a;
    color: #f9f9f9;
}
html[data-theme="dark"] :is(.pcf-language-option:hover, .pcf-language-option[aria-current="true"], .pcf-region-option:hover, .pcf-region-option[aria-current="true"]) { background: #3e3e3e; color: #fff; }
html[data-theme="dark"] :is(.pcf-language-code, .pcf-region-meta, .pcf-region-note) { color: #cccccc; }
html[data-theme="dark"] .pcf-language-options { border-color: #454545; }
html[data-theme="dark"] .pcf-region-flag { border-color: #5a5a5a; }

html[data-theme="dark"] :is(.prototype-status, .build-preview-note, .smart-disclaimer, .compare-placeholder, .saved-empty) { color: #cccccc; }
html[data-theme="dark"] .prototype-status.is-error { border-color: #87505f; background: #3b202d; color: #ffd2dc; }
html[data-theme="dark"] .prototype-status.is-success { border-color: #36745f; background: #17382f; color: #b6f2d9; }
html[data-theme="dark"] .theme-toggle--floating { border-color: #5a5a5a; background: #323232; color: #e2e2e2; }
html[data-theme="dark"] .theme-toggle--floating:hover { background: #4e4e4e; color: #fff; }
html[data-theme="dark"] .breadcrumb a,
html[data-theme="dark"] .category-facts dd,
html[data-theme="dark"] .product-image-model,
html[data-theme="dark"] .product-image-brand,
html[data-theme="dark"] .product-image-loading,
html[data-theme="dark"] .catalog-source { color: #d4d4d4; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Versión oscura refinada: tinta ciruela, superficies separadas y contraste alto. */
html[data-theme="dark"] {
    --background: #131313;
    --foreground: #f7f7f7;
    --surface: #1e1e1e;
    --surface-raised: #282828;
    --surface-soft: #313131;
    --navy: #1a1a1a;
    --ink: #f7f7f7;
    --muted: #cacaca;
    --blue: #d3d3d3;
    --line: #454545;
    --proto-ink: #f7f7f7;
    --proto-blue: #d3d3d3;
    --proto-blue-soft: #3d3d3d;
    --proto-paper: #131313;
    --proto-card: #1e1e1e;
    --proto-line: #454545;
    --proto-text: #f7f7f7;
    --proto-muted: #cacaca;
    --color-bg-page: #131313;
    --color-bg-card: #1e1e1e;
    --color-bg-media: #dadada;
    --color-border: #454545;
    --color-text: #f7f7f7;
    --color-text-muted: #cacaca;
    --color-primary: #d3d3d3;
    --color-accent-soft: #3d3d3d;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .home-page,
html[data-theme="dark"] .components-hub-page,
html[data-theme="dark"] .category-page,
html[data-theme="dark"] .catalog-page,
html[data-theme="dark"] .catalog-page-body,
html[data-theme="dark"] .category-main,
html[data-theme="dark"] .prototype-v2,
html[data-theme="dark"] .about-page,
html[data-theme="dark"] .about-main,
html[data-theme="dark"] .account-page {
    background-color: var(--background);
    color: var(--foreground);
}

html[data-theme="dark"] :is(h1, h2, h3, h4, .hub-category-copy h3, .component-feature-body h3) {
    color: var(--foreground);
}
html[data-theme="dark"] :is(.home-page .home-component-banners .category-card h3,
    .home-page .home-component-banners .category-card p) {
    color: var(--foreground) !important;
}
html[data-theme="dark"] .home-page .home-component-banners .category-card p { color: #d9d9d9 !important; }

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-footer { background: #1a1a1a; color: #f7f7f7; }
html[data-theme="dark"] .site-header a,
html[data-theme="dark"] .site-footer a { color: #f0f0f0; }
html[data-theme="dark"] .site-header a:hover,
html[data-theme="dark"] .site-footer a:hover { color: #e2e2e2; }

html[data-theme="dark"] :is(.hub-category-card, .component-feature, .components-guide,
    .about-purpose, .about-team, .prototipos-block, .component-choice,
    .product-card, .category-product-card, .catalog-product-card, .home-build-card,
    .journey-card, .idea-sand, .proto-tool, .builder-panel, .builder-box,
    .builder-summary, .smart-config, .compare-v2-box, .detail-v2) {
    border-color: #454545;
    background-color: #1e1e1e;
    color: #f7f7f7;
}

/* La zona de imagen funciona como una base de exhibición, sin bloques blancos sueltos. */
html[data-theme="dark"] :is(.hub-category-media, .component-feature-media,
    .catalog-product-media, .comparison-image, .product-photo, .lineup-product-media) {
    background: #dadada;
}
html[data-theme="dark"] :is(.hub-category-media img, .component-feature-media img,
    .catalog-product-media img, .comparison-image img, .product-photo img,
    .lineup-product-media img) {
    mix-blend-mode: normal;
    filter: none;
}
html[data-theme="dark"] .components-hub .hub-category-card--gpu .hub-category-media img {
    content: url("/img/catalogo/tema-oscuro/geforce-rtx-5080.png");
}
html[data-theme="dark"] .components-hub .hub-category-card--storage .hub-category-media img {
    content: url("/img/catalogo/tema-oscuro/ssd-m2-nvme.png");
}

/* El disipador usa la misma base oscura que el resto de las categorías. */
html[data-theme="dark"] .components-hub .hub-category-card--cooling .hub-category-media {
    background: #2d2d2d;
}
html[data-theme="dark"] .components-hub .hub-category-card--cooling .hub-category-media img {
    mix-blend-mode: normal;
    filter: none;
}

html[data-theme="dark"] .components-hub .hub-category-copy p,
html[data-theme="dark"] .component-feature-body p,
html[data-theme="dark"] .component-feature-body li,
html[data-theme="dark"] .components-guide p:not(.eyebrow),
html[data-theme="dark"] .hub-section-heading > p,
html[data-theme="dark"] .category-section-heading > p,
html[data-theme="dark"] .home-page .section-intro,
html[data-theme="dark"] .home-page .idea-card p,
html[data-theme="dark"] .journey-card > p:not(.journey-label) {
    color: #cacaca;
}
html[data-theme="dark"] .components-guide {
    background: linear-gradient(125deg, #242424 0 50%, #1c1c1c 50% 100%);
}
html[data-theme="dark"] .components-guide h2,
html[data-theme="dark"] .components-guide .eyebrow { color: #f7f7f7; }

/* Tres franjas de la portada con acentos propios y texto legible. */
html[data-theme="dark"] .home-page .home-component-banners .category-card,
html[data-theme="dark"] .home-page .home-component-banners .category-card:hover {
    border: 1px solid #454545;
    color: #f7f7f7 !important;
    box-shadow: 0 18px 42px #00000038;
}
html[data-theme="dark"] .home-page .home-component-banners .category-cpu,
html[data-theme="dark"] .home-page .home-component-banners .category-cpu:hover {
    background: linear-gradient(125deg, #333333, #242424);
}
html[data-theme="dark"] .home-page .home-component-banners .category-gpu,
html[data-theme="dark"] .home-page .home-component-banners .category-gpu:hover {
    background: linear-gradient(125deg, #202b3b, #1a1d2b);
}
html[data-theme="dark"] .home-page .home-component-banners .category-ram,
html[data-theme="dark"] .home-page .home-component-banners .category-ram:hover {
    background: linear-gradient(125deg, #22332f, #1a242b);
}
html[data-theme="dark"] .home-page .home-component-banners .component-banner-link {
    background: #ff7652;
    color: #20131a;
}
html[data-theme="dark"] .home-page .home-component-banners .category-photo::after { opacity: .5; }

html[data-theme="dark"] :is(.text-link, .text-button, .catalog-source, .product-category,
    .category-eyebrow, .hub-category-copy > span, .component-feature-body a,
    .breadcrumb a, .product-detail) { color: #dcdcdc; }
html[data-theme="dark"] :is(.button, .button-primary, .btn-primary, .build-login-link) {
    border-color: transparent;
    background: #ff7652;
    color: #21131a;
}
html[data-theme="dark"] :is(.button, .button-primary, .btn-primary, .build-login-link):hover {
    background: #ff8a69;
    color: #21131a;
}
html[data-theme="dark"] .button-dark { background: #363636; color: #f7f7f7; }
html[data-theme="dark"] .button-dark:hover { background: #484848; color: #fff; }

html[data-theme="dark"] :is(input, select, textarea, .tool-select, .budget-number) {
    border-color: #5a5a5a;
    background: #191919;
    color: #f7f7f7;
}
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #acacac; }
html[data-theme="dark"] :is(.filters, .category-filters, .empty-state, .compare-helper,
    .smart-choice-icon, .component-preview, .builder-steps div) {
    border-color: #454545;
    background: #282828;
    color: #f0f0f0;
}
html[data-theme="dark"] :is(.comparison-table, .comparison-table thead th,
    .comparison-table tbody tr, .comparison-table tbody tr:nth-child(odd)) {
    background: #1e1e1e;
    color: #f0f0f0;
}
html[data-theme="dark"] :is(.comparison-table th, .comparison-table td,
    .comparison-scroll, .catalog-product-footer) { border-color: #454545; }

html[data-theme="dark"] .component-build-cta-media { background: #1a1a1a; }
html[data-theme="dark"] :is(.header-dialog, .component-mega-menu, .profile-hover-menu,
    .forbi-panel, .chatbot-panel, .forbi-chat, .chatbot-window, .pcf-region-menu) {
    border-color: #4f4f4f;
    background: #232323;
    color: #f7f7f7;
}

/* Narrativa y recorrido de herramientas de la página Acerca de. */
.about-page .manifesto-page {
    display: grid;
    gap: clamp(76px, 9vw, 132px);
    padding-top: var(--page-top-space);
    padding-bottom: clamp(76px, 9vw, 128px);
    color: var(--foreground);
}

.about-page .manifesto-page h1,
.about-page .manifesto-page h2,
.about-page .manifesto-page h3,
.about-page .manifesto-page p { margin-top: 0; }

.about-page .manifesto-eyebrow {
    margin-bottom: 20px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .16em;
    line-height: 1.4;
}

.manifesto-hero {
    display: grid;
    min-height: clamp(480px, 43vw, 650px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    border-radius: 28px;
    background: var(--navy);
    color: #fcfcfc;
    box-shadow: 0 24px 70px rgba(47, 47, 47, .12);
}

.manifesto-hero-copy {
    display: flex;
    max-width: 760px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(36px, 6.2vw, 92px);
}

.manifesto-hero .manifesto-eyebrow { color: #cecece; }
.manifesto-hero h1 {
    max-width: 720px;
    margin-bottom: 24px;
    color: #fff;
    font-size: clamp(46px, 6vw, 82px);
    font-weight: 700;
    letter-spacing: -.068em;
    line-height: .99;
}
.manifesto-hero-copy > p:not(.manifesto-eyebrow) {
    max-width: 590px;
    margin-bottom: 34px;
    color: #e1e1e1;
    font-size: clamp(16px, 1.45vw, 19px);
    line-height: 1.65;
}
.manifesto-route { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; color: #eaeaea; font-size: 10px; font-weight: 700; }
.manifesto-route i { color: #c2c2c2; font-size: 17px; font-style: normal; }

.manifesto-hero-visual {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
    padding: clamp(26px, 4vw, 64px);
    background:
        radial-gradient(ellipse at 76% 15%, rgba(165, 165, 165, .28), transparent 44%),
        radial-gradient(ellipse at 20% 90%, rgba(74, 150, 137, .16), transparent 40%),
        #242424;
}
.manifesto-ui-window {
    overflow: hidden;
    border: 1px solid rgba(245, 245, 245, .2);
    border-radius: 16px;
    background: rgba(248, 248, 248, .97);
    box-shadow: 0 28px 70px rgba(7, 7, 7, .34);
    color: #373737;
    transform: rotate(1.4deg);
}
.manifesto-ui-bar { display: flex; min-height: 42px; align-items: center; gap: 12px; padding: 0 16px; border-bottom: 1px solid #e6e6e6; color: #737373; font-size: 10px; font-weight: 700; }
.manifesto-ui-bar > b { margin-left: auto; color: #63ad88; font-size: 9px; }
.manifesto-ui-dots { display: flex; gap: 5px; }
.manifesto-ui-dots i { width: 7px; height: 7px; border-radius: 50%; background: #d6d6d6; }
.manifesto-ui-dots i:first-child { background: #c0c0c0; }
.manifesto-ui-content { padding: clamp(18px, 2.4vw, 32px); }
.manifesto-ui-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 22px; color: #3b3b3b; font-size: clamp(15px, 1.6vw, 20px); font-weight: 800; letter-spacing: -.035em; }
.manifesto-ui-heading i { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: #f0f0f0; color: #858585; font-size: 18px; font-style: normal; }
.manifesto-component-map { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.manifesto-component-map::before { position: absolute; top: 20%; bottom: 20%; left: 50%; z-index: 0; border-left: 1px dashed #cccccc; content: ""; }
.manifesto-component-map span { position: relative; z-index: 1; display: flex; min-height: 55px; align-items: center; gap: 11px; padding: 10px 12px; border: 1px solid #e7e7e7; border-radius: 10px; background: #fff; color: #545454; font-size: 11px; font-weight: 700; }
.manifesto-component-map span:last-child { grid-column: 1 / -1; }
.manifesto-component-map b { display: grid; width: 27px; height: 27px; flex: 0 0 auto; place-items: center; border-radius: 8px; background: #f2f2f2; color: #858585; font-size: 9px; }
.manifesto-ui-foot { display: flex; align-items: center; gap: 10px; margin-top: 22px; color: #838383; font-size: 9px; font-weight: 700; }
.manifesto-ui-line { height: 1px; flex: 1; background: #e5e5e5; }
.manifesto-ui-foot b { color: #8e8e8e; font-size: 11px; letter-spacing: .1em; }
.manifesto-visual-caption { display: flex; align-items: center; gap: 9px; margin: 0; color: #e6e6e6; font-size: 11px; font-weight: 600; }
.manifesto-visual-caption span { width: 7px; height: 7px; border-radius: 50%; background: #9ee0bf; box-shadow: 0 0 14px #9ee0bf88; }

.manifesto-problem { display: grid; grid-template-columns: minmax(160px, .55fr) minmax(0, 1.45fr); gap: clamp(30px, 7vw, 112px); align-items: start; padding-top: 2px; }
.manifesto-section-label { display: flex; align-items: center; gap: 14px; padding-top: 10px; color: var(--muted); }
.manifesto-section-label span { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--blue); font-size: 11px; font-weight: 800; }
.manifesto-section-label p { margin: 0; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.manifesto-problem-copy { max-width: 980px; }
.manifesto-problem h2, .manifesto-origin h2, .manifesto-flow h2, .manifesto-principles h2, .manifesto-team h2, .manifesto-close h2 {
    margin-bottom: 22px;
    color: var(--foreground);
    font-size: clamp(36px, 5vw, 62px);
    font-weight: 700;
    letter-spacing: -.065em;
    line-height: 1.04;
}
.manifesto-problem-copy > p { max-width: 770px; margin-bottom: 30px; color: var(--muted); font-size: clamp(16px, 1.5vw, 19px); line-height: 1.7; }
.manifesto-question-list { display: flex; flex-wrap: wrap; gap: 9px; }
.manifesto-question-list span { padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 11px; font-weight: 700; }

.manifesto-origin { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(36px, 8vw, 128px); align-items: center; padding: clamp(36px, 6vw, 82px) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.manifesto-origin-statement { max-width: 640px; }
.manifesto-origin h2 { margin-bottom: 0; font-size: clamp(38px, 5.2vw, 68px); }
.manifesto-origin-copy { max-width: 700px; }
.manifesto-origin-copy p { margin-bottom: 18px; color: var(--muted); font-size: 16px; line-height: 1.75; }
.manifesto-origin-note { display: flex; align-items: center; gap: 12px; margin-top: 30px; color: var(--foreground); font-size: 13px; font-weight: 700; }
.manifesto-origin-note span:first-child { color: var(--blue); font-size: 22px; }

.manifesto-flow-heading, .manifesto-team-heading { display: flex; align-items: end; justify-content: space-between; gap: 34px; margin-bottom: 36px; }
.manifesto-flow-heading > div { max-width: 760px; }
.manifesto-flow-heading h2, .manifesto-principles h2, .manifesto-team h2 { margin-bottom: 0; }
.manifesto-flow-heading > p, .manifesto-team-heading > p { max-width: 420px; margin-bottom: 4px; color: var(--muted); font-size: 15px; line-height: 1.7; }
.manifesto-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.manifesto-step { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); color: var(--foreground); box-shadow: 0 12px 32px rgba(46, 46, 46, .045); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.manifesto-step:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--blue) 54%, var(--line)); box-shadow: 0 20px 42px rgba(46, 46, 46, .11); color: var(--foreground); }
.manifesto-step:focus-visible { outline-color: var(--blue); }
.manifesto-step-preview { min-height: 190px; padding: 19px; background: #f1f1f1; color: #494949; }
.preview-topline { display: flex; align-items: center; gap: 5px; margin-bottom: 16px; color: #737373; font-size: 9px; font-weight: 700; }
.preview-topline i { width: 6px; height: 6px; border-radius: 50%; background: #c2c2c2; }
.preview-topline i:nth-child(2) { background: #c4d6c9; }.preview-topline i:nth-child(3) { background: #dfc7bd; }
.preview-topline span { margin-left: 5px; }
.preview-search { height: 18px; margin-bottom: 10px; border: 1px solid #dedede; border-radius: 5px; background: #fff; }
.preview-product-row { display: flex; min-height: 31px; align-items: center; gap: 9px; margin-bottom: 7px; padding: 5px 7px; border: 1px solid #e4e4e4; border-radius: 6px; background: #fff; }
.preview-product-row > b { width: 21px; height: 21px; border-radius: 4px; background: linear-gradient(140deg, #d5d5d5, #b7b7b7); }
.preview-product-row:nth-of-type(4) > b { background: linear-gradient(140deg, #d3dfd7, #a2c3b1); }
.preview-product-row > span { display: grid; flex: 1; gap: 4px; }.preview-product-row > span i { height: 4px; border-radius: 9px; background: #cacaca; }.preview-product-row > span i:last-child { width: 58%; background: #e1e1e1; }
.preview-details { display: flex; flex-direction: column; justify-content: center; gap: 13px; background: #ededed; }
.preview-detail-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; color: #494949; font-size: 11px; }
.preview-detail-head i { width: 18px; height: 18px; border-radius: 5px; background: #dcdcdc; }
.preview-spec-row { display: flex; justify-content: space-between; gap: 8px; padding-bottom: 7px; border-bottom: 1px solid #dddddd; color: #777777; font-size: 8px; }
.preview-spec-row b { color: #555555; font-weight: 700; }.preview-detail-foot { display: flex; gap: 5px; padding-top: 3px; }.preview-detail-foot i { width: 27px; height: 8px; border-radius: 99px; background: #dcdcdc; }.preview-detail-foot i:nth-child(2) { width: 42px; background: #d2e2d8; }
.preview-compare { background: #2b2b2b; color: #f6f6f6; }
.preview-compare-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; font-size: 11px; font-weight: 700; }.preview-compare-title i { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid #5b5b5b; border-radius: 7px; color: #dcdcdc; font-size: 9px; font-style: normal; }
.preview-compare-columns { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid #525252; border-radius: 7px; }
.preview-compare-columns > div { display: grid; gap: 9px; padding: 10px; }.preview-compare-columns > div + div { border-left: 1px solid #525252; background: #323232; }.preview-compare-columns b { margin-bottom: 2px; color: #dedede; font-size: 8px; }.preview-compare-columns span { height: 5px; border-radius: 8px; background: #6b6b6b; }.preview-compare-columns span:nth-last-child(1) { width: 65%; background: #a8a8a8; }
.preview-compare-foot { display: flex; align-items: center; gap: 7px; margin-top: 13px; color: #c6c6c6; font-size: 8px; }.preview-compare-foot i { width: 6px; height: 6px; border-radius: 50%; background: #9ad4b8; }
.preview-builder { display: flex; flex-direction: column; gap: 10px; background: #f0f0f0; }
.preview-builder-title { display: flex; align-items: center; justify-content: space-between; color: #4a4a4a; font-size: 10px; }.preview-builder-title span { color: #858585; font-size: 8px; font-weight: 700; }
.preview-builder-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }.preview-builder-grid span { display: flex; min-height: 27px; align-items: center; justify-content: space-between; gap: 4px; padding: 5px 6px; border: 1px solid #dedede; border-radius: 5px; background: #fff; color: #676767; font-size: 7px; font-weight: 700; }.preview-builder-grid i { width: 7px; height: 7px; border-radius: 50%; background: #cbcbcb; }
.preview-builder-total { display: flex; align-items: center; justify-content: space-between; padding-top: 8px; border-top: 1px solid #dedede; color: #767676; font-size: 8px; }.preview-builder-total b { width: 49px; height: 7px; border-radius: 8px; background: #cccccc; }
.manifesto-step-copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 22px 20px 21px; }
.manifesto-step-number { margin-bottom: 12px; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.manifesto-step h3 { margin-bottom: 9px; color: var(--foreground); font-size: 19px; letter-spacing: -.035em; }
.manifesto-step-copy > p { min-height: 50px; margin-bottom: 20px; color: var(--muted); font-size: 13px; line-height: 1.55; }
.manifesto-step-link { display: flex; align-items: center; gap: 8px; margin-top: auto; color: var(--blue); font-size: 12px; font-weight: 800; }
.manifesto-step-link b { font-size: 15px; transition: transform .18s ease; }.manifesto-step:hover .manifesto-step-link b { transform: translate(2px, -2px); }

.manifesto-principles { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(38px, 8vw, 128px); align-items: start; padding: clamp(34px, 6vw, 76px) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.manifesto-principles-intro { max-width: 570px; }
.manifesto-principles h2 { font-size: clamp(38px, 4.7vw, 58px); }
.manifesto-principle-list article { display: grid; grid-template-columns: 44px minmax(0, 1fr) 24px; gap: 18px; align-items: start; padding: 21px 0; border-bottom: 1px solid var(--line); }
.manifesto-principle-list article:first-child { padding-top: 0; }.manifesto-principle-list article:last-child { padding-bottom: 0; border-bottom: 0; }
.manifesto-principle-list article > span { padding-top: 3px; color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.manifesto-principle-list h3 { margin-bottom: 6px; color: var(--foreground); font-size: 18px; letter-spacing: -.025em; }
.manifesto-principle-list p { max-width: 550px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.manifesto-principle-list article > b { color: var(--blue); font-size: 14px; }

.manifesto-statement { position: relative; overflow: hidden; padding: clamp(42px, 7vw, 94px); border: 1px solid #4c4c4c; border-radius: 24px; background: #353535; color: #fff; isolation: isolate; }
.manifesto-statement::before { position: absolute; z-index: -1; top: -34%; right: -4%; width: min(50vw, 620px); aspect-ratio: 1; border: 1px solid #ffffff18; border-radius: 50%; box-shadow: 0 0 0 36px #ffffff08, 0 0 0 72px #ffffff05; content: ""; }
.manifesto-statement::after { position: absolute; z-index: -1; right: 8%; bottom: -1px; width: 36%; height: 1px; background: linear-gradient(90deg, transparent, #bbbbbb, transparent); content: ""; }
.manifesto-statement .manifesto-eyebrow { color: #cfcfcf; }
.manifesto-statement h2 { max-width: 920px; margin-bottom: 20px; color: #fff; font-size: clamp(40px, 6vw, 78px); font-weight: 700; letter-spacing: -.07em; line-height: 1; }
.manifesto-statement > p:not(.manifesto-eyebrow) { max-width: 720px; margin-bottom: 30px; color: #e1e1e1; font-size: clamp(15px, 1.5vw, 18px); line-height: 1.7; }
.manifesto-statement-foot { display: inline-flex; align-items: center; gap: 10px; color: #e1e1e1; font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.manifesto-statement-foot::before { width: 22px; height: 1px; background: #c2c2c2; content: ""; }

.manifesto-team-heading { align-items: end; margin-bottom: 44px; }
.manifesto-team-heading > div { max-width: 750px; }
.manifesto-team h2 { font-size: clamp(38px, 5vw, 62px); }
.manifesto-team-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 3vw, 40px); }
.manifesto-person { min-width: 0; }
.manifesto-portrait { display: block; width: 100%; aspect-ratio: 1.12; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 14px; background-image: url("/img/about/team-portraits.png?v=20261006-team-4"); background-repeat: no-repeat; background-size: 200% 200%; }
.manifesto-portrait--luis { background-position: 0 0; }.manifesto-portrait--nayeli { background-position: 100% 0; }.manifesto-portrait--justin { background-position: 0 100%; }.manifesto-portrait--valeria { background-position: 100% 100%; }
.manifesto-person h3 { margin-bottom: 5px; color: var(--foreground); font-size: 18px; letter-spacing: -.025em; }
.manifesto-person p { margin: 0; color: var(--muted); font-size: 12px; }

.manifesto-close { display: flex; align-items: center; justify-content: space-between; gap: 36px; padding: clamp(32px, 5vw, 64px); border: 1px solid var(--line); border-radius: 20px; background: var(--surface); }
.manifesto-close > div { max-width: 820px; }
.manifesto-close .manifesto-eyebrow { margin-bottom: 13px; }
.manifesto-close h2 { margin-bottom: 13px; font-size: clamp(32px, 4.3vw, 52px); }
.manifesto-close p:not(.manifesto-eyebrow) { max-width: 660px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }
.manifesto-close > a { display: inline-flex; min-height: 50px; flex: 0 0 auto; align-items: center; justify-content: center; gap: 18px; padding: 0 20px; border-radius: 8px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 800; transition: background .18s ease, transform .18s ease; }
.manifesto-close > a:hover { transform: translateY(-2px); background: #707070; color: #fff; }

/* Editorial phase: keep the product walkthrough open and distinct from a card grid. */
.manifesto-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(22px, 4vw, 56px); }
.manifesto-step { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: 20px; padding: 22px 0; overflow: visible; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.manifesto-step:hover { transform: none; border-color: var(--line); box-shadow: none; }
.manifesto-step-preview { min-height: 164px; padding: 15px; }
.manifesto-step-copy { padding: 8px 0; }
.manifesto-step-copy > p { min-height: 0; }
.manifesto-ecosystem { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.manifesto-ecosystem a,.manifesto-ecosystem button { display: grid; min-width: 0; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 5px 12px; padding: 18px 20px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--foreground); text-align: left; text-decoration: none; cursor: pointer; }
.manifesto-ecosystem > :last-child { border-right: 0; }
.manifesto-ecosystem span { grid-column: 1 / -1; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.manifesto-ecosystem strong { font-size: 14px; }
.manifesto-ecosystem b { color: var(--blue); font-size: 15px; }
.manifesto-ecosystem a:hover,.manifesto-ecosystem button:hover { background: color-mix(in srgb, var(--surface) 70%, transparent); }
html[data-theme="dark"] .manifesto-step { background: transparent; box-shadow: none; }
html[data-theme="dark"] .manifesto-step-preview { background: #2b2b2b; }
html[data-theme="dark"] .manifesto-ecosystem a:hover,html[data-theme="dark"] .manifesto-ecosystem button:hover { background: #272727; }

@media(max-width:820px) {
    .manifesto-steps { grid-template-columns: 1fr; }
    .manifesto-step { grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); }
}
@media(max-width:620px) {
    .manifesto-ecosystem { grid-template-columns: 1fr; }
    .manifesto-ecosystem a,.manifesto-ecosystem button { grid-template-columns: minmax(0,1fr) auto; padding: 15px 5px; border-right: 0; border-bottom: 1px solid var(--line); }
    .manifesto-ecosystem > :last-child { border-bottom: 0; }
    .manifesto-step { grid-template-columns: minmax(0,1fr); gap: 6px; padding: 18px 0; }
    .manifesto-step-preview { min-height: 150px; }
}

html[data-theme="dark"] .manifesto-hero { border-color: var(--line); }
html[data-theme="dark"] .manifesto-hero-visual { background: radial-gradient(ellipse at 76% 15%, rgba(165, 165, 165, .2), transparent 44%), radial-gradient(ellipse at 20% 90%, rgba(74, 150, 137, .1), transparent 40%), #1e1e1e; }
html[data-theme="dark"] .manifesto-step { border-color: var(--line); background: var(--surface); }
html[data-theme="dark"] .manifesto-step-preview { background: #2f2f2f; color: var(--foreground); }
html[data-theme="dark"] .preview-compare { background: #242424; }
html[data-theme="dark"] .preview-compare-columns > div + div { background: #323232; }
html[data-theme="dark"] .manifesto-statement { border-color: #4c4c4c; background: #2a2a2a; }
html[data-theme="dark"] .manifesto-close { border-color: var(--line); background: var(--surface); }

@media (max-width: 1080px) {
    .manifesto-hero { min-height: 0; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); }
    .manifesto-hero-copy { padding: clamp(34px, 5vw, 58px); }
    .manifesto-hero h1 { font-size: clamp(44px, 6vw, 66px); }
    .manifesto-hero-visual { padding: clamp(22px, 3.5vw, 40px); }
    .manifesto-component-map span { min-height: 48px; font-size: 10px; }
    .manifesto-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .manifesto-step-preview { min-height: 210px; }
    .manifesto-step-copy > p { min-height: 0; }
    .manifesto-team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 840px) {
    .about-page .manifesto-page { gap: 76px; }
    .manifesto-hero { grid-template-columns: 1fr; }
    .manifesto-hero-copy { padding: clamp(30px, 7vw, 54px); }
    .manifesto-hero h1 { max-width: 650px; font-size: clamp(46px, 10vw, 70px); }
    .manifesto-hero-visual { padding: clamp(24px, 7vw, 48px); }
    .manifesto-ui-window { width: min(100%, 600px); align-self: center; transform: none; }
    .manifesto-ui-content { padding: 22px; }
    .manifesto-problem { grid-template-columns: 1fr; gap: 22px; }
    .manifesto-origin, .manifesto-principles { grid-template-columns: 1fr; gap: 30px; }
    .manifesto-flow-heading, .manifesto-team-heading { display: block; }
    .manifesto-flow-heading > p, .manifesto-team-heading > p { margin-top: 20px; }
    .manifesto-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
    .manifesto-portrait { aspect-ratio: 1.08; }
    .manifesto-close { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 480px) {
    .about-page .manifesto-page { gap: 64px; padding-bottom: 72px; }
    .manifesto-hero { border-radius: 18px; }
    .manifesto-hero-copy { padding: 30px 24px 28px; }
    .manifesto-hero h1 { font-size: clamp(42px, 12vw, 56px); }
    .manifesto-hero-copy > p:not(.manifesto-eyebrow) { margin-bottom: 24px; font-size: 15px; }
    .manifesto-route { gap: 7px; font-size: 10px; }
    .manifesto-hero-visual { gap: 13px; padding: 22px 18px 24px; }
    .manifesto-ui-bar { min-height: 36px; padding-inline: 11px; font-size: 9px; }
    .manifesto-ui-content { padding: 17px 13px; }
    .manifesto-ui-heading { margin-bottom: 14px; font-size: 14px; }
    .manifesto-component-map { gap: 7px; }
    .manifesto-component-map span { min-height: 46px; gap: 7px; padding: 7px; font-size: 9px; }
    .manifesto-component-map b { width: 23px; height: 23px; }
    .manifesto-ui-foot { margin-top: 15px; font-size: 8px; }
    .manifesto-problem h2, .manifesto-origin h2, .manifesto-flow h2, .manifesto-principles h2, .manifesto-team h2 { font-size: clamp(34px, 10vw, 48px); }
    .manifesto-problem-copy > p, .manifesto-origin-copy p { font-size: 15px; }
    .manifesto-question-list { gap: 7px; }
    .manifesto-question-list span { padding: 7px 10px; font-size: 10px; }
    .manifesto-steps { grid-template-columns: 1fr; gap: 13px; }
    .manifesto-step { display: grid; grid-template-columns: minmax(104px, .72fr) minmax(0, 1fr); border-radius: 13px; }
    .manifesto-step-preview { min-height: 0; align-self: stretch; padding: 12px; }
    .preview-topline { margin-bottom: 11px; font-size: 7px; }
    .preview-search { height: 14px; margin-bottom: 7px; }
    .preview-product-row { min-height: 26px; gap: 6px; margin-bottom: 5px; padding: 4px; }
    .preview-product-row > b { width: 17px; height: 17px; }
    .preview-details { gap: 10px; }
    .preview-detail-head { font-size: 9px; }.preview-spec-row { font-size: 7px; }
    .preview-compare-title { font-size: 9px; }.preview-compare-columns > div { gap: 7px; padding: 7px; }.preview-compare-columns b { font-size: 7px; }
    .preview-builder { gap: 7px; }.preview-builder-title { font-size: 8px; }.preview-builder-grid { gap: 4px; }.preview-builder-grid span { min-height: 23px; padding: 4px; font-size: 6px; }
    .manifesto-step-copy { padding: 15px 13px; }
    .manifesto-step-number { margin-bottom: 8px; font-size: 8px; }
    .manifesto-step h3 { margin-bottom: 7px; font-size: 16px; }
    .manifesto-step-copy > p { margin-bottom: 12px; font-size: 11px; }
    .manifesto-step-link { gap: 5px; font-size: 10px; }
    .manifesto-principle-list article { grid-template-columns: 30px minmax(0, 1fr) 16px; gap: 11px; }
    .manifesto-principle-list h3 { font-size: 16px; }.manifesto-principle-list p { font-size: 13px; }
    .manifesto-statement { padding: 36px 24px; border-radius: 18px; }
    .manifesto-statement h2 { max-width: 520px; font-size: clamp(38px, 11vw, 54px); }
    .manifesto-statement > p:not(.manifesto-eyebrow) { font-size: 14px; }
    .manifesto-team-grid { gap: 25px 12px; }
    .manifesto-portrait { margin-bottom: 11px; border-radius: 10px; }
    .manifesto-person h3 { font-size: 16px; }.manifesto-person p { font-size: 11px; }
    .manifesto-close { gap: 22px; padding: 28px 22px; border-radius: 16px; }
    .manifesto-close h2 { font-size: clamp(30px, 9vw, 40px); }
    .manifesto-close p:not(.manifesto-eyebrow) { font-size: 14px; }
    .manifesto-close > a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .manifesto-step, .manifesto-step-link b, .manifesto-close > a { transition: none; }
}

html[data-theme="dark"] .preview-details .preview-detail-head { color: #f1f1f1; }
html[data-theme="dark"] .preview-details .preview-detail-head i { background: #515151; }
html[data-theme="dark"] .preview-details .preview-spec-row { border-color: #545454; color: #cacaca; }
html[data-theme="dark"] .preview-details .preview-spec-row b { color: #f1f1f1; }
html[data-theme="dark"] .preview-details .preview-detail-foot i { background: #a3a3a3; }
html[data-theme="dark"] .preview-details .preview-detail-foot i:nth-child(2) { background: #7eae91; }
html[data-theme="dark"] .preview-builder-title { color: #f1f1f1; }
html[data-theme="dark"] .preview-builder-title span { color: #d5d5d5; }
html[data-theme="dark"] .preview-builder-total { border-color: #545454; color: #d2d2d2; }

/* Imágenes reales y avatares ilustrados en Acerca de. */
.manifesto-hero-visual { position: relative; justify-content: center; padding: clamp(22px, 3vw, 42px); }
.manifesto-hero-photo { position: relative; width: 100%; min-height: 390px; flex: 1; overflow: hidden; margin: 0; border: 1px solid rgba(255,255,255,.14); border-radius: 22px; background: #191919; box-shadow: 0 26px 68px rgba(7, 7, 7,.34); }
.manifesto-hero-photo::after { position: absolute; inset: 35% 0 0; background: linear-gradient(180deg, transparent, rgba(16, 16, 16,.88)); content: ""; pointer-events: none; }
.manifesto-hero-photo img { display: block; width: 100%; height: 100%; min-height: 390px; object-fit: cover; object-position: center; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.manifesto-hero-photo:hover img { transform: scale(1.035); }
.manifesto-hero-photo figcaption { position: absolute; z-index: 1; right: clamp(18px, 3vw, 34px); bottom: clamp(18px, 3vw, 34px); left: clamp(18px, 3vw, 34px); display: grid; gap: 8px; }
.manifesto-hero-photo figcaption span { color: #dcdcdc; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.manifesto-hero-photo figcaption strong { max-width: 430px; color: #fff; font-size: clamp(20px, 2.2vw, 30px); letter-spacing: -.04em; line-height: 1.12; }
.manifesto-hero-badge { position: absolute; right: 12px; bottom: 74px; z-index: 2; display: flex; max-width: min(310px, calc(100% - 36px)); align-items: center; gap: 12px; padding: 13px 16px; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; background: rgba(36, 36, 36,.9); box-shadow: 0 14px 38px rgba(0,0,0,.26); backdrop-filter: blur(12px); }
.manifesto-hero-badge > span { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #858585; color: white; font-size: 19px; }
.manifesto-hero-badge div { display: grid; gap: 4px; }
.manifesto-hero-badge b { color: #fff; font-size: 12px; }
.manifesto-hero-badge small { color: #d6d6d6; font-size: 10px; line-height: 1.35; }
.manifesto-portrait { position: relative; display: grid; overflow: hidden; place-items: end center; border: 1px solid color-mix(in srgb, var(--blue) 18%, var(--line)); border-radius: 18px; background-image: linear-gradient(145deg, #f5f5f5, #e8e8e8); background-repeat: no-repeat; background-size: auto; }
.manifesto-portrait::before { position: absolute; inset: 0; display: grid; place-items: center; color: #858585; font-size: clamp(32px, 5vw, 56px); font-weight: 800; letter-spacing: -.07em; }
.manifesto-portrait--luis::before { content: "LC"; }.manifesto-portrait--nayeli::before { content: "NR"; }.manifesto-portrait--justin::before { content: "JA"; }.manifesto-portrait--valeria::before { content: "VD"; }
.manifesto-portrait img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transition: transform .3s ease; }
.manifesto-person:hover .manifesto-portrait img { transform: translateY(-4px) scale(1.025); }
.manifesto-person h3 { font-size: 19px; letter-spacing: -.025em; }
.manifesto-person p { color: var(--muted); }
html[data-theme="dark"] .manifesto-portrait { background-image: linear-gradient(145deg, #313131, #2a2a2a); }
@media (max-width: 840px) {
    .manifesto-hero-photo, .manifesto-hero-photo img { min-height: 330px; }
    .manifesto-hero-badge { right: 16px; bottom: 68px; }
}
@media (max-width: 480px) {
    .manifesto-hero-visual { padding: 18px; }
    .manifesto-hero-photo, .manifesto-hero-photo img { min-height: 270px; }
    .manifesto-hero-photo { border-radius: 15px; }
    .manifesto-hero-photo figcaption { right: 16px; bottom: 16px; left: 16px; }
    .manifesto-hero-badge { right: 8px; bottom: 58px; gap: 8px; padding: 10px 12px; }
    .manifesto-portrait { border-radius: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .manifesto-hero-photo img, .manifesto-portrait img { transition: none; }
}
html[data-theme="dark"] .preview-builder-total b { background: #b5b5b5; }

/* Los recortes de producto conservan sus colores originales en modo oscuro. */
html[data-theme="dark"] :is(
    .hub-category-media img,
    .component-feature-media img,
    .component-build-cta-media img,
    .catalog-product-media img,
    .comparison-image img,
    .product-photo img,
    .lineup-product-media img,
    .compare-v2-product-image img
) {
    mix-blend-mode: normal;
    filter: none;
}

@media (max-width: 620px) {
    .manifesto-step { grid-template-columns: minmax(0,1fr); gap: 6px; }
    .manifesto-step-preview { min-height: 150px; }
}
@media (prefers-reduced-motion: reduce) {
    .manifesto-step,.manifesto-step-link b,.manifesto-close > a { transition: none; }
}

/* Acerca de: un tono ilustrado y alegre que conserva la identidad de PCForge. */
.about-page {
    background:
        radial-gradient(ellipse at 8% 18%, rgba(225, 225, 225, .22), transparent 27rem),
        radial-gradient(ellipse at 92% 49%, rgba(255, 197, 177, .16), transparent 24rem),
        #f3f3f3;
}
.about-page .manifesto-page { gap: clamp(68px, 8vw, 112px); }
.about-page .manifesto-hero {
    position: relative;
    background: linear-gradient(135deg, #5d5d5d 0%, #353535 54%, #2d2d2d 100%);
    box-shadow: 0 28px 76px rgba(79, 79, 79, .18);
}
.about-page .manifesto-hero::before {
    position: absolute; z-index: 1; top: 21px; left: 22px; width: 13px; height: 13px;
    border: 3px solid #ffc47f; border-radius: 50%; content: ""; pointer-events: none;
    animation: about-sparkle 3.2s ease-in-out infinite;
}
.about-page .manifesto-hero-visual {
    position: relative;
    background:
        radial-gradient(circle at 18% 17%, rgba(255, 195, 130, .42) 0 5px, transparent 6px),
        radial-gradient(circle at 83% 24%, rgba(112, 221, 211, .36) 0 7px, transparent 8px),
        radial-gradient(ellipse at 45% 80%, rgba(168, 168, 168, .52), transparent 58%),
        #242424;
}
.about-page .manifesto-hero-photo {
    min-height: clamp(340px, 36vw, 500px);
    border: 3px solid rgba(255, 255, 255, .14);
    border-radius: 30px;
    background: #2c2c2c;
    box-shadow: 0 24px 55px rgba(9, 9, 9, .32);
    animation: about-rise .75s cubic-bezier(.2,.75,.25,1) both;
}
.about-page .manifesto-hero-photo::after { inset: 62% 0 0; }
.about-page .manifesto-hero-photo img { min-height: inherit; object-position: center 48%; }
.about-page .manifesto-hero-photo figcaption span { color: #ffd28d; }
.about-page .manifesto-hero-badge {
    right: 15px; bottom: 68px; border-radius: 18px;
    background: rgba(55, 55, 55, .94); animation: about-float 4s ease-in-out infinite;
}
.about-page .manifesto-hero-badge > span { border-radius: 50%; background: #e78b76; }
.about-page .manifesto-eyebrow { color: #8c8c8c; }
.about-page .manifesto-section-label span { border-color: #e5b7a2; color: #ba6e5c; background: #fff5ed; }
.about-page .manifesto-question-list span { background: rgba(255,255,255,.72); transition: transform .18s ease, background .18s ease; }
.about-page .manifesto-question-list span:nth-child(3n + 1) { border-color: #e3e3e3; color: #7e7e7e; }
.about-page .manifesto-question-list span:nth-child(3n + 2) { border-color: #f1cbbb; color: #a75f53; }
.about-page .manifesto-question-list span:nth-child(3n) { border-color: #bfe3dc; color: #357c72; }
.about-page .manifesto-question-list span:hover { transform: translateY(-3px) rotate(-2deg); background: #fff; }
.about-page .manifesto-origin-note span:first-child { color: #e4846f; }
.about-page .manifesto-step { border-color: color-mix(in srgb, var(--line) 76%, #c0c0c0); }
.about-page .manifesto-step:nth-child(4n + 1) .manifesto-step-preview { background: #f2f2f2; }
.about-page .manifesto-step:nth-child(4n + 2) .manifesto-step-preview { background: #e6f4f0; }
.about-page .manifesto-step:nth-child(4n + 3) .manifesto-step-preview { background: #fff0e8; }
.about-page .manifesto-step:nth-child(4n) .manifesto-step-preview { background: #fff6dc; }
.about-page .manifesto-step-preview { border-radius: 20px; transition: transform .25s ease; }
.about-page .manifesto-step:hover .manifesto-step-preview { transform: rotate(-1deg) scale(1.02); }
.about-page .manifesto-ecosystem a:hover,
.about-page .manifesto-ecosystem button:hover { color: #858585; }
.about-page .manifesto-statement {
    background:
        radial-gradient(circle at 88% 18%, rgba(227, 132, 111, .25), transparent 18rem),
        linear-gradient(135deg, #353535, #4a4a4a 72%, #365953);
    box-shadow: 0 22px 60px rgba(56, 56, 56, .14);
}
.about-page .manifesto-team-grid { align-items: start; }
.about-page .manifesto-person { text-align: center; }
.about-page .manifesto-portrait {
    width: min(100%, 184px); aspect-ratio: 1; margin: 0 auto 18px;
    border: 4px solid #fff; border-radius: 50%;
    background-image: none;
    background-size: 200% 200%; box-shadow: 0 12px 30px rgba(66, 66, 66, .16);
    transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease;
}
.about-page .manifesto-portrait--luis { background-position: 0 0; }
.about-page .manifesto-portrait--nayeli { background-position: 100% 0; }
.about-page .manifesto-portrait--justin { background-position: 0 100%; }
.about-page .manifesto-portrait--valeria { background-position: 100% 100%; }
.about-page .manifesto-person:hover .manifesto-portrait { transform: translateY(-6px) rotate(-3deg); box-shadow: 0 18px 38px rgba(66, 66, 66, .22); }
.about-page .manifesto-person h3 { margin-bottom: 6px; }
.about-page .manifesto-close { border-radius: 24px; background: linear-gradient(120deg, #fff 0%, #f8f8f8 100%); }
.about-page .manifesto-close > a { border-radius: 999px; background: #7f7f7f; transition: transform .2s ease, background .2s ease; }
.about-page .manifesto-close > a:hover { background: #686868; }
.about-page .manifesto-hero,
.about-page .manifesto-problem,
.about-page .manifesto-origin,
.about-page .manifesto-flow,
.about-page .manifesto-principles,
.about-page .manifesto-statement,
.about-page .manifesto-team,
.about-page .manifesto-close { animation: about-rise .65s cubic-bezier(.2,.75,.25,1) both; }
.about-page .manifesto-problem { animation-delay: .05s; }
.about-page .manifesto-origin { animation-delay: .1s; }
.about-page .manifesto-flow { animation-delay: .15s; }
.about-page .manifesto-principles { animation-delay: .2s; }
.about-page .manifesto-statement { animation-delay: .22s; }
.about-page .manifesto-team { animation-delay: .25s; }
.about-page .manifesto-close { animation-delay: .3s; }
@keyframes about-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes about-float { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-6px) rotate(1deg); } }
@keyframes about-sparkle { 0%,100% { transform: scale(.82); opacity: .65; } 50% { transform: scale(1.24); opacity: 1; } }
html[data-theme="dark"] .about-page { background: radial-gradient(ellipse at 8% 18%, #373737 0, transparent 28rem), #171717; }
html[data-theme="dark"] .about-page .manifesto-question-list span { background: #232323; }
html[data-theme="dark"] .about-page .manifesto-question-list span:hover { background: #323232; }
html[data-theme="dark"] .about-page .manifesto-step:nth-child(4n + 1) .manifesto-step-preview { background: #323232; }
html[data-theme="dark"] .about-page .manifesto-step:nth-child(4n + 2) .manifesto-step-preview { background: #20342f; }
html[data-theme="dark"] .about-page .manifesto-step:nth-child(4n + 3) .manifesto-step-preview { background: #3d2925; }
html[data-theme="dark"] .about-page .manifesto-step:nth-child(4n) .manifesto-step-preview { background: #3c3522; }
html[data-theme="dark"] .about-page .manifesto-close { background: linear-gradient(120deg, #2a2a2a, #323232); }
html[data-theme="dark"] .about-page .manifesto-portrait { border-color: #454545; }
html[data-theme="dark"] .about-page .manifesto-portrait { background-image: none; }
@media (max-width: 840px) {
    .about-page .manifesto-portrait { width: min(100%, 170px); }
}
@media (max-width: 480px) {
    .about-page .manifesto-portrait { width: min(100%, 142px); margin-bottom: 12px; border-radius: 50%; }
    .about-page .manifesto-hero-photo,
    .about-page .manifesto-hero-photo img { min-height: 260px; }
}
@media (prefers-reduced-motion: reduce) {
    .about-page .manifesto-hero::before,
    .about-page .manifesto-hero-photo,
    .about-page .manifesto-hero-badge,
    .about-page .manifesto-hero,
    .about-page .manifesto-problem,
    .about-page .manifesto-origin,
    .about-page .manifesto-flow,
    .about-page .manifesto-principles,
    .about-page .manifesto-statement,
    .about-page .manifesto-team,
    .about-page .manifesto-close { animation: none; }
    .about-page .manifesto-question-list span,
    .about-page .manifesto-step-preview,
    .about-page .manifesto-portrait,
    .about-page .manifesto-close > a { transition: none; }
}

:root { --background: #f1f1f0; --foreground: #252525; --surface: #fdfdfc; --navy: #292929; --ink: #252525; --muted: #686868; --blue: #454545; --line: #dadada; --accent: #343434; --accent-hover: #171717; --focus-ring: #555; --surface-interactive: #e8e8e6; --proto-ink: #252525; --proto-blue: #454545; --proto-blue-soft: #e8e8e6; --proto-paper: #f1f1f0; --proto-card: #fdfdfc; --proto-line: #dadada; --proto-text: #252525; --proto-muted: #686868; }
html[data-theme="dark"] { --background: #191919; --foreground: #f1f1f1; --surface: #232323; --navy: #171717; --ink: #f1f1f1; --muted: #bcbcbc; --line: #404040; --accent: #747474; --accent-hover: #626262; --blue: #747474; --focus-ring: #cacaca; --surface-interactive: #353535; --proto-paper: #191919; --proto-card: #232323; --proto-text: #f1f1f1; --proto-ink: #f1f1f1; --proto-blue: #aaa; --proto-muted: #bcbcbc; }
html body, html body :is(h1,h2,h3,h4,h5,h6,button,input,select,textarea) { font-family: 'HelveticaNowDisplayW01-Rg', 'Helvetica Neue', Arial, sans-serif; }
html body .logo-word { font-family: 'HelveticaNowDisplay-Medium', 'Helvetica Neue', Arial, sans-serif; }
html body :is(.site-header,.site-footer) .logo-symbol { filter: grayscale(1) brightness(3); }
html body :is(.button,.primary) { background: var(--accent); border-color: var(--accent); color: #fff; }
html body :is(.button,.primary):hover { background: var(--accent-hover); }
html body :is(.component-menu-icon,.profile-icon-large) { background: var(--surface-interactive); color: var(--foreground); }
html body :is(.component-mega-menu,.profile-hover-menu,.header-dialog,.pcf-region-menu) { border-color: var(--line); background: var(--surface); color: var(--foreground); }
html body .pcf-chat-launcher { background: #efefed; border-color: #b6b6b2; }
html body .pcf-chat-launcher svg { filter: grayscale(1); }
html body .pcf-chat-launcher:hover { background: #e2e2de; }
html body .pcf-language-option, html body .pcf-region-option { border-color: var(--line); color: var(--foreground); background: var(--surface); }
html body .pcf-language-option:hover, html body .pcf-language-option[aria-pressed="true"], html body .pcf-region-option:hover { background: var(--surface-interactive); border-color: var(--accent); color: var(--foreground); }
html body .account-layout { background: var(--background); }
html body .account-card { background: var(--surface); border-color: var(--line); box-shadow: 0 18px 52px #00000014; }
html body .account-brand .logo-symbol, html body .about-portrait { filter: grayscale(1); }

/* Shared dark surfaces and original Forbi palette. */
html[data-theme="dark"] { --background:#171122; --foreground:#f4edff; --surface:#241a32; --surface-raised:#30223f; --navy:#1d1429; --ink:#f4edff; --muted:#bdb0ce; --line:#493655; --accent:#8760b9; --accent-hover:#9b74ca; --blue:#bd9ae8; --focus-ring:#d8b8ff; --surface-interactive:#3b294f; --proto-paper:#171122; --proto-card:#241a32; --proto-text:#f4edff; --proto-ink:#f4edff; --proto-blue:#bd9ae8; --proto-muted:#bdb0ce; --proto-line:#493655; --proto-blue-soft:#3b294f; }
html[data-theme="dark"] body { background:var(--background); color:var(--foreground); }
html[data-theme="dark"] body :is(.site-header,.site-footer) { background:var(--navy); color:var(--foreground); }
html[data-theme="dark"] body :is(.home-featured-builds,.explore,.inspiration,.journey,.home-reviews) { background:var(--background); color:var(--foreground); }
html[data-theme="dark"] body :is(.home-build-card,.idea-card,.journey-card,.review-card,.home-review-card,.hardware-feature,.category-card,.account-card,.prototype-panel,.tool-card) { background:var(--surface); border-color:var(--line); color:var(--foreground); }
html[data-theme="dark"] body :is(.home-build-card,.idea-card,.journey-card,.review-card,.home-review-card,.hardware-feature,.category-card) :is(h2,h3,h4,strong,p) { color:var(--foreground); }
html[data-theme="dark"] body :is(.eyebrow,.category-code,.idea-label,.text-link,.home-build-link,.section-intro) { color:#c9aceb; }
html[data-theme="dark"] body :is(input,select,textarea) { background:var(--surface); color:var(--foreground); border-color:var(--line); }
html body .pcf-chat-launcher { width:76px; height:76px; background:#efe8fc; border-color:#b6a0dc; }
html body .pcf-chat-launcher svg { width:68px; height:68px; filter:none; }
html body .pcf-chat-launcher:hover { background:#e3d5f6; }
html body .pcf-chat-panel { bottom:106px; }
@media(max-width:600px) { html body .pcf-chat-launcher { width:68px; height:68px; } html body .pcf-chat-launcher svg { width:60px; height:60px; } html body .pcf-chat-panel { bottom:90px; height:min(570px,calc(100dvh - 106px)); } }
html[data-theme="dark"] body.home-page :is(.idea-card,.journey-card,.home-reviews-compose,.home-review-card) { background:#291e38; border-color:#493655; color:#f4edff; }
html[data-theme="dark"] body.home-page :is(.home-reviews-compose,.home-review-card) :is(p,label,h3) { color:#e4d8ef; }
html[data-theme="dark"] body.home-page .home-build-media { background:#352943; }
html[data-theme="dark"] body :is(.account-submit,.home-carousel-button,.home-carousel-cta) { background:#8760b9; color:#fff; }
html[data-theme="dark"] body .account-layout { background:radial-gradient(ellipse at 15% 15%,#352442,transparent 60%),#171122; }
html[data-theme="dark"] body .site-footer .logo-symbol { filter:none; }
