:root {
    color-scheme: light;
    --bg: #f4f6f8;
    --surface: #ffffff;
    --surface-2: #eef2f5;
    --ink: #1d2733;
    --muted: #667085;
    --line: #d8dee6;
    --blue: #174ea6;
    --blue-dark: #113b7b;
    --red: #d92d20;
    --green: #16805c;
    --amber: #f59e0b;
    --shadow: 0 14px 28px rgba(24, 39, 75, 0.1);
    --radius: 8px;
    --page-gutter: 24px;
    --site-font: Arial, Helvetica, sans-serif;
    --site-chrome: #1d2733;
}

[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0d1422;
    --surface: #151f31;
    --surface-2: #202c41;
    --ink: #edf4ff;
    --muted: #aab7c9;
    --line: #2c3a50;
    --blue: #6ea3ff;
    --blue-dark: #4d83df;
    --red: #ff6258;
    --green: #42c28c;
    --amber: #f7bd35;
    --shadow: 0 18px 34px rgba(0, 0, 0, 0.34);
    --site-chrome: #080e19;
}

* {
    box-sizing: border-box;
}

img {
    display: block;
    max-width: 100%;
}

body {
    margin: 0;
    font-family: var(--site-font, Arial, Helvetica, sans-serif);
    background: var(--bg);
    color: var(--ink);
}

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

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

input,
select,
textarea {
    background: var(--surface);
    color: var(--ink);
}

.container {
    width: calc(100% - (var(--page-gutter) * 2));
    max-width: none;
    margin: 0 auto;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 6px 18px rgba(24, 39, 75, 0.06);
}

.top-strip {
    background: var(--site-chrome);
    color: #fff;
    font-size: 13px;
}

.top-strip-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
    gap: 16px;
}

.top-strip a {
    font-weight: 700;
    color: #ffd166;
}

.header-main {
    display: grid;
    grid-template-columns: auto minmax(280px, 1fr) auto;
    align-items: center;
    gap: 22px;
    padding: 16px 0;
}

.brand {
    display: inline-flex;
    align-items: center;
    min-width: 190px;
}

.brand-logo-wrap {
    position: relative;
    display: grid;
    place-items: center;
    width: 190px;
    height: 72px;
    flex: 0 0 190px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: 0 8px 18px rgba(24, 39, 75, 0.08);
}

.brand-logo {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: 0;
    background: transparent;
}

.brand-logo.is-logo-fitted,
.mobile-drawer-logo img.is-logo-fitted {
    position: absolute;
    z-index: 2;
    max-width: none;
    max-height: none;
    object-fit: initial;
    padding: 0;
    background: transparent;
}

.brand-logo.theme-logo-dark,
.mobile-drawer-logo img.theme-logo-dark {
    display: none;
}

[data-theme="dark"] .brand-logo.theme-logo-light,
[data-theme="dark"] .mobile-drawer-logo img.theme-logo-light {
    display: none;
}

[data-theme="dark"] .brand-logo.theme-logo-dark,
[data-theme="dark"] .mobile-drawer-logo img.theme-logo-dark {
    display: block;
}

[data-theme="dark"] .brand-logo-wrap,
[data-theme="dark"] .brand-logo.theme-logo-dark {
    background: var(--surface);
}

.brand-logo-fallback {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: var(--blue);
    color: #fff;
    font-weight: 800;
    opacity: 0;
    pointer-events: none;
}

.brand-wordmark {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    padding: 1px 3px 0;
    color: var(--blue-dark);
    font-family: "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
    font-weight: 900;
    line-height: 0.78;
    text-align: center;
    text-transform: uppercase;
}

.brand-wordmark strong {
    display: block;
    font-size: 50px;
    font-weight: 900;
    letter-spacing: 0.025em;
}

.brand-wordmark span {
    display: block;
    margin-top: 6px;
    color: #68717c;
    font-size: 21px;
    font-weight: 900;
    letter-spacing: 0.075em;
}

.brand-wordmark-custom {
    display: grid;
    align-items: center;
    justify-items: var(--site-logo-justify, center);
    padding: 8px 8px 8px calc(8px + var(--site-logo-indent, 0px));
    overflow-wrap: anywhere;
    color: var(--site-logo-light, var(--blue-dark));
    font-family: var(--site-logo-font, "Arial Narrow", Arial, sans-serif);
    font-size: var(--site-logo-size, 38px);
    line-height: 1;
    text-align: var(--site-logo-align, center);
    text-transform: none;
}

[data-theme="dark"] .brand-wordmark.brand-wordmark-custom {
    color: var(--site-logo-dark, #b9e3ff);
    text-shadow: var(--site-logo-neon-shadow, 0 0 2px #fff, 0 0 6px var(--site-logo-dark, #47b5ff), 0 0 13px var(--site-logo-dark, #1677ff));
}

[data-theme="dark"] .brand-wordmark {
    color: #83c6ff;
}

[data-theme="dark"] .brand-wordmark strong {
    color: #b9e3ff;
    text-shadow: 0 0 2px #fff,
        0 0 6px #47b5ff,
        0 0 13px #1677ff,
        0 0 22px rgba(22, 119, 255, 0.72);
}

[data-theme="dark"] .brand-wordmark span {
    color: #c4c9cf;
    text-shadow: 0 0 2px #f4f5f6,
        0 0 6px rgba(196, 201, 207, 0.95),
        0 0 13px rgba(128, 136, 145, 0.85),
        0 0 21px rgba(92, 99, 107, 0.68);
}

.global-search {
    display: grid;
    grid-template-columns: 1fr auto;
    border: 2px solid var(--blue);
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--surface);
}

.global-search input {
    min-width: 0;
    border: 0;
    padding: 12px 14px;
    outline: none;
}

.global-search button,
.button-primary,
.filter-submit,
.product-actions button {
    border: 0;
    background: var(--blue);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.global-search button {
    padding: 0 22px;
}

.global-search button:hover,
.button-primary:hover,
.filter-submit:hover,
.product-actions button:hover {
    background: var(--blue-dark);
    box-shadow: 0 10px 22px rgba(23, 78, 166, 0.22);
    transform: translateY(-1px);
}

.global-search button:active,
.button-primary:active,
.filter-submit:active,
.product-actions button:active {
    transform: translateY(0) scale(0.98);
}

.header-actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.header-actions a,
.theme-toggle,
.menu-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    overflow: hidden;
    transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.header-actions a::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 5px;
    height: 3px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0;
    transform: scaleX(0.35);
    transform-origin: left center;
    transition: transform 180ms ease, opacity 180ms ease;
}

.header-logout-link {
    border-color: rgba(217, 45, 32, .24) !important;
    color: var(--red) !important;
}

.mobile-logout-link {
    color: var(--red) !important;
    font-weight: 900 !important;
}

.header-actions a:hover,
.header-actions a:focus,
.theme-toggle:hover,
.theme-toggle:focus,
.menu-toggle:hover,
.menu-toggle:focus {
    border-color: rgba(23, 78, 166, 0.35);
    background: #eef4ff;
    color: var(--blue);
    box-shadow: 0 8px 18px rgba(24, 39, 75, 0.08);
    transform: translateY(-1px);
}

.header-actions a:hover::after,
.header-actions a:focus::after,
.header-actions a.is-current::after {
    opacity: 1;
    transform: scaleX(1);
}

.header-actions a.is-current {
    border-color: rgba(23, 78, 166, 0.35);
    background: #eaf3ff;
    color: var(--blue);
    box-shadow: inset 0 0 0 1px rgba(23, 78, 166, 0.1);
}

.header-actions a:active,
.theme-toggle:active,
.menu-toggle:active,
.nav-page-link:active,
.products-trigger:active,
.is-clicked {
    animation: controlPress 240ms ease;
}

.theme-toggle {
    display: inline-grid;
    place-items: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    border-radius: 999px;
    color: var(--blue);
    box-shadow: 0 10px 22px rgba(24, 39, 75, 0.08);
}

.theme-toggle:hover,
.theme-toggle:focus {
    border-color: rgba(23, 78, 166, 0.35);
    background: var(--surface);
    color: var(--blue);
    box-shadow: 0 14px 26px rgba(23, 78, 166, 0.16);
    outline: none;
    transform: translateY(-2px) rotate(-8deg);
}

.theme-icon {
    position: absolute;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    transition: opacity 180ms ease, transform 180ms ease;
}

.theme-icon svg {
    width: 18px;
    height: 18px;
}

.theme-icon-moon {
    opacity: 0;
    transform: rotate(90deg) scale(0.6);
}

:root[data-theme="dark"] .theme-icon-sun {
    opacity: 0;
    transform: rotate(-90deg) scale(0.6);
}

:root[data-theme="dark"] .theme-icon-moon {
    opacity: 1;
    transform: rotate(0) scale(1);
}

.quote-link {
    position: relative;
    gap: 8px;
    font-weight: 700;
}

.quote-link span {
    display: grid;
    place-items: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--red);
    color: #fff;
    font-size: 12px;
}

.menu-toggle {
    display: none;
    width: 46px;
    min-width: 46px;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    padding: 0;
}

.menu-toggle span {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition: transform 180ms ease, opacity 180ms ease;
}

.menu-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
}

.menu-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.menu-toggle[aria-expanded="true"] {
    border-color: rgba(23, 78, 166, 0.35);
    background: #eaf3ff;
    color: var(--blue);
    box-shadow: inset 0 0 0 1px rgba(23, 78, 166, 0.1);
}

.category-nav {
    position: relative;
    z-index: 70;
    border-top: 1px solid var(--line);
    background: rgba(249, 250, 251, 0.9);
    backdrop-filter: blur(18px);
}

.category-nav-inner {
    display: flex;
    align-items: center;
    min-height: 58px;
    gap: 8px;
}

.menu-backdrop,
.mobile-drawer-head,
.mobile-menu-panels {
    display: none;
}

body.menu-lock {
    overflow: hidden;
}

body.modal-lock {
    overflow: hidden;
}

.products-dropdown {
    position: relative;
}

.products-trigger {
    --nav-glow-surface: var(--surface);
    --nav-glow-text: var(--ink);
    position: relative;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--nav-glow-text);
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    overflow: visible;
    outline: none;
    transition: color 180ms ease, transform 180ms ease;
}

.products-trigger::after,
.nav-page-link::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border: 1px solid rgba(23, 78, 166, 0.16);
    border-radius: inherit;
    background: var(--nav-glow-surface);
    box-shadow: 0 10px 22px rgba(24, 39, 75, 0.06);
}

.products-trigger::before,
.nav-page-link::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    z-index: -2;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: inherit;
    background: linear-gradient(
        45deg,
        #174ea6,
        #38bdf8,
        #f59e0b,
        #d92d20,
        #16805c,
        #6ea3ff,
        #f7bd35,
        #174ea6
    );
    background-size: 600%;
    filter: blur(8px);
    opacity: 0;
    transition: opacity 260ms ease-in-out;
    animation: huntNavGlow 20s linear infinite;
}

.products-trigger:hover,
.products-trigger:focus,
.products-trigger.is-current,
.products-dropdown.is-open .products-trigger {
    --nav-glow-surface: var(--blue);
    --nav-glow-text: #fff;
    color: var(--nav-glow-text);
    transform: translateY(-2px);
}

.products-trigger:hover::before,
.products-trigger:focus::before,
.products-trigger.is-current::before,
.products-dropdown.is-open .products-trigger::before {
    opacity: 1;
}

.products-trigger span {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid currentColor;
}

.products-dropdown.is-open .products-trigger span {
    transform: rotate(180deg);
}

.products-trigger span {
    transition: transform 180ms ease;
}

.products-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 500;
    display: none;
    width: min(900px, calc(100vw - 32px));
    max-height: min(680px, calc(100vh - 160px));
    overflow: auto;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 0 0 var(--radius) var(--radius);
    box-shadow: var(--shadow);
}

.products-menu[hidden] {
    display: none;
}

.products-dropdown.is-open .products-menu {
    display: block;
    animation: menuDrop 180ms ease both;
}

.products-menu-head {
    position: sticky;
    top: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
}

.products-menu-head strong,
.products-menu-head small {
    display: block;
}

.products-menu-head small {
    color: var(--muted);
    margin-top: 3px;
    font-size: 12px;
}

.products-menu-head a {
    color: var(--blue);
    font-weight: 700;
    white-space: nowrap;
}

.products-menu-grid {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    min-height: 390px;
}

.products-primary-list {
    display: grid;
    align-content: start;
    border-right: 1px solid var(--line);
    background: #f8fafc;
}

.products-primary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 50px;
    padding: 0 14px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    font-weight: 800;
    color: var(--ink);
    text-align: left;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.products-primary span {
    min-width: 0;
}

.products-primary small {
    display: inline-grid;
    place-items: center;
    min-width: 26px;
    height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
}

.products-primary:hover,
.products-primary:focus,
.products-primary.is-active {
    background: var(--surface);
    color: var(--blue);
    outline: none;
    transform: translateX(2px);
}

.products-primary.is-active {
    box-shadow: inset 4px 0 0 var(--blue);
}

.products-panel-stack {
    min-width: 0;
    background: var(--surface);
}

.products-panel {
    display: none;
    padding: 20px;
}

.products-panel.is-active {
    display: block;
    animation: panelFade 180ms ease both;
}

.products-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line);
}

.products-panel-head strong {
    display: block;
    font-size: 22px;
}

.products-panel-head p {
    max-width: 500px;
    margin: 6px 0 0;
    color: var(--muted);
    line-height: 1.45;
}

.products-panel-head a,
.products-panel-all,
.products-panel-empty a {
    color: var(--blue);
    font-weight: 800;
    white-space: nowrap;
}

.products-panel-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 24px;
    padding-top: 18px;
}

.products-panel-group {
    min-width: 0;
}

.products-panel-group h3 {
    margin: 0 0 8px;
    font-size: 16px;
}

.products-panel-group h3 a {
    color: var(--ink);
}

.products-panel-group div {
    display: grid;
    gap: 7px;
}

.products-panel-group div a {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.3;
}

.products-panel-group div a:hover,
.products-panel-group h3 a:hover {
    color: var(--blue);
}

.products-panel-group div a::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 8px;
    border-radius: 999px;
    background: #98a2b3;
    vertical-align: 1px;
}

.products-panel-empty {
    display: grid;
    gap: 10px;
    padding-top: 18px;
    color: var(--muted);
}

.flash {
    margin: 16px auto 0;
    padding: 12px 14px;
    border-radius: var(--radius);
    background: #eaf3ff;
    color: var(--blue-dark);
    border: 1px solid #b8d7ff;
}

.flash-success {
    background: #eaf8f1;
    color: var(--green);
    border-color: #bce7d1;
}

.flash-error {
    background: #fff1f0;
    color: var(--red);
    border-color: #ffc9c4;
}

.store-front {
    padding: 22px 0 8px;
}

.store-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
}

.filter-panel,
.summary-card,
.customer-card,
.quote-send-card,
.admin-settings-card,
.admin-note {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.hero-panel {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    background: #0f274a;
    color: #fff;
    border-radius: var(--radius);
}

.hero-slide {
    position: absolute;
    inset: 0;
    display: grid;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 420ms ease;
}

.hero-slide.is-active {
    opacity: 1;
    pointer-events: auto;
}

.hero-slide img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.hero-slide-shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(8, 20, 38, 0.92) 0%, rgba(8, 20, 38, 0.78) 38%, rgba(8, 20, 38, 0.18) 78%),
        linear-gradient(180deg, rgba(8, 20, 38, 0.22), rgba(8, 20, 38, 0.54));
}

.hero-slide.banner-focus-left img {
    object-position: left center;
}

.hero-slide.banner-focus-right img {
    object-position: right center;
}

.hero-slide.banner-focus-top img {
    object-position: center top;
}

.hero-slide.banner-focus-bottom img {
    object-position: center bottom;
}

.banner-text-top {
    align-items: start;
}

.banner-text-middle {
    align-items: center;
}

.banner-text-bottom {
    align-items: end;
}

.banner-text-left .hero-copy {
    justify-self: start;
    text-align: left;
}

.banner-text-center .hero-copy {
    justify-self: center;
    text-align: center;
}

.banner-text-right .hero-copy {
    justify-self: end;
    text-align: right;
}

.banner-text-center .hero-actions {
    justify-content: center;
}

.banner-text-right .hero-actions {
    justify-content: end;
}

.banner-shade-none .hero-slide-shade {
    background: transparent;
}

.banner-shade-soft .hero-slide-shade {
    background:
        linear-gradient(90deg, rgba(8, 20, 38, 0.62) 0%, rgba(8, 20, 38, 0.34) 42%, rgba(8, 20, 38, 0.08) 100%),
        linear-gradient(180deg, rgba(8, 20, 38, 0.06), rgba(8, 20, 38, 0.22));
}

.banner-shade-medium .hero-slide-shade {
    background:
        linear-gradient(90deg, rgba(8, 20, 38, 0.92) 0%, rgba(8, 20, 38, 0.78) 38%, rgba(8, 20, 38, 0.18) 78%),
        linear-gradient(180deg, rgba(8, 20, 38, 0.22), rgba(8, 20, 38, 0.54));
}

.banner-shade-dark .hero-slide-shade {
    background:
        linear-gradient(90deg, rgba(4, 10, 22, 0.96) 0%, rgba(5, 14, 28, 0.88) 52%, rgba(5, 14, 28, 0.44) 100%),
        linear-gradient(180deg, rgba(4, 10, 22, 0.34), rgba(4, 10, 22, 0.7));
}

.hero-copy {
    position: relative;
    z-index: 2;
    max-width: 780px;
    padding: 48px 76px;
}

.eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.hero-panel .eyebrow {
    color: #ffd166;
}

.hero-copy h1,
.category-hero h1,
.quote-heading h1,
.catalog-heading h1 {
    margin: 0;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: 0;
}

.hero-copy p,
.category-hero p,
.quote-heading p,
.catalog-heading p {
    color: #d9e6f5;
    line-height: 1.6;
}

.hero-actions {
    display: grid;
    grid-template-columns: minmax(260px, 520px) auto;
    align-items: center;
    gap: 14px;
    margin-top: 24px;
}

.hero-search {
    display: grid;
    grid-template-columns: 1fr auto;
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
}

.hero-search input {
    border: 0;
    min-width: 0;
    padding: 14px;
    outline: none;
}

.hero-search button {
    border: 0;
    padding: 0 18px;
    background: var(--amber);
    color: #111827;
    font-weight: 800;
}

.hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 18px;
    border-radius: var(--radius);
    background: #fff;
    color: var(--blue);
    font-weight: 800;
    white-space: nowrap;
}

.hero-control {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.34);
    color: #fff;
    cursor: pointer;
    transform: translateY(-50%);
    transition: background-color 160ms ease, transform 160ms ease;
}

.hero-control:hover,
.hero-control:focus {
    background: rgba(15, 23, 42, 0.64);
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.hero-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.hero-control-prev {
    left: 18px;
}

.hero-control-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.hero-control-next {
    right: 18px;
}

.hero-control-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.hero-dots {
    position: absolute;
    left: 76px;
    bottom: 28px;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 8px;
}

.hero-dots button {
    width: 34px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.42);
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.hero-dots button.is-active,
.hero-dots button:hover,
.hero-dots button:focus {
    width: 48px;
    background: #ffd166;
    outline: none;
}

.hero-visual {
    position: relative;
    display: grid;
    place-items: center;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 32px);
}

.visual-board {
    position: relative;
    width: 250px;
    height: 230px;
    border: 10px solid #d8dee6;
    border-radius: 8px;
    background: #f9fafb;
    box-shadow: 0 24px 44px rgba(0, 0, 0, 0.28);
}

.hero-visual .visual-lamp,
.hero-visual .visual-meter,
.hero-visual .visual-cable {
    position: absolute;
    display: block;
}

.hero-visual .visual-lamp {
    left: 28px;
    top: 34px;
    width: 84px;
    height: 54px;
    border-radius: 8px;
    background: #ffd166;
    border: 8px solid #344054;
}

.hero-visual .visual-meter {
    right: 28px;
    top: 36px;
    width: 70px;
    height: 100px;
    border-radius: 8px;
    background: var(--blue);
}

.hero-visual .visual-cable {
    left: 42px;
    bottom: 32px;
    width: 150px;
    height: 54px;
    border: 12px solid var(--red);
    border-radius: 50%;
}

.section-block {
    padding: 28px 0;
}

.home-section {
    padding: 34px 0;
}

.home-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}

.home-section-head h2 {
    margin: 0;
    font-size: clamp(24px, 2.4vw, 34px);
}

.home-section-head > a {
    color: var(--blue);
    font-weight: 800;
    white-space: nowrap;
}

.section-title,
.results-toolbar,
.quote-list-head,
.quote-update-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.section-title h2,
.filter-head h2,
.quote-summary h2,
.customer-card h2,
.admin-note h2 {
    margin: 0;
}

.section-title > a,
.filter-head a,
.group-all,
.admin-note a {
    color: var(--blue);
    font-weight: 800;
}

.category-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 16px;
}

.category-card {
    display: grid;
    gap: 8px;
    min-height: 156px;
    padding: 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.category-card span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 800;
}

.category-card small {
    color: var(--muted);
    line-height: 1.45;
}

.featured-category-grid,
.blog-grid {
    display: grid;
    gap: 18px;
}

.featured-category-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.featured-category-card,
.industry-card {
    position: relative;
    display: grid;
    align-content: end;
    min-height: 190px;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(23, 78, 166, 0.14);
    border-radius: var(--radius);
    color: #fff;
    background: #0f274a;
    box-shadow: 0 10px 18px rgba(24, 39, 75, 0.08);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.featured-category-card::before,
.industry-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(120deg, rgba(15, 39, 74, 0.3), rgba(15, 39, 74, 0.12)), var(--card-image);
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
    transition: transform 220ms ease;
}

.featured-category-card::after,
.industry-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(9, 16, 30, 0.04), rgba(9, 16, 30, 0.76));
    transition: background 180ms ease;
}

.featured-category-card:hover,
.featured-category-card:focus,
.industry-card:hover,
.industry-card:focus {
    border-color: rgba(23, 78, 166, 0.64);
    box-shadow: 0 18px 30px rgba(24, 39, 75, 0.18);
    outline: none;
    transform: translateY(-4px);
}

.featured-category-card:hover::before,
.featured-category-card:focus::before,
.industry-card:hover::before,
.industry-card:focus::before {
    transform: scale(1.08);
}

.featured-category-card:hover::after,
.featured-category-card:focus::after {
    background: linear-gradient(180deg, rgba(9, 16, 30, 0.02), rgba(9, 16, 30, 0.86));
}

.featured-category-card span,
.featured-category-card strong,
.industry-card span,
.industry-card strong,
.industry-card small {
    position: relative;
    z-index: 2;
}

.featured-category-card span,
.industry-card span {
    margin-bottom: 8px;
    color: #ffd166;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.featured-category-card span {
    justify-self: start;
    padding: 5px 9px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.48);
    color: #fff;
}

.featured-category-card strong {
    font-size: 22px;
    line-height: 1.1;
}

.featured-category-card strong::after {
    content: "Ver productos";
    display: block;
    margin-top: 10px;
    color: #ffd166;
    font-size: 13px;
    font-weight: 800;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.featured-category-card:hover strong::after,
.featured-category-card:focus strong::after {
    opacity: 1;
    transform: translateY(0);
}

.category-carousel {
    position: relative;
    padding: 0 34px;
}

.category-carousel-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 45px) / 4);
    gap: 15px;
    overflow-x: auto;
    padding: 2px 2px 18px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.category-carousel-track::-webkit-scrollbar {
    display: none;
}

.category-carousel-track .featured-category-card {
    scroll-snap-align: start;
}

.category-carousel-control {
    position: absolute;
    top: calc(50% - 22px);
    z-index: 3;
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--blue);
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(24, 39, 75, 0.12);
}

.category-carousel-control::before {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    margin: auto;
    border-top: 2px solid var(--blue);
    border-right: 2px solid var(--blue);
}

.category-carousel-prev { left: 0; }
.category-carousel-next { right: 0; }
.category-carousel-prev::before { transform: rotate(-135deg); }
.category-carousel-next::before { transform: rotate(45deg); }

.category-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
}

.category-carousel-dots button {
    --carousel-progress-track: rgba(23, 78, 166, 0.2);
    --carousel-progress-fill: #ffd166;
    position: relative;
    width: 34px;
    height: 5px;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    background: var(--carousel-progress-track);
    cursor: pointer;
    isolation: isolate;
    transition: width 160ms ease;
}

.category-carousel-dots button.is-active,
.category-carousel-dots button.is-progressing {
    width: 48px;
}

.category-carousel-dots button::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--carousel-progress-fill);
    transform: scaleX(0);
    transform-origin: left center;
}

.category-carousel-dots button.is-progressing::after {
    animation: carouselProgress var(--carousel-progress-duration, 5200ms) linear forwards;
}

.category-carousel.is-paused .category-carousel-dots button.is-progressing::after {
    animation-play-state: paused;
}

@media (max-width: 900px) {
    .category-carousel-track { grid-auto-columns: calc((100% - 15px) / 2); }
}

@media (max-width: 600px) {
    .category-carousel { padding: 0 24px; }
    .category-carousel-track { grid-auto-columns: 100%; }
}

.industry-carousel {
    position: relative;
}

.brand-strip {
    padding: 30px 0 24px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--surface);
}

.brand-strip-heading {
    margin-bottom: 18px;
    text-align: center;
}

.brand-strip-heading h2 {
    margin: 4px 0 0;
    font-size: clamp(22px, 2.5vw, 30px);
}

.brand-carousel {
    position: relative;
    padding: 0 34px;
}

.brand-carousel-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 60px) / 5);
    gap: 15px;
    overflow-x: auto;
    padding: 2px 2px 18px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.brand-carousel-track::-webkit-scrollbar {
    display: none;
}

.brand-carousel-item {
    display: grid;
    place-content: center;
    min-height: 145px;
    padding: 18px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: #172033;
    text-align: center;
    scroll-snap-align: start;
    box-shadow: 0 8px 20px rgba(24, 39, 75, 0.06);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.brand-carousel-item strong {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.05;
    letter-spacing: 0;
}

.brand-carousel-item img {
    display: block;
    width: 100%;
    height: 76px;
    margin: auto;
    object-fit: contain;
    transform: scale(1.08);
}

.brand-carousel-text-logo {
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 76px;
    padding: 8px;
    color: #172033;
    font-size: clamp(17px, 1.8vw, 24px);
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -0.03em;
    text-wrap: balance;
}

.brand-carousel-item small {
    margin-top: 9px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.brand-carousel-item:hover,
.brand-carousel-item:focus {
    border-color: var(--blue);
    outline: none;
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(23, 78, 166, 0.14);
}

.brand-carousel-item:hover small,
.brand-carousel-item:focus small {
    opacity: 1;
    transform: translateY(0);
}

.brand-carousel-control {
    position: absolute;
    top: 53px;
    z-index: 3;
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 6px 16px rgba(24, 39, 75, 0.12);
    cursor: pointer;
}

.admin-brand-create {
    margin-bottom: 22px;
}

.admin-brand-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.admin-industry-preview {
    position: relative;
    display: grid;
    align-content: end;
    min-height: 210px;
    overflow: hidden;
    padding: 18px;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(180deg, rgba(9, 16, 30, 0.08), rgba(9, 16, 30, 0.82)), var(--industry-preview) center / cover;
}

.admin-industry-preview strong,
.admin-industry-preview small {
    position: relative;
    z-index: 1;
}

.admin-industry-preview strong { font-size: 22px; }
.admin-industry-preview small { margin-top: 8px; color: #e5edf7; line-height: 1.4; }

.admin-industry-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 24px;
    align-items: start;
}

.admin-industry-editor-layout .admin-industry-preview {
    margin-top: 10px;
    min-height: 300px;
    background-color: #17345f;
}

.admin-industry-selector-thumb {
    width: 74px;
    height: 52px;
    border-radius: 8px;
    background: var(--industry-thumb) center / cover;
}

.admin-industry-delete-form {
    margin-top: 16px;
}

.admin-product-selector-visual {
    display: grid;
    place-items: center;
    width: 74px;
    height: 52px;
    border-radius: 8px;
    background: #edf3fb;
}

.admin-product-selector-visual i {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: linear-gradient(145deg, #174ea6, #53a6ef);
}

.admin-featured-product-preview {
    position: relative;
    display: grid;
    gap: 9px;
    min-height: 260px;
    padding: 24px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
}

.admin-featured-product-preview > span:first-child { color: var(--blue); font-size: 12px; font-weight: 800; text-transform: uppercase; }
.admin-featured-product-preview > small { color: var(--muted); }
.admin-featured-product-preview > strong { align-self: end; font-size: 22px; line-height: 1.15; }
.admin-featured-product-preview > p { margin: 0; color: var(--muted); line-height: 1.45; }
.admin-featured-product-identity { display: grid; gap: 5px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.admin-featured-product-identity small { color: var(--muted); }

.admin-featured-manager { display: grid; gap: 18px; margin-top: 18px; }
.admin-featured-panel { min-width: 0; margin: 0; }
.admin-featured-inventory { margin-top: 16px; }
.admin-product-picker { margin: 22px 0; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.admin-product-picker.admin-featured-panel { background: #f8fafc; }
.admin-product-picker.admin-featured-search { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.admin-featured-panel .admin-slide-sort-head { align-items: flex-start; }
.admin-product-search-head { display: grid; gap: 4px; }
.admin-product-search-head strong { display: block; color: var(--ink); font-size: 15px; }
.admin-product-search-head small { display: block; color: var(--muted); line-height: 1.4; }
.admin-product-search-filters { display: grid; grid-template-columns: repeat(3, minmax(150px, 0.75fr)) minmax(260px, 1.5fr); align-items: end; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.admin-product-filter-control select,
.admin-product-search-control input { min-height: 42px; }
.admin-product-search-results { display: grid; gap: 8px; max-height: 380px; margin-top: 14px; overflow-y: auto; }
.admin-product-search-results[hidden] { display: none; }
.admin-product-search-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 64px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); text-align: left; cursor: pointer; }
.admin-product-search-item:hover:not(:disabled) { border-color: var(--blue); box-shadow: 0 7px 18px rgba(23, 78, 166, 0.1); }
.admin-product-search-item:disabled { cursor: default; opacity: 0.58; }
.admin-product-search-item > span { display: grid; gap: 4px; min-width: 0; }
.admin-product-search-item small { color: var(--muted); }
.admin-product-search-item em { color: var(--muted); font-size: 12px; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.admin-product-search-item b { align-self: center; color: var(--blue); font-size: 12px; }
.admin-featured-selection-list { display: grid; gap: 10px; }
.admin-featured-selection-item { display: grid; grid-template-columns: 34px 74px minmax(180px, 1fr) 130px 92px auto; align-items: center; gap: 12px; min-height: 72px; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius); background: #f8fafc; cursor: grab; transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, opacity 160ms ease, transform 160ms ease; }
.admin-featured-selection-item:hover,
.admin-featured-selection-item:focus-within { border-color: rgba(23, 78, 166, 0.4); background: #eaf3ff; box-shadow: 0 8px 18px rgba(24, 39, 75, 0.08); }
.admin-featured-selection-item.is-dragging { opacity: 0.5; border-color: var(--blue); }
.admin-featured-selection-item > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #eaf3ff; color: var(--blue); font-weight: 800; }
.admin-featured-selection-item > div { display: grid; gap: 4px; }
.admin-featured-selection-item > div small { color: var(--muted); }
.admin-featured-selection-item > label { display: grid; grid-template-columns: 1fr auto; gap: 4px; align-items: center; }
.admin-featured-selection-item > label span { grid-column: 1 / -1; font-size: 11px; font-weight: 800; }
.admin-featured-selection-item > label input { min-width: 0; }
.admin-featured-active { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 7px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); cursor: pointer; }
.admin-featured-active span { font-size: 11px; font-weight: 800; }
.admin-featured-active input { accent-color: var(--blue); }
.admin-featured-work-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.admin-featured-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.admin-featured-preview-grid > .admin-preview-card { min-width: 0; }
.admin-featured-work-item { display: grid; grid-template-columns: 30px 56px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-width: 0; padding: 10px; border: 1px solid rgba(23, 78, 166, 0.18); border-radius: 12px; background: rgba(248, 251, 255, 0.82); transition: opacity 160ms ease, border-color 160ms ease; }
.admin-featured-work-item.is-hidden { opacity: 0.56; border-style: dashed; }
.admin-featured-work-position { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: #eaf3ff; color: var(--blue); font-weight: 800; }
.admin-featured-work-item .admin-product-selector-visual { width: 56px; height: 48px; transform: scale(0.45); transform-origin: center; }
.admin-featured-work-copy { display: grid; gap: 3px; min-width: 0; }
.admin-featured-work-copy strong, .admin-featured-work-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-featured-work-copy strong { color: var(--ink); font-size: 0.82rem; }
.admin-featured-work-copy small, .admin-featured-work-meta small { color: var(--muted); font-size: 0.72rem; }
.admin-featured-work-meta { display: grid; justify-items: end; gap: 3px; white-space: nowrap; }
.admin-featured-work-meta b { color: var(--blue); font-size: 0.72rem; }

@media (max-width: 850px) {
    .admin-product-search-filters, .admin-product-search-results { grid-template-columns: 1fr; }
    .admin-featured-panel .admin-slide-sort-head { display: grid; justify-items: stretch; }
    .admin-featured-selection-item { grid-template-columns: 34px 58px 1fr; }
    .admin-featured-selection-item > label, .admin-featured-selection-item > button { grid-column: 3; }
    .admin-featured-work-list { grid-template-columns: 1fr; }
    .admin-featured-preview-grid { grid-template-columns: 1fr; }
}

@media (max-width: 850px) {
    .admin-industry-editor-layout { grid-template-columns: 1fr; }
}

.admin-brand-card {
    display: grid;
    gap: 18px;
}

.admin-brand-preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 90px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}

.admin-brand-preview img {
    width: min(210px, 70%);
    height: 58px;
    object-fit: contain;
}

.admin-brand-preview span {
    padding: 5px 9px;
    border-radius: 999px;
    background: #eef1f5;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.admin-brand-preview span.is-active {
    background: #e6f7ec;
    color: #16733c;
}

.admin-brand-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.admin-brand-fields label:not(.admin-check) {
    display: grid;
    gap: 7px;
}

.admin-brand-fields label > span {
    font-weight: 700;
}

.admin-brand-fields small {
    color: var(--muted);
}

.admin-brand-fields .admin-check {
    display: flex;
    align-items: center;
    gap: 9px;
}

.admin-brand-selector-wrap {
    margin: 18px 0;
}

.admin-brand-overview-head {
    align-items: flex-start;
}

.admin-brand-overview-head p {
    max-width: 680px;
    margin: 6px 0 0;
    color: var(--muted);
    line-height: 1.5;
}

.admin-brand-overview-head .admin-form-head-actions {
    justify-content: flex-end;
}

.admin-brand-state-counters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.admin-brand-state-counters span {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 7px;
    min-height: 58px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.admin-brand-state-counters strong {
    color: var(--blue);
    font-size: 24px;
}

.admin-published-brand-carousel {
    gap: 16px;
}

.admin-published-hero-carousel {
    gap: 16px;
}

.admin-published-category-grid {
    gap: 16px;
}

.admin-category-mode-card {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(190px, 1fr)) minmax(110px, 0.45fr) auto;
    align-items: end;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-category-mode-card > div:first-child,
.admin-category-mode-option span {
    display: grid;
    gap: 4px;
}

.admin-category-mode-card small {
    color: var(--muted);
    font-weight: 700;
    line-height: 1.35;
}

.admin-category-mode-option {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    min-height: 76px;
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
    cursor: pointer;
}

.admin-category-mode-option:has(input:checked) {
    border-color: rgba(23, 78, 166, 0.58);
    background: #edf5ff;
    box-shadow: 0 0 0 2px rgba(23, 78, 166, 0.08);
}

.admin-category-mode-option input {
    margin-top: 3px;
    accent-color: var(--blue);
}

.admin-category-limit input {
    min-width: 90px;
}

.admin-category-future {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: calc(var(--radius) - 2px);
    background: #fff7df;
    color: #76530a;
}

.admin-category-future span {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.admin-category-inventory {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-category-inventory-grid,
.admin-category-picker {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
    gap: 10px;
}

.admin-category-inventory-item {
    display: grid;
    grid-template-columns: 32px 76px minmax(150px, 1fr) auto minmax(105px, auto);
    align-items: center;
    gap: 10px;
    min-height: 78px;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    cursor: grab;
}

.admin-category-visible-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f8fafc;
    color: var(--ink);
    font-size: 12px;
    font-weight: 900;
}

.admin-category-visible-toggle input {
    accent-color: var(--blue);
}

.admin-category-duration {
    display: grid;
    grid-template-columns: auto minmax(64px, 82px) auto;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}

.admin-category-duration input {
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
}

.admin-category-inventory-item.is-dragging {
    opacity: 0.5;
    transform: scale(0.98);
}

.admin-category-inventory-item > span {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
}

.admin-category-inventory-item > i,
.admin-category-picker-item > span {
    display: block;
    width: 76px;
    height: 56px;
    border-radius: 8px;
    background-color: #173660;
    background-image: linear-gradient(rgba(8, 20, 38, 0.18), rgba(8, 20, 38, 0.48)), var(--category-thumb);
    background-position: center;
    background-size: cover;
}

.admin-category-inventory-item > div {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-category-inventory-item small {
    color: var(--muted);
    font-weight: 700;
}

.admin-category-inventory-item > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(23, 78, 166, 0.24);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.admin-category-auto-note {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px dashed rgba(23, 78, 166, 0.42);
    border-radius: var(--radius);
    background: #edf5ff;
    color: var(--blue);
}

.admin-category-picker-item {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 5px 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    color: var(--ink);
    text-decoration: none;
}

.admin-category-picker-item > span {
    grid-row: 1 / 3;
}

.admin-category-picker-item small {
    color: var(--muted);
}

.admin-category-preview-sticky {
    position: sticky;
    top: 112px;
}

.admin-category-live-card em {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    padding: 5px 9px;
    border-radius: 999px;
    background: #eaf8f1;
    color: var(--green);
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}

.admin-category-live-card em.is-hidden {
    background: #fff1f0;
    color: var(--red);
}

.admin-store-front-preview {
    padding: 0;
    background: transparent;
}

.admin-store-front-preview .store-grid {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
}

.admin-store-front-preview .hero-panel {
    min-height: clamp(390px, 48vw, 570px);
}

.admin-store-front-preview .hero-copy h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 52px);
    line-height: 1.02;
}

.admin-published-preview-head,
.admin-brand-inventory > .admin-slide-sort-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
}

.admin-published-preview-head > div {
    display: grid;
    gap: 4px;
}

.admin-published-preview-head strong {
    color: var(--ink);
    font-size: 18px;
}

.admin-published-preview-head > small,
.admin-brand-inventory > .admin-slide-sort-head > small {
    max-width: 430px;
    color: var(--muted);
    font-weight: 700;
    line-height: 1.45;
    text-align: right;
}

.admin-brand-strip-preview {
    margin: 0;
    padding: 22px 16px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.admin-brand-strip-preview .brand-strip-heading h3 {
    margin: 4px 0 0;
    color: var(--ink);
    font-size: clamp(20px, 2.2vw, 28px);
}

.admin-brand-inventory {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-brand-create-order {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-create-panel .admin-brand-create-order {
    margin: 0 18px 18px;
}

.admin-brand-create-order .admin-slide-sort-head > div {
    display: grid;
    gap: 4px;
}

.admin-brand-create-order .admin-slide-sort-head small {
    color: var(--muted);
    font-weight: 700;
}

.admin-brand-position-map {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-brand-position-map li {
    display: grid;
    grid-template-columns: 28px 52px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 150px;
    flex: 1 1 170px;
    min-height: 48px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
}

.admin-brand-position-number {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
}

.admin-brand-position-map li > img,
.admin-brand-position-logo-placeholder,
.admin-brand-position-text-logo {
    grid-column: 2;
    grid-row: 1;
    width: 52px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    object-fit: contain;
}

.admin-brand-position-map li > img {
    padding: 4px;
}

.admin-brand-position-logo-placeholder {
    display: grid;
    place-items: center;
    border-style: dashed;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-brand-position-text-logo {
    display: grid;
    place-items: center;
    padding: 4px;
    color: #172033;
    font-size: 9px;
    font-weight: 950;
    line-height: 1.05;
    text-align: center;
    overflow-wrap: anywhere;
}

.admin-brand-position-logo-placeholder[hidden],
.admin-brand-position-text-logo[hidden],
.admin-brand-position-map li > img[hidden] {
    display: none;
}

.admin-brand-position-map li > strong {
    grid-column: 3;
    min-width: 0;
    color: var(--ink);
    font-size: 13px;
    overflow-wrap: anywhere;
}

.admin-brand-position-map li.is-new {
    border-color: rgba(23, 78, 166, 0.5);
    background: #edf5ff;
    box-shadow: 0 0 0 2px rgba(23, 78, 166, 0.08);
}

.admin-brand-selector {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
    gap: 10px;
}

.admin-brand-selector-item {
    display: grid;
    grid-template-columns: 30px 64px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 82px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.admin-brand-selector-item[data-brand-sort-item] {
    cursor: grab;
}

.admin-brand-selector-item:hover,
.admin-brand-selector-item:focus,
.admin-brand-selector-item:focus-within {
    border-color: rgba(23, 78, 166, 0.44);
    background: #eef5ff;
    box-shadow: 0 10px 22px rgba(23, 78, 166, 0.1);
    outline: none;
    transform: translateY(-1px);
}

.admin-brand-selector-item.is-dragging {
    opacity: 0.5;
    cursor: grabbing;
    transform: scale(0.98);
}

.admin-brand-selector-main {
    display: contents;
    color: inherit;
    text-decoration: none;
}

.admin-brand-selector-item.is-current {
    border-color: rgba(23, 78, 166, 0.58);
    background: #edf5ff;
    box-shadow: 0 0 0 2px rgba(23, 78, 166, 0.1);
}

.admin-brand-selector-item [data-brand-position],
.admin-brand-selector-item > span:first-child {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
}

.admin-brand-selector-item img {
    width: 64px;
    height: 48px;
    padding: 4px;
    border-radius: 8px;
    background: #fff;
    object-fit: contain;
}

.admin-brand-selector-text-logo {
    display: grid;
    place-items: center;
    width: 64px;
    height: 48px;
    padding: 5px;
    border-radius: 8px;
    background: #fff;
    color: #172033;
    font-size: 11px;
    font-weight: 950;
    line-height: 1.05;
    text-align: center;
    overflow-wrap: anywhere;
}

.admin-brand-selector-copy {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-brand-selector-copy strong,
.admin-brand-selector-copy small {
    overflow-wrap: anywhere;
}

.admin-brand-selector-copy small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.admin-brand-selector-item em {
    grid-column: 4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(23, 78, 166, 0.24);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.admin-brand-public-preview {
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    min-height: 190px;
    padding: 38px 18px 22px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
    text-align: center;
}

.admin-brand-public-preview img {
    width: min(230px, 78%);
    height: 78px;
    object-fit: contain;
}

.admin-brand-text-logo {
    display: grid;
    place-items: center;
    width: min(230px, 78%);
    min-height: 78px;
    padding: 10px;
    color: #172033;
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -0.035em;
    text-align: center;
    text-wrap: balance;
}

.admin-brand-text-logo[hidden] {
    display: none;
}

.admin-brand-logo-placeholder {
    display: grid;
    place-items: center;
    width: min(230px, 78%);
    min-height: 78px;
    padding: 12px;
    border: 1px dashed #b9c6d8;
    border-radius: 10px;
    background: #f8fafc;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.admin-brand-logo-placeholder[hidden] {
    display: none;
}

.admin-brand-public-preview > strong {
    color: var(--ink);
    font-size: 17px;
    line-height: 1.2;
}

.admin-brand-public-preview small {
    color: var(--blue);
    font-weight: 900;
}

.admin-brand-preview-time {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.admin-brand-preview-time strong {
    color: var(--blue);
}

.admin-brand-preview-progress {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 5px;
    overflow: hidden;
    background: #d8e2ee;
}

.admin-brand-preview-progress::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #ffd166;
    transform: scaleX(0);
    transform-origin: left center;
}

.admin-brand-preview-progress.is-running::after {
    animation: carouselProgress var(--brand-preview-duration, 4200ms) linear infinite;
}

@media (max-width: 800px) {
    .admin-brand-list,
    .admin-brand-fields {
        grid-template-columns: 1fr;
    }

    .admin-brand-selector {
        grid-template-columns: 1fr;
    }

    .admin-brand-overview-head,
    .admin-published-preview-head,
    .admin-brand-inventory > .admin-slide-sort-head {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-brand-overview-head .admin-form-head-actions,
    .admin-brand-overview-head .admin-form-head-actions a {
        width: 100%;
    }

    .admin-brand-state-counters {
        grid-template-columns: 1fr;
    }

    .admin-published-preview-head > small,
    .admin-brand-inventory > .admin-slide-sort-head > small {
        max-width: none;
        text-align: left;
    }

    .admin-category-mode-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .admin-category-future {
        grid-column: 1;
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-category-inventory-item {
        grid-template-columns: 32px 68px minmax(0, 1fr);
    }

    .admin-category-inventory-item > i {
        width: 68px;
    }

    .admin-category-inventory-item > a {
        grid-column: 2 / -1;
        width: 100%;
    }

    .admin-category-visible-toggle {
        grid-column: 2;
    }

    .admin-category-duration {
        grid-column: 3;
    }

    .admin-category-auto-note {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .admin-brand-selector-item {
        grid-template-columns: 30px 56px minmax(0, 1fr);
    }

    .admin-brand-selector-item img,
    .admin-brand-selector-text-logo {
        width: 56px;
    }

    .admin-brand-selector-item em {
        grid-column: 2 / -1;
        width: 100%;
        margin-top: 2px;
    }
}

.brand-carousel-control::before {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    margin: auto;
    border-top: 2px solid var(--blue);
    border-right: 2px solid var(--blue);
}

.brand-carousel-prev { left: 0; }
.brand-carousel-next { right: 0; }
.brand-carousel-prev::before { transform: rotate(-135deg); }
.brand-carousel-next::before { transform: rotate(45deg); }

.brand-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
}

.brand-carousel .brand-carousel-dots button {
    --carousel-progress-track: rgba(23, 78, 166, 0.2);
    --carousel-progress-fill: #ffd166;
    width: 34px;
    height: 5px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.brand-carousel-dots button.is-active,
.brand-carousel-dots button.is-progressing {
    width: 48px;
    background: var(--carousel-progress-track, #cfd8e3);
}

[data-theme="dark"] .brand-strip {
    background: var(--surface);
}

[data-theme="dark"] .brand-carousel-item,
[data-theme="dark"] .brand-carousel-control {
    border-color: #344258;
    background: #182337;
    color: #f4f7fb;
}

[data-theme="dark"] .brand-carousel-item strong {
    color: #f4f7fb;
}

[data-theme="dark"] .brand-carousel-text-logo {
    color: #f4f7fb;
}

[data-theme="dark"] .brand-carousel-item img {
    filter:
        drop-shadow(1px 0 0 rgba(255, 255, 255, 0.78))
        drop-shadow(-1px 0 0 rgba(255, 255, 255, 0.78))
        drop-shadow(0 1px 0 rgba(255, 255, 255, 0.78))
        drop-shadow(0 -1px 0 rgba(255, 255, 255, 0.78))
        drop-shadow(0 2px 4px rgba(0, 0, 0, 0.32));
}

[data-theme="dark"] .brand-carousel .brand-carousel-dots button {
    --carousel-progress-track: rgba(255, 255, 255, 0.42);
    --carousel-progress-fill: #ffd166;
    background: #344258;
}

[data-theme="dark"] .brand-carousel .brand-carousel-dots button.is-active {
    background: var(--carousel-progress-track);
}


@media (max-width: 900px) {
    .brand-carousel-track { grid-auto-columns: calc((100% - 30px) / 3); }
}

@media (max-width: 600px) {
    .brand-strip { padding-top: 24px; }
    .brand-carousel { padding: 0 24px; }
    .brand-carousel-track { grid-auto-columns: calc((100% - 12px) / 2); gap: 12px; }
    .brand-carousel-item { min-height: 125px; padding: 14px 10px; }
    .brand-carousel-item img { height: 62px; transform: scale(1.06); }
    .brand-carousel-control { width: 34px; height: 34px; top: 45px; }
}

.industry-viewport {
    overflow: hidden;
}

.industry-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 36px) / 3);
    gap: 18px;
    overflow-x: auto;
    padding: 2px 0 22px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.industry-track::-webkit-scrollbar {
    display: none;
}

.industry-card {
    min-height: 260px;
    scroll-snap-align: start;
}

.industry-card strong {
    max-width: 340px;
    font-size: 24px;
    line-height: 1.12;
}

.industry-card small {
    max-width: 420px;
    margin-top: 10px;
    color: #e5edf7;
    line-height: 1.45;
}

.industry-card em {
    position: relative;
    z-index: 2;
    display: inline-flex;
    width: max-content;
    margin-top: 16px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.industry-card:hover em,
.industry-card:focus em {
    opacity: 1;
    transform: translateY(0);
}

.industry-control {
    position: absolute;
    top: calc(50% - 24px);
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.industry-control:hover,
.industry-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.industry-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.industry-control-prev {
    left: -10px;
}

.industry-control-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.industry-control-next {
    right: -10px;
}

.industry-control-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.industry-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 4px;
}

.industry-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.industry-dots button.is-active,
.industry-dots button:hover,
.industry-dots button:focus {
    width: 42px;
    background: var(--blue);
    outline: none;
}

.blog-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.blog-card {
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 390px;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 18px rgba(24, 39, 75, 0.06);
}

.blog-card-media {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f8fafc;
}

.blog-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.blog-card:hover .blog-card-media img,
.blog-card:focus-within .blog-card-media img {
    transform: scale(1.05);
}

.blog-card > div {
    display: grid;
    grid-template-rows: auto minmax(46px, auto) minmax(64px, 1fr) auto;
    gap: 10px;
    padding: 16px;
}

.blog-card span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.blog-card h3,
.blog-card p {
    margin: 0;
}

.blog-card h3 {
    min-height: 46px;
    font-size: 18px;
    line-height: 1.25;
}

.blog-card p {
    min-height: 64px;
    color: var(--muted);
    line-height: 1.45;
}

.blog-card h3 a,
.blog-card p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

.blog-card h3 a {
    -webkit-line-clamp: 2;
}

.blog-card p {
    -webkit-line-clamp: 3;
}

.blog-card div > a:last-child {
    align-self: end;
}

.blog-carousel {
    position: relative;
}

.blog-viewport {
    overflow: hidden;
}

.blog-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 54px) / 4);
    gap: 18px;
    overflow-x: auto;
    padding: 2px 0 22px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.blog-track::-webkit-scrollbar {
    display: none;
}

.blog-carousel.is-static .blog-track {
    overflow: visible;
    padding-bottom: 0;
}

.blog-carousel-item {
    display: flex;
    min-width: 0;
    scroll-snap-align: start;
}

.blog-carousel-item .blog-card {
    width: 100%;
    height: 100%;
}

.blog-carousel-control {
    position: absolute;
    top: 45%;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.blog-carousel-control:hover,
.blog-carousel-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.blog-carousel-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.blog-carousel-prev {
    left: -10px;
}

.blog-carousel-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.blog-carousel-next {
    right: -10px;
}

.blog-carousel-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.blog-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 4px;
}

.blog-carousel.is-static .blog-carousel-dots {
    display: none;
}

.blog-carousel-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.blog-carousel-dots button.is-active,
.blog-carousel-dots button:hover,
.blog-carousel-dots button:focus {
    width: 42px;
    background: var(--blue);
    outline: none;
}

.blog-card {
    min-height: 430px;
    border: 0;
    border-radius: 8px;
    background: #f3f6f9;
    box-shadow: 0 16px 34px rgba(24, 39, 75, 0.1);
}

.blog-card-media {
    aspect-ratio: 16 / 8;
    background: #dfe7f1;
}

.blog-card > div {
    grid-template-rows: auto minmax(58px, auto) minmax(70px, 1fr) auto;
    gap: 16px;
    padding: 24px;
}

.blog-card span {
    color: #465a72;
}

.blog-card h3 {
    min-height: 58px;
    font-size: 23px;
    line-height: 1.22;
}

.blog-card p {
    min-height: 70px;
    font-size: 15px;
}

.blog-read-more,
.blog-card div > a.blog-read-more {
    width: max-content;
    min-height: 52px;
    padding: 0 28px;
}

.blog-page {
    display: grid;
    gap: 24px;
}

.blog-featured-card {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    min-height: 430px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.blog-featured-media {
    display: block;
    min-height: 100%;
    background: #dfe7f1;
}

.blog-featured-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.blog-featured-card:hover .blog-featured-media img,
.blog-featured-card:focus-within .blog-featured-media img {
    transform: scale(1.03);
}

.blog-featured-copy {
    display: grid;
    align-content: center;
    gap: 18px;
    padding: 34px;
}

.blog-featured-copy span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.blog-featured-copy h2,
.blog-featured-copy p {
    margin: 0;
}

.blog-featured-copy h2 {
    font-size: 34px;
    line-height: 1.12;
}

.blog-featured-copy p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.55;
}

.blog-list-grid {
    align-items: stretch;
}

.blog-article {
    display: grid;
    gap: 28px;
    padding-bottom: 44px;
}

.blog-article-hero {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1.08fr);
    overflow: hidden;
    border-radius: 8px;
    background: #102744;
    color: #fff;
    box-shadow: var(--shadow);
}

.blog-article-copy {
    display: grid;
    align-content: center;
    gap: 18px;
    padding: 42px;
}

.blog-article-copy .eyebrow {
    color: #7ed6ff;
}

.blog-article-copy h1,
.blog-article-copy p {
    margin: 0;
}

.blog-article-copy h1 {
    max-width: 780px;
    font-size: 42px;
    line-height: 1.08;
}

.blog-article-copy p {
    color: #d7e6f8;
    font-size: 17px;
    line-height: 1.62;
}

.blog-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.blog-article-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.blog-article-media {
    min-height: 440px;
    margin: 0;
    background: #dfe7f1;
}

.blog-article-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-article-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    align-items: start;
    gap: 28px;
}

.blog-article-main {
    display: grid;
    min-width: 0;
    gap: 22px;
}

.blog-learn-box,
.blog-tip,
.blog-lesson-panel {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: 0 12px 26px rgba(24, 39, 75, 0.08);
}

.blog-learn-box {
    display: grid;
    gap: 14px;
    padding: 24px;
}

.blog-learn-box span,
.blog-lesson-panel > span,
.blog-tip strong {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.blog-learn-box h2,
.blog-article-section h2,
.blog-lesson-panel h2,
.blog-tip p {
    margin: 0;
}

.blog-learn-box h2 {
    font-size: 26px;
    line-height: 1.2;
}

.blog-learn-box ul,
.article-check-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.blog-learn-box li,
.article-check-list li {
    position: relative;
    padding-left: 30px;
    color: var(--ink);
    line-height: 1.55;
}

.blog-learn-box li::before {
    content: "";
    position: absolute;
    top: 0.58em;
    left: 3px;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #0bb4f0;
    box-shadow: 0 0 0 5px rgba(11, 180, 240, 0.14);
}

.blog-article-section {
    display: grid;
    gap: 14px;
    padding: 26px 0;
    border-bottom: 1px solid var(--line);
}

.blog-article-section h2 {
    font-size: 28px;
    line-height: 1.18;
}

.blog-article-section p {
    max-width: 940px;
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.7;
}

.article-check-list {
    max-width: 940px;
    padding: 4px 0 0;
}

.article-check-list li::before {
    content: "";
    position: absolute;
    top: 0.48em;
    left: 0;
    width: 14px;
    height: 8px;
    border-left: 3px solid #0bb4f0;
    border-bottom: 3px solid #0bb4f0;
    transform: rotate(-45deg);
}

.blog-tip {
    display: grid;
    gap: 10px;
    padding: 22px 24px;
    border-left: 5px solid #0bb4f0;
}

.blog-tip p {
    color: var(--muted);
    line-height: 1.6;
}

.blog-quote-check {
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: 0 12px 26px rgba(24, 39, 75, 0.08);
}

.blog-quote-check > span,
.blog-link-box > span,
.blog-faq-section > span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.blog-link-box,
.blog-faq-section {
    display: grid;
    gap: 14px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: 0 12px 26px rgba(24, 39, 75, 0.08);
}

.blog-link-box h2,
.blog-faq-section h2 {
    margin: 0;
    font-size: 26px;
    line-height: 1.2;
}

.blog-link-box > div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.blog-link-box a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 800;
}

.blog-faq-list {
    display: grid;
    gap: 10px;
}

.blog-faq-list details {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-2);
    overflow: hidden;
}

.blog-faq-list summary {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 14px 46px 14px 16px;
    color: var(--ink);
    font-weight: 800;
    cursor: pointer;
}

.blog-faq-list summary::after {
    content: "";
    position: absolute;
    right: 18px;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 160ms ease;
}

.blog-faq-list details[open] summary::after {
    transform: rotate(225deg);
}

.blog-faq-list p {
    margin: 0;
    padding: 0 16px 16px;
    color: var(--muted);
    line-height: 1.6;
}

.blog-final-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-top: 4px;
    padding: 28px;
    border-radius: 8px;
    background: #102744;
    color: #fff;
    box-shadow: var(--shadow);
}

.blog-final-cta div {
    display: grid;
    gap: 8px;
    max-width: 820px;
}

.blog-final-cta .eyebrow {
    color: #7ed6ff;
}

.blog-final-cta h2,
.blog-final-cta p {
    margin: 0;
}

.blog-final-cta h2 {
    font-size: 28px;
    line-height: 1.15;
}

.blog-final-cta p {
    color: #d7e6f8;
    line-height: 1.55;
}

.blog-final-cta .button-primary {
    flex: 0 0 auto;
}

.blog-products-related {
    margin-top: 28px;
}

.blog-lesson-panel {
    position: sticky;
    top: 156px;
    display: grid;
    gap: 14px;
    padding: 24px;
}

.blog-lesson-panel h2 {
    font-size: 22px;
    line-height: 1.18;
}

.blog-lesson-panel p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.blog-lesson-panel dl {
    display: grid;
    gap: 0;
    margin: 0;
}

.blog-lesson-panel dl div {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 12px;
    padding: 11px 0;
    border-top: 1px solid var(--line);
}

.blog-lesson-panel dt {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.blog-lesson-panel dd {
    margin: 0;
    color: var(--ink);
    font-weight: 800;
}

.blog-lesson-panel .button-primary,
.blog-lesson-panel .button-ghost,
.blog-empty .button-primary {
    width: 100%;
}

.blog-related {
    margin-top: 0;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 18px;
}

.product-grid-compact {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.product-carousel {
    position: relative;
}

.product-carousel-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 54px) / 4);
    gap: 18px;
    overflow-x: auto;
    padding: 2px 0 22px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.product-carousel-track::-webkit-scrollbar {
    display: none;
}

.product-carousel-item {
    min-width: 0;
    scroll-snap-align: start;
}

.product-carousel-item .product-card {
    height: 100%;
}

.product-carousel-control {
    position: absolute;
    top: 45%;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.product-carousel-control:hover,
.product-carousel-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.product-carousel-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.product-carousel-prev {
    left: -10px;
}

.product-carousel-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.product-carousel-next {
    right: -10px;
}

.product-carousel-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.product-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 4px;
}

.product-carousel-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.product-carousel-dots button.is-active,
.product-carousel-dots button:hover,
.product-carousel-dots button:focus {
    width: 42px;
    background: var(--blue);
    outline: none;
}

.product-card {
    min-width: 0;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 18px rgba(24, 39, 75, 0.06);
}

.product-media {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 190px;
    overflow: hidden;
    background: #f8fafc;
    border-bottom: 1px solid var(--line);
}

.product-media .product-photo {
    display: block;
    width: 100%;
    height: 190px;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
    padding: 12px;
    background: #fff;
    transition: transform 220ms ease;
}

.product-card:hover .product-photo,
.product-card:focus-within .product-photo {
    transform: scale(1.035);
}

.product-media em {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--red);
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.product-shape {
    position: relative;
    display: block;
    width: 112px;
    height: 84px;
    border-radius: 8px;
    background: #d8dee6;
    box-shadow: inset 0 -10px 0 rgba(0, 0, 0, 0.08);
}

.visual-flood .product-shape {
    width: 130px;
    height: 78px;
    border: 12px solid #344054;
    background: #ffd166;
}

.visual-street .product-shape {
    width: 150px;
    height: 54px;
    border-radius: 28px 8px 8px 28px;
    background: #344054;
}

.visual-street .product-shape::after {
    content: "";
    position: absolute;
    right: -34px;
    top: 18px;
    width: 42px;
    height: 12px;
    background: #667085;
}

.visual-accessory .product-shape,
.visual-contactor .product-shape,
.visual-breaker .product-shape {
    width: 84px;
    height: 118px;
    background: #f2f4f7;
    border: 10px solid #344054;
}

.visual-highbay .product-shape {
    width: 122px;
    height: 94px;
    border-radius: 50% 50% 18px 18px;
    background: #344054;
}

.visual-panel .product-shape {
    width: 130px;
    height: 130px;
    background: #fff;
    border: 12px solid #d8dee6;
}

.visual-cable .product-shape {
    width: 130px;
    height: 130px;
    border: 18px solid var(--red);
    border-radius: 50%;
    background: transparent;
}

.visual-emergency .product-shape {
    width: 134px;
    height: 70px;
    background: #fff;
    border: 10px solid #344054;
}

.visual-solar .product-shape {
    width: 130px;
    height: 96px;
    background: repeating-linear-gradient(90deg, #174ea6 0 18px, #113b7b 18px 20px);
    border: 10px solid #344054;
}

.visual-panelbox .product-shape {
    width: 105px;
    height: 132px;
    background: #f2f4f7;
    border: 12px solid #98a2b3;
}

.product-body {
    display: grid;
    min-width: 0;
    gap: 12px;
    padding: 16px;
}

.product-kicker {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.product-body h3 {
    margin: 0;
    min-height: 48px;
    font-size: 17px;
    line-height: 1.35;
}

.product-body p {
    margin: 0;
    min-height: 44px;
    color: var(--muted);
    line-height: 1.45;
    text-align: justify;
    text-justify: inter-word;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.product-attrs {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
}

.product-attrs div {
    min-width: 0;
    padding: 8px;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.product-attrs dt {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.35;
    overflow-wrap: anywhere;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.product-attrs dd {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    text-align: justify;
    text-justify: inter-word;
    overflow-wrap: anywhere;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
}

.product-price-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

.stock-ok {
    color: var(--green);
    font-weight: 800;
}

.stock-wait {
    color: var(--amber);
    font-weight: 800;
}

.product-price-row del {
    color: var(--muted);
    font-size: 13px;
}

.product-actions {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 8px;
    min-width: 0;
}

.product-actions input {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 10px;
}

.product-card .product-actions button {
    width: 100%;
    min-width: 0;
    padding: 8px 12px;
    border-radius: var(--radius);
    min-height: 42px;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
}

.product-login-to-quote {
    width: 100%;
    padding: 8px 14px;
    line-height: 1.2;
    text-align: center;
    white-space: normal;
}

.category-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1700px) {
    .category-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .category-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .category-product-grid {
        grid-template-columns: 1fr;
    }
}

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 18px 0 0;
    color: var(--muted);
    font-size: 14px;
}

.breadcrumb a:last-child {
    color: var(--ink);
    font-weight: 700;
}

.category-landing,
.quote-shell,
.admin-shell {
    padding: 22px 0 36px;
}

.category-hero {
    padding: 28px;
    border-radius: var(--radius);
    background: #0f274a;
    color: #fff;
}

.category-hero p {
    max-width: 720px;
}

.button-primary,
.button-ghost,
.button-whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: var(--radius);
    font-weight: 800;
}

.button-primary {
    border: 1px solid var(--blue);
}

.button-ghost {
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
}

.button-whatsapp {
    border: 1px solid var(--green);
    background: var(--green);
    color: #fff;
}

.subcategory-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
}

.subcategory-group {
    padding: 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.subcategory-group h2 {
    margin: 0;
    font-size: 20px;
}

.subcategory-group p {
    color: var(--muted);
    line-height: 1.45;
}

.subcategory-group ul {
    display: grid;
    gap: 8px;
    padding-left: 18px;
}

.catalog-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 0;
}

.catalog-heading p {
    max-width: 720px;
    color: var(--muted);
}

.filter-toggle {
    display: none;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.catalog-layout {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 20px;
    padding-bottom: 42px;
}

.filter-panel {
    align-self: start;
    position: sticky;
    top: 150px;
    padding: 16px;
}

.filter-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.filter-field,
.customer-card label {
    display: grid;
    gap: 6px;
    color: var(--ink);
    font-weight: 700;
}

.filter-field input,
.filter-group select,
.price-fields input,
.customer-card input,
.customer-card textarea,
.results-toolbar select,
.quote-row input {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 10px;
    background: #fff;
}

.filter-group {
    display: grid;
    gap: 10px;
    padding: 16px 0;
    border-top: 1px solid var(--line);
}

.filter-group h3 {
    margin: 0;
    font-size: 15px;
}

.filter-group label {
    color: var(--muted);
}

.price-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.filter-category-list {
    display: grid;
    gap: 5px;
    margin-top: 4px;
}

.filter-category-list a {
    padding: 8px;
    border-radius: var(--radius);
    color: var(--muted);
}

.filter-category-list div {
    display: grid;
    gap: 4px;
    padding-left: 14px;
}

.filter-category-list .is-active,
.filter-category-list .is-current {
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 800;
}

.filter-submit {
    width: 100%;
    min-height: 44px;
    border-radius: var(--radius);
}

.catalog-results {
    min-width: 0;
}

/* Conserva el formato de las tarjetas aunque haya pocos resultados. */
.catalog-results .product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
}

@media (max-width: 1500px) {
    .catalog-results .product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1040px) {
    .catalog-results .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .catalog-results .product-grid {
        grid-template-columns: 1fr;
    }
}

.catalog-results .product-card {
    display: grid;
    grid-template-rows: 190px minmax(0, 1fr);
    height: 100%;
}

.catalog-results .product-media {
    min-height: 0;
    height: 190px;
}

.catalog-results .product-media .product-photo {
    width: 100%;
    height: 100%;
    max-height: 190px;
    object-fit: contain;
    object-position: center;
}

.catalog-results .product-body {
    grid-template-rows: auto auto minmax(44px, 1fr) auto auto auto;
    height: 100%;
}

.catalog-results .product-kicker,
.catalog-results .product-body h3,
.catalog-results .product-body h3 a,
.catalog-results .product-attrs dd {
    min-width: 0;
    overflow-wrap: anywhere;
}

.catalog-results .product-kicker small {
    flex: 0 1 auto;
    text-align: right;
}

.results-toolbar {
    margin-bottom: 16px;
    padding: 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.results-toolbar label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
}

.empty-state {
    padding: 32px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.empty-state p {
    color: var(--muted);
}

.quote-heading {
    max-width: 760px;
    margin-bottom: 20px;
}

.quote-heading p {
    color: var(--muted);
}

.quote-heading-pro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    max-width: none;
    margin-bottom: 24px;
}

.quote-heading-pro h1 {
    margin: 5px 0 8px;
    font-size: clamp(28px, 4vw, 42px);
    letter-spacing: -0.035em;
}

.quote-heading-pro p {
    max-width: 680px;
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
}

.quote-client-chip {
    display: flex;
    align-items: center;
    min-width: 220px;
    gap: 11px;
    padding: 11px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: 0 8px 24px rgba(24, 39, 75, .06);
}

.quote-client-chip > span {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--blue), var(--blue-dark));
    color: #fff;
    font-weight: 900;
}

.quote-client-chip small,
.quote-client-chip strong { display: block; }
.quote-client-chip small { margin-bottom: 2px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }

.quote-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin: 0 0 24px;
    padding: 0;
    overflow: hidden;
    list-style: none;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
}

.quote-steps li {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 74px;
    padding: 13px 20px;
    border-right: 1px solid var(--line);
}

.quote-steps li:last-child { border-right: 0; }
.quote-steps li > span,
.quote-card-title > span {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--surface-2);
    color: var(--muted);
    font-weight: 900;
}
.quote-steps li.is-active > span { background: var(--blue); color: #fff; }
.quote-steps strong, .quote-steps small { display: block; }
.quote-steps small { margin-top: 3px; color: var(--muted); }

.quote-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
    align-items: start;
    gap: 24px;
}
.quote-products-step { grid-template-columns: minmax(0, 1fr); }
.quote-details-step { grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); }
.quote-details-step .quote-summary { position: static; top: auto; }
.quote-details-step .quote-request-review { position: sticky; top: 164px; }
.quote-details-step .quote-request-form { padding: 28px; }
.quote-details-step .quote-intent-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.quote-contact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.quote-detail-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
.quote-detail-columns .quote-billing-fields { height: 100%; margin: 0; padding: 18px; }
.quote-notes-field { padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.quote-save-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.quote-save-row small { color: var(--muted); }
.quote-details-step .quote-send-card { grid-template-columns: minmax(0, 1fr) minmax(230px, 300px); grid-template-areas: "title title" "recipient whatsapp" "recipient email" "privacy privacy"; align-items: center; gap: 10px 22px; padding: 24px 28px; }
.quote-details-step .quote-send-card .quote-card-title { grid-area: title; }
.quote-details-step .quote-recipient { grid-area: recipient; border: 0; padding: 0; }
.quote-details-step .quote-whatsapp-cta { grid-area: whatsapp; width: 100%; }
.quote-details-step .quote-email-link { grid-area: email; }
.quote-details-step .quote-privacy { grid-area: privacy; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.16); }

.quote-list {
    min-width: 0;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(24, 39, 75, .07);
}

.quote-list-head {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--line);
}

.quote-list-head > div { margin-right: auto; }
.quote-code { padding: 7px 10px; border-radius: 999px; background: var(--surface-2); color: var(--muted); font-size: 12px; font-weight: 800; }
.quote-clear, .quote-email-link { padding: 0; border: 0; background: transparent; color: var(--red); font-weight: 700; cursor: pointer; }

.quote-table-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 100px 130px 62px;
    gap: 14px;
    padding: 10px 20px 10px 110px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface-2) 55%, transparent);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.quote-list-head strong {
    display: block;
}

.quote-row {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) 100px 130px 62px;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--line);
}

.quote-row:hover { background: color-mix(in srgb, var(--surface-2) 28%, transparent); }
.quote-product-info { min-width: 0; }
.quote-product-select { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 7px; color: var(--ink); font-size: 11px; font-weight: 900; cursor: pointer; }
.quote-product-select input { width: 18px; height: 18px; margin: 0; accent-color: var(--blue); }
.quote-product-select span { margin: 0; color: var(--ink); font-size: 11px; }
.quote-product-info strong { display: block; margin: 4px 0; line-height: 1.35; }
.quote-product-info .quote-brand { margin: 0; color: var(--blue); font-size: 11px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.quote-quantity span, .quote-line-total span { display: none; }
.quote-quantity input { width: 76px; min-height: 42px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; text-align: center; font-weight: 800; }
.quote-line-total strong { display: block; white-space: nowrap; }

.quote-row:last-of-type {
    border-bottom: 0;
}

.quote-row span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 13px;
}

.quote-thumb {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    overflow: hidden;
    border-radius: var(--radius);
    background: #f8fafc;
    border: 1px solid var(--line);
}

.quote-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: 5px;
    background: #fff;
}

.quote-thumb .product-shape {
    transform: scale(0.42);
}

.quote-remove {
    min-height: 34px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.quote-update-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid var(--line);
}
.quote-next-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.quote-request-review { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 14px 36px rgba(24, 39, 75, .07); }
.quote-review-items { display: grid; }
.quote-review-items article { display: flex; justify-content: space-between; gap: 16px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.quote-review-items article div { display: grid; gap: 4px; }
.quote-review-items article small { color: var(--muted); }
.quote-review-items article > strong { color: var(--blue); white-space: nowrap; }
.quote-review-total { display: flex; justify-content: space-between; padding: 18px; background: var(--surface-2); }
.quote-review-total strong { color: var(--blue); font-size: 20px; }
.quote-request-review > p { margin: 0; padding: 15px 18px; color: var(--muted); font-size: 12px; line-height: 1.5; }

.quote-summary {
    display: grid;
    align-content: start;
    gap: 16px;
    position: sticky;
    top: 164px;
}

.summary-card,
.customer-card,
.quote-send-card {
    padding: 20px;
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(24, 39, 75, .06);
}

.quote-card-title { display: flex; align-items: center; gap: 10px; }
.quote-card-title > span { background: #e8f0ff; color: var(--blue); }
.quote-card-title h2 { margin: 0; font-size: 18px; }
.quote-card-title small { color: var(--muted); }

.summary-card dl {
    display: grid;
    gap: 10px;
    margin: 16px 0;
}

.summary-card dl div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.summary-card dt,
.summary-card p {
    color: var(--muted);
}

.summary-card dd {
    margin: 0;
    font-weight: 800;
}

.summary-card dl div:last-child { margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--line); }
.summary-card dl div:last-child dd { color: var(--blue); font-size: 20px; }
.quote-notice { margin: 0; padding: 11px; border-radius: 9px; background: var(--surface-2); font-size: 12px; line-height: 1.5; }

.customer-card {
    display: grid;
    gap: 12px;
}

.customer-card label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.customer-card label > span { display: flex; justify-content: space-between; }
.customer-card label em { color: var(--muted); font-size: 10px; font-style: normal; font-weight: 400; }
.customer-card input, .customer-card textarea, .customer-card select { width: 100%; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); padding: 11px 12px; resize: vertical; }
.quote-request-form { gap: 15px; }
.quote-form-divider { height: 1px; margin: 3px 0; background: var(--line); }
.quote-intent-options { display: grid; gap: 9px; }
.customer-card .quote-intent-card { position: relative; display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--ink); cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.customer-card .quote-intent-card:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--blue) 55%, var(--line)); }
.customer-card .quote-intent-card:has(input:checked) { border-color: var(--blue); background: color-mix(in srgb, var(--blue) 9%, var(--surface)); box-shadow: inset 3px 0 0 var(--blue); }
.customer-card .quote-intent-card input { width: 18px; height: 18px; margin: 0; accent-color: var(--blue); }
.customer-card .quote-intent-card > span { display: grid; gap: 3px; }
.customer-card .quote-intent-card strong { color: var(--ink); font-size: 13px; }
.customer-card .quote-intent-card small { color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.35; }
.quote-billing-fields {
    display: grid;
    gap: 12px;
    margin: 4px 0;
    padding: 14px;
    border: 1px dashed color-mix(in srgb, var(--blue) 42%, var(--line));
    border-radius: 10px;
    background: color-mix(in srgb, var(--blue) 5%, var(--surface));
}
.quote-billing-fields legend { padding: 0 6px; color: var(--ink); font-size: 13px; font-weight: 900; }
.quote-billing-fields legend em { margin-left: 5px; padding: 3px 6px; border-radius: 999px; background: var(--surface-2); color: var(--muted); font-size: 9px; font-style: normal; letter-spacing: .06em; text-transform: uppercase; }
.quote-billing-fields > p { margin: -4px 0 0; color: var(--muted); font-size: 11px; font-weight: 400; }

.quote-send-card {
    display: grid;
    gap: 10px;
    border-color: #174ea6;
    background: linear-gradient(145deg, #113b7b, #174ea6);
    color: #fff;
}

.quote-send-card form {
    display: contents;
}

.quote-recipient {
    display: grid;
    gap: 3px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255,255,255,.18);
}

.quote-recipient span {
    color: rgba(255,255,255,.7);
    font-size: 13px;
}
.quote-recipient small { color: rgba(255,255,255,.7); font-size: 11px; }
.quote-card-title-light > span { background: rgba(255,255,255,.16); color: #fff; }
.quote-card-title-light small { color: rgba(255,255,255,.68); }
.quote-whatsapp-cta { min-height: 50px; border: 0; border-radius: 10px; background: #25d366; color: #092b18; font-weight: 900; box-shadow: 0 10px 22px rgba(0,0,0,.2); cursor: pointer; }
.quote-email-link { justify-self: center; color: rgba(255,255,255,.82); text-decoration: underline; text-underline-offset: 3px; }
.quote-privacy { color: rgba(255,255,255,.6); line-height: 1.4; text-align: center; }
.quote-email-link { border: 0; background: transparent; cursor: pointer; }

.admin-settings-card {
    display: grid;
    gap: 0;
    max-width: 780px;
    padding: 8px 18px 18px;
}

.admin-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

/* En administracion, la navegacion vive una sola vez en la barra fija del sitio. */
.admin-header-nav {
    min-height: 58px;
    margin-bottom: 0;
    flex-wrap: nowrap;
    overflow: visible;
}

.admin-area main .admin-nav {
    display: none;
}

.admin-area .admin-header-nav.admin-nav {
    display: flex;
}

.admin-nav a,
.admin-nav-dropdown summary {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--ink);
    font-weight: 800;
}

.admin-nav a:hover,
.admin-nav a:focus,
.admin-nav a.is-current,
.admin-nav-dropdown summary:hover,
.admin-nav-dropdown summary:focus,
.admin-nav-dropdown summary.is-current,
.admin-nav-dropdown[open] summary {
    border-color: rgba(23, 78, 166, 0.32);
    background: #eaf3ff;
    color: var(--blue);
    outline: none;
}

.admin-nav-dropdown {
    position: relative;
    z-index: 20;
}

.admin-nav-dropdown summary {
    gap: 10px;
    list-style: none;
    cursor: pointer;
}

.admin-nav-dropdown summary::-webkit-details-marker {
    display: none;
}

.admin-nav-dropdown summary span {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid currentColor;
    transition: transform 160ms ease;
}

.admin-nav-dropdown[open] summary span {
    transform: rotate(180deg);
}

.admin-nav-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    display: grid;
    width: min(320px, calc(100vw - 48px));
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 18px 34px rgba(24, 39, 75, 0.18);
}

.admin-nav-menu a {
    justify-content: flex-start;
    min-height: 38px;
    border-radius: calc(var(--radius) - 2px);
    border-color: transparent;
    background: transparent;
    white-space: normal;
}

.admin-edit-scope {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    padding: 12px 14px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-left: 4px solid var(--blue);
    border-radius: var(--radius);
    background: #eef6ff;
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
}

.admin-edit-scope strong {
    color: var(--blue);
}

.admin-edit-scope em {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    border: 1px solid rgba(23, 78, 166, 0.2);
    border-radius: 999px;
    background: var(--surface);
    color: var(--ink);
    font-style: normal;
    font-size: 12px;
    font-weight: 900;
}

.admin-home-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 12px 26px rgba(24, 39, 75, 0.06);
}

.admin-home-hero h2,
.admin-home-hero p {
    margin: 0;
}

.admin-home-hero p {
    max-width: 740px;
    color: var(--muted);
    line-height: 1.55;
}

.admin-home-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.admin-home-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.admin-home-section {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 10px 22px rgba(24, 39, 75, 0.06);
    animation: adminTableRowIn 320ms ease both;
}

.admin-home-section.is-selected {
    border-color: rgba(23, 78, 166, 0.42);
    box-shadow: 0 16px 34px rgba(23, 78, 166, 0.12);
}

.admin-home-section:nth-child(2) {
    animation-delay: 40ms;
}

.admin-home-section:nth-child(3) {
    animation-delay: 80ms;
}

.admin-home-section:nth-child(4) {
    animation-delay: 120ms;
}

.admin-home-section:nth-child(5) {
    animation-delay: 160ms;
}

.admin-home-section:nth-child(6) {
    animation-delay: 200ms;
}

.admin-home-section summary {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 84px;
    padding: 16px 52px 16px 18px;
    border-bottom: 1px solid transparent;
    cursor: pointer;
    list-style: none;
    transition: background-color 180ms ease, color 180ms ease;
}

.admin-home-order {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: var(--blue);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 950;
    box-shadow: 0 7px 15px rgba(23, 78, 166, 0.22);
}

.admin-home-section summary::-webkit-details-marker {
    display: none;
}

.admin-home-section summary::after {
    content: "";
    position: absolute;
    right: 22px;
    width: 11px;
    height: 11px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 180ms ease;
}

.admin-home-section[open] summary {
    border-bottom-color: var(--line);
    background: #f4f8ff;
}

.admin-home-section[open] summary::after {
    transform: rotate(225deg);
}

.admin-home-section summary:hover,
.admin-home-section summary:focus {
    background: #eef6ff;
    color: var(--blue);
    outline: none;
}

.admin-home-section-title {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-home-section-title small {
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-home-section-title strong {
    min-width: 0;
    color: var(--ink);
    font-size: 22px;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.admin-home-counter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.admin-home-section-body {
    display: grid;
    gap: 14px;
    padding: 18px;
}

.admin-home-section-body p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.admin-home-section-intro {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 12px;
}

.admin-home-section-intro > span {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 0.68rem;
    font-weight: 900;
    white-space: nowrap;
}

.admin-home-mini-list {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-home-mini-list li {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #f8fafc;
}

.admin-home-mini-list span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 26px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
}

.admin-home-mini-list strong {
    min-width: 0;
    color: var(--ink);
    overflow-wrap: anywhere;
}

.admin-home-empty {
    padding: 12px;
    border: 1px dashed var(--line);
    border-radius: calc(var(--radius) - 2px);
    color: var(--muted);
    font-weight: 700;
}

.admin-home-section-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-live-editor {
    margin-bottom: 18px;
}

.admin-create-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    overflow: visible;
}

.admin-create-panel summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    min-height: 58px;
    padding: 14px 18px;
    cursor: pointer;
    list-style: none;
    transition: background-color 160ms ease;
}

.admin-create-panel summary::-webkit-details-marker {
    display: none;
}

.admin-create-panel summary:hover,
.admin-create-panel summary:focus {
    background: #eef5ff;
    outline: none;
}

.admin-create-panel summary span {
    color: var(--ink);
    font-size: 18px;
    font-weight: 900;
}

.admin-create-panel summary small {
    color: var(--muted);
    font-weight: 700;
}

.admin-create-banner-form {
    display: grid;
    gap: 14px;
    padding: 18px;
    border-top: 1px solid var(--line);
    background: var(--surface);
}

.admin-banner-section {
    display: grid;
    gap: 14px;
    min-width: 0;
    margin: 0;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #f8fafc;
}

.admin-banner-section legend {
    padding: 0 8px;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.admin-form-grid-thirds {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-link-builder {
    min-width: 0;
}

.admin-slide-sort-form {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-slide-sort-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.admin-slide-sort-head strong {
    display: block;
    color: var(--ink);
    font-size: 15px;
}

.admin-slide-tabs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
}

.admin-slide-tab {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px 10px;
    align-items: center;
    min-height: 72px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    cursor: grab;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, opacity 160ms ease, transform 160ms ease;
}

.admin-slide-tab-main {
    display: contents;
    color: inherit;
    text-decoration: none;
}

.admin-slide-tab:hover,
.admin-slide-tab:focus-within {
    border-color: rgba(23, 78, 166, 0.4);
    background: #eaf3ff;
    outline: none;
    transform: translateY(-1px);
}

.admin-slide-tab.is-current {
    border-color: rgba(23, 78, 166, 0.7);
    background: linear-gradient(135deg, #eaf3ff, #fff);
    box-shadow: 0 14px 30px rgba(23, 78, 166, 0.18);
    outline: 2px solid rgba(23, 78, 166, 0.16);
    outline-offset: 2px;
}

.admin-slide-tab.is-dragging {
    opacity: 0.55;
    cursor: grabbing;
    transform: scale(0.98);
}

.admin-slide-tabs [data-banner-position] {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}

.admin-slide-tab.is-current [data-banner-position] {
    background: #0f3f8f;
}

.admin-slide-tabs strong,
.admin-slide-tabs small,
.admin-slide-tabs em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.admin-slide-tabs small {
    grid-column: 2;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.admin-slide-tabs em {
    grid-column: 2;
    width: fit-content;
    padding: 4px 8px;
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}

.button-primary:disabled,
.button-primary[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
    box-shadow: none;
}

.admin-live-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
    gap: 18px;
    align-items: start;
}

.admin-live-form {
    display: grid;
    gap: 14px;
}

.admin-create-fields {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.admin-create-actions {
    justify-content: flex-start;
}

.admin-before-after-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.admin-live-layout .admin-before-after-grid {
    grid-template-columns: 1fr;
}

.admin-live-layout .admin-edit-preview-stack {
    position: sticky;
    top: 112px;
    align-self: start;
    z-index: 2;
}

.admin-preview-card {
    display: grid;
    align-content: start;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-preview-card.admin-create-preview-card {
    position: sticky;
    top: 112px;
    align-self: start;
    z-index: 2;
    background: #fff;
}

.admin-create-panel[data-blog-live-preview] .admin-create-live-layout {
    grid-template-columns: minmax(0, 0.85fr) minmax(440px, 1.15fr);
}

.admin-blog-create-preview {
    max-height: calc(100vh - 136px);
    overflow: auto;
}

.admin-create-preview-card > div:first-child {
    display: grid;
    gap: 4px;
}

.admin-create-preview-card > div:first-child > strong {
    color: var(--ink);
    font-size: 16px;
    line-height: 1.3;
}

.admin-banner-create-order {
    display: grid;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.admin-banner-create-order .admin-slide-sort-head > div {
    display: grid;
    gap: 4px;
}

.admin-banner-create-order .admin-slide-sort-head small {
    color: var(--muted);
    font-weight: 700;
}

.admin-banner-position-map {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-banner-position-map li {
    display: grid;
    grid-template-columns: 28px 58px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 54px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
}

.admin-banner-position-number {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
}

.admin-banner-position-thumb {
    width: 58px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background-color: #0f274a;
    background-image: var(--banner-position-image);
    background-position: center;
    background-size: cover;
}

.admin-banner-position-map strong {
    min-width: 0;
    color: var(--ink);
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.admin-banner-position-map li.is-new {
    border-color: rgba(23, 78, 166, 0.5);
    background: #edf5ff;
    box-shadow: 0 0 0 2px rgba(23, 78, 166, 0.08);
}

.admin-hero-preview {
    position: relative;
    display: grid;
    align-items: end;
    min-height: 260px;
    overflow: hidden;
    border-radius: calc(var(--radius) - 2px);
    background: #0f274a;
    color: #fff;
}

.admin-hero-preview::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(90deg, rgba(8, 20, 38, 0.92) 0%, rgba(8, 20, 38, 0.72) 44%, rgba(8, 20, 38, 0.18) 100%),
        var(--preview-image);
    background-size: cover;
    background-position: center;
    transition: opacity 180ms ease;
}

.admin-hero-preview.banner-focus-left::before {
    background-position: left center;
}

.admin-hero-preview.banner-focus-right::before {
    background-position: right center;
}

.admin-hero-preview.banner-focus-top::before {
    background-position: center top;
}

.admin-hero-preview.banner-focus-bottom::before {
    background-position: center bottom;
}

.admin-hero-preview.banner-shade-none::before {
    background-image: var(--preview-image);
}

.admin-hero-preview.banner-shade-soft::before {
    background-image:
        linear-gradient(90deg, rgba(8, 20, 38, 0.62) 0%, rgba(8, 20, 38, 0.34) 42%, rgba(8, 20, 38, 0.08) 100%),
        linear-gradient(180deg, rgba(8, 20, 38, 0.06), rgba(8, 20, 38, 0.22)),
        var(--preview-image);
}

.admin-hero-preview.banner-shade-medium::before {
    background-image:
        linear-gradient(90deg, rgba(8, 20, 38, 0.92) 0%, rgba(8, 20, 38, 0.72) 44%, rgba(8, 20, 38, 0.18) 100%),
        var(--preview-image);
}

.admin-hero-preview.banner-shade-dark::before {
    background-image:
        linear-gradient(90deg, rgba(4, 10, 22, 0.96) 0%, rgba(5, 14, 28, 0.88) 52%, rgba(5, 14, 28, 0.44) 100%),
        linear-gradient(180deg, rgba(4, 10, 22, 0.34), rgba(4, 10, 22, 0.7)),
        var(--preview-image);
}

.admin-hero-preview.banner-text-top {
    align-items: start;
}

.admin-hero-preview.banner-text-middle {
    align-items: center;
}

.admin-hero-preview.banner-text-bottom {
    align-items: end;
}

.admin-hero-preview > div {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 8px;
    padding: 22px;
}

.admin-hero-preview.banner-text-left > div {
    justify-self: start;
    text-align: left;
}

.admin-hero-preview.banner-text-center > div {
    justify-self: center;
    text-align: center;
}

.admin-hero-preview.banner-text-right > div {
    justify-self: end;
    text-align: right;
}

.admin-hero-preview [hidden] {
    display: none;
}

.admin-hero-preview.has-preview-timer > div {
    padding-bottom: 78px;
}

.admin-preview-timer {
    position: absolute;
    right: 18px;
    bottom: 16px;
    left: 18px;
    z-index: 3;
    display: grid;
    gap: 6px;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    pointer-events: none;
}

.admin-preview-timer span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
}

.admin-hero-preview .admin-preview-timer strong {
    color: #ffd166;
    font-size: 12px;
}

.admin-preview-timer i {
    position: relative;
    display: block;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.4);
}

.admin-preview-timer b {
    position: absolute;
    inset: 0;
    display: block;
    border-radius: inherit;
    background: #ffd166;
    transform: scaleX(0);
    transform-origin: left center;
    animation: carouselProgress var(--preview-duration, 5600ms) linear infinite;
}

.admin-hero-preview small {
    color: #ffd166;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-hero-preview strong {
    max-width: 620px;
    font-size: clamp(22px, 2.8vw, 34px);
    line-height: 1.08;
}

.admin-hero-preview p {
    max-width: 620px;
    margin: 0;
    color: #d9e6f5;
    line-height: 1.45;
}

.admin-hero-preview em {
    display: inline-flex;
    width: fit-content;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    margin-top: 6px;
    padding: 0 14px;
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    font-style: normal;
    font-weight: 900;
}

.admin-preview-status {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #eaf8f1;
    color: var(--green);
    font-size: 12px;
    font-weight: 900;
}

.admin-preview-status.is-hidden {
    background: #fff1f0;
    color: var(--red);
}

.admin-preview-list {
    display: grid;
    gap: 12px;
}

.admin-preview-list > strong {
    font-size: 20px;
}

.admin-preview-list > small {
    color: var(--muted);
    font-weight: 800;
}

.admin-home-soon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 11px;
    border: 1px solid #d8dee6;
    border-radius: calc(var(--radius) - 2px);
    background: #f8fafc;
    color: var(--muted);
    font-size: 13px;
    font-weight: 900;
}

@media (max-width: 900px) {
    .admin-live-layout,
    .admin-create-panel[data-blog-live-preview] .admin-create-live-layout,
    .admin-before-after-grid {
        grid-template-columns: 1fr;
    }

    .admin-preview-card.admin-create-preview-card,
    .admin-live-layout .admin-edit-preview-stack {
        position: static;
    }

    .admin-blog-create-preview {
        max-height: none;
    }

    .admin-form-grid-thirds {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-home-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .admin-nav-dropdown,
    .admin-nav-dropdown summary {
        width: 100%;
    }

    .admin-nav-menu {
        position: static;
        width: 100%;
        margin-top: 8px;
        box-shadow: none;
    }

    .admin-slide-tabs {
        grid-template-columns: 1fr;
    }

    .admin-slide-sort-head {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-slide-sort-head .button-primary {
        width: 100%;
    }

    .admin-form-grid-thirds {
        grid-template-columns: 1fr;
    }

    .admin-hero-preview {
        min-height: 360px;
    }

    .admin-home-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 18px;
    }

    .admin-home-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-home-hero-actions .button-primary,
    .admin-home-hero-actions .button-ghost,
    .admin-home-hero .button-primary,
    .admin-home-section-actions .button-primary,
    .admin-home-section-actions .button-ghost,
    .admin-home-soon {
        width: 100%;
    }

    .admin-home-section summary {
        grid-template-columns: 38px minmax(0, 1fr);
        min-height: 0;
        padding: 15px 48px 15px 16px;
    }

    .admin-home-section summary .admin-home-counter {
        grid-column: 2;
        width: fit-content;
    }

    .admin-home-order {
        width: 34px;
        height: 34px;
    }

    .admin-home-section-intro {
        grid-template-columns: 1fr;
    }

    .admin-home-section-title strong {
        font-size: 20px;
    }

    .admin-home-counter {
        width: fit-content;
        white-space: normal;
    }

    .admin-home-mini-list li {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .admin-edit-scope {
        align-items: flex-start;
        flex-direction: column;
    }
}

.admin-form-card {
    display: grid;
    gap: 18px;
    margin-bottom: 18px;
    padding: 20px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

/* Editor de Quienes somos */
.admin-about-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.admin-about-overview article { display:grid; grid-template-columns:1fr auto; gap:4px 12px; align-items:center; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg,var(--surface),#f8fafc); }
.admin-about-overview span,.admin-about-overview small { color:var(--muted); font-weight:700; }
.admin-about-overview strong { grid-row:1 / span 2; grid-column:2; color:var(--ink); font-size:30px; }
.admin-about-overview small { font-size:12px; }
.admin-about-overview .admin-about-status { color:#16845b; font-size:17px; }
.admin-about-anchor-nav { position:sticky; top:var(--admin-about-tabs-top,8px); z-index:40; display:flex; gap:8px; margin:0 0 20px; padding:6px; overflow-x:auto; border:1px solid var(--line); border-radius:999px; background:var(--surface); box-shadow:0 10px 28px rgba(12,35,49,.12); }
.admin-about-anchor-nav a { flex:1; min-width:max-content; padding:9px 15px; border-radius:999px; color:var(--muted); text-align:center; text-decoration:none; font-weight:800; }
.admin-about-anchor-nav a:hover,.admin-about-anchor-nav a:focus,.admin-about-anchor-nav a.is-active { background:#174b64; color:#fff; }
.admin-about-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr); gap:20px; align-items:start; }
.admin-about-section { scroll-margin-top:20px; }
.admin-about-fields { display:grid; gap:16px; }
.admin-about-section[hidden],.admin-about-preview-column[hidden],.admin-about-gallery-panel[hidden] { display:none; }
.admin-about-form-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.admin-about-form-actions span { color:var(--muted); font-size:12px; font-weight:700; }
.admin-about-section .admin-card-head p,.admin-about-gallery-head .admin-card-head p { margin:5px 0 0; color:var(--muted); }
.admin-about-preview-column { position:sticky; top:var(--admin-about-preview-top,18px); }
.admin-about-preview-card { padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:0 16px 40px rgba(18,37,54,.09); }
.admin-about-preview-head { display:flex; justify-content:space-between; padding:2px 2px 12px; color:var(--ink); font-weight:900; }
.admin-about-preview-head small { color:var(--muted); }
.admin-about-preview { position:relative; min-height:430px; overflow:hidden; border-radius:calc(var(--radius) - 3px); background:linear-gradient(140deg,#10273b,#24546c); color:#fff; isolation:isolate; }
.admin-about-preview::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(4,18,29,.15),rgba(4,18,29,.82)); }
.admin-about-preview > img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }
.admin-about-preview > div { position:absolute; left:22px; right:22px; bottom:112px; }
.admin-about-preview > div span { color:#ffd166; font-size:11px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.admin-about-preview h3 { margin:7px 0 8px; color:#fff; font-size:clamp(24px,3vw,35px); line-height:1.03; }
.admin-about-preview p { margin:0; color:#e8f0f5; font-size:13px; line-height:1.55; }
.admin-about-preview aside { position:absolute; right:14px; bottom:14px; left:14px; display:grid; gap:3px; padding:13px; border:1px solid rgba(255,255,255,.25); border-radius:12px; background:rgba(8,25,38,.72); backdrop-filter:blur(9px); }
.admin-about-preview aside small { color:#d8e5ec; line-height:1.4; }
.admin-about-preview-note { color:var(--muted); font-size:12px; line-height:1.5; }
.admin-about-preview-card .button-ghost { width:100%; text-align:center; }
.admin-about-section-preview { display:grid; gap:14px; }
.admin-about-section-preview h3 { margin:6px 0 10px; color:var(--ink); font-size:22px; line-height:1.18; }
.admin-about-story-preview,.admin-about-workflow-preview,.admin-about-purpose-preview,.admin-about-gallery-preview,.admin-about-experience-preview,.admin-about-values-preview,.admin-about-cta-preview { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:#f8fafc; }
.admin-about-story-preview p,.admin-about-gallery-preview p,.admin-about-values-preview p { margin:8px 0 0; color:var(--muted); font-size:13px; line-height:1.55; }
.admin-about-mini-metrics,.admin-about-workflow-preview > div,.admin-about-experience-preview > div,.admin-about-values-preview > div { display:grid; gap:8px; }
.admin-about-mini-metrics article,.admin-about-workflow-preview article,.admin-about-experience-preview article,.admin-about-values-preview article { display:grid; gap:3px; padding:11px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
.admin-about-mini-metrics small,.admin-about-workflow-preview small,.admin-about-experience-preview small,.admin-about-values-preview small,.admin-about-purpose-preview small { color:var(--muted); line-height:1.4; }
.admin-about-purpose-preview article { display:grid; grid-template-columns:34px 1fr; gap:2px 10px; margin-top:10px; padding:13px; border-radius:7px; background:var(--surface); }
.admin-about-purpose-preview article b { grid-row:1 / span 2; display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#174b64; color:#fff; }
.admin-about-gallery-preview > strong,.admin-about-experience-preview > em { display:inline-flex; margin-top:12px; color:var(--blue); font-style:normal; font-weight:900; }
.admin-about-gallery-preview > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:14px; }
.admin-about-gallery-preview img { width:100%; aspect-ratio:1; border-radius:6px; object-fit:cover; }
.admin-about-values-preview { margin-top:0; }
.admin-about-cta-preview { background:#10273b; color:#fff; }
.admin-about-cta-preview h3 { color:#fff; }
.admin-about-cta-preview > div { display:flex; gap:8px; flex-wrap:wrap; margin:14px 0 10px; }
.admin-about-cta-preview > div strong,.admin-about-cta-preview > div em { padding:9px 12px; border-radius:7px; background:#ffd166; color:#10273b; font-size:12px; font-style:normal; }
.admin-about-cta-preview > div em { border:1px solid rgba(255,255,255,.4); background:transparent; color:#fff; }
.admin-about-cta-preview > small { color:#d8e5ec; }
.admin-about-purpose-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.admin-about-purpose-grid article { position:relative; display:grid; gap:14px; padding:18px; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#f8fafc; }
.admin-about-purpose-number { position:absolute; top:-22px; right:5px; color:rgba(18,69,96,.06); font-size:100px; font-weight:950; line-height:1; }
.admin-about-savebar { position:sticky; bottom:12px; z-index:10; display:flex; align-items:center; justify-content:space-between; gap:16px; margin:2px 0 24px; padding:14px 16px; border:1px solid rgba(25,75,101,.22); border-radius:var(--radius); background:rgba(255,255,255,.94); box-shadow:0 14px 42px rgba(12,35,49,.15); backdrop-filter:blur(12px); }
.admin-about-savebar div { display:grid; gap:2px; }
.admin-about-savebar small { color:var(--muted); }
.admin-about-editor.has-unsaved-changes .admin-about-savebar { border-color:#d6a31d; }
.admin-about-editor.has-unsaved-changes .admin-about-savebar small { color:#8a6500; font-weight:800; }
.admin-about-gallery-head { margin-top:6px; }
.admin-about-photo-count { padding:7px 11px; border-radius:999px; background:#edf5f8; color:#174b64; font-weight:900; white-space:nowrap; }
.admin-about-upload { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:center; }
.admin-about-dropzone { display:grid; grid-template-columns:auto 1fr; gap:2px 13px; align-items:center; padding:18px; border:1.5px dashed #8aa9b9; border-radius:var(--radius); background:#f7fafc; cursor:pointer; }
.admin-about-dropzone:hover { border-color:#246584; background:#f0f7fa; }
.admin-about-dropzone.is-dragging { border-color:#174b64; background:#e6f2f6; box-shadow:inset 0 0 0 2px rgba(23,75,100,.12); }
.admin-about-dropzone input { position:absolute; width:1px; height:1px; opacity:0; }
.admin-about-upload-icon { grid-row:1 / span 3; display:grid; width:42px; height:42px; place-items:center; border-radius:50%; background:#174b64; color:white; font-size:25px; }
.admin-about-dropzone small,.admin-about-dropzone em { color:var(--muted); font-size:12px; font-style:normal; }
.admin-about-dropzone em { color:#246584; font-weight:800; }
.admin-about-image-card { position:relative; }
.admin-about-image-index { position:absolute; top:20px; left:20px; padding:5px 8px; border-radius:8px; background:rgba(7,25,37,.82); color:#fff; font-size:12px; font-weight:900; }
.admin-about-image-card .admin-image-actions small { max-width:65%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:980px) { .admin-about-layout { grid-template-columns:1fr; } .admin-about-preview-column { position:static; } .admin-about-preview { min-height:380px; } }
@media (max-width:720px) { .admin-about-overview,.admin-about-purpose-grid { grid-template-columns:1fr; } .admin-about-anchor-nav { border-radius:var(--radius); } .admin-about-upload { grid-template-columns:1fr; } .admin-about-upload .button-primary { width:100%; } .admin-about-savebar,.admin-about-form-actions { align-items:stretch; flex-direction:column; bottom:6px; } .admin-about-savebar .button-primary,.admin-about-form-actions .button-primary { width:100%; } }

.admin-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.admin-field {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-weight: 700;
}

.admin-field span {
    color: var(--ink);
    font-weight: 800;
}

.admin-field small {
    color: var(--muted);
    font-weight: 600;
}

.admin-field input,
.admin-field select,
.admin-field textarea {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    color: var(--ink);
    font: inherit;
}

.admin-field input,
.admin-field select {
    min-height: 42px;
    padding: 0 12px;
}

.admin-field input[type="file"] {
    min-height: 46px;
    padding: 10px 12px;
}

.admin-field textarea {
    min-height: 96px;
    padding: 12px;
    resize: vertical;
}

.admin-check-field {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-weight: 700;
}

.admin-check-field input {
    width: 18px;
    height: 18px;
}

.admin-actions,
.admin-card-head,
.admin-image-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.admin-card-head {
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.admin-card-head h2 {
    margin: 0;
}

.admin-image-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.admin-image-card {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-image-card img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: calc(var(--radius) - 2px);
    background: #eef2f5;
}

.admin-config-tabs { position:sticky; top:var(--admin-config-tabs-top,8px); z-index:40; display:flex; gap:8px; margin:0 0 20px; padding:6px; overflow-x:auto; border:1px solid var(--line); border-radius:999px; background:var(--surface); box-shadow:0 10px 28px rgba(12,35,49,.12); }
.admin-config-tabs a { flex:1; min-width:max-content; padding:10px 16px; border-radius:999px; color:var(--muted); text-align:center; text-decoration:none; font-weight:800; }
.admin-config-tabs a:hover,.admin-config-tabs a:focus,.admin-config-tabs a.is-active { background:#174b64; color:#fff; }
.admin-config-editor-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(320px,.72fr); gap:20px; align-items:start; }
.admin-config-editor-fields { display:grid; min-width:0; }
.admin-config-editor [hidden] { display:none !important; }
.admin-config-preview-column { position:sticky; top:calc(var(--admin-config-tabs-top,8px) + 68px); }
.admin-config-preview-card { display:grid; gap:14px; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:0 16px 40px rgba(18,37,54,.09); }
.admin-config-preview-head { display:flex; justify-content:space-between; gap:12px; color:var(--ink); font-weight:900; }
.admin-config-preview-head small { color:var(--muted); }
.admin-config-logo-mode { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 18px; padding:0; border:0; }
.admin-config-logo-mode legend { grid-column:1 / -1; margin-bottom:3px; color:var(--ink); font-size:13px; font-weight:900; }
.admin-config-logo-mode label { position:relative; cursor:pointer; }
.admin-config-logo-mode input { position:absolute; opacity:0; pointer-events:none; }
.admin-config-logo-mode span { display:grid; min-height:46px; place-items:center; padding:8px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--muted); font-weight:900; text-align:center; }
.admin-config-logo-mode input:checked + span { border-color:#174b64; background:#174b64; color:#fff; }
.admin-config-text-logo-fields { display:grid; gap:14px; margin-bottom:18px; padding:16px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); }
.admin-config-text-layout { display:grid; gap:12px; margin:0; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.admin-config-text-layout legend { padding:0 7px; color:var(--ink); font-weight:900; }
.admin-config-align-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.admin-config-align-options label { cursor:pointer; }
.admin-config-align-options input { position:absolute; opacity:0; pointer-events:none; }
.admin-config-align-options span { display:grid; min-height:54px; place-items:center; gap:5px; padding:7px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2); color:var(--muted); font-size:12px; font-weight:850; transition:border-color 160ms ease,background-color 160ms ease,color 160ms ease; }
.admin-config-align-options input:checked + span { border-color:var(--blue); background:#eaf3ff; color:var(--blue); box-shadow:0 0 0 2px rgba(23,78,166,.1); }
.admin-config-align-options i { position:relative; display:block; width:28px; height:18px; border-top:2px solid currentColor; border-bottom:2px solid currentColor; }
.admin-config-align-options i::before { position:absolute; top:6px; width:18px; border-top:2px solid currentColor; content:""; }
.admin-config-align-options label:first-child i::before { left:0; }
.admin-config-align-options label:nth-child(2) i::before { left:5px; }
.admin-config-align-options label:last-child i::before { right:0; }
.admin-config-indent-field > div { display:grid; grid-template-columns:minmax(0,1fr) 58px; align-items:center; gap:10px; }
.admin-config-indent-field input[type="range"] { min-height:30px; padding:0; accent-color:var(--blue); }
.admin-config-indent-field output { display:grid; min-height:34px; place-items:center; border:1px solid var(--line); border-radius:8px; background:var(--surface-2); color:var(--blue); font-size:12px; font-weight:900; }
[data-theme="dark"] .admin-config-align-options input:checked + span { border-color:#60a5fa; background:rgba(37,99,235,.2); color:#93c5fd; }
.admin-config-header-preview { display:grid; gap:8px; padding:14px; border:1px solid var(--line); border-radius:7px; background:#f7fafc; }
.admin-config-header-preview > span { color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; }
.admin-config-header-preview > div { display:grid; grid-template-columns:minmax(100px,150px) 1fr auto; gap:12px; align-items:center; }
.admin-config-header-preview img { width:100%; height:58px; object-fit:contain; object-position:left center; }
.admin-config-text-logo-preview { display:grid; min-width:100px; min-height:58px; align-items:center; overflow-wrap:anywhere; color:#174b64; font-weight:900; line-height:1; }
.admin-config-header-preview.is-dark-preview .admin-config-text-logo-preview { color:#b9e3ff; text-shadow:0 0 2px #fff,0 0 6px var(--preview-neon-color,#47b5ff),0 0 13px var(--preview-neon-color,#1677ff),0 0 22px var(--preview-neon-color,#1677ff); }
.admin-config-color-field input[type="color"] { width:100%; height:48px; padding:4px; border:1px solid var(--line); border-radius:7px; cursor:pointer; }
.admin-config-neon-field { display:grid; gap:9px; margin:0; padding:13px; border:1px solid var(--line); border-radius:8px; }
.admin-config-neon-field legend { padding:0 7px; color:var(--ink); font-size:13px; font-weight:900; }
.admin-config-neon-field > small { color:var(--muted); font-size:11px; }
.admin-config-neon-options { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.admin-config-neon-options label { cursor:pointer; }
.admin-config-neon-options input { position:absolute; opacity:0; pointer-events:none; }
.admin-config-neon-options span { display:grid; min-height:40px; place-items:center; padding:6px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); color:var(--muted); font-size:12px; font-weight:850; }
.admin-config-neon-options input:checked + span { border-color:var(--blue); background:#eaf3ff; color:var(--blue); box-shadow:0 0 0 2px rgba(23,78,166,.1); }
[data-theme="dark"] .admin-config-neon-options input:checked + span { border-color:#60a5fa; background:rgba(37,99,235,.2); color:#93c5fd; }
@media (max-width:560px) { .admin-config-neon-options { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.admin-config-header-preview b { padding:11px 14px; border:1px solid #cad6df; border-radius:6px; color:#62717d; font-size:12px; }
.admin-config-header-preview em { color:#174b64; font-size:12px; font-style:normal; font-weight:900; }
.admin-config-header-preview.is-dark-preview { border-color:#294157; background:#0d1c2b; }
.admin-config-header-preview.is-dark-preview > span,.admin-config-header-preview.is-dark-preview b { color:#b9c7d4; }
.admin-config-header-preview.is-dark-preview b { border-color:#365068; }
.admin-config-header-preview.is-dark-preview em { color:#ffd166; }
.admin-config-upload-preview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; min-height:320px; align-content:center; }
.admin-config-upload-preview > div { grid-column:1 / -1; display:grid; gap:6px; place-items:center; min-height:280px; padding:24px; border:1px dashed var(--line); border-radius:7px; color:var(--muted); text-align:center; }
.admin-config-upload-preview figure { display:grid; gap:7px; margin:0; padding:10px; border:1px solid var(--line); border-radius:7px; background:#f7fafc; }
.admin-config-upload-preview img { width:100%; height:130px; object-fit:contain; }
.admin-config-upload-preview figcaption { overflow:hidden; color:var(--muted); font-size:11px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.admin-config-store-preview { display:grid; gap:18px; min-height:390px; align-content:start; padding:18px; border-radius:7px; background:#eef4f7; }
.admin-config-store-preview nav { display:flex; min-height:44px; gap:8px; align-items:center; padding:9px; border-radius:6px; background:#10273b; color:#fff; }
.admin-config-store-preview nav strong { margin-right:auto; }
.admin-config-store-preview nav span { padding:6px 8px; border-radius:5px; background:#ffd166; color:#10273b; font-size:10px; font-weight:900; }
.admin-config-store-preview article { display:grid; gap:10px; padding:18px; border:1px solid var(--line); border-radius:7px; background:#fff; }
.admin-config-store-preview article > span { color:var(--muted); font-size:12px; }
.admin-config-store-preview article > strong { color:var(--ink); font-size:25px; }
.admin-config-store-preview button { width:max-content; padding:9px 14px; border:0; border-radius:6px; background:#174b64; color:#fff; font-weight:900; }
.admin-config-store-preview > small { color:var(--muted); line-height:1.45; }
@media (max-width:980px) { .admin-config-editor-layout { grid-template-columns:1fr; } .admin-config-preview-column { position:static; } }
@media (max-width:620px) { .admin-config-tabs { border-radius:var(--radius); } .admin-config-header-preview > div { grid-template-columns:1fr; } .admin-config-header-preview img { object-position:center; } .admin-config-header-preview em { display:none; } .admin-config-upload-preview { grid-template-columns:1fr; } .admin-config-align-options { grid-template-columns:1fr; } }

.admin-logo-current {
    display: grid;
    grid-template-columns: auto minmax(180px, 260px) minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-logo-current-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.admin-logo-current-grid .admin-logo-current {
    grid-template-columns: 1fr;
}

.admin-logo-current span {
    color: var(--ink);
    font-weight: 800;
}

.admin-logo-current img {
    width: 100%;
    height: 86px;
    object-fit: contain;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
}

.admin-logo-current.is-dark-logo img,
.admin-logo-picker.is-dark-logo .admin-logo-option-preview {
    border-color: #2c3a50;
    background: #151f31;
}

.admin-logo-current small,
.admin-path-note,
.admin-logo-option small {
    min-width: 0;
    color: var(--muted);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.admin-logo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.admin-logo-picker {
    display: grid;
    gap: 12px;
}

.admin-logo-picker h3 {
    margin: 0;
    font-size: 18px;
}

.admin-logo-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
    cursor: pointer;
}

.admin-logo-option.is-active,
.admin-logo-option:has(input:checked) {
    border-color: rgba(23, 78, 166, 0.46);
    background: #eaf3ff;
}

.admin-logo-option input {
    width: 18px;
    height: 18px;
    margin-top: 38px;
}

.admin-logo-option-preview {
    display: grid;
    place-items: center;
    min-width: 0;
    height: 96px;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #fff;
}

.admin-logo-option-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 10px;
}

.admin-logo-option strong,
.admin-logo-option small {
    grid-column: 2;
}

.admin-path-note {
    margin: 0;
}

.admin-image-actions small {
    min-width: 0;
    color: var(--muted);
    font-size: 12px;
    overflow-wrap: anywhere;
}

.button-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #ffc9c4;
    border-radius: var(--radius);
    background: #fff1f0;
    color: var(--red);
    font-weight: 800;
    cursor: pointer;
}

.button-danger:hover,
.button-danger:focus {
    border-color: var(--red);
    outline: none;
}

.confirm-dialog {
    position: fixed;
    inset: 0;
    z-index: 1500;
    display: grid;
    place-items: center;
    padding: 18px;
}

.confirm-dialog-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.54);
    backdrop-filter: blur(4px);
}

.confirm-dialog-panel {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: 12px;
    width: min(100%, 430px);
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--ink);
    text-align: center;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
}

.confirm-dialog-mark {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    background: #fff1f0;
    color: var(--red);
    font-size: 24px;
    font-weight: 900;
}

.confirm-dialog-panel h2 {
    margin: 0;
    font-size: 24px;
}

.confirm-dialog-panel p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.confirm-dialog-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
    padding-top: 4px;
}

.confirm-dialog-actions .button-ghost,
.confirm-dialog-actions .button-danger {
    min-width: 138px;
}

.switch-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
}

.switch-row small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
}

.switch-row input {
    width: 22px;
    height: 22px;
}

.admin-note {
    max-width: 780px;
    margin-top: 18px;
    padding: 18px;
}

.auth-shell {
    display: grid;
    justify-items: center;
    gap: 18px;
}

.auth-shell .quote-heading {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.auth-switch-card {
    position: relative;
    width: min(100%, 1180px);
    min-height: 640px;
    max-width: 1180px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.auth-mobile-tabs {
    display: none;
}

.auth-form-pane {
    position: absolute;
    top: 0;
    height: 100%;
    transition: transform 560ms ease-in-out, opacity 560ms ease-in-out, z-index 560ms ease-in-out;
}

.auth-sign-in-pane {
    left: 0;
    width: 50%;
    z-index: 2;
}

.auth-sign-up-pane {
    left: 0;
    width: 50%;
    z-index: 1;
    opacity: 0;
}

.auth-switch-card.right-panel-active .auth-sign-in-pane {
    transform: translateX(100%);
}

.auth-switch-card.right-panel-active .auth-sign-up-pane {
    z-index: 5;
    opacity: 1;
    transform: translateX(100%);
}

.auth-form {
    display: grid;
    align-content: center;
    gap: 18px;
    height: 100%;
    padding: 48px 64px;
    background: var(--surface);
}

.auth-create-form {
    gap: 16px;
    padding: 46px 64px;
}

.auth-form-head {
    display: grid;
    gap: 6px;
    text-align: center;
}

.auth-form-head h2,
.auth-overlay-panel h2 {
    margin: 0;
    font-size: 32px;
    line-height: 1.08;
}

.auth-form-head p,
.auth-overlay-panel p,
.auth-form-links {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.auth-field {
    display: grid;
    gap: 6px;
    color: var(--ink);
    font-weight: 800;
}

.auth-field-stack {
    display: grid;
    gap: 14px;
}

.auth-create-form .auth-field-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auth-field input,
.auth-field select {
    width: 100%;
    min-height: 50px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #eef2f5;
    color: var(--ink);
    padding: 0 12px;
}

.auth-branch-field select { border-color: rgba(23, 78, 166, .45); background: #eaf3ff; font-weight: 800; }

.auth-field input::placeholder {
    color: #7b8797;
}

.auth-form .button-primary {
    width: 100%;
}

.auth-security-note {
    margin: 0;
    padding: 12px 14px;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: var(--radius);
    background: #eaf3ff;
    color: var(--blue-dark);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}

.client-profile-shell { padding-bottom: 64px; }
.client-profile-shell > .quote-heading { max-width: 780px; }
.client-profile-form { display: grid; gap: 20px; max-width: 980px; margin: 0 auto; }
.client-profile-card { padding: 28px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.client-profile-card-head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 24px; }
.client-profile-card-head > span { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: var(--blue); color: #fff; font-weight: 900; }
.client-profile-card-head h2 { margin: 0 0 4px; font-size: 22px; }
.client-profile-card-head p { margin: 0; color: var(--muted); }
.client-profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.client-profile-wide { grid-column: 1 / -1; }
.client-profile-card textarea { width: 100%; min-height: 110px; padding: 12px; resize: vertical; border: 1px solid var(--line); border-radius: var(--radius); background: #eef2f5; color: var(--ink); font: inherit; }
.client-profile-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.profile-password-required, .admin-temporary-access { padding: 18px 20px; border: 1px solid rgba(227, 166, 0, .45); border-radius: var(--radius); background: #fff8d8; color: #5c4500; }
.profile-password-required { width: min(100%, 980px); margin: 0 auto 20px; }
.profile-password-required p, .admin-temporary-access p { margin: 5px 0 0; }
.admin-temporary-access { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 18px; }
.admin-temporary-access code { display: inline-block; margin-top: 10px; padding: 7px 10px; border-radius: 7px; background: rgba(255,255,255,.7); color: inherit; font-size: 17px; font-weight: 900; }

@media (max-width: 700px) {
    .client-profile-card { padding: 20px; }
    .client-profile-grid { grid-template-columns: 1fr; }
    .client-profile-wide { grid-column: auto; }
    .client-profile-actions { align-items: stretch; flex-direction: column-reverse; }
    .admin-temporary-access { align-items: stretch; flex-direction: column; }
    .client-profile-actions a, .client-profile-actions button { width: 100%; text-align: center; }
}

[data-theme="dark"] .client-profile-card textarea { background: #142131; color: var(--ink); }
[data-theme="dark"] .profile-password-required, [data-theme="dark"] .admin-temporary-access { background: #392f0d; color: #ffe68a; }

.auth-field small,
.auth-form-links span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.auth-form-links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}

.auth-form-links a {
    color: var(--blue);
    font-weight: 800;
}

.auth-simple-shell { display: grid; justify-items: center; padding-bottom: 64px; }
.auth-simple-card { width: min(100%, 560px); height: auto; min-height: 480px; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.auth-simple-card h1 { margin: 0; font-size: 32px; }
.auth-status { margin: 0; padding: 12px 14px; border-radius: var(--radius); font-size: 14px; font-weight: 800; line-height: 1.45; }
.auth-status.is-success { border: 1px solid rgba(22, 163, 74, .35); background: #ecfdf3; color: #166534; }
.auth-status.is-error { border: 1px solid rgba(220, 38, 38, .3); background: #fef2f2; color: #991b1b; }
.auth-button-link { display: block; text-align: center; }
[data-theme="dark"] .auth-status.is-success { background: #123521; color: #a7f3d0; }
[data-theme="dark"] .auth-status.is-error { background: #3b1717; color: #fecaca; }

@media (max-width: 600px) {
    .auth-simple-card { min-height: 0; padding: 34px 22px; }
}

.auth-overlay-pane {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 10;
    width: 50%;
    height: 100%;
    overflow: hidden;
    transition: transform 560ms ease-in-out;
}

.auth-switch-card.right-panel-active .auth-overlay-pane {
    transform: translateX(-100%);
}

.auth-overlay {
    position: relative;
    left: -100%;
    width: 200%;
    height: 100%;
    background: linear-gradient(135deg, #174ea6 0%, #113b7b 48%, #d92d20 100%);
    color: #fff;
    transform: translateX(0);
    transition: transform 560ms ease-in-out;
}

.auth-switch-card.right-panel-active .auth-overlay {
    transform: translateX(50%);
}

.auth-overlay-panel {
    position: absolute;
    top: 0;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 16px;
    width: 50%;
    height: 100%;
    padding: 56px;
    text-align: center;
    transition: transform 560ms ease-in-out;
}

.auth-overlay-panel p {
    max-width: 310px;
    color: rgba(255, 255, 255, 0.86);
}

.auth-overlay-left {
    transform: translateX(-18%);
}

.auth-overlay-right {
    right: 0;
    transform: translateX(0);
}

.auth-switch-card.right-panel-active .auth-overlay-left {
    transform: translateX(0);
}

.auth-switch-card.right-panel-active .auth-overlay-right {
    transform: translateX(18%);
}

.auth-ghost-button {
    border-color: rgba(255, 255, 255, 0.82);
    background: transparent;
    color: #fff;
}

.auth-ghost-button:hover,
.auth-ghost-button:focus {
    border-color: #fff;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.admin-users-list {
    gap: 14px;
}

.admin-catalog-card,
.admin-product-editor {
    display: grid;
    gap: 16px;
}

.admin-product-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-catalog-categories {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(248, 251, 255, 0.72);
}

.admin-catalog-categories-only .admin-catalog-category-list {
    max-height: none;
    overflow: visible;
    padding: 0;
}

.admin-catalog-category-list {
    max-height: 430px;
    overflow: auto;
    padding: 2px;
}

.admin-catalog-category-tree {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-catalog-category-tree.is-nested {
    margin: 7px 0 0 28px;
}

.admin-catalog-category-row {
    display: grid;
    grid-template-columns: minmax(42px, auto) minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 50px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
}

.admin-catalog-category-depth {
    display: grid;
    min-width: 42px;
    height: 26px;
    padding: 0 5px;
    place-items: center;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 0.76rem;
    font-weight: 800;
}

.admin-catalog-category-row > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.admin-catalog-category-main {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 0;
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    background: transparent !important;
    color: var(--ink);
    cursor: default;
    box-shadow: none;
    outline: none;
    text-align: left;
    text-decoration: none;
}

.admin-catalog-category-main.has-children {
    position: relative;
    padding-right: 22px;
    cursor: pointer;
}

.admin-catalog-category-main.has-children::after {
    position: absolute;
    top: 50%;
    right: 2px;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    content: "";
    transform: translateY(-70%) rotate(45deg);
    transition: transform 160ms ease;
}

.admin-catalog-category-main.has-children.is-expanded::after {
    transform: translateY(-25%) rotate(225deg);
}

.admin-catalog-category-main.is-leaf { cursor: default; }

.admin-catalog-category-main.has-children:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 4px;
    border-radius: 4px;
}

.admin-catalog-category-children[hidden] {
    display: none;
}

.admin-catalog-category-main:hover strong,
.admin-catalog-category-main:focus strong {
    color: var(--blue);
}

.admin-catalog-category-row small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-catalog-category-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.admin-catalog-category-form {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 12px;
    background: var(--surface);
}

.admin-catalog-category-form-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.admin-catalog-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1.35fr) repeat(3, minmax(150px, 0.8fr)) auto;
    align-items: end;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.admin-catalog-filter-actions {
    display: flex;
    gap: 8px;
}

.admin-products-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: separate;
    border-spacing: 0;
}

.admin-products-table th,
.admin-products-table td {
    padding: 13px 12px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: middle;
}

.admin-products-table th:last-child,
.admin-products-table td:last-child {
    border-right: 0;
}

.admin-products-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f1f5fb;
    color: var(--muted);
    font-size: 0.74rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.admin-products-table tbody tr {
    background: #fff;
    transition: background-color 180ms ease, box-shadow 180ms ease;
}

.admin-products-table tbody tr:nth-child(even) {
    background: #f8fafc;
}

.admin-products-table tbody tr:hover {
    background: #eef6ff;
    box-shadow: 0 8px 18px rgba(23, 78, 166, 0.1);
}

.admin-products-table tr:last-child td {
    border-bottom: 0;
}

.admin-product-table-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 250px;
}

.admin-product-table-cell > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.admin-product-table-cell strong,
.admin-product-table-cell span,
.admin-product-table-cell small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-product-table-cell strong {
    color: var(--ink);
}

.admin-product-table-cell div span,
.admin-product-table-cell small,
.admin-product-old-price {
    color: var(--muted);
    font-size: 0.75rem;
}

.admin-product-table-visual {
    display: grid;
    width: 56px;
    height: 52px;
    flex: 0 0 56px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}

.admin-product-table-visual .product-shape,
.admin-product-table-visual i {
    display: block;
    width: 40px;
    height: 30px;
    border-radius: 5px;
    background: #cbd5e1;
    transform: scale(0.38);
}

.admin-product-table-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 3px;
}

.admin-product-stock {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
    white-space: nowrap;
}

.admin-product-stock.is-ok {
    background: #dcfce7;
    color: #166534;
}

.admin-product-stock.is-out {
    background: #fee2e2;
    color: #991b1b;
}

.admin-product-status-list {
    display: grid;
    gap: 4px;
    color: var(--ink);
    font-weight: 700;
}

.admin-product-status-list small {
    color: var(--blue);
    font-size: 0.72rem;
    font-weight: 800;
}

.admin-product-editor {
    scroll-margin-top: 110px;
}

.admin-product-editor-head p {
    max-width: 680px;
    margin: 7px 0 0;
    color: var(--muted);
}

.admin-product-form {
    display: grid;
    gap: 20px;
}

.admin-product-visibility-guide {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.admin-product-visibility-guide article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 12px;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: 13px;
    background: linear-gradient(145deg, rgba(234, 243, 255, 0.8), rgba(248, 251, 255, 0.55));
}

.admin-product-guide-icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 9px;
    background: var(--blue);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 900;
}

.admin-product-visibility-guide article div {
    display: grid;
    gap: 5px;
}

.admin-product-visibility-guide article strong {
    color: var(--ink);
    font-size: 0.87rem;
}

.admin-product-visibility-guide article p {
    margin: 0;
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.35;
}

.admin-product-visibility-guide article p b {
    color: var(--ink);
}

.admin-category-editor-head p {
    margin: 7px 0 0;
    color: var(--muted);
}

.admin-category-editor-form {
    display: grid;
    gap: 20px;
}

.admin-category-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    align-items: start;
    gap: 20px;
}

.admin-category-preview-section {
    position: sticky;
    top: 112px;
}

.admin-category-preview-pane.is-active {
    display: grid;
    gap: 12px;
}

.admin-category-edit-map {
    display: grid;
    gap: 12px;
    max-height: 520px;
    overflow: auto;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #f8fafc;
}

.admin-category-edit-map-head {
    display: grid;
    gap: 3px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}

.admin-category-edit-map-head strong { color: var(--ink); }
.admin-category-edit-map-head small { color: var(--muted); }

.admin-category-level-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 7px;
}

.admin-category-level-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 7px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 0.61rem;
    font-weight: 850;
}

.admin-category-level-legend i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--level-color);
}

.admin-category-level-legend .level-1 { --level-color: #2563eb; }
.admin-category-level-legend .level-2 { --level-color: #7c3aed; }
.admin-category-level-legend .level-3 { --level-color: #0f8f83; }

.admin-category-edit-map-level {
    display: grid;
    gap: 8px;
    margin: 8px 0 0 20px;
    padding: 0 0 0 14px;
    border-left: 2px solid rgba(23, 78, 166, 0.18);
    list-style: none;
}

.admin-category-edit-map-level.is-root {
    margin: 0;
    padding: 0;
    border-left: 0;
}

.admin-category-edit-map-level li {
    position: relative;
    min-width: 0;
    --level-color: #64748b;
    --level-soft: #f1f5f9;
}

.admin-category-edit-map-level li.level-1 { --level-color: #2563eb; --level-soft: #eaf2ff; }
.admin-category-edit-map-level li.level-2 { --level-color: #7c3aed; --level-soft: #f2ecff; }
.admin-category-edit-map-level li.level-3 { --level-color: #0f8f83; --level-soft: #e6f8f5; }
.admin-category-edit-map-level li.level-4 { --level-color: #d97706; --level-soft: #fff4df; }

.admin-category-edit-map-level li::before {
    position: absolute;
    top: 23px;
    left: -14px;
    width: 12px;
    height: 2px;
    background: var(--level-color);
    content: "";
}

.admin-category-edit-map-level.is-root > li::before { display: none; }

.admin-category-edit-map-level a {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    min-height: 46px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-left: 5px solid var(--level-color);
    border-radius: 10px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.admin-category-edit-map-level a:hover,
.admin-category-edit-map-level a:focus {
    border-color: var(--blue);
    background: #f2f7ff;
    outline: none;
    transform: translateX(2px);
}

.admin-category-edit-map-level a > span {
    padding: 3px 6px;
    border-radius: 999px;
    background: var(--level-soft);
    color: var(--level-color);
    font-size: 0.61rem;
    font-weight: 900;
    white-space: nowrap;
}

.admin-category-edit-map-level a > strong {
    overflow: hidden;
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-category-edit-map-level a > small {
    color: var(--muted);
    font-size: 0.62rem;
    white-space: nowrap;
}

.admin-category-edit-map-level li.is-current-path > a {
    border-color: var(--level-color);
    background: var(--level-soft);
}

.admin-category-edit-map-level li.is-current > a {
    border: 2px solid var(--level-color);
    border-left-width: 6px;
    background: #fff;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--level-color) 22%, transparent);
}

.admin-category-edit-map-level li.is-current > a > i {
    position: absolute;
    top: 50%;
    right: calc(100% + 6px);
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid #d28a00;
    transform: translateY(-50%);
    animation: categoryHereArrow 900ms ease-in-out infinite alternate;
}

.admin-category-concept-map {
    display: grid;
    justify-items: center;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #f8fafc;
}

.admin-category-map-node {
    display: grid;
    width: min(100%, 330px);
    gap: 4px;
    padding: 13px 15px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #fff;
    text-align: center;
    box-shadow: 0 6px 14px rgba(24, 39, 75, 0.06);
}

.admin-category-map-node small {
    color: var(--muted);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.admin-category-map-node strong { color: var(--ink); line-height: 1.3; }
.admin-category-map-node > span { color: var(--muted); font-size: 0.72rem; line-height: 1.4; }
.admin-category-map-node.is-parent { border-color: rgba(23, 78, 166, 0.34); background: #eaf3ff; }
.admin-category-map-node.is-current { border: 2px solid var(--blue); background: #fff; box-shadow: 0 10px 22px rgba(23, 78, 166, 0.16); }
.admin-category-map-node.is-current small,
.admin-category-map-node.is-current strong { color: var(--blue); }
.admin-category-map-node.is-products { border-style: dashed; }

.admin-category-map-current-wrap {
    position: relative;
    display: grid;
    width: min(72%, 330px);
    justify-items: center;
}

.admin-category-map-current-wrap .admin-category-map-node {
    width: 100%;
}

.admin-category-you-are-here {
    position: absolute;
    top: 50%;
    right: calc(100% + 13px);
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0;
    border-radius: 50%;
    background: #fff3cd;
    color: #8a5b00;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: 0 5px 12px rgba(138, 91, 0, 0.14);
    transform: translateY(-50%);
}

.admin-category-you-are-here i {
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 9px solid #d28a00;
    animation: categoryHereArrow 900ms ease-in-out infinite alternate;
}

@keyframes categoryHereArrow {
    from { transform: translateX(0); }
    to { transform: translateX(4px); }
}

@media (max-width: 1180px) {
    .admin-category-map-current-wrap {
        width: min(100%, 330px);
        gap: 7px;
    }

    .admin-category-you-are-here {
        position: static;
        transform: none;
    }
}

.admin-category-map-link {
    display: block;
    width: 2px;
    height: 24px;
    background: linear-gradient(var(--blue), rgba(23, 78, 166, 0.28));
}

.admin-category-map-link::after {
    display: block;
    width: 7px;
    height: 7px;
    margin: 16px 0 0 -3px;
    border-right: 2px solid var(--blue);
    border-bottom: 2px solid var(--blue);
    content: "";
    transform: rotate(45deg);
}

.admin-live-category-path,
.admin-live-category-filter,
.admin-live-category-description {
    display: grid;
    gap: 7px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #f8fafc;
}

.admin-live-category-path span,
.admin-live-category-filter span,
.admin-live-category-description span {
    color: var(--muted);
    font-size: 0.69rem;
    font-weight: 800;
    text-transform: uppercase;
}

.admin-live-category-path strong { color: var(--ink); line-height: 1.4; }
.admin-category-filter-select { position: relative; display: grid; gap: 3px; min-height: 58px; padding: 9px 42px 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.admin-category-filter-select b { color: var(--muted); font-size: 0.67rem; }
.admin-category-filter-select strong { overflow: hidden; color: var(--ink); font-size: 0.82rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-category-filter-select i { position: absolute; top: 23px; right: 16px; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); }
.admin-live-category-description p { margin: 0; color: var(--muted); line-height: 1.5; }

.admin-product-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(350px, 0.72fr);
    align-items: start;
    gap: 20px;
}

.admin-product-form-main,
.admin-product-form-sidebar {
    display: grid;
    gap: 20px;
}

.admin-product-form-sidebar {
    position: sticky;
    top: 112px;
}

.admin-product-form-layout.is-preview-aside .admin-product-form-sidebar {
    max-height: calc(100vh - 128px);
    overflow-y: auto;
    scrollbar-width: thin;
}

.admin-product-form-sidebar .admin-product-live-preview {
    margin-top: 0;
}

.admin-product-form-sidebar .admin-product-preview-head {
    align-items: stretch;
    flex-direction: column;
}

.admin-product-form-sidebar .admin-product-preview-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.admin-product-form-sidebar .admin-live-product-card {
    grid-template-columns: 1fr;
}

.admin-product-form-sidebar .admin-live-product-media {
    min-height: 175px;
}

.admin-product-form-sidebar .admin-live-product-media img {
    height: 175px;
}

.admin-product-form-sidebar .admin-live-filter-preview {
    grid-template-columns: 1fr;
}

.admin-product-form-section {
    display: grid;
    min-width: 0;
    gap: 18px;
    margin: 0;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(24, 39, 75, 0.055);
}

.admin-product-form-section legend {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 8px 0 0;
    color: var(--ink);
    font-size: 1.04rem;
}

.admin-product-form-section legend span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 50%;
    background: var(--blue);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 900;
    box-shadow: 0 6px 14px rgba(23, 78, 166, 0.24);
}

.admin-product-section-help {
    margin: -8px 0 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.admin-product-form .admin-field span em,
.admin-category-editor-form .admin-field span em {
    color: var(--red);
    font-style: normal;
}

.admin-field-use {
    display: inline-flex;
    align-items: center;
    min-height: 21px;
    margin-left: 4px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #e9f7ef;
    color: #197044;
    font-size: 0.64rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.02em;
    vertical-align: middle;
}

.admin-field-use.is-filter {
    background: #eaf3ff;
    color: var(--blue);
}

.admin-product-form .admin-field input,
.admin-product-form .admin-field select {
    min-height: 48px;
}

.admin-product-form .admin-field input:focus,
.admin-product-form .admin-field select:focus,
.admin-product-form .admin-field textarea:focus {
    border-color: var(--blue);
    outline: 3px solid rgba(23, 78, 166, 0.12);
    box-shadow: none;
}

.admin-product-identity-grid {
    grid-template-columns: minmax(180px, 0.7fr) minmax(0, 1.3fr);
}

.admin-product-money-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.admin-input-prefix {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.admin-input-prefix:focus-within {
    border-color: var(--blue);
    outline: 3px solid rgba(23, 78, 166, 0.12);
}

.admin-input-prefix b {
    display: grid;
    min-width: 46px;
    place-items: center;
    border-right: 1px solid var(--line);
    background: #f1f5fb;
    color: var(--blue);
    font-size: 0.84rem;
}

.admin-product-form .admin-input-prefix input {
    min-width: 0;
    border: 0;
    border-radius: 0;
}

.admin-product-form .admin-input-prefix input:focus {
    outline: 0;
}

.admin-product-attributes {
    min-height: 210px !important;
    font-family: Consolas, "Courier New", monospace !important;
    line-height: 1.7;
}

.admin-product-attribute-suggestions {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}

.admin-product-attribute-suggestions > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.admin-product-attribute-suggestions > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.admin-product-attribute-suggestions button {
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid rgba(23, 78, 166, 0.25);
    border-radius: 7px;
    background: #fff;
    color: var(--blue);
    font: inherit;
    font-size: 0.75rem;
    font-weight: 800;
    cursor: pointer;
}

.admin-product-attribute-suggestions button:hover,
.admin-product-attribute-suggestions button:focus {
    border-color: var(--blue);
    background: #eaf3ff;
    outline: none;
}

.admin-product-live-preview {
    display: grid;
    gap: 15px;
    margin-top: 2px;
    padding: 17px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 14px;
    background: #f8fafc;
}

.admin-product-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.admin-product-preview-head > div:first-child {
    display: grid;
    gap: 3px;
}

.admin-product-preview-head > div:first-child strong { color: var(--ink); }
.admin-product-preview-head > div:first-child small { color: var(--muted); }

.admin-product-preview-tabs {
    display: inline-flex;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
}

.admin-product-preview-tabs button {
    min-height: 34px;
    padding: 0 12px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted);
    font: inherit;
    font-size: 0.76rem;
    font-weight: 800;
    cursor: pointer;
}

.admin-product-preview-tabs button.is-active {
    background: var(--blue);
    color: #fff;
}

.admin-product-preview-pane.is-active { display: grid; gap: 11px; }

.admin-live-product-card {
    display: grid;
    grid-template-columns: minmax(180px, 0.72fr) minmax(0, 1.28fr);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(24, 39, 75, 0.07);
}

.admin-live-product-media {
    position: relative;
    display: grid;
    min-height: 250px;
    place-items: center;
    overflow: hidden;
    background: #f4f7fb;
}

.admin-live-product-media img {
    width: 100%;
    height: 250px;
    object-fit: contain;
    padding: 10px;
    background: #fff;
}

.admin-live-product-media em {
    position: absolute;
    top: 11px;
    left: 11px;
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--red);
    color: #fff;
    font-size: 0.7rem;
    font-style: normal;
    font-weight: 900;
}

.admin-live-product-body {
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 17px;
}

.admin-live-product-kicker,
.admin-live-product-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
}

.admin-live-product-kicker span { color: var(--blue); font-size: 0.72rem; font-weight: 900; text-transform: uppercase; }
.admin-live-product-kicker small { color: var(--muted); font-weight: 800; }
.admin-live-product-body h3 { margin: 0; color: var(--ink); font-size: 1.08rem; }
.admin-live-product-body > p { min-height: 42px; margin: 0; color: var(--muted); font-size: 0.82rem; line-height: 1.5; }
.admin-live-product-body dl { display: grid; gap: 5px; margin: 0; }
.admin-live-product-body dl div { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--line); font-size: 0.74rem; }
.admin-live-product-body dt { color: var(--muted); }
.admin-live-product-body dd { margin: 0; color: var(--ink); font-weight: 800; }
.admin-live-product-price { justify-content: flex-start; flex-wrap: wrap; margin-top: 2px; }
.admin-live-product-price span { margin-right: auto; color: var(--green); font-size: 0.72rem; font-weight: 900; }
.admin-live-product-price strong { color: var(--ink); }
.admin-live-product-price del { color: var(--muted); font-size: 0.74rem; }
.admin-live-product-action { display: grid; min-height: 38px; place-items: center; border-radius: 9px; background: var(--blue); color: #fff; font-size: 0.78rem; font-weight: 900; }

.admin-product-preview-note {
    margin: 0;
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.admin-live-filter-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.admin-live-filter-preview > div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}

.admin-live-filter-preview span { color: var(--muted); font-size: 0.68rem; font-weight: 800; text-transform: uppercase; }
.admin-live-filter-preview strong { overflow: hidden; color: var(--ink); font-size: 0.82rem; text-overflow: ellipsis; white-space: nowrap; }

.admin-product-featured-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 14px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 12px;
    background: rgba(234, 243, 255, 0.72);
    cursor: pointer;
}

.admin-product-featured-toggle input {
    width: 19px;
    height: 19px;
    margin-top: 2px;
    accent-color: var(--blue);
}

.admin-product-featured-toggle span {
    display: grid;
    gap: 3px;
}

.admin-product-featured-toggle strong {
    color: var(--ink);
}

.admin-product-featured-toggle small {
    color: var(--muted);
    line-height: 1.4;
}

.admin-product-home-note {
    display: grid;
    gap: 3px;
    padding: 12px 14px;
    border: 1px dashed rgba(23, 78, 166, 0.35);
    border-radius: 11px;
    color: var(--blue);
    text-decoration: none;
}

.admin-product-home-note:hover,
.admin-product-home-note:focus {
    border-style: solid;
    background: rgba(234, 243, 255, 0.65);
}

.admin-product-home-note span {
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 700;
}

.admin-product-image-field {
    display: grid;
    gap: 13px;
    padding-top: 4px;
}

.admin-product-image-preview {
    position: relative;
    display: grid;
    min-height: 185px;
    place-items: center;
    overflow: hidden;
    border: 1px dashed rgba(23, 78, 166, 0.34);
    border-radius: 13px;
    background: #f8fafc;
}

.admin-product-image-preview img {
    display: block;
    width: 100%;
    height: 210px;
    object-fit: contain;
    padding: 10px;
    background: #fff;
}

.admin-product-image-preview .product-shape {
    transform: scale(0.62);
}

.admin-product-image-preview > small {
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 4px 8px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 0.7rem;
    font-weight: 800;
}

.admin-product-form-actions {
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #f8fafc;
}

.admin-product-form-actions > span {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.admin-product-form-actions > span strong {
    color: var(--red);
}

.admin-product-form-actions > div {
    display: flex;
    gap: 10px;
}

@media (max-width: 980px) {
    .admin-product-visibility-guide {
        grid-template-columns: 1fr;
    }

    .admin-product-form-layout {
        grid-template-columns: 1fr;
    }

    .admin-product-form-sidebar {
        position: static;
    }

    .admin-product-form-layout.is-preview-aside .admin-product-form-sidebar {
        order: -1;
        max-height: none;
        overflow: visible;
    }

    .admin-product-form-sidebar .admin-live-product-card {
        grid-template-columns: minmax(180px, 0.72fr) minmax(0, 1.28fr);
    }

    .admin-product-form-sidebar .admin-live-product-media {
        min-height: 220px;
    }

    .admin-product-form-sidebar .admin-live-product-media img {
        height: 220px;
    }

    .admin-product-form-sidebar .admin-live-filter-preview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-category-editor-layout { grid-template-columns: 1fr; }
    .admin-category-preview-section { position: static; }
}

@media (max-width: 650px) {
    .admin-product-editor-head,
    .admin-product-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-product-editor-head .button-ghost {
        width: 100%;
    }

    .admin-product-form-section {
        padding: 17px;
    }

    .admin-product-identity-grid,
    .admin-product-money-grid {
        grid-template-columns: 1fr;
    }

    .admin-product-form-actions > div {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-product-preview-head { align-items: stretch; flex-direction: column; }
    .admin-product-preview-tabs { display: grid; grid-template-columns: 1fr 1fr; }
    .admin-live-product-card { grid-template-columns: 1fr; }
    .admin-live-product-media { min-height: 190px; }
    .admin-live-product-media img { height: 190px; }
    .admin-live-filter-preview { grid-template-columns: 1fr; }
    .admin-product-form-sidebar .admin-live-product-card { grid-template-columns: 1fr; }
    .admin-product-form-sidebar .admin-live-product-media { min-height: 190px; }
    .admin-product-form-sidebar .admin-live-product-media img { height: 190px; }
    .admin-product-form-sidebar .admin-live-filter-preview { grid-template-columns: 1fr; }
    .admin-category-editor-head { align-items: stretch; flex-direction: column; }
    .admin-category-edit-map { padding: 10px; }
    .admin-category-edit-map-level { margin-left: 8px; padding-left: 8px; }
    .admin-category-edit-map-level li::before { left: -8px; width: 7px; }
    .admin-category-edit-map-level a { grid-template-columns: auto minmax(0, 1fr); }
    .admin-category-edit-map-level a > small { display: none; }
}

[data-theme="dark"] .admin-product-form-section,
[data-theme="dark"] .admin-input-prefix {
    background: #101a2a;
}

[data-theme="dark"] .admin-input-prefix b,
[data-theme="dark"] .admin-product-form-actions {
    background: #142238;
}

[data-theme="dark"] .admin-product-featured-toggle {
    border-color: rgba(112, 162, 255, 0.3);
    background: rgba(23, 78, 166, 0.16);
}

[data-theme="dark"] .admin-product-image-preview {
    background: #142238;
}

[data-theme="dark"] .admin-product-attribute-suggestions {
    background: #142238;
}

[data-theme="dark"] .admin-product-attribute-suggestions button {
    border-color: rgba(112, 162, 255, 0.3);
    background: #101a2a;
    color: #9fc3ff;
}

[data-theme="dark"] .admin-product-live-preview,
[data-theme="dark"] .admin-live-product-media {
    background: #142238;
}

[data-theme="dark"] .admin-product-preview-tabs,
[data-theme="dark"] .admin-live-product-card,
[data-theme="dark"] .admin-live-filter-preview > div {
    background: #101a2a;
}

[data-theme="dark"] .admin-product-visibility-guide article {
    border-color: rgba(112, 162, 255, 0.24);
    background: linear-gradient(145deg, rgba(23, 78, 166, 0.18), rgba(16, 26, 42, 0.72));
}

[data-theme="dark"] .admin-live-category-path,
[data-theme="dark"] .admin-live-category-filter,
[data-theme="dark"] .admin-live-category-description {
    background: #142238;
}

[data-theme="dark"] .admin-category-concept-map,
[data-theme="dark"] .admin-category-map-node,
[data-theme="dark"] .admin-category-filter-select {
    background: #101a2a;
}

[data-theme="dark"] .admin-category-edit-map,
[data-theme="dark"] .admin-category-edit-map-level a {
    background: #101a2a;
}

[data-theme="dark"] .admin-category-level-legend span {
    background: #142238;
}

[data-theme="dark"] .admin-category-edit-map-level li.level-1 { --level-color: #60a5fa; --level-soft: rgba(37, 99, 235, 0.18); }
[data-theme="dark"] .admin-category-edit-map-level li.level-2 { --level-color: #a78bfa; --level-soft: rgba(124, 58, 237, 0.18); }
[data-theme="dark"] .admin-category-edit-map-level li.level-3 { --level-color: #5eead4; --level-soft: rgba(15, 143, 131, 0.18); }
[data-theme="dark"] .admin-category-edit-map-level li.level-4 { --level-color: #fbbf24; --level-soft: rgba(217, 119, 6, 0.18); }

[data-theme="dark"] .admin-category-edit-map-level li.is-current-path > a {
    background: var(--level-soft);
}

[data-theme="dark"] .admin-category-edit-map-level li.is-current > a {
    background: #142238;
}

[data-theme="dark"] .admin-category-map-node.is-parent {
    background: rgba(23, 78, 166, 0.2);
}

[data-theme="dark"] .admin-category-you-are-here {
    background: rgba(245, 158, 11, 0.18);
    color: #fcd34d;
}

[data-theme="dark"] .admin-field-use {
    background: rgba(34, 197, 94, 0.16);
    color: #86efac;
}

[data-theme="dark"] .admin-field-use.is-filter {
    background: rgba(59, 130, 246, 0.18);
    color: #93c5fd;
}

@media (max-width: 1050px) {
    .admin-catalog-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-catalog-filter-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 780px) {
    .admin-products-table {
        min-width: 0;
    }

    .admin-products-table thead {
        display: none;
    }

    .admin-products-table tbody {
        display: grid;
        gap: 12px;
        padding: 10px;
    }

    .admin-products-table tbody tr,
    .admin-products-table tbody tr:nth-child(even) {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: var(--surface);
        box-shadow: 0 7px 16px rgba(24, 39, 75, 0.06);
    }

    .admin-products-table tbody tr:hover {
        background: var(--surface);
    }

    .admin-products-table td,
    .admin-products-table td:last-child,
    .admin-products-table tr:last-child td {
        display: grid;
        align-content: start;
        gap: 6px;
        min-width: 0;
        padding: 11px 12px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .admin-products-table td::before {
        color: var(--muted);
        content: attr(data-label);
        font-size: 0.66rem;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .admin-products-table td:first-child,
    .admin-products-table td:nth-child(3),
    .admin-products-table td:last-child {
        grid-column: 1 / -1;
    }

    .admin-products-table td:first-child {
        background: rgba(234, 243, 255, 0.42);
    }

    .admin-products-table td:last-child {
        border-bottom: 0;
    }

    .admin-product-table-cell {
        min-width: 0;
    }

    .admin-products-table .admin-table-actions > * {
        flex: 1;
    }

    .admin-products-table .admin-table-actions .button-small {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .admin-catalog-filters {
        grid-template-columns: 1fr;
    }

    .admin-catalog-filter-actions {
        grid-column: auto;
    }

    .admin-catalog-filter-actions > * {
        flex: 1;
    }

    .admin-product-toolbar-actions {
        width: 100%;
    }

    .admin-product-toolbar-actions > * {
        flex: 1;
        justify-content: center;
    }

    .admin-catalog-category-row {
        grid-template-columns: minmax(42px, auto) minmax(0, 1fr);
    }

    .admin-catalog-category-actions {
        grid-column: 2;
        justify-content: flex-start;
    }

    .admin-catalog-category-tree.is-nested {
        margin-left: 12px;
    }

    .admin-products-table tbody tr {
        grid-template-columns: 1fr;
    }

    .admin-products-table td,
    .admin-products-table td:first-child,
    .admin-products-table td:nth-child(3),
    .admin-products-table td:last-child {
        grid-column: 1;
    }
}

.admin-user-row {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-user-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.admin-user-summary strong,
.admin-user-summary span {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.admin-user-summary span,
.admin-user-meta {
    color: var(--muted);
}

.admin-user-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 10px;
    border: 1px solid rgba(23, 78, 166, 0.24);
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.admin-user-status.is-active {
    border-color: #bce7d1;
    background: #eaf8f1;
    color: var(--green);
}

.admin-user-status.is-inactive {
    border-color: #ffc9c4;
    background: #fff1f0;
    color: var(--red);
}

.admin-user-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    font-size: 13px;
    font-weight: 700;
}

.admin-user-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.admin-users-toolbar,
.admin-form-head-actions,
.admin-table-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.admin-users-toolbar {
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.admin-users-toolbar h2,
.admin-users-toolbar small {
    margin: 0;
}

.admin-users-group {
    margin-top: 20px;
}

.admin-users-info {
    max-width: 780px;
    margin-top: 18px;
}

.admin-users-info > button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 15px;
    border: 1px solid rgba(23, 78, 166, .28);
    border-radius: var(--radius);
    background: #eef4ff;
    color: var(--blue);
    font-weight: 800;
    text-align: left;
    cursor: pointer;
}

.admin-users-info > button > span {
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 999px;
    background: var(--blue);
    color: #fff;
    font-family: Georgia, serif;
    font-weight: 900;
}

.admin-users-info > button > i {
    width: 8px;
    height: 8px;
    margin-left: 3px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform 180ms ease;
}

.admin-users-info > button[aria-expanded="true"] > i {
    transform: translateY(2px) rotate(225deg);
}

.admin-users-info-content {
    margin-top: 8px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 8px 20px rgba(24, 39, 75, .08);
}

.admin-users-info-content[hidden] {
    display: none;
}

.admin-users-info-content p {
    margin: 6px 0 0;
    color: var(--muted);
    line-height: 1.55;
}

.admin-users-group[hidden] {
    display: none;
}

.admin-users-tabs {
    display: flex;
    gap: 8px;
    margin-top: 28px;
    padding: 5px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-2);
}

.admin-users-tabs button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: calc(var(--radius) - 2px);
    background: transparent;
    color: var(--muted);
    font-weight: 800;
    cursor: pointer;
}

.admin-users-tabs button span {
    display: inline-grid;
    place-items: center;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    background: var(--surface);
    font-size: .75rem;
}

.admin-users-tabs button:hover,
.admin-users-tabs button:focus-visible {
    color: var(--blue);
    outline: none;
}

.admin-users-tabs button.is-active {
    background: var(--blue);
    color: #fff;
    box-shadow: 0 6px 16px rgba(23, 78, 166, .2);
}

.admin-users-tabs button.is-active span {
    color: var(--blue);
}

@media (max-width: 560px) {
    .admin-users-tabs button {
        flex: 1;
        padding: 0 10px;
    }

    .admin-users-group-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
}

.admin-users-group-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 12px;
}

.admin-users-group-heading h3,
.admin-users-group-heading p {
    margin: 0;
}

.admin-users-group-heading h3 {
    font-size: 1.15rem;
}

.admin-users-group-heading p,
.admin-users-group-heading > span {
    color: var(--muted);
    font-size: .88rem;
}

.admin-users-empty {
    padding: 28px !important;
    color: var(--muted);
    text-align: center !important;
}

.admin-table-scroll {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.admin-users-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
}

.admin-users-table th,
.admin-users-table td {
    padding: 14px 12px;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
    text-align: left;
    vertical-align: middle;
}

.admin-users-table th:last-child,
.admin-users-table td:last-child {
    border-right: 0;
}

.admin-users-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f1f5fb;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: inset 0 -1px 0 var(--line);
}

.admin-users-table th:first-child {
    border-top-left-radius: calc(var(--radius) - 1px);
}

.admin-users-table th:last-child {
    border-top-right-radius: calc(var(--radius) - 1px);
}

.admin-users-table tbody tr {
    background: #fff;
    animation: adminTableRowIn 360ms ease both;
    transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.admin-users-table tbody tr:nth-child(even) {
    background: #f8fafc;
}

.admin-users-table tbody tr:hover {
    position: relative;
    z-index: 2;
    background: #eef6ff;
    box-shadow: 0 10px 24px rgba(23, 78, 166, 0.12);
    transform: translateY(-1px);
}

.admin-users-table tbody tr:nth-child(1) {
    animation-delay: 20ms;
}

.admin-users-table tbody tr:nth-child(2) {
    animation-delay: 60ms;
}

.admin-users-table tbody tr:nth-child(3) {
    animation-delay: 100ms;
}

.admin-users-table tbody tr:nth-child(4) {
    animation-delay: 140ms;
}

.admin-users-table tbody tr:nth-child(5) {
    animation-delay: 180ms;
}

.admin-users-table tbody tr:nth-child(n + 6) {
    animation-delay: 220ms;
}

.admin-users-table tr:last-child td {
    border-bottom: 0;
}

.admin-user-cell,
.admin-user-badges {
    display: grid;
    gap: 5px;
    justify-content: start;
    min-width: 0;
}

.admin-user-cell strong,
.admin-user-cell span,
.admin-user-cell small,
.admin-user-badges span,
.admin-user-badges small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.admin-user-cell small,
.admin-user-badges small,
.admin-action-note {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.admin-user-role {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(23, 78, 166, 0.24);
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
}

.admin-quote-recipient {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    min-width: 150px;
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    color: var(--ink);
    text-align: left;
}

button.admin-quote-recipient {
    cursor: pointer;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

button.admin-quote-recipient:hover,
button.admin-quote-recipient:focus {
    border-color: var(--blue);
    background: #eef6ff;
    outline: none;
    transform: translateY(-1px);
}

.admin-recipient-radio {
    position: relative;
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    border: 2px solid #a7b2c2;
    border-radius: 50%;
    background: var(--surface);
}

.admin-quote-recipient strong,
.admin-quote-recipient small { display: block; }
.admin-quote-recipient small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.admin-quote-recipient.is-selected { border-color: rgba(22, 128, 92, .35); background: rgba(22, 128, 92, .09); color: var(--green); }
.admin-quote-recipient.is-selected .admin-recipient-radio { border-color: var(--green); }
.admin-quote-recipient.is-selected .admin-recipient-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--green); }
.admin-quote-recipient.is-disabled { opacity: .6; background: var(--surface-2); }

@keyframes adminTableRowIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.admin-table-actions {
    align-items: center;
    flex-wrap: wrap;
    min-width: 0;
}

.admin-inline-form {
    display: inline-flex;
}

.button-small {
    min-height: 34px;
    padding: 0 11px;
    border-radius: calc(var(--radius) - 2px);
    font-size: 13px;
}

.admin-user-editor {
    scroll-margin-top: 110px;
}

.admin-user-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 24px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, visibility 180ms ease;
}

.admin-user-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.admin-user-modal-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(15, 23, 42, 0.58);
    backdrop-filter: blur(6px);
    cursor: pointer;
}

.admin-user-modal-panel {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    width: min(100%, 1040px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.5);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.34);
    transform: translateY(16px) scale(0.98);
    transition: transform 220ms ease, opacity 220ms ease;
}

.admin-user-modal.is-open .admin-user-modal-panel {
    transform: translateY(0) scale(1);
}

.admin-user-modal-head,
.admin-user-modal-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 20px;
    background: var(--surface);
}

.admin-user-modal-head {
    border-bottom: 1px solid var(--line);
}

.admin-user-modal-head h2 {
    margin: 0;
}

.admin-user-modal-close {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f8fafc;
    color: var(--ink);
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.admin-user-modal-close:hover,
.admin-user-modal-close:focus {
    border-color: rgba(23, 78, 166, 0.38);
    color: var(--blue);
    outline: none;
}

.admin-user-modal-body {
    display: grid;
    gap: 16px;
    min-height: 0;
    overflow: auto;
    padding: 20px;
}

.admin-user-modal-actions {
    border-top: 1px solid var(--line);
}

.admin-check-field-card {
    align-self: end;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}

.nav-page-link {
    --nav-glow-surface: var(--surface);
    --nav-glow-text: var(--ink);
    position: relative;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    color: var(--nav-glow-text);
    font-size: 14px;
    font-weight: 800;
    overflow: visible;
    transition: color 180ms ease, transform 180ms ease;
}

.nav-page-link:hover,
.nav-page-link:focus,
.nav-page-link.is-current {
    --nav-glow-surface: var(--blue);
    --nav-glow-text: #fff;
    color: var(--nav-glow-text);
    outline: none;
    transform: translateY(-2px);
}

.nav-page-link:hover::before,
.nav-page-link:focus::before,
.nav-page-link.is-current::before {
    opacity: 1;
}

.info-hero {
    background: #0f274a;
    color: #fff;
}

.info-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: center;
    gap: 30px;
    min-height: 310px;
    padding: 42px 0;
}

.info-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1.05;
    letter-spacing: 0;
}

.info-hero p {
    max-width: 720px;
    color: #d9e6f5;
    line-height: 1.6;
}

.info-hero .eyebrow {
    color: #ffd166;
}

.info-hero-card {
    display: grid;
    gap: 10px;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.08);
}

.info-hero-card strong {
    font-size: 22px;
}

.info-hero-card span {
    color: #d9e6f5;
    line-height: 1.45;
}

.about-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(6, 18, 38, 0.98), rgba(15, 39, 74, 0.92) 56%, rgba(23, 78, 166, 0.94)),
        #0f274a;
}

.about-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 6px;
    background: linear-gradient(90deg, var(--blue), #ffd166, var(--green), var(--red));
}

.about-hero .info-hero-inner {
    position: relative;
    z-index: 1;
    grid-template-columns: minmax(0, 0.94fr) minmax(420px, 0.86fr);
    min-height: 520px;
    padding: 58px 0 64px;
}

.about-hero-copy {
    display: grid;
    gap: 18px;
    max-width: 760px;
}

.about-hero-copy h1 {
    max-width: 680px;
    font-size: clamp(44px, 6vw, 82px);
}

.about-hero-copy p {
    max-width: 650px;
    margin: 0;
    font-size: 18px;
}

.about-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.about-hero-actions .button-ghost {
    --action-glow-surface: rgba(255, 255, 255, 0.12);
    --action-glow-hover: rgba(255, 255, 255, 0.2);
    --action-glow-text: #fff;
    border-color: rgba(255, 255, 255, 0.45);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.about-hero-visual {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 170px;
    grid-template-rows: 190px 190px;
    gap: 14px;
    min-height: 420px;
}

.about-hero-photo {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 24px 52px rgba(0, 0, 0, 0.28);
}

.about-hero-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-hero-photo-main {
    grid-row: 1 / 3;
    min-height: 394px;
}

.about-hero-photo-small,
.about-hero-photo-tall {
    min-height: 0;
}

.about-hero-badge {
    position: absolute;
    right: 22px;
    bottom: 22px;
    display: grid;
    gap: 8px;
    width: min(360px, calc(100% - 44px));
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.26);
    border-radius: var(--radius);
    background: rgba(6, 18, 38, 0.86);
    color: #fff;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
}

.about-hero-badge strong {
    font-size: 20px;
}

.about-hero-badge span {
    color: #d9e6f5;
    line-height: 1.45;
}

.about-metrics {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: -36px;
}

.about-metrics article {
    display: grid;
    gap: 6px;
    min-height: 118px;
    padding: 20px;
    border: 1px solid var(--line);
    border-top: 4px solid var(--blue);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 18px 34px rgba(24, 39, 75, 0.12);
}

.about-metrics article:nth-child(2) {
    border-top-color: #ffd166;
}

.about-metrics article:nth-child(3) {
    border-top-color: var(--green);
}

.about-metrics strong {
    font-size: 21px;
}

.about-metrics span {
    color: var(--muted);
    line-height: 1.45;
}

.about-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    padding: 34px 0;
}

.about-intro {
    padding-top: 42px;
}

.about-copy,
.about-proof-panel,
.about-contact-panel,
.pillar-grid article,
.value-grid div,
.values-band,
.cta-band,
.contact-card,
.contact-actions-band,
.map-section {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.about-copy {
    position: relative;
    overflow: hidden;
    padding: 34px;
    box-shadow: 0 16px 34px rgba(24, 39, 75, 0.08);
}

.about-copy::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 7px;
    height: 100%;
    background: linear-gradient(180deg, var(--blue), #ffd166, var(--green));
}

.about-proof-panel {
    display: grid;
    gap: 14px;
    padding: 24px;
    align-content: start;
    background: #07172d;
    color: #fff;
    border-color: rgba(23, 78, 166, 0.22);
    box-shadow: 0 18px 34px rgba(24, 39, 75, 0.14);
}

.about-proof-panel .eyebrow {
    color: #ffd166;
}

.about-proof-panel > div {
    position: relative;
    display: grid;
    gap: 6px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.08);
}

.about-proof-panel > div::before {
    content: "";
    width: 34px;
    height: 4px;
    border-radius: 999px;
    background: #ffd166;
}

.about-proof-panel strong {
    font-size: 18px;
}

.about-proof-panel small {
    color: #d9e6f5;
    line-height: 1.45;
}

.about-copy h2,
.cta-band h2,
.contact-actions-band h2,
.map-copy h2 {
    margin: 0;
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.12;
    letter-spacing: 0;
}

.about-copy p,
.pillar-grid p,
.value-grid span,
.map-copy p,
.contact-card li,
.contact-actions-band h2 {
    color: var(--muted);
    line-height: 1.55;
}

.about-contact-panel {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 24px;
}

.about-contact-panel span,
.contact-card span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.about-contact-panel strong {
    line-height: 1.45;
}

.about-contact-panel small {
    color: var(--muted);
    line-height: 1.45;
}

.about-contact-panel a,
.contact-card a,
.map-copy a {
    color: var(--blue);
    font-weight: 800;
}

.mission-vision-section {
    margin: 18px 0 18px;
    padding: 54px 0;
    background:
        linear-gradient(135deg, #f4f7fb 0%, #fff 48%, #eaf3ff 100%);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.mission-vision-head {
    display: grid;
    gap: 8px;
    max-width: 760px;
    margin-bottom: 24px;
}

.mission-vision-head h2 {
    margin: 0;
    font-size: clamp(30px, 3.6vw, 48px);
    line-height: 1.08;
}

.mission-vision-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.mission-vision-card {
    position: relative;
    display: block;
    min-height: 320px;
    overflow: hidden;
    padding: 0;
    border-radius: var(--radius);
    color: #fff;
    background: #0f274a;
    box-shadow: 0 24px 52px rgba(24, 39, 75, 0.2);
    cursor: pointer;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.mission-vision-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.14), transparent 42%);
    pointer-events: none;
}

.mission-vision-card:hover,
.mission-vision-card:focus-within,
.mission-vision-card[open] {
    box-shadow: 0 30px 62px rgba(24, 39, 75, 0.28);
    transform: translateY(-3px);
}

.mission-vision-card::after {
    content: "";
    position: absolute;
    right: -38px;
    bottom: 34px;
    width: 210px;
    height: 34px;
    background: rgba(255, 255, 255, 0.09);
    transform: rotate(-28deg);
}

.mission-vision-card summary {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: end;
    min-height: 320px;
    padding: 30px;
    list-style: none;
    outline: none;
}

.mission-vision-card summary::-webkit-details-marker {
    display: none;
}

.mission-vision-card summary::before {
    content: "";
    width: 74px;
    height: 5px;
    margin-bottom: 16px;
    border-radius: 999px;
    background: #ffd166;
}

.mission-vision-card summary::after {
    content: "";
    position: absolute;
    right: 28px;
    top: 28px;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    background:
        linear-gradient(currentColor, currentColor) center / 16px 2px no-repeat,
        linear-gradient(currentColor, currentColor) center / 2px 16px no-repeat;
    color: #fff;
    opacity: 0.78;
    transition: transform 180ms ease, background-color 180ms ease;
}

.mission-vision-card:hover summary::after,
.mission-vision-card:focus-within summary::after,
.mission-vision-card[open] summary::after {
    background:
        linear-gradient(currentColor, currentColor) center / 16px 2px no-repeat,
        rgba(255, 255, 255, 0.16);
    transform: rotate(180deg);
}

.mission-vision-card summary strong {
    color: #ffd166;
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 900;
    line-height: 0.95;
    text-transform: uppercase;
}

.mission-vision-reveal {
    position: relative;
    z-index: 2;
    display: grid;
    align-content: end;
    gap: 12px;
    position: absolute;
    inset: 0;
    padding: 30px;
    background:
        linear-gradient(180deg, rgba(6, 18, 38, 0.72), rgba(6, 18, 38, 0.96)),
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), transparent 48%);
    opacity: 0;
    pointer-events: none;
    transform: translateY(18px);
    transition: opacity 220ms ease, transform 220ms ease;
}

.mission-vision-card:hover .mission-vision-reveal,
.mission-vision-card:focus-within .mission-vision-reveal,
.mission-vision-card[open] .mission-vision-reveal {
    opacity: 1;
    transform: translateY(0);
}

.mission-vision-card h3 {
    margin: 0;
    font-size: clamp(27px, 3vw, 40px);
    line-height: 1.08;
}

.mission-vision-card p {
    max-width: 560px;
    margin: 0;
    color: #d9e6f5;
    font-size: 17px;
    line-height: 1.6;
}

.mission-card {
    background: linear-gradient(135deg, #0a1830, #174ea6);
}

.vision-card {
    background: linear-gradient(135deg, #102030, #1b6b5c);
}

.field-work-section {
    padding: 28px 0 30px;
}

.field-work-section .section-title {
    align-items: flex-end;
    margin-bottom: 16px;
}

.field-work-section .section-title > div {
    display: grid;
    gap: 7px;
    max-width: 760px;
}

.field-work-section .section-title p {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.field-work-carousel {
    position: relative;
}

.field-work-viewport {
    overflow: hidden;
}

.field-work-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 36px) / 3);
    gap: 18px;
    overflow-x: auto;
    padding: 2px 0 22px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.field-work-track::-webkit-scrollbar {
    display: none;
}

.field-work-carousel.is-static .field-work-track {
    overflow: visible;
    padding-bottom: 0;
}

.field-work-card {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 14px 28px rgba(24, 39, 75, 0.09);
    scroll-snap-align: start;
}

.field-work-card img {
    display: block;
    width: 100%;
    height: clamp(230px, 24vw, 340px);
    object-fit: cover;
    background: #eef2f5;
}

.field-work-card figcaption {
    display: grid;
    gap: 8px;
    padding: 18px;
}

.field-work-card figcaption span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.field-work-card figcaption strong {
    font-size: 19px;
    line-height: 1.2;
}

.field-work-card figcaption small {
    color: var(--muted);
    line-height: 1.45;
}

.field-work-control {
    position: absolute;
    top: 42%;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.field-work-control:hover,
.field-work-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.field-work-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.field-work-prev {
    left: -10px;
}

.field-work-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.field-work-next {
    right: -10px;
}

.field-work-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.field-work-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 4px;
}

.field-work-carousel.is-static .field-work-dots {
    display: none;
}

.field-work-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.field-work-dots button.is-active,
.field-work-dots button:hover,
.field-work-dots button:focus {
    width: 42px;
    background: var(--blue);
    outline: none;
}

.hero-dots button,
.brand-carousel-dots button,
.industry-dots button,
.product-carousel-dots button,
.blog-carousel-dots button,
.field-work-dots button,
.value-carousel-dots button,
.values-carousel-dots button,
.contact-carousel-dots button {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.hero-dots button {
    --carousel-progress-track: rgba(255, 255, 255, 0.42);
    --carousel-progress-fill: #ffd166;
}

.brand-carousel-dots button,
.industry-dots button,
.product-carousel-dots button,
.blog-carousel-dots button,
.field-work-dots button,
.value-carousel-dots button,
.values-carousel-dots button,
.contact-carousel-dots button {
    --carousel-progress-track: #cfd8e3;
    --carousel-progress-fill: var(--blue);
}

.hero-dots button::after,
.brand-carousel-dots button::after,
.industry-dots button::after,
.product-carousel-dots button::after,
.blog-carousel-dots button::after,
.field-work-dots button::after,
.value-carousel-dots button::after,
.values-carousel-dots button::after,
.contact-carousel-dots button::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--carousel-progress-fill);
    transform: scaleX(0);
    transform-origin: left center;
    pointer-events: none;
}

.hero-dots button.is-active,
.hero-dots button:hover,
.hero-dots button:focus,
.brand-carousel-dots button.is-active,
.brand-carousel-dots button:hover,
.brand-carousel-dots button:focus,
.industry-dots button.is-active,
.industry-dots button:hover,
.industry-dots button:focus,
.product-carousel-dots button.is-active,
.product-carousel-dots button:hover,
.product-carousel-dots button:focus,
.blog-carousel-dots button.is-active,
.blog-carousel-dots button:hover,
.blog-carousel-dots button:focus,
.field-work-dots button.is-active,
.field-work-dots button:hover,
.field-work-dots button:focus,
.value-carousel-dots button.is-active,
.value-carousel-dots button:hover,
.value-carousel-dots button:focus,
.values-carousel-dots button.is-active,
.values-carousel-dots button:hover,
.values-carousel-dots button:focus,
.contact-carousel-dots button.is-active,
.contact-carousel-dots button:hover,
.contact-carousel-dots button:focus {
    background: var(--carousel-progress-track);
}

.hero-dots button.is-progressing::after,
.brand-carousel-dots button.is-progressing::after,
.industry-dots button.is-progressing::after,
.product-carousel-dots button.is-progressing::after,
.blog-carousel-dots button.is-progressing::after,
.field-work-dots button.is-progressing::after,
.value-carousel-dots button.is-progressing::after,
.values-carousel-dots button.is-progressing::after,
.contact-carousel-dots button.is-progressing::after {
    animation: carouselProgress var(--carousel-progress-duration, 6200ms) linear forwards;
}

.hero-dots button:hover::after,
.hero-dots button:focus::after,
.brand-carousel-dots button:hover::after,
.brand-carousel-dots button:focus::after,
.industry-dots button:hover::after,
.industry-dots button:focus::after,
.product-carousel-dots button:hover::after,
.product-carousel-dots button:focus::after,
.blog-carousel-dots button:hover::after,
.blog-carousel-dots button:focus::after,
.field-work-dots button:hover::after,
.field-work-dots button:focus::after,
.value-carousel-dots button:hover::after,
.value-carousel-dots button:focus::after,
.values-carousel-dots button:hover::after,
.values-carousel-dots button:focus::after,
.contact-carousel-dots button:hover::after,
.contact-carousel-dots button:focus::after {
    animation: none;
    transform: scaleX(1);
}

.hero-slider.is-paused button.is-progressing::after,
.brand-carousel.is-paused button.is-progressing::after,
.industry-carousel.is-paused button.is-progressing::after,
.product-carousel.is-paused button.is-progressing::after,
.blog-carousel.is-paused button.is-progressing::after,
.field-work-carousel.is-paused button.is-progressing::after,
.value-carousel.is-paused button.is-progressing::after,
.values-carousel.is-paused button.is-progressing::after,
.contact-carousel.is-paused button.is-progressing::after {
    animation-play-state: paused;
}

@keyframes carouselProgress {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

.pillar-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding-bottom: 30px;
}

.pillar-grid article {
    padding: 24px;
}

.pillar-grid article > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: var(--radius);
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 800;
}

.pillar-grid h2,
.contact-card h2 {
    margin: 14px 0 8px;
}

.value-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.value-grid div {
    position: relative;
    display: grid;
    gap: 8px;
    overflow: hidden;
    min-height: 124px;
    padding: 20px;
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.07);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.value-grid div::before {
    content: "";
    width: 42px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--blue), #ffd166);
}

.value-grid div:hover {
    border-color: rgba(23, 78, 166, 0.26);
    box-shadow: 0 18px 34px rgba(24, 39, 75, 0.12);
    transform: translateY(-2px);
}

.value-grid strong {
    font-size: 18px;
    line-height: 1.2;
}

.value-carousel {
    position: relative;
}

.value-viewport {
    overflow: hidden;
}

.value-grid.value-track {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 14px) / 2);
    gap: 14px;
    overflow-x: auto;
    padding: 2px 0 54px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.value-track::-webkit-scrollbar {
    display: none;
}

.value-carousel.is-static .value-track {
    overflow: visible;
    padding-bottom: 0;
}

.value-track > div {
    min-width: 0;
    scroll-snap-align: start;
}

.value-carousel-control {
    position: absolute;
    bottom: 0;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: none;
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.value-carousel-control:hover,
.value-carousel-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: scale(1.04);
}

.value-carousel-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.value-carousel-prev {
    left: calc(50% - 112px);
}

.value-carousel-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.value-carousel-next {
    right: calc(50% - 112px);
}

.value-carousel-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.value-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: -42px;
    padding: 0 58px 4px;
}

.value-carousel.is-static .value-carousel-dots {
    display: none;
}

.value-carousel-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.value-carousel-dots button.is-active,
.value-carousel-dots button:hover,
.value-carousel-dots button:focus {
    width: 42px;
    background: var(--carousel-progress-track);
    outline: none;
}

.values-band,
.cta-band,
.contact-actions-band {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 12px auto 34px;
    padding: 24px;
}

.values-band > div:last-child {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.values-band span:not(.eyebrow) {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 800;
}

.values-showcase {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 20px;
    margin: 12px auto 34px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #07172d;
    color: #fff;
    overflow: hidden;
}

.values-showcase header {
    display: grid;
    align-content: start;
    gap: 10px;
}

.values-showcase .eyebrow {
    color: #ffd166;
}

.values-showcase h2 {
    margin: 0;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.1;
}

.values-showcase p {
    margin: 0;
    color: #d9e6f5;
    line-height: 1.55;
}

.values-showcase-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.values-carousel {
    position: relative;
    min-width: 0;
}

.values-viewport {
    overflow: hidden;
}

.values-showcase-grid.values-track {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 12px) / 2);
    overflow-x: auto;
    padding: 2px 0 54px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.values-track::-webkit-scrollbar {
    display: none;
}

.values-carousel.is-static .values-track {
    overflow: visible;
    padding-bottom: 0;
}

.values-showcase-grid article {
    display: grid;
    align-content: start;
    gap: 8px;
    min-height: 138px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.08);
    scroll-snap-align: start;
}

.values-showcase-grid:not(.values-track) article:first-child {
    grid-row: span 2;
    background: rgba(255, 209, 102, 0.13);
}

.values-track article:first-child {
    background: rgba(255, 209, 102, 0.13);
}

.values-showcase-grid span {
    font-size: 19px;
    font-weight: 900;
}

.values-showcase-grid small {
    color: #d9e6f5;
    line-height: 1.45;
}

.values-carousel-control {
    position: absolute;
    bottom: 0;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transform: none;
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.values-carousel-control:hover,
.values-carousel-control:focus {
    background: #ffd166;
    color: #111827;
    outline: none;
    transform: scale(1.04);
}

.values-carousel-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.values-carousel-prev {
    left: calc(50% - 112px);
}

.values-carousel-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.values-carousel-next {
    right: calc(50% - 112px);
}

.values-carousel-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.values-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: -42px;
    padding: 0 58px 4px;
}

.values-carousel.is-static .values-carousel-dots {
    display: none;
}

.values-carousel-dots button {
    --carousel-progress-track: rgba(255, 255, 255, 0.34);
    --carousel-progress-fill: #ffd166;
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.34);
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.values-carousel-dots button.is-active,
.values-carousel-dots button:hover,
.values-carousel-dots button:focus {
    width: 42px;
    background: rgba(255, 255, 255, 0.34);
    outline: none;
}

.cta-band > div:last-child,
.contact-actions-band > div:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.contact-section {
    padding: 34px 0;
}

.contact-carousel {
    position: relative;
}

.contact-track {
    display: grid;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns:calc((100% - 18px) / 2);
    gap: 18px;
    overflow-x: auto;
    padding: 2px 0 22px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.contact-track::-webkit-scrollbar {
    display: none;
}

.contact-carousel.is-static .contact-track {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    overflow: visible;
    padding-bottom: 0;
}

.contact-carousel-item {
    min-width: 0;
    scroll-snap-align: start;
}

.contact-carousel-item .contact-card {
    height: 100%;
}

.contact-carousel-control {
    position: absolute;
    top: 45%;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 78, 166, 0.22);
    border-radius: 999px;
    background: #fff;
    color: var(--blue);
    box-shadow: 0 12px 24px rgba(24, 39, 75, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.contact-carousel-control:hover,
.contact-carousel-control:focus {
    background: var(--blue);
    color: #fff;
    outline: none;
    transform: translateY(-50%) scale(1.04);
}

.contact-carousel-control::before {
    content: "";
    position: absolute;
    top: 14px;
    width: 12px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
}

.contact-carousel-prev {
    left: -10px;
}

.contact-carousel-prev::before {
    left: 16px;
    transform: rotate(-45deg);
}

.contact-carousel-next {
    right: -10px;
}

.contact-carousel-next::before {
    right: 16px;
    transform: rotate(135deg);
}

.contact-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 4px;
}

.contact-carousel.is-static .contact-carousel-dots {
    display: none;
}

.contact-carousel-dots button {
    width: 28px;
    height: 5px;
    border: 0;
    border-radius: 999px;
    background: #cfd8e3;
    cursor: pointer;
    transition: background-color 160ms ease, width 160ms ease;
}

.contact-carousel-dots button.is-active,
.contact-carousel-dots button:hover,
.contact-carousel-dots button:focus {
    width: 42px;
    background: var(--blue);
    outline: none;
}

.contact-actions-band {
    margin-bottom: 24px;
}

.map-section {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 20px;
    margin-bottom: 24px;
    padding: 18px;
}

.map-copy {
    align-self: center;
    padding: 12px;
}

.map-frame {
    min-height: 320px;
    overflow: hidden;
    border-radius: var(--radius);
    background: #eef2f5;
}

.map-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 320px;
    border: 0;
}

.contact-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(115deg, rgba(7, 23, 45, 0.98), rgba(16, 50, 91, 0.94) 52%, rgba(22, 128, 92, 0.86)),
        #0f274a;
}

.contact-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: 44px 44px;
    opacity: 0.28;
    animation: contactGridDrift 18s linear infinite;
}

.contact-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 6px;
    background: linear-gradient(90deg, var(--blue), #ffd166, var(--green), var(--red));
}

.contact-hero-inner {
    position: relative;
    z-index: 1;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.42fr);
    min-height: 430px;
    padding: 62px 0;
}

.contact-hero-copy {
    display: grid;
    gap: 18px;
    max-width: 780px;
    animation: contactFadeUp 680ms ease both;
}

.contact-hero-copy p {
    margin: 0;
    font-size: 18px;
}

.contact-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.contact-hero-actions .button-ghost {
    --action-glow-surface: rgba(255, 255, 255, 0.12);
    --action-glow-hover: rgba(255, 255, 255, 0.2);
    --action-glow-text: #fff;
    border-color: rgba(255, 255, 255, 0.42);
    color: #fff;
}

.contact-hero-panel {
    position: relative;
    display: grid;
    gap: 18px;
    align-content: center;
    min-height: 270px;
    padding: 26px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.24);
    animation: contactFadeUp 680ms ease 140ms both;
}

.contact-hero-panel::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, #ffd166, var(--green), var(--blue));
}

.contact-hero-panel > div:not(.contact-signal) {
    display: grid;
    gap: 8px;
}

.contact-hero-panel strong {
    font-size: 24px;
}

.contact-hero-panel span {
    color: #d9e6f5;
    line-height: 1.5;
}

.contact-hero-panel a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 16px;
    border-radius: var(--radius);
    background: #ffd166;
    color: #1d2733;
    font-weight: 900;
}

.contact-signal {
    position: relative;
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
}

.contact-signal::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ffd166;
    box-shadow: 0 0 0 8px rgba(255, 209, 102, 0.14);
}

.contact-signal span {
    position: absolute;
    inset: 10px;
    border: 1px solid rgba(255, 209, 102, 0.64);
    border-radius: 50%;
    animation: contactSignal 2200ms ease-out infinite;
}

.contact-signal span:nth-child(2) {
    animation-delay: 520ms;
}

.contact-signal span:nth-child(3) {
    animation-delay: 1040ms;
}

.contact-card {
    position: relative;
    display: block;
    min-height: 320px;
    overflow: hidden;
    padding: 0;
    color: #fff;
    background: #0f274a;
    box-shadow: 0 24px 52px rgba(24, 39, 75, 0.2);
    cursor: pointer;
    animation: contactFadeUp 620ms ease var(--delay, 0ms) both;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.contact-static-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.contact-static-grid.has-odd-count .contact-static-item:first-child { grid-column:1 / -1; width:min(100%,760px); justify-self:center; }
.contact-static-item { min-width:0; }
.contact-static-item .contact-card { width:100%; height:100%; }
@media (max-width:760px) { .contact-static-grid { grid-template-columns:1fr; } .contact-static-grid.has-odd-count .contact-static-item:first-child { grid-column:auto; width:100%; } }

.contact-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.15), transparent 42%),
        linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: auto, 38px 38px, 38px 38px;
    pointer-events: none;
}

.contact-card::after {
    content: "";
    position: absolute;
    right: -42px;
    bottom: 34px;
    width: 220px;
    height: 34px;
    background: rgba(255, 255, 255, 0.09);
    transform: rotate(-28deg);
}

.contact-card:hover,
.contact-card[open] {
    box-shadow: 0 30px 62px rgba(24, 39, 75, 0.28);
    transform: translateY(-3px);
}

.contact-channel-card summary {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: end;
    gap: 10px;
    min-height: 320px;
    padding: 30px;
    list-style: none;
    outline: none;
}

.contact-channel-card summary::-webkit-details-marker {
    display: none;
}

.contact-channel-card summary::before {
    content: "";
    width: 74px;
    height: 5px;
    margin-bottom: 6px;
    border-radius: 999px;
    background: #ffd166;
}

.contact-channel-card summary::after {
    content: "";
    position: absolute;
    right: 28px;
    top: 28px;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    background:
        linear-gradient(currentColor, currentColor) center / 16px 2px no-repeat,
        linear-gradient(currentColor, currentColor) center / 2px 16px no-repeat;
    color: #fff;
    opacity: 0.78;
    transition: transform 180ms ease, background-color 180ms ease;
}

.contact-channel-card:hover summary::after,
.contact-channel-card[open] summary::after {
    background:
        linear-gradient(currentColor, currentColor) center / 16px 2px no-repeat,
        rgba(255, 255, 255, 0.16);
    transform: rotate(180deg);
}

.contact-channel-card summary span {
    color: #ffd166;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.contact-channel-card summary strong {
    max-width: 560px;
    color: #fff;
    font-size: clamp(30px, 3.5vw, 46px);
    font-weight: 900;
    line-height: 1.02;
}

.contact-channel-card summary small {
    max-width: 520px;
    color: #d9e6f5;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.45;
}

.contact-channel-reveal {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: start;
    gap: 18px;
    padding: 30px;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(6, 18, 38, 0.72), rgba(6, 18, 38, 0.96)),
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), transparent 48%);
    opacity: 0;
    clip-path: inset(0 0 100% 0);
    pointer-events: none;
    transform: translateY(-14px);
    transition: opacity 240ms ease, clip-path 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 260ms ease;
}

.contact-channel-reveal::after {
    content: "";
    position: absolute;
    inset: -35% -50%;
    background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, 0.18) 50%, transparent 58%);
    opacity: 0;
    pointer-events: none;
    transform: translateX(-28%);
}

.contact-channel-card:not(.is-click-closed):hover .contact-channel-reveal,
.contact-channel-card.is-hovered .contact-channel-reveal,
.contact-channel-card[open] .contact-channel-reveal {
    opacity: 1;
    clip-path: inset(0);
    pointer-events: auto;
    transform: translateY(0);
}

.contact-channel-card:not(.is-click-closed):hover .contact-channel-reveal::after,
.contact-channel-card.is-hovered .contact-channel-reveal::after,
.contact-channel-card[open] .contact-channel-reveal::after {
    animation: contactRevealShine 760ms ease 80ms both;
}

.contact-reveal-head {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 8px;
    padding-right: 46px;
}

.contact-reveal-head::before {
    content: "";
    width: 74px;
    height: 5px;
    border-radius: 999px;
    background: #ffd166;
}

.contact-reveal-head span {
    color: #ffd166;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.contact-reveal-head h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.08;
}

.contact-channel-card-1 {
    background: linear-gradient(135deg, #0a1830, #174ea6);
}

.contact-channel-card-2 {
    background: linear-gradient(135deg, #102030, #1b6b5c);
}

.contact-channel-card-3 {
    background: linear-gradient(135deg, #172033, #6b4d9a);
}

.contact-channel-card-theme-blue { background:linear-gradient(135deg,#0a1830,#174ea6); }
.contact-channel-card-theme-green { background:linear-gradient(135deg,#102030,#1b6b5c); }
.contact-channel-card-theme-violet { background:linear-gradient(135deg,#172033,#6b4d9a); }
.contact-channel-card-theme-yellow { background:linear-gradient(135deg,#4f4105,#a98208); }
.contact-channel-card-theme-orange { background:linear-gradient(135deg,#542000,#b8490a); }
.contact-channel-card-theme-red { background:linear-gradient(135deg,#4f0e16,#a6212d); }
.contact-channel-card-theme-silver { background:linear-gradient(135deg,#29323d,#687789); }
.contact-channel-card-theme-gold { background:linear-gradient(135deg,#49340c,#98701d); }

.contact-detail-list {
    position: relative;
    z-index: 1;
    align-content: start;
    display: grid;
    gap: 8px;
    padding: 0;
    margin: 4px 0 0;
    list-style: none;
}

.contact-detail-list li {
    position: relative;
    padding-left: 18px;
    color: #d9e6f5;
    font-size: 15px;
    line-height: 1.35;
}

.contact-detail-list li::before {
    content: "";
    position: absolute;
    top: 0.72em;
    left: 0;
    width: 7px;
    height: 7px;
    border-radius: 2px;
    background: #ffd166;
}

.contact-detail-list a {
    color: #fff;
    font-weight: 900;
}

.contact-detail-list a:hover,
.contact-detail-list a:focus {
    color: #ffd166;
    text-decoration: underline;
    outline: none;
}

.contact-cta-panel {
    position: relative;
    overflow: hidden;
    padding: 28px;
    box-shadow: 0 18px 38px rgba(24, 39, 75, 0.12);
}

.contact-cta-panel h2 {
    color: var(--ink);
}

.contact-cta-panel::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--red), #ffd166, var(--green));
}

.contact-location-stack {
    padding-bottom: 16px;
}

.contact-map-section {
    position: relative;
    grid-template-columns: minmax(290px, 0.38fr) minmax(0, 1fr);
    gap: 0;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 18px 38px rgba(24, 39, 75, 0.1);
    animation: contactFadeUp 680ms ease var(--delay, 0ms) both;
}

.contact-map-section.is-alt {
    grid-template-columns: minmax(0, 1fr) minmax(290px, 0.38fr);
}

.contact-map-section.is-alt .map-copy {
    order: 2;
}

.contact-map-section.is-alt .map-frame {
    order: 1;
}

.contact-map-section .map-copy {
    display: grid;
    align-content: center;
    gap: 12px;
    padding: 30px;
}

.location-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 34px;
    border-radius: var(--radius);
    background: #eaf3ff;
    color: var(--blue);
    font-weight: 900;
}

.contact-map-section .map-frame {
    min-height: 380px;
    border-radius: 0;
}

.contact-map-section .map-frame iframe {
    min-height: 380px;
    transition: filter 180ms ease, transform 180ms ease;
}

.contact-map-section:hover .map-frame iframe {
    filter: saturate(1.08) contrast(1.02);
}

.admin-contact-form {
    max-width: none;
}

.admin-contact-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.admin-contact-overview article { display:grid; grid-template-columns:1fr auto; gap:4px 12px; align-items:center; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.admin-contact-overview span,.admin-contact-overview small { color:var(--muted); font-weight:700; }
.admin-contact-overview strong { grid-row:1 / span 2; grid-column:2; color:var(--ink); font-size:30px; }
.admin-contact-overview small { font-size:12px; }
.admin-contact-tabs { position:sticky; top:var(--admin-contact-tabs-top,8px); z-index:40; display:flex; gap:8px; margin:0 0 20px; padding:6px; overflow-x:auto; border:1px solid var(--line); border-radius:999px; background:var(--surface); box-shadow:0 10px 28px rgba(12,35,49,.12); }
.admin-contact-tabs a { flex:1; min-width:max-content; padding:9px 15px; border-radius:999px; color:var(--muted); text-align:center; text-decoration:none; font-weight:800; }
.admin-contact-tabs a:hover,.admin-contact-tabs a:focus,.admin-contact-tabs a.is-active { background:#174b64; color:#fff; }
.admin-contact-editor-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr); gap:20px; align-items:start; }
.admin-contact-editor-layout:has(form[data-contact-admin-panel="contactos"]:not([hidden])) { grid-template-columns:1fr; }
.admin-contact-editor-layout:has(form[data-contact-admin-panel="contactos"]:not([hidden])) .admin-contact-preview-column[data-contact-admin-panel="contactos"] { position:static; top:auto; grid-column:1; width:100%; transform:none; }
.admin-contact-editor-fields { display:grid; gap:16px; min-width:0; }
.admin-contact-form[hidden],.admin-contact-preview-column[hidden] { display:none; }
.admin-contact-editor-fields .admin-contact-grid { grid-template-columns:1fr; }
.admin-contact-form-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:16px; border-top:1px solid var(--line); }
.admin-contact-form-actions span { color:var(--muted); font-size:12px; font-weight:700; }
.admin-contact-preview-column { position:sticky; top:var(--admin-contact-preview-top,18px); }
.admin-contact-preview-card { display:grid; gap:14px; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:0 16px 40px rgba(18,37,54,.09); }
.admin-contact-preview-head { display:flex; justify-content:space-between; gap:12px; color:var(--ink); font-weight:900; }
.admin-contact-preview-head small { color:var(--muted); }
.admin-contact-hero-preview { display:grid; align-content:end; min-height:430px; padding:22px; border-radius:calc(var(--radius) - 3px); background:#10273b; color:#fff; }
.admin-contact-hero-preview > span,.admin-contact-cta-preview > span,.admin-contact-cards-preview span,.admin-contact-locations-preview span { color:#ffd166; font-size:11px; font-weight:900; text-transform:uppercase; }
.admin-contact-hero-preview h3,.admin-contact-cta-preview h3 { margin:7px 0 8px; color:#fff; font-size:30px; line-height:1.08; }
.admin-contact-hero-preview > p { color:#d8e5ec; line-height:1.5; }
.admin-contact-hero-preview aside { display:grid; gap:4px; margin-top:28px; padding:14px; border:1px solid rgba(255,255,255,.25); border-radius:8px; background:rgba(255,255,255,.08); }
.admin-contact-hero-preview aside small { color:#d8e5ec; line-height:1.45; }
.admin-contact-cards-preview,.admin-contact-locations-preview { display:grid; gap:10px; }
.admin-contact-public-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.admin-contact-public-grid .contact-channel-card { min-height:420px; }
.admin-contact-public-grid .contact-channel-card summary { min-height:420px; padding:30px; }
.admin-contact-public-grid .contact-channel-card summary strong { font-size:clamp(30px,3.5vw,46px); }
.admin-contact-public-grid .contact-channel-card summary small { font-size:16px; }
.admin-contact-public-grid .contact-channel-reveal { padding:30px; }
.admin-contact-public-grid .contact-reveal-head h2 { font-size:clamp(28px,3vw,42px); }
.admin-contact-public-grid .contact-detail-list { font-size:initial; }
@media (max-width:760px) { .admin-contact-public-grid { grid-template-columns:1fr; } .admin-contact-public-grid .contact-channel-card,.admin-contact-public-grid .contact-channel-card summary { min-height:340px; } }
.admin-contact-cards-preview .contact-channel-card { width:100%; min-height:350px; border-radius:8px; }
.admin-contact-cards-preview .contact-channel-card summary { min-height:350px; padding:22px; }
.admin-contact-cards-preview .contact-channel-card summary strong { font-size:clamp(25px,2.2vw,34px); }
.admin-contact-cards-preview .contact-channel-card summary small { font-size:13px; }
.admin-contact-cards-preview .contact-channel-reveal { padding:22px; }
.admin-contact-cards-preview .contact-reveal-head h2 { font-size:clamp(24px,2vw,31px); }
.admin-contact-cards-preview .contact-detail-list { font-size:13px; }
.admin-contact-preview-carousel .contact-channel-card { min-height:420px; }
.admin-contact-preview-carousel .contact-channel-card summary { min-height:420px; padding:30px; }
.admin-contact-preview-carousel .contact-channel-card summary strong { font-size:clamp(30px,3.5vw,46px); }
.admin-contact-preview-carousel .contact-channel-card summary small { font-size:16px; }
.admin-contact-preview-carousel .contact-channel-reveal { padding:30px; }
.admin-contact-preview-carousel .contact-reveal-head h2 { font-size:clamp(28px,3vw,42px); }
.admin-contact-preview-carousel .contact-detail-list { font-size:initial; }
@media (max-width:760px) { .admin-contact-preview-carousel .contact-channel-card,.admin-contact-preview-carousel .contact-channel-card summary { min-height:340px; } }
.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card { min-height:420px; }
.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card summary { min-height:420px; padding:30px; }
.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card summary strong { font-size:clamp(30px,3.5vw,46px); }
.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card summary small { font-size:16px; }
.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-reveal { padding:30px; }
.admin-contact-cards-preview.admin-contact-public-grid .contact-reveal-head h2 { font-size:clamp(28px,3vw,42px); }
.admin-contact-cards-preview.admin-contact-public-grid .contact-detail-list { font-size:initial; }
.admin-contact-public-grid[data-focus-index] .contact-channel-card { grid-column:1 / -1; width:min(100%,900px); justify-self:center; }
@media (max-width:760px) { .admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card,.admin-contact-cards-preview.admin-contact-public-grid .contact-channel-card summary { min-height:340px; } }
.admin-contact-preview-hint { margin:0; color:var(--muted); font-size:12px; line-height:1.45; text-align:center; }
.admin-contact-cards-preview article { display:grid; gap:5px; min-height:120px; padding:16px; border:1px solid var(--line); border-radius:8px; background:#f8fafc; }
.admin-contact-cards-preview article.theme-blue { background:linear-gradient(135deg,#0a1830,#174ea6); }
.admin-contact-cards-preview article.theme-green { background:linear-gradient(135deg,#102030,#1b6b5c); }
.admin-contact-cards-preview article.theme-violet { background:linear-gradient(135deg,#172033,#6b4d9a); }
.admin-contact-cards-preview article.theme-yellow { background:linear-gradient(135deg,#4f4105,#a98208); }
.admin-contact-cards-preview article.theme-orange { background:linear-gradient(135deg,#542000,#b8490a); }
.admin-contact-cards-preview article.theme-red { background:linear-gradient(135deg,#4f0e16,#a6212d); }
.admin-contact-cards-preview article.theme-silver { background:linear-gradient(135deg,#29323d,#687789); }
.admin-contact-cards-preview article.theme-gold { background:linear-gradient(135deg,#49340c,#98701d); }
.admin-contact-cards-preview article[class*="theme-"] strong { color:#fff; }
.admin-contact-cards-preview article[class*="theme-"] small { color:#f0f4f8; }
.admin-contact-cards-preview article.theme-blue strong,.admin-contact-cards-preview article.theme-green strong,.admin-contact-cards-preview article.theme-violet strong { color:#fff; }
.admin-contact-cards-preview article.theme-blue small,.admin-contact-cards-preview article.theme-green small,.admin-contact-cards-preview article.theme-violet small { color:#d9e6f5; }
.admin-contact-color-field { position:relative; }
.admin-contact-color-swatches { display:flex; gap:7px; margin-top:7px; }
.admin-contact-color-swatches i { width:24px; height:10px; border-radius:3px; }
.admin-contact-color-swatches .is-blue { background:#174ea6; }
.admin-contact-color-swatches .is-green { background:#1b6b5c; }
.admin-contact-color-swatches .is-violet { background:#6b4d9a; }
.admin-contact-color-swatches .is-yellow { background:#d0a710; }
.admin-contact-color-swatches .is-orange { background:#d65b12; }
.admin-contact-color-swatches .is-red { background:#bb2936; }
.admin-contact-color-swatches .is-silver { background:#8794a3; }
.admin-contact-color-swatches .is-gold { background:#b88926; }
.admin-contact-cards-preview article > img,.admin-contact-cards-preview article > b { display:grid; width:64px; height:64px; margin-bottom:5px; place-items:center; overflow:hidden; border-radius:50%; background:#174b64; color:#fff; object-fit:cover; font-size:22px; }
.admin-contact-cards-preview article strong { color:var(--ink); font-size:18px; }
.admin-contact-cards-preview article small { color:var(--muted); line-height:1.45; }
.admin-contact-cta-preview { padding:22px; border-radius:8px; background:#10273b; color:#fff; }
.admin-contact-cta-preview > div { display:flex; gap:8px; flex-wrap:wrap; margin:18px 0; }
.admin-contact-cta-preview > div strong,.admin-contact-cta-preview > div em { padding:9px 12px; border-radius:7px; background:#ffd166; color:#10273b; font-size:12px; font-style:normal; }
.admin-contact-cta-preview > div em { border:1px solid rgba(255,255,255,.4); background:transparent; color:#fff; }
.admin-contact-cta-preview > small { color:#d8e5ec; }
.admin-contact-locations-preview article { display:grid; grid-template-columns:38px 1fr; gap:10px; padding:14px; border:1px solid var(--line); border-radius:8px; background:#f8fafc; }
.admin-contact-locations-preview article > b { display:grid; width:38px; height:34px; place-items:center; border-radius:7px; background:#174b64; color:#fff; }
.admin-contact-locations-preview article div { display:grid; gap:3px; }
.admin-contact-locations-preview article strong { color:var(--ink); }
.admin-contact-locations-preview article small { color:var(--muted); line-height:1.4; }
.admin-contact-form.has-unsaved-changes { border-color:#d6a31d; }
.admin-contact-form.has-unsaved-changes .admin-contact-form-actions span { color:#8a6500; font-weight:800; }
@media (max-width:980px) { .admin-contact-editor-layout { grid-template-columns:1fr; } .admin-contact-preview-column { position:static; } }
@media (max-width:720px) { .admin-contact-overview { grid-template-columns:1fr; } .admin-contact-tabs { border-radius:var(--radius); } .admin-contact-form-actions { align-items:stretch; flex-direction:column; } .admin-contact-form-actions .button-primary { width:100%; } }

.admin-section-divider {
    display: grid;
    gap: 4px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}

.admin-section-divider h2 {
    margin: 0;
}

.admin-contact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.admin-location-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-location-table td:nth-child(2) {
    display: grid;
    gap: 3px;
}

.admin-location-table td:nth-child(2) small {
    color: var(--muted);
}

.admin-location-table td:nth-child(4) {
    max-width: 360px;
    line-height: 1.4;
}

.admin-contact-block {
    display: grid;
    align-content: start;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #f8fafc;
}

.admin-contact-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}

.admin-contact-block-head span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-contact-photo-field { display:grid; grid-template-columns:76px minmax(0,1fr); gap:14px; align-items:center; }
.admin-contact-photo-thumb { display:grid; width:76px; height:76px; overflow:hidden; place-items:center; border:1px solid var(--line); border-radius:50%; background:#e8f0f5; color:#174b64; font-size:26px; font-weight:900; }
.admin-contact-photo-thumb img { width:100%; height:100%; object-fit:cover; }
.admin-contact-photo-field .admin-field { min-width:0; }
.admin-contact-photo-field input[type="file"] { max-width:100%; }
.admin-contact-photo-thumb small { color:var(--muted); font-size:10px; text-align:center; }
.admin-contact-photo-mode { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 14px; padding:0; border:0; }
.admin-contact-photo-mode legend { grid-column:1 / -1; margin-bottom:2px; color:var(--ink); font-size:13px; font-weight:900; }
.admin-contact-photo-mode label { position:relative; cursor:pointer; }
.admin-contact-photo-mode input { position:absolute; opacity:0; pointer-events:none; }
.admin-contact-photo-mode label span { display:grid; min-height:42px; place-items:center; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--muted); font-weight:900; }
.admin-contact-photo-mode input:checked + span { border-color:#174b64; background:#174b64; color:#fff; }
.admin-contact-photo-mode > small { grid-column:1 / -1; color:var(--muted); line-height:1.4; }
.admin-contact-table-wrap { overflow:auto; border:1px solid var(--line); border-radius:var(--radius); }
.admin-contact-table { width:100%; min-width:760px; border-collapse:collapse; background:var(--surface); }
.admin-contact-table th,.admin-contact-table td { padding:13px 14px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
.admin-contact-table th { background:#eef4f7; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; }
.admin-contact-table tbody tr:last-child td { border-bottom:0; }
.admin-contact-table tbody tr:hover { background:#f8fafc; }
.admin-contact-table-person { display:flex; align-items:center; gap:11px; min-width:210px; }
.admin-contact-table-person > img,.admin-contact-table-person > b { display:grid; width:46px; height:46px; flex:0 0 46px; overflow:hidden; place-items:center; border-radius:50%; background:#174b64; color:#fff; object-fit:cover; }
.admin-contact-table-image { display:block; width:54px; height:54px; border-radius:6px; object-fit:cover; }
.admin-contact-table-person > span { display:grid; gap:2px; }
.admin-contact-table-person small { color:var(--muted); }
.admin-contact-photo-state { display:inline-flex; padding:5px 8px; border-radius:999px; background:#edf1f4; color:var(--muted); font-size:11px; font-weight:900; }
.admin-contact-photo-state.is-visible { background:#e3f4ec; color:#167352; }
.admin-contact-theme-label { display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:11px; font-weight:900; }
.admin-contact-theme-label i { width:18px; height:18px; border-radius:50%; background:#174ea6; }
.admin-contact-theme-label.theme-green i { background:#1b6b5c; }
.admin-contact-theme-label.theme-violet i { background:#6b4d9a; }
.admin-contact-theme-label.theme-yellow i { background:#d0a710; }
.admin-contact-theme-label.theme-orange i { background:#d65b12; }
.admin-contact-theme-label.theme-red i { background:#bb2936; }
.admin-contact-theme-label.theme-silver i { background:#8794a3; }
.admin-contact-theme-label.theme-gold i { background:#b88926; }
@media (max-width:720px) { .admin-contact-table td:nth-child(5)::before { content:"Color"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } }
.admin-contact-table-actions { display:flex; gap:7px; white-space:nowrap; }
.admin-contact-edit-modal { position:fixed; inset:0; z-index:120; display:none; place-items:center; padding:20px; pointer-events:none; }
.admin-contact-edit-modal.is-open { display:grid; justify-items:start; }
.admin-contact-modal-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(4,13,24,.72); pointer-events:none; }
.admin-contact-edit-panel { position:relative; z-index:1; width:min(720px,calc(100vw - 380px)); max-height:calc(100dvh - 40px); overflow:auto; padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:0 28px 80px rgba(0,0,0,.32); pointer-events:auto; }
.modal-lock .admin-contact-editor .admin-contact-preview-column:not([hidden]) { position:fixed; top:50%; right:var(--page-gutter); z-index:121; width:min(31vw,595px); transform:translateY(-50%); pointer-events:auto; }
.modal-lock .admin-contact-editor .admin-contact-editor-layout:has(form[data-contact-admin-panel="contactos"]:not([hidden])) .admin-contact-preview-column[data-contact-admin-panel="contactos"]:not([hidden]) { position:fixed; top:50%; right:var(--page-gutter); z-index:121; grid-column:auto; width:min(31vw,595px); transform:translateY(-50%); pointer-events:auto; }
.admin-contact-whatsapp-link { display:inline-flex; align-items:center; min-height:34px; color:#147a42; font-weight:900; text-decoration:none; }
.admin-contact-whatsapp-link:hover,.admin-contact-whatsapp-link:focus { color:#0d5f32; text-decoration:underline; }
@media (max-width:980px) { .admin-contact-edit-panel { width:min(720px,100%); } .modal-lock .admin-contact-editor .admin-contact-preview-column:not([hidden]) { display:none; } }
.admin-contact-edit-panel > header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:20px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.admin-contact-edit-panel > header h2 { margin:4px 0 0; }
.admin-contact-edit-panel > header > button { display:grid; width:38px; height:38px; flex:0 0 38px; place-items:center; border:1px solid var(--line); border-radius:50%; background:var(--surface); color:var(--ink); font-size:25px; cursor:pointer; }
.admin-contact-edit-panel > .admin-field,.admin-contact-edit-panel > .admin-check-field,.admin-contact-edit-panel > .admin-contact-photo-field { margin-bottom:14px; }
.admin-contact-edit-panel > footer { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
@media (max-width:720px) { .admin-contact-table { min-width:0; } .admin-contact-table thead { display:none; } .admin-contact-table,.admin-contact-table tbody,.admin-contact-table tr,.admin-contact-table td { display:block; width:100%; } .admin-contact-table tr { padding:12px; border-bottom:1px solid var(--line); } .admin-contact-table td { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border:0; } .admin-contact-table td:first-child::before { content:"Imagen"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } .admin-contact-table td:nth-child(2)::before { content:"Contacto"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } .admin-contact-table td:nth-child(3)::before { content:"Teléfono"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } .admin-contact-table td:nth-child(4)::before { content:"WhatsApp"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } .admin-contact-table td:nth-child(5)::before { content:"Color"; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } .admin-contact-table td:last-child { display:block; } .admin-contact-table-actions,.admin-contact-table-actions button { width:100%; } .admin-contact-table-actions { margin-top:4px; } .admin-contact-edit-modal { align-items:end; padding:0; } .admin-contact-edit-panel { width:100%; max-height:94dvh; border-radius:var(--radius) var(--radius) 0 0; } .admin-contact-edit-panel > footer { align-items:stretch; flex-direction:column-reverse; } .admin-contact-edit-panel > footer button { width:100%; } }

.contact-person-photo { width:124px; height:124px; margin-bottom:4px; border:4px solid rgba(255,255,255,.82); border-radius:50%; object-fit:cover; box-shadow:0 12px 32px rgba(0,0,0,.28); }
.contact-channel-card summary > .contact-person-photo { order:-1; margin-bottom:8px; }
.contact-person-photo-small { width:58px; height:58px; margin:0 0 2px; border-width:2px; }
@media (max-width:760px) { .contact-person-photo { width:104px; height:104px; border-width:3px; } }

@keyframes contactFadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes contactGridDrift {
    from {
        background-position: 0 0, 0 0;
    }

    to {
        background-position: 44px 44px, 44px 44px;
    }
}

@keyframes contactSignal {
    0% {
        opacity: 0.72;
        transform: scale(0.52);
    }

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

@keyframes contactRevealShine {
    0% {
        opacity: 0;
        transform: translateX(-28%);
    }

    35% {
        opacity: 0.9;
    }

    100% {
        opacity: 0;
        transform: translateX(34%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .contact-hero::before,
    .contact-hero-copy,
    .contact-hero-panel,
    .contact-signal span,
    .contact-card,
    .contact-channel-reveal::after,
    .contact-map-section {
        animation: none;
    }

    .contact-card,
    .contact-channel-card summary::after,
    .contact-channel-reveal,
    .contact-map-section .map-frame iframe {
        transition: none;
    }
}

@keyframes controlPress {
    0% {
        transform: translateY(-1px) scale(1);
    }
    45% {
        transform: translateY(0) scale(0.96);
    }
    100% {
        transform: translateY(-1px) scale(1);
    }
}

@keyframes menuDrop {
    0% {
        opacity: 0;
        transform: translateY(-8px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes panelFade {
    0% {
        opacity: 0;
        transform: translateX(8px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes huntNavGlow {
    0% {
        background-position: 0 0;
    }
    50% {
        background-position: 400% 0;
    }
    100% {
        background-position: 0 0;
    }
}

.site-footer {
    margin-top: 34px;
    padding: 34px 0;
    background: var(--site-chrome);
    color: #fff;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 28px;
}

.footer-grid section {
    display: grid;
    align-content: start;
    gap: 8px;
}

.footer-grid p,
.footer-grid a {
    color: #d8dee6;
}

@media (max-width: 1040px) {
    .auth-switch-card {
        width: min(100%, 940px);
        min-height: 610px;
    }

    .auth-form,
    .auth-create-form {
        padding: 34px 34px;
    }

    .auth-form-head h2,
    .auth-overlay-panel h2 {
        font-size: 27px;
    }

    .auth-overlay-panel {
        padding: 34px;
    }

    .header-main {
        grid-template-columns: 1fr auto;
    }

    .global-search {
        grid-column: 1 / -1;
        order: 3;
    }

    .store-grid,
    .catalog-layout,
    .quote-layout,
    .about-hero .info-hero-inner,
    .mission-vision-grid,
    .values-showcase {
        grid-template-columns: 1fr;
    }

    .quote-details-step .quote-request-review { position: static; top: auto; }

    .about-hero .info-hero-inner {
        min-height: 0;
        gap: 28px;
    }

    .about-hero-visual {
        grid-template-columns: minmax(0, 1fr) 150px;
        max-width: 720px;
    }

    .filter-panel {
        position: static;
    }

    .product-grid,
    .product-grid-compact,
    .category-card-grid,
    .subcategory-columns,
    .admin-contact-grid,
    .admin-image-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .blog-featured-card,
    .blog-article-hero,
    .blog-article-layout {
        grid-template-columns: 1fr;
    }

    .blog-featured-media,
    .blog-article-media {
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .blog-lesson-panel {
        position: static;
    }

    .industry-track {
        grid-auto-columns: calc((100% - 18px) / 2);
    }

    .field-work-track {
        grid-auto-columns: calc((100% - 18px) / 2);
    }

    .value-track {
        grid-auto-columns: minmax(280px, 74%);
    }

    .values-showcase-grid.values-track {
        grid-auto-columns: minmax(260px, 74%);
    }

    .product-carousel-track {
        grid-auto-columns: calc((100% - 18px) / 2);
    }

    .contact-track {
        grid-template-columns: none;
        grid-auto-columns: 100%;
    }

    .blog-track {
        grid-auto-columns: 100%;
    }

    .filter-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .filter-panel {
        display: none;
    }

    .filter-panel.is-open {
        display: block;
    }

    .menu-toggle {
        display: inline-flex;
    }

    .category-nav {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: auto;
        z-index: 1001;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        width: min(330px, calc(100vw - 34px));
        height: 100vh;
        height: 100dvh;
        max-height: none;
        overflow: hidden;
        background: var(--surface);
        border-top: 0;
        border-right: 1px solid var(--line);
        box-shadow: 16px 0 28px rgba(24, 39, 75, 0.18);
        pointer-events: none;
        transform: translateX(-105%);
        visibility: hidden;
        transition: transform 220ms ease, visibility 220ms ease;
    }

    .category-nav.is-open {
        animation: none;
        pointer-events: auto;
        transform: translateX(0);
        visibility: visible;
    }

    .menu-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1000;
        display: block;
        background: rgba(15, 23, 42, 0.48);
        opacity: 0;
        pointer-events: none;
        transition: opacity 180ms ease;
        visibility: hidden;
    }

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

    .mobile-drawer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 54px;
        padding: 8px 10px 7px 12px;
        border-bottom: 1px solid var(--line);
        background: #fff;
    }

    .mobile-drawer-logo {
        position: relative;
        display: inline-flex;
        align-items: center;
        width: 128px;
        height: 38px;
    }

    .mobile-drawer-logo img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: left center;
    }

    .mobile-drawer-logo .brand-wordmark {
        align-items: flex-start;
        padding: 1px 0;
        text-align: left;
    }

    .mobile-drawer-logo .brand-wordmark strong {
        font-size: 23px;
    }

    .mobile-drawer-logo .brand-wordmark span {
        margin-top: 3px;
        font-size: 10px;
    }

    .mobile-menu-close {
        position: relative;
        width: 38px;
        height: 38px;
        border: 0;
        background: transparent;
        color: var(--ink);
        cursor: pointer;
    }

    .mobile-menu-close span {
        position: absolute;
        top: 18px;
        left: 10px;
        width: 18px;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
    }

    .mobile-menu-close span:first-child {
        transform: rotate(45deg);
    }

    .mobile-menu-close span:last-child {
        transform: rotate(-45deg);
    }

    .mobile-menu-panels {
        display: block;
        min-height: 0;
        overflow: hidden;
        background: #fff;
    }

    .category-nav-inner {
        display: none;
    }

    .mobile-menu-panel {
        display: none;
        height: 100%;
        min-height: 0;
        overflow: auto;
        padding-top: 4px;
    }

    .mobile-menu-panel.is-active {
        display: flex;
        flex-direction: column;
    }

    .mobile-menu-list {
        display: grid;
    }

    .mobile-menu-item,
    .mobile-menu-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 42px;
        padding: 0 14px;
        border: 0;
        background: #fff;
        color: #253247;
        font-size: 14px;
        font-weight: 700;
        text-align: left;
        cursor: pointer;
        transition: background-color 150ms ease, color 150ms ease;
    }

    .mobile-menu-item:hover,
    .mobile-menu-item:focus,
    .mobile-menu-link:hover,
    .mobile-menu-link:focus {
        background: #eef4ff;
        color: var(--blue);
        outline: none;
    }

    .mobile-menu-item span,
    .mobile-menu-link span {
        width: 9px;
        height: 9px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: rotate(45deg);
        flex: 0 0 auto;
    }

    .mobile-panel-head {
        display: flex;
        align-items: center;
        gap: 6px;
        min-height: 44px;
        padding: 0 12px;
        border-bottom: 1px solid var(--line);
        color: var(--ink);
    }

    .mobile-panel-head strong {
        font-size: 14px;
    }

    .mobile-panel-back {
        position: relative;
        width: 30px;
        height: 30px;
        border: 0;
        background: transparent;
        color: var(--ink);
        cursor: pointer;
    }

    .mobile-panel-back::before {
        content: "";
        position: absolute;
        top: 10px;
        left: 11px;
        width: 9px;
        height: 9px;
        border-left: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
    }

    .mobile-menu-all {
        display: inline-flex;
        width: max-content;
        margin: 10px 14px 18px;
        color: var(--ink);
        font-size: 13px;
        font-weight: 800;
        text-decoration: underline;
    }

    .mobile-menu-contact {
        display: grid;
        gap: 0;
        margin-top: auto;
        padding: 10px 0;
        border-top: 1px solid var(--line);
        background: #f8fafc;
    }

    .mobile-menu-contact a {
        display: flex;
        align-items: center;
        min-height: 42px;
        padding: 0 14px;
        color: #253247;
        font-size: 13px;
        font-weight: 700;
    }

    .mobile-menu-contact a:hover,
    .mobile-menu-contact a:focus {
        color: var(--blue);
        outline: none;
    }
}

@media (max-width: 760px) {
    .container {
        width: min(100% - 20px, 1180px);
    }

    .top-strip-inner,
    .home-section-head,
    .section-title,
    .catalog-heading,
    .results-toolbar,
    .admin-card-head,
    .admin-users-toolbar,
    .admin-form-head-actions,
    .admin-actions,
    .quote-update-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .quote-details-step .quote-intent-options,
    .quote-contact-grid,
    .quote-detail-columns { grid-template-columns: 1fr; }
    .quote-details-step .quote-request-form { padding: 18px; }
    .quote-details-step .quote-send-card { grid-template-columns: 1fr; grid-template-areas: "title" "recipient" "whatsapp" "email" "privacy"; padding: 20px; }
    .quote-save-row { align-items: stretch; flex-direction: column; }

    .header-main {
        gap: 12px;
        padding: 12px 0;
    }

    .brand {
        min-width: 142px;
    }

    .brand-logo-wrap {
        width: 142px;
        height: 56px;
        flex-basis: 142px;
    }

    .brand-logo-wrap .brand-wordmark strong {
        font-size: 38px;
    }

    .brand-logo-wrap .brand-wordmark span {
        font-size: 16px;
        letter-spacing: 0.065em;
    }

    .brand-logo-wrap .brand-wordmark-custom {
        min-width: 0;
        padding: 5px 6px;
        font-size: min(var(--site-logo-size, 38px), 22px);
        line-height: 0.92;
    }

    .header-actions a:not(.quote-link):not(.header-auth-link) {
        display: none;
    }

    .info-hero-inner,
    .about-layout,
    .about-metrics,
    .pillar-grid,
    .value-grid,
    .contact-card-grid,
    .admin-form-grid,
    .admin-user-form-grid,
    .admin-contact-grid,
    .admin-location-grid,
    .admin-image-grid,
    .map-section {
        grid-template-columns: 1fr;
    }

    .admin-table-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-table-actions .button-small {
        width: 100%;
    }

    .admin-user-modal {
        align-items: end;
        padding: 0;
    }

    .admin-user-modal-panel {
        width: 100%;
        max-height: 100dvh;
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        border-radius: 16px 16px 0 0;
    }

    .admin-user-modal-head,
    .admin-user-modal-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-user-modal-actions .button-primary,
    .admin-user-modal-actions .button-ghost {
        width: 100%;
    }

    .admin-user-modal-body {
        padding: 16px;
    }

    .auth-switch-card {
        display: grid;
        min-height: 0;
        overflow: visible;
    }

    .auth-mobile-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 10px;
        border-bottom: 1px solid var(--line);
        background: var(--surface-2);
    }

    .auth-mobile-tab {
        min-height: 42px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: var(--surface);
        color: var(--ink);
        font-weight: 900;
        cursor: pointer;
    }

    .auth-mobile-tab:hover,
    .auth-mobile-tab:focus {
        border-color: rgba(23, 78, 166, 0.36);
        color: var(--blue);
        outline: none;
    }

    .auth-switch-card:not(.right-panel-active) .auth-mobile-tab-sign-in,
    .auth-switch-card.right-panel-active .auth-mobile-tab-sign-up {
        border-color: var(--blue);
        background: var(--blue);
        color: #fff;
    }

    .auth-form-pane,
    .auth-sign-in-pane,
    .auth-sign-up-pane {
        position: relative;
        width: 100%;
        height: auto;
        opacity: 1;
        transform: none !important;
    }

    .auth-overlay-pane {
        display: none;
    }

    .auth-sign-up-pane {
        display: none;
    }

    .auth-switch-card.right-panel-active .auth-sign-in-pane {
        display: none;
    }

    .auth-switch-card.right-panel-active .auth-sign-up-pane {
        display: block;
    }

    .auth-form {
        min-height: 0;
        padding: 30px 22px;
    }

    .auth-create-form {
        padding: 28px 22px;
    }

    .auth-create-form .auth-field-stack {
        grid-template-columns: 1fr;
    }

    .auth-form-head h2 {
        font-size: 26px;
    }

    .admin-logo-current {
        grid-template-columns: 1fr;
    }

    .admin-logo-current-grid {
        grid-template-columns: 1fr;
    }

    .contact-hero-inner {
        gap: 20px;
    }

    .contact-hero-actions,
    .contact-hero-actions a {
        width: 100%;
    }

    .contact-hero-actions a {
        justify-content: center;
    }

    .contact-map-section.is-alt {
        grid-template-columns: 1fr;
    }

    .contact-map-section.is-alt .map-copy,
    .contact-map-section.is-alt .map-frame {
        order: initial;
    }

    .contact-map-section .map-copy {
        padding: 22px;
    }

    .field-work-track {
        grid-auto-columns: 100%;
    }

    .value-track {
        grid-auto-columns: 100%;
    }

    .values-showcase-grid.values-track {
        grid-auto-columns: 100%;
    }

    .info-hero-inner {
        min-height: 0;
        padding: 30px 0;
    }

    .about-hero .info-hero-inner {
        padding: 38px 0 46px;
    }

    .about-hero-copy h1 {
        font-size: clamp(38px, 12vw, 56px);
    }

    .about-hero-actions,
    .about-hero-actions a {
        width: 100%;
    }

    .about-hero-actions a {
        justify-content: center;
    }

    .about-hero-visual {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 240px 150px;
        min-height: 0;
    }

    .about-hero-photo-main {
        grid-column: 1 / -1;
        grid-row: auto;
        min-height: 240px;
    }

    .about-hero-badge {
        position: static;
        grid-column: 1 / -1;
        width: 100%;
    }

    .about-metrics {
        margin-top: -18px;
    }

    .about-copy,
    .about-proof-panel,
    .values-showcase {
        padding: 20px;
    }

    .mission-vision-section {
        padding: 38px 0;
    }

    .mission-vision-card {
        min-height: 280px;
        padding: 0;
    }

    .mission-vision-card summary {
        min-height: 280px;
        padding: 22px;
    }

    .mission-vision-reveal {
        padding: 22px;
    }

    .values-showcase-grid {
        grid-template-columns: 1fr;
    }

    .values-showcase-grid article:first-child {
        grid-row: auto;
    }

    .values-band,
    .cta-band,
    .contact-actions-band,
    .blog-final-cta {
        align-items: stretch;
        flex-direction: column;
    }

    .values-band > div:last-child {
        justify-content: flex-start;
    }

    .hero-panel {
        min-height: 500px;
    }

    .hero-copy {
        max-width: none;
        padding: 58px 24px 76px;
    }

    .banner-text-right .hero-copy,
    .banner-text-center .hero-copy {
        justify-self: stretch;
        text-align: left;
    }

    .banner-text-top,
    .banner-text-middle,
    .banner-text-bottom {
        align-items: end;
    }

    .banner-text-center .hero-actions,
    .banner-text-right .hero-actions {
        justify-content: stretch;
    }

    .hero-actions {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .hero-search {
        grid-template-columns: 1fr;
    }

    .hero-search button {
        min-height: 44px;
    }

    .hero-cta {
        min-height: 44px;
    }

    .hero-control {
        width: 36px;
        height: 36px;
    }

    .hero-control-prev {
        left: 10px;
    }

    .hero-control-next {
        right: 10px;
    }

    .hero-dots {
        left: 24px;
        right: 24px;
        bottom: 24px;
    }

    .product-grid,
    .product-grid-compact,
    .category-card-grid,
    .subcategory-columns,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .industry-track {
        grid-auto-columns: 100%;
    }

    .product-carousel-track {
        grid-auto-columns: 100%;
    }

    .contact-track {
        grid-template-columns: none;
        grid-auto-columns: 100%;
    }

    .blog-track {
        grid-auto-columns: 100%;
    }

    .blog-card {
        min-height: 410px;
    }

    .blog-card > div,
    .blog-featured-copy,
    .blog-article-copy,
    .blog-learn-box,
    .blog-link-box,
    .blog-faq-section,
    .blog-quote-check,
    .blog-tip,
    .blog-lesson-panel,
    .blog-final-cta {
        padding: 22px;
    }

    .blog-card h3 {
        font-size: 21px;
    }

    .blog-featured-copy h2 {
        font-size: 28px;
    }

    .blog-article-copy h1 {
        font-size: 30px;
    }

    .blog-article-copy p,
    .blog-article-section p {
        font-size: 16px;
    }

    .blog-article-section h2 {
        font-size: 24px;
    }

    .blog-link-box h2,
    .blog-faq-section h2,
    .blog-final-cta h2 {
        font-size: 23px;
    }

    .blog-article-meta span {
        min-height: 32px;
    }

    .blog-lesson-panel dl div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .industry-control {
        width: 36px;
        height: 36px;
    }

    .product-carousel-control {
        width: 36px;
        height: 36px;
    }

    .contact-carousel-control {
        width: 36px;
        height: 36px;
    }

    .blog-carousel-control {
        width: 36px;
        height: 36px;
    }

    .field-work-control {
        width: 36px;
        height: 36px;
    }

    .value-carousel-control {
        width: 36px;
        height: 36px;
    }

    .values-carousel-control {
        width: 36px;
        height: 36px;
    }

    .industry-control-prev {
        left: 8px;
    }

    .industry-control-next {
        right: 8px;
    }

    .product-carousel-prev {
        left: 8px;
    }

    .product-carousel-next {
        right: 8px;
    }

    .contact-carousel-prev {
        left: 8px;
    }

    .contact-carousel-next {
        right: 8px;
    }

    .blog-carousel-prev {
        left: 8px;
    }

    .blog-carousel-next {
        right: 8px;
    }

    .field-work-prev {
        left: 8px;
    }

    .field-work-next {
        right: 8px;
    }

    .value-carousel-prev {
        left: calc(50% - 96px);
    }

    .value-carousel-next {
        right: calc(50% - 96px);
    }

    .values-carousel-prev {
        left: calc(50% - 96px);
    }

    .values-carousel-next {
        right: calc(50% - 96px);
    }

    .quote-row {
        grid-template-columns: 64px minmax(0, 1fr);
        align-items: start;
    }

    .quote-thumb {
        width: 58px;
        height: 58px;
    }

    .quote-quantity,
    .quote-line-total,
    .quote-row .quote-remove {
        grid-column: 2;
    }

    .quote-table-head { display: none; }
    .quote-quantity span, .quote-line-total span { display: block; margin: 0 0 5px; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
    .quote-quantity { display: block; }
    .quote-line-total { display: flex; align-items: end; justify-content: space-between; }
    .quote-row .quote-remove { justify-self: start; }

    .product-attrs {
        grid-template-columns: 1fr;
    }

    .product-actions {
        grid-template-columns: 64px 1fr;
    }
}

@media (max-width: 1040px) {
    .quote-summary { position: static; }
}

@media (max-width: 680px) {
    .quote-shell { padding-top: 16px; }
    .quote-heading-pro { align-items: flex-start; flex-direction: column; gap: 14px; }
    .quote-client-chip { width: 100%; }
    .quote-steps li { min-height: 60px; justify-content: center; padding: 10px 6px; }
    .quote-steps li > div { display: none; }
    .quote-list-head { align-items: flex-start; flex-wrap: wrap; }
    .quote-list-head > div { width: calc(100% - 80px); }
    .quote-code { order: 3; }
    .quote-row { gap: 10px; padding: 15px; }
    .quote-product-info strong { font-size: 14px; }
    .quote-update-actions { flex-direction: column-reverse; }
    .quote-update-actions > * { width: 100%; text-align: center; }
    .quote-next-actions { display: grid; }
    .quote-next-actions button { width: 100%; }
    .summary-card, .customer-card, .quote-send-card { padding: 17px; }
}

@media (prefers-reduced-motion: reduce) {
    .admin-home-section,
    .admin-users-table tbody tr {
        animation: none;
        transition: none;
    }

    .admin-users-table tbody tr:hover {
        transform: none;
    }
}

@media (max-width: 520px) {
    .brand {
        min-width: 118px;
    }

    .brand-logo-wrap {
        width: 118px;
        height: 50px;
        flex-basis: 118px;
    }

    .brand-logo-wrap .brand-wordmark {
        padding-inline: 2px;
    }

    .brand-logo-wrap .brand-wordmark strong {
        font-size: 32px;
    }

    .brand-logo-wrap .brand-wordmark span {
        margin-top: 5px;
        font-size: 13px;
        letter-spacing: 0.055em;
    }

    .brand-logo-wrap .brand-wordmark-custom {
        padding: 4px 5px;
        font-size: min(var(--site-logo-size, 38px), 18px);
        line-height: 0.9;
    }

    .header-actions {
        gap: 8px;
    }

    .header-auth-link {
        min-width: 58px;
        padding: 0 8px;
        font-size: 0;
    }

    .header-auth-link::before {
        content: attr(data-short-label);
        font-size: 13px;
    }

    .quote-link {
        justify-content: center;
        min-width: 72px;
        padding: 0 8px;
        font-size: 0;
    }

    .quote-link::before {
        content: "Cot.";
        font-size: 13px;
    }

    .quote-link span {
        font-size: 12px;
    }

    .global-search button {
        padding: 0 14px;
    }

    .about-hero-visual {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .about-hero-photo-small,
    .about-hero-photo-tall {
        display: none;
    }

    .contact-hero-panel,
    .contact-cta-panel {
        padding: 20px;
    }

    .contact-card,
    .contact-channel-card summary {
        min-height: 280px;
    }

    .contact-channel-card summary,
    .contact-channel-reveal {
        padding: 22px;
    }

    .contact-map-section .map-frame,
    .contact-map-section .map-frame iframe {
        min-height: 300px;
    }
}

/* Evita que las acciones se superpongan al logo en celulares muy angostos. */
@media (max-width: 360px) {
    .header-main {
        grid-template-columns: 74px minmax(0, 1fr);
        gap: 6px;
    }

    .brand {
        width: 74px;
        min-width: 0;
    }

    .brand-logo-wrap {
        width: 74px;
        height: 38px;
        flex-basis: 74px;
    }

    .brand-logo-wrap .brand-wordmark-custom {
        padding: 3px;
        font-size: min(var(--site-logo-size, 38px), 12px);
        line-height: 0.9;
    }

    .header-actions {
        justify-content: flex-end;
        gap: 4px;
        min-width: 0;
    }

    .header-actions a,
    .theme-toggle,
    .menu-toggle {
        min-height: 36px;
    }

    .header-auth-link {
        min-width: 40px;
        padding-inline: 5px;
    }

    .header-auth-link::before,
    .quote-link::before {
        font-size: 11px;
    }

    .theme-toggle,
    .menu-toggle {
        width: 34px;
        min-width: 34px;
        height: 36px;
    }

    .quote-link {
        min-width: 52px;
        gap: 4px;
        padding-inline: 5px;
    }

    .quote-link span {
        min-width: 18px;
        height: 18px;
        padding-inline: 4px;
        font-size: 10px;
    }

    .menu-toggle span {
        width: 17px;
    }
}

[data-theme="dark"] .site-header {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.34);
}

[data-theme="dark"] .category-nav,
[data-theme="dark"] .mobile-drawer-head,
[data-theme="dark"] .mobile-menu-panels,
[data-theme="dark"] .mobile-menu-panel,
[data-theme="dark"] .products-primary-list {
    background: var(--surface);
}

[data-theme="dark"] .header-actions a:hover,
[data-theme="dark"] .header-actions a:focus,
[data-theme="dark"] .theme-toggle:hover,
[data-theme="dark"] .theme-toggle:focus,
[data-theme="dark"] .menu-toggle:hover,
[data-theme="dark"] .menu-toggle:focus,
[data-theme="dark"] .header-actions a.is-current,
[data-theme="dark"] .menu-toggle[aria-expanded="true"] {
    border-color: rgba(110, 163, 255, 0.36);
    background: #1b2a44;
    color: var(--blue);
    box-shadow: inset 0 0 0 1px rgba(110, 163, 255, 0.12);
}

[data-theme="dark"] .products-trigger,
[data-theme="dark"] .nav-page-link {
    --nav-glow-surface: #202c41;
    --nav-glow-text: var(--ink);
}

[data-theme="dark"] .products-trigger::after,
[data-theme="dark"] .nav-page-link::after {
    border-color: rgba(110, 163, 255, 0.18);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.24);
}

[data-theme="dark"] .products-trigger::before,
[data-theme="dark"] .nav-page-link::before {
    background: linear-gradient(
        45deg,
        #6ea3ff,
        #38bdf8,
        #f7bd35,
        #ff6258,
        #42c28c,
        #4d83df,
        #ffd166,
        #6ea3ff
    );
    background-size: 600%;
}

[data-theme="dark"] .products-trigger:hover,
[data-theme="dark"] .products-trigger:focus,
[data-theme="dark"] .products-trigger.is-current,
[data-theme="dark"] .products-dropdown.is-open .products-trigger,
[data-theme="dark"] .nav-page-link:hover,
[data-theme="dark"] .nav-page-link:focus,
[data-theme="dark"] .nav-page-link.is-current {
    --nav-glow-surface: #174ea6;
    --nav-glow-text: #fff;
    color: var(--nav-glow-text);
}

[data-theme="dark"] .global-search,
[data-theme="dark"] .hero-search,
[data-theme="dark"] .hero-cta,
[data-theme="dark"] .product-carousel-control,
[data-theme="dark"] .industry-control,
[data-theme="dark"] .blog-carousel-control,
[data-theme="dark"] .field-work-control,
[data-theme="dark"] .value-carousel-control,
[data-theme="dark"] .values-carousel-control,
[data-theme="dark"] .contact-carousel-control,
[data-theme="dark"] .filter-toggle,
[data-theme="dark"] .button-ghost {
    background: var(--surface);
    color: var(--ink);
}

[data-theme="dark"] .global-search input,
[data-theme="dark"] .hero-search input,
[data-theme="dark"] .filter-field input,
[data-theme="dark"] .filter-group select,
[data-theme="dark"] .price-fields input,
[data-theme="dark"] .customer-card input,
[data-theme="dark"] .customer-card textarea,
[data-theme="dark"] .customer-card select,
[data-theme="dark"] .auth-field input,
[data-theme="dark"] .auth-field select,
[data-theme="dark"] .admin-field input,
[data-theme="dark"] .admin-field select,
[data-theme="dark"] .admin-field textarea,
[data-theme="dark"] .results-toolbar select,
[data-theme="dark"] .quote-row input {
    background: var(--surface-2);
    color: var(--ink);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder,
[data-theme="dark"] .auth-field input::placeholder {
    color: #8290a6;
}

[data-theme="dark"] .products-primary small,
[data-theme="dark"] .category-card span,
[data-theme="dark"] .filter-category-list .is-active,
[data-theme="dark"] .filter-category-list .is-current {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .flash {
    background: #142849;
    color: var(--blue);
    border-color: #315a96;
}

[data-theme="dark"] .flash-success {
    background: #123827;
    color: var(--green);
    border-color: #23694a;
}

[data-theme="dark"] .flash-error,
[data-theme="dark"] .quote-remove,
[data-theme="dark"] .button-danger {
    background: #3a181d;
    color: var(--red);
    border-color: #7e3034;
}

[data-theme="dark"] .blog-card-media,
[data-theme="dark"] .blog-featured-media,
[data-theme="dark"] .blog-article-media,
[data-theme="dark"] .product-media,
[data-theme="dark"] .field-work-card img,
[data-theme="dark"] .admin-image-card img,
[data-theme="dark"] .quote-thumb,
[data-theme="dark"] .map-frame {
    background: var(--surface-2);
}

[data-theme="dark"] .blog-card {
    background: #101b2d;
    border: 1px solid var(--line);
}

[data-theme="dark"] .blog-card span {
    color: #aab7c9;
}

[data-theme="dark"] .blog-featured-card,
[data-theme="dark"] .blog-learn-box,
[data-theme="dark"] .blog-link-box,
[data-theme="dark"] .blog-faq-section,
[data-theme="dark"] .blog-quote-check,
[data-theme="dark"] .blog-tip,
[data-theme="dark"] .blog-lesson-panel {
    background: var(--surface);
}

[data-theme="dark"] .blog-faq-list details {
    background: #0f1b2d;
}

[data-theme="dark"] .blog-link-box a {
    border-color: rgba(110, 163, 255, 0.24);
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .blog-article-hero {
    background: #0a1424;
}

[data-theme="dark"] .mission-vision-section {
    background: linear-gradient(135deg, #0a1424, #0f1b2d 52%, #10243a);
    border-color: rgba(110, 163, 255, 0.16);
}

[data-theme="dark"] .admin-about-overview article,
[data-theme="dark"] .admin-about-purpose-grid article,
[data-theme="dark"] .admin-about-dropzone {
    background: #0f1b2d;
    border-color: rgba(110, 163, 255, 0.22);
}

[data-theme="dark"] .admin-about-anchor-nav,
[data-theme="dark"] .admin-about-preview-card,
[data-theme="dark"] .admin-about-savebar,
[data-theme="dark"] .admin-contact-tabs,
[data-theme="dark"] .admin-contact-preview-card {
    background: rgba(15, 27, 45, 0.96);
    border-color: rgba(110, 163, 255, 0.22);
}

[data-theme="dark"] .admin-about-anchor-nav a:hover,
[data-theme="dark"] .admin-about-anchor-nav a:focus,
[data-theme="dark"] .admin-about-anchor-nav a.is-active,
[data-theme="dark"] .admin-contact-tabs a:hover,
[data-theme="dark"] .admin-contact-tabs a:focus,
[data-theme="dark"] .admin-contact-tabs a.is-active,
[data-theme="dark"] .admin-about-photo-count {
    background: rgba(110, 163, 255, 0.13);
    color: var(--blue);
}

[data-theme="dark"] .admin-contact-overview article,
[data-theme="dark"] .admin-contact-cards-preview article,
[data-theme="dark"] .admin-contact-locations-preview article,
[data-theme="dark"] .admin-contact-table,
[data-theme="dark"] .admin-contact-edit-panel {
    border-color: rgba(110, 163, 255, 0.22);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-contact-table th { background:#142238; }
[data-theme="dark"] .admin-contact-table tbody tr:hover { background:#142238; }
[data-theme="dark"] .admin-contact-photo-state { background:#1b2a3e; }

[data-theme="dark"] .admin-about-story-preview,
[data-theme="dark"] .admin-about-workflow-preview,
[data-theme="dark"] .admin-about-purpose-preview,
[data-theme="dark"] .admin-about-gallery-preview,
[data-theme="dark"] .admin-about-experience-preview,
[data-theme="dark"] .admin-about-values-preview {
    border-color: rgba(110, 163, 255, 0.22);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-about-mini-metrics article,
[data-theme="dark"] .admin-about-workflow-preview article,
[data-theme="dark"] .admin-about-purpose-preview article,
[data-theme="dark"] .admin-about-experience-preview article,
[data-theme="dark"] .admin-about-values-preview article {
    border-color: rgba(110, 163, 255, 0.18);
    background: #142238;
}

[data-theme="dark"] .about-metrics article {
    background: var(--surface);
}

[data-theme="dark"] .contact-cta-panel,
[data-theme="dark"] .contact-map-section {
    background: var(--surface);
}

[data-theme="dark"] .location-index,
[data-theme="dark"] .admin-contact-block {
    background: #0f1b2d;
    border-color: rgba(110, 163, 255, 0.22);
}

[data-theme="dark"] .location-index {
    color: var(--blue);
}

[data-theme="dark"] .blog-article-meta span {
    border-color: rgba(110, 163, 255, 0.28);
    background: rgba(110, 163, 255, 0.12);
}

[data-theme="dark"] .product-card,
[data-theme="dark"] .field-work-card,
[data-theme="dark"] .blog-card,
[data-theme="dark"] .blog-featured-card,
[data-theme="dark"] .blog-learn-box,
[data-theme="dark"] .blog-link-box,
[data-theme="dark"] .blog-faq-section,
[data-theme="dark"] .blog-quote-check,
[data-theme="dark"] .blog-tip,
[data-theme="dark"] .blog-lesson-panel,
[data-theme="dark"] .category-card,
[data-theme="dark"] .subcategory-group,
[data-theme="dark"] .results-toolbar,
[data-theme="dark"] .empty-state,
[data-theme="dark"] .quote-list,
[data-theme="dark"] .summary-card,
[data-theme="dark"] .customer-card,
[data-theme="dark"] .quote-send-card,
[data-theme="dark"] .auth-switch-card,
[data-theme="dark"] .auth-form,
[data-theme="dark"] .admin-settings-card,
[data-theme="dark"] .admin-form-card,
[data-theme="dark"] .admin-note,
[data-theme="dark"] .filter-panel {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
}

[data-theme="dark"] .about-proof-panel > div,
[data-theme="dark"] .admin-image-card,
[data-theme="dark"] .admin-logo-current,
[data-theme="dark"] .admin-logo-option,
[data-theme="dark"] .admin-user-row,
[data-theme="dark"] .admin-check-field-card {
    background: #0f1b2d;
}

[data-theme="dark"] .admin-user-status {
    border-color: rgba(110, 163, 255, 0.28);
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-user-status.is-active {
    border-color: #23694a;
    background: #123827;
    color: var(--green);
}

[data-theme="dark"] .admin-user-status.is-inactive {
    border-color: #7e3034;
    background: #3a181d;
    color: var(--red);
}

[data-theme="dark"] .admin-user-role {
    border-color: rgba(110, 163, 255, 0.28);
    background: #1b2a44;
}

[data-theme="dark"] .admin-table-scroll {
    background: #0f1b2d;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .admin-users-table th,
[data-theme="dark"] .admin-products-table th {
    background: #13223a;
}

[data-theme="dark"] .admin-users-table tbody tr,
[data-theme="dark"] .admin-products-table tbody tr {
    background: #0f1b2d;
}

[data-theme="dark"] .admin-users-table tbody tr:nth-child(even),
[data-theme="dark"] .admin-products-table tbody tr:nth-child(even) {
    background: #111f34;
}

[data-theme="dark"] .admin-users-table tbody tr:hover,
[data-theme="dark"] .admin-products-table tbody tr:hover {
    background: #162a47;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.26);
}

@media (max-width: 780px) {
    [data-theme="dark"] .admin-products-table tbody tr,
    [data-theme="dark"] .admin-products-table tbody tr:nth-child(even),
    [data-theme="dark"] .admin-products-table tbody tr:hover {
        background: #101a2a;
    }

    [data-theme="dark"] .admin-products-table td:first-child {
        background: rgba(23, 78, 166, 0.16);
    }
}

[data-theme="dark"] .admin-user-modal-panel,
[data-theme="dark"] .admin-user-modal-head,
[data-theme="dark"] .admin-user-modal-actions {
    background: var(--surface);
}

[data-theme="dark"] .admin-user-modal-close {
    background: #0f1b2d;
    color: var(--ink);
}

[data-theme="dark"] .admin-users-table th,
[data-theme="dark"] .admin-users-table td,
[data-theme="dark"] .admin-products-table th,
[data-theme="dark"] .admin-products-table td,
[data-theme="dark"] .admin-users-toolbar {
    border-color: rgba(67, 190, 255, 0.34);
}

[data-theme="dark"] .admin-catalog-categories,
[data-theme="dark"] .admin-catalog-category-row,
[data-theme="dark"] .admin-catalog-category-form,
[data-theme="dark"] .admin-catalog-filters {
    border-color: rgba(67, 190, 255, 0.28);
    background: #172844;
}

[data-theme="dark"] .admin-catalog-category-depth {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-table-scroll {
    border-color: rgba(67, 190, 255, 0.42);
    box-shadow:
        inset 0 0 0 1px rgba(67, 190, 255, 0.08),
        0 0 18px rgba(67, 190, 255, 0.08);
}

[data-theme="dark"] .admin-users-table th,
[data-theme="dark"] .admin-products-table th {
    box-shadow:
        inset 0 -1px 0 rgba(67, 190, 255, 0.48),
        0 1px 0 rgba(67, 190, 255, 0.12);
}

[data-theme="dark"] .auth-security-note {
    border-color: rgba(110, 163, 255, 0.28);
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .auth-mobile-tabs {
    background: #0f1b2d;
}

[data-theme="dark"] .auth-mobile-tab {
    background: var(--surface);
    color: var(--ink);
}

[data-theme="dark"] .auth-switch-card:not(.right-panel-active) .auth-mobile-tab-sign-in,
[data-theme="dark"] .auth-switch-card.right-panel-active .auth-mobile-tab-sign-up {
    background: var(--blue-dark);
    color: #fff;
}

[data-theme="dark"] .admin-logo-option.is-active,
[data-theme="dark"] .admin-logo-option:has(input:checked) {
    background: #1b2a44;
}

[data-theme="dark"] .admin-nav a,
[data-theme="dark"] .admin-nav-dropdown summary {
    background: var(--surface);
    color: var(--ink);
}

[data-theme="dark"] .admin-nav a:hover,
[data-theme="dark"] .admin-nav a:focus,
[data-theme="dark"] .admin-nav a.is-current,
[data-theme="dark"] .admin-nav-dropdown summary:hover,
[data-theme="dark"] .admin-nav-dropdown summary:focus,
[data-theme="dark"] .admin-nav-dropdown summary.is-current,
[data-theme="dark"] .admin-nav-dropdown[open] summary {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-nav-menu,
[data-theme="dark"] .admin-edit-scope {
    border-color: rgba(67, 190, 255, 0.34);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-edit-scope {
    border-left-color: var(--blue);
}

[data-theme="dark"] .admin-edit-scope em,
[data-theme="dark"] .admin-home-hero,
[data-theme="dark"] .admin-home-section,
[data-theme="dark"] .admin-create-panel,
[data-theme="dark"] .admin-slide-sort-form,
[data-theme="dark"] .admin-preview-card {
    border-color: rgba(67, 190, 255, 0.26);
    background: var(--surface);
}

[data-theme="dark"] .admin-home-hero,
[data-theme="dark"] .admin-home-section,
[data-theme="dark"] .admin-create-panel,
[data-theme="dark"] .admin-slide-sort-form {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
}

[data-theme="dark"] .admin-home-section[open] summary,
[data-theme="dark"] .admin-home-section summary:hover,
[data-theme="dark"] .admin-home-section summary:focus,
[data-theme="dark"] .admin-create-panel summary:hover,
[data-theme="dark"] .admin-create-panel summary:focus,
[data-theme="dark"] .admin-slide-tab:hover,
[data-theme="dark"] .admin-slide-tab:focus-within {
    background: #172844;
}

[data-theme="dark"] .admin-slide-tab.is-current {
    border-color: rgba(67, 190, 255, 0.62);
    background: linear-gradient(135deg, #172844, #0f1b2d);
    box-shadow: 0 0 18px rgba(67, 190, 255, 0.13);
    outline-color: rgba(67, 190, 255, 0.22);
}

[data-theme="dark"] .admin-slide-tabs em {
    background: #1b2a44;
}

[data-theme="dark"] .admin-home-counter,
[data-theme="dark"] .admin-home-mini-list span {
    border-color: rgba(110, 163, 255, 0.28);
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-home-mini-list li,
[data-theme="dark"] .admin-slide-tab,
[data-theme="dark"] .admin-brand-selector-item,
[data-theme="dark"] .admin-create-banner-form,
[data-theme="dark"] .admin-banner-section,
[data-theme="dark"] .admin-home-soon {
    border-color: rgba(67, 190, 255, 0.24);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-brand-selector-item:hover,
[data-theme="dark"] .admin-brand-selector-item:focus,
[data-theme="dark"] .admin-brand-selector-item:focus-within,
[data-theme="dark"] .admin-brand-selector-item.is-current {
    border-color: rgba(67, 190, 255, 0.58);
    background: #172844;
    box-shadow: 0 0 18px rgba(67, 190, 255, 0.12);
}

[data-theme="dark"] .admin-brand-selector-item [data-brand-position],
[data-theme="dark"] .admin-brand-selector-item > span:first-child,
[data-theme="dark"] .admin-brand-selector-item em {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-brand-selector-item img,
[data-theme="dark"] .admin-brand-public-preview {
    border-color: rgba(67, 190, 255, 0.24);
    background: #f8fafc;
}

[data-theme="dark"] .admin-brand-state-counters span,
[data-theme="dark"] .admin-brand-inventory,
[data-theme="dark"] .admin-brand-create-order,
[data-theme="dark"] .admin-brand-strip-preview {
    border-color: rgba(67, 190, 255, 0.24);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-brand-position-map li {
    border-color: rgba(67, 190, 255, 0.24);
    background: #172844;
}

[data-theme="dark"] .admin-brand-position-map li.is-new {
    border-color: rgba(67, 190, 255, 0.58);
    background: #1b2f50;
}

[data-theme="dark"] .admin-banner-position-map li {
    border-color: rgba(67, 190, 255, 0.24);
    background: #172844;
}

[data-theme="dark"] .admin-banner-position-map li.is-new {
    border-color: rgba(67, 190, 255, 0.58);
    background: #1b2f50;
    box-shadow: 0 0 18px rgba(67, 190, 255, 0.1);
}

[data-theme="dark"] .admin-banner-position-number {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-category-mode-card,
[data-theme="dark"] .admin-category-inventory,
[data-theme="dark"] .admin-category-picker-item,
[data-theme="dark"] .admin-category-inventory-item {
    border-color: rgba(67, 190, 255, 0.24);
    background: #172844;
}

[data-theme="dark"] .admin-product-picker,
[data-theme="dark"] .admin-product-picker.admin-featured-panel,
[data-theme="dark"] .admin-product-search-filters,
[data-theme="dark"] .admin-featured-selection-item,
[data-theme="dark"] .admin-featured-work-item,
[data-theme="dark"] .admin-featured-active,
[data-theme="dark"] .admin-product-search-item {
    border-color: rgba(67, 190, 255, 0.24);
    background: #172844;
}

[data-theme="dark"] .admin-product-search-item:hover:not(:disabled) {
    border-color: rgba(67, 190, 255, 0.58);
    box-shadow: 0 0 18px rgba(67, 190, 255, 0.12);
}

[data-theme="dark"] .admin-product-picker.admin-featured-search {
    border: 0;
    background: transparent;
}

[data-theme="dark"] .admin-featured-selection-item:hover,
[data-theme="dark"] .admin-featured-selection-item:focus-within {
    border-color: rgba(67, 190, 255, 0.58);
    background: #172844;
    box-shadow: 0 0 18px rgba(67, 190, 255, 0.12);
}

[data-theme="dark"] .admin-featured-work-item {
    background: #172844;
}

[data-theme="dark"] .admin-featured-work-item.is-hidden {
    border-color: rgba(67, 190, 255, 0.2);
}

[data-theme="dark"] .admin-product-selector-visual,
[data-theme="dark"] .admin-featured-selection-item > span:first-child {
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-category-mode-option {
    border-color: rgba(67, 190, 255, 0.24);
    background: #0f1b2d;
}

[data-theme="dark"] .admin-category-mode-option:has(input:checked),
[data-theme="dark"] .admin-category-auto-note {
    border-color: rgba(67, 190, 255, 0.58);
    background: #1b2f50;
}

[data-theme="dark"] .admin-category-future {
    background: #3b3015;
    color: #ffd166;
}

[data-theme="dark"] .admin-category-inventory-item > a,
[data-theme="dark"] .admin-category-inventory-item > span {
    border-color: rgba(67, 190, 255, 0.28);
    background: #1b2a44;
    color: var(--blue);
}

[data-theme="dark"] .admin-category-visible-toggle {
    border-color: rgba(67, 190, 255, 0.28);
    background: #0f1b2d;
}

[data-theme="dark"] .category-carousel-dots button {
    --carousel-progress-track: rgba(255, 255, 255, 0.42);
    --carousel-progress-fill: #ffd166;
}

[data-theme="dark"] .category-carousel-control {
    border-color: #344258;
    background: #182337;
}

[data-theme="dark"] .admin-brand-strip-preview .brand-strip-heading h3 {
    color: var(--ink);
}

[data-theme="dark"] .admin-brand-public-preview > strong {
    color: #14233a;
}

[data-theme="dark"] .confirm-dialog-mark {
    border-color: rgba(255, 123, 104, 0.34);
    background: rgba(255, 123, 104, 0.12);
}

[data-theme="dark"] .confirm-dialog-panel {
    border-color: rgba(67, 190, 255, 0.28);
    background: var(--surface);
}

[data-theme="dark"] .admin-home-empty {
    border-color: rgba(67, 190, 255, 0.3);
}

[data-theme="dark"] .product-attrs div {
    background: #0f1b2d;
    border-color: rgba(110, 163, 255, 0.24);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

[data-theme="dark"] .product-attrs dt {
    color: #9fc3ff;
}

[data-theme="dark"] .product-attrs dd {
    color: #f7fbff;
}

[data-theme="dark"] .product-carousel-dots button,
[data-theme="dark"] .industry-dots button,
[data-theme="dark"] .field-work-dots button,
[data-theme="dark"] .value-carousel-dots button,
[data-theme="dark"] .values-carousel-dots button,
[data-theme="dark"] .contact-carousel-dots button,
[data-theme="dark"] .blog-carousel-dots button {
    --carousel-progress-track: #344258;
    background: #344258;
}

[data-theme="dark"] .product-carousel-dots button.is-active,
[data-theme="dark"] .product-carousel-dots button:hover,
[data-theme="dark"] .product-carousel-dots button:focus,
[data-theme="dark"] .industry-dots button.is-active,
[data-theme="dark"] .industry-dots button:hover,
[data-theme="dark"] .industry-dots button:focus,
[data-theme="dark"] .field-work-dots button.is-active,
[data-theme="dark"] .field-work-dots button:hover,
[data-theme="dark"] .field-work-dots button:focus,
[data-theme="dark"] .value-carousel-dots button.is-active,
[data-theme="dark"] .value-carousel-dots button:hover,
[data-theme="dark"] .value-carousel-dots button:focus,
[data-theme="dark"] .values-carousel-dots button.is-active,
[data-theme="dark"] .values-carousel-dots button:hover,
[data-theme="dark"] .values-carousel-dots button:focus,
[data-theme="dark"] .contact-carousel-dots button.is-active,
[data-theme="dark"] .contact-carousel-dots button:hover,
[data-theme="dark"] .contact-carousel-dots button:focus,
[data-theme="dark"] .blog-carousel-dots button.is-active,
[data-theme="dark"] .blog-carousel-dots button:hover,
[data-theme="dark"] .blog-carousel-dots button:focus {
    background: var(--carousel-progress-track);
}

.global-search button,
.hero-search button,
.hero-cta,
.button-primary,
.button-ghost,
.button-whatsapp,
.blog-read-more,
.filter-submit,
.filter-toggle,
.product-actions button,
.quote-remove,
.products-menu-head a,
.products-panel-head a,
.products-panel-all,
.products-panel-empty a,
.mobile-menu-all {
    --action-glow-surface: var(--blue);
    --action-glow-hover: var(--blue-dark);
    --action-glow-text: #fff;
    position: relative;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border: 0 !important;
    border-radius: 999px;
    background: transparent !important;
    color: var(--action-glow-text) !important;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    overflow: visible;
    box-shadow: none !important;
    outline: none;
    transition: color 180ms ease, transform 180ms ease;
}

.global-search button::after,
.hero-search button::after,
.hero-cta::after,
.button-primary::after,
.button-ghost::after,
.button-whatsapp::after,
.blog-read-more::after,
.filter-submit::after,
.filter-toggle::after,
.product-actions button::after,
.quote-remove::after,
.products-menu-head a::after,
.products-panel-head a::after,
.products-panel-all::after,
.products-panel-empty a::after,
.mobile-menu-all::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: inherit;
    background: var(--action-glow-surface);
    box-shadow: 0 10px 22px rgba(24, 39, 75, 0.08);
}

.global-search button::before,
.hero-search button::before,
.hero-cta::before,
.button-primary::before,
.button-ghost::before,
.button-whatsapp::before,
.blog-read-more::before,
.filter-submit::before,
.filter-toggle::before,
.product-actions button::before,
.quote-remove::before,
.products-menu-head a::before,
.products-panel-head a::before,
.products-panel-all::before,
.products-panel-empty a::before,
.mobile-menu-all::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    z-index: -2;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: inherit;
    background: linear-gradient(
        45deg,
        #174ea6,
        #38bdf8,
        #f59e0b,
        #d92d20,
        #16805c,
        #6ea3ff,
        #f7bd35,
        #174ea6
    );
    background-size: 600%;
    filter: blur(8px);
    opacity: 0;
    transition: opacity 260ms ease-in-out;
    animation: huntNavGlow 20s linear infinite;
}

.global-search button:hover,
.global-search button:focus,
.hero-search button:hover,
.hero-search button:focus,
.hero-cta:hover,
.hero-cta:focus,
.button-primary:hover,
.button-primary:focus,
.button-ghost:hover,
.button-ghost:focus,
.button-whatsapp:hover,
.button-whatsapp:focus,
.blog-read-more:hover,
.blog-read-more:focus,
.filter-submit:hover,
.filter-submit:focus,
.filter-toggle:hover,
.filter-toggle:focus,
.product-actions button:hover,
.product-actions button:focus,
.quote-remove:hover,
.quote-remove:focus,
.products-menu-head a:hover,
.products-menu-head a:focus,
.products-panel-head a:hover,
.products-panel-head a:focus,
.products-panel-all:hover,
.products-panel-all:focus,
.products-panel-empty a:hover,
.products-panel-empty a:focus,
.mobile-menu-all:hover,
.mobile-menu-all:focus {
    --action-glow-surface: var(--action-glow-hover);
    color: var(--action-glow-text) !important;
    transform: translateY(-2px);
}

.global-search button:hover::before,
.global-search button:focus::before,
.hero-search button:hover::before,
.hero-search button:focus::before,
.hero-cta:hover::before,
.hero-cta:focus::before,
.button-primary:hover::before,
.button-primary:focus::before,
.button-ghost:hover::before,
.button-ghost:focus::before,
.button-whatsapp:hover::before,
.button-whatsapp:focus::before,
.blog-read-more:hover::before,
.blog-read-more:focus::before,
.filter-submit:hover::before,
.filter-submit:focus::before,
.filter-toggle:hover::before,
.filter-toggle:focus::before,
.product-actions button:hover::before,
.product-actions button:focus::before,
.quote-remove:hover::before,
.quote-remove:focus::before,
.products-menu-head a:hover::before,
.products-menu-head a:focus::before,
.products-panel-head a:hover::before,
.products-panel-head a:focus::before,
.products-panel-all:hover::before,
.products-panel-all:focus::before,
.products-panel-empty a:hover::before,
.products-panel-empty a:focus::before,
.mobile-menu-all:hover::before,
.mobile-menu-all:focus::before {
    opacity: 1;
}

.global-search button:active,
.hero-search button:active,
.hero-cta:active,
.button-primary:active,
.button-ghost:active,
.button-whatsapp:active,
.blog-read-more:active,
.filter-submit:active,
.filter-toggle:active,
.product-actions button:active,
.quote-remove:active,
.products-menu-head a:active,
.products-panel-head a:active,
.products-panel-all:active,
.products-panel-empty a:active,
.mobile-menu-all:active {
    transform: translateY(0) scale(0.98);
}

.hero-search button {
    --action-glow-surface: var(--amber);
    --action-glow-hover: #f7bd35;
    --action-glow-text: #111827;
}

.hero-cta,
.button-ghost,
.filter-toggle,
.products-menu-head a,
.products-panel-head a,
.products-panel-all,
.products-panel-empty a,
.mobile-menu-all {
    --action-glow-surface: var(--surface);
    --action-glow-hover: var(--blue);
    --action-glow-text: var(--blue);
}

.hero-cta:hover,
.hero-cta:focus,
.button-ghost:hover,
.button-ghost:focus,
.filter-toggle:hover,
.filter-toggle:focus,
.products-menu-head a:hover,
.products-menu-head a:focus,
.products-panel-head a:hover,
.products-panel-head a:focus,
.products-panel-all:hover,
.products-panel-all:focus,
.products-panel-empty a:hover,
.products-panel-empty a:focus,
.mobile-menu-all:hover,
.mobile-menu-all:focus {
    --action-glow-text: #fff;
}

.button-whatsapp {
    --action-glow-surface: var(--green);
    --action-glow-hover: #11966a;
    --action-glow-text: #fff;
}

.quote-remove {
    --action-glow-surface: var(--red);
    --action-glow-hover: #b42318;
    --action-glow-text: #fff;
}

[data-theme="dark"] .global-search button,
[data-theme="dark"] .button-primary,
[data-theme="dark"] .blog-read-more,
[data-theme="dark"] .filter-submit,
[data-theme="dark"] .product-actions button {
    --action-glow-surface: #174ea6;
    --action-glow-hover: var(--blue-dark);
    --action-glow-text: #fff;
}

[data-theme="dark"] .hero-cta,
[data-theme="dark"] .button-ghost,
[data-theme="dark"] .filter-toggle,
[data-theme="dark"] .products-menu-head a,
[data-theme="dark"] .products-panel-head a,
[data-theme="dark"] .products-panel-all,
[data-theme="dark"] .products-panel-empty a,
[data-theme="dark"] .mobile-menu-all {
    --action-glow-surface: #202c41;
    --action-glow-hover: #174ea6;
    --action-glow-text: var(--ink);
}

[data-theme="dark"] .hero-search button {
    --action-glow-surface: var(--amber);
    --action-glow-hover: #ffd166;
    --action-glow-text: #111827;
}

[data-theme="dark"] .button-whatsapp {
    --action-glow-surface: #16805c;
    --action-glow-hover: var(--green);
}

[data-theme="dark"] .quote-remove {
    --action-glow-surface: #b42318;
    --action-glow-hover: var(--red);
}

.global-search button,
.hero-search button {
    position: static;
    z-index: auto;
    display: block;
    min-height: auto;
    border: 0 !important;
    border-radius: 0;
    overflow: visible;
    text-decoration: none;
    white-space: nowrap;
}

.global-search button::before,
.global-search button::after,
.hero-search button::before,
.hero-search button::after {
    content: none;
}

.global-search button {
    padding: 0 22px;
    background: var(--blue) !important;
    color: #fff !important;
    font-weight: 700;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.global-search button:hover,
.global-search button:focus {
    background: var(--blue-dark) !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(23, 78, 166, 0.22) !important;
    outline: none;
    transform: translateY(-1px);
}

.global-search button:active {
    transform: translateY(0) scale(0.98);
}

.hero-search button {
    min-height: 44px;
    padding: 0 18px;
    background: var(--amber) !important;
    color: #111827 !important;
    font-weight: 800;
    transition: background-color 160ms ease, transform 160ms ease;
}

.hero-search button:hover,
.hero-search button:focus {
    background: var(--amber) !important;
    color: #111827 !important;
    box-shadow: none !important;
    outline: none;
    transform: none;
}

.hero-search button:active {
    transform: scale(0.98);
}

.about-hero-actions .button-ghost {
    --action-glow-surface: rgba(255, 255, 255, 0.12);
    --action-glow-hover: rgba(255, 255, 255, 0.2);
    --action-glow-text: #fff;
}

.about-hero-actions .button-ghost::after {
    border-color: rgba(255, 255, 255, 0.28);
}

/* Administracion de Blog y novedades */
.admin-published-blog-carousel .blog-carousel {
    margin-top: 20px;
}

.admin-blog-selector-thumb {
    width: 88px;
    height: 62px;
    border-radius: 12px;
    object-fit: cover;
    border: 1px solid rgba(23, 78, 166, 0.15);
}

.admin-blog-live-card {
    position: relative;
    display: grid;
    gap: 12px;
    padding-bottom: 18px;
}

.admin-blog-live-card .blog-card {
    width: 100%;
}

.admin-blog-live-media,
.admin-blog-position-map i {
    display: block;
    background: #e9eef7 var(--blog-live-image, linear-gradient(135deg, #dbe6f7, #f7c95c)) center / cover no-repeat;
}

.admin-blog-live-media {
    min-height: 190px;
}

.admin-blog-live-card .admin-brand-preview-progress {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}

.admin-blog-card-source {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    margin-bottom: 16px;
    padding: 12px;
    border: 1px solid rgba(23, 78, 166, 0.14);
    border-radius: 14px;
    background: rgba(248, 251, 255, 0.78);
}

.admin-blog-card-source img {
    width: 120px;
    height: 82px;
    border-radius: 10px;
    object-fit: cover;
}

.admin-blog-card-source div {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-blog-card-source small,
.admin-blog-card-source em {
    color: var(--muted);
    line-height: 1.35;
}

.admin-blog-card-source em {
    font-style: normal;
    font-weight: 700;
}

.admin-blog-workflow {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 70px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin: 18px 0 20px;
    padding: 14px;
    border: 1px solid rgba(23, 78, 166, 0.16);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(23, 78, 166, 0.06), rgba(255, 193, 7, 0.08));
}

.admin-blog-workflow-step {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--muted);
    text-decoration: none;
}

.admin-blog-workflow-step > b {
    display: grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 50%;
    background: rgba(23, 78, 166, 0.12);
    color: var(--blue);
    font-size: 0.88rem;
}

.admin-blog-workflow-step > span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.admin-blog-workflow-step strong,
.admin-blog-workflow-step small {
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-blog-workflow-step strong {
    color: var(--ink);
    font-size: 0.86rem;
}

.admin-blog-workflow-step small {
    color: var(--muted);
    font-size: 0.73rem;
    line-height: 1.3;
}

.admin-blog-workflow-step.is-active,
.admin-blog-workflow-step.is-complete:hover {
    border-color: rgba(23, 78, 166, 0.24);
    background: rgba(255, 255, 255, 0.7);
}

.admin-blog-workflow-step.is-active > b,
.admin-blog-workflow-step.is-complete > b {
    background: var(--blue);
    color: #fff;
}

.admin-blog-workflow-step.is-pending {
    opacity: 0.68;
}

.admin-blog-workflow-line {
    height: 2px;
    background: rgba(23, 78, 166, 0.18);
}

.admin-blog-workflow-line.is-complete {
    background: linear-gradient(90deg, var(--blue), #ffd166);
}

.admin-field-help {
    margin: -4px 0 14px;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.admin-blog-article-live {
    display: grid;
    gap: 14px;
    max-height: 620px;
    margin-top: 18px;
    padding: 16px;
    overflow: auto;
    border: 1px solid rgba(23, 78, 166, 0.14);
    border-radius: 16px;
    background: rgba(248, 251, 255, 0.8);
}

.admin-blog-create-preview .admin-blog-article-live {
    max-height: none;
    margin-top: 0;
}

.admin-blog-article-live:empty {
    display: none;
}

.admin-blog-article-live-head {
    display: grid;
    gap: 7px;
}

.admin-blog-article-live-head span {
    color: var(--blue);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.admin-blog-article-live-head h3,
.admin-blog-article-live-section h2 {
    margin: 0;
    line-height: 1.18;
}

.admin-blog-article-live-head h3 {
    font-size: clamp(1.08rem, 2vw, 1.45rem);
}

.admin-blog-create-preview .admin-blog-article-live-head h3 {
    font-size: clamp(1.35rem, 2.6vw, 2rem);
}

.admin-blog-article-live-cover {
    margin: 0;
}

.admin-blog-article-live-cover img {
    display: block;
    width: 100%;
    max-height: 360px;
    border-radius: 16px;
    object-fit: cover;
}

.admin-blog-card-secondary {
    margin-top: 16px;
    opacity: 0.82;
}

.admin-blog-article-live-head p,
.admin-blog-article-live-section p,
.admin-blog-article-live-section li,
.admin-blog-article-live-section summary {
    font-size: 0.9rem;
    line-height: 1.55;
}

.admin-blog-article-live-section {
    margin: 0;
    padding: 14px;
    border-radius: 14px;
}

.admin-blog-article-live-section .blog-section-media {
    margin-top: 12px;
}

.admin-blog-article-live-section .blog-section-media img {
    max-height: 260px;
    border-radius: 12px;
}

.admin-blog-article-live-cta {
    justify-self: start;
    padding: 10px 14px;
    border-radius: 999px;
    background: var(--blue);
    color: #fff;
    font-weight: 800;
}

.admin-blog-position-map {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.admin-blog-position-map li {
    position: relative;
    display: grid;
    grid-template-columns: 34px 56px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(23, 78, 166, 0.15);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.75);
}

.admin-blog-position-map li.is-new {
    border-color: rgba(255, 193, 7, 0.8);
    box-shadow: inset 0 0 0 1px rgba(255, 193, 7, 0.22);
}

.admin-blog-position-map li > span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 50%;
    background: var(--blue);
    color: #fff;
    font-weight: 800;
}

.admin-blog-position-map img,
.admin-blog-position-map i {
    width: 56px;
    height: 44px;
    border-radius: 9px;
    object-fit: cover;
}

.admin-blog-position-map strong {
    min-width: 0;
    overflow: hidden;
    font-size: 0.78rem;
    line-height: 1.25;
    text-overflow: ellipsis;
}

[data-theme="dark"] .admin-blog-position-map li {
    border-color: rgba(89, 215, 255, 0.24);
    background: rgba(9, 20, 40, 0.86);
}

[data-theme="dark"] .admin-blog-article-live {
    border-color: rgba(89, 215, 255, 0.22);
    background: rgba(9, 20, 40, 0.78);
}

[data-theme="dark"] .admin-blog-card-source {
    border-color: rgba(89, 215, 255, 0.22);
    background: rgba(9, 20, 40, 0.78);
}

[data-theme="dark"] .admin-blog-workflow {
    border-color: rgba(89, 215, 255, 0.24);
    background: linear-gradient(135deg, rgba(9, 20, 40, 0.78), rgba(65, 47, 10, 0.28));
}

[data-theme="dark"] .admin-blog-workflow-step.is-active,
[data-theme="dark"] .admin-blog-workflow-step.is-complete:hover {
    border-color: rgba(89, 215, 255, 0.25);
    background: rgba(9, 20, 40, 0.72);
}

@media (max-width: 980px) {
    .admin-blog-position-map {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .admin-blog-workflow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .admin-blog-workflow-line {
        width: 2px;
        height: 12px;
        margin-left: 25px;
    }

    .admin-blog-position-map {
        grid-template-columns: 1fr;
    }

    .admin-blog-selector-thumb {
        width: 68px;
        height: 52px;
    }
}

.admin-blog-content-builder {
    display: grid;
    gap: 18px;
    margin-top: 20px;
}

.admin-blog-builder-intro,
.admin-blog-builder-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.admin-blog-builder-intro {
    padding: 18px;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(23, 78, 166, 0.07), rgba(255, 193, 7, 0.08));
}

.admin-blog-builder-intro > div {
    display: grid;
    gap: 5px;
}

.admin-blog-builder-list {
    display: grid;
    gap: 14px;
    margin-bottom: 14px;
}

.admin-blog-builder-block {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(23, 78, 166, 0.18);
    border-radius: 15px;
    background: rgba(248, 251, 255, 0.82);
}

.admin-blog-builder-block-head {
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(23, 78, 166, 0.12);
}

.admin-blog-builder-block-head > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.admin-blog-builder-block-head button:disabled {
    opacity: 0.38;
    pointer-events: none;
}

.admin-blog-section-current-image {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border-radius: 12px;
    background: rgba(23, 78, 166, 0.06);
}

.admin-blog-section-current-image img {
    width: 100px;
    height: 66px;
    border-radius: 9px;
    object-fit: cover;
}

.blog-section-media {
    margin: 24px 0 0;
}

.blog-section-media img {
    display: block;
    width: 100%;
    max-height: 520px;
    border-radius: 18px;
    object-fit: cover;
}

[data-theme="dark"] .admin-blog-builder-intro,
[data-theme="dark"] .admin-blog-builder-block {
    border-color: rgba(89, 215, 255, 0.24);
    background: rgba(9, 20, 40, 0.82);
}

[data-theme="dark"] .admin-blog-section-current-image {
    background: rgba(89, 215, 255, 0.08);
}

@media (max-width: 700px) {
    .admin-blog-card-source {
        grid-template-columns: 1fr;
    }

    .admin-blog-card-source img {
        width: 100%;
        height: 160px;
    }

    .admin-blog-builder-intro,
    .admin-blog-builder-block-head {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-blog-builder-block-head > div {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-blog-builder-block-head .button-danger {
        grid-column: 1 / -1;
    }
}

.admin-product-related-field {
    display: grid;
    align-content: start;
    gap: 8px;
    min-width: 0;
}

.admin-product-related-link {
    justify-self: start;
}

.admin-services-editor {
    display: grid;
    gap: 20px;
}

.admin-services-list {
    display: grid;
    gap: 10px;
}

.admin-service-edit-item {
    display: grid;
    grid-template-columns: 34px minmax(180px, 0.7fr) minmax(260px, 1.3fr) auto;
    align-items: end;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}

.admin-service-edit-item > span {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    align-self: center;
    border-radius: 50%;
    background: var(--blue);
    color: #fff;
    font-size: 0.76rem;
    font-weight: 900;
}

@media (max-width: 820px) {
    .admin-service-edit-item {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .admin-service-edit-item .admin-field,
    .admin-service-edit-item .button-danger {
        grid-column: 2;
    }
}

[data-theme="dark"] .admin-service-edit-item {
    background: #142238;
}

/* Indicador uniforme para los carruseles de contenido de la portada. */
.category-carousel-dots,
.industry-dots,
.product-carousel-dots,
.blog-carousel-dots {
    gap: 6px;
}

.category-carousel-dots button,
.industry-dots button,
.product-carousel-dots button,
.blog-carousel-dots button,
[data-theme="dark"] .category-carousel-dots button,
[data-theme="dark"] .industry-dots button,
[data-theme="dark"] .product-carousel-dots button,
[data-theme="dark"] .blog-carousel-dots button {
    --carousel-progress-track: rgba(23, 78, 166, 0.2);
    --carousel-progress-fill: #ffd166;
    width: 34px;
    height: 5px;
    background: var(--carousel-progress-track);
    transition: width 160ms ease;
}

.category-carousel-dots button.is-active,
.category-carousel-dots button.is-progressing,
.category-carousel-dots button:hover,
.category-carousel-dots button:focus,
.industry-dots button.is-active,
.industry-dots button.is-progressing,
.industry-dots button:hover,
.industry-dots button:focus,
.product-carousel-dots button.is-active,
.product-carousel-dots button.is-progressing,
.product-carousel-dots button:hover,
.product-carousel-dots button:focus,
.blog-carousel-dots button.is-active,
.blog-carousel-dots button.is-progressing,
.blog-carousel-dots button:hover,
.blog-carousel-dots button:focus {
    width: 48px;
    background: var(--carousel-progress-track);
    outline: none;
}