/* Telometrika visual identity. Intentionally loaded after the original layout CSS. */
:root {
  color-scheme: dark;
  --bg: #14141a;
  --s: #202027;
  --s2: #282530;
  --line: #ffffff22;
  --text: #f6f3ee;
  --muted: #bdb7c2;
  --violet: #7c5ac7;
  --violet2: #c5b3df;
  --orange: #c9783d;
  --green: #e7a45a;
  --red: #d48a83;
  --shadow: 0 30px 80px #0c0c1466;
  --r: 26px;
}

body {
  background: radial-gradient(circle at 88% 0, #4b2a7a24, transparent 27rem),
    radial-gradient(circle at 5% 30%, #c9783d0a, transparent 24rem), var(--bg);
  font-family: var(--tm-font-body), sans-serif;
  letter-spacing: -.01em;
}
h1, h2 { font-family: var(--tm-font-brand), sans-serif; font-weight: 700; }
h3, h4 { font-family: var(--tm-font-brand), sans-serif; font-weight: 600; }
.legal-card h1 { hyphens: none; }
button, input, select, textarea, .button, .nav-links, label {
  font-family: var(--tm-font-body), sans-serif;
}
.button, label { font-weight: 500; }
.hour-number, .weight-card strong, .rich-metrics b, .profile-journey b,
.profile-target-list b, .trend-grid b, .woman-data b, .chart-labels {
  font-family: var(--tm-font-body), sans-serif;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

.site-header { background: #15151be8; border-bottom-color: #ffffff19; }
.nav { min-height: 78px; }
.brand { flex: 0 0 auto; line-height: 0; }
.site-header .brand { width: 360px; max-width: 100%; flex-basis: 360px; }
.site-header .brand-horizontal { width: 100%; height: auto; }
.footer-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.3fr); }
.footer-grid .brand { max-width: 100%; }
.footer-grid .brand-horizontal { width: min(480px, 100%); height: auto; }
.nav-links { color: #c7c0c9; }
.nav-links a:hover, .text-link:hover { color: var(--text); }
.button {
  background: linear-gradient(135deg, #6d4aac, #4b2a7a);
  border-color: #9c80cc70;
  color: var(--text);
  box-shadow: 0 10px 27px #27144255;
}
.button:hover { filter: brightness(1.09); box-shadow: 0 13px 31px #27144266; }
.button.secondary { background: #f6f3ee09; border-color: #f6f3ee30; box-shadow: none; }
.button.secondary:hover { background: #f6f3ee13; }
.button:focus-visible, input:focus-visible, select:focus-visible,
.text-link:focus-visible, .modal-close:focus-visible,
.product-phone:focus-visible, .telegram-thread:focus-visible {
  outline: 2px solid #e7a45a; outline-offset: 3px;
}
.button.danger { color: #f1d0c9; background: #d48a8315; border-color: #d48a8366; }

h1, h2, h3 { color: var(--text); letter-spacing: -.055em; }
.kicker, .eyebrow { color: #dac5ef; }
.eyebrow:before { background: var(--orange); box-shadow: none; }
.hero { background: radial-gradient(circle at 74% 30%, #4b2a7a1a, transparent 27rem), linear-gradient(180deg, transparent, #121218); }
.hero:before { display: block; opacity: .5; }
.inline-demo:before { display: none; }
.hero h1 em { color: #d1b2e6; }
.hero-category { color: #e1d8e8; }
.microcopy i { background: var(--orange); box-shadow: none; }
.card {
  background: linear-gradient(145deg, #292630, #202028);
  border-color: #f6f3ee24;
  box-shadow: 0 20px 50px #0b0b1438;
}
.architect-grid { gap: 20px; }
.architect-photo {
  min-height: 610px;
  border: 0;
  border-radius: 0;
  background: radial-gradient(ellipse 57% 57% at 50% 48%, #76518a30, transparent 100%);
  box-shadow: none;
  isolation: isolate;
}
.architect-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
  filter: saturate(.9);
}
.architect-photo::after {
  background: linear-gradient(to bottom, #14141a 0%, transparent 10%, transparent 72%, #14141a 100%),
    linear-gradient(to right, #14141a 0%, transparent 12%, transparent 88%, #14141a 100%);
}
.architect-copy { background: linear-gradient(135deg, #c9783d0d, #7c5ac71a); }
.architect-copy .architect-story {
  max-width: 66ch;
  margin: 24px 0 28px;
  font-size: clamp(1.05rem, 1.42vw, 1.2rem);
  line-height: 1.62;
  letter-spacing: -.018em;
}
.architect-copy .architect-story p { margin: 0 0 .8rem; color: #ece5f0; }
.architect-copy .architect-story p:last-child { margin-bottom: 0; color: #dcc6e7; }
@media (max-width: 680px) {
  .architect-photo { min-height: 540px; }
  .architect-photo img { object-position: center 24%; }
}
.section, .apply, .finale { background-color: transparent; }
.scroll-layer { background: #14141a; border-top-color: #ffffff14; box-shadow: 0 -20px 60px #09090e80; }
.product-system::before { content: none; }
.data-watermark, .lower-watermark { color: #f6f3ee; opacity: .026; }
.section-rail a { color: #c7b9d8; }
.section-rail .rail-line { background: #b197ce80; }
.section-rail a.active .rail-line { background: var(--orange); box-shadow: none; }

.capture-stage {
  border-color: #8b6aab50;
  background: radial-gradient(circle at 50% 42%, #4b2a7a38, transparent 32%),
    linear-gradient(145deg, #211e28, #121217);
}
.capture-stage .body-watermark { opacity: .44; filter: saturate(.64) contrast(1.06); }
.capture-stage:after { background: linear-gradient(180deg, transparent 32%, #121218e8 86%); }
.capture-stage-label { color: #e7cfae; }
.capture-modes article, .capture-result { background: #211f27ed; border-color: #f6f3ee33; }
.capture-modes i { background: #7c5ac729; color: #d4bce9; }
.capture-result { border-color: #c9783d70; }
.capture-result span { color: #edbc81; }
.input-proof-grid, .input-proof-grid>div, .input-proof-grid>p { border-color: var(--line); }
.tone-orange { background: var(--orange); }
.tone-violet { background: var(--violet); }
.tone-green { background: var(--green); }
.tone-blue { background: #ad8ec9; }
.context-card, .process-flow article { background: #24242c; border-color: var(--line); }
.process-flow, .product-showcase, .strategy-selector, .strategy-proof {
  background: linear-gradient(135deg, #25222d, #211f29);
  border-color: #9977c057;
}
.process-flow .process-result { border-color: #c9783d70; }
.process-flow .process-result>b { color: #edbc81; }

.interface-showcase { background: linear-gradient(180deg, #29233355, transparent); }
.telegram-phone, .product-phone, .app-phone {
  background: #15151a; border-color: #f6f3ee30;
  box-shadow: 0 35px 75px #09090f88;
}
.telegram-chat-head, .product-tabs { background: #272430; }
.telegram-avatar { background: #1b1d24; }
.telegram-avatar img { width: 84%; height: 84%; object-fit: contain; }
.profile-avatar-demo { background: #1b1d24; padding: 6px; }
.profile-avatar-demo img { width: 100%; height: 100%; object-fit: contain; }
.telegram-thread { background: linear-gradient(160deg, #20212a, #1a1c24); }
.tg-user { background: #4b356c; }
.tg-bot, .tg-final { background: #2b2933; }
.tg-final { border-color: #c9783d75; }
.tg-open-app { background: #c9783d20; border-color: #c9783d72; color: #f1d2ac; }
.tg-open-app:hover, .tg-open-app:focus-visible { background: #c9783d32; }
.tg-play { background: #e9d8ed; color: #4b2a7a; }
.tg-wave i { background: #cbb5e3; }
.tg-disclaimer, .telegram-complete-control { color: #bda2d1; }
.product-phone .product-screen { background: radial-gradient(circle at 90% 0, #4b2a7a52, transparent 28%), #1e1e27; }
.product-phone .weight-card { background: linear-gradient(135deg, #4b2a7a, #292330 70%, #3b2c2a); }
.product-phone .rich-metrics .status-ring {
  --ring-color: #b08bd9;
  --ring-progress: 360deg;
  --ring-track: #514a58;
  position: relative;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border: 0;
  border-radius: 50%;
  background: conic-gradient(var(--ring-color) 0deg var(--ring-progress), var(--ring-track) var(--ring-progress) 360deg);
  color: transparent;
  font-size: 0;
  isolation: isolate;
}
.product-phone .rich-metrics .status-ring::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 5px;
  border-radius: 50%;
  background: #292832;
}
.product-phone .rich-metrics .status-ring.is-complete { --ring-color: #69c790; }
.product-phone .rich-metrics .status-ring.is-progress { --ring-color: #ad86d9; }
.product-phone .rich-metrics .status-ring.is-over { --ring-color: #df9658; }
.product-phone .rich-metrics .status-ring.is-over::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 7px;
  border-radius: 50%;
  box-shadow: 0 0 0 3px #292832;
  background: conic-gradient(var(--ring-color) 0deg var(--ring-extra), #56463e var(--ring-extra) 360deg);
}
.product-phone .rich-metrics .status-ring.is-over::after { z-index: 3; inset: 11px; }
.product-phone .rich-metrics article { align-items: center; }
.product-phone .rich-metrics .metric-state { font-size: .42rem; font-weight: 750; line-height: 1.25; }
.product-phone .status-ring.is-complete + div .metric-state { color: #91d4ae; }
.product-phone .status-ring.is-progress + div .metric-state { color: #c3a5e5; }
.product-phone .status-ring.is-over + div .metric-state { color: #e9b180; }
.product-phone .ring-legend {
  margin: 2px 3px 0;
  color: #c3bac6;
  font-size: .53rem;
  line-height: 1.45;
}
.product-tabs button.active, .product-tabs button:hover { color: #ddc8ef; }
.product-tabs .coach-tab, .product-tabs .coach-tab.active {
  background: #382c29; border-color: #c9783d70 !important; color: #edc397;
}
.product-phone .data-update-status { color: #e7bc8c; }
.weight-card, .rich-metrics article, .next-step-card, .rich-chart-card,
.trend-grid article, .timeline article, .profile-main-card,
.profile-orientations article, .coach-overview, .coach-actions-card,
.product-phone .history-day-demo, .product-phone .profile-target-list {
  background-color: #292832; border-color: #f6f3ee1d;
}
.next-step-card, .product-phone .analytics-brief, .product-phone .profile-review {
  background: linear-gradient(135deg, #34263f, #292832); border-color: #8d6db164;
}
.screen-status, .product-phone .future-note { border-color: #c9783d63; color: #ddbea0; }
.screen-status i, .status-ring.green, .timeline-dot.green { background: var(--green); color: #2b2020; }
.status-ring.green { border-color: var(--green); }
.chart-target { stroke: #e7a45a92; }
.chart-line, .calorie-line { stroke: #aa86da; }
.chart-points circle { fill: #aa86da; }
.chart-points .latest-pulse { fill: #aa86da2a; stroke: #aa86da88; }
.chart-points .latest { fill: #f6f3ee; stroke: #aa86da; }
.chart-legend .range { background: #e7a45a66; }
.chart-legend .fact { background: #aa86da; }
.calorie-band { fill: #e7a45a2a; }
.calorie-points .inside, .product-phone .muscle-trend svg circle { fill: #e7a45a; }
.calorie-points .below { fill: #ae8bb9; }
.calorie-points .above { fill: #c9783d; }
.product-phone .fat-trend svg path { stroke: #c9783d; }
.product-phone .fat-trend svg circle { fill: #c9783d; }
.product-phone .muscle-trend svg path { stroke: #e7a45a; }
.program-progress-demo i { background: linear-gradient(90deg, #7c5ac7, #e7a45a); }
.product-phone .profile-forecast { background: #3b2c29; border-color: #c9783d50; }
.contour-link:before, .contour-link:after { background: linear-gradient(transparent, #7c5ac7a0, transparent); }
.contour-link i { background: #4b2a7a28; border-color: #7c5ac777; color: #e4c8ec; }

.strategy-example-tabs button, .decision-goals button { background: #24232c; }
.strategy-example-tabs button.active, .decision-goals button.active, .app-tabs button.active {
  border-color: #a887cb8c; background: #3a2b4b; color: var(--text);
}
.strategy-route, .strategy-proof span { background: #25242d; }
.strategy-route article { background: #3a2b29; border-color: #c9783d66; }
.strategy-route article small { color: #edbc81; }
.strategy-route article p { color: #c8afa4; }
.trainer-compact-card, .summer-countdown-card {
  background: linear-gradient(135deg, #292530, #302729); border-color: #c9783d54;
}
.trainer-compact-actions li:before, .summer-countdown h2 strong { color: #e7a45a; }
.result-strip .result { background: radial-gradient(circle at 88% 5%, #7c5ac71d, transparent 38%), linear-gradient(155deg, #292732, #212229); }
.result-strip .result:nth-child(2) { background: radial-gradient(circle at 88% 5%, #c9783d1b, transparent 38%), linear-gradient(155deg, #2d292d, #212229); }
.result-strip .result:nth-child(3) { background: radial-gradient(circle at 88% 5%, #e7a45a17, transparent 38%), linear-gradient(155deg, #2b292c, #212229); }
.result strong { text-shadow: none; }

.result-visual-grid .woman-stage {
  background: radial-gradient(circle at 54% 42%, #4b2a7a50, transparent 58%),
    linear-gradient(155deg, #2b2633, #1d1e25);
  border-color: #9a7ab452;
}
.woman-stage:before { border-color: #e7a45a15; box-shadow: 0 0 0 42px #f6f3ee03, 0 0 0 84px #f6f3ee02; }
.woman-stage img {
  left: 53%; bottom: -6%; height: 108%; opacity: .48;
  filter: saturate(.68) contrast(.92) brightness(.93);
  -webkit-mask-image: linear-gradient(to bottom, #000 58%, #000c 78%, transparent 99%);
  mask-image: linear-gradient(to bottom, #000 58%, #000c 78%, transparent 99%);
}
.woman-data { background: #222129e8; border-color: #aa8aca78; }
.woman-data-next { border-color: #c9783d82; }
.woman-data-next small { color: #edbc81; }
.seat-card, .pending-card { background: #c9783d16; border-color: #c9783d65; }
.seat-card b { color: #edbc81; }
.form-card, .modal-dialog { background: #25242d; border-color: var(--line); }
input, select, .consent-block, .pending-id { background: #1e1e26; border-color: #f6f3ee2b; }
input::placeholder { color: #8f8993; }
input:focus, select:focus { border-color: #b899d9; }
.consent input { accent-color: var(--violet); }
.form-status.error { color: #e4aaa0; }
.modal { background: #111219d9; }
.modal-close { background: #34303b; }
.finale-card {
  background: linear-gradient(120deg, #1b1d24f2, #2c2136c9), url('man.webp') center 28%/cover;
}
.finale-card h2 span { color: #e7a45a; }
footer { color: #aaa3ae; border-top-color: var(--line); }
.legal-toc, .legal-grid>div, .legal-details>div, .legal-table, .legal-callout {
  background: #24232c; border-color: var(--line);
}
.legal-card a:not(.button) { color: #d3b5e8; }
.legal-part { border-color: #8d6db164; }
.legal-part-label { color: #c5a4de !important; }
.legal-status-critical { background: #392d2a; border-color: #c9783d80; }

@media (max-width: 680px) {
  .site-header .nav { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 67px; gap: 5px; padding-block: 9px; }
  .site-header .brand { width: min(360px, 100%); min-width: 0; }
  .site-header .button { padding-inline: 8px; font-size: .7rem; }
  .woman-stage img { left: 54%; height: 102%; bottom: -4%; opacity: .42; }
  .woman-data { background: #222129f0; }
  .footer-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .site-header .nav { justify-items: start; }
  .site-header .button { justify-self: end; }
}

@media (prefers-reduced-motion: reduce) {
  .button:hover { transform: none; }
}
