/* KREPOST / VIOLET CORE — digital identity 01, September 2026.
   Layout lives in site.css. This file owns the palette and branded surfaces. */
:root {
  color-scheme: dark;
  --brand-violet: #8055f6;
  --brand-cobalt: #6899ff;
  --bg: #090911;
  --surface: #12121e;
  --surface-raised: #1b1b2b;
  --text: #f4f4fa;
  --muted: #b0b2c8;
  --accent: #b49aff;
  --action: #7541e8;
  --action-hover: #6530d4;
  --cobalt: #82aaff;
  --border: #343448;
  --soft-accent: #a084f514;
  --header: #090911eb;
  --hero-shade: #090911;
  --hero-art: url('/assets/violet-core-dark.webp');
  --panel: #12131f;
  --panel-raised: #1c1d30;
  --panel-text: #f4f4fa;
  --panel-muted: #b8bed3;
  --navy: #12131f;
  --blue: var(--accent);
  --slate: var(--muted);
  --paper: var(--surface);
  --line: var(--border);
}
:root[data-theme='light'] {
  color-scheme: light;
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-raised: #edeef5;
  --text: #14141f;
  --muted: #596174;
  --accent: #6935c9;
  --action: #7541e8;
  --action-hover: #6530d4;
  --cobalt: #365dbb;
  --border: #d8dbe8;
  --soft-accent: #7541e80a;
  --header: #f6f7fbed;
  --hero-shade: #f6f7fb;
  --hero-art: url('/assets/violet-core-light.webp');
}
body { background: var(--bg); color: var(--text); }
p, .muted { color: var(--muted); }
:focus-visible { outline-color: var(--accent); }
::selection { background: #8055f64d; color: var(--text); }
.container { width: min(1280px, calc(100% - 80px)); }
.section { padding: 104px 0; }
.button { border-radius: 8px; }
.button.primary { background: var(--action); color: #fff; box-shadow: 0 5px 28px #7541e829, inset 0 1px 0 #ffffff26; }
.button.primary:hover { background: var(--action-hover); box-shadow: 0 8px 32px #7541e838; }
.button.secondary { background: var(--surface); color: var(--text); border-color: var(--border); }
.button.secondary:hover { background: var(--surface-raised); border-color: var(--accent); }
.button.white { background: #f4f4fa; color: #14141f; }
.button.white:hover { background: #dfd8f8; }
.tag { color: var(--muted); border-color: var(--border); background: var(--surface-raised); }
.tag.blue { color: var(--accent); border-color: var(--border); background: var(--soft-accent); }
.tag.dark { color: #d1c5f5; border-color: #4a4163; background: #af88ff0b; }

/* Navigation and exact, unmodified original logo variants. */
.site-header { background: var(--header); border-color: var(--border); }
.nav { height: 88px; gap: 24px; }
.nav-actions { gap: 18px; }
.nav-cta { padding-inline: 18px; }
.brand-images { display: inline-flex; align-items: center; }
.logo-on-light { display: none; }
:root[data-theme='light'] .logo-on-dark { display: none; }
:root[data-theme='light'] .logo-on-light { display: block; }
#navigation { gap: 24px; }
#navigation>a { color: var(--muted); font-weight: 400; }
#navigation>a:hover, #navigation>a[aria-current=page] { color: var(--text); }
#navigation>a[aria-current=page]::after { background: var(--accent); }
.language-switch, .language-switch button { color: var(--muted); }
.language-switch button[aria-pressed=true] { color: var(--text); }
.theme-toggle { display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); }
.theme-toggle:hover { border-color: var(--accent); background: var(--surface-raised); }
.theme-toggle span { font-size: 23px; line-height: 1; }
.menu-toggle span { background: var(--text); }
.theme-mark { display: inline-flex; flex-shrink: 0; }

/* Approved 01 hero. The bitmap is decoration; all content stays real HTML. */
.home-hero { position: relative; isolation: isolate; overflow: hidden; padding: 0; background: var(--bg); }
.hero-scene { position: absolute; inset: 0; z-index: -2; background: var(--hero-art) center center / cover no-repeat; }
.home-hero::after { position: absolute; inset: 0; content: ''; z-index: -1; background: linear-gradient(90deg, var(--hero-shade) 0%, transparent 64%), linear-gradient(0deg, var(--hero-shade), transparent 12%); pointer-events: none; }
.home-hero>.container { min-height: 640px; display: flex; align-items: center; padding-block: 90px 105px; }
.hero-copy { width: 51%; max-width: 660px; }
.hero-copy .eyebrow { color: var(--accent); margin-bottom: 24px; letter-spacing: .2em; }
.home-hero h1 { font-size: clamp(42px, 4.8vw, 72px); line-height: 1.09; letter-spacing: -.06em; text-wrap: initial; }
.hero-line { display: block; }
.hero-copy h1 .gradient-text { color: var(--accent); background: none; -webkit-text-fill-color: currentColor; }
.hero-copy .lead { max-width: 450px; font-size: 18px; line-height: 1.75; margin-top: 28px; }
.hero-copy .hero-actions { display: flex; flex-direction: row; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero-copy .button { min-height: 50px; }
.hero-copy .button.secondary { background: transparent; }
.hero-caption { display: block; margin-top: 29px; color: var(--muted); font: 11px/1.6 ui-monospace, monospace; letter-spacing: .16em; }
.capability-rail { position: relative; border-block: 1px solid var(--border); background: var(--bg); }
.capability-rail>.container { display: grid; grid-template-columns: repeat(3, 1fr); padding-block: 27px; }
.capability-rail a { display: flex; gap: 18px; padding: 0 28px; border-right: 1px solid var(--border); align-items: flex-start; }
.capability-rail a:first-child { padding-left: 0; }
.capability-rail a:last-child { padding-right: 0; border: 0; }
.capability-rail a>span { font: 12px/1.9 ui-monospace, monospace; color: var(--accent); }
.capability-rail strong { display: block; color: var(--text); font-size: 17px; font-weight: 600; }
.capability-rail p { font-size: 13px; line-height: 1.65; margin-top: 6px; }
.capability-rail a:hover strong { color: var(--accent); }
.product-section { position: relative; background: radial-gradient(ellipse at 90% 45%, var(--soft-accent), transparent 65%); border-bottom: 1px solid var(--border); }
.product-section .live-shell { margin-top: 0; scroll-margin-top: 106px; }
.product-section .section-heading { margin-bottom: 36px; }
.live-label { color: var(--muted); }
.live-label::before { background: var(--accent); }
.demo-panel { border: 1px solid #42405a; border-radius: 12px; box-shadow: 0 24px 80px #05050a24, 0 0 45px #8055f609; background: var(--panel); }
.demo-top { background: #181925; }
.demo-title>div>span, .demo-mode-note, .demo-bottom, .demo-metrics span, .demo-metrics small { color: var(--panel-muted); }
.demo-controls .segmented { background: #0b0c14; border-color: #373649; }
.demo-controls .segment { color: #b8bed3; }
.demo-controls .segment[aria-pressed=true] { background: #6545a1; color: #fff; }
.mode-select select { background: #232237; border-color: #45415c; color: #f4f4fa; }
.demo-bottom { background: #0c0d15; }
.demo-running::before { background: #b49aff; box-shadow: 0 0 10px #8055f6; }
.chart-legend>span::before { background: #b49aff; }
.chart-legend .series-risk::before { background: #82aaff; }
.intensity input { accent-color: #b49aff; }
.signal-icon { border-color: #8055f680; color: #c5adff; }
.signal-event small { color: #c5adff; }
.signal-event:hover { background: #8055f60a; }
.grid-surface { background: radial-gradient(ellipse at 80% 0, var(--soft-accent), transparent 60%), var(--bg); }
.grid-surface::before { background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); opacity: .17; }
.gradient-text { color: var(--accent); background: none; -webkit-text-fill-color: currentColor; }
.soft-section, .resources-section { background: var(--surface); border-block: 1px solid var(--border); }
.feature-bento { gap: 20px; }
.bento { border-color: var(--border); background: var(--surface); border-radius: 12px; }
.bento:hover { border-color: #8055f66b; box-shadow: 0 12px 45px #8055f611; }
.bento-inventory { background: radial-gradient(ellipse at 85% 85%, var(--soft-accent), transparent 70%), var(--surface); }
.inventory-preview { background: var(--surface-raised); border-color: var(--border); box-shadow: 10px 18px 40px #0a081c1c; }
.inventory-preview>div { border-color: var(--border); }
.bento-ai { background: #141321; border-color: #343044; color: #f4f4fa; }
.bento-ai .eyebrow, .bento-ai .bento-link { color: #c0a6ff; }
.bento-ai p:not(.eyebrow) { color: #b8bed3; }
.token-visual { color: #b7a3d7; }
.token-visual i { background: linear-gradient(90deg,#8055f6,#82aaff); }
.policy-preview { color: var(--muted); }
.policy-check { color: var(--accent); border-color: var(--border); background: var(--soft-accent); }
.dark-section { background: #12121e; color: #f4f4fa; }
.dark-section p { color: #b8bed3; }
.dark-section .eyebrow { color: #b49aff; }
.session-card, .ai-inspector { background: #171726; border-color: #403a55; border-radius: 12px; }
.session-message { background: #24223a; border-color: #403a55; }
.session-message>span { color: #c3afeb; }
.session-message.response { background: #ffffff04; border-color: #ffffff14; }
.session-facts>div>span, .session-card>.small { color: #b8bed3; }
.inspector-tabs>span { background: #553a86; color: #e5d8ff; }
.inspector-finding { border-color: #b49aff; background: #8055f610; color: #e1d8f6; }
.inspector-finding.review { border-color: #82aaff; }

/* Product pages, architecture, resources and forms share the same surfaces. */
.architecture-widget { background: radial-gradient(ellipse at 50% 40%,var(--soft-accent),transparent 80%), var(--surface); border-color: var(--border); border-radius: 12px; }
.architecture-tabs { background: var(--surface-raised); border-color: var(--border); }
.architecture-tabs .segment { color: var(--muted); }
.architecture-tabs .segment[aria-pressed=true], .architecture-tabs .segment:hover { color: var(--accent); background: var(--surface); }
.path-node { background: var(--surface-raised); border-color: var(--border); box-shadow: none; border-radius: 8px; }
.gateway-node { background: var(--soft-accent); border-color: #8055f675; }
.node-icon, .sensor-node small { color: var(--muted); }
.path-connector, .workflow-line { background: #9472cc; }
.path-connector::after { border-color: #9472cc; }
.mirror-line { border-color: #9472cc; }
.mirror-line::after { background: #a786e4; }
.architecture-description { color: var(--muted); }
.architecture-comparison caption, .table-scroll caption { color: var(--text); }
.architecture-comparison thead, .table-scroll thead { background: var(--surface-raised); }
.architecture-comparison td, .table-scroll td { color: var(--muted); }
.platform-tab { color: var(--muted); }
.platform-tab:hover { background: var(--soft-accent); }
.check-list li { color: var(--muted); }
.data-card { border-color: var(--border); background: var(--surface); border-radius: 12px; }
.data-card-top { background: var(--surface-raised); }
.data-row, .data-card-foot { border-color: var(--border); }
.data-card-foot { color: var(--muted); }
.code-card { background: var(--panel); color: #e2d8f8; }
.code-card>span { color: #b8bed3; }
.code-highlight { color: #c3a9ff; }
.workflow-targets>span, .tech-tags span { border-color: var(--border); background: var(--surface); color: var(--muted); }
.three-columns article { border-color: var(--border); }
.three-columns article>span { color: var(--accent); }

/* Product scope uses the same surfaces and contrast in both themes. */
.product-note { margin-top: 32px; padding: 20px 24px; border-left: 3px solid var(--accent); background: var(--surface-raised); color: var(--muted); font-size: 14px; }
.coverage-table { margin-top: 0; }
.coverage-table th:first-child { width: 25%; }
.coverage-table td { width: 37.5%; }
.coverage-label { display: none; }
.coverage-table:focus-visible, .product-faq summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.product-faq { border-top: 1px solid var(--border); }
.product-faq details { padding: 24px 0; border-bottom: 1px solid var(--border); }
.product-faq summary { cursor: pointer; font-size: 18px; font-weight: 600; color: var(--text); }
.product-faq summary::marker { color: var(--accent); }
.product-faq details p { max-width: 900px; margin-top: 18px; padding-left: 22px; color: var(--muted); }

@media (max-width: 600px) {
  .product-note { padding: 18px; }
  .coverage-table table, .coverage-table tbody, .coverage-table tr, .coverage-table th, .coverage-table td { display: block; width: 100%; min-width: 0; }
  .coverage-table caption { display: block; }
  .coverage-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .coverage-table tbody tr { padding: 20px; margin-top: 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
  .coverage-table th:first-child { width: 100%; }
  .coverage-table tbody th, .coverage-table td { padding: 0; border: 0; font-size: 14px; }
  .coverage-table tbody th { padding-bottom: 4px; font-size: 16px; }
  .coverage-table td { padding-top: 16px; }
  .coverage-label { display: block; margin-bottom: 5px; color: var(--text); font-size: 12px; font-weight: 600; }
  .product-faq summary { font-size: 16px; }
  .product-faq details p { font-size: 14px; padding-left: 0; }
}
.scenario-choice { border-color: var(--border); }
.scenario-choice[aria-pressed=true], .scenario-choice:hover { background: var(--soft-accent); color: var(--accent); border-color: var(--accent); }
.article-card { background: var(--bg); border-color: var(--border); border-radius: 10px; }
.article-card:hover { border-color: #8055f675; box-shadow: 0 15px 40px #8055f610; }
.article-visual { background-image: var(--hero-art); background-size: 180% auto; background-position: 80% 48%; background-color: var(--bg); }
.visual-1 { background-size: 230% auto; background-position: 88% 35%; }
.visual-2 { background-size: 300% auto; background-position: 68% 74%; }
.article-mini { display: none; }
.article-meta { color: var(--muted); }
.filter-button { color: var(--muted); border-color: var(--border); border-radius: 6px; }
.filter-button[aria-pressed=true] { color: #fff; background: var(--action); border-color: var(--action); }
.filter-button:hover { border-color: var(--accent); }
.article-hero { background: var(--surface); border-color: var(--border); }
.back-link, .byline, .article-toc a, .article-content p, .article-content li, .legal-content p, .legal-content li { color: var(--muted); }
.article-cta p { color: var(--text); }
.article-toc { border-color: var(--border); }
.article-toc a:hover, .article-sources a, .legal-sources a { color: var(--accent); }
.takeaways, .article-cta { background: var(--surface-raised); border-color: var(--border); }
.takeaways ul { color: var(--muted); }
.legal-draft { background: var(--soft-accent); border-color: var(--border); color: var(--muted); }
.contact-steps>div>span { color: var(--accent); }
.contact-form { background: var(--surface); border-color: var(--border); border-radius: 12px; box-shadow: 0 20px 65px #8055f609; }
.field input, .field textarea { color: var(--text); background: var(--bg); border-color: var(--border); }
.field textarea::placeholder { color: var(--muted); }
.field input:focus, .field textarea:focus { box-shadow: 0 0 0 3px #8055f622; }
.captcha-area { background: var(--surface-raised); border-color: var(--border); }
.contact-status { color: var(--text); background: var(--surface-raised); border-color: var(--border); }
.contact-status.error { color: #ffc1be; background: #3b202a; border-color: #89515d; }
.contact-status.success { color: #dcceff; background: #2a2340; border-color: #695488; }
:root[data-theme='light'] .contact-status.error { color: #8f332a; background: #fff4f3; border-color: #edcbc8; }
:root[data-theme='light'] .contact-status.success { color: #593198; background: #f1ebff; border-color: #cbb7eb; }
.cookie-banner { background: var(--surface); color: var(--text); border-color: var(--border); box-shadow: 0 12px 50px #0003; }
.dialog { background: var(--surface); color: var(--text); border-color: var(--border); border-radius: 12px; }
.dialog::backdrop { background: #090911a3; }
.close-button { border-color: var(--border); }
.close-button:hover { background: var(--surface-raised); }
.consent-option input:checked { background: var(--action); }
.dialog>.small a, .event-dialog dt { color: var(--muted); }
.event-code { background: var(--panel); color: #e1d8f6; }
.event-code>span { color: #b8bed3; }

/* Footer is themed, with a violet light motif confined to the call to action. */
.site-footer { background: var(--bg); color: var(--text); border-top: 1px solid var(--border); }
.footer-intro { position: relative; border-color: var(--border); }
.footer-intro::after { content: ''; position: absolute; bottom: 25px; right: 3%; width: 48%; height: 1px; pointer-events: none; background: linear-gradient(90deg,transparent,#8055f660,#6899ff88,transparent); box-shadow: 0 8px 26px #8055f638; }
.footer-intro .eyebrow { color: var(--accent); }
.footer-brand p, .footer-grid nav>a, .footer-bottom, .footer-control { color: var(--muted); }
.footer-email { color: var(--text); }
.footer-email:hover, .footer-grid nav>a:hover, .footer-bottom a:hover, .footer-control:hover { color: var(--accent); }
.footer-bottom { border-color: var(--border); }

/* Six footer destinations groups, with a separate brand row. */
.site-footer .footer-brand { display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; align-items: center; gap: 32px; padding: 32px 0; border-bottom: 1px solid var(--border); }
.site-footer .footer-brand>.brand, .site-footer .footer-brand p { grid-column: auto; grid-row: auto; margin: 0; }
.site-footer .footer-brand p { max-width: 460px; }
.site-footer .footer-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px; }
.footer-grid nav { min-width: 0; }
.footer-grid nav h3 { color: var(--text); letter-spacing: .07em; }
.footer-grid nav>a, .footer-grid nav>.footer-control { display: block; text-align: left; font-size: 12px; line-height: 1.7; margin-top: 13px; overflow-wrap: anywhere; }
.footer-grid nav>a[aria-current=page] { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }

/* Shared editorial layout for platform, industry, trust and policy pages. */
.content-layout { display: grid; grid-template-columns: 225px minmax(0, 1fr); gap: 70px; padding-top: 56px; padding-bottom: 80px; align-items: start; }
.content-toc { position: sticky; top: 120px; padding-left: 18px; border-left: 2px solid var(--border); }
.content-toc strong { display: block; margin-bottom: 18px; font-size: 13px; }
.content-toc a { display: block; color: var(--muted); font-size: 13px; line-height: 1.6; margin: 13px 0; }
.content-toc a:hover { color: var(--accent); }
.content-prose { min-width: 0; }
.content-prose section { margin-bottom: 40px; scroll-margin-top: 120px; }
.content-prose h2 { font-size: clamp(23px, 2.2vw, 32px); margin-bottom: 20px; line-height: 1.25; }
.content-prose p, .content-prose li, .glossary-grid dd { color: var(--muted); font-size: 16px; line-height: 1.85; }
.content-prose p+p { margin-top: 16px; }
.content-prose ul { padding-left: 22px; }
.content-prose li+li { margin-top: 12px; }
.content-notice { padding: 22px 24px; border-left: 3px solid var(--accent); background: var(--surface-raised); margin-bottom: 36px; }
.content-prose .content-notice { font-size: 14px; }
.content-sources a { color: var(--accent); text-underline-offset: 4px; text-decoration: underline; overflow-wrap: anywhere; }
.content-related { padding-top: 28px; border-top: 1px solid var(--border); }
.content-related>div { display: flex; flex-wrap: wrap; gap: 12px; }
.related-link { display: inline-flex; align-items: center; padding: 13px 16px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--accent); font-size: 14px; }
.related-link:hover { background: var(--surface-raised); border-color: var(--accent); }
.content-articles-title { margin-bottom: 32px; }
.glossary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.glossary-grid>div { padding: 22px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.glossary-grid dt { margin-bottom: 12px; font-size: 17px; font-weight: 600; }
.glossary-grid dd { margin: 0; font-size: 14px; }
.reference-table { margin-top: 24px; }
.reference-table th, .reference-table td { padding: 16px; }

@media (max-width: 1100px) {
  .site-footer .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
  .content-layout { grid-template-columns: 195px minmax(0, 1fr); gap: 40px; }
}
@media (max-width: 850px) {
  .site-footer .footer-brand { grid-template-columns: 1fr 1fr; gap: 18px 30px; }
  .site-footer .footer-brand p { grid-column: 2; grid-row: 1 / 3; }
  .content-layout { display: block; padding-top: 36px; padding-bottom: 45px; }
  .content-toc { position: static; margin-bottom: 36px; }
  .content-toc a { display: inline-block; margin: 0 20px 12px 0; }
}
@media (max-width: 600px) {
  .site-footer .footer-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
  .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
  .content-prose p, .content-prose li { font-size: 15px; }
  .content-notice { padding: 18px; }
  .content-prose section { margin-bottom: 32px; }
  .glossary-grid { grid-template-columns: 1fr; }
  .reference-table th, .reference-table td { padding: 0; }
  .reference-table td { padding-top: 16px; }
}

@media (min-width: 1700px) { .hero-scene { background-size: 1700px auto; } }
@media (max-width: 1100px) {
  .container { width: calc(100% - 56px); }
  .nav-actions { gap: 14px; }
  .home-hero>.container { min-height: 590px; padding-block: 78px 92px; }
  .hero-copy { width: 54%; }
  .home-hero h1 { font-size: clamp(40px,5vw,56px); }
  .hero-copy .lead { font-size: 16px; }
  .hero-copy .button { padding-inline: 17px; font-size: 13px; }
  .capability-rail a { padding-inline: 20px; gap: 12px; }
}
@media (max-width: 850px) {
  .container { width: calc(100% - 40px); }
  .section { padding: 76px 0; }
  .nav { height: 78px; gap: 14px; }
  .nav-actions { gap: 12px; }
  #navigation { background: var(--surface); border-color: var(--border); }
  #navigation>a { border-color: var(--border); }
  .home-hero>.container { min-height: 580px; padding-block: 66px 90px; }
  .hero-copy { width: 58%; }
  .hero-scene { opacity: .78; background-position: 53% center; }
  .home-hero::after { background: linear-gradient(90deg,var(--hero-shade) 7%,transparent 88%),linear-gradient(0deg,var(--hero-shade),transparent 20%); }
  .home-hero h1 { font-size: clamp(39px,5.9vw,50px); }
  .hero-copy .lead { max-width: 340px; }
  .hero-copy .hero-actions { gap: 10px; }
  .capability-rail strong { font-size: 15px; }
  .capability-rail p { font-size: 12px; }
  .capability-rail a>span { display: none; }
}
@media (max-width: 600px) {
  .home-hero>.container { min-height: 740px; padding-block: 44px 350px; align-items: flex-start; }
  .hero-copy { width: 100%; max-width: none; }
  .hero-copy h1 { font-size: clamp(35px,8.8vw,51px); letter-spacing: -.055em; }
  .hero-copy .eyebrow { margin-bottom: 20px; font-size: 11px; }
  .hero-copy .lead { max-width: 370px; font-size: 16px; margin-top: 22px; }
  .hero-copy .hero-actions { margin-top: 26px; }
  .hero-copy .button { font-size: 12px; min-height: 46px; padding-inline: 15px; gap: 12px; }
  .hero-caption { margin-top: 23px; font-size: 10px; }
  .hero-scene { opacity: 1; inset: auto 0 0; height: 365px; background-size: 650px auto; background-position: 77% bottom; }
  .home-hero::after { background: linear-gradient(0deg,var(--hero-shade),transparent 7%,transparent 37%,var(--hero-shade) 53%); }
  .capability-rail>.container { grid-template-columns: 1fr; padding-block: 8px; }
  .capability-rail a, .capability-rail a:first-child, .capability-rail a:last-child { padding: 18px 0; border: 0; border-bottom: 1px solid var(--border); gap: 16px; }
  .capability-rail a:last-child { border: 0; }
  .capability-rail a>span { display: block; }
  .capability-rail strong { font-size: 16px; }
  .capability-rail p { margin-top: 3px; font-size: 13px; }
}
@media (max-width: 540px) {
  .container { width: calc(100% - 36px); }
  .section { padding: 62px 0; }
  .nav { gap: 6px; }
  .nav-actions { gap: 8px; }
  .brand img { width: 174px; height: 63px; }
  .language-switch { gap: 1px; }
  .language-switch button { min-width: 22px; }
  .theme-toggle { width: 34px; height: 36px; flex-basis: 34px; }
  .theme-toggle span { font-size: 22px; }
  .demo-panel { border-radius: 10px; box-shadow: 0 15px 40px #0002; }
  .footer-intro::after { width: 100%; right: 0; bottom: 12px; }
}
@media (max-width: 359px) {
  .nav-actions { gap: 3px; }
  .brand img { width: 164px; }
  .language-switch { gap: 0; }
  .language-switch>span { display: none; }
  .language-switch button { min-width: 20px; font-size: 11px; }
  .theme-toggle { width: 32px; flex-basis: 32px; }
  .menu-toggle { width: 32px; }
  .hero-copy .button { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}