:root {
  --ivory: #fff8ec;
  --ivory-deep: #f5ead8;
  --paper: #fffdf8;
  --ink: #192136;
  --muted: #687081;
  --line: #ddd8cd;
  --warm: #f36f4e;
  --warm-dark: #c84b31;
  --warm-soft: #ffd7c4;
  --orange: #f7a444;
  --cobalt: #2056d8;
  --cobalt-dark: #153a9b;
  --sky: #83cdf5;
  --sky-soft: #dff3ff;
  --radius: 28px;
  --shadow: 0 22px 60px rgba(37, 45, 66, .1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font-family: "Manrope", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
img { max-width: 100%; }
section { scroll-margin-top: 90px; }
.skip-link {
  position: fixed;
  z-index: 100;
  left: 16px;
  top: 12px;
  transform: translateY(-150%);
  background: var(--ink);
  color: white;
  padding: 10px 16px;
  border-radius: 10px;
}
.skip-link:focus { transform: none; }

.site-header {
  position: sticky;
  z-index: 50;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 78px;
  padding: 12px clamp(20px, 4vw, 66px);
  background: rgba(255, 248, 236, .92);
  border-bottom: 1px solid rgba(25, 33, 54, .1);
  backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: 13px; text-decoration: none; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.1; }
.brand-copy strong { font: 700 15px/1 "Onest", sans-serif; letter-spacing: -.02em; }
.brand-copy small, .footer-brand small { margin-top: 5px; font-size: 10px; color: var(--muted); letter-spacing: .08em; }
.brand-orbit { position: relative; width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; background: var(--warm); overflow: hidden; }
.brand-orbit i { position: absolute; width: 31px; height: 31px; border: 4px solid var(--sky-soft); border-radius: 50%; }
.brand-orbit i:first-child { left: -13px; top: 5px; }
.brand-orbit i:nth-child(2) { right: -13px; bottom: 5px; }
.brand-orbit b { position: absolute; inset: 17px; background: var(--cobalt); border-radius: 50%; }
.brand-orbit.small { width: 38px; height: 38px; flex-basis: 38px; }
.desktop-nav { display: flex; gap: clamp(16px, 2.2vw, 34px); }
.desktop-nav a, .footer-links a {
  position: relative;
  color: #474f60;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.desktop-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -8px;
  height: 2px;
  background: var(--warm);
  transition: right .2s;
}
.desktop-nav a:hover::after, .desktop-nav a.active::after { right: 0; }
.desktop-nav a.active { color: var(--ink); }
.header-actions { display: flex; align-items: center; gap: 14px; }
.lang-switch { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 99px; background: var(--paper); }
.lang-btn { width: 38px; height: 30px; border: 0; border-radius: 99px; background: none; color: var(--muted); font-size: 11px; font-weight: 800; cursor: pointer; }
.lang-btn.active { background: var(--cobalt); color: white; }
.menu-toggle { display: none; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); cursor: pointer; }
.menu-toggle span { display: block; width: 17px; height: 2px; margin: 4px auto; background: var(--ink); transition: transform .2s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
.mobile-menu {
  position: fixed;
  z-index: 49;
  inset: 78px 0 auto;
  flex-direction: column;
  padding: 18px 24px 28px;
  background: var(--ivory);
  border-bottom: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.mobile-menu:not([hidden]) { display: flex; }
.mobile-menu a { padding: 13px 0; border-bottom: 1px solid var(--line); font-weight: 700; text-decoration: none; }

.section { padding: clamp(74px, 9vw, 140px) clamp(20px, 6vw, 96px); }
.section-head { max-width: 900px; margin-bottom: clamp(34px, 5vw, 66px); }
.section-head h2, .flow-copy h2, .supply-copy h2, .builder h2, .contact h2 {
  max-width: 820px;
  margin: 14px 0 18px;
  font: 600 clamp(36px, 5.4vw, 76px)/1.02 "Onest", sans-serif;
  letter-spacing: -.055em;
}
.section-head > p:last-child, .split-head > p, .flow-copy > p, .supply-copy > p { color: var(--muted); font-size: 17px; }
.split-head { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 60px; max-width: none; }
.split-head h2 { margin-bottom: 0; }
.split-head > p { margin: 0; padding-bottom: 5px; }
.section-kicker { display: flex; align-items: center; gap: 13px; margin: 0; color: var(--cobalt); font-size: 11px; letter-spacing: .09em; text-transform: uppercase; }
.section-kicker span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid currentColor; border-radius: 50%; }
.section-kicker.light { color: var(--sky-soft); }
.eyebrow { color: var(--warm-dark); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 22px;
  border: 0;
  border-radius: 99px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s;
}
.button:hover { transform: translateY(-2px); }
.button-warm { background: var(--warm); color: #fff; box-shadow: 0 10px 28px rgba(243, 111, 78, .25); }
.button-cool { background: var(--cobalt); color: white; box-shadow: 0 10px 28px rgba(32, 86, 216, .22); }
.button-light { background: var(--paper); color: var(--ink); }

.hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(440px, .88fr);
  min-height: calc(100vh - 78px);
  padding: clamp(48px, 7vw, 100px) clamp(20px, 6vw, 96px) 88px;
  overflow: hidden;
}
.hero::before {
  content: "";
  position: absolute;
  width: 580px;
  height: 580px;
  left: -330px;
  top: -270px;
  border: 78px solid rgba(243, 111, 78, .08);
  border-radius: 50%;
}
.hero-copy { position: relative; z-index: 2; align-self: center; max-width: 760px; }
.hero h1 { margin: 17px 0 25px; font: 600 clamp(48px, 6.6vw, 102px)/.94 "Onest", sans-serif; letter-spacing: -.065em; }
.hero-lead { max-width: 680px; color: #596172; font-size: clamp(17px, 1.5vw, 21px); }
.hero-actions { display: flex; align-items: center; gap: 26px; margin-top: 32px; }
.mail-link { color: var(--cobalt-dark); font-size: 15px; font-weight: 800; text-underline-offset: 5px; }
.scope-note { max-width: 620px; margin-top: 26px; padding-left: 15px; border-left: 3px solid var(--warm-soft); color: var(--muted); font-size: 12px; }
.climate-room { position: relative; align-self: center; min-height: 610px; }
.room-shell {
  position: absolute;
  inset: 25px 0 70px 35px;
  border-radius: 46% 46% 26px 26px;
  background: linear-gradient(135deg, var(--sky-soft), #c8e8ff 52%, #fff0dd 52.5%, var(--warm-soft));
  box-shadow: var(--shadow);
  overflow: hidden;
}
.room-shell::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 34%;
  background: linear-gradient(165deg, rgba(255,255,255,.35), rgba(191,101,72,.12));
  clip-path: polygon(0 44%, 100% 0, 100% 100%, 0 100%);
}
.window { position: absolute; width: 42%; height: 32%; top: 17%; left: 13%; border: 8px solid var(--paper); background: #9ad7f8; box-shadow: 0 13px 30px rgba(32, 86, 216, .12); }
.window::before, .window::after { content: ""; position: absolute; background: var(--paper); }
.window::before { width: 5px; height: 100%; left: 50%; }
.window::after { width: 100%; height: 5px; top: 50%; }
.window i { position: absolute; width: 28px; height: 55px; bottom: 0; border-radius: 50% 50% 0 0; background: rgba(255,255,255,.2); }
.window i:first-child { left: 20%; }.window i:last-child { right: 12%; height: 75px; }
.sun-dot { position: absolute; width: 35px; height: 35px; right: 28%; top: 20%; border-radius: 50%; background: #ffd45f; box-shadow: 0 0 0 13px rgba(255, 212, 95, .2); }
.unit { position: absolute; z-index: 3; width: 30%; height: 11%; right: 9%; top: 34%; border-radius: 15px; background: var(--paper); box-shadow: 0 10px 22px rgba(31, 55, 95, .12); }
.unit::before { content: ""; position: absolute; left: 12%; right: 12%; bottom: 20%; height: 4px; border-radius: 9px; background: var(--sky); }
.unit span { position: absolute; width: 5px; height: 5px; right: 10%; top: 24%; border-radius: 50%; background: var(--cobalt); }
.radiator { position: absolute; z-index: 3; width: 35%; height: 24%; left: 10%; bottom: 16%; display: flex; gap: 5px; padding: 8px; border-radius: 14px; background: #f7f2e8; box-shadow: 0 9px 24px rgba(102, 64, 48, .12); }
.radiator i { flex: 1; border-radius: 8px; background: linear-gradient(90deg, #fff, #e8e0d5); }
.pipe { position: absolute; z-index: 2; border-radius: 99px; }
.pipe-hot { width: 46%; height: 9px; left: 36%; bottom: 11%; background: var(--warm); }
.pipe-hot::after { content: ""; position: absolute; width: 9px; height: 75px; right: 0; bottom: 0; background: var(--warm); }
.pipe-cold { width: 9px; height: 27%; right: 10%; bottom: 10%; background: var(--cobalt); }
.air-loop { position: absolute; border: 2px dashed rgba(32,86,216,.5); border-left-color: transparent; border-radius: 50%; }
.loop-one { width: 180px; height: 95px; right: 5%; top: 47%; transform: rotate(-18deg); }
.loop-two { width: 120px; height: 65px; right: 24%; top: 56%; transform: rotate(10deg); }
.plant { position: absolute; z-index: 3; width: 65px; height: 90px; right: 14%; bottom: 12%; border-radius: 50% 50% 13px 13px; background: #356d68; clip-path: polygon(48% 18%, 10% 0, 33% 43%, 0 31%, 40% 64%, 37% 100%, 69% 100%, 62% 62%, 100% 22%, 66% 39%, 72% 0); }
.comfort-card { position: absolute; z-index: 5; right: 5%; bottom: 6%; display: flex; flex-direction: column; min-width: 235px; padding: 18px 20px; border-radius: 20px; background: var(--ink); color: white; box-shadow: var(--shadow); }
.comfort-card span { color: var(--sky); font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.comfort-card b { margin-top: 7px; font: 600 23px/1 "Onest", sans-serif; }
.comfort-card small { margin-top: 7px; color: #cdd4e3; }
.temperature-scale { position: absolute; left: 25%; right: 11%; bottom: 28px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.temperature-scale i { height: 7px; border-radius: 99px; background: linear-gradient(90deg, var(--cobalt), var(--sky), #f7d169, var(--warm)); }
.hero-tabs { position: absolute; left: clamp(20px, 6vw, 96px); right: clamp(20px, 6vw, 96px); bottom: 22px; display: flex; gap: 11px; }
.hero-tabs span { padding: 7px 13px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; }

.comfort { background: var(--paper); }
.comfort-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.comfort-panel { min-height: 310px; padding: 26px; border-radius: var(--radius); }
.comfort-panel > span { display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; }
.comfort-panel h3 { margin: 65px 0 10px; font: 600 24px/1.08 "Onest", sans-serif; letter-spacing: -.035em; }
.comfort-panel p { margin: 0; font-size: 14px; }
.comfort-panel.warm { background: var(--warm-soft); color: #6f2f20; }
.comfort-panel.cool { background: var(--cobalt); color: white; }
.comfort-panel.water { background: var(--sky-soft); color: var(--cobalt-dark); }
.comfort-panel.neutral { background: var(--ivory-deep); color: #4f4a43; }

.systems { background: linear-gradient(180deg, var(--ivory), #fff3e3); }
.system-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.system-card { display: flex; flex-direction: column; min-height: 300px; padding: 24px; border: 1px solid var(--line); border-radius: 25px; background: rgba(255,255,255,.62); }
.system-card:hover { background: var(--paper); box-shadow: 0 15px 35px rgba(43, 53, 72, .08); transform: translateY(-3px); transition: .25s; }
.system-card .card-code { color: var(--cobalt); font-size: 12px; font-weight: 800; }
.card-code small { float: right; padding: 5px 8px; border-radius: 99px; background: var(--warm); color: white; font-size: 8px; }
.system-card h3 { margin: 60px 0 12px; font: 600 22px/1.1 "Onest", sans-serif; letter-spacing: -.035em; }
.system-card p { margin: 0 0 20px; color: var(--muted); font-size: 13px; }
.system-card a { margin-top: auto; color: var(--cobalt); font-size: 12px; font-weight: 800; text-underline-offset: 4px; }
.system-card.card-primary { background: var(--warm); color: white; border-color: var(--warm); }
.card-primary .card-code, .card-primary p, .card-primary a { color: white; }
.system-card.card-question { background: var(--ink); color: white; border-color: var(--ink); }
.card-question .card-code { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--sky); color: var(--cobalt-dark); }
.card-question p { color: #cdd4e3; }.card-question a { color: var(--sky); }

.flow-section { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(45px, 8vw, 120px); align-items: center; background: var(--paper); }
.flow-section.reverse { background: var(--ivory); }
.flow-section.reverse .flow-visual { order: 2; }
.flow-visual { position: relative; min-height: 520px; border-radius: 40px; overflow: hidden; }
.cool-flow { background: var(--sky-soft); }
.flow-line { position: absolute; background: var(--cobalt); border-radius: 99px; }
.main-line { left: 13%; right: 13%; top: 48%; height: 11px; }
.branch-one, .branch-two { width: 11px; height: 33%; top: 24%; }
.branch-one { left: 31%; }.branch-two { right: 26%; }
.flow-node { position: absolute; width: 58px; height: 58px; border: 12px solid var(--paper); border-radius: 50%; background: var(--cobalt); box-shadow: 0 8px 20px rgba(32,86,216,.18); }
.node-a { left: 10%; top: calc(48% - 23px); }.node-b { left: calc(31% - 23px); top: 17%; }.node-c { right: calc(26% - 23px); top: 46%; }
.flow-label { position: absolute; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--paper); color: var(--cobalt); font-size: 11px; font-weight: 800; }
.label-a { left: 8%; top: 33%; }.label-b { left: 37%; top: 13%; }.label-c { right: 16%; top: 59%; }
.flow-caption { position: absolute; left: 8%; bottom: 7%; display: flex; flex-direction: column; color: var(--cobalt-dark); }
.flow-caption b { font-size: 11px; letter-spacing: .1em; }.flow-caption span { margin-top: 5px; font-size: 11px; }
.flow-copy h2 { font-size: clamp(38px, 4.6vw, 68px); }
.check-list { margin: 28px 0 0; padding: 0; list-style: none; }
.check-list li { position: relative; padding: 13px 0 13px 33px; border-bottom: 1px solid var(--line); font-size: 14px; }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--cobalt); font-weight: 800; }
.warm-flow { background: #ffe5d1; }
.heat-core { position: absolute; width: 100px; height: 100px; left: calc(50% - 50px); top: calc(50% - 50px); border-radius: 50%; background: var(--warm); box-shadow: 0 0 0 18px rgba(243,111,78,.14); }
.heat-core::before, .heat-core::after { content: ""; position: absolute; inset: 32px 45px; border-radius: 99px; background: white; }
.heat-core::after { transform: rotate(90deg); }
.heat-ring { position: absolute; border: 3px solid var(--warm); border-radius: 50%; opacity: .45; }
.ring-a { inset: 19%; }.ring-b { inset: 8%; border-style: dashed; }
.room-chip { position: absolute; display: flex; flex-direction: column; min-width: 160px; padding: 15px; border-radius: 16px; background: var(--paper); box-shadow: 0 11px 26px rgba(123,64,43,.12); }
.room-chip b { color: var(--warm-dark); font-size: 10px; letter-spacing: .09em; }.room-chip span { font-size: 12px; }
.chip-a { left: 7%; top: 13%; }.chip-b { right: 7%; bottom: 11%; }
.data-pills { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.data-pills span { padding: 8px 13px; border-radius: 99px; background: var(--warm-soft); color: #783b2c; font-size: 11px; font-weight: 700; }

.air { background: var(--cobalt); color: white; }
.air .section-kicker { color: var(--sky); }
.air .section-head > p:last-child { color: #cbd6f2; }
.air-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; }
.air-map { position: relative; min-height: 530px; border: 1px solid rgba(255,255,255,.22); border-radius: 34px; background: rgba(255,255,255,.05); overflow: hidden; }
.air-room { position: absolute; display: grid; place-items: center; border: 2px solid var(--sky); border-radius: 22px; color: var(--sky); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.ar-one { left: 8%; top: 11%; width: 45%; height: 39%; }.ar-two { right: 8%; top: 19%; width: 34%; height: 54%; }.ar-three { left: 16%; bottom: 9%; width: 38%; height: 32%; }
.air-arrow { position: absolute; color: var(--warm-soft); font-style: normal; font-size: 60px; font-weight: 300; }
.aa-one { left: 45%; top: 44%; }.aa-two { left: 22%; top: 43%; }
.info-stack { display: flex; flex-direction: column; gap: 14px; }
.info-stack article { flex: 1; display: flex; align-items: flex-start; gap: 18px; padding: 25px; border-radius: 25px; background: var(--paper); color: var(--ink); }
.info-stack article > span { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 50%; background: var(--sky-soft); color: var(--cobalt); font-size: 10px; font-weight: 800; }
.info-stack h3 { margin: 4px 0 7px; font: 600 21px/1.1 "Onest", sans-serif; }.info-stack p { margin: 0; color: var(--muted); font-size: 13px; }

.other-install { background: var(--paper); }
.boundary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.boundary-grid article { min-height: 230px; padding: 34px; border-right: 1px solid var(--line); background: linear-gradient(150deg, #fff, #f9f4eb); }
.boundary-grid article:last-child { border-right: 0; }
.boundary-grid b { font: 600 24px/1.1 "Onest", sans-serif; }.boundary-grid p { color: var(--muted); font-size: 14px; }

.repair { padding-top: 30px; padding-bottom: 30px; background: var(--paper); }
.repair-band { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; padding: clamp(42px, 6vw, 82px); border-radius: 42px; background: var(--warm); color: white; }
.repair-band h2 { margin: 20px 0; font: 600 clamp(40px, 5vw, 70px)/1 "Onest", sans-serif; letter-spacing: -.055em; }
.repair-band > div:first-child > p:last-child { color: #ffe9df; }
.repair-steps { display: flex; flex-direction: column; }
.repair-steps article { display: grid; grid-template-columns: 46px 1fr; column-gap: 16px; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.3); }
.repair-steps span { grid-row: 1 / 3; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid white; border-radius: 50%; font-size: 10px; }
.repair-steps b { font: 600 20px/1.1 "Onest", sans-serif; }.repair-steps p { margin: 6px 0 0; color: #ffe9df; font-size: 13px; }

.machinery { background: var(--ivory); }
.comparison { display: grid; grid-template-columns: 1fr 140px 1fr; align-items: stretch; gap: 20px; }
.comparison article { position: relative; min-height: 390px; padding: 38px; border-radius: var(--radius); background: var(--paper); box-shadow: 0 12px 35px rgba(35,42,61,.06); }
.compare-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 50%; font-size: 34px; }
.repair-icon { background: var(--warm-soft); color: var(--warm-dark); }.install-icon { background: var(--sky-soft); color: var(--cobalt); }
.comparison h3 { max-width: 370px; margin: 75px 0 13px; font: 600 30px/1.06 "Onest", sans-serif; letter-spacing: -.04em; }
.comparison p { color: var(--muted); font-size: 14px; }.comparison article small { position: absolute; right: 25px; top: 25px; color: var(--cobalt); font-weight: 800; }
.compare-connector { display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--muted); }
.compare-connector i { width: 1px; flex: 1; background: var(--line); }.compare-connector span { padding: 12px 0; font-size: 9px; font-weight: 800; letter-spacing: .1em; writing-mode: vertical-rl; }

.supply { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; background: var(--sky-soft); }
.supply-copy { align-self: center; }.supply-copy h2 { font-size: clamp(40px, 5vw, 72px); }
.supply-list { border-top: 1px solid rgba(32,86,216,.24); }
.supply-list article { display: grid; grid-template-columns: 60px 1fr; gap: 12px; padding: 25px 0; border-bottom: 1px solid rgba(32,86,216,.24); }
.supply-list article > span { color: var(--cobalt); font-size: 11px; font-weight: 800; }
.supply-list b { font: 600 21px/1.1 "Onest", sans-serif; }.supply-list p { margin: 7px 0 0; color: #52657e; font-size: 13px; }

.object-data { background: var(--paper); }
.object-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.object-grid article { min-height: 230px; padding: 28px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.object-grid span { color: var(--warm); font-size: 11px; font-weight: 800; }.object-grid h3 { margin: 50px 0 10px; font: 600 24px/1.08 "Onest", sans-serif; }.object-grid p { color: var(--muted); font-size: 13px; }

.inputs { background: var(--ivory); }
.inputs-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; }
.folder-card { position: relative; margin-top: 22px; padding: 38px; border-radius: 0 28px 28px 28px; background: var(--warm-soft); }
.folder-tab { position: absolute; left: 0; top: -22px; width: 190px; height: 23px; padding-left: 18px; border-radius: 14px 22px 0 0; background: var(--warm-soft); color: var(--warm-dark); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.folder-card ul { margin: 0; padding: 0; list-style: none; }
.folder-card li { display: flex; align-items: center; gap: 18px; padding: 19px 0; border-bottom: 1px solid rgba(134,67,44,.18); }
.folder-card li:last-child { border: 0; }
.folder-card li span { display: grid; place-items: center; width: 43px; height: 32px; border-radius: 8px; background: var(--paper); color: var(--warm-dark); font-size: 9px; font-weight: 800; }
.folder-card li b { font-size: 14px; }
.input-notes { display: flex; flex-direction: column; justify-content: space-between; }
.input-notes article { padding: 23px 0; border-bottom: 1px solid var(--line); }
.input-notes h3 { margin: 0 0 8px; font: 600 21px/1.1 "Onest", sans-serif; }.input-notes p { margin: 0; color: var(--muted); font-size: 13px; }

.coordination { background: var(--ink); color: white; }
.coordination .section-kicker { color: var(--sky); }.coordination .split-head > p { color: #b9c1d1; }
.coord-map { position: relative; min-height: 540px; max-width: 1050px; margin: auto; }
.coord-node { position: absolute; z-index: 2; display: grid; place-items: center; width: 130px; height: 130px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; background: #252e45; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.coord-node.center { width: 180px; height: 180px; left: calc(50% - 90px); top: calc(50% - 90px); background: var(--paper); color: var(--ink); font-size: 14px; }
.n-water { left: 4%; top: 7%; color: var(--sky); }.n-heat { right: 4%; top: 7%; color: var(--warm-soft); }.n-air { left: 3%; bottom: 4%; color: var(--sky); }.n-power { right: 3%; bottom: 4%; color: #ffd65f; }.n-structure { left: calc(50% - 65px); bottom: -1%; color: #d7dbea; }
.coord-line { position: absolute; z-index: 1; width: 36%; height: 2px; left: 32%; top: 50%; background: rgba(255,255,255,.24); transform-origin: center; }
.cl-one { transform: rotate(25deg) translateX(-45%); }.cl-two { transform: rotate(-25deg) translateX(45%); }.cl-three { transform: rotate(-25deg) translateX(-45%); }.cl-four { transform: rotate(25deg) translateX(45%); }.cl-five { transform: rotate(90deg) translateX(24%); }

.process { background: var(--paper); }
.process-track { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; }
.process-track li { position: relative; padding: 0 28px 25px 0; }
.process-track li::before { content: ""; position: absolute; top: 21px; left: 42px; right: 0; height: 2px; background: var(--line); }
.process-track li:last-child::before { display: none; }
.process-track li > span { position: relative; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--cobalt); color: white; font-size: 10px; font-weight: 800; }
.process-track h3 { margin: 42px 0 10px; font: 600 22px/1.1 "Onest", sans-serif; }.process-track p { color: var(--muted); font-size: 13px; }

.use-cases { background: var(--ivory); }
.case-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.case-row article { min-height: 280px; padding: 25px; border-radius: 24px; background: var(--paper); }
.case-temp { display: block; width: 100%; height: 8px; border-radius: 99px; }
.warm-dot { background: linear-gradient(90deg, var(--warm), var(--orange)); }.blue-dot { background: linear-gradient(90deg, var(--cobalt), var(--sky)); }.sky-dot { background: linear-gradient(90deg, var(--sky), #ccefff); }.metal-dot { background: linear-gradient(90deg, #70798a, #d5d9df); }
.case-row h3 { margin: 65px 0 11px; font: 600 22px/1.1 "Onest", sans-serif; }.case-row p { color: var(--muted); font-size: 13px; }

.builder { display: grid; grid-template-columns: .72fr 1.28fr; column-gap: clamp(40px, 7vw, 100px); background: var(--cobalt); color: white; }
.builder-intro { align-self: start; position: sticky; top: 110px; }
.builder h2 { font-size: clamp(40px, 5vw, 72px); }
.builder-intro > p { color: #cfdbf5; }
.builder-progress { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-top: 35px; color: var(--sky); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.builder-progress div { height: 5px; border-radius: 99px; background: rgba(255,255,255,.2); overflow: hidden; }
.builder-progress i { display: block; width: 0; height: 100%; background: var(--warm-soft); transition: width .3s; }
.request-form { display: flex; flex-direction: column; gap: 16px; }
fieldset { margin: 0; padding: 24px; border: 1px solid rgba(255,255,255,.24); border-radius: 24px; }
legend { padding: 0 10px; color: var(--sky); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
legend span { margin-right: 10px; }
.choice-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
.choice-grid label, .checkboxes label { cursor: pointer; }
.choice-grid input, .checkboxes input { position: absolute; opacity: 0; }
.choice-grid label span { display: flex; align-items: center; min-height: 50px; padding: 10px 15px; border: 1px solid rgba(255,255,255,.22); border-radius: 13px; color: #e1e8f8; font-size: 12px; transition: .2s; }
.choice-grid input:checked + span { background: var(--warm); border-color: var(--warm); color: white; }
.form-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
select, input[type="text"], input[type="email"], textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: white;
  color: var(--ink);
  outline: none;
}
select { min-height: 52px; padding: 0 13px; }
textarea { resize: vertical; padding: 14px; }
select:focus, input:focus, textarea:focus { border-color: var(--sky); box-shadow: 0 0 0 3px rgba(131,205,245,.2); }
.condition-grid { display: grid; grid-template-columns: 1fr .78fr; gap: 18px; }
.checkboxes { display: flex; flex-direction: column; gap: 8px; }
.checkboxes label span { position: relative; display: block; padding: 8px 10px 8px 32px; color: #e1e8f8; font-size: 12px; }
.checkboxes label span::before { content: ""; position: absolute; left: 4px; top: 9px; width: 15px; height: 15px; border: 1px solid var(--sky); border-radius: 4px; }
.checkboxes input:checked + span::before { background: var(--warm); border-color: var(--warm); box-shadow: inset 0 0 0 3px var(--cobalt); }
.generate-button { justify-self: flex-start; margin-top: 6px; background: var(--warm); }
.summary-panel { grid-column: 1 / -1; margin-top: 45px; padding: clamp(28px, 4vw, 52px); border-radius: 30px; background: var(--ink); }
.summary-head { display: flex; justify-content: space-between; align-items: start; }
.summary-head span { color: var(--sky); font-size: 9px; font-weight: 800; letter-spacing: .12em; }.summary-head h3 { margin: 7px 0; font: 600 28px/1 "Onest", sans-serif; }
.close-summary { border: 0; background: none; color: white; font-size: 30px; cursor: pointer; }
#summary-output { padding: 25px 0; color: #edf2ff; white-space: pre-wrap; font: 400 14px/1.8 "Manrope", sans-serif; border-top: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); }
.summary-actions { display: flex; gap: 10px; margin-top: 22px; }.copy-status { min-height: 20px; color: var(--sky); font-size: 12px; }

.registry { background: var(--paper); }
.registry-status { display: flex; align-items: center; gap: 9px; justify-self: end; padding: 9px 13px; border-radius: 99px; background: #e4f6eb; color: #26754a; font-size: 10px; font-weight: 800; letter-spacing: .07em; }
.registry-status i { width: 8px; height: 8px; border-radius: 50%; background: #34a466; }
.registry-grid { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--line); }
.registry-grid div { padding: 23px 24px 23px 0; border-bottom: 1px solid var(--line); }
.registry-grid div:nth-child(odd) { border-right: 1px solid var(--line); }
.registry-grid div:nth-child(even) { padding-left: 24px; }
.registry-grid dt { margin-bottom: 8px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.registry-grid dd { margin: 0; font-size: 14px; font-weight: 600; }.registry-grid dd small { font-weight: 500; }

.faq { background: var(--ivory); }
.faq-list { max-width: 1000px; margin-left: auto; }
.faq-list details { border-top: 1px solid var(--line); }
.faq-list details:last-child { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; padding: 24px 55px 24px 0; font: 600 19px/1.3 "Onest", sans-serif; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 8px; top: 17px; display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; background: var(--paper); color: var(--cobalt); font-size: 24px; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 790px; margin: -4px 0 25px; color: var(--muted); font-size: 14px; }

.contact { display: grid; grid-template-columns: 1fr .8fr; gap: 80px; background: var(--ink); color: white; }
.contact h2 { font-size: clamp(40px, 5vw, 72px); }
.contact-email { display: inline-block; margin: 15px 0 22px; color: var(--sky); font: 600 clamp(25px, 3vw, 43px)/1 "Onest", sans-serif; text-underline-offset: 7px; }
.contact-main > p:last-child { max-width: 650px; color: #b9c1d1; font-size: 13px; }
.contact-form { padding: 30px; border-radius: 28px; background: #252e45; }
.contact-form label { display: block; margin-bottom: 15px; }
.contact-form label > span { display: block; margin-bottom: 6px; color: #d5dceb; font-size: 11px; font-weight: 700; }
.contact-form input { min-height: 48px; padding: 0 13px; }.contact-form textarea { min-height: 120px; }
.form-note { color: #9ca7bb; font-size: 10px; }

footer { display: grid; grid-template-columns: 1fr 1fr auto; gap: 40px; padding: 45px clamp(20px, 6vw, 96px) 25px; background: #111725; color: white; }
.footer-brand { display: flex; align-items: center; gap: 12px; }.footer-brand > div { display: flex; flex-direction: column; }.footer-brand strong { font: 600 14px/1 "Onest", sans-serif; }
.footer-address { display: flex; flex-direction: column; color: #9fa9ba; font-size: 11px; }.footer-address a { margin-top: 8px; color: var(--sky); font-weight: 700; }
.footer-links { display: flex; flex-direction: column; gap: 5px; }.footer-links a { color: #ced5e0; }
.footer-disclaimer { grid-column: 1 / -1; margin: 25px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); color: #818b9e; font-size: 10px; }

@media (max-width: 1100px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .hero { grid-template-columns: 1fr 420px; }
  .climate-room { min-height: 520px; }
  .comfort-grid, .case-row { grid-template-columns: 1fr 1fr; }
  .system-cards { grid-template-columns: repeat(3, 1fr); }
  .builder { grid-template-columns: 1fr; }
  .builder-intro { position: static; margin-bottom: 45px; }
  .contact { gap: 40px; }
}

@media (max-width: 800px) {
  .site-header { min-height: 70px; padding: 10px 18px; }
  .brand-copy strong { font-size: 12px; }.brand-copy small { display: none; }
  .lang-switch { display: none; }
  .mobile-menu { inset: 70px 0 auto; }
  .section { padding: 75px 20px; }
  .section-head h2, .flow-copy h2, .supply-copy h2, .builder h2, .contact h2 { font-size: 39px; }
  .split-head { grid-template-columns: 1fr; gap: 20px; }
  .hero { display: block; min-height: auto; padding: 64px 20px 75px; }
  .hero h1 { font-size: clamp(47px, 14vw, 70px); }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 17px; }
  .climate-room { min-height: 470px; margin-top: 35px; }
  .room-shell { inset: 15px 0 55px; }
  .hero-tabs { position: static; flex-wrap: wrap; margin-top: 15px; }
  .comfort-grid, .system-cards, .air-grid, .boundary-grid, .comparison, .supply, .object-grid, .inputs-layout, .contact { grid-template-columns: 1fr; }
  .comfort-panel { min-height: 240px; }.comfort-panel h3 { margin-top: 43px; }
  .system-card { min-height: 260px; }.system-card h3 { margin-top: 42px; }
  .flow-section, .flow-section.reverse { grid-template-columns: 1fr; }
  .flow-section.reverse .flow-visual { order: 0; }
  .flow-visual { min-height: 390px; }
  .boundary-grid article { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .repair-band { grid-template-columns: 1fr; gap: 25px; padding: 40px 24px; border-radius: 28px; }
  .comparison { gap: 15px; }.comparison article { min-height: 300px; }.comparison h3 { margin-top: 48px; }.compare-connector { display: none; }
  .supply { gap: 35px; }
  .object-grid { border-left: 0; }.object-grid article { min-height: auto; border-right: 0; }.object-grid h3 { margin-top: 28px; }
  .inputs-layout { gap: 30px; }
  .coord-map { min-height: 500px; transform: scale(.88); margin: -35px; }
  .coord-node { width: 98px; height: 98px; }.coord-node.center { width: 140px; height: 140px; left: calc(50% - 70px); top: calc(50% - 70px); }.n-structure { left: calc(50% - 49px); }
  .process-track { grid-template-columns: 1fr; }
  .process-track li { display: grid; grid-template-columns: 55px 1fr; padding: 0 0 24px; }
  .process-track li::before { left: 21px; top: 42px; bottom: 0; width: 2px; height: auto; }
  .process-track h3 { margin: 5px 0 7px; }.process-track p { margin: 0; }
  .form-columns, .condition-grid { grid-template-columns: 1fr; }
  .registry-grid { grid-template-columns: 1fr; }.registry-grid div:nth-child(odd) { border-right: 0; }.registry-grid div:nth-child(even) { padding-left: 0; }
  footer { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .brand-orbit { width: 36px; height: 36px; flex-basis: 36px; }
  .brand-copy strong { font-size: 10px; }
  .hero h1 { font-size: 46px; }
  .climate-room { min-height: 395px; margin-left: -10px; margin-right: -10px; }
  .room-shell { border-radius: 35% 35% 20px 20px; }
  .comfort-card { min-width: 190px; padding: 13px 15px; }.comfort-card b { font-size: 18px; }
  .comfort-grid, .case-row { grid-template-columns: 1fr; }
  .air-map { min-height: 390px; }
  .choice-grid { grid-template-columns: 1fr; }
  fieldset { padding: 18px; }
  .builder { padding-left: 16px; padding-right: 16px; }
  .coord-map { transform: scale(.72); margin: -75px; }
  .summary-actions { flex-direction: column; }
  .contact-form { padding: 22px; }
  .contact-email { font-size: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
