
:root {
  --bg: #0B1D33;
  --surface: #102842;
  --text: #F2F4F6;
  --muted: #A9BBC6;
  --primary: #F2F4F6;
  --accent: #C47A3A;
  --line: rgba(17, 24, 39, 0.12);
  --radius: 24px;
  --container: min(1120px, calc(100% - 32px));
}
* { box-sizing: border-box; }
html { font-size: 100%; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
a { color: inherit; }
h1, h2, h3 { line-height: 1.08; letter-spacing: -0.035em; }
h1 { font-size: clamp(2.25rem, 4vw, 4.25rem); margin: 0 0 22px; }
h2 { font-size: clamp(1.7rem, 2.8vw, 2.7rem); margin: 0 0 16px; }
h3 { font-size: clamp(1.1rem, 1.5vw, 1.35rem); }
p { margin-top: 0; }
.skip-link { position: absolute; left: 16px; top: -48px; background: var(--text); color: white; padding: 10px 14px; border-radius: 999px; }
.skip-link:focus { top: 16px; }
.container { width: var(--container); margin-inline: auto; }
.narrow { max-width: 780px; }
.site-header { position: sticky; top: 0; z-index: 10; background: color-mix(in srgb, var(--bg) 86%, white); border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); }
.nav { min-height: 72px; display: flex; align-items: center; justify-content: space-between; width: var(--container); margin-inline: auto; gap: 16px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 850; text-decoration: none; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: var(--text); color: white; }
.brand-logo { width: auto; max-width: 148px; height: 38px; object-fit: contain; }
.nav-menu { display: flex; align-items: center; gap: 20px; }
.nav-menu a { text-decoration: none; color: var(--muted); font-weight: 700; }
.nav-menu .nav-cta { color: white; background: var(--primary); padding: 10px 14px; border-radius: 999px; }
.language-switch { display: inline-flex; align-items: center; gap: 7px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; font-size: 0.76rem; line-height: 1; }
.language-switch a { min-width: 24px; padding: 5px 3px; text-align: center; }
.language-switch a[aria-current="page"] { color: var(--text); }
.language-switch span { color: var(--muted); }
.nav-toggle { display: none; }
.nav-dropdown { position: relative; }
.nav-dropdown-toggle { display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 0; border: 0; background: transparent; color: var(--muted); font: inherit; font-weight: 700; cursor: pointer; }
.nav-dropdown-toggle span { display: inline-block; font-size: 1rem; line-height: 1; transition: transform 160ms ease; }
.nav-dropdown-toggle[aria-expanded="true"] span { transform: rotate(180deg); }
.nav-submenu { position: absolute; z-index: 12; top: calc(100% + 12px); left: -16px; display: none; min-width: 208px; padding: 8px; border: 1px solid rgba(242, 244, 246, 0.2); background: #102842; box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25); }
.nav-submenu.is-open { display: block; }
.nav-submenu a { display: block; padding: 10px 12px; color: #f2f4f6; text-decoration: none; white-space: nowrap; }
.nav-submenu a:hover, .nav-submenu a:focus-visible { background: rgba(242, 244, 246, 0.1); }
.nav-submenu a[aria-current="page"] { background: rgba(196, 122, 58, 0.2); color: #fff; }
.nav-dropdown-toggle:focus-visible, .nav-submenu a:focus-visible { outline: 2px solid #c47a3a; outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.hero, .section { padding: 88px 0; }
.hero-grid, .split, .footer-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 44px; align-items: center; }
.eyebrow { color: var(--primary); text-transform: uppercase; letter-spacing: 0.14em; font-size: 0.78rem; font-weight: 850; }
.hero-text { color: var(--muted); font-size: clamp(1.1rem, 2vw, 1.35rem); max-width: 720px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 18px; border-radius: 999px; font-weight: 850; text-decoration: none; border: 0; cursor: pointer; }
.button.primary { background: var(--primary); color: white; }
.button.secondary { border: 1px solid var(--line); background: var(--surface); }
.hero-card, .final-card, details, .contact-form { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 28px; box-shadow: 0 18px 60px rgba(17, 24, 39, 0.08); }
.hero-card span, .split p, .site-footer p { color: var(--muted); }
ul { padding-left: 1.2rem; }
details { margin-bottom: 12px; }
summary { cursor: pointer; font-weight: 850; }
.final-cta { padding-top: 24px; }
.contact-form { display: grid; gap: 14px; margin: 24px 0; }
.contact-form label { display: grid; gap: 6px; font-weight: 750; }
.booking-panel { max-width: 680px; margin: 28px 0; padding: 32px; border: 1px solid var(--line); background: var(--surface); border-radius: 5px; }
.booking-panel h2 { margin: 0 0 14px; }
.booking-panel p { color: var(--muted); }
.company-details { max-width: 680px; margin-top: 38px; padding-top: 22px; border-top: 1px solid var(--line); }
.company-details .eyebrow { margin-bottom: 10px; }
.company-details strong { display: block; font-size: 1.05rem; }
.company-details address { margin: 8px 0; color: var(--muted); font-style: normal; }
.company-details p:last-child { margin: 0; color: var(--muted); font-size: 0.9rem; }
input, textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; font: inherit; }
textarea { min-height: 130px; }
code { padding: 0.15rem 0.35rem; border-radius: 8px; background: color-mix(in srgb, var(--muted) 14%, transparent); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: 0.95rem; }
th, td { padding: 12px 14px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
th { background: color-mix(in srgb, var(--primary) 9%, transparent); color: var(--text); }
.site-footer { padding: 48px 0; border-top: 1px solid var(--line); }
.site-footer a { display: block; color: var(--muted); }
.copyright { width: var(--container); margin: 24px auto 0; color: var(--muted); }
.media-grid, .pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; }
.media-card, .pricing-card { margin: 0; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.media-card img, .media-card video { display: block; width: 100%; border-radius: 14px; background: var(--text); }
.media-card figcaption, .pricing-disclaimer, .pricing-card p { color: var(--muted); }
.media-card figcaption { margin-top: 10px; font-size: 0.94rem; }
.pricing-grid { margin-top: 28px; }
.pricing-card { display: flex; flex-direction: column; align-items: flex-start; }
.pricing-card--featured { border-color: var(--primary); box-shadow: 0 18px 60px rgba(17, 24, 39, 0.1); }
.pricing-card__price { margin: 12px 0; color: var(--text) !important; font-size: 1.8rem; font-weight: 850; }
.pricing-card__price span { color: var(--muted); font-size: 0.95rem; font-weight: 650; }
.pricing-card .button { margin-top: auto; }
.stripe-pricing-table { margin-top: 28px; }


.site-variant--brand-rails { background: #0b1d33; color: #f2f4f6; }
.site-header--brand-rails { background: rgba(11, 29, 51, 0.9); border-bottom-color: rgba(242, 244, 246, 0.16); backdrop-filter: blur(18px); }
.site-header--brand-rails .brand { color: #f2f4f6; letter-spacing: 0.08em; text-transform: uppercase; }
.site-header--brand-rails .brand-mark { background: #f2f4f6; color: #0b1d33; border-radius: 4px; }
.site-header--brand-rails .nav-menu a { color: #dbe5e9; }
.site-header--brand-rails .nav-dropdown-toggle { color: #dbe5e9; }
.site-header--brand-rails .language-switch { border-color: rgba(242, 244, 246, 0.28); }
.site-header--brand-rails .language-switch a[aria-current="page"] { color: #fff; }
.site-header--brand-rails .nav-menu .nav-cta { background: #c47a3a; color: #0b1d33; border-radius: 4px; }
.site-variant--brand-rails .page .button.primary, .site-variant--brand-rails .booking-panel .button.primary { background: #c47a3a; color: #0b1d33; }
.talenta-rails-home { background: #0b1d33; color: #f2f4f6; }
.rails-hero { position: relative; padding: 104px 0 28px; overflow: hidden; }
.rails-hero::before { position: absolute; inset: auto -10% 0 46%; height: 1px; background: rgba(242, 244, 246, 0.2); content: ""; }
.rails-hero-grid { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(430px, 1.18fr); gap: clamp(48px, 9vw, 150px); align-items: center; }
.rails-hero-copy { max-width: 610px; }
.rails-overline { margin: 0 0 22px; color: #c47a3a; font-size: 0.76rem; font-weight: 850; letter-spacing: 0.15em; line-height: 1.35; text-transform: uppercase; }
.rails-hero h1 { width: calc(100% + 28px); max-width: 668px; margin: 0 0 26px; color: #f2f4f6; font-size: clamp(2.45rem, 3.2vw, 3.35rem); font-weight: 720; line-height: 1.02; letter-spacing: -0.055em; text-wrap: balance; }
.rails-hero-copy > p:not(.rails-overline) { max-width: 580px; margin: 0; color: #a9bbc6; font-size: clamp(1.08rem, 1.5vw, 1.28rem); line-height: 1.6; }
.talenta-rails-home .hero-actions { margin-top: 30px; }
.talenta-rails-home .button { border-radius: 4px; }
.talenta-rails-home .button.primary { background: #c47a3a; color: #0b1d33; }
.talenta-rails-home .button.secondary { border-color: rgba(242, 244, 246, 0.34); background: transparent; color: #f2f4f6; }
.talenta-hero-workflow { position: relative; min-height: 480px; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.2); background: radial-gradient(circle at 53% 50%, rgba(43, 93, 115, 0.5), transparent 31%), linear-gradient(135deg, #071729, #102842); }
.talenta-hero-workflow::before, .talenta-hero-workflow::after { position: absolute; z-index: 0; border: 1px solid rgba(196, 122, 58, 0.32); border-radius: 50%; content: ""; }
.talenta-hero-workflow::before { width: 330px; height: 330px; top: 74px; left: 27%; animation: hero-workflow-orbit 14s linear infinite; }
.talenta-hero-workflow::after { width: 250px; height: 250px; top: 114px; left: 35%; border-color: rgba(242, 244, 246, 0.16); animation: hero-workflow-orbit 10s linear reverse infinite; }
.hero-workflow__source, .hero-workflow__core, .hero-workflow__outcome { position: absolute; z-index: 2; display: grid; gap: 5px; padding: 14px 16px; border: 1px solid rgba(242, 244, 246, 0.22); background: rgba(7, 23, 41, 0.88); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2); }
.hero-workflow__source span, .hero-workflow__core span, .hero-workflow__outcome span { color: #a9bbc6; font-size: 0.64rem; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }
.hero-workflow__source strong, .hero-workflow__core strong, .hero-workflow__outcome strong { color: #f2f4f6; font-size: 0.86rem; line-height: 1.2; }
.hero-workflow__source--message { top: 70px; left: 8%; animation: hero-workflow-float 6.5s ease-in-out infinite; }
.hero-workflow__source--document { top: 215px; left: 5%; animation: hero-workflow-float 7.5s ease-in-out -1.2s infinite; }
.hero-workflow__source--video { bottom: 63px; left: 15%; animation: hero-workflow-float 6.8s ease-in-out -2.4s infinite; }
.hero-workflow__core { top: 50%; left: 52%; width: 170px; min-height: 128px; place-content: center; transform: translate(-50%, -50%); border-color: rgba(196, 122, 58, 0.75); background: linear-gradient(145deg, rgba(43, 93, 115, 0.92), rgba(11, 29, 51, 0.96)); text-align: center; }
.hero-workflow__core span { color: #c47a3a; }
.hero-workflow__core i { width: 10px; height: 10px; margin: 7px auto 0; border-radius: 50%; background: #c47a3a; box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.65); animation: hero-workflow-core 2.8s ease-out infinite; }
.hero-workflow__outcome { right: 7%; bottom: 88px; border-color: rgba(242, 244, 246, 0.38); animation: hero-workflow-float 6.8s ease-in-out -1.7s infinite; }
.hero-workflow__outcome span { color: #c47a3a; }
.hero-workflow__signal { position: absolute; z-index: 1; width: 8px; height: 8px; border-radius: 50%; background: #c47a3a; box-shadow: 0 0 12px rgba(196, 122, 58, 0.8); opacity: 0; }
.hero-workflow__signal--one { animation: hero-workflow-signal-one 4.8s linear infinite; }
.hero-workflow__signal--two { animation: hero-workflow-signal-two 5.3s linear 1.2s infinite; }
.hero-workflow__signal--three { animation: hero-workflow-signal-three 5.7s linear 2.1s infinite; }
@keyframes hero-workflow-orbit { to { transform: rotate(360deg); } }
@keyframes hero-workflow-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes hero-workflow-core { 0% { box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.62); } 80%, 100% { box-shadow: 0 0 0 16px rgba(196, 122, 58, 0); } }
@keyframes hero-workflow-signal-one { 0% { left: 30%; top: 21%; opacity: 0; } 15% { opacity: 1; } 70% { left: 49%; top: 46%; opacity: 1; } 100% { left: 49%; top: 46%; opacity: 0; } }
@keyframes hero-workflow-signal-two { 0% { left: 28%; top: 50%; opacity: 0; } 15% { opacity: 1; } 70% { left: 49%; top: 50%; opacity: 1; } 100% { left: 49%; top: 50%; opacity: 0; } }
@keyframes hero-workflow-signal-three { 0% { left: 32%; top: 76%; opacity: 0; } 15% { opacity: 1; } 70% { left: 49%; top: 54%; opacity: 1; } 100% { left: 49%; top: 54%; opacity: 0; } }
@keyframes hero-workflow-signal-four { 0% { left: 57%; top: 49%; opacity: 0; } 15% { opacity: 1; } 70% { left: 73%; top: 27%; opacity: 1; } 100% { left: 73%; top: 27%; opacity: 0; } }
@keyframes hero-workflow-signal-five { 0% { left: 77%; top: 52%; opacity: 0; } 15% { opacity: 1; } 70% { left: 82%; top: 76%; opacity: 1; } 100% { left: 82%; top: 76%; opacity: 0; } }
.hero-workflow__router, .hero-workflow__engine, .hero-workflow__agents, .hero-workflow__outcome { position: absolute; z-index: 2; display: grid; gap: 5px; padding: 12px 14px; border: 1px solid rgba(242, 244, 246, 0.24); background: rgba(7, 23, 41, 0.9); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2); }
.hero-workflow__router span, .hero-workflow__engine span, .hero-workflow__agents span, .hero-workflow__outcome span { color: #a9bbc6; font-size: 0.61rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.hero-workflow__router strong, .hero-workflow__engine strong, .hero-workflow__agents strong, .hero-workflow__outcome strong { color: #f2f4f6; font-size: 0.78rem; line-height: 1.2; }
.hero-workflow__router { top: 50%; left: 46%; width: 150px; min-height: 108px; place-content: center; transform: translate(-50%, -50%); border-color: rgba(196, 122, 58, 0.76); background: linear-gradient(145deg, rgba(43, 93, 115, 0.92), rgba(11, 29, 51, 0.96)); text-align: center; }
.hero-workflow__router span { color: #c47a3a; }
.hero-workflow__router i { width: 9px; height: 9px; margin: 5px auto 0; border-radius: 50%; background: #c47a3a; box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.65); animation: hero-workflow-core 2.8s ease-out infinite; }
.hero-workflow__engine { right: 7%; width: 150px; animation: hero-workflow-float 6.8s ease-in-out -1.7s infinite; }
.hero-workflow__engine--local { top: 13%; border-color: rgba(111, 186, 206, 0.65); }
.hero-workflow__engine--cloud { top: 43%; border-color: rgba(196, 122, 58, 0.65); animation-delay: -3.1s; }
.hero-workflow__engine--local span { color: #77c4db; }
.hero-workflow__engine--cloud span, .hero-workflow__agents span, .hero-workflow__outcome span { color: #c47a3a; }
.hero-workflow__agents { right: 7%; bottom: 19%; animation: hero-workflow-float 7.4s ease-in-out -2.2s infinite; }
.hero-workflow__outcome { right: 7%; bottom: 4%; padding: 9px 12px; border-color: rgba(242, 244, 246, 0.38); }
.hero-workflow__signal--four { animation: hero-workflow-signal-four 4.9s linear 0.7s infinite; }
.hero-workflow__signal--five { animation: hero-workflow-signal-five 5.2s linear 1.6s infinite; }
@media (prefers-reduced-motion: reduce) { .talenta-hero-workflow::before, .talenta-hero-workflow::after, .hero-workflow__source, .hero-workflow__router i, .hero-workflow__engine, .hero-workflow__agents, .hero-workflow__outcome, .hero-workflow__signal { animation: none; } .hero-workflow__signal { display: none; } }
.talenta-hero-illustration { min-height: 480px; margin: 0; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.18); background: #0b1d33; }
.talenta-hero-illustration img { display: block; width: 100%; height: 100%; min-height: 480px; object-fit: cover; object-position: center; }
.talenta-rails { position: relative; min-height: 580px; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.25); background: linear-gradient(135deg, #0b1d33, #102842); }
.talenta-rails::before { position: absolute; inset: 0; background-image: linear-gradient(90deg, rgba(242, 244, 246, 0.055) 1px, transparent 1px), linear-gradient(rgba(242, 244, 246, 0.055) 1px, transparent 1px); background-size: 52px 52px; content: ""; }
.talenta-rails__top, .talenta-rails__node, .talenta-rails__track, .talenta-rails__result { position: relative; z-index: 1; }
.talenta-rails__top { display: flex; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid rgba(242, 244, 246, 0.18); color: #b9c9d1; font-size: 0.68rem; letter-spacing: 0.12em; }
.talenta-rails__node { width: 190px; margin: 56px 0 0 42px; padding: 15px 16px; border-left: 2px solid #c47a3a; background: rgba(242, 244, 246, 0.08); }
.talenta-rails__node small { display: block; margin-bottom: 8px; color: #a9bbc6; font-size: 0.66rem; letter-spacing: 0.11em; }
.talenta-rails__node strong { color: #f2f4f6; font-size: 1.15rem; line-height: 1.1; }
.talenta-rails__track { position: absolute; right: -10%; width: 72%; height: 70px; border: 2px solid; border-left: 0; border-radius: 0 90px 90px 0; }
.talenta-rails__track span { position: absolute; left: 18%; top: 22px; color: #f2f4f6; font-size: 0.76rem; font-weight: 750; letter-spacing: 0.02em; }
.talenta-rails__track--one { top: 38%; border-color: #2b5d73; transform: rotate(-18deg); }
.talenta-rails__track--two { top: 49%; border-color: #c47a3a; transform: rotate(-11deg); }
.talenta-rails__track--three { top: 60%; border-color: #5b9ab7; transform: rotate(-4deg); }
.talenta-rails__track--four { top: 70%; border-color: #a678cf; transform: rotate(3deg); }
.talenta-rails__track--five { top: 80%; border-color: #c47a3a; transform: rotate(9deg); }
.talenta-rails__result { position: absolute; right: 28px; bottom: 24px; display: grid; gap: 5px; max-width: 210px; padding: 13px 15px; border: 1px solid rgba(242, 244, 246, 0.2); background: rgba(11, 29, 51, 0.76); }
.talenta-rails__result span { color: #c47a3a; font-size: 0.67rem; font-weight: 850; letter-spacing: 0.15em; }
.talenta-rails__result strong { color: #f2f4f6; font-size: 0.91rem; line-height: 1.25; }
.rails-statement, .rails-solutions, .rails-route { background: #f2f4f6; color: #0b1d33; }
.rails-statement { padding: 110px 0; }
.rails-statement-grid, .rails-route-grid, .rails-closing-grid { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: clamp(44px, 9vw, 144px); }
.rails-statement h2, .rails-section-head h2, .rails-route h2, .rails-closing h2 { max-width: 780px; margin: 0 0 20px; font-size: clamp(2rem, 3.15vw, 3.25rem); font-weight: 700; line-height: 1.06; letter-spacing: -0.05em; }
.rails-statement h2, .rails-section-head h2, .rails-route h2 { color: #0b1d33; }
.rails-statement-grid > div > p, .rails-route p { max-width: 650px; color: #2b5d73; font-size: 1.08rem; }
.customer-path { padding: 112px 0; background: #102842; border-top: 1px solid rgba(242, 244, 246, 0.16); }
.customer-path-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(44px, 9vw, 144px); align-items: center; }
.customer-path h2 { max-width: 620px; margin: 0 0 18px; color: #f2f4f6; font-size: clamp(2rem, 3.05vw, 3.2rem); font-weight: 700; line-height: 1.06; letter-spacing: -0.05em; }
.customer-path-grid > div:first-child > p:not(.rails-overline) { max-width: 580px; color: #a9bbc6; font-size: 1.04rem; }
.customer-path-note { padding-top: 16px; border-top: 1px solid rgba(242, 244, 246, 0.18); font-size: 0.9rem !important; }
.customer-path-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; padding-bottom: 5px; border-bottom: 1px solid #c47a3a; color: #f2f4f6; font-weight: 760; text-decoration: none; }
.customer-path-link span { margin: 0; color: #c47a3a; font-size: 1.15rem; line-height: 1; transition: transform 160ms ease; }
.customer-path-link:hover span, .customer-path-link:focus-visible span { transform: translateX(4px); }
.customer-path--light { background: #e7ecef; border-top-color: rgba(11, 29, 51, 0.16); }
.customer-path--light h2 { color: #0b1d33; }
.customer-path--light .customer-path-grid > div:first-child > p:not(.rails-overline) { color: #2b5d73; }
.customer-path--light .customer-path-note { border-top-color: rgba(11, 29, 51, 0.18); }
.customer-path--light .customer-path-link { color: #0b1d33; }
.customer-flow { position: relative; display: grid; gap: 14px; min-height: 330px; padding: 26px; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.2); background: linear-gradient(140deg, rgba(11, 29, 51, 0.96), rgba(43, 93, 115, 0.42)); }
.customer-flow::before { position: absolute; inset: 0; background-image: linear-gradient(90deg, rgba(242, 244, 246, 0.05) 1px, transparent 1px), linear-gradient(rgba(242, 244, 246, 0.05) 1px, transparent 1px); background-size: 42px 42px; content: ""; }
.customer-flow__message, .customer-flow__agent, .customer-flow__handoff { position: relative; z-index: 1; width: min(88%, 410px); padding: 16px 18px; border: 1px solid rgba(242, 244, 246, 0.2); background: rgba(11, 29, 51, 0.86); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18); }
.customer-flow__message { justify-self: start; }
.customer-flow__agent { justify-self: end; border-color: rgba(196, 122, 58, 0.62); }
.customer-flow__handoff { justify-self: start; }
.customer-flow span { display: block; margin-bottom: 6px; color: #c47a3a; font-size: 0.68rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.customer-flow strong { color: #f2f4f6; font-size: 0.92rem; line-height: 1.35; }
.customer-flow__pulse { position: absolute; z-index: 0; width: 11px; height: 11px; border-radius: 50%; background: #c47a3a; box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.7); animation: customer-flow-pulse 3.6s ease-in-out infinite; }
@keyframes customer-flow-pulse { 0% { left: 21%; top: 25%; opacity: 0; box-shadow: 0 0 0 0 rgba(196, 122, 58, 0); } 15% { opacity: 1; } 44% { left: 75%; top: 49%; box-shadow: 0 0 0 12px rgba(196, 122, 58, 0.06); } 75% { left: 24%; top: 78%; opacity: 1; } 100% { left: 24%; top: 78%; opacity: 0; box-shadow: 0 0 0 20px rgba(196, 122, 58, 0); } }
@media (prefers-reduced-motion: reduce) { .customer-flow__pulse { animation: none; opacity: 0; } }
.rails-solutions { padding: 104px 0 116px; border-top: 1px solid rgba(11, 29, 51, 0.16); }
.rails-section-head { max-width: 820px; margin-bottom: 42px; }
.rails-section-head > p:not(.rails-overline) { max-width: 720px; margin: -4px 0 0; color: #2b5d73; font-size: 1.04rem; line-height: 1.65; }
.rails-solution-list { border-top: 1px solid rgba(11, 29, 51, 0.3); }
.rails-solution-row { display: grid; grid-template-columns: 70px minmax(180px, 0.6fr) 1fr auto; gap: 24px; align-items: baseline; padding: 28px 0; border-bottom: 1px solid rgba(11, 29, 51, 0.22); }
.rails-solution-row > span, .rails-engagement-card > span, .rails-route li > span { color: #c47a3a; font-size: 0.74rem; font-weight: 850; letter-spacing: 0.1em; }
.rails-solution-row h3 { margin: 0; color: #0b1d33; font-size: 1.2rem; }
.rails-solution-row p { margin: 0; color: #2b5d73; font-size: 0.96rem; }
.rails-solution-row a { color: #0b1d33; font-size: 0.83rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.rails-solution-row a span { color: #c47a3a; font-size: 1.1rem; }
.rails-platform-note { display: grid; grid-template-columns: 0.55fr 1.45fr; gap: 24px; margin-top: 28px; padding: 24px 28px; border-left: 3px solid #c47a3a; background: rgba(43, 93, 115, 0.08); }
.rails-platform-note span { color: #0b1d33; font-size: 0.82rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.rails-platform-note p { max-width: 720px; margin: 0; color: #2b5d73; line-height: 1.6; }
.rails-engagement { padding: 108px 0; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #102842; }
.rails-engagement .rails-section-head h2 { color: #f2f4f6; }
.rails-engagement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; background: transparent; }
.rails-engagement-card { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto 1fr; gap: 18px 20px; min-height: 250px; padding: 28px; border: 1px solid rgba(242, 244, 246, 0.18); background: linear-gradient(145deg, rgba(242, 244, 246, 0.055), rgba(11, 29, 51, 0.18)); }
.rails-engagement-card > span:first-child { grid-column: 1; grid-row: 1; align-self: center; margin: 0; }
.rails-engagement-icon { display: grid !important; grid-column: 2; grid-row: 1; width: 40px; height: 40px; place-items: center; margin: 0; border: 1px solid rgba(242, 244, 246, 0.18); color: #f2f4f6 !important; }
.rails-engagement-icon svg, .rails-engagement-icon svg * { width: 22px; height: 22px; fill: none !important; stroke: currentColor !important; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.rails-engagement-card h3 { grid-column: 1 / -1; grid-row: 2; margin: 0; color: #f2f4f6; font-size: 1.28rem; }
.rails-engagement-card p { grid-column: 1 / -1; grid-row: 3; margin: 0; color: #a9bbc6; font-size: 0.98rem; }
.rails-engagement-cta { display: flex; width: 100%; justify-content: center; padding-top: 38px; text-align: center; }
.rails-engagement-cta .button { margin-inline: auto; border-radius: 4px; background: #c47a3a; color: #0b1d33; }
.rails-route { padding: 112px 0; border-top: 1px solid rgba(11, 29, 51, 0.16); }
.rails-route ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(11, 29, 51, 0.22); }
.rails-route li { display: grid; grid-template-columns: 64px 1fr; gap: 18px; padding: 24px 0; border-bottom: 1px solid rgba(11, 29, 51, 0.22); }
.rails-route li strong { color: #0b1d33; font-size: 1.14rem; }
.rails-route li p { margin: 7px 0 0; font-size: 0.96rem; }
.rails-closing { padding: 118px 0 132px; background: #0b1d33; border-top: 1px solid rgba(242, 244, 246, 0.16); }
.rails-closing h2 { color: #f2f4f6; }
.rails-closing-grid { align-items: end; }
.rails-closing-grid > div:last-child > p { max-width: 600px; margin: 0; color: #a9bbc6; font-size: 1.08rem; }
.rails-closing .button { margin-top: 24px; border-radius: 4px; background: #c47a3a; color: #0b1d33; }
.site-variant--brand-rails .site-footer { background: #0b1d33; border-top-color: rgba(242, 244, 246, 0.16); }
.site-variant--brand-rails .site-footer a, .site-variant--brand-rails .site-footer p, .site-variant--brand-rails .copyright { color: #a9bbc6; }
.site-variant--brand-rails .booking-panel { border-color: rgba(242, 244, 246, 0.2); background: #102842; }
.site-variant--brand-rails .booking-panel h2 { color: #f2f4f6; }
.site-variant--brand-rails .page h1 { max-width: 760px; font-size: clamp(2.15rem, 3.2vw, 3.4rem); }
.site-variant--brand-rails .page h2 { font-size: clamp(1.45rem, 2.15vw, 2.05rem); }
@media (max-width: 960px) {
  .rails-hero-grid, .rails-statement-grid, .customer-path-grid, .rails-route-grid, .rails-closing-grid { grid-template-columns: 1fr; }
  .rails-hero { padding-top: 72px; }
  .talenta-hero-workflow { min-height: 420px; }
  .talenta-hero-illustration, .talenta-hero-illustration img { min-height: 380px; }
  .talenta-rails { min-height: 540px; }
  .rails-solution-row { grid-template-columns: 56px 0.7fr 1fr; }
  .rails-solution-row a { grid-column: 2 / -1; }
}
@media (max-width: 620px) {
  .rails-hero h1 { width: calc(100% + 12px); font-size: clamp(2.75rem, 13vw, 4rem); }
  .talenta-rails { min-height: 485px; }
  .talenta-hero-workflow { min-height: 360px; }
  .hero-workflow__source, .hero-workflow__core, .hero-workflow__outcome { padding: 11px 12px; }
  .hero-workflow__source strong, .hero-workflow__core strong, .hero-workflow__outcome strong { font-size: 0.76rem; }
  .hero-workflow__source--message { top: 38px; left: 5%; }
  .hero-workflow__source--document { top: 145px; left: 4%; }
  .hero-workflow__source--video { bottom: 35px; left: 8%; }
  .hero-workflow__core { left: 58%; width: 135px; min-height: 106px; }
  .hero-workflow__outcome { right: 5%; bottom: 42px; }
  .hero-workflow__router { left: 49%; width: 124px; min-height: 88px; padding: 10px; }
  .hero-workflow__engine { right: 4%; width: 116px; padding: 9px 10px; }
  .hero-workflow__engine--local { top: 9%; }
  .hero-workflow__engine--cloud { top: 39%; }
  .hero-workflow__agents { right: 4%; bottom: 21%; padding: 9px 10px; }
  .hero-workflow__outcome { right: 4%; bottom: 4%; padding: 7px 9px; }
  .hero-workflow__router strong, .hero-workflow__engine strong, .hero-workflow__agents strong, .hero-workflow__outcome strong { font-size: 0.67rem; }
  .hero-workflow__router span, .hero-workflow__engine span, .hero-workflow__agents span, .hero-workflow__outcome span { font-size: 0.53rem; }
  .talenta-hero-illustration, .talenta-hero-illustration img { min-height: 270px; }
  .talenta-rails__node { margin: 40px 0 0 24px; }
  .talenta-rails__track { right: -34%; width: 92%; }
  .talenta-rails__track span { left: 8%; font-size: 0.68rem; }
  .rails-statement, .rails-solutions, .rails-engagement, .rails-route, .rails-closing { padding: 76px 0; }
  .customer-path { padding: 76px 0; }
  .customer-flow { min-height: 300px; padding: 18px; }
  .customer-flow__message, .customer-flow__agent, .customer-flow__handoff { width: 94%; padding: 14px; }
  .customer-flow strong { font-size: 0.86rem; }
  .rails-solution-row { grid-template-columns: 42px 1fr; gap: 12px; }
  .rails-solution-row p, .rails-solution-row a { grid-column: 2; }
  .rails-platform-note { grid-template-columns: 1fr; gap: 10px; padding: 22px; }
  .rails-engagement-grid { grid-template-columns: 1fr; }
  .rails-engagement-grid { gap: 12px; }
  .rails-engagement-card { min-height: 0; padding: 24px; }
}


@media (max-width: 760px) {
  .hero, .section { padding: 64px 0; }
  .hero-grid, .split, .footer-grid { grid-template-columns: 1fr; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: transparent; }
  .nav-toggle-icon { display: grid; gap: 5px; width: 20px; }
  .nav-toggle-icon span { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform 180ms ease, opacity 180ms ease; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav-menu { position: absolute; inset: 72px 16px auto; display: none; flex-direction: column; align-items: stretch; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 16px; }
  .nav-menu.is-open { display: flex; }
  .language-switch { align-self: flex-start; }
  .nav-dropdown { width: 100%; }
  .nav-dropdown-toggle { width: 100%; min-height: 44px; justify-content: space-between; color: var(--text); }
  .nav-submenu { position: static; min-width: 0; margin-top: 4px; padding: 4px; border-color: rgba(242, 244, 246, 0.16); box-shadow: none; }
  .nav-submenu a { padding: 10px 12px; }
  .site-header--brand-rails .nav-toggle { border-color: rgba(242, 244, 246, 0.36); color: #f2f4f6; }
  .site-header--brand-rails .nav-menu { background: #102842; border-color: rgba(242, 244, 246, 0.2); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28); }
}

@media (prefers-contrast: more) {
  :root { --line: currentColor; }
  .button, .nav-toggle, .language-switch { border: 2px solid currentColor; }
}

@media (forced-colors: active) {
  .button, .nav-toggle, .language-switch, .customer-flow, .talenta-hero-workflow { forced-color-adjust: auto; border: 1px solid ButtonText; }
}

.customer-ai-page { background: #0b1d33; }
.customer-ai-hero { padding: 104px 0 78px; overflow: hidden; background: radial-gradient(circle at 84% 26%, rgba(196, 122, 58, 0.25), transparent 20%), radial-gradient(circle at 54% 64%, rgba(43, 93, 115, 0.55), transparent 32%), #0b1d33; }
.customer-ai-hero-grid { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(410px, 0.92fr); gap: clamp(44px, 8vw, 120px); align-items: center; }
.customer-ai-hero-copy { max-width: 650px; }
.customer-ai-hero h1 { max-width: 760px; margin: 0 0 24px; color: #f2f4f6; font-size: clamp(2.7rem, 3.85vw, 3.8rem); font-weight: 740; line-height: 1.01; letter-spacing: -0.06em; text-wrap: balance; }
.customer-ai-hero-copy > p:not(.rails-overline):not(.customer-ai-hero-note) { max-width: 590px; margin: 0; color: #b9c9d1; font-size: clamp(1.08rem, 1.5vw, 1.25rem); line-height: 1.62; }
.customer-ai-hero .hero-actions { margin-top: 30px; }
.customer-ai-hero .button { border-radius: 4px; background: #c47a3a; color: #0b1d33; }
.customer-ai-hero-note { max-width: 470px; margin: 18px 0 0; color: #a9bbc6; font-size: 0.9rem; line-height: 1.5; }
.customer-ai-chat { position: relative; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.22); background: linear-gradient(145deg, rgba(7, 23, 41, 0.95), rgba(16, 40, 66, 0.9)); box-shadow: 0 28px 80px rgba(0, 0, 0, 0.24); }
.customer-ai-chat::before { position: absolute; inset: 0; background-image: linear-gradient(90deg, rgba(242, 244, 246, 0.04) 1px, transparent 1px), linear-gradient(rgba(242, 244, 246, 0.04) 1px, transparent 1px); background-size: 38px 38px; content: ""; pointer-events: none; }
.customer-ai-chat__bar, .customer-ai-chat__footer { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 1px solid rgba(242, 244, 246, 0.16); color: #f2f4f6; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.04em; }
.customer-ai-chat__status { color: #a7d6b1; font-size: 0.66rem; letter-spacing: 0.12em; text-transform: uppercase; }
.customer-ai-chat__body { position: relative; z-index: 1; display: grid; gap: 16px; min-height: 405px; padding: 28px; }
.customer-ai-message, .customer-ai-answer { width: min(88%, 390px); padding: 16px 18px; border: 1px solid rgba(242, 244, 246, 0.2); background: rgba(11, 29, 51, 0.84); }
.customer-ai-message span, .customer-ai-answer > span { display: block; margin-bottom: 7px; color: #a9bbc6; font-size: 0.63rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.customer-ai-message strong, .customer-ai-answer strong { color: #f2f4f6; font-size: 0.93rem; line-height: 1.4; }
.customer-ai-message--customer { justify-self: start; }
.customer-ai-message--assistant { justify-self: end; border-color: rgba(196, 122, 58, 0.68); }
.customer-ai-message--assistant span, .customer-ai-answer > span { color: #c47a3a; }
.customer-ai-answer { justify-self: end; border-left: 2px solid #c47a3a; background: rgba(43, 93, 115, 0.3); }
.customer-ai-answer ul { display: grid; gap: 4px; margin: 14px 0 0; padding: 0; color: #dbe5e9; font-size: 0.78rem; list-style: none; }
.customer-ai-answer li::before { margin-right: 8px; color: #c47a3a; content: "↗"; }
.customer-ai-chat__footer { border-top: 1px solid rgba(242, 244, 246, 0.16); border-bottom: 0; color: #a9bbc6; font-size: 0.68rem; font-weight: 700; }
.customer-ai-chat__footer i { width: 11px; height: 11px; border-radius: 50%; background: #c47a3a; box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.58); animation: customer-ai-pulse 2.7s ease-out infinite; }
@keyframes customer-ai-pulse { 0% { box-shadow: 0 0 0 0 rgba(196, 122, 58, 0.58); } 85%, 100% { box-shadow: 0 0 0 14px rgba(196, 122, 58, 0); } }
.customer-ai-problem, .customer-ai-variants, .customer-ai-faq { padding: 108px 0; background: #f2f4f6; color: #0b1d33; }
.customer-ai-problem-grid, .customer-ai-security-grid, .customer-ai-integrations-grid, .customer-ai-faq-grid, .customer-ai-closing-grid { display: grid; grid-template-columns: 0.72fr 1.28fr; gap: clamp(44px, 9vw, 142px); }
.customer-ai-problem h2, .customer-ai-section-head h2, .customer-ai-security h2, .customer-ai-integrations h2, .customer-ai-faq h2, .customer-ai-closing h2 { max-width: 760px; margin: 0 0 18px; font-size: clamp(2.05rem, 3.15vw, 3.3rem); font-weight: 710; line-height: 1.06; letter-spacing: -0.052em; text-wrap: balance; }
.customer-ai-problem h2, .customer-ai-variants h2, .customer-ai-faq h2 { color: #0b1d33; }
.customer-ai-problem-grid > div > p, .customer-ai-section-head > p, .customer-ai-integrations p { max-width: 660px; margin: 0; color: #2b5d73; font-size: 1.08rem; line-height: 1.65; }
.customer-ai-problem .rails-overline, .customer-ai-variants .rails-overline, .customer-ai-faq .rails-overline { color: #c47a3a; }
.customer-ai-scenarios { padding: 112px 0; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #102842; }
.customer-ai-section-head { max-width: 860px; margin-bottom: 46px; }
.customer-ai-section-head h2 { color: #f2f4f6; }
.customer-ai-section-head > p:not(.rails-overline) { color: #a9bbc6; }
.customer-ai-scenario-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(242, 244, 246, 0.18); }
.customer-ai-scenario-grid article { min-height: 270px; padding: 29px; background: #102842; }
.customer-ai-scenario-grid article > span, .customer-ai-variant > p:first-child { display: block; margin: 0 0 42px; color: #c47a3a; font-size: 0.72rem; font-weight: 850; letter-spacing: 0.12em; }
.customer-ai-scenario-grid h3 { margin: 0 0 12px; color: #f2f4f6; font-size: 1.18rem; line-height: 1.18; }
.customer-ai-scenario-grid p { margin: 0; color: #a9bbc6; font-size: 0.94rem; line-height: 1.6; }
.customer-ai-variant-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.customer-ai-variant { min-height: 390px; padding: 29px; border: 1px solid rgba(11, 29, 51, 0.2); background: rgba(255, 255, 255, 0.46); }
.customer-ai-variant--featured { border-color: #c47a3a; background: #0b1d33; box-shadow: 0 20px 46px rgba(11, 29, 51, 0.14); }
.customer-ai-variant h3 { min-height: 82px; margin: 0 0 14px; color: #0b1d33; font-size: 1.42rem; line-height: 1.12; }
.customer-ai-variant > p:not(:first-child) { min-height: 84px; margin: 0; color: #2b5d73; line-height: 1.58; }
.customer-ai-variant ul { display: grid; gap: 10px; margin: 30px 0 0; padding: 0; color: #0b1d33; font-size: 0.9rem; list-style: none; }
.customer-ai-variant li::before { margin-right: 8px; color: #c47a3a; content: "—"; }
.customer-ai-variant--featured h3, .customer-ai-variant--featured > p:not(:first-child), .customer-ai-variant--featured ul { color: #f2f4f6; }
.customer-ai-security { padding: 114px 0; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #0b1d33; }
.customer-ai-security h2 { color: #f2f4f6; }
.customer-ai-security > .container > div:first-child > p:not(.rails-overline) { max-width: 610px; margin: 0; color: #a9bbc6; font-size: 1.05rem; line-height: 1.65; }
.customer-ai-routing { position: relative; display: grid; gap: 14px; align-content: center; min-height: 450px; padding: 25px; overflow: hidden; border: 1px solid rgba(242, 244, 246, 0.2); background: linear-gradient(145deg, rgba(16, 40, 66, 0.94), rgba(7, 23, 41, 0.94)); }
.customer-ai-routing::before { position: absolute; inset: 0; background-image: linear-gradient(90deg, rgba(242, 244, 246, 0.05) 1px, transparent 1px), linear-gradient(rgba(242, 244, 246, 0.05) 1px, transparent 1px); background-size: 42px 42px; content: ""; }
.customer-ai-routing > div { position: relative; z-index: 1; width: min(82%, 340px); padding: 15px 17px; border: 1px solid rgba(242, 244, 246, 0.2); background: rgba(11, 29, 51, 0.78); }
.customer-ai-routing span { display: block; margin-bottom: 5px; color: #a9bbc6; font-size: 0.62rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.customer-ai-routing strong { color: #f2f4f6; font-size: 0.86rem; line-height: 1.3; }
.customer-ai-routing__source { justify-self: start; }
.customer-ai-routing__gateway { justify-self: center; border-color: rgba(196, 122, 58, 0.72) !important; }
.customer-ai-routing__gateway span, .customer-ai-routing__audit span { color: #c47a3a; }
.customer-ai-routing__path { justify-self: end; }
.customer-ai-routing__path--cloud { border-color: rgba(196, 122, 58, 0.58) !important; }
.customer-ai-routing__path--private { border-color: rgba(111, 186, 206, 0.64) !important; }
.customer-ai-routing__path--private span { color: #77c4db; }
.customer-ai-routing__audit { justify-self: center; }
.customer-ai-integrations { padding: 108px 0; border-top: 1px solid rgba(11, 29, 51, 0.16); background: #f2f4f6; }
.customer-ai-integrations ul { display: grid; gap: 0; margin: 0; padding: 0; border-top: 1px solid rgba(11, 29, 51, 0.25); list-style: none; }
.customer-ai-integrations li { padding: 18px 0; border-bottom: 1px solid rgba(11, 29, 51, 0.22); color: #0b1d33; font-size: 1.05rem; font-weight: 720; }
.customer-ai-integrations li::before { margin-right: 12px; color: #c47a3a; content: "↗"; }
.customer-ai-integrations li a { color: inherit; text-decoration-color: rgba(196, 122, 58, 0.64); text-underline-offset: 4px; }
.customer-ai-integrations li a:hover { color: #c47a3a; }
.customer-ai-faq-grid { align-items: start; }
.customer-ai-faq .faq-list { margin: 0; }
.customer-ai-faq details { border-color: rgba(11, 29, 51, 0.2); background: rgba(255, 255, 255, 0.5); box-shadow: none; }
.customer-ai-faq summary { color: #0b1d33; }
.customer-ai-faq details p { color: #2b5d73; }
.customer-ai-closing { padding: 118px 0 132px; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #102842; }
.customer-ai-closing h2 { color: #f2f4f6; }
.customer-ai-closing-grid { align-items: end; }
.customer-ai-closing-grid > div:last-child > p { max-width: 590px; margin: 0; color: #a9bbc6; font-size: 1.08rem; line-height: 1.65; }
.customer-ai-closing .button { margin-top: 24px; border-radius: 4px; background: #c47a3a; color: #0b1d33; }
@media (prefers-reduced-motion: reduce) { .customer-ai-chat__footer i { animation: none; } }
@media (max-width: 1040px) { .customer-ai-scenario-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 960px) { .customer-ai-hero-grid, .customer-ai-problem-grid, .customer-ai-security-grid, .customer-ai-integrations-grid, .customer-ai-faq-grid, .customer-ai-closing-grid { grid-template-columns: 1fr; } .customer-ai-hero { padding-top: 76px; } .customer-ai-variant-grid { grid-template-columns: 1fr; } .customer-ai-variant, .customer-ai-variant h3, .customer-ai-variant > p:not(:first-child) { min-height: 0; } }
@media (max-width: 620px) { .customer-ai-hero { padding: 72px 0 58px; } .customer-ai-hero h1 { font-size: clamp(2.55rem, 12vw, 4rem); } .customer-ai-chat__body { min-height: 350px; padding: 18px; } .customer-ai-message, .customer-ai-answer { width: 94%; padding: 14px; } .customer-ai-problem, .customer-ai-scenarios, .customer-ai-variants, .customer-ai-security, .customer-ai-integrations, .customer-ai-faq, .customer-ai-closing { padding: 76px 0; } .customer-ai-scenario-grid { grid-template-columns: 1fr; } .customer-ai-scenario-grid article { min-height: 0; } .customer-ai-scenario-grid article > span, .customer-ai-variant > p:first-child { margin-bottom: 24px; } .customer-ai-routing { min-height: 420px; padding: 18px; } .customer-ai-routing > div { width: 94%; } }

.customer-ai-readiness { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.customer-ai-readiness li { padding: 7px 10px; border: 1px solid rgba(242, 244, 246, 0.22); color: #d8e3e8; font-size: 0.76rem; font-weight: 720; line-height: 1.2; }
.customer-ai-readiness li::before { margin-right: 7px; color: #c47a3a; content: "✓"; }
.customer-ai-governance { padding: 112px 0; background: #f2f4f6; }
.customer-ai-governance .customer-ai-section-head h2 { color: #0b1d33; }
.customer-ai-governance .customer-ai-section-head > p:not(.rails-overline) { color: #2b5d73; }
.customer-ai-governance-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(11, 29, 51, 0.18); }
.customer-ai-governance-grid article { min-height: 275px; padding: 28px; background: rgba(255, 255, 255, 0.58); }
.customer-ai-governance-grid span { display: block; margin-bottom: 42px; color: #c47a3a; font-size: 0.72rem; font-weight: 850; letter-spacing: 0.12em; }
.customer-ai-governance-grid h3 { margin: 0 0 12px; color: #0b1d33; font-size: 1.18rem; line-height: 1.18; }
.customer-ai-governance-grid p { margin: 0; color: #2b5d73; font-size: 0.94rem; line-height: 1.6; }
.customer-ai-governance-note { max-width: 840px; margin: 30px 0 0; color: #2b5d73; font-size: 0.94rem; line-height: 1.65; }
@media (max-width: 1040px) { .customer-ai-governance-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .customer-ai-readiness { gap: 6px; } .customer-ai-readiness li { font-size: 0.7rem; } .customer-ai-governance { padding: 76px 0; } .customer-ai-governance-grid { grid-template-columns: 1fr; } .customer-ai-governance-grid article { min-height: 0; } .customer-ai-governance-grid span { margin-bottom: 24px; } }

.search-page-hero h1 { max-width: 820px; font-size: clamp(2.9rem, 5vw, 5.35rem); }
.search-page-signals { display: grid; align-content: center; gap: 1px; min-height: 430px; padding: 1px; border: 1px solid rgba(242, 244, 246, 0.18); background: rgba(242, 244, 246, 0.16); }
.search-page-signals > div { display: grid; align-content: center; min-height: 128px; padding: 26px 30px; background: rgba(11, 29, 51, 0.9); }
.search-page-signals span { margin-bottom: 8px; color: #c47a3a; font-size: 0.72rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.search-page-signals strong { max-width: 420px; color: #f2f4f6; font-size: clamp(1.1rem, 1.8vw, 1.52rem); line-height: 1.2; }
.search-page-cards .customer-ai-scenario-grid article { display: flex; flex-direction: column; }
.search-page-cards .customer-ai-scenario-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.search-page-cards .customer-ai-scenario-grid article > a { align-self: flex-start; margin-top: auto; padding-top: 24px; color: #77c4db; font-weight: 760; text-decoration: none; }
.search-page-cards .customer-ai-scenario-grid article > a:hover { color: #f2f4f6; }
.faq-intro { max-width: 760px; margin: 0 0 52px; color: var(--muted); font-size: 1.08rem; line-height: 1.75; }
.faq-group + .faq-group { margin-top: 58px; }
.faq-group h2 { margin: 0 0 20px; color: var(--copper); font-size: 0.84rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.faq-group details { border-top: 1px solid rgba(11, 29, 51, 0.14); }
.faq-group details:last-child { border-bottom: 1px solid rgba(11, 29, 51, 0.14); }
.rails-platform-note a { color: #c47a3a; font-weight: 760; text-decoration: none; white-space: nowrap; }
@media (max-width: 960px) { .search-page-signals { min-height: 0; } .search-page-signals > div { min-height: 108px; } }
@media (max-width: 620px) { .search-page-hero h1 { font-size: clamp(2.45rem, 11.2vw, 3.7rem); } .search-page-signals > div { min-height: 94px; padding: 22px; } }

.about-hero { padding: 108px 0 94px; overflow: hidden; background: radial-gradient(circle at 84% 20%, rgba(196, 122, 58, 0.24), transparent 24%), radial-gradient(circle at 52% 78%, rgba(43, 93, 115, 0.52), transparent 34%), #0b1d33; }
.about-hero-grid, .about-statement-grid, .about-experience-grid, .about-governance-grid, .about-closing-grid { display: grid; grid-template-columns: 0.88fr 1.12fr; gap: clamp(44px, 9vw, 142px); align-items: center; }
.about-hero h1 { max-width: 700px; margin: 0 0 24px; color: #f2f4f6; font-size: clamp(3rem, 5.2vw, 5.7rem); font-weight: 740; line-height: 0.98; letter-spacing: -0.07em; text-wrap: balance; }
.about-hero h1 + p { max-width: 620px; margin: 0 0 30px; color: #b9c9d1; font-size: clamp(1.08rem, 1.5vw, 1.25rem); line-height: 1.62; }
.about-hero .button, .about-closing .button { border-radius: 4px; background: #c47a3a; color: #0b1d33; }
.about-principle { display: grid; gap: 1px; border: 1px solid rgba(242, 244, 246, 0.18); background: rgba(242, 244, 246, 0.16); }
.about-principle > div { min-height: 156px; padding: 24px 28px; background: rgba(11, 29, 51, 0.84); }
.about-principle span { display: block; margin-bottom: 10px; color: #c47a3a; font-size: 0.76rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.about-principle strong { display: block; color: #f2f4f6; font-size: 1.15rem; line-height: 1.2; }
.about-principle p { max-width: 520px; margin: 10px 0 0; color: #a9bbc6; font-size: 0.92rem; line-height: 1.55; }
.about-statement, .about-experience { padding: 112px 0; background: #f2f4f6; }
.about-statement h2, .about-section-head h2, .about-experience h2, .about-governance h2, .about-closing h2 { max-width: 820px; margin: 0 0 18px; font-size: clamp(2.05rem, 3.65vw, 4rem); font-weight: 710; line-height: 1.02; letter-spacing: -0.06em; text-wrap: balance; }
.about-statement h2, .about-experience h2 { color: #0b1d33; }
.about-statement-grid > div > p, .about-section-head > p, .about-experience-grid > div > p { max-width: 680px; margin: 0; color: #2b5d73; font-size: 1.08rem; line-height: 1.65; }
.about-statement-grid > div > p + p, .about-experience-grid > div > p + p { margin-top: 18px; }
.about-statement .rails-overline, .about-experience .rails-overline { color: #c47a3a; }
.about-advisory { padding: 112px 0; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #102842; }
.about-section-head { max-width: 840px; margin-bottom: 46px; }
.about-section-head h2 { color: #f2f4f6; }
.about-section-head > p:not(.rails-overline) { color: #a9bbc6; }
.about-advisory-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0; padding: 0; background: rgba(242, 244, 246, 0.16); list-style: none; }
.about-advisory-grid li { min-height: 280px; padding: 28px; background: #102842; }
.about-advisory-grid span { display: block; margin-bottom: 44px; color: #c47a3a; font-size: 0.72rem; font-weight: 850; letter-spacing: 0.12em; }
.about-advisory-grid h3 { margin: 0 0 12px; color: #f2f4f6; font-size: 1.18rem; line-height: 1.18; }
.about-advisory-grid p { margin: 0; color: #a9bbc6; font-size: 0.94rem; line-height: 1.6; }
.about-experience-grid { align-items: start; }
.about-governance { padding: 112px 0; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #0b1d33; }
.about-governance h2, .about-closing h2 { color: #f2f4f6; }
.about-governance-grid > div:last-child > p, .about-closing-grid > div:last-child > p { max-width: 620px; margin: 0; color: #a9bbc6; font-size: 1.06rem; line-height: 1.65; }
.about-governance-grid > div:last-child > p + p { margin-top: 18px; }
.about-closing { padding: 116px 0 132px; border-top: 1px solid rgba(242, 244, 246, 0.16); background: #102842; }
.about-closing .button { margin-top: 25px; }
@media (max-width: 1040px) { .about-advisory-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 960px) { .about-hero-grid, .about-statement-grid, .about-experience-grid, .about-governance-grid, .about-closing-grid { grid-template-columns: 1fr; } .about-hero { padding-top: 76px; } }
@media (max-width: 620px) { .about-hero, .about-statement, .about-advisory, .about-experience, .about-governance, .about-closing { padding: 76px 0; } .about-hero h1 { font-size: clamp(2.7rem, 12vw, 4.1rem); } .about-principle > div, .about-advisory-grid li { min-height: 0; } .about-advisory-grid { grid-template-columns: 1fr; } .about-advisory-grid span { margin-bottom: 24px; } }

/* About page: history → philosophy → approach → learnings → proof → CTA */
.about-hero { padding: clamp(104px, 14vw, 184px) 0 clamp(92px, 12vw, 156px); }
.about-hero-copy { max-width: 960px; }
.about-hero-copy .rails-overline { color: #c47a3a; }
.about-hero-copy h1 { max-width: 840px; margin: 0 0 28px; color: #f2f4f6; font-size: clamp(2.8rem, 4.2vw, 4.8rem); font-weight: 740; line-height: 1; letter-spacing: -0.068em; text-wrap: balance; }
.about-hero-copy > p:last-child { max-width: 700px; margin: 0; color: #b9c9d1; font-size: clamp(1.12rem, 1.58vw, 1.34rem); line-height: 1.62; }
.about-journey, .about-proof { padding: clamp(76px, 10vw, 134px) 0; background: #f2f4f6; }
.about-journey .about-section-head, .about-proof .about-section-head { margin-bottom: 48px; }
.about-section-head h2 { margin-bottom: 0; }
.about-journey-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid rgba(11, 29, 51, 0.16); background: rgba(11, 29, 51, 0.16); }
.about-journey-grid article { min-height: 294px; padding: 30px; background: #f2f4f6; }
.about-journey-grid span, .about-approach-grid span { display: block; margin-bottom: 52px; color: #c47a3a; font-size: 0.76rem; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.about-journey-grid h3, .about-approach-grid h3, .about-philosophy-points h3, .about-proof-card h3 { margin: 0 0 13px; color: #0b1d33; font-size: 1.22rem; line-height: 1.18; }
.about-journey-grid p, .about-approach-grid p, .about-philosophy-points p, .about-proof-card p { margin: 0; color: #2b5d73; font-size: 0.96rem; line-height: 1.62; }
.about-philosophy, .about-learnings { padding: clamp(76px, 10vw, 134px) 0; background: #102842; }
.about-two-column { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(44px, 10vw, 164px); align-items: start; }
.about-two-column h2 { max-width: 660px; margin: 0; color: #f2f4f6; font-size: clamp(2.2rem, 3.25vw, 3.5rem); font-weight: 730; line-height: 1.04; letter-spacing: -0.058em; text-wrap: balance; }
.about-prose { max-width: 630px; }
.about-prose > p { margin: 0; color: #b9c9d1; font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.68; }
.about-prose > p + p { margin-top: 22px; }
.about-philosophy-points { display: grid; grid-template-columns: repeat(2, 1fr); gap: 38px; margin-top: 52px; padding-top: 28px; border-top: 1px solid rgba(242, 244, 246, 0.18); }
.about-philosophy-points h3 { color: #f2f4f6; }
.about-philosophy-points p { color: #a9bbc6; }
.about-approach { padding: clamp(76px, 10vw, 134px) 0; background: #0b1d33; }
.about-approach .about-section-head { max-width: 810px; margin-bottom: 52px; }
.about-approach .about-section-head h2 { color: #f2f4f6; }
.about-approach .about-section-head > p:not(.rails-overline) { max-width: 660px; color: #a9bbc6; }
.about-approach-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0; padding: 0; border: 1px solid rgba(242, 244, 246, 0.18); background: rgba(242, 244, 246, 0.16); list-style: none; }
.about-approach-grid li { min-height: 274px; padding: 28px; background: #0b1d33; }
.about-approach-grid span { margin-bottom: 44px; }
.about-approach-grid h3 { color: #f2f4f6; }
.about-approach-grid p { color: #a9bbc6; }
.about-proof { background: #e8edf0; }
.about-proof-card { max-width: 860px; padding: clamp(30px, 5vw, 62px); border-left: 4px solid #c47a3a; background: #f7f9fa; box-shadow: 0 18px 38px rgba(11, 29, 51, 0.08); }
.about-proof-card h3 { font-size: clamp(1.45rem, 2.2vw, 2rem); }
.about-proof-card p + p { margin-top: 18px; }
.about-closing { padding: clamp(80px, 11vw, 154px) 0; background: radial-gradient(circle at 88% 22%, rgba(196, 122, 58, 0.22), transparent 24%), #102842; }
.about-closing-copy { max-width: 860px; }
.about-closing-copy h2 { max-width: 720px; margin: 0 0 22px; color: #f2f4f6; font-size: clamp(2.45rem, 3.8vw, 4rem); font-weight: 730; line-height: 1.02; letter-spacing: -0.065em; text-wrap: balance; }
.about-closing-copy > p:not(.rails-overline) { max-width: 630px; margin: 0; color: #b9c9d1; font-size: 1.1rem; line-height: 1.65; }
.about-closing-copy .button { margin-top: 30px; }
@media (max-width: 960px) { .about-journey-grid { grid-template-columns: 1fr; } .about-journey-grid article { min-height: 0; } .about-two-column { grid-template-columns: 1fr; gap: 36px; } .about-approach-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .about-hero-copy h1 { font-size: clamp(2.72rem, 12.2vw, 4.15rem); } .about-journey-grid article { padding: 26px; } .about-journey-grid span { margin-bottom: 30px; } .about-philosophy-points { grid-template-columns: 1fr; gap: 24px; margin-top: 38px; } .about-approach-grid { grid-template-columns: 1fr; } .about-approach-grid li { min-height: 0; padding: 26px; } .about-approach-grid span { margin-bottom: 30px; } }

/* Talenta v1.1: proof-led pages, product demos and decision guides */
.v11-page { background: #0b1d33; }
.v11-hero { padding: clamp(82px, 10vw, 142px) 0; background: radial-gradient(circle at 78% 22%, rgba(196, 122, 58, .2), transparent 26%), #0b1d33; }
.v11-hero--compact { padding-bottom: clamp(62px, 7vw, 94px); }
.v11-hero-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr); gap: clamp(48px, 8vw, 118px); align-items: center; }
.v11-hero h1 { max-width: 820px; margin: 0 0 24px; color: #f2f4f6; font-size: clamp(2.65rem, 4.35vw, 4.75rem); font-weight: 740; line-height: 1; letter-spacing: -.066em; text-wrap: balance; }
.v11-hero--compact h1 { max-width: 980px; }
.v11-lead { max-width: 700px; margin: 0 0 30px; color: #b9c9d1; font-size: clamp(1.05rem, 1.35vw, 1.22rem); line-height: 1.65; }
.v11-page .button.primary, .v11-consultation .button.primary, .v11-qualifier .button.primary { border-radius: 4px; background: #c47a3a; color: #0b1d33; }
.v11-system-map { position: relative; min-height: 470px; padding: 26px; border: 1px solid rgba(242, 244, 246, .18); background: linear-gradient(145deg, rgba(16, 40, 66, .98), rgba(11, 29, 51, .9)); box-shadow: 0 32px 70px rgba(0, 0, 0, .25); }
.v11-system-map::before { position: absolute; inset: 15% 12%; border: 1px solid rgba(43, 93, 115, .55); content: ""; pointer-events: none; }
.v11-system-map > p { position: relative; z-index: 1; margin: 0 0 22px; color: #8fa8b6; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.v11-system-map ol { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.v11-system-map li { min-height: 112px; padding: 18px; border: 1px solid rgba(242, 244, 246, .14); background: rgba(8, 24, 42, .9); }
.v11-system-map li:nth-child(3n+2) { transform: translateY(18px); }
.v11-system-map span, .v11-detail-card > span, .v11-comparison-card > span, .v11-compare article > span { display: block; margin-bottom: 20px; color: #c47a3a; font-size: .7rem; font-weight: 850; letter-spacing: .12em; }
.v11-system-map strong { color: #f2f4f6; font-size: .98rem; line-height: 1.25; }
.v11-details { padding: clamp(78px, 9vw, 122px) 0; background: #f2f4f6; }
.v11-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid rgba(11, 29, 51, .16); background: rgba(11, 29, 51, .16); }
.v11-detail-card { min-height: 310px; padding: 30px; background: #f2f4f6; }
.v11-detail-card h2 { margin: 0 0 15px; color: #0b1d33; font-size: clamp(1.38rem, 2vw, 1.8rem); line-height: 1.08; letter-spacing: -.035em; }
.v11-detail-card p, .v11-detail-card li { color: #2b5d73; font-size: .97rem; line-height: 1.62; }
.v11-detail-card ul { margin: 20px 0 0; padding-left: 20px; }
.v11-closing { padding: clamp(70px, 9vw, 116px) 0; background: #102842; }
.v11-closing .container { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.v11-closing p { max-width: 760px; margin: 0; color: #f2f4f6; font-size: clamp(1.45rem, 2.5vw, 2.35rem); font-weight: 690; line-height: 1.18; letter-spacing: -.04em; }
.v11-comparisons, .v11-compare { padding: 0 0 clamp(78px, 10vw, 130px); background: #0b1d33; }
.v11-comparison-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid rgba(242, 244, 246, .16); background: rgba(242, 244, 246, .16); }
.v11-comparison-card { min-height: 300px; padding: 32px; background: #102842; text-decoration: none; transition: background .2s ease, transform .2s ease; }
.v11-comparison-card:hover, .v11-comparison-card:focus-visible { background: #15324f; transform: translateY(-2px); }
.v11-comparison-card h2 { margin: 0 0 14px; color: #f2f4f6; font-size: clamp(1.4rem, 2.4vw, 2.15rem); line-height: 1.08; letter-spacing: -.04em; }
.v11-comparison-card p { max-width: 590px; color: #a9bbc6; line-height: 1.62; }
.v11-comparison-card > strong { display: block; margin-top: 28px; color: #c47a3a; }
.v11-compare-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid rgba(242, 244, 246, .16); background: rgba(242, 244, 246, .16); }
.v11-compare article { min-height: 440px; padding: clamp(30px, 4vw, 54px); background: #102842; }
.v11-compare article.v11-compare-featured { background: linear-gradient(145deg, #173751, #102842); }
.v11-compare h2 { margin: 0 0 26px; color: #f2f4f6; font-size: clamp(1.5rem, 2.4vw, 2.2rem); }
.v11-compare ul { display: grid; gap: 15px; margin: 0; padding: 0; list-style: none; }
.v11-compare li { position: relative; padding-left: 24px; color: #b9c9d1; line-height: 1.6; }
.v11-compare li::before { position: absolute; left: 0; top: .68em; width: 9px; height: 1px; background: #c47a3a; content: ""; }
.v11-recommendation { padding: clamp(72px, 9vw, 116px) 0; background: #e8edf0; }
.v11-recommendation h2 { max-width: 960px; margin: 0 0 30px; color: #0b1d33; font-size: clamp(1.8rem, 3.15vw, 3.2rem); line-height: 1.08; letter-spacing: -.055em; }
.v11-product-proof { padding: clamp(80px, 10vw, 132px) 0; background: #0b1d33; }
.v11-product-proof-head { max-width: 820px; margin-bottom: 46px; }
.v11-product-proof-head h2, .v11-pilot-head h2, .v11-consultation h2, .v11-qualifier h2 { margin: 0 0 18px; color: #f2f4f6; font-size: clamp(2rem, 3.5vw, 3.65rem); line-height: 1.04; letter-spacing: -.058em; text-wrap: balance; }
.v11-product-proof-head > p:last-child, .v11-pilot-head p, .v11-consultation p, .v11-qualifier p { max-width: 700px; color: #a9bbc6; line-height: 1.65; }
.v11-proof-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: 18px; }
.v11-demo-screen, .v11-video-placeholder { min-height: 430px; border: 1px solid rgba(242, 244, 246, .17); background: #102842; }
.v11-demo-bar { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid rgba(242, 244, 246, .14); color: #8fa8b6; font-size: .78rem; font-weight: 780; letter-spacing: .04em; text-transform: uppercase; }
.v11-demo-bar i { width: 8px; height: 8px; border-radius: 50%; background: #54b78a; box-shadow: 0 0 0 5px rgba(84, 183, 138, .12); }
.v11-demo-message { max-width: 82%; margin: 22px; padding: 16px 18px; border-left: 2px solid #2b5d73; background: rgba(8, 24, 42, .72); }
.v11-demo-message:nth-child(odd) { margin-left: auto; border-color: #c47a3a; }
.v11-demo-message span { display: block; margin-bottom: 7px; color: #8fa8b6; font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.v11-demo-message strong { color: #f2f4f6; font-size: .95rem; line-height: 1.45; }
.v11-video-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 36px; border-style: dashed; color: #f2f4f6; text-align: center; }
.v11-video-placeholder > span { display: grid; width: 62px; height: 62px; margin-bottom: 24px; border: 1px solid #c47a3a; border-radius: 50%; place-items: center; color: #c47a3a; }
.v11-video-placeholder strong { max-width: 340px; font-size: 1.15rem; line-height: 1.4; }
.v11-video-placeholder small { margin-top: 10px; color: #8fa8b6; }

/* Real product captures --------------------------------------------------- */
.customer-path-media {
  position: relative;
  margin: 0;
  padding: 14px;
  overflow: hidden;
  border: 1px solid rgba(242, 244, 246, .2);
  background:
    radial-gradient(circle at 78% 8%, rgba(196, 122, 58, .22), transparent 34%),
    radial-gradient(circle at 12% 84%, rgba(43, 93, 115, .48), transparent 40%),
    #071729;
  box-shadow: 0 30px 72px rgba(0, 0, 0, .28);
}
.customer-path--light .customer-path-media { border-color: rgba(11, 29, 51, .22); }
.customer-path-media__screen {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border: 1px solid rgba(242, 244, 246, .18);
  background: #102842;
}
.customer-path-media__screen img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.customer-path-media__screen--crop-right img {
  width: 122%;
  max-width: none;
  transform: translateX(-18%);
}
.customer-path-media__screen[data-ui-label]::after {
  position: absolute;
  top: 0;
  left: 0;
  min-width: min(360px, 62%);
  padding: 12px 16px;
  border-right: 1px solid rgba(11, 29, 51, .12);
  border-bottom: 1px solid rgba(11, 29, 51, .12);
  background: rgba(242, 244, 246, .96);
  color: #0b1d33;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
  content: attr(data-ui-label);
}
.customer-path-media--portrait { max-width: 580px; justify-self: center; }
.customer-path-media--portrait .customer-path-media__screen {
  height: 470px;
  aspect-ratio: auto;
  background:
    radial-gradient(circle at 50% 12%, rgba(43, 93, 115, .72), transparent 48%),
    #0b1d33;
}
.customer-path-media--portrait .customer-path-media__screen img { object-fit: contain; }
.customer-path-media figcaption {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 3px 2px;
}
.customer-path-media figcaption span {
  color: #c47a3a;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.customer-path-media figcaption strong {
  color: #f2f4f6;
  font-size: .9rem;
  text-align: right;
}

.v11-product-media-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
  margin-bottom: clamp(80px, 9vw, 120px);
}
.v11-product-media {
  grid-column: span 6;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(242, 244, 246, .18);
  background:
    radial-gradient(circle at 86% 6%, rgba(196, 122, 58, .18), transparent 30%),
    linear-gradient(145deg, #102842, #071729);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .24);
}
.v11-product-media--portrait { grid-column: span 4; }
.v11-product-media--login { grid-column: span 8; }
.v11-product-media--feature-crop { grid-column: 1 / -1; }
.v11-product-media__screen {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid rgba(242, 244, 246, .16);
  background: #071729;
}
.v11-product-media__screen img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v11-product-media--portrait .v11-product-media__screen,
.v11-product-media--login .v11-product-media__screen { height: 520px; aspect-ratio: auto; }
.v11-product-media--portrait .v11-product-media__screen img { object-fit: contain; }
.v11-product-media--login .v11-product-media__screen { background: #f7f6f8; }
.v11-product-media--login .v11-product-media__screen img { object-fit: contain; object-position: center; }
.v11-product-media--wide-crop .v11-product-media__screen img,
.v11-product-media--feature-crop .v11-product-media__screen img {
  width: 122%;
  max-width: none;
  transform: translateX(-18%);
}
.v11-product-media--feature-crop .v11-product-media__screen { aspect-ratio: 21 / 9; }
.v11-product-media figcaption {
  display: grid;
  gap: 6px;
  min-height: 112px;
  padding: 20px 8px 8px;
}
.v11-product-media figcaption strong { color: #f2f4f6; font-size: 1.04rem; line-height: 1.25; }
.v11-product-media figcaption span { color: #a9bbc6; font-size: .9rem; line-height: 1.5; }
.v11-platform-proof { border-top: 1px solid rgba(242, 244, 246, .12); }
.v11-pilot-head { max-width: 820px; margin: clamp(70px, 9vw, 112px) 0 36px; }
.v11-pilot-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid rgba(242, 244, 246, .16); background: rgba(242, 244, 246, .16); }
.v11-pilot-grid article { min-height: 250px; padding: 26px; background: #102842; }
.v11-pilot-grid span { color: #c47a3a; font-size: .72rem; font-weight: 850; }
.v11-pilot-grid h3 { margin: 42px 0 12px; color: #f2f4f6; font-size: 1.15rem; line-height: 1.2; }
.v11-pilot-grid p { margin: 0; color: #a9bbc6; font-size: .92rem; line-height: 1.6; }
.v11-boundary { display: grid; grid-template-columns: .7fr 1.3fr; gap: 36px; margin-top: 24px; padding: 26px 28px; border-left: 3px solid #c47a3a; background: rgba(16, 40, 66, .76); }
.v11-boundary strong { color: #f2f4f6; }
.v11-boundary p { margin: 0; color: #a9bbc6; line-height: 1.6; }
.v11-deployment { padding: clamp(76px, 9vw, 116px) 0; background: #0b1d33; }
.v11-deployment .v11-pilot-head { margin-top: 0; }
.v11-deployment-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid rgba(242, 244, 246, .16); background: rgba(242, 244, 246, .16); }
.v11-deployment-grid article { min-height: 260px; padding: 28px; background: #102842; }
.v11-deployment-grid span { color: #c47a3a; font-size: .72rem; font-weight: 850; }
.v11-deployment-grid h3 { margin: 44px 0 12px; color: #f2f4f6; font-size: 1.22rem; }
.v11-deployment-grid p { margin: 0; color: #a9bbc6; font-size: .94rem; line-height: 1.62; }
.v11-consultation { padding: clamp(82px, 10vw, 132px) 0; background: #102842; }
.v11-consultation-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(48px, 9vw, 126px); align-items: start; }
.v11-consultation ul { display: grid; gap: 13px; margin: 0 0 28px; padding: 0; list-style: none; counter-reset: deliverable; }
.v11-consultation li { position: relative; padding: 15px 18px 15px 50px; border-bottom: 1px solid rgba(242, 244, 246, .14); color: #dbe4e8; counter-increment: deliverable; }
.v11-consultation li::before { position: absolute; left: 10px; color: #c47a3a; font-size: .72rem; font-weight: 850; content: "0" counter(deliverable); }
.v11-consultation small { display: block; max-width: 560px; margin-top: 18px; color: #8fa8b6; line-height: 1.5; }
.v11-qualifier { padding: clamp(80px, 10vw, 124px) 0; background: #102842; }
.v11-qualifier-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(46px, 8vw, 118px); }
.v11-qualifier [data-product-qualifier] > strong { display: block; margin-bottom: 18px; color: #f2f4f6; font-size: 1.05rem; }
.v11-qualifier-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 24px; }
.v11-qualifier-options button { min-height: 72px; padding: 14px 16px; border: 1px solid rgba(242, 244, 246, .2); background: transparent; color: #dbe4e8; font: inherit; text-align: left; cursor: pointer; }
.v11-qualifier-options button:hover, .v11-qualifier-options button:focus-visible, .v11-qualifier-options button.is-selected { border-color: #c47a3a; background: rgba(196, 122, 58, .12); color: #fff; }
.v11-qualifier .button.is-disabled { opacity: .4; pointer-events: none; }
.v11-trust-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; }
.v11-trust-strip li { padding: 8px 11px; border: 1px solid rgba(242, 244, 246, .18); background: rgba(16, 40, 66, .76); color: #dbe4e8; font-size: .76rem; font-weight: 720; letter-spacing: .015em; }
.v11-routing-map, .v11-mcp-flow { padding: 28px; border: 1px solid rgba(242, 244, 246, .18); background: linear-gradient(145deg, rgba(16, 40, 66, .98), rgba(8, 24, 42, .94)); box-shadow: 0 32px 70px rgba(0, 0, 0, .24); }
.v11-routing-map > p, .v11-mcp-flow > p { margin: 0 0 22px; color: #8fa8b6; font-size: .72rem; font-weight: 820; letter-spacing: .11em; text-transform: uppercase; }
.v11-routing-map ol, .v11-mcp-flow ol { display: grid; margin: 0; padding: 0; list-style: none; }
.v11-routing-map li, .v11-mcp-flow li { position: relative; display: grid; grid-template-columns: 48px 1fr; align-items: center; min-height: 76px; border-top: 1px solid rgba(242, 244, 246, .13); }
.v11-routing-map li::after, .v11-mcp-flow li::after { position: absolute; bottom: -7px; left: 20px; z-index: 1; width: 13px; height: 13px; border-right: 1px solid #c47a3a; border-bottom: 1px solid #c47a3a; background: #0d243d; content: ""; transform: rotate(45deg); }
.v11-routing-map li:last-child::after, .v11-mcp-flow li:last-child::after { display: none; }
.v11-routing-map li span, .v11-mcp-flow li span { color: #c47a3a; font-size: .7rem; font-weight: 850; letter-spacing: .1em; }
.v11-routing-map li strong, .v11-mcp-flow li strong { color: #f2f4f6; font-size: 1rem; line-height: 1.35; }
.v11-routing-map small { display: block; margin-top: 20px; color: #8fa8b6; line-height: 1.5; }
.v11-section-head { max-width: 850px; margin-bottom: 42px; }
.v11-section-head h2, .v11-compliance-intro h2, .v11-operations h2, .v11-mcp-why h2, .v11-mcp-bounds h2 { margin: 0; font-size: clamp(2rem, 3.15vw, 3.35rem); line-height: 1.04; letter-spacing: -.055em; text-wrap: balance; }
.v11-platform-compare { padding: clamp(78px, 9vw, 122px) 0; background: #e8edf0; }
.v11-platform-compare .rails-overline, .v11-compliance .rails-overline, .v11-mcp-why .rails-overline, .v11-mcp-need .rails-overline { color: #a35f27; }
.v11-platform-compare h2, .v11-compliance h2, .v11-mcp-why h2, .v11-mcp-need h2 { color: #0b1d33; }
.v11-split-comparison { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.v11-split-comparison article { min-height: 420px; padding: clamp(28px, 4vw, 48px); border: 1px solid rgba(11, 29, 51, .15); background: #f2f4f6; }
.v11-split-comparison article.is-featured { border-color: #2b5d73; background: #102842; box-shadow: 0 24px 55px rgba(11, 29, 51, .16); }
.v11-split-comparison span, .v11-compliance-grid span, .v11-bound-grid span, .v11-need-grid span { color: #c47a3a; font-size: .72rem; font-weight: 850; letter-spacing: .12em; }
.v11-split-comparison h3 { margin: 48px 0 16px; color: #0b1d33; font-size: clamp(1.55rem, 2.35vw, 2.15rem); line-height: 1.08; letter-spacing: -.04em; }
.v11-split-comparison .is-featured h3 { color: #f2f4f6; }
.v11-split-comparison p { color: #2b5d73; line-height: 1.65; }
.v11-split-comparison .is-featured p { color: #b9c9d1; }
.v11-split-comparison ul { display: grid; gap: 12px; margin: 28px 0 0; padding: 0; list-style: none; }
.v11-split-comparison li { position: relative; padding-left: 22px; color: #244d61; line-height: 1.5; }
.v11-split-comparison .is-featured li { color: #dbe4e8; }
.v11-split-comparison li::before { position: absolute; top: .7em; left: 0; width: 9px; height: 1px; background: #c47a3a; content: ""; }
.v11-compliance { padding: clamp(78px, 9vw, 122px) 0; background: #f2f4f6; }
.v11-compliance-intro { max-width: 820px; margin-bottom: 42px; }
.v11-compliance-intro > p:last-child { max-width: 680px; color: #2b5d73; line-height: 1.65; }
.v11-compliance-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid rgba(11, 29, 51, .14); background: rgba(11, 29, 51, .14); }
.v11-compliance-grid article { min-height: 260px; padding: 26px; background: #f2f4f6; }
.v11-compliance-grid h3 { margin: 38px 0 12px; color: #0b1d33; font-size: 1.18rem; }
.v11-compliance-grid p { margin: 0; color: #2b5d73; font-size: .93rem; line-height: 1.6; }
.v11-compliance-note { margin: 24px 0 0; padding: 22px 24px; border-left: 3px solid #c47a3a; background: #e8edf0; color: #244d61; font-size: .88rem; line-height: 1.62; }
.v11-compliance-proof { display: grid; grid-template-columns: minmax(230px, .72fr) minmax(0, 1.65fr); gap: 0; margin: 28px 0 0; border: 1px solid rgba(11, 29, 51, .14); background: #fff; overflow: hidden; }
.v11-compliance-proof__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 3vw, 42px); }
.v11-compliance-proof__copy h3 { margin: 8px 0 12px; color: #0b1d33; font-size: clamp(1.45rem, 2vw, 2.15rem); line-height: 1.08; letter-spacing: -.035em; }
.v11-compliance-proof__copy > p:last-child { margin: 0; color: #2b5d73; line-height: 1.65; }
.v11-compliance-proof__screen { min-width: 0; background: #0b1d33; }
.v11-compliance-proof__screen img { display: block; width: 100%; height: 100%; min-height: 300px; object-fit: cover; object-position: center; }
.v11-operations { padding: clamp(76px, 9vw, 116px) 0; background: #102842; }
.v11-operations-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(46px, 8vw, 110px); align-items: center; }
.v11-operations h2 { color: #f2f4f6; }
.v11-operations p:not(.rails-overline) { max-width: 700px; color: #a9bbc6; line-height: 1.65; }
.v11-operations ul { display: grid; gap: 1px; margin: 0; padding: 1px; background: rgba(242, 244, 246, .14); list-style: none; }
.v11-operations li { padding: 19px 20px; background: #0b1d33; color: #dbe4e8; line-height: 1.45; }
.v11-plain-language { max-width: 650px; margin: -10px 0 28px; padding-left: 17px; border-left: 2px solid #c47a3a; color: #dbe4e8; font-weight: 650; line-height: 1.55; }
.v11-mcp-flow li { min-height: 70px; }
.v11-mcp-why { padding: clamp(78px, 9vw, 122px) 0; background: #e8edf0; }
.v11-mcp-why-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(46px, 8vw, 110px); align-items: end; margin-bottom: 50px; }
.v11-mcp-why-grid > p { margin: 0; color: #2b5d73; font-size: 1.06rem; line-height: 1.72; }
.v11-usecase-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid rgba(11, 29, 51, .14); background: rgba(11, 29, 51, .14); }
.v11-usecase-grid article { min-height: 285px; padding: 26px; background: #f2f4f6; }
.v11-usecase-grid span { color: #c47a3a; font-size: .72rem; font-weight: 850; }
.v11-usecase-grid h3 { margin: 42px 0 13px; color: #0b1d33; font-size: 1.2rem; line-height: 1.15; }
.v11-usecase-grid p { margin: 0; color: #2b5d73; font-size: .93rem; line-height: 1.62; }
.v11-mcp-bounds { padding: clamp(76px, 9vw, 116px) 0; background: #0b1d33; }
.v11-mcp-bounds h2 { color: #f2f4f6; }
.v11-bound-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid rgba(242, 244, 246, .14); background: rgba(242, 244, 246, .14); }
.v11-bound-grid article { min-height: 210px; padding: 28px; background: #102842; }
.v11-bound-grid h3 { margin: 34px 0 10px; color: #f2f4f6; font-size: 1.2rem; }
.v11-bound-grid p { margin: 0; color: #a9bbc6; line-height: 1.6; }
.v11-mcp-need { padding: clamp(78px, 9vw, 116px) 0; background: #f2f4f6; }
.v11-need-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.v11-need-grid article { padding: 34px; border: 1px solid rgba(11, 29, 51, .15); background: #e8edf0; }
.v11-need-grid article.is-featured { border-color: #c47a3a; background: #fff; }
.v11-need-grid h2 { margin: 32px 0 12px; font-size: clamp(1.45rem, 2.2vw, 2rem); }
.v11-need-grid p { margin: 0; color: #2b5d73; line-height: 1.65; }
@media (prefers-reduced-motion: reduce) { .v11-comparison-card { transition: none; } }
@media (max-width: 980px) { .v11-hero-grid, .v11-consultation-grid, .v11-qualifier-grid, .v11-operations-grid, .v11-mcp-why-grid { grid-template-columns: 1fr; } .v11-system-map { min-height: 0; } .v11-detail-grid, .v11-pilot-grid, .v11-compliance-grid, .v11-usecase-grid { grid-template-columns: repeat(2, 1fr); } .v11-proof-grid { grid-template-columns: 1fr; } }
@media (max-width: 680px) { .v11-hero { padding-top: 72px; } .v11-hero h1 { font-size: clamp(2.35rem, 11.5vw, 3.55rem); } .v11-system-map ol, .v11-comparison-grid, .v11-compare-grid, .v11-detail-grid, .v11-pilot-grid, .v11-deployment-grid, .v11-qualifier-options, .v11-split-comparison, .v11-compliance-grid, .v11-usecase-grid, .v11-bound-grid, .v11-need-grid, .v11-compliance-proof { grid-template-columns: 1fr; } .v11-system-map li:nth-child(3n+2) { transform: none; } .v11-closing .container { align-items: flex-start; flex-direction: column; } .v11-comparison-card, .v11-compare article, .v11-detail-card, .v11-pilot-grid article, .v11-deployment-grid article, .v11-split-comparison article, .v11-compliance-grid article, .v11-usecase-grid article, .v11-bound-grid article { min-height: 0; } .v11-demo-screen, .v11-video-placeholder { min-height: 360px; } .v11-boundary { grid-template-columns: 1fr; gap: 10px; } .v11-trust-strip { display: grid; } .v11-routing-map, .v11-mcp-flow { padding: 22px; } .customer-path-media--portrait .customer-path-media__screen { height: 430px; } .customer-path-media figcaption { align-items: flex-start; flex-direction: column; } .customer-path-media figcaption strong { text-align: left; } .v11-product-media, .v11-product-media--portrait, .v11-product-media--login, .v11-product-media--feature-crop { grid-column: 1 / -1; } .v11-product-media--portrait .v11-product-media__screen, .v11-product-media--login .v11-product-media__screen { height: 440px; } .v11-product-media--feature-crop .v11-product-media__screen { aspect-ratio: 16 / 10; } .v11-compliance-proof__screen img { min-height: 0; } }
