:root {
    --ink: #284666;
    --ink-soft: #526e8b;
    --muted: #6a859c;
    --blue: #375ce8;
    --blue-deep: #294ed1;
    --teal: #008a94;
    --teal-soft: #ddf5f2;
    --coral: #f16e64;
    --orange: #ffad68;
    --violet: #8364d5;
    --pale-violet: #efebff;
    --paper: #f9fcff;
    --white: #fff;
    --stroke: #dce7f1;
    --sky: #e8f1ff;
    --soft: #f0f6fc;
    --gutter: clamp(20px, 3vw, 52px);
    --max: 1390px;
    --rad: 16px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.66;
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--blue); }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; border-radius: 4px; }
p { font-size: 16px; margin: 0 0 18px; }
p:last-child { margin-bottom: 0; }
h1 { font-size: 40px; line-height: 1.16; letter-spacing: -.035em; margin: 14px 0 23px; font-weight: 800; }
h2 { font-size: 28px; line-height: 1.2; letter-spacing: -.028em; margin: 0 0 20px; font-weight: 760; }
h3 { font-size: 20px; line-height: 1.28; margin: 0 0 8px; font-weight: 750; }
strong { font-weight: 750; }
.wrap { width: min(100% - var(--gutter) * 2, var(--max)); margin-inline: auto; }
.skip { position: fixed; top: -100px; left: 20px; z-index: 1000; background: var(--blue); color: #fff; padding: 8px 16px; }
.skip:focus { top: 10px; color: #fff; }
.header {
    background: rgba(249, 252, 255, .97);
    border-bottom: 1px solid var(--stroke);
    position: sticky;
    top: 0;
    z-index: 30;
    backdrop-filter: blur(14px);
}
.header__inner { min-height: 79px; display: flex; align-items: center; gap: clamp(13px, 2vw, 32px); }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: none; }
.brand__sign {
    display: inline-flex; align-items: center; justify-content: center;
    width: 46px; height: 46px; background: var(--blue); color: #fff;
    border-radius: 13px 13px 4px 13px; font-size: 31px; letter-spacing: -3px;
    font-weight: 850; line-height: 1; padding-right: 3px;
    box-shadow: 7px 7px 0 var(--teal-soft);
}
.brand__name { display: flex; flex-direction: column; gap: 0; }
.brand__top { color: var(--ink); font-size: 19px; letter-spacing: -.04em; font-weight: 800; line-height: 1.12; }
.brand__bottom { color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .11em; line-height: 1.7; }
.nav { display: flex; align-items: center; justify-content: center; gap: clamp(12px, 1.8vw, 29px); flex: 1; }
.nav a { position: relative; padding-block: 12px; color: var(--ink-soft); font-size: 13px; font-weight: 750; white-space: nowrap; }
.nav a:after { content: ""; position: absolute; width: 0; bottom: 7px; left: 0; height: 3px; background: var(--coral); border-radius: 5px; transition: width .15s ease; }
.nav a:hover:after, .nav a[aria-current="page"]:after { width: 100%; }
.nav a[aria-current="page"] { color: var(--blue); }
.header__end { flex: none; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #b9c9ef; padding: 8px 14px; border-radius: 99px; color: var(--blue); font-size: 13px; font-weight: 800; }
.header__end:hover { background: var(--blue); color: #fff; }
.mobile-nav { display: none; }
.breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 54px; font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: .03em; }
.breadcrumb__sep { display: inline-flex; width: 19px; height: 1px; background: var(--coral); transform: rotate(-25deg); margin: 0 4px; }
.breadcrumb a:hover { text-decoration: underline; }
.eyebrow { display: inline-block; color: var(--teal); font-size: 12px; font-weight: 850; letter-spacing: .115em; line-height: 1.5; text-transform: uppercase; }
.eyebrow--light { color: #a5f8e5; }
.hero {
    display: grid; grid-template-columns: minmax(0, 1.72fr) minmax(0, 1fr);
    background: var(--sky); border: 1px solid #d3e5f8; overflow: hidden;
    border-radius: 22px; min-height: 362px; position: relative;
}
.hero--home { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #eaf5ff; }
.hero--indigo { background: #ecedff; border-color: #e0e3fc; }
.hero--sea { background: #e2f6f6; border-color: #cfedee; }
.hero--peach { background: #fff0e6; border-color: #f3e2d7; }
.hero--mint { background: #e8f6ed; border-color: #d3eadc; }
.hero__copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(26px, 3.5vw, 53px); z-index: 1; }
.hero__copy h1 { max-width: 760px; }
.hero__lead { max-width: 730px; font-size: 16px; line-height: 1.57; font-weight: 550; }
.hero__support { max-width: 740px; margin-bottom: 0; }
.hero__tags { margin-top: 21px; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.hero__tag { background: #fff; border: 1px solid rgba(90, 117, 160, .14); border-radius: 100px; padding: 5px 12px; font-size: 12px; font-weight: 750; color: var(--ink-soft); }
.hero__art { padding: 19px; display: flex; position: relative; min-width: 0; }
.diagram { isolation: isolate; border-radius: 18px; position: relative; width: 100%; min-height: 305px; background: var(--blue); overflow: hidden; }
.diagram:before { content: ""; width: 305px; height: 305px; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; position: absolute; right: -78px; top: -101px; }
.diagram:after { content: ""; width: 240px; height: 240px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; position: absolute; right: -28px; top: -68px; }
.diagram__word { position: absolute; left: 25px; top: 18px; color: #fff; font-size: 12px; font-weight: 900; letter-spacing: .18em; }
.diagram__disc { position: absolute; right: 12%; top: 14%; width: 113px; height: 113px; border-radius: 50%; background: var(--coral); box-shadow: 16px 10px 0 rgba(255,255,255,.14); }
.diagram__disc:before { content: ""; position: absolute; width: 35px; height: 35px; top: 24px; left: 29px; border: 12px solid #fff; border-radius: 50%; opacity: .85; }
.diagram__layers { position: absolute; inset: 40% 7% 8% 9%; transform: rotate(-6deg); }
.diagram__layer { position: absolute; left: 0; width: 88%; border-radius: 9px; background: #fff; box-shadow: 7px 8px 0 rgba(37, 57, 158, .13); padding: 9px 15px; font-weight: 900; font-size: 17px; letter-spacing: .035em; color: var(--ink); }
.diagram__layer:nth-child(1) { top: 0; transform: rotate(-6deg); background: #ffc187; }
.diagram__layer:nth-child(2) { top: 55px; left: 12%; transform: rotate(3deg); background: #e2fff5; }
.diagram__layer:nth-child(3) { top: 111px; left: 3%; transform: rotate(-1deg); }
.diagram__punct { position: absolute; bottom: 16px; right: 18px; font-size: 58px; line-height: 1; color: #fff; font-weight: 900; opacity: .55; }
.diagram--1 { background: var(--teal); }
.diagram--1 .diagram__disc { background: #f4b95f; }
.diagram--2 { background: var(--violet); }
.diagram--2 .diagram__disc { background: #ff9b85; }
.diagram--3 { background: #ec7669; }
.diagram--3 .diagram__disc { background: #fce9be; }
.diagram--4 { background: #347ca7; }
.diagram--4 .diagram__disc { background: #67ddd1; }
.section { padding-block: clamp(36px, 4vw, 65px); border-bottom: 1px solid var(--stroke); }
.section--tight { padding-block: 34px; }
.section--last { border-bottom: none; }
.section__label { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; color: var(--teal); font-size: 11px; text-transform: uppercase; letter-spacing: .15em; font-weight: 850; }
.section__label:before { content: ""; width: 23px; height: 4px; border-radius: 5px; background: var(--coral); }
.split { display: grid; gap: clamp(20px, 3vw, 42px); align-items: start; }
.split--wide { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.split--equal { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.split--reverse { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.section__copy { min-width: 0; }
.section__copy p { max-width: 900px; }
.facts { border: 1px solid #ccdfeb; border-radius: 14px; background: #fff; padding: 21px 23px; }
.facts__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 2px solid var(--sky); }
.facts__head strong { font-size: 16px; }
.facts__mark { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 31px; height: 31px; border-radius: 7px; color: var(--teal); background: var(--teal-soft); font-size: 19px; font-weight: 800; }
.facts__row { padding-top: 15px; display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 8px; align-items: start; }
.facts__term { font-size: 12px; font-weight: 900; color: var(--blue); line-height: 1.45; text-transform: uppercase; letter-spacing: .025em; overflow-wrap: anywhere; }
.facts__desc { font-size: 14px; line-height: 1.52; color: var(--ink-soft); }
.facts__bottom { margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--stroke); }
.inline-link { color: var(--blue); font-size: 13px; font-weight: 800; text-decoration: underline; text-decoration-color: #b1c1f1; text-underline-offset: 4px; }
.table-zone { background: #fff; border: 1px solid var(--stroke); border-radius: 14px; padding: 23px 23px 19px; }
.table-zone h2 { margin-bottom: 16px; }
.data-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.48; }
.data-table th { font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; padding: 12px 9px; color: var(--ink-soft); text-align: left; background: var(--sky); vertical-align: top; }
.data-table th:first-child { border-radius: 7px 0 0 7px; }
.data-table th:last-child { border-radius: 0 7px 7px 0; }
.data-table td { padding: 14px 9px; border-bottom: 1px solid var(--stroke); vertical-align: top; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table td:first-child { font-weight: 850; color: var(--blue); min-width: 93px; }
.table-zone__note { color: var(--ink-soft); margin-top: 14px; font-size: 13px; line-height: 1.6; }
.essay { border-radius: 14px; background: var(--soft); padding: clamp(22px, 2.4vw, 37px); min-width: 0; }
.essay--white { background: #fff; border: 1px solid var(--stroke); }
.essay--mint { background: var(--teal-soft); }
.essay__caps { color: var(--teal); text-transform: uppercase; font-weight: 850; font-size: 12px; letter-spacing: .1em; margin-bottom: 12px; }
.essay h2 { margin-bottom: 17px; }
.steps { padding: 0; margin: 0; list-style: none; counter-reset: step; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
.steps li { background: #fff; border: 1px solid var(--stroke); border-radius: 12px; padding: 17px 18px; counter-increment: step; }
.steps li:before { content: counter(step, decimal-leading-zero); display: block; color: var(--coral); font-weight: 900; line-height: 1.2; font-size: 15px; margin-bottom: 9px; }
.steps strong { display: block; font-size: 14px; line-height: 1.35; margin-bottom: 6px; }
.steps span { display: block; color: var(--ink-soft); font-size: 13px; line-height: 1.48; }
.steps--stack { display: grid; grid-template-columns: 1fr; }
.steps--stack li { padding: 12px 14px; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 6px 7px; }
.steps--stack li:before { grid-row: span 2; margin: 1px 0 0; }
.steps--stack strong { margin: 0; }
.steps--stack span { grid-column: 2; }
.feature { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 2fr); gap: 20px; align-items: stretch; }
.feature__side { background: var(--blue); border-radius: var(--rad); color: #fff; padding: 27px; position: relative; overflow: hidden; }
.feature__side:before { content: ""; position: absolute; width: 170px; height: 170px; top: -85px; right: -69px; border-radius: 50%; border: 19px solid rgba(255,255,255,.12); }
.feature__side:after { content: ""; width: 65px; height: 65px; border-radius: 18px; background: var(--coral); position: absolute; bottom: -27px; right: 33px; transform: rotate(24deg); }
.feature__side small { color: #b4fff2; display: block; letter-spacing: .14em; font-size: 11px; font-weight: 850; text-transform: uppercase; margin-bottom: 10px; }
.feature__side h3 { font-size: 22px; max-width: 270px; line-height: 1.22; color: #fff; margin-bottom: 14px; }
.feature__side p { font-size: 16px; color: #ecf4ff; line-height: 1.56; max-width: 320px; }
.feature__main { background: #fff; border: 1px solid var(--stroke); border-radius: var(--rad); padding: clamp(23px, 2.5vw, 39px); }
.feature__main h2 { margin-bottom: 17px; }
.source { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--stroke); }
.related { margin-bottom: 58px; }
.related__head { margin-bottom: 18px; display: flex; align-items: end; gap: 20px; justify-content: space-between; }
.related__head h2 { margin-bottom: 0; }
.related__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.related__grid--3, .related__grid--6 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.related__grid--5 { grid-template-columns: repeat(6, minmax(0,1fr)); }
.related__grid--5 .related__item:nth-child(-n+3) { grid-column: span 2; }
.related__grid--5 .related__item:nth-child(n+4) { grid-column: span 3; }
.related__item { display: flex; flex-direction: column; gap: 10px; min-height: 118px; background: #eaf3fb; border-radius: 12px; padding: 19px; border: 1px solid #d9e5f0; transition: background .15s ease, border-color .15s ease; }
.related__item:nth-child(4n+2) { background: #e8f7f2; border-color: #cfebe1; }
.related__item:nth-child(4n+3) { background: #efedff; border-color: #e0d8fb; }
.related__item:nth-child(4n+4) { background: #fff0e6; border-color: #f4dfd0; }
.related__item:hover { background: #fff; border-color: var(--blue); }
.related__item small { font-size: 11px; text-transform: uppercase; letter-spacing: .11em; font-weight: 850; color: var(--teal); }
.related__item strong { font-size: 15px; line-height: 1.35; }
.related__item span { font-size: 12px; color: var(--ink-soft); line-height: 1.5; }
.button, .offer-action { display: inline-flex; justify-content: center; align-items: center; gap: 10px; border: 1px solid transparent; background: var(--blue); padding: 11px 20px; color: #fff; border-radius: 8px; font-size: 14px; line-height: 1.4; font-weight: 800; transition: background .16s ease; }
.button:hover, .offer-action:hover { color: #fff; background: var(--teal); }
.button--ghost { background: #fff; color: var(--blue); border-color: #c6d7ec; }
.button--ghost:hover { color: #fff; background: var(--blue); }
.button--coral { background: var(--coral); }
.button--coral:hover { background: var(--blue); }
.button-row, .offer-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.offer-list { padding: 0; list-style: none; }
.offer-item { border-radius: 12px; border: 1px solid var(--stroke); padding: 17px; background: #fff; }
.offer-item__name { font-weight: 850; margin-bottom: 6px; }
.offer-item__meta { color: var(--ink-soft); font-size: 13px; }
.pill-links { display: flex; flex-wrap: wrap; gap: 10px; }
.pill-links a { display: inline-flex; align-items: center; background: #fff; border: 1px solid #cfdded; border-radius: 99px; padding: 7px 13px; font-weight: 750; font-size: 13px; }
.pill-links a:hover { background: var(--blue); color: #fff; border-color: var(--blue); }
.band { background: var(--blue); color: #fff; border-radius: 18px; padding: clamp(23px, 3.5vw, 52px); margin-block: 38px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 24px; align-items: center; }
.band h2 { color: #fff; }
.band p { color: #eaf0ff; }
.band__links { display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-start; }
.band__links a { color: #fff; border: 1px solid rgba(255,255,255,.6); border-radius: 7px; padding: 9px 14px; font-weight: 750; font-size: 13px; }
.band__links a:hover { background: #fff; color: var(--blue); }
.hub-heading { padding: 50px 0 18px; }
.hub-heading h2 { margin-bottom: 9px; }
.hub-heading p { max-width: 730px; color: var(--ink-soft); }
.hub-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.hub-card { border: 1px solid var(--stroke); background: #fff; border-radius: 16px; padding: clamp(19px, 2vw, 30px); display: flex; flex-direction: column; gap: 12px; }
.hub-card:nth-child(3n+1) { border-top: 5px solid var(--blue); }
.hub-card:nth-child(3n+2) { border-top: 5px solid var(--teal); }
.hub-card:nth-child(3n+3) { border-top: 5px solid var(--coral); }
.hub-card small { font-size: 11px; color: var(--teal); font-weight: 850; text-transform: uppercase; letter-spacing: .11em; }
.hub-card h3 { font-size: 20px; }
.hub-card p { margin: 0 0 3px; color: var(--ink-soft); font-size: 16px; }
.hub-card a { color: var(--blue); font-weight: 800; font-size: 14px; margin-top: auto; text-decoration: underline; text-decoration-color: #c8d6f1; text-underline-offset: 5px; }
.index-group { border-bottom: 1px solid var(--stroke); padding-block: 30px; }
.index-group h2 { padding-bottom: 12px; margin-bottom: 16px; }
.index-links { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px 20px; }
.index-links a { border-bottom: 1px solid #dae5f0; padding: 9px 0; color: var(--ink-soft); font-size: 15px; }
.index-links a:hover { color: var(--blue); border-color: var(--blue); }
.footer { background: #e8f1fa; border-top: 1px solid #cfdfec; padding: 36px 0 24px; }
.footer__top { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr); gap: 30px; }
.footer__intro { max-width: 490px; }
.footer__intro p { margin-top: 14px; font-size: 16px; color: var(--ink-soft); }
.footer__heading { display: block; font-size: 16px; letter-spacing: normal; margin: 5px 0 12px; }
.footer__links { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.footer__links a { color: var(--ink-soft); font-size: 14px; }
.footer__links a:hover { color: var(--blue); text-decoration: underline; }
.footer__bottom { border-top: 1px solid #ccd9e8; display: flex; justify-content: space-between; gap: 20px; margin-top: 24px; padding-top: 19px; font-size: 12px; font-weight: 700; color: var(--ink-soft); }
@media (max-width: 1130px) {
    .header__inner { gap: 15px; }
    .nav { gap: 13px; }
    .nav a { font-size: 12px; }
    .brand__bottom { display: none; }
    .hero { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
    .hero__copy { padding: 26px; }
    .related__grid, .related__grid--3, .related__grid--5, .related__grid--6 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .related__grid--5 .related__item { grid-column: auto; }
    .related__grid--5 .related__item:last-child:nth-child(odd) { grid-column: span 2; }
}
@media (max-width: 900px) {
    .header__inner { min-height: 70px; justify-content: space-between; }
    .nav, .header__end { display: none; }
    .mobile-nav { display: block; position: relative; }
    .mobile-nav summary { list-style: none; border: 1px solid #bfd2e8; border-radius: 9px; font-size: 14px; font-weight: 800; padding: 9px 16px; cursor: pointer; }
    .mobile-nav summary::-webkit-details-marker { display: none; }
    .mobile-nav[open] summary { background: var(--blue); color: #fff; }
    .mobile-nav__items { position: absolute; z-index: 40; top: calc(100% + 8px); right: 0; width: min(310px, calc(100vw - 35px)); border: 1px solid #cbdce9; background: #fff; border-radius: 13px; padding: 10px; box-shadow: 0 13px 28px rgba(54,84,134,.16); }
    .mobile-nav__items a { display: block; padding: 9px 10px; font-size: 14px; font-weight: 750; border-radius: 7px; }
    .mobile-nav__items a:hover { background: var(--sky); }
    .hero, .hero--home { grid-template-columns: minmax(0, 1fr); }
    .hero__art { display: none; }
    .split--wide, .split--equal, .split--reverse, .feature, .band { grid-template-columns: 1fr; }
    .section { padding-block: 33px; }
    .hub-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .index-links { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .footer__top { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .footer__intro { grid-column: span 2; }
    .feature__side:after { display: none; }
}
@media (max-width: 560px) {
    :root { --gutter: 17px; }
    .brand__sign { width: 43px; height: 43px; }
    .hero { border-radius: 14px; }
    .hero__copy { padding: 24px 19px; }
    h1 { font-size: 40px; overflow-wrap: anywhere; }
    h2 { font-size: 28px; overflow-wrap: anywhere; }
    .hero__lead { font-size: 16px; }
    .steps, .hub-grid, .related__grid, .related__grid--3, .related__grid--5, .related__grid--6 { grid-template-columns: 1fr; }
    .related__grid--5 .related__item:last-child:nth-child(odd) { grid-column: auto; }
    .facts__row { grid-template-columns: 1fr; gap: 2px; }
    .data-table { font-size: 13px; }
    .data-table th, .data-table td { padding-left: 6px; padding-right: 6px; overflow-wrap: anywhere; }
    .table-zone, .essay, .feature__main, .feature__side { padding: 19px; }
    .index-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .footer__top { grid-template-columns: 1fr; }
    .footer__intro { grid-column: auto; }
    .footer__bottom { flex-direction: column; gap: 5px; }
    .band { border-radius: 12px; margin-block: 25px; }
}
@media (max-width: 360px) {
    .brand__top { font-size: 17px; }
    .index-links { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    *, *:before, *:after { scroll-behavior: auto !important; transition: none !important; }
}

.band--compact { margin: 0; }
.band--compact p.source { color: #dceaff; border-color: rgba(255,255,255,.35); }
.compact-insight { margin-top: 17px; padding: 14px 17px; background: var(--teal-soft); border-left: 4px solid var(--teal); border-radius: 0 9px 9px 0; }
.compact-insight strong { display: block; font-size: 15px; color: var(--teal); margin-bottom: 4px; }
.compact-insight p { margin: 0; font-size: 16px; line-height: 1.52; }
.facts { padding: 17px 19px; }
.facts__row { padding-top: 10px; }
.facts__head { padding-bottom: 8px; }
.facts__bottom { margin-top: 12px; padding-top: 10px; }

:root {
    --ink: #24486a;
    --ink-soft: #55718b;
    --blue: #345ce9;
    --blue-deep: #284fd6;
    --teal: #007f85;
    --paper: #f7fbff;
    --coral: #ef7467;
}
.brand { gap: 12px; }
.brand__sign {
    position: relative;
    overflow: hidden;
    width: 49px;
    height: 49px;
    border-radius: 13px 13px 4px 13px;
    background: var(--blue);
    font-size: 30px;
    letter-spacing: -3px;
    box-shadow: 6px 6px 0 #d4f3ed;
}
.brand__sign:before {
    position: absolute;
    content: "";
    width: 25px;
    height: 25px;
    top: -13px;
    right: -12px;
    border: 8px solid #91e1d2;
    border-radius: 50%;
}
.brand__sign span { color: #94ebc9; margin-left: 1px; }
.brand__top { font-size: 19px; letter-spacing: -.044em; font-weight: 770; white-space: nowrap; }
.brand__top strong { color: var(--blue); font-weight: 850; }
.brand__bottom { color: var(--teal); font-size: 9px; letter-spacing: .105em; }
.footer .brand__top { font-size: 19px; }
.header__end { border-color: #b8cdef; }
.dm-home { padding-top: 20px; }
.dm-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.64fr) minmax(0, 1fr);
    min-height: 380px;
    background: #eaf3ff;
    border: 1px solid #d4e3f8;
    border-radius: 18px;
    overflow: hidden;
}
.dm-hero__content {
    padding: clamp(27px, 3.5vw, 53px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.dm-kicker { color: var(--teal); font-size: 11px; letter-spacing: .15em; font-weight: 850; }
.dm-hero h1 { max-width: 700px; margin: 15px 0 20px; }
.dm-hero p { max-width: 665px; line-height: 1.59; }
.dm-hero__lead { font-weight: 630; }
.dm-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 16px; }
.dm-hero__visual { min-width: 0; padding: 15px; display: flex; }
.dm-visual {
    background: #3b5fd9;
    position: relative;
    width: 100%;
    min-height: 348px;
    border-radius: 13px;
    overflow: hidden;
    isolation: isolate;
}
.dm-visual__corner, .dm-visual__bottom {
    position: absolute;
    z-index: 2;
    color: #c5f8ed;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
}
.dm-visual__corner { top: 23px; left: 24px; }
.dm-visual__bottom { right: 25px; bottom: 18px; }
.dm-visual__orbit { position: absolute; border: 1px solid rgba(225, 244, 255, .45); border-radius: 50%; }
.dm-visual__orbit--one { width: 245px; height: 245px; top: -108px; right: -46px; }
.dm-visual__orbit--two { width: 305px; height: 305px; bottom: -165px; left: -95px; }
.dm-visual__disk { position: absolute; width: 116px; height: 116px; background: #f79b7d; border-radius: 50%; top: 14%; right: 14%; box-shadow: 16px 12px 0 rgba(255, 255, 255, .17); }
.dm-visual__disk:after { content: ""; display: block; width: 37px; height: 37px; border-radius: 50%; border: 11px solid #fff; margin: 28px 0 0 29px; }
.dm-visual__stack { position: absolute; inset: 41% 10% 12% 9%; }
.dm-visual__tile {
    position: absolute;
    width: 94%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    border-radius: 9px;
    padding: 13px 17px;
    align-items: center;
    box-shadow: 6px 7px 0 rgba(35, 61, 132, .18);
    color: #27476a;
}
.dm-visual__tile span { font-weight: 800; font-size: 12px; }
.dm-visual__tile strong { font-size: clamp(13px, 1.4vw, 18px); letter-spacing: .045em; }
.dm-visual__tile--one { top: 0; left: 0; background: #ffc8ad; transform: rotate(-5deg); }
.dm-visual__tile--two { top: 59px; left: 10%; background: #bbf3e7; transform: rotate(3deg); }
.dm-visual__tile--three { top: 118px; left: 2%; background: #fff; transform: rotate(-2deg); }
.dm-shortcuts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid var(--stroke);
    margin-top: 17px;
    gap: 1px;
    background: #d6e5f0;
}
.dm-shortcuts a {
    background: var(--paper);
    min-height: 70px;
    padding: 18px 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 800;
}
.dm-shortcuts a:hover { background: #e9f7f4; color: var(--teal); }
.dm-shortcuts__number { color: var(--coral); font-weight: 850; font-size: 12px; }
.dm-section { padding-block: clamp(34px, 3.8vw, 54px); border-bottom: 1px solid var(--stroke); }
.dm-section--last { border-bottom: 0; padding-bottom: 62px; }
.dm-section__heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.dm-section__heading h2 { margin: 0; }
.dm-section__heading .section__label { margin-bottom: 11px; }
.dm-split { display: grid; align-items: start; gap: clamp(18px, 2.6vw, 34px); }
.dm-split--wide { grid-template-columns: minmax(0, 1.95fr) minmax(0, 1fr); }
.dm-split--reverse { grid-template-columns: minmax(0, 1fr) minmax(0, 1.88fr); }
.dm-split--half { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dm-category-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 25px; }
.dm-category {
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr) 14px;
    gap: 12px;
    align-items: center;
    padding: 18px 2px;
    border-top: 1px solid #dce6ef;
}
.dm-category:nth-child(-n+2) { border-top: 3px solid var(--blue); }
.dm-category:hover strong { color: var(--blue); }
.dm-category > span:nth-child(2) { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.dm-category strong { font-size: 16px; line-height: 1.3; }
.dm-category small { color: var(--ink-soft); line-height: 1.43; font-size: 12px; }
.dm-category__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px 10px 4px 10px;
    font-size: 17px;
    line-height: 40px;
    text-align: center;
    font-weight: 800;
}
.dm-category__icon--violet { background: #eee7ff; color: #674bb8; }
.dm-category__icon--blue { background: #e2ebff; color: #3154cd; }
.dm-category__icon--teal { background: #d4f4ed; color: #007e7c; }
.dm-category__icon--coral { background: #ffebe5; color: #ba5348; }
.dm-category__indicator, .dm-offer-links__arrow { width: 8px; height: 8px; border-top: 2px solid #6481aa; border-right: 2px solid #6481aa; transform: rotate(45deg); }
.dm-sidebar {
    padding: clamp(22px, 2.4vw, 32px);
    border-radius: 15px;
    background: #f0edff;
    border: 1px solid #e0d8f5;
}
.dm-sidebar__kicker { display: block; font-size: 11px; color: #6b56ac; letter-spacing: .12em; font-weight: 850; margin-bottom: 11px; }
.dm-sidebar h3 { font-size: 23px; line-height: 1.28; margin-bottom: 15px; }
.dm-sidebar__line { display: grid; grid-template-columns: 29px minmax(0, 1fr); gap: 10px; align-items: start; border-top: 1px solid #d8cdef; padding: 16px 0; }
.dm-sidebar__line span { font-size: 12px; color: #6952a6; font-weight: 850; }
.dm-sidebar__line p { line-height: 1.43; font-size: 16px; margin: 0; }
.dm-sidebar__link { display: inline-flex; margin-top: 8px; font-weight: 800; text-decoration: underline; color: var(--blue); text-underline-offset: 5px; }
.dm-offer-art { position: relative; overflow: hidden; border-radius: 16px; padding: clamp(23px, 2.5vw, 34px); background: #e1f5ef; border: 1px solid #ccebe2; min-height: 362px; }
.dm-offer-art__decor { position: absolute; width: 150px; height: 150px; border-radius: 50%; right: -40px; top: -49px; border: 2px solid #80c9bb; display: flex; align-items: center; justify-content: center; color: #2a9d99; }
.dm-offer-art__decor span { font-size: 74px; line-height: 1; font-weight: 850; transform: translate(-15px, 20px) rotate(-16deg); opacity: .64; }
.dm-offer-art__overline { color: var(--teal); font-size: 11px; letter-spacing: .1em; font-weight: 850; }
.dm-offer-art h3 { max-width: 270px; margin: 21px 0 16px; font-size: 23px; }
.dm-offer-art p { max-width: 350px; }
.dm-offer-art .button { margin-top: 9px; }
.dm-offer-links { display: flex; flex-direction: column; border-top: 3px solid var(--blue); }
.dm-offer-links a { display: grid; grid-template-columns: 29px minmax(0, 1fr) 12px; gap: 14px; align-items: center; padding: 19px 9px; border-bottom: 1px solid #d7e4ee; }
.dm-offer-links a:hover { background: #ecf5ff; }
.dm-offer-links__count { color: var(--coral); font-size: 12px; font-weight: 850; }
.dm-offer-links a > span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; }
.dm-offer-links strong { font-size: 17px; }
.dm-offer-links small { color: var(--ink-soft); font-size: 13px; line-height: 1.4; }
.dm-method { background: #fff; border: 1px solid var(--stroke); border-radius: 15px; padding: clamp(23px, 2.6vw, 33px); }
.dm-method > p { line-height: 1.55; }
.dm-method__item { display: grid; grid-template-columns: 125px minmax(0, 1fr); gap: 12px; padding: 13px 0; border-top: 1px solid #e0e8f1; }
.dm-method__item strong { font-size: 14px; line-height: 1.4; color: var(--blue); }
.dm-method__item span { font-size: 14px; color: var(--ink-soft); line-height: 1.45; }
.dm-method .dm-actions { margin-top: 20px; }
.dm-cost { padding: clamp(24px, 2.6vw, 36px); background: #e8efff; border: 1px solid #d4e2fa; border-radius: 15px; }
.dm-cost__index { display: inline-block; font-size: 11px; letter-spacing: .12em; font-weight: 850; color: var(--blue); margin-bottom: 18px; }
.dm-cost h2 { max-width: 490px; }
.dm-cost p { line-height: 1.59; }
.dm-cost__equation { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; margin: 25px 0 24px; }
.dm-cost__equation span, .dm-cost__equation strong { display: inline-flex; align-items: center; border: 1px solid #c5d7ec; background: #fff; padding: 9px 12px; border-radius: 7px; font-size: 12px; line-height: 1.3; }
.dm-cost__equation strong { background: var(--blue); color: #fff; border-color: var(--blue); }
.dm-cost__equation b { align-self: center; color: var(--blue); }
.dm-analysis h2 { margin-bottom: 16px; }
.dm-analysis__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 18px 0; border-top: 1px solid #dce6ef; }
.dm-analysis__row > div { display: flex; flex-direction: column; gap: 4px; }
.dm-analysis__row strong { font-size: 16px; }
.dm-analysis__row span { font-size: 14px; color: var(--ink-soft); line-height: 1.5; }
.dm-analysis__row a { font-size: 13px; font-weight: 800; color: var(--blue); text-decoration: underline; text-underline-offset: 4px; text-align: right; }
.dm-decision { border-radius: 15px; background: #e2f3fb; border: 1px solid #cce7f1; padding: clamp(23px, 2.4vw, 31px); }
.dm-decision__badge { position: relative; border-radius: 10px 10px 3px 10px; background: var(--blue); color: #fff; font-size: 23px; font-weight: 850; letter-spacing: -.07em; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; box-shadow: 9px 8px 0 #bdebe4; }
.dm-decision h3 { font-size: 23px; max-width: 290px; }
.dm-decision__links { margin-top: 17px; padding-top: 13px; border-top: 1px solid #bad4e5; display: flex; flex-direction: column; gap: 10px; }
.dm-decision__links a { font-size: 14px; font-weight: 800; color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.dm-more { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 22px; border-top: 3px solid var(--blue); }
.dm-more a { padding: 18px 5px; border-bottom: 1px solid var(--stroke); display: flex; flex-direction: column; gap: 3px; }
.dm-more a:hover strong { color: var(--blue); }
.dm-more strong { font-size: 15px; }
.dm-more span { color: var(--ink-soft); font-size: 12px; }
@media (max-width: 1160px) {
    .brand__top { font-size: 17px; }
    .dm-category-list { column-gap: 12px; }
    .dm-category { gap: 8px; }
    .dm-split--wide { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); }
}
@media (max-width: 900px) {
    .dm-hero { grid-template-columns: minmax(0, 1fr); }
    .dm-hero__visual { display: none; }
    .dm-split--wide, .dm-split--reverse, .dm-split--half { grid-template-columns: minmax(0, 1fr); }
    .dm-sidebar { max-width: none; }
    .dm-category-list { column-gap: 24px; }
    .dm-more { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dm-analysis__row { grid-template-columns: minmax(0, 1fr) auto; }
}
@media (max-width: 620px) {
    .brand__sign { width: 43px; height: 43px; font-size: 27px; }
    .brand__top { font-size: 18px; }
    .brand__bottom { display: block; font-size: 8px; }
    .dm-home { padding-top: 12px; }
    .dm-hero { border-radius: 13px; }
    .dm-hero__content { padding: 26px 20px; }
    .dm-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dm-shortcuts a { min-height: 65px; padding: 13px 10px; }
    .dm-category-list { grid-template-columns: minmax(0, 1fr); }
    .dm-category:nth-child(2) { border-top: 1px solid #dce6ef; }
    .dm-section__heading { align-items: start; flex-direction: column; gap: 7px; }
    .dm-offer-art { min-height: auto; }
    .dm-method__item { grid-template-columns: 1fr; gap: 3px; }
    .dm-cost__equation { gap: 6px; }
    .dm-analysis__row { grid-template-columns: minmax(0, 1fr); gap: 5px; }
    .dm-analysis__row a { text-align: left; }
    .dm-more { gap: 0 13px; }
}
@media (max-width: 360px) {
    .brand { gap: 8px; }
    .brand__top { font-size: 16px; }
    .brand__bottom { letter-spacing: .02em; }
    .dm-shortcuts a { gap: 8px; font-size: 12px; }
}

.story-hero { min-height: 352px; }
.story-hero--fashion { background: #eeedff; border-color: #e1dcfc; }
.story-hero--shoes { background: #e5f6f5; border-color: #cbece8; }
.story-hero--beauty { background: #fff0f0; border-color: #f4dfe8; }
.story-hero--home { background: #e6f1ff; border-color: #d5e4f5; }
.story-hero--electronics { background: #e6f6f7; border-color: #d0e9ef; }
.story-hero .hero__copy { justify-content: center; }
.story-hero .hero__support { color: var(--ink-soft); }
.story-art { width: 100%; min-height: 330px; border-radius: 16px; position: relative; isolation: isolate; overflow: hidden; }
.story-art:before { content: ""; position: absolute; width: 260px; height: 260px; border: 1px solid rgba(255,255,255,.33); border-radius: 50%; top: -120px; right: -75px; }
.story-art:after { content: ""; position: absolute; width: 230px; height: 230px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; bottom: -170px; left: -110px; }
.story-art__caption { position: absolute; z-index: 5; bottom: 18px; left: 22px; font-weight: 850; font-size: 11px; letter-spacing: .14em; color: #fff; }
.story-art--fashion { background: #655bd8; }
.fashion-shirt { position: absolute; width: 210px; height: 216px; background: #c8f1eb; top: 67px; left: 15%; clip-path: polygon(21% 0, 36% 0, 45% 11%, 56% 11%, 65% 0, 80% 0, 100% 18%, 88% 39%, 76% 30%, 76% 100%, 24% 100%, 24% 30%, 12% 39%, 0 18%); filter: drop-shadow(2px 7px 0 rgba(45, 67, 118, .12)); transform: rotate(-8deg); }
.fashion-shirt:before { content: ""; position: absolute; top: -10px; left: 85px; width: 40px; height: 37px; background: #655bd8; border-radius: 0 0 32px 32px; }
.fashion-shirt span { display: block; height: 3px; width: 96px; position: absolute; top: 85px; left: 57px; background: #55c9b2; transform: rotate(-5deg); box-shadow: 0 12px 0 #55c9b2, 0 24px 0 #55c9b2, 0 36px 0 #55c9b2; opacity: .7; }
.fashion-seam { position: absolute; width: 120px; height: 140px; border: 3px dashed #f0b7a5; transform: rotate(-16deg); top: -5px; right: -25px; border-radius: 22px; }
.fashion-ticket { position: absolute; z-index: 2; background: #ffd0b0; color: #425b81; width: 128px; top: 78px; right: 8%; padding: 23px 13px 22px; transform: rotate(9deg); box-shadow: 7px 8px 0 rgba(255,255,255,.12); border-radius: 5px; }
.fashion-ticket:before { content: ""; display: block; width: 15px; height: 15px; background: #655bd8; border-radius: 50%; margin: -13px auto 14px; }
.fashion-ticket b, .fashion-ticket i, .fashion-ticket em { font-size: 12px; display: block; font-style: normal; font-weight: 850; letter-spacing: .1em; padding: 5px 0; border-bottom: 1px solid #ddb29d; }
.story-art--shoes { background: #087d8b; }
.shoe-upper { position: absolute; width: 270px; height: 135px; left: 13%; top: 111px; background: #c4ecff; border-radius: 60px 38px 25px 36px; clip-path: polygon(3% 72%, 24% 51%, 33% 17%, 48% 14%, 65% 53%, 78% 65%, 99% 73%, 100% 96%, 0 100%); transform: rotate(-8deg); }
.shoe-upper:before { content: ""; position: absolute; width: 142px; height: 12px; background: #699fdf; left: 70px; top: 82px; transform: rotate(14deg); border-radius: 10px; }
.shoe-laces { position: absolute; left: 92px; top: 57px; width: 100px; height: 6px; border-top: 4px dashed #fff; transform: rotate(15deg); box-shadow: 0 17px 0 #fff, 0 34px 0 #fff; }
.shoe-sole { position: absolute; width: 290px; height: 34px; background: #ffe3a8; left: 11%; top: 232px; border-radius: 8px 10px 24px 26px; transform: rotate(-8deg); border-bottom: 9px solid #53c7c7; }
.shoe-guide { position: absolute; top: 55px; right: 16%; border: 3px dashed rgba(255,255,255,.5); width: 72px; height: 190px; border-radius: 70px; transform: rotate(-14deg); }
.story-art--beauty { background: #de6e84; }
.beauty-pump { position: absolute; z-index: 2; width: 100px; height: 172px; background: #ffdbde; bottom: 57px; left: 14%; border-radius: 17px 17px 10px 10px; box-shadow: inset 0 -18px 0 #ffc2cb, 7px 7px 0 rgba(255,255,255,.12); }
.beauty-pump:before { content: ""; position: absolute; top: -24px; left: 39px; width: 22px; height: 26px; background: #ffeaf0; border-radius: 4px; }
.beauty-pump:after { content: ""; position: absolute; top: -31px; left: 32px; width: 57px; height: 8px; background: #fff2f5; border-radius: 7px; }
.beauty-pump span { display: block; width: 49px; height: 4px; margin: 66px auto 0; background: #b65d88; box-shadow: 0 15px 0 #b65d88, 0 30px 0 #b65d88; }
.beauty-tube { position: absolute; width: 99px; height: 201px; right: 19%; top: 55px; background: #b3ece9; border-radius: 9px 9px 21px 21px; transform: rotate(15deg); box-shadow: inset 0 15px 0 #d8fffa; }
.beauty-tube:after { content: ""; position: absolute; width: 61px; height: 15px; background: #45abb1; bottom: -11px; left: 19px; border-radius: 4px 4px 7px 7px; }
.beauty-jar { position: absolute; width: 129px; height: 87px; bottom: 61px; left: 46%; background: #fff2f1; border-radius: 9px 9px 24px 24px; box-shadow: inset 0 20px 0 #f5bad6; }
.beauty-jar:before { content: ""; position: absolute; top: -11px; left: -4px; width: 137px; height: 19px; background: #724c9a; border-radius: 7px; }
.story-art--home { background: #4477be; }
.home-window { position: absolute; width: 155px; height: 169px; background: #bdeefa; border: 11px solid #dcefff; border-radius: 7px; top: 48px; right: 12%; box-shadow: inset 2px 0 0 #b5c9ff; }
.home-window:before { content: ""; position: absolute; width: 9px; height: 148px; background: #e1eeff; left: 58px; top: 0; }
.home-window:after { content: ""; position: absolute; height: 9px; width: 135px; background: #e1eeff; left: 0; top: 69px; }
.home-floor { position: absolute; height: 3px; bottom: 59px; left: 13%; right: 10%; background: #a9d7fb; }
.home-sofa { position: absolute; bottom: 62px; left: 15%; width: 220px; height: 75px; background: #b7f0e1; border: 8px solid #9ad7c9; border-radius: 22px 22px 12px 12px; box-shadow: 0 17px 0 -12px #3658a8; }
.home-sofa:before { content: ""; position: absolute; top: -59px; left: 18px; width: 167px; height: 58px; background: #b7f0e1; border: 9px solid #9ad7c9; border-radius: 17px 17px 0 0; }
.home-sofa span { position: absolute; display: block; bottom: -19px; left: 13px; width: 13px; height: 16px; background: #f5bd88; box-shadow: 175px 0 0 #f5bd88; }
.home-lamp { position: absolute; width: 12px; height: 155px; bottom: 61px; right: 14%; background: #d8ecff; border-radius: 6px; }
.home-lamp:before { content: ""; position: absolute; width: 66px; height: 50px; left: -27px; top: -23px; background: #ffcb9e; border-radius: 12px 12px 24px 24px; clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%); }
.story-art--electronics { background: #3c67cf; }
.elec-screen { position: absolute; width: 260px; height: 178px; top: 55px; left: 13%; border: 12px solid #c8e9ff; background: #2c93ac; border-radius: 13px 13px 4px 4px; box-shadow: 8px 8px 0 rgba(255,255,255,.12); }
.elec-screen:before { content: ""; position: absolute; width: 150px; height: 110px; top: 21px; left: 48px; background: #91e3d3; border-radius: 50% 50% 20px 20px; transform: rotate(-24deg); }
.elec-screen:after { content: ""; position: absolute; width: 103px; height: 43px; bottom: 17px; right: 23px; background: #ffbc95; transform: rotate(-10deg); border-radius: 6px; }
.elec-screen span { position: absolute; width: 13px; height: 13px; background: #fff; border-radius: 50%; left: 111px; top: -11px; }
.elec-base { position: absolute; width: 308px; height: 20px; background: #bee9fd; left: 8%; top: 233px; transform: skewX(-22deg); border-radius: 0 0 14px 14px; }
.elec-chip { position: absolute; width: 74px; height: 74px; border-radius: 13px; background: #ffca93; color: #475fa3; display: grid; place-items: center; font-size: 16px; font-weight: 900; top: 165px; right: 10%; transform: rotate(12deg); border: 9px double rgba(255,255,255,.85); box-shadow: 5px 8px 0 rgba(255,255,255,.14); }
.e-table { width: 100%; overflow-x: auto; padding: 4px 5px 4px; border: 1px solid var(--stroke); background: #fff; border-radius: 13px; }
.e-table table { min-width: 615px; }
.e-table .data-table td:first-child { white-space: normal; min-width: 105px; }
.e-table .data-table th, .e-table .data-table td { padding: 16px 17px; }
.decision-line { display: flex; gap: 18px; align-items: center; padding: 17px 23px; border-left: 4px solid var(--teal); background: #e4f6f2; margin-top: 18px; border-radius: 0 12px 12px 0; }
.decision-line strong { font-size: 14px; color: var(--teal); flex: none; }
.decision-line p { margin: 0; line-height: 1.5; }
.measurement { background: #e8efff; border: 1px solid #d2e0f7; border-radius: 14px; padding: clamp(23px, 2.5vw, 34px); }
.measurement--home { background: #e8f4f4; border-color: #cde8e8; }
.measurement--compact { background: #fff0f1; border-color: #f2dce0; }
.measure-row { display: grid; grid-template-columns: 37px minmax(0,1fr); gap: 14px; padding: 15px 0; border-top: 1px solid rgba(75,104,145,.2); }
.measure-row span { display: block; border: 1px solid #c5d1ee; color: var(--blue); border-radius: 6px; width: 34px; height: 34px; font-size: 12px; font-weight: 850; text-align: center; line-height: 32px; background: #fff; }
.measure-row strong { display: block; margin-bottom: 3px; }
.measure-row p { margin: 0; line-height: 1.48; color: var(--ink-soft); }
.mini-panel { border-radius: 14px; background: #f0edff; border: 1px solid #dfd5fa; padding: clamp(22px,2.1vw,33px); }
.mini-panel--teal { background: #ddf4f1; border-color: #c8e6df; }
.mini-panel--rose { background: #ffebee; border-color: #f6d7e1; }
.mini-panel__number { display: block; margin-bottom: 15px; font-size: 12px; color: var(--violet); letter-spacing: .13em; font-weight: 850; }
.mini-panel h3 { font-size: 23px; }
.mini-panel p { line-height: 1.56; }
.mini-panel__rule { height: 3px; width: 45px; margin: 19px 0; border-radius: 3px; background: var(--coral); }
.formula { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 23px 0 24px; }
.formula span, .formula strong { padding: 10px 14px; border: 1px solid #cedef1; background: #eff6ff; border-radius: 8px; font-size: 14px; line-height: 1.4; }
.formula b { color: var(--blue); font-weight: 900; }
.formula strong { background: var(--blue); border-color: var(--blue); color: #fff; }
.care-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.care-column { border: 1px solid var(--stroke); border-top: 5px solid var(--teal); background: #fff; padding: clamp(20px,2.1vw,30px); border-radius: 13px; display: flex; flex-direction: column; gap: 10px; }
.care-column:nth-child(2) { border-top-color: var(--violet); background: #f4f0ff; }
.care-column:nth-child(3) { border-top-color: var(--coral); background: #fff0f1; }
.care-column__index { font-size: 12px; font-weight: 850; letter-spacing: .13em; color: var(--teal); }
.care-column h3 { font-size: 22px; margin: 0; }
.care-column p { margin: 0; flex: 1; }
.care-column > strong { padding-top: 13px; border-top: 1px solid #dbe6f0; font-size: 13px; color: var(--blue); }
.energy-tag { background: #f1f6ff; border: 1px solid #d6e4f3; border-radius: 14px; padding: clamp(19px, 2vw, 30px); }
.energy-tag__label { font-size: 12px; font-weight: 850; letter-spacing: .14em; color: var(--blue); margin-bottom: 18px; }
.energy-tag__scale { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; margin-bottom: 22px; }
.energy-tag__scale span { display: inline-flex; align-items: center; padding: 3px 0 3px 12px; font-weight: 850; font-size: 14px; height: 29px; border-radius: 4px 11px 11px 4px; color: #fff; background: #008a7b; }
.energy-tag__scale span:nth-child(1) { width: 37%; }
.energy-tag__scale span:nth-child(2) { width: 45%; background: #2da87a; }
.energy-tag__scale span:nth-child(3) { width: 53%; background: #70b77b; }
.energy-tag__scale span:nth-child(4) { width: 61%; background: #abac5c; }
.energy-tag__scale span:nth-child(5) { width: 69%; background: #d49f46; }
.energy-tag__scale span:nth-child(6) { width: 77%; background: #d98759; }
.energy-tag__scale span:nth-child(7) { width: 85%; background: #c65e6e; }
.energy-tag strong { display: block; margin-bottom: 7px; font-size: 16px; }
.energy-tag p { font-size: 16px; color: var(--ink-soft); }
@media (max-width: 1030px) {
    .story-hero { grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); }
    .fashion-shirt { left: 9%; }
    .shoe-upper { left: 7%; }
    .shoe-sole { left: 5%; }
    .elec-screen { left: 7%; }
    .elec-base { left: 4%; }
}
@media (max-width: 900px) {
    .story-hero { grid-template-columns: minmax(0,1fr); }
    .care-columns { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .care-column:last-child { grid-column: span 2; }
}
@media (max-width: 560px) {
    .care-columns { grid-template-columns: minmax(0,1fr); }
    .care-column:last-child { grid-column: auto; }
    .decision-line { display: block; padding: 16px; }
    .decision-line strong { display: block; margin-bottom: 7px; }
    .e-table .data-table th, .e-table .data-table td { padding: 12px 10px; }
    .formula { align-items: flex-start; }
}
@media (max-width: 620px) {
    .e-table { overflow: visible; padding: 0; border: 0; background: transparent; }
    .e-table table { display: block; min-width: 0; width: 100%; }
    .e-table thead { display: none; }
    .e-table tbody { display: grid; gap: 11px; }
    .e-table tbody tr { display: block; padding: 8px 14px; background: #fff; border: 1px solid var(--stroke); border-radius: 11px; }
    .e-table .data-table td, .e-table .data-table td:first-child { min-width: 0; display: grid; grid-template-columns: minmax(0, 105px) minmax(0, 1fr); gap: 12px; padding: 11px 0; font-weight: 500; border-bottom: 1px solid var(--stroke); color: var(--ink); }
    .e-table .data-table td:last-child { border-bottom: 0; }
    .e-table .data-table td:before { content: attr(data-label); color: var(--blue); font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .03em; }
}
