:root {
  --bg: #faf9f6;
  --surface: #ffffff;
  --ink: #202a40;
  --muted: #68738a;
  --primary: #f66d62;
  --primary-hover: #e85b51;
  --blue-soft: #e7edff;
  --mint-soft: #e0f5ec;
  --lilac-soft: #f1e8ff;
  --coral-soft: #fde8e5;
  --border: #e9e9ed;
  --container: 1160px;
  --page-padding: 24px;
  --section-space: 84px;
  --radius-card: 22px;
  --radius-pill: 999px;
  --shadow-card: 0 8px 28px rgba(32, 42, 64, .045);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--bg); color: var(--ink); font-size: 16px; line-height: 1.65; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
img, svg { max-width: 100%; }
.container { width: min(var(--container), calc(100% - 2 * var(--page-padding))); margin-inline: auto; }
.page-main { min-height: 60vh; }
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 100; padding: 10px 16px; background: white; border-radius: 10px; }
.skip-link:focus { left: 12px; }
.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; }

.site-header { position: sticky; top: 0; z-index: 20; background: rgba(250,249,246,.9); backdrop-filter: blur(16px); border-bottom: 1px solid rgba(233,233,237,.75); }
.header-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; flex-shrink: 0; }
.brand-mark { display: inline-flex; gap: 4px; }
.brand-mark i { width: 13px; height: 13px; display: block; border-radius: 50%; background: var(--primary); }
.brand-mark i:nth-child(2) { background: #a8a3f8; }
.brand-mark i:nth-child(3) { background: #64c8b0; }
.brand-name { font-weight: 750; letter-spacing: -.035em; font-size: 15px; }
.brand-name span { font-weight: 500; }
.site-nav { display: flex; align-items: center; gap: 30px; }
.site-nav > a:not(.button) { font-size: 14px; text-decoration: none; color: #48536a; transition: color .18s ease; }
.site-nav > a:not(.button):hover, .footer-link:hover { color: var(--primary-hover); }
.menu-toggle { display: none; background: transparent; border: 0; padding: 10px; cursor: pointer; }
.menu-toggle span:not(.sr-only) { display: block; width: 23px; height: 2px; background: var(--ink); margin: 4px 0; border-radius: 4px; }

.button { display: inline-flex; justify-content: center; align-items: center; gap: 9px; min-height: 49px; padding: 12px 23px; border: 1px solid transparent; border-radius: var(--radius-pill); text-decoration: none; font-size: 14px; line-height: 1.3; font-weight: 650; cursor: pointer; transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { background: var(--primary); color: white; box-shadow: 0 5px 14px rgba(246,109,98,.16); }
.button-primary:hover { background: var(--primary-hover); color: white; }
.button-secondary { border-color: #d9dce5; background: rgba(255,255,255,.62); color: var(--ink); }
.button-secondary:hover { background: white; }
.button-small { min-height: 42px; padding: 10px 18px; font-size: 13px; }
:focus-visible { outline: 3px solid #7e8bf0; outline-offset: 3px; }

.section { padding-block: var(--section-space); }
.hero { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 42px; padding-top: 62px; padding-bottom: 48px; min-height: 510px; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: #68799c; font-size: 11px; line-height: 1.5; letter-spacing: .14em; font-weight: 750; }
.eyebrow-dot { width: 8px; height: 8px; background: var(--primary); border-radius: 50%; box-shadow: 0 0 0 4px var(--coral-soft); }
.hero h1, .order-intro h1 { font-size: clamp(39px, 4.35vw, 60px); line-height: 1.08; letter-spacing: -.06em; font-weight: 750; margin: 19px 0 20px; max-width: 650px; }
.text-accent { color: #e9655a; }
.hero-lead { max-width: 550px; color: #5e6b84; font-size: 17px; line-height: 1.75; margin: 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-note { display: flex; align-items: center; gap: 9px; color: #65728a; font-size: 12px; margin-top: 25px; }
.note-check { display: inline-grid; place-items: center; width: 21px; height: 21px; background: var(--mint-soft); color: #148e79; border-radius: 50%; font-weight: 800; }
.hero-visual { min-height: 365px; position: relative; isolation: isolate; display: grid; place-items: center; }
.hero-visual::before { content: ""; position: absolute; width: 80%; height: 76%; border-radius: 44% 56% 61% 39% / 48% 44% 56% 52%; background: linear-gradient(140deg, #fbe8e4, #e9edff 55%, #e1f5ee); opacity: .78; transform: rotate(-8deg); z-index: -2; }
.visual-orbit { position: absolute; border: 1px solid rgba(103,123,203,.35); border-radius: 50%; z-index: -1; }
.orbit-one { width: 95%; height: 55%; transform: rotate(-24deg); }
.orbit-two { width: 78%; height: 80%; transform: rotate(35deg); border-color: rgba(246,109,98,.22); }
.mini-panel { position: absolute; background: rgba(255,255,255,.94); border: 1px solid rgba(228,231,239,.95); box-shadow: 0 18px 44px rgba(41,52,85,.10); border-radius: 16px; padding: 15px 16px; }
.panel-line { width: 68%; left: 2%; top: 13%; transform: rotate(-3deg); }
.panel-bars { width: 55%; right: 0; bottom: 10%; transform: rotate(3deg); }
.panel-heading { display: flex; justify-content: space-between; gap: 8px; align-items: center; color: #6a7690; font-size: 10px; font-weight: 650; }
.panel-dots { letter-spacing: 2px; color: #a7b0c6; }
.tiny-label { padding: 3px 7px; background: var(--mint-soft); border-radius: 99px; color: #16856f; font-size: 9px; }
.chart-grid { fill: none; stroke: #e8ebf2; stroke-width: 1; }
.chart-area { fill: url(#none); fill: rgba(106,129,239,.09); }
.chart-line { fill: none; stroke: #6d7cf0; stroke-width: 3; stroke-linecap: round; }
.chart-point { fill: #f66d62; stroke: white; stroke-width: 2; }
.panel-line svg { width: 100%; display: block; margin-top: 8px; overflow: visible; }
.bar-chart { display: flex; align-items: end; gap: 8px; height: 83px; margin-top: 16px; padding: 0 3px; }
.bar-chart i { flex: 1; background: linear-gradient(180deg,#8f9bfa,#c8ceff); border-radius: 5px 5px 2px 2px; }
.bar-chart i:nth-child(3n) { background: linear-gradient(180deg,#69cbb4,#c0eddf); }
.bar-labels { display: flex; justify-content: space-around; color: #9aa3b6; font-size: 9px; margin-top: 4px; }
.floating-chip { position: absolute; display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid rgba(232,234,242,.9); background: rgba(255,255,255,.96); border-radius: 13px; box-shadow: 0 10px 24px rgba(41,52,85,.08); }
.floating-chip strong, .floating-chip small { display: block; line-height: 1.35; }
.floating-chip strong { font-size: 10px; }
.floating-chip small { color: #7c879d; font-size: 9px; margin-top: 3px; }
.chip-icon { display: grid; place-items: center; width: 30px; height: 30px; background: var(--lilac-soft); color: #8854c9; border-radius: 9px; font-weight: 800; }
.chip-stat { left: 0; bottom: 7%; }
.chip-data { right: -1%; top: 4%; }
.visual-caption { position: absolute; bottom: -3px; left: 34%; font-size: 11px; color: #6b7ba0; letter-spacing: .04em; }

.trust-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; border: 1px solid var(--border); border-radius: 17px; background: rgba(255,255,255,.66); padding: 17px 24px; }
.trust-strip > div { display: flex; align-items: center; justify-content: center; gap: 10px; color: #56637d; font-size: 13px; }
.trust-strip > div + div { border-left: 1px solid var(--border); }
.trust-icon { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; }
.trust-coral { background: var(--coral-soft); color: #d9574f; }
.trust-blue { background: var(--blue-soft); color: #6675d9; }
.trust-mint { background: var(--mint-soft); color: #148e79; }

.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 35px; margin-bottom: 28px; }
.section-heading h2 { margin: 8px 0 0; font-size: clamp(28px, 3vw, 39px); line-height: 1.2; letter-spacing: -.045em; }
.section-heading > p { max-width: 390px; color: var(--muted); font-size: 14px; margin: 0 0 2px; }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.service-card { border: 1px solid var(--border); border-radius: var(--radius-card); padding: 24px; background: white; min-height: 250px; display: flex; flex-direction: column; box-shadow: var(--shadow-card); transition: transform .2s ease, box-shadow .2s ease; }
.service-card:hover, .project-card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(32,42,64,.08); }
.service-card-1 { background: linear-gradient(145deg,#f4f0ff,white 78%); }
.service-card-2 { background: linear-gradient(145deg,#eaf8f2,white 78%); }
.service-card-3 { background: linear-gradient(145deg,#edf2ff,white 78%); }
.service-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: rgba(255,255,255,.8); color: #6f68d6; font-size: 25px; font-weight: 600; }
.service-card-2 .service-icon { color: #15967c; }
.service-card-3 .service-icon { color: #427bd7; }
.service-card h3 { font-size: 18px; line-height: 1.3; letter-spacing: -.025em; margin: 18px 0 8px; }
.service-card p { color: #65718a; font-size: 13px; line-height: 1.7; margin: 0 0 18px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; text-decoration: none; color: #3c4a67; font-size: 12px; font-weight: 700; }
.text-link span { color: var(--primary); font-size: 17px; transition: transform .18s ease; }
.text-link:hover span { transform: translateX(3px); }

.portfolio-section { padding-top: 40px; }
.section-aside { color: #7d879a; font-size: 12px; }
.project-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.project-card { overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-card); background: white; box-shadow: var(--shadow-card); transition: transform .2s ease, box-shadow .2s ease; }
.project-wide { grid-column: span 2; display: grid; grid-template-columns: 1fr 1fr; }
.project-art { min-height: 220px; display: grid; place-items: center; padding: 24px; overflow: hidden; }
.project-wide .project-art { min-height: 280px; }
.project-art-dashboard { background: linear-gradient(135deg,#edf2ff,#f6f3ff 60%,#e7f7f0); }
.project-art-stats { background: linear-gradient(135deg,#f0f5ff,#eaf8f4); }
.project-art-ml { background: linear-gradient(135deg,#f4edff,#fcefeb); }
.mock-dashboard { width: 100%; max-width: 370px; background: white; border: 1px solid #e6e9f2; border-radius: 12px; padding: 15px; box-shadow: 0 14px 28px rgba(53,64,100,.1); transform: rotate(-2deg); }
.mock-kpis { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.mock-kpis i { height: 31px; border-radius: 5px; background: #f1f3ff; }
.mock-kpis i:nth-child(2) { background: #e5f7ef; }
.mock-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.mock-bars { display: flex; align-items: end; gap: 6px; height: 105px; padding: 10px 6px; border: 1px solid #eef0f5; border-radius: 6px; }
.mock-bars i { flex: 1; height: 40%; background: #9ba5f9; border-radius: 3px 3px 0 0; }
.mock-bars i:nth-child(2n) { height: 75%; background: #78cdb9; }
.mock-bars i:nth-child(3n) { height: 90%; }
.mock-line { display: grid; place-items: center; border: 1px solid #eef0f5; border-radius: 6px; }
.mock-line svg { width: 90%; fill: none; stroke: #7885ec; stroke-width: 3; }
.project-info { padding: 22px 23px 24px; }
.project-wide .project-info { display: flex; flex-direction: column; justify-content: center; padding: 28px; }
.project-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.project-tags span { border-radius: 999px; padding: 4px 9px; background: var(--blue-soft); color: #5367b6; font-size: 10px; font-weight: 650; }
.project-tags span:nth-child(2) { background: var(--mint-soft); color: #16856f; }
.project-info h3 { margin: 0 0 8px; font-size: 18px; line-height: 1.35; letter-spacing: -.025em; }
.project-info p { color: var(--muted); font-size: 13px; margin: 0 0 13px; }
.project-status { display: inline-block; align-self: flex-start; padding: 5px 9px; border-radius: 8px; background: #f5f5f7; color: #727b8e; font-size: 10px; }
.portfolio-disclaimer { color: #818a9c; font-size: 11px; margin: 15px 2px 0; }

.scatter-plot { position: relative; width: 100%; height: 150px; max-width: 300px; border-left: 1px solid #aebbd1; border-bottom: 1px solid #aebbd1; background: repeating-linear-gradient(to bottom,transparent 0 35px,rgba(139,153,181,.13) 36px 37px); }
.scatter-plot span { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #7d8df1; }
.scatter-plot span:nth-child(1){left:8%;bottom:13%}.scatter-plot span:nth-child(2){left:16%;bottom:24%}.scatter-plot span:nth-child(3){left:23%;bottom:19%}.scatter-plot span:nth-child(4){left:30%;bottom:37%}.scatter-plot span:nth-child(5){left:38%;bottom:32%}.scatter-plot span:nth-child(6){left:45%;bottom:46%}.scatter-plot span:nth-child(7){left:52%;bottom:42%}.scatter-plot span:nth-child(8){left:60%;bottom:57%}.scatter-plot span:nth-child(9){left:67%;bottom:54%}.scatter-plot span:nth-child(10){left:75%;bottom:69%}.scatter-plot span:nth-child(11){left:83%;bottom:72%}.scatter-plot span:nth-child(12){left:91%;bottom:88%;background:#64c8b0}
.scatter-plot i { position: absolute; width: 92%; height: 2px; left: 3%; bottom: 48%; background: #f66d62; transform: rotate(-34deg); transform-origin: center; opacity: .75; }
.prediction-chart { width: 100%; max-width: 300px; height: 150px; position: relative; border-bottom: 1px solid #c3b9d7; border-left: 1px solid #c3b9d7; background: repeating-linear-gradient(to bottom,transparent 0 35px,rgba(139,125,163,.12) 36px 37px); }
.prediction-chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.pred-line { fill: none; stroke-width: 3; stroke-linecap: round; }
.pred-line-a { stroke: #8b75dd; }.pred-line-b { stroke: #c1b5f0; stroke-dasharray: 5 5; }

.steps-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.step-card { border-top: 1px solid #dfe2e9; padding: 18px 15px 0 0; }
.step-card > span { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: var(--blue-soft); color: #6574d7; font-size: 12px; font-weight: 800; }
.step-card:nth-child(2) > span { background: var(--mint-soft); color: #148e79; }
.step-card:nth-child(3) > span { background: var(--lilac-soft); color: #8854c9; }
.step-card:nth-child(4) > span { background: var(--coral-soft); color: #d9574f; }
.step-card h3 { font-size: 15px; margin: 14px 0 6px; }
.step-card p { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 0; }

.cta-section { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 38px 42px; margin: 10px 0 82px; border-radius: 26px; background: #202a40; color: white; }
.cta-section .eyebrow { color: #b9c6e6; }
.cta-section h2 { max-width: 620px; font-size: clamp(26px,3vw,36px); line-height: 1.2; letter-spacing: -.04em; margin: 9px 0; }
.cta-section p { max-width: 600px; color: #c5ccda; font-size: 13px; margin: 0; }
.button-light { background: white; color: var(--ink); white-space: nowrap; position: relative; z-index: 1; }
.button-light:hover { background: #f1f3fa; }
.cta-decoration { position: absolute; right: 20%; top: -65px; font-size: 240px; line-height: 1; color: rgba(255,255,255,.035); pointer-events: none; }

.site-footer { border-top: 1px solid var(--border); background: rgba(255,255,255,.45); }
.footer-inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-block: 27px; }
.footer-inner p { color: var(--muted); font-size: 11px; max-width: 380px; margin: 0; }
.brand-footer .brand-name { font-size: 13px; }
.brand-footer .brand-mark i { width: 10px; height: 10px; }
.footer-link { font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-block: 14px 22px; border-top: 1px solid var(--border); color: #8991a1; }
.footer-bottom small { font-size: 10px; }

.order-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: start; gap: clamp(30px,6vw,78px); padding-top: 64px; }
.order-intro { position: sticky; top: 112px; }
.order-intro h1 { font-size: clamp(38px,4vw,53px); }
.order-intro .hero-lead { font-size: 15px; }
.order-points { display: grid; gap: 20px; margin-top: 32px; }
.order-points > div { display: flex; gap: 12px; align-items: flex-start; }
.point-check { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; flex: 0 0 25px; background: var(--mint-soft); color: #148e79; font-weight: 800; font-size: 12px; }
.order-points strong, .order-points small { display: block; }
.order-points strong { font-size: 13px; }
.order-points small { color: var(--muted); font-size: 12px; margin-top: 3px; }
.privacy-note { display: flex; gap: 11px; margin-top: 30px; padding: 15px; border-radius: 14px; background: #fff0e8; color: #8a5a45; }
.privacy-note > span { font-size: 18px; }
.privacy-note p { margin: 0; font-size: 11px; line-height: 1.7; }
.privacy-note strong { font-size: 12px; }
.form-card { background: white; border: 1px solid var(--border); border-radius: 24px; padding: clamp(22px,3.5vw,38px); box-shadow: 0 14px 42px rgba(32,42,64,.055); }
.form-card-heading { margin-bottom: 25px; }
.form-card-heading h2 { font-size: 24px; margin: 0 0 4px; letter-spacing: -.035em; }
.form-card-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.order-form { display: grid; gap: 18px; }
.order-form > label:not(.consent-label) { display: grid; gap: 7px; font-size: 12px; font-weight: 700; color: #39445b; }
.order-form label > span { color: var(--primary); }
.order-form .optional { color: #8b93a2; font-weight: 400; }
.order-form input:not([type="checkbox"]), .order-form select, .order-form textarea { width: 100%; min-height: 47px; padding: 11px 13px; border: 1px solid #dfe2e9; border-radius: 11px; color: var(--ink); background: #fff; font-size: 13px; font-weight: 400; outline: none; transition: border .18s ease, box-shadow .18s ease; }
.order-form textarea { resize: vertical; min-height: 125px; }
.order-form input:focus, .order-form select:focus, .order-form textarea:focus { border-color: #8793ed; box-shadow: 0 0 0 3px rgba(135,147,237,.14); }
.order-form input::placeholder, .order-form textarea::placeholder { color: #a0a7b5; }
.consent-label { display: flex; align-items: flex-start; gap: 10px; color: #69748a; font-size: 11px; line-height: 1.6; font-weight: 400; }
.consent-label input { margin-top: 4px; accent-color: var(--primary); flex: 0 0 auto; }
.consent-label span span { color: var(--primary); }
.form-submit { width: 100%; border: 0; }
.form-footnote { margin: -8px 0 0; color: #8b93a2; text-align: center; font-size: 10px; }
.errors { margin-bottom: 20px; padding: 15px 17px; border: 1px solid #f1c3bc; border-radius: 12px; background: #fff4f2; color: #8f3f36; font-size: 12px; }
.errors ul { margin: 7px 0 0; padding-left: 19px; }
.thanks-wrap { display: grid; place-items: center; min-height: 65vh; }
.thanks-card { width: min(100%, 610px); padding: clamp(30px,6vw,60px); text-align: center; background: white; border: 1px solid var(--border); border-radius: 26px; box-shadow: var(--shadow-card); }
.thanks-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 22px; border-radius: 20px; background: var(--mint-soft); color: #148e79; font-size: 28px; font-weight: 800; }
.thanks-card .eyebrow { justify-content: center; }
.thanks-card h1 { margin: 12px 0; font-size: clamp(30px,4vw,43px); letter-spacing: -.05em; }
.thanks-card p { color: var(--muted); font-size: 14px; margin: 0 auto 25px; max-width: 460px; }

@media (max-width: 900px) {
  :root { --section-space: 65px; }
  .hero { grid-template-columns: 1fr 0.85fr; gap: 18px; }
  .hero-visual { min-height: 320px; transform: scale(.94); }
  .service-grid { grid-template-columns: repeat(2,1fr); }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .section-heading > p { max-width: 600px; }
  .order-layout { grid-template-columns: 1fr 1.1fr; gap: 25px; }
  .order-intro { position: static; }
  .footer-inner { flex-wrap: wrap; }
}
@media (max-width: 680px) {
  :root { --page-padding: 18px; --section-space: 55px; }
  .header-inner { min-height: 68px; }
  .brand-name { font-size: 13px; }
  .brand-name span { display: none; }
  .menu-toggle { display: block; }
  .site-nav { display: none; position: absolute; top: 68px; left: 0; right: 0; padding: 18px var(--page-padding) 22px; flex-direction: column; align-items: stretch; gap: 17px; background: rgba(250,249,246,.98); border-bottom: 1px solid var(--border); box-shadow: 0 14px 25px rgba(32,42,64,.06); }
  .site-nav.is-open { display: flex; }
  .site-nav > a:not(.button) { font-size: 15px; }
  .site-nav .button { align-self: flex-start; }
  .hero { display: flex; flex-direction: column; align-items: stretch; padding-top: 43px; padding-bottom: 32px; gap: 5px; }
  .hero h1, .order-intro h1 { font-size: clamp(38px, 11vw, 51px); }
  .hero-lead { font-size: 15px; }
  .hero-visual { width: 100%; min-height: 310px; margin-top: 20px; transform: none; }
  .panel-line { left: 3%; width: 72%; }
  .panel-bars { width: 57%; right: 0; }
  .chip-stat { left: 0; bottom: 2%; }
  .chip-data { right: -1%; top: 0; }
  .trust-strip { grid-template-columns: 1fr; padding: 14px 17px; gap: 12px; }
  .trust-strip > div { justify-content: flex-start; }
  .trust-strip > div + div { border-left: 0; border-top: 1px solid var(--border); padding-top: 12px; }
  .service-grid, .project-grid { grid-template-columns: 1fr; }
  .project-wide { grid-column: auto; display: block; }
  .project-wide .project-art { min-height: 220px; }
  .project-wide .project-info { padding: 22px 23px 24px; }
  .section-heading h2 { font-size: 30px; }
  .section-aside { margin-top: -3px; }
  .steps-grid { grid-template-columns: repeat(2,1fr); gap: 25px 15px; }
  .cta-section { margin-bottom: 55px; padding: 28px 24px; align-items: flex-start; flex-direction: column; border-radius: 21px; }
  .cta-section h2 { font-size: 30px; }
  .cta-decoration { right: 2%; top: -40px; }
  .footer-inner { align-items: flex-start; flex-direction: column; gap: 15px; padding-block: 24px; }
  .footer-bottom { flex-direction: column; gap: 6px; }
  .order-layout { grid-template-columns: 1fr; padding-top: 42px; gap: 28px; }
  .order-intro h1 { max-width: 500px; }
  .order-points { margin-top: 24px; gap: 15px; }
  .privacy-note { margin-top: 22px; }
  .form-card { padding: 22px 18px; }
}

/* Вкладки, кейсы, FAQ */
.deliverables-section { position:relative; }
.deliverable-tabs { display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px; }
.deliverable-tab { border:1px solid #e0e4ef;background:rgba(255,255,255,.64);color:#68738d;padding:11px 16px;border-radius:999px;font:inherit;font-size:12px;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s; }
.deliverable-tab:hover { transform:translateY(-2px);border-color:#b6b9f0; }.deliverable-tab.is-active { background:#18294f;color:white;border-color:#18294f;box-shadow:0 8px 20px rgba(24,41,79,.14); }
.deliverable-panel { display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(25px,5vw,65px);padding:clamp(24px,4vw,44px);border:1px solid rgba(192,200,230,.65);border-radius:27px;background:linear-gradient(120deg,rgba(255,255,255,.9),rgba(239,244,255,.66));box-shadow:0 18px 55px rgba(52,69,119,.055); }
.deliverable-panel-copy { align-self:start;position:sticky;top:95px; }.deliverable-index { color:#8886df;font-size:9px;font-weight:800;letter-spacing:.15em; }.deliverable-panel-copy h3 { margin:18px 0 12px;color:var(--ink);font-size:clamp(24px,3vw,34px);line-height:1.13;letter-spacing:-.045em; }.deliverable-panel-copy>p { color:var(--muted);font-size:13px;line-height:1.85;margin-bottom:24px; }
.deliverable-list { display:grid; }.deliverable-list article { display:grid;grid-template-columns:34px 1fr;gap:14px;padding:17px 0;border-bottom:1px solid #e5e8f2; }.deliverable-list article:first-child { padding-top:0; }.deliverable-list article:last-child { border-bottom:0;padding-bottom:0; }.deliverable-list article>span { display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#eeefff;color:#7778d8;font-size:10px;font-weight:700; }.deliverable-list h4 { margin:0 0 5px;color:#273654;font-size:14px; }.deliverable-list p { margin:0;color:#778199;font-size:12px;line-height:1.75; }.scope-note { max-width:850px;margin:16px 0 0;color:#8992a7;font-size:11px;line-height:1.7; }
.case-detail-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px; }.case-detail-card { display:flex;flex-direction:column;padding:24px;border:1px solid var(--border);border-radius:21px;background:rgba(255,255,255,.75);box-shadow:0 12px 38px rgba(39,52,92,.035); }.case-number { display:flex;justify-content:space-between;align-items:center;color:#8a8bdf;font-size:9px;letter-spacing:.12em;font-weight:800; }.case-number span { color:#8e98ae;font-size:8px; }.case-detail-card h3 { margin:21px 0 18px;font-size:21px;line-height:1.2;letter-spacing:-.035em;color:#253352; }.case-detail-card p { margin:5px 0 12px;color:#737e96;font-size:12px;line-height:1.75; }.case-detail-card .case-question { margin:0;color:#8b83d9;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }.case-detail-card ul { margin:2px 0 18px;padding-left:17px;color:#737e96;font-size:11px;line-height:1.9; }.case-output { display:grid;gap:5px;margin-top:auto;padding:13px;border-radius:12px;background:linear-gradient(110deg,#f0efff,#eaf9f6); }.case-output span { color:#8989c8;font-size:9px; }.case-output strong { color:#45516d;font-size:11px;line-height:1.6; }.honesty-note { display:flex;gap:12px;align-items:flex-start;margin-top:17px;padding:17px 19px;border:1px solid #dfe8f1;border-radius:15px;background:rgba(242,248,255,.7); }.honesty-note>span { display:grid;place-items:center;flex:0 0 23px;height:23px;border-radius:50%;background:#e1e6ff;color:#7378d6;font-weight:700; }.honesty-note p { margin:0;color:#78849c;font-size:11px;line-height:1.8; }.honesty-note strong { color:#44516e; }
.trust-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px; }.trust-grid article { padding:22px 20px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(244,246,255,.62)); }.trust-number { color:#8584df;font-size:10px;font-weight:800;letter-spacing:.1em; }.trust-grid h3 { margin:18px 0 8px;font-size:15px;color:#2c3958; }.trust-grid p { margin:0;color:#78839a;font-size:11px;line-height:1.8; }
.faq-list { max-width:900px;margin:0 auto;border-top:1px solid var(--border); }.faq-list details { border-bottom:1px solid var(--border); }.faq-list summary { position:relative;list-style:none;padding:20px 42px 20px 0;color:#2b3958;font-size:14px;font-weight:600;cursor:pointer; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary:after { content:'+';position:absolute;right:5px;top:14px;color:#7779d8;font-size:24px;font-weight:400;transition:transform .25s; }.faq-list details[open] summary:after { transform:rotate(45deg); }.faq-list details p { max-width:760px;margin:-3px 0 22px;color:#768199;font-size:12px;line-height:1.9; }
.js-reveal { opacity:0;transform:translateY(18px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1); }.js-reveal.is-visible { opacity:1;transform:translateY(0); }
@media(max-width:900px) { .deliverable-panel{grid-template-columns:1fr}.deliverable-panel-copy{position:static}.case-detail-grid{grid-template-columns:1fr 1fr}.trust-grid{grid-template-columns:1fr 1fr} }
@media(max-width:680px) { .deliverable-tabs{gap:6px}.deliverable-tab{padding:9px 12px;font-size:11px}.deliverable-panel{padding:22px 18px;border-radius:20px}.case-detail-grid,.trust-grid{grid-template-columns:1fr}.case-detail-card{padding:21px}.trust-grid article{padding:19px}.faq-list summary{font-size:13px} }
@media(prefers-reduced-motion:reduce) { .js-reveal{opacity:1;transform:none;transition:none}.deliverable-tab{transition:none} }

/* Editorial research notebook art direction */
:root {
  --bg: #e9ebed;
  --surface: #f7f8f8;
  --ink: #17191d;
  --muted: #5f646c;
  --primary: #6554a2;
  --primary-hover: #4d3f87;
  --blue-soft: #e1e6eb;
  --mint-soft: #e3e9e7;
  --lilac-soft: #e9e4f2;
  --coral-soft: #eee5e1;
  --border: #cdd1d5;
  --radius-card: 3px;
  --shadow-card: 3px 4px 0 rgba(28, 32, 38, .055);
  --section-space: 76px;
}
body {
  background-color: var(--bg);
  background-image: linear-gradient(rgba(85, 99, 118, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(85, 99, 118, .055) 1px, transparent 1px);
  background-size: 24px 24px;
}
.site-header { background: rgba(233,235,237,.94); border-bottom-color: #c6cbd0; backdrop-filter: blur(8px); }
.brand-mark { gap: 0; transform: rotate(-12deg); }
.brand-mark i { width: 9px; height: 22px; border-radius: 0; background: #20242b; transform: skew(-14deg); }
.brand-mark i:nth-child(2) { background: #6554a2; transform: translateY(-3px) skew(-14deg); }
.brand-mark i:nth-child(3) { background: #9ca8b2; transform: translateY(2px) skew(-14deg); }
.brand-name { font-family: 'Inter', sans-serif; letter-spacing: .015em; font-weight: 700; }
.site-nav { gap: 23px; }
.site-nav > a:not(.button) { color: #424750; font-size: 12px; letter-spacing: .035em; text-transform: uppercase; }
.button { border-radius: 2px; box-shadow: none; letter-spacing: .01em; }
.button-primary { background: #22252b; color: #f6f6f4; }
.button-primary:hover { background: #6554a2; }
.button-secondary { background: transparent; border-color: #777e88; }
.button-secondary:hover { background: #f4f5f6; }
.hero { align-items: center; padding-top: 54px; gap: 34px; }
.hero h1, .order-intro h1, .section-heading h2, .cta-section h2, .form-card-heading h2, .thanks-card h1 {
  font-family: 'Bodoni Moda', 'Cormorant Garamond', Georgia, serif;
  font-weight: 500;
  letter-spacing: -.045em;
}
.hero h1 { font-size: clamp(48px, 5.6vw, 76px); line-height: .99; }
.text-accent { color: #6554a2; font-style: italic; }
.eyebrow { color: #6554a2; letter-spacing: .17em; font-size: 10px; }
.eyebrow-dot { background: #6554a2; border-radius: 0; box-shadow: none; transform: rotate(45deg); }
.hero-lead { color: #4c5159; font-size: 15px; max-width: 490px; }
.hero-visual { min-height: 430px; border: 1px solid #b8bdc4; background: rgba(246,247,247,.72); overflow: hidden; }
.hero-visual::before { width: 65%; height: 67%; border-radius: 0; background: repeating-linear-gradient(135deg, rgba(101,84,162,.09) 0 1px, transparent 1px 8px), linear-gradient(135deg,#d6dce1,#eff0f0 52%,#d8d2e5); opacity: .9; transform: rotate(-7deg); }
.visual-orbit { border-radius: 0; border-style: dashed; border-color: rgba(47,53,65,.4); }
.orbit-one { width: 84%; height: 66%; transform: rotate(-28deg); }
.orbit-two { width: 69%; height: 87%; transform: rotate(36deg); border-color: rgba(101,84,162,.48); }
.mini-panel { border-radius: 1px; background: rgba(247,248,248,.94); border-color: #aeb4bc; box-shadow: 4px 5px 0 rgba(30,35,43,.09); }
.panel-line { transform: rotate(-2deg); }
.panel-bars { transform: rotate(2deg); }
.floating-chip { border-radius: 1px; background: #f4f5f5; border-color: #b9bec4; box-shadow: 3px 4px 0 rgba(30,35,43,.07); }
.chip-icon { border-radius: 0; background: #e4e0ef; color: #594b91; }
.visual-caption { font-family: 'Inter', sans-serif; color: #545b65; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.trust-strip { border-radius: 0; background: rgba(246,247,247,.78); border-color: #bfc4ca; box-shadow: 3px 3px 0 rgba(30,35,43,.035); }
.trust-icon { border-radius: 0; background: #e4e0ef; color: #594b91; }
.trust-coral, .trust-blue, .trust-mint { background: #e5e7e9; color: #4e5360; }
.section-heading h2 { font-size: clamp(32px, 3.8vw, 48px); line-height: 1.05; }
.section-heading > p { color: #555b64; }
.service-grid { gap: 12px; }
.service-card, .project-card, .case-detail-card, .trust-grid article, .faq-list details, .form-card, .thanks-card {
  border-radius: 2px;
  border-color: #c4c9cf;
  box-shadow: 3px 4px 0 rgba(25,30,38,.045);
}
.service-card { background-color: rgba(247,248,248,.92); padding: 22px; }
.service-card-1, .service-card-2, .service-card-3 { background-image: none; }
.service-icon { border-radius: 0; background: #e5e7e9; color: #6554a2; }
.service-card h3, .project-info h3, .case-detail-card h3, .trust-grid h3, .faq-list summary, .step-card h3 { font-family: 'Bodoni Moda', 'Cormorant Garamond', Georgia, serif; font-weight: 600; letter-spacing: -.025em; }
.service-card h3 { font-size: 22px; }
.service-card p, .project-info p, .case-detail-card p, .case-detail-card li, .trust-grid p, .faq-list p { color: #515760; }
.text-link { color: #4b4078; text-transform: uppercase; letter-spacing: .07em; font-size: 10px; }
.text-link span { color: #6554a2; }
.project-grid { gap: 14px; }
.project-card { background: rgba(247,248,248,.94); }
.project-art { position: relative; border-bottom: 1px solid #c8cdd2; }
.project-art-dashboard, .project-art-stats, .project-art-ml { background-color: #e2e5e8; background-image: linear-gradient(rgba(72,81,94,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(72,81,94,.08) 1px, transparent 1px); background-size: 18px 18px; }
.mock-dashboard { border-radius: 1px; box-shadow: 5px 6px 0 rgba(30,35,43,.1); transform: rotate(-1.5deg); }
.mock-kpis i, .mock-bars i { border-radius: 0; }
.project-tags span, .project-tags span:nth-child(2) { border-radius: 0; background: #e4e0ef; color: #51447f; }
.project-status { border-radius: 0; background: #e5e7e9; color: #4f5660; }
.portfolio-disclaimer { color: #626871; }
.case-detail-card { background: rgba(247,248,248,.93); }
.case-number { color: #6554a2; letter-spacing: .13em; }
.case-number span { border-radius: 0; background: #e5e1ef; color: #4f427e; }
.case-output { background: #e7e9eb; border-left: 2px solid #6554a2; }
.honesty-note { border-radius: 0; background: #e1e4e7; border-color: #c4c9cf; }
.honesty-note > span { border-radius: 0; background: #6554a2; }
.step-card { border-top-color: #aeb4bc; }
.step-card > span, .step-card:nth-child(2) > span, .step-card:nth-child(3) > span, .step-card:nth-child(4) > span { border-radius: 0; background: #e3e5e8; color: #51447f; }
.trust-grid article { background: rgba(247,248,248,.88); }
.trust-number { font-family: 'Bodoni Moda', Georgia, serif; color: #6554a2; }
.faq-list details { background: rgba(247,248,248,.9); }
.faq-list summary::after { color: #6554a2; }
.cta-section { border-radius: 2px; background: #24272e; box-shadow: 5px 5px 0 rgba(25,30,38,.12); }
.cta-section h2 { font-size: clamp(30px,3.5vw,44px); }
.cta-decoration { font-family: 'Bodoni Moda', Georgia, serif; color: rgba(230,226,242,.09); }
.button-light { border-radius: 2px; }
.site-footer { background: rgba(230,232,234,.95); border-top-color: #bfc4ca; }
.footer-link { color: #51447f; text-transform: uppercase; letter-spacing: .06em; }
.footer-bottom { border-top-color: #c6cbd0; }
.order-layout { padding-top: 54px; }
.order-intro h1 { font-size: clamp(43px,5vw,65px); }
.point-check { border-radius: 0; background: #e4e0ef; color: #51447f; }
.privacy-note { border-radius: 0; background: #e5e7e9; color: #4f5660; border-left: 2px solid #6554a2; }
.form-card { background: rgba(247,248,248,.95); }
.order-form input:not([type="checkbox"]), .order-form select, .order-form textarea { border-radius: 1px; border-color: #bfc5cc; background: #fbfbfb; }
.order-form input:focus, .order-form select:focus, .order-form textarea:focus { border-color: #6554a2; box-shadow: 0 0 0 2px rgba(101,84,162,.12); }
.errors { border-radius: 1px; }
.thanks-card { background: rgba(247,248,248,.95); }
.thanks-icon { border-radius: 0; background: #e4e0ef; color: #51447f; }

@media (max-width: 900px) {
  .hero-visual { min-height: 340px; }
}
@media (max-width: 640px) {
  :root { --page-padding: 16px; --section-space: 56px; }
  body { background-size: 20px 20px; }
  .hero { padding-top: 38px; }
  .hero h1 { font-size: clamp(43px, 12vw, 61px); }
  .hero-visual { min-height: 290px; transform: none; }
  .trust-strip { padding: 13px; }
  .service-card { padding: 18px; }
  .cta-section { padding: 27px 23px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* =====================================================================
   СТРОГАЯ ГЕОМЕТРИЯ
   Этот блок стоит в самом конце файла, поэтому он перекрывает правила выше:
   при одинаковой «силе» селекторов побеждает то правило, что написано позже.

   Три идеи:
   1) никаких скруглений: border-radius: 0;
   2) одна тень на весь сайт, жёсткая, со сдвигом вправо-вниз, как у бумажной карточки;
   3) у всех блоков одна рамка одного цвета.
   ===================================================================== */
:root {
  --line: #b9bec5;                                        /* рамка всех блоков */
  --shadow: 6px 6px 0 rgba(23, 25, 29, .09);              /* основная тень */
  --shadow-hover: 9px 9px 0 rgba(23, 25, 29, .12);        /* при наведении «приподнимается» */
  --shadow-small: 4px 4px 0 rgba(23, 25, 29, .08);        /* для мелких элементов */
}

/* 1. Убираем скругления у всех блоков, кнопок, плашек и полей */
.button, .skip-link, .menu-toggle span:not(.sr-only),
.trust-strip, .trust-icon, .note-check, .eyebrow-dot,
.service-card, .service-icon, .project-card, .project-tags span, .project-status,
.mock-dashboard, .mock-kpis i, .mock-bars i, .mock-bars, .mock-line, .bar-chart i, .tiny-label,
.deliverable-tab, .deliverable-panel, .deliverable-list article > span,
.case-detail-card, .case-number span, .case-output, .honesty-note, .honesty-note > span,
.step-card > span, .trust-grid article, .faq-list details, .cta-section,
.form-card, .order-form input, .order-form select, .order-form textarea,
.errors, .privacy-note, .point-check, .thanks-card, .thanks-icon {
  border-radius: 0;
}
.eyebrow-dot { transform: rotate(45deg); }   /* точка-ромбик: квадрат, повёрнутый на 45° */

/* 2. Единая тень и рамка для всех «карточек» */
.trust-strip, .service-card, .project-card, .deliverable-panel, .case-detail-card,
.trust-grid article, .form-card, .thanks-card, .honesty-note, .cta-section {
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.service-card:hover, .project-card:hover, .case-detail-card:hover, .trust-grid article:hover {
  transform: translate(-2px, -2px);           /* сдвиг навстречу тени: карточка «поднимается» */
  box-shadow: var(--shadow-hover);
}
.case-detail-card, .trust-grid article { transition: transform .18s ease, box-shadow .18s ease; }
.faq-list details { box-shadow: none; }
.cta-section { box-shadow: 8px 8px 0 rgba(23, 25, 29, .18); }

/* 3. Вкладки «Статистика / Предиктивная аналитика / …» — прямоугольные кнопки с тенью */
.deliverable-tabs { gap: 10px; margin-bottom: 22px; }
.deliverable-tab {
  padding: 12px 18px;
  border: 1px solid var(--line);
  background: #f7f8f8;
  color: #3f444d;
  box-shadow: var(--shadow-small);
  letter-spacing: .02em;
}
.deliverable-tab:hover { transform: translate(-1px, -1px); border-color: #6554a2; box-shadow: 5px 5px 0 rgba(23,25,29,.10); }
.deliverable-tab.is-active {
  background: #17191d; color: #fff; border-color: #17191d;
  box-shadow: 4px 4px 0 #6554a2;              /* у активной вкладки тень фирменного цвета */
}

/* Панель с пунктами: плоский светлый фон вместо градиента */
.deliverable-panel { background: #f7f8f8; }
.deliverable-list article { border-bottom-color: #d3d7db; }
.deliverable-list article > span {
  background: transparent; border: 1px solid #6554a2; color: #6554a2;
  font-family: 'Bodoni Moda', Georgia, serif; font-size: 12px;
}

/* 4. Плашка «На выходе»: чёткий прямоугольник, слева толстая линия */
.case-output {
  background: #eceef0;
  border: 1px solid #c9cdd2;
  border-left: 4px solid #6554a2;
  padding: 13px 15px;
}
.case-output span { color: #6554a2; letter-spacing: .1em; text-transform: uppercase; font-size: 9px; font-weight: 700; }
.case-output strong { color: #20242b; }

.honesty-note { background: #f1f2f3; border-left: 4px solid #6554a2; }

/* =====================================================================
   РИС. 1 — «вырезка из научной статьи» в первом экране
   ===================================================================== */
.paper-figure {
  position: relative;
  margin: 0;
  padding: 20px 22px 18px;
  background: #fbfbf9;                        /* чуть тёплая «бумага» */
  border: 1px solid var(--line);
  box-shadow: 10px 10px 0 rgba(23, 25, 29, .10);
}
/* Второй лист под рисунком: псевдоэлемент ::before — блок, которого нет в HTML, его создаёт CSS */
.paper-figure::before {
  content: "";
  position: absolute; inset: 0;
  transform: translate(14px, 14px);
  border: 1px solid #c9cdd2;
  background: #eef0f1;
  z-index: -1;
}

.paper-head {
  display: flex; align-items: baseline; gap: 12px;
  padding-bottom: 10px; margin-bottom: 12px;
  border-bottom: 2px solid #17191d;           /* жирная линейка, как в журнале */
}
.paper-fig { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 15px; white-space: nowrap; }
.paper-title { font-size: 12px; font-weight: 600; color: #30343b; }
.paper-meta { margin-left: auto; font-size: 10px; letter-spacing: .04em; color: #7a808a; white-space: nowrap; }

.paper-panel { margin-bottom: 6px; }
.paper-panel + .paper-panel { border-top: 1px solid #dfe2e5; padding-top: 8px; }
.panel-cap { font-size: 11px; color: #4b5059; margin-bottom: 2px; }
.panel-cap b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 14px; margin-right: 4px; }
.panel-cap span { color: #6554a2; font-weight: 600; }
.paper-panel svg { display: block; width: 100%; height: auto; overflow: visible; }

/* Оформление элементов внутри SVG: fill — заливка, stroke — линия */
.ax-line  { fill: none; stroke: #2a2e35; stroke-width: 1; }
.ax-grid  { stroke: #e3e5e8; stroke-width: 1; }
.ax-tick  { font-size: 9px; fill: #6d737c; font-family: Inter, sans-serif; }
.ax-label { font-size: 10px; fill: #2a2e35; font-style: italic; font-family: 'Bodoni Moda', Georgia, serif; }
.ax-note  { font-size: 9px; fill: #6554a2; font-family: Inter, sans-serif; }
.ln-truth { fill: none; stroke: #8b9099; stroke-width: 1.2; stroke-dasharray: 4 3; }
.ln-fit   { fill: none; stroke: #6554a2; stroke-width: 2; }
.ln-train { fill: none; stroke: #17191d; stroke-width: 1.4; }
.ln-valid { fill: none; stroke: #6554a2; stroke-width: 1.8; }
.ln-stop  { stroke: #6554a2; stroke-width: 1; stroke-dasharray: 2 3; }
.ln-cursor { stroke: #17191d; stroke-width: 1; opacity: .35; }
.pt-train { fill: #17191d; }
.pt-valid { fill: #fbfbf9; stroke: #8b9099; stroke-width: 1; }
.pt-valid-sq { fill: #6554a2; }
#gbm-loss { cursor: crosshair; }

/* Ползунок и показатели */
.paper-controls {
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 8px 16px;
  margin-top: 10px; padding: 10px 12px;
  background: #f0f1f2; border: 1px solid #d3d7db;
}
.paper-controls label { font-size: 11px; color: #4b5059; white-space: nowrap; }
.paper-controls label strong { color: #17191d; font-variant-numeric: tabular-nums; }
.paper-controls input[type="range"] { width: 100%; accent-color: #6554a2; }
.paper-stats { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 10px; color: #6d737c; align-items: center; }
.paper-stats b { color: #17191d; font-variant-numeric: tabular-nums; font-weight: 600; }
.fit-state {
  margin-left: auto; padding: 3px 8px;
  font-size: 9px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700;
  border: 1px solid currentColor;
}
.fit-state[data-state="under"] { color: #8b6a2b; }
.fit-state[data-state="ok"]    { color: #2f7a5f; }
.fit-state[data-state="over"]  { color: #b0473d; }

.paper-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 10px 0 8px; font-size: 10px; color: #5f646c; }
.paper-legend span { display: inline-flex; align-items: center; gap: 6px; }
.paper-legend i { display: inline-block; }
.lg-train { width: 6px; height: 6px; background: #17191d; }
.lg-valid { width: 7px; height: 7px; border: 1px solid #8b9099; border-radius: 50%; }
.lg-truth { width: 16px; border-top: 1.5px dashed #8b9099; }
.lg-fit   { width: 16px; border-top: 2px solid #6554a2; }

.paper-figure figcaption {
  padding-top: 10px; border-top: 1px solid #dfe2e5;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 15px; line-height: 1.45; color: #30343b; font-style: italic;
}
.paper-figure figcaption b { font-style: normal; font-weight: 700; }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .paper-figure { margin-right: 14px; }
}
@media (max-width: 680px) {
  .paper-figure { padding: 14px 14px 12px; box-shadow: 6px 6px 0 rgba(23,25,29,.10); }
  .paper-figure::before { transform: translate(9px, 9px); }
  .paper-meta { display: none; }
  .paper-head { flex-wrap: wrap; gap: 4px 10px; }
  .fit-state { margin-left: 0; }
  .deliverable-tab { padding: 10px 12px; }
}
.hero { isolation: isolate; }

/* Четыре услуги — в один ряд, без «сиротливой» карточки во второй строке */
@media (min-width: 1000px) { .service-grid { grid-template-columns: repeat(4, 1fr); } }
/* На телефоне SVG ужимается вместе с текстом — делаем подписи осей крупнее */
@media (max-width: 680px) {
  .ax-tick { font-size: 15px; }
  .ax-label, .ax-note { font-size: 15px; }
}

/* =====================================================================
   ПРАВКИ 15.10
   1) первый экран: текст и рисунок поровну, рисунок ниже по высоте;
   2) подзаголовок секции — под заголовком, справа — математическая фигура;
   3) подсветка текущего раздела в меню;
   4) блок «Кейс» + отзыв;
   5) декоративные фигуры: единичная окружность, куб, золотой прямоугольник, Серпинский.
   ===================================================================== */

/* ---------- 1. Первый экран ---------- */
.hero { grid-template-columns: 1fr 1fr; gap: 56px; padding-top: 40px; padding-bottom: 40px; }
.paper-figure { padding: 14px 18px 12px; }
.paper-head { padding-bottom: 8px; margin-bottom: 8px; }
.paper-panel { margin-bottom: 2px; }
.paper-panel + .paper-panel { padding-top: 4px; }
.panel-cap { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.panel-cap em { font-style: normal; color: #6554a2; font-weight: 600; }
.panel-cap .paper-legend { margin: 0; gap: 4px 12px; font-size: 10px; }
.paper-controls {
  grid-template-columns: auto 1fr auto auto auto;   /* подпись | ползунок | train | valid | состояние */
  gap: 14px; margin-top: 6px; padding: 8px 12px;
}
.paper-stat { font-size: 10px; color: #6d737c; white-space: nowrap; }
.paper-stat b { color: #17191d; font-variant-numeric: tabular-nums; font-weight: 600; }
.fit-state { margin-left: 0; }
.paper-figure figcaption { font-size: 14px; line-height: 1.4; padding-top: 8px; margin-top: 8px; }

/* ---------- 2. Заголовки секций ----------
   Слева: надзаголовок, заголовок и под ним подзаголовок с фиолетовой линией (как аннотация в статье).
   Справа: фигура. grid — это «таблица» из двух колонок: гибкая и фиксированная 210px. */
.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  align-items: end;
  gap: 40px;
  margin-bottom: 34px;
}
.sh-text h2 { margin: 10px 0 0; }
.section-heading .section-lead {
  max-width: 640px;
  margin: 18px 0 0;
  padding-left: 18px;
  border-left: 2px solid #6554a2;
  color: #4c5159; font-size: 15px; line-height: 1.7;
}
.section-heading .section-aside {
  display: inline-block; margin-top: 14px; padding: 4px 10px;
  border: 1px solid var(--line); background: #f1f2f3;
  font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #5f646c;
}
.sh-deco { justify-self: end; width: 100%; max-width: 210px; }
.sh-deco .geo { display: block; width: 100%; height: auto; }

/* ---------- 3. Меню: текущий раздел ---------- */
.site-nav > a:not(.button) { padding: 6px 0; border-bottom: 2px solid transparent; }
.site-nav > a.is-current { color: #6554a2; border-bottom-color: #6554a2; }

/* ---------- 5. Математические фигуры ---------- */
.geo, .geo-mini { overflow: visible; }
.geo-construct { fill: none; stroke: #9aa1ab; stroke-width: .6; stroke-dasharray: 2 3; }
.geo-axis      { stroke: #b4bac2; stroke-width: .6; }
.geo-path      { fill: none; stroke: #8b9099; stroke-width: .8; stroke-dasharray: 1 4; }
.geo-note      { font: 9px Inter, sans-serif; fill: #7a808a; }
.geo-dot       { fill: #6554a2; }

/* Куб */
.geo-face-top   { fill: #f7f8f8; stroke: #2a2e35; stroke-width: 1; }
.geo-face-left  { fill: #e3e6e9; stroke: #2a2e35; stroke-width: 1; }
.geo-face-right { fill: #c9ced4; stroke: #2a2e35; stroke-width: 1; }
.geo-hidden     { fill: none; stroke: #8b9099; stroke-width: .8; stroke-dasharray: 3 3; }
.geo-section    { fill: rgba(101, 84, 162, .12); stroke: #6554a2; stroke-width: .9; }

/* Золотой прямоугольник */
.geo-square          { fill: #f7f8f8; stroke: #2a2e35; stroke-width: .8; }
.geo-square--accent  { fill: #e9e4f2; }
.geo-spiral          { fill: none; stroke: #6554a2; stroke-width: 1.6; }

/* Треугольник Серпинского: тёмный фон-треугольник, поверх светлые — «дырки» остаются тёмными */
.geo-tri-outline { fill: #c9ced4; stroke: #2a2e35; stroke-width: 1; }
.geo-tri         { fill: #f7f8f8; stroke: #2a2e35; stroke-width: .6; }

/* ---------- 4. Кейс ---------- */
.case-sheet {
  display: grid; grid-template-columns: 330px minmax(0, 1fr);
  background: #fbfbf9; border: 1px solid var(--line); box-shadow: var(--shadow);
}
.case-meta { padding: 28px 26px; background: #f0f1f2; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.case-no { color: #6554a2; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.case-meta h3 { margin: 12px 0 22px; font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 23px; line-height: 1.2; letter-spacing: -.02em; }
.case-meta dl { margin: 0; border-top: 2px solid #17191d; }
.case-meta dl > div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; padding: 9px 0; border-bottom: 1px solid #d3d7db; }
.case-meta dt { color: #6554a2; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding-top: 2px; }
.case-meta dd { margin: 0; font-size: 12px; color: #30343b; line-height: 1.5; }
.case-kpis { display: grid; grid-template-columns: 1fr 1fr; margin-top: auto; padding-top: 22px; gap: 10px; }
.case-kpis > div { padding: 12px; background: #fbfbf9; border: 1px solid var(--line); box-shadow: var(--shadow-small); }
.case-kpis b { display: block; font-family: 'Bodoni Moda', Georgia, serif; font-size: 19px; font-weight: 600; white-space: nowrap; }
.case-kpis span { display: block; margin-top: 4px; font-size: 10px; color: #5f646c; line-height: 1.4; }

.case-body { padding: 28px 30px 30px; }
.case-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 28px; }
.case-steps li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; }
.step-no { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #6554a2; color: #6554a2; font-family: 'Bodoni Moda', Georgia, serif; font-size: 12px; }
.case-steps h4 { margin: 3px 0 4px; font-size: 14px; color: #17191d; }
.case-steps p { margin: 0; font-size: 12px; line-height: 1.7; color: #515760; }

.case-figure { margin: 24px 0 18px; padding: 14px 16px 10px; background: #fff; border: 1px solid #d3d7db; }
.case-figure .panel-cap { margin-bottom: 6px; }
.km-svg { display: block; width: 100%; height: auto; overflow: visible; }
.km-a { fill: none; stroke: #17191d; stroke-width: 1.6; }
.km-b { fill: none; stroke: #6554a2; stroke-width: 2; }
.km-median { stroke: #9aa1ab; stroke-width: 1; stroke-dasharray: 3 3; }
.km-cens-a { stroke: #17191d; stroke-width: 1; }
.km-cens-b { stroke: #6554a2; stroke-width: 1; }
.km-lab-a, .km-lab-b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 13px; font-weight: 600; }
.km-lab-a { fill: #17191d; } .km-lab-b { fill: #6554a2; }
.case-figure .paper-legend { margin: 6px 0 0; }
.lg-km-a { width: 16px; border-top: 2px solid #17191d; }
.lg-km-b { width: 16px; border-top: 2px solid #6554a2; }
.lg-km-cens { width: 1px; height: 9px; background: #17191d; }
.lg-km-med { width: 16px; border-top: 1.5px dashed #9aa1ab; }

/* Отзыв */
.testimonial {
  position: relative; margin: 26px 0 0; padding: 28px 34px 24px 100px;
  background: #fbfbf9; border: 1px solid var(--line); border-left: 4px solid #6554a2; box-shadow: var(--shadow);
}
.testimonial .quote-mark { position: absolute; left: 30px; top: 26px; width: 46px; }
.testimonial p { margin: 0 0 14px; font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 22px; line-height: 1.45; color: #17191d; max-width: 860px; }
.testimonial footer { display: flex; gap: 12px; align-items: baseline; font-size: 12px; }
.testimonial footer strong { color: #17191d; }
.testimonial footer span { color: #6554a2; letter-spacing: .08em; text-transform: uppercase; font-size: 10px; font-weight: 700; }
.testimonial--empty { background: transparent; border-style: dashed; border-left-style: solid; box-shadow: none; }
.testimonial--empty p { color: #6d737c; font-size: 19px; }

/* ---------- Адаптив ---------- */
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .section-heading { display: grid; grid-template-columns: minmax(0,1fr) 130px; gap: 20px; }
  .case-sheet { grid-template-columns: 1fr; }
  .case-meta { border-right: 0; border-bottom: 1px solid var(--line); }
}
@media (max-width: 680px) {
  .section-heading { grid-template-columns: 1fr; }
  .sh-deco { display: none; }                         /* на телефоне фигуры прячем, чтобы не теснить текст */
  .paper-controls { grid-template-columns: auto 1fr; }
  .paper-stat, .fit-state { grid-row: 2; }
  .case-steps { grid-template-columns: 1fr; }
  .case-body { padding: 22px 18px; }
  .testimonial { padding: 76px 20px 20px; }
  .testimonial .quote-mark { left: 20px; top: 20px; width: 40px; }
  .testimonial p { font-size: 19px; }
}
/* рисунок прижат к верху колонки, чтобы целиком помещаться на невысоких экранах */
.hero { align-items: start; padding-top: 30px; }
.hero-copy { padding-top: 8px; }
.panel-cap > span:first-child { color: #4b5059; font-weight: 400; }
.panel-cap .paper-legend span { color: #5f646c; font-weight: 400; }
.case-kpis { margin-top: 0; padding-top: 22px; }
.case-figure .panel-cap { justify-content: flex-start; }
.case-figure .panel-cap b { margin-right: 6px; }

/* =====================================================================
   ПРАВКИ 15.10 (2): карусель кейсов, окружность вместо звёзд
   ===================================================================== */

/* Единичная окружность */
.geo-axis-dark { stroke: #2a2e35; stroke-width: .8; }
.geo-circle    { fill: #f7f8f8; stroke: #2a2e35; stroke-width: 1; }
.geo-radius    { stroke: #6554a2; stroke-width: 1.6; }

/* Управление каруселью справа от заголовка: счётчик и две квадратные кнопки */
.case-nav { justify-self: end; display: flex; align-items: center; gap: 10px; }
.case-counter { margin-right: 8px; font-family: 'Bodoni Moda', Georgia, serif; font-size: 18px; color: #6d737c; }
.case-counter b { color: #17191d; font-weight: 600; }
.case-btn {
  width: 48px; height: 48px; display: grid; place-items: center;
  border: 1px solid var(--line); background: #f7f8f8; color: #17191d;
  font-size: 18px; cursor: pointer; box-shadow: var(--shadow-small);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.case-btn:hover:not(:disabled) { background: #17191d; color: #fff; transform: translate(-1px,-1px); box-shadow: 5px 5px 0 #6554a2; }
.case-btn:disabled { opacity: .35; cursor: default; box-shadow: none; }

/* Лента слайдов.
   grid-auto-flow: column — элементы встают в ОДНУ строку;
   grid-auto-columns: 100% — каждый слайд шириной во всю ленту;
   scroll-snap — при прокрутке лента «защёлкивается» на начале слайда. */
.case-track {
  display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: 40px;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  padding: 0 12px 16px 0;            /* место под тени, иначе их обрежет */
  scrollbar-width: none;             /* прячем полосу прокрутки (Firefox) */
}
.case-track::-webkit-scrollbar { display: none; }   /* то же для Chrome / Edge */
.case-track:focus-visible { outline-offset: 6px; }
.case-slide { scroll-snap-align: start; min-width: 0; display: flex; flex-direction: column; }
.case-slide .case-sheet { flex: 1; }

/* Шапка рисунка и легенда */
.case-figure { margin: 20px 0 16px; }
.case-fig-cap { font-size: 11px; color: #4b5059; margin-bottom: 4px; }
.case-fig-cap b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 14px; margin-right: 6px; color: #17191d; }
.case-svg { display: block; width: 100%; height: auto; overflow: visible; }
.case-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 10px; color: #5f646c; }
.case-legend span { display: inline-flex; align-items: center; gap: 6px; }
.case-legend i { display: inline-block; }

/* Линии на рисунках кейсов: a — чёрная (база), b — фиолетовая (новое), ref — опорная пунктирная */
.case-svg .ln-a   { fill: none; stroke: #17191d; stroke-width: 1.6; }
.case-svg .ln-b   { fill: none; stroke: #6554a2; stroke-width: 2; }
.case-svg .ln-ref { fill: none; stroke: #9aa1ab; stroke-width: 1; stroke-dasharray: 3 3; }
.case-svg .tick-a { stroke: #17191d; stroke-width: 1; }
.case-svg .tick-b { stroke: #6554a2; stroke-width: 1; }
.case-svg .band-b { fill: rgba(101, 84, 162, .14); stroke: none; }
.case-svg .pt-a   { fill: #17191d; }
.case-svg .lab-a, .case-svg .lab-b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 13px; font-weight: 600; }
.case-svg .lab-a { fill: #17191d; }
.case-svg .lab-b { fill: #6554a2; }
.lg-a    { width: 16px; border-top: 2px solid #17191d; }
.lg-b    { width: 16px; border-top: 2px solid #6554a2; }
.lg-ref  { width: 16px; border-top: 1.5px dashed #9aa1ab; }
.lg-tick { width: 1px; height: 9px; background: #17191d; }
.lg-band { width: 14px; height: 9px; background: rgba(101, 84, 162, .2); }
.lg-pt   { width: 5px; height: 5px; background: #17191d; }

/* Отзыв под кейсом: большая типографская кавычка вместо звезды */
.testimonial { margin-top: 22px; padding: 24px 30px 20px 92px; }
.testimonial .quote-mark {
  position: absolute; left: 26px; top: 10px; width: auto;
  font-family: 'Bodoni Moda', Georgia, serif; font-size: 76px; line-height: 1; color: #6554a2;
}
.testimonial--empty .quote-mark { color: #b9bec5; }

/* Переключатели кейсов под каруселью: прямоугольные «вкладки» с номером и темой */
.case-dots { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.case-dot {
  display: inline-flex; align-items: center; gap: 10px; padding: 9px 14px;
  border: 1px solid var(--line); background: #f7f8f8; color: #4b5059;
  font: inherit; font-size: 11px; cursor: pointer; box-shadow: var(--shadow-small);
}
.case-dot span { font-family: 'Bodoni Moda', Georgia, serif; font-size: 13px; color: #6554a2; }
.case-dot:hover { border-color: #6554a2; }
.case-dot.is-active { background: #17191d; color: #fff; border-color: #17191d; box-shadow: 4px 4px 0 #6554a2; }
.case-dot.is-active span { color: #c9bff0; }

@media (max-width: 900px) {
  .case-track { gap: 20px; }
}
@media (max-width: 680px) {
  .case-nav { justify-self: start; }
  .case-dot { font-size: 0; padding: 8px 12px; }      /* на телефоне только номер */
  .case-dot span { font-size: 13px; }
  .testimonial { padding: 58px 18px 18px; }
  .testimonial .quote-mark { left: 16px; top: 4px; font-size: 64px; }
}

/* =====================================================================
   ПРАВКИ 15.10 (3): карточки без иконок, рисунки «на клетчатой бумаге», дашборды
   ===================================================================== */

/* Карточки услуг: чистый белый лист */
.service-card { background: #ffffff; }
.service-card h3 { margin-top: 0; }

/* ---------- Рисунки у заголовков: крупно, прозрачно, тонкие линии ---------- */
.section-heading { grid-template-columns: minmax(0, 1fr) 380px; }
.sh-deco { max-width: 380px; }
.geo-ink       { fill: none; stroke: #2a2e35; stroke-width: 1.1; }
.geo-ink-thin  { fill: none; stroke: #2a2e35; stroke-width: .7; }
.geo-dash      { fill: none; stroke: #2a2e35; stroke-width: .8; stroke-dasharray: 3 4; }
.geo-curve     { fill: none; stroke: #2a2e35; stroke-width: 1.6; stroke-linejoin: round; }
.geo-accent    { fill: none; stroke: #6554a2; stroke-width: 1.3; }
.geo-thick     { stroke-width: 2.2; }
.geo-resid     { stroke: #6554a2; stroke-width: 1; stroke-dasharray: 2 2; }
.geo-pt        { fill: #2a2e35; }
.geo-open      { fill: none; stroke: #2a2e35; stroke-width: 1; }
.geo-box       { fill: none; stroke: #2a2e35; stroke-width: 1.1; }
.geo-box-accent{ fill: rgba(101, 84, 162, .08); stroke: #6554a2; stroke-width: 1.3; }
/* Штриховка — повторяющийся узор через SVG-заливку не нужен: полупрозрачный цвет + пунктирная граница */
.geo-hatch       { fill: rgba(101, 84, 162, .14); stroke: none; }
.geo-hatch-light { fill: rgba(101, 84, 162, .06); stroke: none; }
/* Подписи «от руки»: курсивный антиквенный шрифт */
.geo-hand { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 15px; fill: #2a2e35; }
.geo-hand--accent { fill: #6554a2; font-weight: 600; }

/* ---------- Дашборды ---------- */
.dash-sheet {
  background: #fbfbf9; border: 1px solid var(--line); box-shadow: var(--shadow);
  padding: 26px 28px 18px;
}
.dash-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 380px); gap: 28px; align-items: end;
  padding-bottom: 14px; border-bottom: 2px solid #17191d; }
.dash-head h3 { margin: 8px 0 0; font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 26px; line-height: 1.15; letter-spacing: -.02em; }
.dash-q { margin: 0; font-size: 13px; line-height: 1.6; color: #4c5159; padding-left: 14px; border-left: 2px solid #6554a2; }

/* Фильтры */
.dash-filters { display: flex; flex-wrap: wrap; gap: 12px 26px; padding: 16px 0 14px; border-bottom: 1px solid #d3d7db; }
.dash-filter { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dash-filter-label { font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6554a2; }
.dash-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.dash-chip {
  padding: 6px 10px; font: inherit; font-size: 11px; color: #3f444d;
  background: #fff; border: 1px solid #c9cdd2; cursor: pointer;
}
.dash-chip:hover { border-color: #6554a2; }
.dash-chip.is-on { background: #17191d; color: #fff; border-color: #17191d; box-shadow: 2px 2px 0 #6554a2; }
.dash-select { font: inherit; font-size: 12px; padding: 6px 10px; border: 1px solid #c9cdd2; background: #fff; color: #17191d; }

/* KPI-плашки */
.dash-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 16px 0; }
.dash-kpi { padding: 12px 14px; background: #fff; border: 1px solid #d3d7db; border-top: 3px solid #17191d; }
.dash-kpi:first-child { border-top-color: #6554a2; }
.dash-kpi b { display: block; font-family: 'Bodoni Moda', Georgia, serif; font-size: 24px; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.dash-kpi span { display: block; margin-top: 4px; font-size: 11px; color: #3f444d; }
.dash-kpi small { display: block; font-size: 10px; color: #8b9099; }

/* Сетка графиков */
.dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dash-grid--covid { grid-template-columns: 1.7fr 1fr; }
.dash-wide { grid-column: 1 / -1; }
.dash-chart { margin: 0; padding: 12px 14px 8px; background: #fff; border: 1px solid #d3d7db; }
.dash-chart figcaption { font-size: 11px; color: #4b5059; margin-bottom: 4px; }
.dash-chart figcaption b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 13px; color: #17191d; margin-right: 4px; }
.dash-svg { display: block; width: 100%; height: auto; overflow: visible; }

/* Элементы графиков */
.dash-svg .bar     { fill: #6554a2; }
.dash-svg .bar-alt { fill: #b9bec5; }
.dash-svg .bar.is-dim { fill: #d6d1e8; }
.dash-svg .bar.is-sel { fill: #17191d; }
.dash-svg .is-click { cursor: pointer; }
.dash-svg .is-click:hover { fill: #4d3f87; }
.dash-svg .bar.is-sel.is-click:hover { fill: #17191d; }
.dash-svg .bar-val { font: 600 10px Inter, sans-serif; fill: #2a2e35; }
.dash-svg .ax-tick.is-strong { fill: #17191d; font-weight: 700; }
.dash-svg .ln-a { fill: none; stroke: #17191d; stroke-width: 1.6; }
.dash-svg .ln-b { fill: none; stroke: #6554a2; stroke-width: 2.2; }
.dash-svg .pt-hit { fill: transparent; }
.dash-svg .pt-hit:hover { fill: #6554a2; }
.dash-svg .line-lab { font: 600 11px Inter, sans-serif; }
.dash-svg .ln-a-lab { fill: #17191d; }
.dash-svg .ln-b-lab { fill: #6554a2; }
.dash-svg .ln-marker { stroke: #6554a2; stroke-width: 1; stroke-dasharray: 3 3; }
.dash-band { fill: rgba(101, 84, 162, .08); }
.dash-svg .ax-label { font-size: 10px; }
/* Точки Gapminder: 5 континентов — 5 приглушённых цветов */
.dash-svg .dot { stroke: #fff; stroke-width: .6; fill-opacity: .8; cursor: pointer; }
.dash-svg .dot.is-dim { fill-opacity: .12; stroke: none; }
.dot-c0 { fill: #b0473d; }  .dot-c1 { fill: #6554a2; }  .dot-c2 { fill: #2f7a5f; }
.dot-c3 { fill: #17191d; }  .dot-c4 { fill: #8b6a2b; }
.lg-inline { display: inline-block; width: 10px; height: 10px; vertical-align: -1px; margin: 0 2px; }
.lg-inline.lg-b { background: #6554a2; border: 0; width: 10px; }
.lg-inline.lg-alt { background: #b9bec5; }

/* Подвал дашборда: источник данных и где лежит файл Power BI */
.dash-foot { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 12px; padding-top: 10px;
  border-top: 1px solid #d3d7db; font-size: 10px; color: #6d737c; }
.dash-foot code { font-size: 10px; background: #eceef0; padding: 1px 5px; }

/* Подсказка при наведении */
.dash-tip {
  position: fixed; z-index: 50; pointer-events: none; opacity: 0; max-width: 280px;
  padding: 7px 10px; background: #17191d; color: #fff; font-size: 11px; line-height: 1.4;
  box-shadow: 3px 3px 0 #6554a2; transition: opacity .1s;
}

@media (max-width: 1100px) {
  .section-heading { grid-template-columns: minmax(0, 1fr) 280px; }
}
@media (max-width: 900px) {
  .dash-head, .dash-grid, .dash-grid--covid { grid-template-columns: 1fr; }
  .dash-kpis { grid-template-columns: repeat(2, 1fr); }
  .section-heading { grid-template-columns: minmax(0, 1fr) 200px; }
}
@media (max-width: 680px) {
  .dash-sheet { padding: 18px 14px 12px; }
  .dash-head h3 { font-size: 21px; }
  .dash-kpi b { font-size: 19px; }
  .dash-svg .ax-tick, .dash-svg .bar-val { font-size: 14px; }
}
/* слайды разной высоты не растягиваются до самого высокого */
.case-track { align-items: start; }
.case-track { overflow-y: hidden; transition: height .35s ease; }
/* на телефоне заголовок секции — в одну колонку, навигация карусели под ним
   (правило стоит в самом конце, чтобы перекрыть правило для планшета выше) */
@media (max-width: 680px) {
  .section-heading { grid-template-columns: 1fr; }
  .case-nav { justify-self: start; }
}
/* поле-ловушка для ботов: не display:none (некоторые боты это проверяют), а уводим за экран */
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* =====================================================================
   ДАШБОРД «МОНИТОРИНГ ПАЦИЕНТА В РЕАНИМАЦИИ» (static/icu-dashboard.js)
   Верхняя панель — как срезы в Power BI, ниже — сетка мини-графиков 3×4.
   ===================================================================== */
.icu-top {
  display: grid;
  grid-template-columns: 190px 1.1fr .9fr 1.2fr 1.3fr 1.5fr;   /* период | пациент | эпизод | отделение | операции | статус */
  gap: 10px; padding: 16px 0;
  border-bottom: 1px solid #d3d7db;
}
.icu-side { display: flex; flex-direction: column; gap: 8px; }
.icu-box { background: #fff; border: 1px solid #c9cdd2; padding: 10px 10px 8px; min-width: 0; }
.icu-box-title { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 14px; color: #17191d; margin-bottom: 6px; }
.icu-dates { display: flex; justify-content: space-between; gap: 4px; font-size: 10px; color: #30343b; font-variant-numeric: tabular-nums; }
.icu-dates span { padding: 3px 4px; border: 1px solid #d3d7db; background: #fbfbf9; }

/* Два ползунка на одной линии: прозрачная дорожка, кликабельны только «ручки» */
.icu-range { position: relative; height: 26px; margin-top: 6px; }
.icu-range::before { content: ""; position: absolute; left: 0; right: 0; top: 12px; height: 2px; background: #17191d; }
.icu-range input { position: absolute; inset: 0; width: 100%; margin: 0; background: none; pointer-events: none;
  -webkit-appearance: none; appearance: none; }
.icu-range input::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 10px; height: 20px; background: #6554a2; border: 0; cursor: ew-resize; }
.icu-range input::-moz-range-thumb { pointer-events: auto; width: 10px; height: 20px; background: #6554a2; border: 0; border-radius: 0; cursor: ew-resize; }
.icu-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.icu-reset { width: 100%; }

.icu-list-box { display: flex; flex-direction: column; }
.icu-search { font: inherit; font-size: 11px; padding: 5px 7px; border: 1px solid #d3d7db; margin-bottom: 6px; background: #fbfbf9; }
.icu-list { max-height: 132px; overflow-y: auto; display: flex; flex-direction: column; }
.icu-item { display: grid; grid-template-columns: 12px 1fr; column-gap: 7px; align-items: center; text-align: left;
  font: inherit; font-size: 11px; color: #30343b; background: none; border: 0; padding: 4px 2px; cursor: pointer; }
.icu-item small { grid-column: 2; font-size: 9px; color: #8b9099; }
.icu-item:hover { background: #f1f2f3; }
.icu-check { width: 11px; height: 11px; border: 1px solid #8b9099; }
.icu-item.is-on { color: #17191d; font-weight: 600; }
.icu-item.is-on .icu-check { background: #17191d; border-color: #17191d; box-shadow: inset 0 0 0 2px #fff; }
.icu-empty { font-size: 11px; color: #8b9099; padding: 4px 2px; }
.icu-proc { display: grid; grid-template-columns: 64px 1fr; gap: 6px; font-size: 10px; padding: 3px 0; border-bottom: 1px dotted #e0e2e5; }
.icu-proc b { font-weight: 600; color: #6554a2; font-variant-numeric: tabular-nums; }
.icu-proc span { color: #30343b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Таблица статуса */
.icu-status { width: 100%; border-collapse: collapse; font-size: 11px; }
.icu-status th { text-align: left; background: #e9e4f2; color: #17191d; font-weight: 700; padding: 6px; }
.icu-status td { padding: 6px; border-bottom: 1px solid #e6e8eb; vertical-align: top; }
.icu-status td:nth-child(2) { font-family: 'Bodoni Moda', Georgia, serif; font-size: 14px; font-weight: 600; white-space: nowrap; }
.icu-status tr.is-warn td:nth-child(3) { color: #b0473d; font-weight: 600; }
.icu-patient { margin-top: 8px; font-size: 10px; color: #5f646c; line-height: 1.5; }

/* Сетка мини-графиков */
.icu-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 14px; }
.icu-chart { margin: 0; padding: 8px 10px 4px; background: #fff; border: 1px solid #c9cdd2; }
.icu-chart figcaption { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.icu-chart figcaption b { font-family: 'Bodoni Moda', Georgia, serif; font-size: 22px; font-weight: 500; color: #8a80b8; line-height: 1; }
.icu-ref { font-family: 'Bodoni Moda', Georgia, serif; font-size: 14px; color: #a9a2cc; }
.icu-chart figcaption small { margin-left: auto; font-size: 9px; color: #8b9099; }
.icu-svg { display: block; width: 100%; height: auto; overflow: visible; }
.icu-refline { stroke: #2f7a5f; stroke-width: 1.6; stroke-dasharray: 4 3; }
.icu-line { fill: none; stroke: #6554a2; stroke-width: 2; stroke-linejoin: round; }
.icu-pt { fill: #6554a2; cursor: default; }
.icu-pt.is-out { fill: #b0473d; }
.icu-val { font: 9px Inter, sans-serif; fill: #30343b; }
.icu-val.is-out { fill: #b0473d; font-weight: 700; }
.icu-axis { font: 9px Inter, sans-serif; fill: #8b9099; }
.icu-none { font: italic 13px 'Cormorant Garamond', Georgia, serif; fill: #8b9099; }

@media (max-width: 1100px) {
  .icu-top { grid-template-columns: 190px 1fr 1fr; }
  .icu-status-box, .icu-procs-box { grid-column: span 3; }
}
@media (max-width: 680px) {
  .icu-top { grid-template-columns: 1fr; }
  .icu-status-box, .icu-procs-box { grid-column: auto; }
  .icu-grid { grid-template-columns: 1fr; }
}
.icu-list { position: relative; }                 /* offsetTop пунктов — относительно списка (для автопрокрутки) */
.icu-status { table-layout: fixed; font-size: 10px; }
.icu-status th { padding: 5px 4px; font-size: 10px; }
.icu-status td { padding: 5px 4px; overflow-wrap: anywhere; }
.icu-status th:nth-child(1) { width: 32%; } .icu-status th:nth-child(2) { width: 26%; }
.icu-status td:nth-child(2) { font-size: 13px; padding-right: 8px; }
.icu-status td:nth-child(1), .icu-status td:nth-child(3) { overflow-wrap: normal; }   /* переносим только по словам */

/* ---------- Меню-«бургер» на планшетах (681–1000 px): иначе ссылки меню не помещаются в ширину ---------- */
@media (min-width: 681px) and (max-width: 1000px) {
  .menu-toggle { display: block; }
  .site-nav { display: none; position: absolute; top: 78px; left: 0; right: 0; padding: 18px var(--page-padding) 22px; flex-direction: column; align-items: stretch; gap: 17px; background: rgba(250,249,246,.98); border-bottom: 1px solid var(--border); box-shadow: 0 14px 25px rgba(32,42,64,.06); }
  .site-nav.is-open { display: flex; }
  .site-nav > a:not(.button) { font-size: 14px; }
  .site-nav .button { align-self: flex-start; }
}

/* ---------- Страница «Политика обработки данных» ---------- */
.legal-page { max-width: 760px; }
.legal-page h1 { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 500; font-size: clamp(32px, 5vw, 48px); line-height: 1.1; margin: 10px 0 6px; }
.legal-page h2 { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 21px; margin: 32px 0 8px; }
.legal-page p { color: #39445b; line-height: 1.7; font-size: 15px; margin: 0 0 10px; }
.legal-page .legal-date { color: #69748a; font-size: 13px; }
.legal-page .button { margin-top: 26px; }
.consent-label a { color: var(--primary); }

/* Очень узкие телефоны (≤400 px): ползунок Рис. 1 переносится на строки и не распирает страницу */
@media (max-width: 400px) {
  .paper-controls { display: flex; flex-wrap: wrap; gap: 8px 12px; }
  .paper-controls input[type="range"] { flex: 1 1 140px; min-width: 0; }
  .fit-state { margin-left: 0; }
}

/* Подпись поля и звёздочка — в одну строку, поле ввода — на следующей (раньше «*» уезжала на отдельную строку) */
.order-form > label:not(.consent-label) { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 5px; row-gap: 7px; }
.order-form > label:not(.consent-label) > input, .order-form > label:not(.consent-label) > select, .order-form > label:not(.consent-label) > textarea { flex: 1 0 100%; }

/* ---------- Юридический блок в подвале ---------- */
.footer-legal { padding-block: 16px 14px; border-top: 1px solid #c6cbd0; display: grid; gap: 6px; }
.footer-legal p { margin: 0; font-size: 10.5px; line-height: 1.6; color: #6d7480; }
.footer-docs { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-bottom: 4px; }
.footer-docs a { font-size: 11px; color: #424750; text-decoration: none; border-bottom: 1px solid #c6cbd0; }
.footer-docs a:hover { color: #6554a2; border-bottom-color: #6554a2; }
.form-footnote a { color: inherit; }

/* ---------- ОРИТ на телефоне: компактнее (раньше дашборд был в ~2.5 раза длиннее соседних) ----------
   Фильтры — в две колонки, списки короче, графики по 2 в ряд и сначала только 6 основных. */
.icu-more { display: none; }
@media (max-width: 680px) {
  .icu-top { grid-template-columns: 1fr 1fr; gap: 8px; }
  .icu-side, .icu-units-box, .icu-procs-box, .icu-status-box { grid-column: 1 / -1; }
  .icu-side { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .icu-side .icu-box { grid-column: 1 / -1; }
  .icu-side .icu-reset { grid-column: 1 / -1; }
  .icu-mode { grid-column: 1 / -1; }
  .icu-list { max-height: 92px; }
  .icu-procs { max-height: 74px; }
  .icu-item { font-size: 11px; }
  .icu-grid { grid-template-columns: 1fr 1fr; gap: 6px; padding-top: 10px; }
  .icu-grid.is-collapsed > .icu-chart:nth-child(n+7) { display: none; }
  .icu-chart { padding: 6px 6px 2px; }
  .icu-chart figcaption { gap: 3px; }
  .icu-chart figcaption b { font-size: 17px; }
  .icu-ref { font-size: 11px; }
  .icu-chart figcaption small { margin-left: 0; width: 100%; font-size: 8.5px; line-height: 1.2; }
  .icu-svg.is-compact .icu-val { font-size: 12px; }
  .icu-svg.is-compact .icu-axis { font-size: 11px; }
  .icu-svg.is-compact .icu-none { font-size: 15px; }
  .icu-more { display: block; width: 100%; margin-top: 8px; }
}

/* Рис. 1 (градиентный бустинг) на телефоне не показываем: на маленьком экране он лишний.
   На планшете и компьютере (шире 680 px) рисунок остаётся как был. */
@media (max-width: 680px) {
  .hero .paper-figure { display: none; }
}