:root {
  color-scheme: light;
  --ink: #082d3e;
  --text: #314654;
  --teal: #0c5359;
  --deep: #073b46;
  --mint: #d6f5f2;
  --paper: #fff;
  --ice: #edf5f7;
  --line: #cedce2;
  --edge: clamp(20px, 3.15vw, 48px);
  --wrap: 1260px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html:has(dialog[open]) { overflow: hidden; }
body { margin: 0; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; }
button, input, select { font: inherit; }
button { color: inherit; cursor: pointer; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #087f82; outline-offset: 4px; }
section[id] { scroll-margin-top: 26px; }

.wrap { width: min(calc(100% - 2 * var(--edge)), var(--wrap)); margin-inline: auto; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon {
  width: 24px; height: 24px; flex: none; display: inline-block; vertical-align: middle;
  fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.skip-link {
  position: fixed; z-index: 20; top: 12px; left: var(--edge); transform: translateY(-200%);
  padding: 12px 16px; background: var(--deep); color: white; border-radius: 8px;
}
.skip-link:focus { transform: translateY(0); }

.site-header { position: relative; z-index: 3; border-bottom: 1px solid #e1e9ed; background: #fff; }
.header-inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand {
  display: inline-flex; align-items: center; gap: 9px; flex: none;
  color: var(--ink); text-decoration: none; line-height: 1; font-size: 2.56rem; font-weight: 780; letter-spacing: -.067em;
}
.brand img { flex: none; }
.site-nav { display: flex; align-items: center; gap: clamp(20px, 3.5vw, 46px); }
.site-nav > a, .nav-button {
  font-size: 1.03rem; font-weight: 590; color: var(--ink); text-decoration: none; white-space: nowrap;
}
.site-nav > a:hover, .nav-button:hover { color: #0c6971; }
.nav-button { border: 0; padding: 10px 0; background: transparent; }
.icon-button {
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line);
  border-radius: 11px; background: #fff; color: var(--ink);
}
.icon-button:hover { background: var(--ice); }
.menu-toggle { display: none; }

.button {
  min-height: 50px; padding: 12px 20px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border: 1px solid transparent; border-radius: 10px; font-size: 1.03rem; line-height: 1.25; font-weight: 680;
  text-align: center; text-decoration: none; transition: background-color .16s, box-shadow .16s, border-color .16s;
}
.button .icon { width: 19px; height: 19px; }
.button-primary { color: #fff; background: var(--deep); box-shadow: 0 3px 8px #073b4616; }
.button-primary:hover { background: #105762; }
.header-cta { min-height: 43px; padding: 9px 17px; white-space: nowrap; }
.button-light { background: white; color: var(--deep); }
.button-light:hover { background: #e8faf9; }
.text-link {
  min-height: 44px; display: inline-flex; align-items: center; justify-content: flex-start; gap: 9px;
  background: transparent; color: var(--deep); border: 0; padding: 0; border-radius: 4px;
  font-size: 1rem; line-height: 1.35; text-decoration: none; text-align: left; font-weight: 670;
}
.text-link:hover { color: #08787e; text-decoration: underline; text-underline-offset: .2em; }
.text-link .icon { width: 19px; height: 19px; }

.hero {
  display: grid; grid-template-columns: minmax(0, .73fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 3.2vw, 48px);
  padding-block: clamp(60px, 6.6vw, 98px) clamp(60px, 6.5vw, 92px);
}
.hero-copy { position: relative; z-index: 1; }
.eyebrow { color: var(--teal); font-size: .84rem; line-height: 1.3; letter-spacing: .086em; text-transform: uppercase; font-weight: 790; }
.hero h1 {
  margin-top: 24px; font-size: clamp(3rem, 5.6vw, 4.8rem); letter-spacing: -.062em; font-weight: 800; line-height: 1.02;
}
.hero h1 span { display: block; }
.hero-description { margin-top: 24px; color: var(--text); font-size: clamp(1.1rem, 1.78vw, 1.37rem); line-height: 1.43; max-width: 37ch; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; margin-top: 34px; }
.hero-actions .button { min-height: 54px; padding-inline: 21px; }

.devices { position: relative; min-width: 0; isolation: isolate; }
.device-halo {
  position: absolute; z-index: -1; inset: -52px -24px -58px -45px; pointer-events: none;
  background: radial-gradient(ellipse at 54% 50%, #85e0de9e 3%, #b7edf096 46%, #d8f8f54a 67%, transparent 79%);
  filter: blur(18px);
}
.desktop-device {
  overflow: hidden; border: 1px solid #d7e3e8; border-radius: 19px; background: #f8fafb;
  box-shadow: 0 4px 12px #133b4610, 0 16px 38px #15566125, inset 0 0 0 2px #fff;
}
.device-topbar {
  min-height: 51px; display: flex; align-items: center; gap: 15px; padding: 0 17px;
  background: #fffdfd; border-bottom: 1px solid #e6eef0;
}
.device-brand { font-size: 1.42rem; gap: 5px; }
.device-residence { display: flex; align-items: center; gap: 4px; font-size: .75rem; font-weight: 730; margin-left: 14px; white-space: nowrap; }
.device-residence .icon { width: 14px; height: 14px; }
.device-demo-tag {
  margin-left: auto; padding: 5px 8px; background: #e8f0f4; border-radius: 6px;
  color: #354a56; font-size: .58rem; line-height: 1.2; font-weight: 750; letter-spacing: .024em; text-transform: uppercase; text-align: center;
}
.device-tool { width: 17px; height: 17px; }
.device-layout { display: grid; grid-template-columns: minmax(117px, 23.5%) minmax(0, 1fr); min-height: 323px; }
.device-nav { padding: 19px 9px; border-right: 1px solid #e5eef1; background: linear-gradient(135deg, #f9fbfc, #edf5f7); }
.device-nav button, .portal-nav button {
  display: flex; align-items: center; width: 100%; gap: 8px; text-align: left;
  border: 0; background: transparent; border-radius: 7px;
}
.device-nav button { min-height: 33px; padding: 5px 7px; font-size: .7rem; line-height: 1.2; font-weight: 620; }
.device-nav button .icon { width: 16px; height: 16px; }
.device-nav button.is-current, .device-nav button:hover, .portal-nav button[aria-current], .portal-nav button:hover { background: var(--mint); }
.device-main { padding: 17px clamp(103px, 12.65vw, 165px) 17px 16px; }
.device-greeting {
  margin-bottom: 14px; font-size: clamp(1.28rem, 2.28vw, 1.84rem); letter-spacing: -.054em; font-weight: 800; line-height: 1.1;
  white-space: nowrap;
}
.device-record {
  display: flex; align-items: flex-start; gap: 11px; width: 100%; min-width: 0; padding: 10px 12px;
  border: 1px solid #e0e9ed; border-radius: 9px; background: #fff; text-align: left; box-shadow: 0 2px 3px #18394307;
}
.device-record + .device-record { margin-top: 9px; }
.device-record-link { align-items: center; }
.device-record-link:hover { background: #f3fcfc; border-color: #a9d8d8; }
.record-icon {
  display: inline-grid; place-items: center; width: 37px; height: 37px; flex: none;
  border-radius: 9px; background: #edf4f7; color: var(--deep);
}
.record-icon .icon { width: 21px; height: 21px; }
.record-icon.mint { background: #dff6f5; }
.record-caption { display: block; margin-bottom: 2px; color: #2c4553; font-size: .64rem; font-weight: 700; }
.device-record strong { display: block; font-size: .78rem; letter-spacing: -.022em; line-height: 1.2; font-weight: 760; }
.device-mini-cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; padding: 5px 9px; min-height: 28px;
  border: 0; border-radius: 6px; background: #c9f2f0; color: var(--ink); font-size: .67rem; font-weight: 730;
}
.device-mini-cta:hover { background: #a9e7e4; }
.device-mini-cta .icon, .record-chevron { width: 14px; height: 14px; }
.record-chevron { margin-left: auto; }
.device-tasks { align-items: flex-start; }
.device-task { display: flex; align-items: center; gap: 5px; margin-top: 4px; font-size: .67rem; font-weight: 600; }
.device-task .icon { width: 15px; height: 15px; }

.phone {
  position: absolute; z-index: 1; right: -8px; bottom: -16px; width: clamp(134px, 14.6vw, 177px); height: clamp(245px, 26.1vw, 310px);
  padding: 4px; border: 1px solid #9ba5aa; border-radius: 25px; background: #15242c; pointer-events: none;
  box-shadow: 0 13px 20px #082d3e3d, 0 2px 6px #142b3b44, inset 0 0 0 1px #65757d;
}
.phone-screen { position: relative; height: 100%; overflow: hidden; border-radius: 20px; background: linear-gradient(#fff 26%, #f0f6f8 26%); }
.phone-status { display: flex; align-items: center; justify-content: space-between; padding: 8px 11px 5px; font-size: .52rem; font-weight: 760; color: #18242c; }
.phone-status-icons { display: inline-flex; align-items: flex-end; gap: 1px; }
.phone-status-icons i { display: block; width: 2px; height: 3px; border-radius: 1px; background: #18242c; }
.phone-status-icons i:nth-child(2) { height: 4px; }
.phone-status-icons i:nth-child(3) { height: 5px; }
.phone-status-icons i:nth-child(4) { height: 6px; }
.phone-status-icons b { width: 9px; height: 5px; margin: 0 0 1px 3px; border-radius: 2px; background: #18242c; }
.phone-top { min-height: 35px; display: flex; align-items: center; justify-content: space-between; padding: 0 9px; border-bottom: 1px solid #e4edf0; background: white; }
.phone-top > .icon { width: 14px; height: 14px; }
.phone-brand { gap: 4px; font-size: 1.04rem; }
.phone-content { padding: 10px 7px; }
.phone-content > p { margin: 1px 2px 11px; font-size: .96rem; font-weight: 780; letter-spacing: -.045em; }
.phone-record {
  display: flex; align-items: center; gap: 6px; min-height: 42px; padding: 5px;
  border: 1px solid #e0e9ed; border-radius: 7px; background: #fff; box-shadow: 0 2px 3px #18394308;
}
.phone-record + .phone-record { margin-top: 7px; }
.phone-record .record-icon { width: 24px; height: 26px; border-radius: 5px; }
.phone-record .record-icon .icon { width: 15px; height: 15px; }
.phone-record strong, .phone-record small { display: block; line-height: 1.2; }
.phone-record strong { font-size: .58rem; font-weight: 750; }
.phone-record small { font-size: .51rem; font-weight: 680; margin-bottom: 3px; }
.phone-record .record-chevron { width: 11px; height: 11px; }
.phone-home { position: absolute; bottom: 6px; left: 32%; right: 32%; height: 3px; background: #24333b; border-radius: 6px; }

.pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #b8cbd4; padding-block: 31px 40px; }
.pillar { padding-inline: clamp(16px, 3.4vw, 44px); }
.pillar:first-child { padding-left: 2px; }
.pillar:last-child { padding-right: 0; }
.pillar + .pillar { border-left: 1px solid #c8d6dd; }
.pillar-icon { width: 43px; height: 43px; margin-bottom: 9px; color: var(--deep); stroke-width: 1.45; }
.pillar h2 { font-size: clamp(1.41rem, 2.42vw, 2rem); letter-spacing: -.048em; font-weight: 790; line-height: 1.14; }
.pillar p { margin-top: 7px; color: var(--text); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.4; max-width: 29ch; }

.features { padding-block: 40px 36px; background: linear-gradient(150deg, #f0f6f8, #eaf3f6); }
.section-title {
  margin-bottom: 26px; text-align: center; font-size: clamp(1.95rem, 3.4vw, 2.75rem);
  letter-spacing: -.051em; line-height: 1.15; font-weight: 800;
}
.feature-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr); align-items: start; gap: clamp(28px, 4.2vw, 56px); }
.residence-photo { width: 100%; height: auto; border-radius: 16px; background: #d9e6e9; }
.feature-list { align-self: center; }
.feature-list details { border-bottom: 1px solid #c1d1d9; }
.feature-list details:last-child { border-bottom: 0; }
.feature-list summary {
  min-height: 49px; display: grid; grid-template-columns: 31px minmax(0, 1fr) 18px; align-items: center; gap: 13px;
  list-style: none; cursor: pointer; padding: 8px 7px 8px 6px; border-radius: 6px;
  font-size: clamp(1rem, 1.55vw, 1.25rem); font-weight: 730; line-height: 1.2; letter-spacing: -.025em;
}
summary::-webkit-details-marker { display: none; }
.feature-list summary:hover { background: #ffffff91; }
.feature-list summary > .icon { color: var(--deep); width: 27px; height: 27px; }
.feature-list summary .feature-chevron { width: 17px; height: 17px; color: #426778; transition: transform .16s; }
.feature-list details[open] .feature-chevron { transform: rotate(180deg); }
.feature-detail { padding: 0 12px 10px 50px; color: var(--text); line-height: 1.5; }
.feature-detail p { font-size: .98rem; }
.feature-detail .text-link { font-size: .94rem; }
.contact-band { background: linear-gradient(105deg, #0d4651 0%, #073741 100%); color: white; }
.contact-inner { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding-block: 31px; }
.contact-inner h2 { font-size: clamp(1.55rem, 2.75vw, 2.35rem); font-weight: 750; letter-spacing: -.043em; line-height: 1.17; }
.contact-inner .button { flex: none; min-height: 51px; padding-inline: clamp(15px, 2.5vw, 32px); }
.site-footer { background: #fff; }
.footer-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; padding-block: 15px; }
.footer-identity { display: flex; align-items: center; gap: 22px; }
.footer-brand { font-size: 2rem; gap: 7px; }
.footer-domain { border-left: 1px solid #aabfc9; padding-left: 22px; font-weight: 570; }
.footer-inner > p { color: var(--text); font-size: .9rem; }

.modal {
  max-width: calc(100% - 32px); max-height: min(88vh, 760px); max-height: min(88dvh, 760px);
  padding: 0; border: 1px solid #c8d9e1; border-radius: 17px;
  background: #fff; color: var(--ink); box-shadow: 0 25px 90px #061e3090; overflow: auto;
}
.modal::backdrop { background: #072a3a9c; backdrop-filter: blur(4px); }
.modal-header {
  position: sticky; z-index: 2; top: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 17px 22px; border-bottom: 1px solid #dde9ed; background: white;
}
.modal-heading { display: flex; align-items: center; gap: 12px; }
.modal-heading img { flex: none; }
.modal-heading .eyebrow { font-size: .66rem; }
.modal-heading h2 { margin-top: 2px; font-size: clamp(1.23rem, 3.1vw, 1.59rem); letter-spacing: -.038em; line-height: 1.12; }
.close-button { flex: none; }
.close-button .icon { width: 22px; height: 22px; }
.small-modal { width: 515px; }
.modal-content { padding: 22px; color: var(--text); line-height: 1.53; }
.modal-content > .button { margin-top: 20px; }
.form-note { margin-bottom: 17px; }
.request-form { display: grid; gap: 7px; }
.request-form label, .portal-select-wrap label { font-weight: 680; color: var(--ink); font-size: .94rem; }
.optional { font-weight: 480; color: #4d6270; }
.request-form input, .request-form select, .portal-select-wrap select {
  width: 100%; min-height: 44px; border: 1px solid #aebfc9; border-radius: 8px; padding: 7px 10px; background: #fff; color: var(--ink);
}
.request-form input, .request-form select { margin-bottom: 6px; }
.request-form .button { justify-self: start; margin-top: 5px; }
.request-success { display: flex; gap: 12px; padding: 18px; border-radius: 11px; background: #edf9f8; }
.request-success h3 { color: var(--ink); font-size: 1.15rem; line-height: 1.3; }
.request-success p { margin-top: 4px; }

.portal-dialog { width: 910px; }
.portal-layout { display: grid; grid-template-columns: 205px minmax(0, 1fr); background: #f5f9fb; min-height: 416px; }
.portal-nav { padding: 17px 11px; border-right: 1px solid #dce9ee; background: #f0f6f8; }
.portal-nav button { min-height: 44px; padding: 8px 9px; font-size: .92rem; font-weight: 650; }
.portal-nav button .icon { width: 19px; height: 19px; }
.portal-select-wrap { display: none; }
.portal-main { padding: 23px; }
.portal-main h2 { font-size: clamp(1.4rem, 3.5vw, 1.93rem); font-weight: 790; line-height: 1.13; letter-spacing: -.045em; }
.portal-intro { margin: 6px 0 17px; color: var(--text); line-height: 1.45; }
.portal-cards { display: grid; gap: 10px; }
.portal-card, .portal-record {
  padding: 14px; border: 1px solid #dbe7ec; border-radius: 10px;
  background: #fff; box-shadow: 0 2px 3px #122f3f05; color: var(--ink);
}
.portal-card h3 { font-size: 1.02rem; line-height: 1.3; }
.portal-card p { color: var(--text); line-height: 1.5; }
.portal-card h3 + p { margin-top: 6px; }
.portal-record { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; }
button.portal-record:hover { background: #effbfa; border-color: #9dcecf; }
.portal-record strong, .portal-record small { display: block; }
.portal-record small { margin-bottom: 3px; color: #4c6672; font-size: .77rem; font-weight: 670; line-height: 1.25; }
.portal-record strong { font-size: .98rem; line-height: 1.25; }
.portal-record .record-chevron { width: 19px; height: 19px; }
.portal-label {
  display: inline-block; margin-bottom: 7px; padding: 3px 7px; border-radius: 5px;
  background: #e5f4f4; color: #205b63; font-size: .75rem; font-weight: 730;
}
.portal-note { margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: #eaf5f7; color: var(--text); line-height: 1.42; }
.portal-details { margin-top: 8px; }
.portal-details summary { cursor: pointer; min-height: 36px; padding: 7px 0; color: var(--teal); font-weight: 690; }
.portal-details :is(ol, ul) { margin: 4px 0 5px; padding-left: 23px; color: var(--text); line-height: 1.52; }
.message-thread { margin-top: 12px; display: grid; gap: 9px; }
.message-thread article { border-left: 3px solid #a9dada; padding: 7px 10px; background: #f2f8fa; border-radius: 0 7px 7px 0; }
.message-thread article p { font-size: .94rem; margin-top: 3px; }
.portal-poll fieldset { border: 0; margin: 0; padding: 0; }
.portal-poll legend { margin-bottom: 8px; font-weight: 720; }
.poll-option { display: flex; align-items: center; gap: 9px; min-height: 44px; cursor: pointer; }
.poll-option input, .task-check input { width: 18px; height: 18px; accent-color: var(--teal); }
.portal-poll .button { margin-top: 9px; min-height: 43px; }
.task-check { display: flex; align-items: center; gap: 9px; min-height: 44px; margin-top: 5px; cursor: pointer; }
.portal-footer {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 3px 22px; border-top: 1px solid #dce9ee; color: #4c6370; font-size: .85rem;
}
.portal-footer .text-link { font-size: .9rem; }

@media (max-width: 1120px) and (min-width: 941px) {
  .hero-actions { gap: 7px 13px; }
  .hero-actions .button { padding-inline: 15px; }
  .hero-actions .text-link { font-size: .94rem; }
  .device-residence { margin-left: 0; }
  .device-topbar { gap: 9px; padding-inline: 11px; }
  .device-main { padding-right: clamp(88px, 11vw, 120px); }
}

@media (max-width: 940px) {
  .hero { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-block: 48px 56px; }
  .hero h1 { font-size: clamp(3.3rem, 8.5vw, 4.6rem); }
  .hero-description { max-width: 47ch; }
  .hero-actions { margin-top: 24px; }
  .devices { width: min(100%, 685px); }
  .device-main { padding-right: clamp(115px, 18vw, 155px); }
  .device-greeting { font-size: clamp(1.47rem, 3.5vw, 1.9rem); }
  .phone { width: clamp(140px, 20vw, 174px); height: clamp(247px, 36vw, 300px); right: -3px; }
  .device-halo { inset: -34px -12px -36px -16px; }
}

@media (max-width: 780px) {
  .header-inner { min-height: 65px; }
  .header-inner > .brand { font-size: 2.19rem; }
  .header-inner > .brand img { width: 34px; height: 34px; }
  .menu-toggle { display: grid; }
  .site-nav {
    position: absolute; top: 100%; left: 0; right: 0; display: none; align-items: stretch; gap: 2px;
    padding: 10px var(--edge) 17px; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 14px 22px #082d3e16;
  }
  .site-nav.is-open { display: grid; }
  .site-nav > a, .site-nav > .nav-button { min-height: 44px; display: flex; align-items: center; text-align: left; padding: 8px 0; }
  .header-cta { justify-self: start; margin-top: 3px; }
  .feature-layout { grid-template-columns: 1fr; gap: 18px; }
  .residence-photo { max-height: 340px; object-fit: cover; }
  .section-title { text-align: left; margin-bottom: 20px; }
  .contact-inner { align-items: flex-start; flex-direction: column; padding-block: 25px; gap: 17px; }
  .footer-inner { flex-wrap: wrap; min-height: 0; padding-block: 20px; }
}

@media (max-width: 580px) {
  .hero { padding-block: 39px 37px; gap: 30px; }
  .hero .eyebrow { font-size: .73rem; }
  .hero h1 { margin-top: 15px; font-size: clamp(2.18rem, 10.8vw, 3.66rem); }
  .hero-description { margin-top: 16px; }
  .hero-actions { margin-top: 21px; gap: 3px 15px; }
  .hero-actions .button { min-height: 49px; padding-inline: 15px; }
  .device-halo { inset: -18px -11px -22px -11px; filter: blur(10px); }
  .desktop-device { border-radius: 15px; }
  .device-topbar { gap: 8px; min-height: 43px; padding-inline: 10px; }
  .device-brand { font-size: 1.12rem; gap: 4px; }
  .device-brand img { width: 19px; height: 19px; }
  .device-residence { margin-left: 0; font-size: .69rem; }
  .device-demo-tag { font-size: .49rem; padding: 4px; max-width: 85px; }
  .device-tool, .device-nav, .phone { display: none; }
  .device-layout { display: block; min-height: 0; }
  .device-main { padding: 13px; }
  .device-greeting { margin-bottom: 11px; }
  .device-record { padding: 8px 10px; }
  .device-record strong { font-size: .84rem; }
  .device-mini-cta { min-height: 33px; }
  .pillars { grid-template-columns: 1fr; padding-block: 2px 12px; }
  .pillar, .pillar:first-child, .pillar:last-child { display: flex; align-items: flex-start; gap: 13px; padding: 17px 0; }
  .pillar + .pillar { border-left: 0; border-top: 1px solid #dbe5e9; }
  .pillar-icon { width: 32px; height: 32px; margin-bottom: 0; }
  .pillar p { max-width: none; margin-top: 5px; }
  .features { padding-block: 27px 21px; }
  .feature-list summary { min-height: 51px; gap: 9px; }
  .feature-detail { padding-left: 46px; }
  .footer-brand { font-size: 1.75rem; }
  .footer-brand img { width: 28px; height: 28px; }
  .footer-domain { padding-left: 13px; }
  .footer-identity { gap: 13px; }
  .modal { max-width: calc(100% - 20px); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
  .modal-header { padding: 12px 13px; }
  .modal-heading { gap: 8px; }
  .modal-heading img { width: 29px; height: 29px; }
  .modal-content, .portal-main { padding: 15px; }
  .portal-layout { grid-template-columns: 1fr; min-height: 0; }
  .portal-nav { display: none; }
  .portal-select-wrap { display: grid; gap: 5px; padding: 12px 15px 0; }
  .portal-footer { padding-inline: 15px; }
}

@media (max-width: 360px) {
  .device-demo-tag { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* Compact language control; the original visual design remains unchanged. */
.language-switcher { display: inline-flex; flex: none; align-items: center; gap: 2px; margin-left: auto; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.language-switcher button { border: 0; border-radius: 6px; min-width: 33px; min-height: 36px; padding: 6px; background: transparent; color: var(--text); font-size: .75rem; font-weight: 680; }
.language-switcher button:hover { background: var(--ice); }
.language-switcher button[aria-pressed="true"] { background: var(--deep); color: #fff; }
@media (min-width: 1001px) { .language-switcher { order: 3; } .site-nav { margin-left: auto; gap: clamp(16px, 2.4vw, 34px); } .header-inner { gap: 18px; } }
@media (max-width: 1000px) {
  .header-inner { gap: 10px; }
  .language-switcher button { min-height: 38px; }
  .menu-toggle { display: grid; }
  .site-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; align-items: stretch; gap: 2px; padding: 10px var(--edge) 17px; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 14px 22px #082d3e16; }
  .site-nav.is-open { display: grid; }
  .site-nav > a, .site-nav > .nav-button { min-height: 44px; display: flex; align-items: center; text-align: left; padding: 8px 0; }
  .header-cta { justify-self: start; margin-top: 3px; }
}
@media (max-width: 360px) { .header-inner > .brand { font-size: 1.8rem; gap: 6px; } .header-inner > .brand img { width: 28px; height: 28px; } .language-switcher button { min-width: 29px; padding-inline: 4px; } }