/* Two complete art directions share content, accessible sizes, and interactions. */
.design-switcher { min-height: 43px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 6px 20px; background: #e9ede3; color: #3d5141; font-size: 12px; border-bottom: 1px solid #d5ddcb; }
.design-switcher > span { margin-right: 17px; font-size: 11px; letter-spacing: 1px; opacity: .7; }
.design-switcher a { padding: 4px 14px; border-radius: 3px; white-space: nowrap; }
.design-switcher a[aria-current] { background: #fff; box-shadow: 0 1px 4px #173c3210; font-weight: 650; }
.design-switcher a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* A — Midnight blue, precision grids, cool product photography. */
html[data-design="tech"] { color-scheme: dark; --paper: #091623; --ink: #eaf2f8; --green: #8ce4f3; --muted: #a3b5c6; --line: #2c4053; --lime: #99e8f3; --soft: #142739; --reading-muted: #a9bbcc; }
[data-design="tech"] body { background: #091623; }
[data-design="tech"] .design-switcher { background: #0e2030; color: #c5d9e7; border-color: #263e52; }
[data-design="tech"] .design-switcher a[aria-current] { background: #214458; color: #a4f0f8; box-shadow: none; }
[data-design="tech"] .header { border-bottom: 1px solid #263b4b; height: 91px; }
[data-design="tech"] .brand-mark { stroke: #9de9f5; }
[data-design="tech"] .brand > span { letter-spacing: 2px; }
[data-design="tech"] .brand small { font-size: 9px; color: #91afc0; }
[data-design="tech"] .header-contact { border-color: #6faec3; }
[data-design="tech"] .hero { padding-top: 54px; gap: 40px; grid-template-columns: 1.04fr 1fr; }
[data-design="tech"] .hero-copy { padding-block: 35px; }
[data-design="tech"] .hero h1 { font-size: clamp(40px, 4.25vw, 64px); line-height: 1.35; letter-spacing: -2px; }
[data-design="tech"] .serif-accent { font-family: var(--sans); font-weight: 650; color: #99e8f3; }
[data-design="tech"] .eyebrow { color: #a1dce7; border-left: 2px solid #90e0f2; padding-left: 12px; }
[data-design="tech"] .dot { background: #8ee5f4; }
[data-design="tech"] .hero-desc { margin-top: 27px; }
[data-design="tech"] .hero-media { border-radius: 0; height: 560px; border: 1px solid #2a4a60; }
[data-design="tech"] .hero-media > img { object-position: 51% center; }
[data-design="tech"] .hero-media:after { content: ''; position: absolute; top: 14px; right: 14px; width: 24px; height: 24px; border-top: 1px solid #8ed8e7; border-right: 1px solid #8ed8e7; pointer-events: none; }
[data-design="tech"] .image-topline { color: #c0deec; }
[data-design="tech"] .image-label { background: #0a2033e8; border: 1px solid #436b82; color: #e9f7fc; backdrop-filter: blur(15px); }
[data-design="tech"] .image-label small { color: #a5c0d0; }
[data-design="tech"] .image-disclaimer { color: #d2e5ef; background: #0b1b28b8; padding: 1px 5px; }
[data-design="tech"] .button { border-radius: 0; }
[data-design="tech"] .button-dark, [data-design="tech"] .contact .button { background: #99e8f3; color: #0b2435; }
[data-design="tech"] .button-dark:hover, [data-design="tech"] .contact .button:hover { background: #c0f4fa; }
[data-design="tech"] .button-dark svg { stroke: #0b2435; }
[data-design="tech"] .hero-foot { border-bottom: 0; }
[data-design="tech"] .section-nav { background: #0b1b2a; border-color: #2a4054; }
[data-design="tech"] .section-nav a.active { color: #a6eff8; }
[data-design="tech"] .section h2 { font-weight: 600; line-height: 1.45; }
[data-design="tech"] .section-kicker { color: #8bc5d8; letter-spacing: 2px; }
[data-design="tech"] .about { grid-template-columns: .75fr 1.25fr; }
[data-design="tech"] .facts { background: #112437; padding: 24px; border: 1px solid #2b4256; }
[data-design="tech"] .facts strong { color: #a7edf5; }
[data-design="tech"] .facts > div + div { border-color: #365267; }
[data-design="tech"] .advantages-wrap { background: #102335; border-block: 1px solid #2a4052; }
[data-design="tech"] .advantages-grid { gap: 18px; }
[data-design="tech"] .advantages-grid article { padding: 30px 25px; background: #0c1b2a; border: 1px solid #304a5d; }
[data-design="tech"] .advantages-grid article + article:before { display: none; }
[data-design="tech"] .adv-top { margin-bottom: 25px; }
[data-design="tech"] .adv-top svg { stroke: #98e6ef; }
[data-design="tech"] .adv-tag { color: #a5dce5; border-color: #486f83; }
[data-design="tech"] .solution-tabs button { color: #a8bdcc; }
[data-design="tech"] .solution-tabs button[aria-selected=true] { color: #b4f5fb; }
[data-design="tech"] .product-stage, [data-design="tech"] .medical-stage { border: 1px solid #304e62; border-radius: 0; background: radial-gradient(ellipse at center, #294556, #112438 73%); }
[data-design="tech"] .stage-caption, [data-design="tech"] .stage-note { color: #bdd2dd; }
[data-design="tech"] .solution-copy .pill { color: #abdce8; border-color: #365971; }
[data-design="tech"] .chip-row span { color: #b7e0ea; background: #1b354a; }
[data-design="tech"] .solution-copy h3 { color: #edf7fa; }
[data-design="tech"] .medical-cross { color: #284354; }
[data-design="tech"] .vending, [data-design="tech"] .medical-visual { background: linear-gradient(110deg, #eef4f7, #b6c9d3); border-color: #8ca5b4; }
[data-design="tech"] .vending-window { background: #183548; border-color: #7995a5; }
[data-design="tech"] .locker { background: linear-gradient(110deg, #385569, #152c40); border-color: #7893a4; }
[data-design="tech"] .locker-grid i, [data-design="tech"] .care-grid i { background: linear-gradient(120deg, #e4edf1, #b0c4cf); border-color: #8ca4b2; color: #38667b; }
[data-design="tech"] .locker .machine-brand { color: #d1e8ee; }
[data-design="tech"] .scenes-wrap { background: #102335; }
[data-design="tech"] .scene-display { border-radius: 0; border: 1px solid #365367; }
[data-design="tech"] .scene-image-label { color: #c8e1ed; }
[data-design="tech"] .scene-shade { background: linear-gradient(0deg, #061a2aee, transparent 90%); }
[data-design="tech"] .scene-choice { border-color: #355063; }
[data-design="tech"] .scene-arrow { color: #88c2d3; }
[data-design="tech"] .cooperation-wrap { background: #081420; border-block: 1px solid #2d4253; }
[data-design="tech"] .cooperation-wrap h2 > span { color: #9fddea; }
[data-design="tech"] .cooperation-wrap .section-kicker { color: #9cd5e5; }
[data-design="tech"] .cooperation-wrap .section-side { color: #a9c0cf; }
[data-design="tech"] .mode-card { background: #112537; border-color: #355265; border-radius: 0; }
[data-design="tech"] .mode-number { color: #a0cbdd; }
[data-design="tech"] .mode-for { color: #b3c8d5; }
[data-design="tech"] .mode-card ul { color: #c5d9e2; }
[data-design="tech"] .mode-link { border-color: #3b586c; color: #e0f1f7; }
[data-design="tech"] .mode-card.featured { background: #a6e8f1; color: #0a2637; }
[data-design="tech"] .featured .mode-number, [data-design="tech"] .featured .mode-for, [data-design="tech"] .featured ul { color: #214b5e; }
[data-design="tech"] .featured .mode-link { color: #0a2637; border-color: #6faebb; }
[data-design="tech"] .mode-badge { border-color: #4f899b; }
[data-design="tech"] .cooperation-note { color: #a9c3d3; }
[data-design="tech"] .step-number { color: #a3e9f4; border-color: #4f768c; border-radius: 3px; background: #122b3d; }
[data-design="tech"] .process-grid li:not(:last-child):after { border-color: #44677e; }
[data-design="tech"] .contact-wrap { background: #142d41; border-top: 1px solid #3f5a6d; }
[data-design="tech"] .contact-label, [data-design="tech"] .address svg { color: #b0ccdc; stroke: #b0ccdc; }
[data-design="tech"] .phone, [data-design="tech"] .footer { border-color: #3c5b6f; }
[data-design="tech"] .footer-brand { color: #ddf5fc; }
[data-design="tech"] .mobile-dock { background: #0c1e2df5; border-color: #355064; }
[data-design="tech"] .dock-products svg { stroke: #c1e1eb; }
[data-design="tech"] .dialog { background: #11283b; color: #e5f4fb; border: 1px solid #54758b; border-radius: 0; }
[data-design="tech"] .dialog-close { color: #c5d8e5; }
[data-design="tech"] .copy-button { background: #234559; color: #d8f2f8; }
[data-design="tech"] .toast, [data-design="tech"] .skip { background: #97e6f1; color: #092135; }
[data-design="tech"] :focus-visible { outline-color: #b0f2ff; }

/* B — Warm paper, generous editorial typography, terracotta and rounded forms. */
html[data-design="warm"] { color-scheme: light; --paper: #faf4e9; --ink: #493c31; --green: #9b4b31; --muted: #78675b; --line: #dfd0bd; --lime: #edca9f; --soft: #f0e4d2; --reading-muted: #756252; }
[data-design="warm"] body { background: #faf4e9; }
[data-design="warm"] .design-switcher { background: #f0e3d2; color: #6b4e3b; border-color: #deccb8; }
[data-design="warm"] .design-switcher a { border-radius: 20px; }
[data-design="warm"] .design-switcher a[aria-current] { background: #fffaf1; color: #9b4b31; }
[data-design="warm"] .header { height: 98px; }
[data-design="warm"] .brand-mark { stroke: #9c4e32; }
[data-design="warm"] .brand > span { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-weight: 600; font-size: 28px; }
[data-design="warm"] .brand small { font-family: var(--sans); color: #8d6b56; }
[data-design="warm"] .header-contact { border: 1px solid #bc9073; border-radius: 30px; padding: 8px 17px; }
[data-design="warm"] .hero { display: flex; flex-direction: column; padding-top: 25px; }
[data-design="warm"] .hero-copy { text-align: center; padding: 12px 0 43px; width: 100%; }
[data-design="warm"] .eyebrow { justify-content: center; color: #9c654c; letter-spacing: 2px; margin-bottom: 20px; }
[data-design="warm"] .dot { background: #b57c51; }
[data-design="warm"] .hero h1 { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-size: clamp(48px, 5.1vw, 75px); font-weight: 400; line-height: 1.35; letter-spacing: -2px; }
[data-design="warm"] .hero h1 > br { display: none; }
[data-design="warm"] .serif-accent { color: #a65337; font-weight: 500; }
[data-design="warm"] .hero-desc { margin-top: 19px; font-size: 17px; }
[data-design="warm"] .hero-desc > br { display: none; }
[data-design="warm"] .hero-actions { justify-content: center; margin-top: 26px; }
[data-design="warm"] .hero-caption { display: none; }
[data-design="warm"] .hero-media { width: 100%; height: 440px; border-radius: 180px 180px 12px 12px; }
[data-design="warm"] .hero-media > img { object-position: 50% 56%; }
[data-design="warm"] .image-topline { top: 28px; left: 55px; right: 55px; color: #5b5948; }
[data-design="warm"] .image-label { left: auto; right: 25px; width: 340px; bottom: 40px; padding: 18px 22px; background: #fffbf0ee; border-radius: 12px; border-color: #f8ebd7; }
[data-design="warm"] .image-disclaimer { color: #514936; background: #fff8e8ba; padding: 1px 6px; border-radius: 3px; }
[data-design="warm"] .hero-foot { width: 100%; padding-block: 23px 30px; }
[data-design="warm"] .button { border-radius: 32px; }
[data-design="warm"] .button-dark, [data-design="warm"] .contact .button { background: #9b4b31; color: #fff6e7; }
[data-design="warm"] .button-dark:hover { background: #7e3823; }
[data-design="warm"] .section-nav { background: #faf4e9; border-color: #e0cfb8; }
[data-design="warm"] .section-nav a.active { color: #9b4b31; }
[data-design="warm"] .section h2, [data-design="warm"] .contact h2, [data-design="warm"] .dialog h2 { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-weight: 500; letter-spacing: 0; }
[data-design="warm"] .section h2 { font-size: 39px; line-height: 1.5; }
[data-design="warm"] .section-kicker { color: #9c684b; letter-spacing: 2px; }
[data-design="warm"] .about { grid-template-columns: 1fr 1fr; gap: 90px; }
[data-design="warm"] .about-body .lead { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-size: 24px; }
[data-design="warm"] .facts { border-top: 1px solid #c9ad8e; }
[data-design="warm"] .facts strong { color: #9a5135; font-weight: 400; }
[data-design="warm"] .advantages-wrap { background: #eee1ce; border-radius: 48px 48px 0 0; }
[data-design="warm"] .advantages-grid { gap: 24px; }
[data-design="warm"] .advantages-grid article { background: #fcf7ed; border: 1px solid #e5d5bd; border-radius: 22px; padding: 30px; }
[data-design="warm"] .advantages-grid article + article:before { display: none; }
[data-design="warm"] .adv-top svg { stroke: #9f6745; }
[data-design="warm"] .adv-tag { color: #985e40; border-color: #c7a789; }
[data-design="warm"] .solution-tabs { border-bottom: 0; gap: 10px; margin-bottom: 33px; }
[data-design="warm"] .solution-tabs button { margin: 0; border: 1px solid #d9c6ac; border-radius: 30px; padding: 11px 25px; gap: 30px; font-size: 16px; color: #78604c; }
[data-design="warm"] .solution-tabs button[aria-selected=true] { color: #fff6e8; background: #9b4b31; border-color: #9b4b31; }
[data-design="warm"] .solution-panel { grid-template-columns: 1fr 1fr; gap: 85px; }
[data-design="warm"] .product-stage, [data-design="warm"] .medical-stage { border-radius: 120px 120px 20px 20px; background: #eadbc4; }
[data-design="warm"] .stage-caption { left: 0; right: 0; text-align: center; top: 35px; color: #735c46; }
[data-design="warm"] .stage-note { color: #735c46; }
[data-design="warm"] .solution-copy .pill { color: #956142; border-color: #ccb092; border-radius: 4px; }
[data-design="warm"] .solution-copy h3 { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-size: 35px; font-weight: 500; }
[data-design="warm"] .chip-row span { background: #f0e1cc; color: #7c563d; border-radius: 20px; padding-inline: 12px; }
[data-design="warm"] .medical-cross { color: #d7c8ae; }
[data-design="warm"] .scenes-wrap { background: #f1e5d3; }
[data-design="warm"] .scenes-layout { grid-template-columns: 1.25fr 1fr; }
[data-design="warm"] .scene-display { border-radius: 22px; }
[data-design="warm"] .scene-shade { background: linear-gradient(0deg, #3a2e20d9, transparent 85%); }
[data-design="warm"] .scene-overlay h3 { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-size: 35px; }
[data-design="warm"] .scene-overlay > span, [data-design="warm"] .scene-overlay p { color: #f1e5cf; }
[data-design="warm"] .scene-choice { border-color: #d8c4a9; }
[data-design="warm"] .scene-arrow { color: #ac805b; }
[data-design="warm"] .cooperation-wrap { background: #70452f; color: #fff1dc; border-radius: 48px 48px 0 0; }
[data-design="warm"] .cooperation-wrap h2 { font-size: 38px; }
[data-design="warm"] .cooperation-wrap h2 > span { color: #edc999; }
[data-design="warm"] .cooperation-wrap .section-kicker, [data-design="warm"] .cooperation-wrap .section-side { color: #e0c5a8; }
[data-design="warm"] .mode-card { border-radius: 22px; border-color: #a77b5b; background: #79503a; }
[data-design="warm"] .mode-card h3 { font-family: 'STSong', 'Songti SC', 'SimSun', serif; font-size: 30px; }
[data-design="warm"] .mode-number, [data-design="warm"] .mode-for, [data-design="warm"] .mode-card ul { color: #efd9ba; }
[data-design="warm"] .mode-link { color: #ffefd7; border-color: #ae8462; }
[data-design="warm"] .mode-card.featured { background: #f2d2a4; color: #623c26; border-color: #f2d2a4; }
[data-design="warm"] .featured .mode-number, [data-design="warm"] .featured .mode-for, [data-design="warm"] .featured ul { color: #785237; }
[data-design="warm"] .featured .mode-link { color: #623c26; border-color: #c8a376; }
[data-design="warm"] .mode-badge { border-color: #bb9162; border-radius: 20px; padding-inline: 8px; }
[data-design="warm"] .cooperation-note { color: #e2c6a7; }
[data-design="warm"] .step-number { border-color: #c3a27e; background: #f1e1ca; color: #945235; }
[data-design="warm"] .process-grid li:not(:last-child):after { border-color: #c3a27e; }
[data-design="warm"] .contact-wrap { background: #ead7b9; border-radius: 48px 48px 0 0; }
[data-design="warm"] .contact h2 { font-size: 44px; }
[data-design="warm"] .contact-label { color: #7e6145; }
[data-design="warm"] .phone, [data-design="warm"] .footer { border-color: #ccb08c; }
[data-design="warm"] .address svg { stroke: #8d6a48; }
[data-design="warm"] .footer-brand { color: #805337; }
[data-design="warm"] .mobile-dock { background: #fcf7ecf5; border-color: #dfcdb2; }
[data-design="warm"] .dialog { background: #fcf6eb; border-radius: 24px; border: 1px solid #dcc4a3; }
[data-design="warm"] .dialog-close { color: #90674d; }
[data-design="warm"] .copy-button { background: #ecdcc3; color: #714a31; border-radius: 22px; }
[data-design="warm"] .toast, [data-design="warm"] .skip { background: #815039; color: #fff7e8; }
[data-design="warm"] :focus-visible { outline-color: #a66137; }

@media (max-width: 1100px) and (min-width: 761px) {
  [data-design="tech"] .hero { gap: 28px; }
  [data-design="tech"] .hero h1 { font-size: 40px; }
  [data-design="tech"] .hero-media { height: 505px; }
  [data-design="tech"] .facts { padding: 20px 16px; }
  [data-design="tech"] .advantages-grid article { padding: 25px 20px; }
  [data-design="warm"] .hero h1 { font-size: 51px; }
  [data-design="warm"] .about { gap: 45px; }
  [data-design="warm"] .advantages-grid article { padding: 25px 20px; }
  [data-design="warm"] .solution-panel { gap: 45px; }
}

@media (max-width: 760px) {
  .design-switcher { gap: 4px; padding: 7px 12px; font-size: 12px; min-height: 42px; }
  .design-switcher > span { display: none; }
  .design-switcher a { padding: 4px 10px; }
  [data-design="tech"] .header { height: 76px; }
  [data-design="tech"] .hero { gap: 0; padding-top: 30px; }
  [data-design="tech"] .hero-copy { padding: 0; }
  [data-design="tech"] .hero h1 { font-size: clamp(33px, 9.5vw, 58px); line-height: 1.4; letter-spacing: -1.8px; }
  [data-design="tech"] .hero-media { height: auto; aspect-ratio: 1.05; margin-top: 32px; }
  [data-design="tech"] .hero-desc { margin-top: 22px; }
  [data-design="tech"] .image-label { left: 12px; right: 12px; bottom: 36px; }
  [data-design="tech"] .section-kicker { letter-spacing: 1.3px; }
  [data-design="tech"] .facts { padding: 20px 12px; }
  [data-design="tech"] .facts > div + div { padding-left: 12px; }
  [data-design="tech"] .facts small { font-size: 11px; }
  [data-design="tech"] .facts strong { font-size: 27px; }
  [data-design="tech"] .facts .fact-word { font-size: 17px; }
  [data-design="tech"] .advantages-grid { gap: 14px; }
  [data-design="tech"] .advantages-grid article { padding: 23px 20px; grid-template-columns: 31px 1fr; gap: 0 15px; }
  [data-design="tech"] .adv-top { margin-bottom: 0; }
  [data-design="tech"] .advantages-grid h3 { font-size: 17px; }
  [data-design="tech"] .cooperation-wrap h2 { font-size: 25px; }
  [data-design="tech"] .hero-foot { padding-bottom: 24px; }
  [data-design="warm"] .header { height: 80px; gap: 15px; }
  [data-design="warm"] .brand > span { font-size: 25px; }
  [data-design="warm"] .header-contact { padding: 6px 12px; font-size: 13px; gap: 10px; }
  [data-design="warm"] .hero { padding-top: 22px; }
  [data-design="warm"] .hero-copy { padding: 0 0 30px; }
  [data-design="warm"] .eyebrow { font-size: 11px; letter-spacing: 1px; margin-bottom: 20px; }
  [data-design="warm"] .hero h1 { font-size: clamp(35px, 10vw, 56px); line-height: 1.4; letter-spacing: -1.5px; }
  [data-design="warm"] .hero h1 > br { display: block; }
  [data-design="warm"] .hero-desc { font-size: 16px; margin-top: 19px; }
  [data-design="warm"] .hero-desc > br { display: block; }
  [data-design="warm"] .hero-actions { gap: 12px 18px; margin-top: 24px; }
  [data-design="warm"] .hero-media { height: auto; aspect-ratio: 1.03; border-radius: 85px 85px 12px 12px; margin-top: 0; }
  [data-design="warm"] .image-topline { left: 36px; right: 36px; top: 26px; }
  [data-design="warm"] .image-label { left: 14px; right: 14px; bottom: 37px; width: auto; padding: 14px 12px; border-radius: 10px; text-align: left; }
  [data-design="warm"] .hero-foot { padding-block: 20px 25px; }
  [data-design="warm"] .section h2 { font-size: 30px; line-height: 1.5; }
  [data-design="warm"] .about-body .lead { font-size: 21px; }
  [data-design="warm"] .advantages-wrap, [data-design="warm"] .cooperation-wrap, [data-design="warm"] .contact-wrap { border-radius: 28px 28px 0 0; }
  [data-design="warm"] .advantages-grid { gap: 16px; }
  [data-design="warm"] .advantages-grid article { padding: 25px 21px; border-radius: 18px; grid-template-columns: 31px 1fr; gap: 0 15px; }
  [data-design="warm"] .advantages-grid h3 { font-size: 17px; }
  [data-design="warm"] .solution-tabs { gap: 8px; }
  [data-design="warm"] .solution-tabs button, [data-design="warm"] .solution-tabs button + button { padding: 10px 16px; gap: 8px; width: 50%; font-size: 15px; }
  [data-design="warm"] .solution-panel { gap: 28px; }
  [data-design="warm"] .product-stage, [data-design="warm"] .medical-stage { border-radius: 90px 90px 18px 18px; }
  [data-design="warm"] .stage-caption { top: 27px; font-size: 10px; }
  [data-design="warm"] .solution-copy h3 { font-size: 29px; }
  [data-design="warm"] .scene-display { border-radius: 18px; }
  [data-design="warm"] .scene-overlay h3 { font-size: 31px; }
  [data-design="warm"] .cooperation-wrap h2 { font-size: 29px; }
  [data-design="warm"] .cooperation-wrap h2 > span { font-size: 23px; }
  [data-design="warm"] .mode-card { border-radius: 18px; }
  [data-design="warm"] .contact h2 { font-size: 35px; }
  [data-design="warm"] .dialog { border-radius: 20px; }
}

@media (max-width: 360px) {
  [data-design="tech"] .facts strong { font-size: 25px; }
  [data-design="tech"] .facts .fact-word { font-size: 15px; }
  [data-design="tech"] .facts > div + div { padding-left: 8px; }
  [data-design="warm"] .hero h1 { font-size: 34px; }
  [data-design="warm"] .header-contact { padding-inline: 10px; }
  [data-design="warm"] .section h2 { font-size: 27px; }
  [data-design="warm"] .cooperation-wrap h2 { font-size: 25px; }
  [data-design="warm"] .cooperation-wrap h2 > span { font-size: 21px; }
  [data-design="warm"] .solution-tabs button, [data-design="warm"] .solution-tabs button + button { padding-inline: 12px; }
}