:root {
  font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color: #10213c;
  background: #fff;
  font-synthesis: none;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  font: inherit;
}
.container {
  width: min(1180px,calc(100% - 48px));
  margin: auto;
}
.skip {
  position: absolute;
  top: -80px;
  left: 12px;
  background: white;
  color: black;
  padding: 12px;
  z-index: 20;
}
.skip:focus {
  top: 8px;
}
.site-header {
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 10;
  border-bottom: 1px solid #e8edf4;
}
.nav {
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-weight: 800;
  font-size: 26px;
  letter-spacing: -1px;
  white-space: nowrap;
}
.brand-mark {
  display: grid;
  grid-template-columns: repeat(2,12px);
  gap: 3px;
}
.brand-mark i {
  width: 12px;
  height: 12px;
  background: #0861d9;
}
.brand-mark i:nth-child(2) {
  background: #66b8ff;
}
.brand-mark i:nth-child(3) {
  background: #102e65;
}
.main-nav {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  font-weight: 600;
}
.main-nav a:hover,.text-link:hover {
  color: #0063db;
}
.nav-contact {
  border: 1px solid #0861d9;
  color: #0756bc;
  padding: 10px 18px;
  border-radius: 6px;
}
.menu-toggle {
  display: none;
}
.hero {
  background: radial-gradient(ellipse at 75% 45%,#143d75 0%,#081a33 45%,#061120 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.hero-glow {
  position: absolute;
  width: 650px;
  height: 650px;
  right: -180px;
  top: -250px;
  border-radius: 50%;
  background: radial-gradient(circle,#0757c45c,transparent 70%);
  pointer-events: none;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 65px;
  align-items: center;
  min-height: 590px;
  padding-top: 72px;
  padding-bottom: 80px;
  position: relative;
}
.eyebrow {
  color: #73bcff;
  font-size: 12px;
  letter-spacing: .19em;
  font-weight: 800;
  margin: 0 0 20px;
}
.eyebrow.blue {
  color: #075ed1;
}
h1,h2,h3,p {
  margin-top: 0;
}
h1 {
  font-size: clamp(42px,4.7vw,68px);
  line-height: 1.06;
  letter-spacing: -.055em;
  margin-bottom: 24px;
}
h1 span {
  color: #74b8ff;
}
.hero-lead {
  font-size: 19px;
  line-height: 1.65;
  color: #cbd9e9;
  max-width: 570px;
}
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 30px 0 35px;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  padding: 15px 22px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 700;
  min-height: 49px;
  transition: transform .2s,background .2s;
}
.button:hover {
  transform: translateY(-2px);
}
.primary {
  background: #0867ec;
  color: white;
}
.primary:hover {
  background: #0056c8;
}
.outline {
  border: 1px solid #82a9d2;
  color: #fff;
}
.outline:hover {
  background: #ffffff14;
}
.hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  color: #b8cce3;
  font-size: 12px;
}
.hero-proof span:before {
  content: '✓';
  color: #78baff;
  margin-right: 7px;
}
.hero-visual {
  border: 1px solid #4e77a3;
  border-radius: 14px;
  background: linear-gradient(145deg,#122f54,#08182c);
  box-shadow: 0 28px 75px #0008;
  overflow: hidden;
  transform: perspective(900px) rotateY(-4deg);
}
.visual-top {
  height: 44px;
  background: #132b48;
  border-bottom: 1px solid #3a5a7c;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  font-size: 10px;
  letter-spacing: .15em;
  color: #a9c8e9;
}
.visual-dots {
  letter-spacing: 4px;
  color: #497aab;
}
.live-dot {
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background: #60cbba;
}
.visual-body {
  padding: 36px 24px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.flow-step {
  border: 1px solid #458cda;
  border-radius: 8px;
  background: linear-gradient(#1c63a9,#0c3974);
  color: #f5fbff;
  font-size: 12px;
  padding: 13px 17px;
  text-align: center;
  min-width: 130px;
}
.flow-step.focus {
  background: linear-gradient(#187be0,#0a4a99);
  font-weight: 700;
  min-width: 230px;
  box-shadow: 0 0 28px #1684ee44;
}
.flow-row {
  display: flex;
  gap: 16px;
}
.flow-line {
  height: 26px;
  width: 1px;
  background: #6c9bcb;
  position: relative;
}
.flow-line:after {
  content: '⌄';
  position: absolute;
  bottom: -7px;
  left: -4px;
  color: #a4cfff;
}
.visual-foot {
  border-top: 1px solid #254569;
  padding: 13px 18px;
  color: #8da9c9;
  font-size: 10px;
}
.section {
  padding: 94px 0;
}
.intro {
  text-align: center;
}
.section h2 {
  font-size: clamp(30px,3.1vw,44px);
  line-height: 1.17;
  letter-spacing: -.04em;
  margin-bottom: 20px;
}
.intro h2 span {
  color: #0867df;
}
.section-lead {
  max-width: 750px;
  margin: 0 auto 48px;
  font-size: 17px;
  line-height: 1.7;
  color: #53637a;
}
.feature-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  text-align: left;
  gap: 28px;
}
.feature {
  border-left: 1px solid #dfe7f1;
  padding-left: 22px;
}
.feature-icon {
  font-size: 35px;
  color: #0764dc;
  margin-bottom: 18px;
}
.feature h3,.value h3 {
  font-size: 17px;
  margin-bottom: 11px;
}
.feature p,.value p,.architecture p,.closing p {
  font-size: 15px;
  color: #596a80;
  line-height: 1.75;
}
.architecture {
  background: #f3f7fc;
}
.architecture-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 65px;
  align-items: center;
}
.architecture p {
  max-width: 470px;
}
.text-link {
  color: #005bcf;
  font-weight: 750;
  font-size: 14px;
  display: inline-block;
  margin-top: 14px;
}
.architecture-panel {
  background: #fff;
  border: 1px solid #d5e4f6;
  border-radius: 14px;
  padding: 35px 22px;
  display: grid;
  grid-template-columns: 1fr 1.25fr 1fr;
  gap: 13px;
  align-items: center;
  box-shadow: 0 12px 45px #15365a0d;
}
.arch-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.arch-column div {
  background: #f4f8fe;
  border: 1px solid #d6e4f5;
  padding: 16px 8px;
  text-align: center;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 650;
}
.arch-center {
  background: linear-gradient(145deg,#1269d0,#102e60);
  border-radius: 9px;
  color: white;
  padding: 26px 8px;
  text-align: center;
  font-size: 19px;
  font-weight: 800;
  box-shadow: 0 9px 23px #1269d040;
}
.arch-center small {
  display: block;
  font-size: 10px;
  font-weight: 400;
  margin-top: 7px;
  color: #d3e7ff;
}
.value-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 40px;
  margin-top: 48px;
}
.number {
  font-size: 12px;
  font-weight: 800;
  color: #0867df;
}
.value h3 {
  font-size: 22px;
  margin: 16px 0 9px;
}
.developer-section {
  background: linear-gradient(120deg,#07172c,#113b6e);
  color: white;
  padding: 85px 0;
}
.developer-grid {
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 55px;
  align-items: center;
}
.developer-section h2 {
  font-size: clamp(30px,3vw,43px);
  line-height: 1.15;
  letter-spacing: -.04em;
}
.developer-section p {
  color: #b9cce3;
  line-height: 1.7;
}
.developer-cards {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
}
.dev-card {
  border: 1px solid #4b7aab;
  border-radius: 9px;
  padding: 22px 17px;
  background: #ffffff08;
  min-height: 238px;
}
.dev-card[href]:hover {
  background: #ffffff13;
}
.dev-icon {
  color: #72bdff;
  font-size: 29px;
}
.dev-card h3 {
  font-size: 15px;
  margin: 16px 0 12px;
}
.dev-card p {
  font-size: 12px;
  line-height: 1.65;
}
.dev-link,.dev-pending {
  color: #77beff;
  font-size: 12px;
  font-weight: 700;
}
.dev-pending {
  color: #a9bad0;
}
.closing-inner {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: center;
}
.closing p {
  max-width: 650px;
}
.footer {
  background: #071324;
  color: #d1deec;
  padding: 45px 0;
}
.footer-inner {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}
.footer .brand {
  font-size: 21px;
  color: white;
}
.footer p {
  font-size: 12px;
  margin: 0;
  flex: 1;
}
.footer-inner>div {
  display: flex;
  gap: 22px;
  font-size: 12px;
}
.footer small {
  font-size: 11px;
  color: #90a3ba;
  width: 100%;
}
:focus-visible {
  outline: 3px solid #5db3ff;
  outline-offset: 4px;
}
section[id],div[id] {
  scroll-margin-top: 90px;
}
@media(max-width:1050px) {
  .main-nav {
    gap: 16px;
  }
  .hero-grid {
    gap: 30px;
  }
  .hero-visual {
    transform: none;
  }
  .architecture-grid {
    gap: 25px;
  }
  .developer-grid {
    grid-template-columns: 1fr;
  }
  .developer-cards {
    max-width: 850px;
  }
}
@media(max-width:760px) {
  .container {
    width: min(100% - 36px,1180px);
  }
  .nav {
    height: 68px;
  }
  .brand {
    font-size: 23px;
  }
  .menu-toggle {
    display: flex;
    width: 44px;
    height: 44px;
    background: white;
    border: 1px solid #d8e3f0;
    border-radius: 6px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
  }
  .menu-toggle span {
    width: 19px;
    height: 2px;
    background: #10213c;
  }
  .main-nav {
    display: none;
    position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 16px 24px #0002;
    padding: 18px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .main-nav.open {
    display: flex;
  }
  .main-nav a {
    padding: 13px 12px;
  }
  .main-nav .nav-contact {
    text-align: center;
    margin-top: 9px;
  }
  .hero-grid {
    grid-template-columns: 1fr;
    padding-top: 66px;
    padding-bottom: 60px;
    gap: 44px;
    min-height: 0;
  }
  .hero-visual {
    max-width: 590px;
    width: 100%;
    margin: auto;
  }
  .hero-lead {
    font-size: 17px;
  }
  .section {
    padding: 65px 0;
  }
  .feature-grid {
    grid-template-columns: repeat(2,1fr);
    gap: 32px 18px;
  }
  .architecture-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .value-grid {
    gap: 25px;
  }
  .closing-inner {
    align-items: flex-start;
    flex-direction: column;
  }
  .developer-section {
    padding: 65px 0;
  }
}
@media(max-width:490px) {
  .container {
    width: calc(100% - 32px);
  }
  h1 {
    font-size: clamp(36px,10vw,49px);
  }
  .actions {
    flex-direction: column;
    align-items: stretch;
  }
  .button {
    width: 100%;
  }
  .hero-proof {
    flex-direction: column;
    gap: 9px;
  }
  .flow-row {
    gap: 8px;
    width: 100%;
  }
  .flow-step {
    min-width: 0;
    flex: 1;
    font-size: 10px;
    padding: 11px 6px;
  }
  .flow-step.focus {
    min-width: 0;
    width: 85%;
  }
  .visual-body {
    padding: 27px 13px;
  }
  .feature-grid,.value-grid,.developer-cards {
    grid-template-columns: 1fr;
  }
  .feature {
    padding-left: 17px;
  }
  .feature-icon {
    margin-bottom: 8px;
  }
  .architecture-panel {
    grid-template-columns: 1fr;
    gap: 13px;
    padding: 18px;
  }
  .arch-column {
    flex-direction: row;
  }
  .arch-column div {
    flex: 1;
    font-size: 10px;
    padding: 12px 4px;
  }
  .arch-center {
    padding: 18px;
  }
  .developer-cards {
    gap: 12px;
  }
  .dev-card {
    min-height: 0;
  }
  .footer-inner {
    align-items: flex-start;
    flex-direction: column;
  }
  .footer-inner>div {
    flex-direction: column;
    gap: 12px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }
  .button {
    transition: none;
  }
}
/* v0.3 multi-page refinements */
.hero > .container:not(.hero-grid) {
  padding-top: 24px;
  padding-bottom: 28px;
  max-width: 1000px;
}
.hero > .container:not(.hero-grid) h1 {
  max-width: 920px;
}
.hero > .container:not(.hero-grid) .hero-lead {
  max-width: 820px;
}
.hero > .container:not(.hero-grid) .button.outline {
  color: #fff;
}
/* v0.4 typography and secondary-page system */
h1 {
  letter-spacing: -.018em;
  line-height: 1.12;
  overflow-wrap: normal;
}
.section h2,.developer-section h2 {
  letter-spacing: -.02em;
  line-height: 1.2;
}
.page-hero-inner {
  padding-top: clamp(72px,8vw,116px)!important;
  padding-bottom: clamp(76px,9vw,122px)!important;
  max-width: 1180px!important;
}
.page-hero h1 {
  font-size: clamp(2.6rem,5vw,5.2rem);
  max-width: 1050px!important;
  letter-spacing: -.018em;
  line-height: 1.12;
  text-wrap: balance;
}
.page-hero .hero-lead {
  max-width: 760px!important;
  font-size: clamp(1.06rem,1.7vw,1.25rem);
}
.detail-section h2 {
  max-width: 800px;
}
.detail-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 20px;
  margin-top: 34px;
}
.detail-card {
  border: 1px solid #dbe6f2;
  border-radius: 12px;
  padding: 30px 26px;
  background: #fff;
  box-shadow: 0 8px 25px #1735570a;
}
.detail-card h3 {
  font-size: 1.3rem;
  margin: 16px 0 12px;
  line-height: 1.3;
}
.detail-card p {
  color: #53637a;
  line-height: 1.75;
  font-size: .98rem;
  margin: 0;
}
.technical-note {
  font-size: .88rem;
  color: #60738a;
  margin: 24px 0 0;
  line-height: 1.6;
}
.next-section {
  background: #eff5fc;
}
.next-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.next-inner h2 {
  margin: 0;
  max-width: 640px;
}
.next-inner .button {
  white-space: nowrap;
}
@media(max-width:800px) {
  .detail-grid {
    grid-template-columns: 1fr 1fr;
  }
  .next-inner {
    align-items: flex-start;
    flex-direction: column;
  }
  .page-hero-inner {
    padding-top: 70px!important;
    padding-bottom: 75px!important;
  }
}
@media(max-width:560px) {
  .detail-grid {
    grid-template-columns: 1fr;
  }
  .page-hero h1 {
    font-size: clamp(2.25rem,9vw,3.1rem);
    line-height: 1.15;
  }
  .detail-card {
    padding: 24px;
  }
  .next-inner .button {
    white-space: normal;
  }
}
/* v0.5: compact hero typography and a non-sequential component model */
.hero-grid {
  grid-template-columns: minmax(0,1fr) minmax(0,1.04fr);
  gap: clamp(34px,4vw,66px);
  align-items: center;
  padding-top: clamp(58px,6vw,86px);
  padding-bottom: clamp(62px,7vw,94px);
}
.hero-copy h1 {
  font-size: clamp(2.8rem,4.1vw,4.35rem);
  letter-spacing: -.012em;
  line-height: 1.12;
  max-width: 660px;
  text-wrap: balance;
}
.hero-copy .hero-lead {
  font-size: clamp(1rem,1.3vw,1.15rem);
  line-height: 1.7;
  max-width: 600px;
}
.hero-visual {
  transform: none;
  min-width: 0;
}
.runtime-model {
  padding: clamp(20px,3vw,34px);
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
}
.model-source {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
.model-tile {
  border: 1px solid #4878a8;
  border-radius: 9px;
  background: #15365b;
  padding: 17px 13px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 7px;
  justify-content: center;
  min-width: 0;
}
.model-tile small,.model-core small {
  font-size: 9px;
  letter-spacing: .16em;
  color: #93c9ff;
  font-weight: 800;
}
.model-tile strong {
  font-size: clamp(11px,1.05vw,14px);
  line-height: 1.35;
}
.model-tile span {
  font-size: 11px;
  color: #bbd2e8;
  line-height: 1.4;
}
.model-relation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 55px;
  color: #9ec7ed;
}
.model-relation span {
  height: 1px;
  background: #507ba9;
  flex: 1;
  max-width: 72px;
}
.model-relation b {
  font-size: 9px;
  letter-spacing: .13em;
  text-align: center;
  font-weight: 700;
}
.model-core {
  background: linear-gradient(135deg,#1477dc,#0a3e84);
  border: 1px solid #67b4ff;
  border-radius: 10px;
  padding: 19px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 5px;
  box-shadow: 0 8px 25px #0003;
}
.model-core strong {
  font-size: 23px;
}
.model-core span {
  color: #d3e9ff;
  font-size: 12px;
}
.model-services {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
}
.model-services .model-tile {
  padding: 15px 8px;
  min-height: 67px;
}
.visual-foot {
  font-size: 11px;
  line-height: 1.5;
}
@media(max-width:950px) {
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  .hero-copy h1 {
    max-width: 750px;
  }
  .hero-visual {
    max-width: 720px;
    margin: 0;
    width: 100%;
  }
  .model-tile strong {
    font-size: 13px;
  }
}
@media(max-width:490px) {
  .hero-copy h1 {
    font-size: clamp(2.5rem,10vw,3.2rem);
  }
  .model-source {
    gap: 8px;
  }
  .model-tile {
    padding: 12px 7px;
  }
  .model-tile strong {
    font-size: 11px;
  }
  .model-tile span {
    font-size: 10px;
  }
  .model-services {
    gap: 6px;
  }
  .model-services .model-tile {
    padding: 10px 4px;
  }
  .model-services .model-tile strong {
    font-size: 10px;
  }
  .model-relation {
    min-height: 45px;
  }
  .model-relation b {
    font-size: 8px;
  }
  .runtime-model {
    padding: 18px 12px;
  }
}
/* v0.6: storytelling, typography, and interactive conceptual storyboard */
.hero-copy h1 {
  font-size: clamp(2.7rem,3.55vw,3.9rem);
  letter-spacing: -.01em;
  line-height: 1.14;
  text-wrap: pretty;
  max-width: 700px;
}
.hero-copy h1 span {
  display: block;
}
.integration-grid {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  gap: clamp(36px,6vw,90px);
  align-items: center;
}
.integration-copy>p:not(.eyebrow) {
  font-size: 1.05rem;
  line-height: 1.75;
  color: #53637a;
}
.integration-steps {
  display: grid;
  gap: 12px;
}
.integration-step {
  display: flex;
  gap: 22px;
  align-items: flex-start;
  padding: 21px 24px;
  background: #fff;
  border: 1px solid #dbe7f5;
  border-radius: 12px;
  box-shadow: 0 8px 28px #16375a08;
}
.step-num {
  font-size: 13px;
  font-weight: 800;
  color: #0867df;
  letter-spacing: .1em;
  padding-top: 4px;
}
.integration-step h3 {
  font-size: 17px;
  margin: 0 0 7px;
}
.integration-step p {
  font-size: 14px;
  line-height: 1.6;
  color: #586a80;
  margin: 0;
}
.integration-steps .technical-note {
  margin: 5px 0 0;
}
.scenario-heading {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 65px;
  align-items: end;
  margin-bottom: 38px;
}
.scenario-heading>p {
  font-size: 16px;
  color: #566b84;
  line-height: 1.75;
  margin: 0 0 7px;
}
.scenario-grid {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 48px;
  align-items: center;
}
.scenario-demo {
  background: #0b2343;
  border: 1px solid #3b6898;
  border-radius: 16px;
  overflow: hidden;
  color: #fff;
  box-shadow: 0 18px 40px #071e3d22;
}
.scenario-top {
  padding: 17px 23px;
  border-bottom: 1px solid #355778;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 11px;
  letter-spacing: .11em;
  color: #a9cbe9;
  font-weight: 700;
}
.scenario-status {
  white-space: nowrap;
}
.scenario-messages {
  padding: 28px 24px;
  min-height: 255px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
}
.chat-bubble {
  max-width: 88%;
  border-radius: 12px;
  padding: 17px 20px;
}
.chat-bubble.app {
  background: #173d69;
  border: 1px solid #4c79aa;
  align-self: flex-start;
}
.chat-bubble.user {
  background: #1261c3;
  align-self: flex-end;
}
.chat-bubble small {
  font-size: 10px;
  letter-spacing: .13em;
  color: #b8dbff;
  font-weight: 800;
}
.chat-bubble p {
  font-size: 17px;
  line-height: 1.5;
  margin: 7px 0 0;
}
.scenario-controls {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 17px 24px;
  border-top: 1px solid #355778;
}
.scenario-btn {
  border: 1px solid #6899ca;
  border-radius: 7px;
  background: transparent;
  color: #fff;
  padding: 11px 15px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.scenario-next {
  background: #0867ec;
  border-color: #0867ec;
}
.scenario-btn:disabled {
  opacity: .35;
  cursor: not-allowed;
}
.scenario-btn:not(:disabled):hover {
  background: #17568f;
}
.scenario-explain h3 {
  font-size: clamp(25px,2.3vw,34px);
  letter-spacing: -.025em;
  margin-bottom: 14px;
}
.scenario-explain>p:not(.eyebrow) {
  font-size: 17px;
  line-height: 1.75;
  color: #52677e;
}
.scenario-responsibility {
  border-left: 3px solid #0867ec;
  padding: 10px 0 10px 18px;
  margin: 24px 0;
}
.scenario-responsibility strong {
  font-size: 14px;
}
.scenario-responsibility p {
  font-size: 14px;
  color: #586c84;
  line-height: 1.65;
  margin: 8px 0 0;
}
.scenario-section .technical-note {
  margin-top: 25px;
}
@media(max-width:950px) {
  .integration-grid,.scenario-heading,.scenario-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .scenario-heading {
    margin-bottom: 25px;
  }
  .scenario-demo {
    max-width: 750px;
  }
  .hero-copy h1 {
    font-size: clamp(2.7rem,6.5vw,4.1rem);
  }
}
@media(max-width:490px) {
  .hero-copy h1 {
    font-size: clamp(2.35rem,9.1vw,3rem);
  }
  .integration-step {
    padding: 18px 15px;
    gap: 14px;
  }
  .scenario-messages {
    padding: 18px 14px;
    min-height: 260px;
  }
  .scenario-top,.scenario-controls {
    padding-left: 14px;
    padding-right: 14px;
  }
  .chat-bubble {
    max-width: 95%;
    padding: 14px;
  }
  .chat-bubble p {
    font-size: 15px;
  }
  .scenario-heading h2 br {
    display: none;
  }
}
/* v0.7 commercial review refinements */
.closing .eyebrow {
  font-size: 12px;
  letter-spacing: .17em;
  line-height: 1.4;
  margin-bottom: 18px;
}
.closing h2 {
  max-width: 760px;
  text-wrap: balance;
}
.closing-inner {
  gap: 48px;
}
.scenario-progress {
  display: flex;
  gap: 8px;
  justify-content: center;
  padding: 14px 24px 0;
}
.scenario-progress-dot {
  height: 5px;
  width: 44px;
  border-radius: 999px;
  background: #41688e;
  transition: background .18s,width .18s;
}
.scenario-progress-dot.active {
  background: #75bdff;
  width: 60px;
}
.scenario-messages {
  transition: opacity .15s ease;
}
.dev-card[href] {
  display: block;
  transition: background .18s,border-color .18s;
}
.dev-card[href]:focus-visible {
  outline: 3px solid #9cd5ff;
  outline-offset: 3px;
}
.feature-icon {
  font-family: Arial,sans-serif;
  line-height: 1.1;
}
@media(max-width:760px) {
  .closing-inner {
    gap: 25px;
  }
  .scenario-progress-dot {
    width: 30px;
  }
  .scenario-progress-dot.active {
    width: 46px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .scenario-progress-dot,.scenario-messages {
    transition: none;
  }
}
/* v0.8: active navigation, conceptual architecture, AI integration */
.main-nav a {
  position: relative;
  transition: color .18s ease;
}
.main-nav a.is-current {
  color: #075fce;
  font-weight: 800;
}
.main-nav a.is-current::after {
  content: "";
  position: absolute;
  bottom: -11px;
  left: 0;
  right: 0;
  height: 3px;
  border-radius: 3px;
  background: #0867ec;
}
.brand.is-current-home {
  color: #075fce;
}
.section-intro {
  max-width: 770px;
  color: #536780;
  font-size: 1.07rem;
  line-height: 1.7;
  margin: 0 0 30px;
}
.system-diagram {
  border: 1px solid #d6e5f6;
  border-radius: 18px;
  padding: clamp(22px,4vw,48px);
  background: linear-gradient(160deg,#f7faff,#fff);
  max-width: 1040px;
  margin: 34px auto 0;
}
.system-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.system-node {
  background: #fff;
  border: 1px solid #cfe0f3;
  border-radius: 12px;
  padding: 23px;
  text-align: center;
  min-width: 0;
}
.system-node h3 {
  margin: 8px 0;
  font-size: 1.2rem;
}
.system-node p {
  color: #566a83;
  line-height: 1.5;
  font-size: .91rem;
  margin: 0;
}
.node-kicker {
  font-size: .68rem;
  letter-spacing: .15em;
  color: #0764d7;
  font-weight: 800;
}
.system-relation {
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: #526d8c;
  font-size: .68rem;
  font-weight: 800;
  padding: 26px 0;
  position: relative;
}
.system-relation::before,.system-relation::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: clamp(14px,7vw,85px);
  height: 1px;
  background: #afc9e7;
  margin: 0 14px;
}
.system-runtime {
  text-align: center;
  background: linear-gradient(130deg,#0d66d4,#103367);
  color: #fff;
  padding: 30px 22px;
  border-radius: 12px;
}
.system-runtime .node-kicker {
  color: #a6d5ff;
}
.system-runtime h3 {
  font-size: 1.8rem;
  margin: 8px 0;
}
.system-runtime p {
  color: #dcecff;
  margin: 0;
}
.system-services {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 15px;
}
.system-services .system-node {
  font-weight: 750;
}
.system-optional {
  margin-top: 27px;
  border: 1px dashed #8aabd0;
  border-radius: 12px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  background: #edf5ff;
}
.system-optional h3 {
  font-size: 1.2rem;
  margin: 8px 0;
}
.system-optional p {
  max-width: 670px;
  color: #536780;
  line-height: 1.65;
  margin: 0;
}
.optional-link {
  font-size: .75rem;
  font-weight: 800;
  color: #1555a3;
  max-width: 165px;
  text-align: center;
}
.architecture-detail {
  background: #f4f8fe;
}
.ai-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px,5vw,85px);
  align-items: center;
}
.ai-layout h2 {
  max-width: 640px;
}
.ai-layout p {
  color: #536780;
  line-height: 1.75;
}
.ai-layout .text-link,.product-more .text-link {
  color: #075fce;
  font-weight: 750;
}
.ai-example {
  background: #f6f9fe;
  border: 1px solid #d6e5f6;
  border-radius: 15px;
  padding: 30px;
}
.ai-example-row {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 17px 0;
  border-bottom: 1px solid #d9e5f2;
  line-height: 1.6;
  color: #354c68;
}
.ai-example-row b {
  color: #075fce;
}
.ai-example .technical-note {
  font-size: .78rem;
  margin: 20px 0 0;
}
.product-more {
  margin-top: 30px;
}
@media(max-width:800px) {
  .ai-layout {
    grid-template-columns: 1fr;
  }
  .system-optional {
    flex-direction: column;
    align-items: flex-start;
  }
  .optional-link {
    text-align: left;
    max-width: none;
  }
}
@media(max-width:760px) {
  .main-nav a.is-current {
    background: #eef5ff;
    border-radius: 6px;
  }
  .main-nav a.is-current::after {
    bottom: 7px;
    left: 0;
    right: auto;
    width: 3px;
    height: calc(100% - 14px);
  }
}
@media(max-width:560px) {
  .system-top,.system-services {
    grid-template-columns: 1fr;
  }
  .system-relation {
    padding: 20px 0;
  }
  .system-relation::before,.system-relation::after {
    width: 15px;
    margin: 0 7px;
  }
  .system-diagram {
    padding: 18px;
  }
  .ai-example {
    padding: 20px;
  }
}
/* v0.9 Architecture: distinct technical diagram and lifecycle */
.architecture-overview .section-intro {
  max-width: 790px;
}
.architecture-map {
  margin-top: 36px;
  border: 1px solid #d6e4f4;
  border-radius: 18px;
  padding: clamp(18px,3.5vw,42px);
  background: linear-gradient(145deg,#f8fbff,#eef5fd);
}
.map-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
.map-box {
  text-align: center;
  background: white;
  border: 1px solid #cfdef0;
  border-radius: 12px;
  padding: 22px 16px;
}
.map-box h3,.map-context-box h3 {
  margin: 8px 0;
  font-size: 1.15rem;
}
.map-box p,.map-context-box p {
  margin: 0;
  color: #536780;
  line-height: 1.6;
}
.map-connectors {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  text-align: center;
  color: #41638a;
  font-size: .75rem;
  font-weight: 750;
  padding: 10px 0;
}
.map-connectors>div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2px;
}
.map-arrow {
  font-size: 1.65rem;
  color: #0867df;
  line-height: 1.1;
}
.map-runtime {
  text-align: center;
  color: white;
  background: linear-gradient(120deg,#126ee1,#123569);
  border-radius: 13px;
  padding: 28px 15px;
}
.map-runtime .node-kicker {
  color: #b2dbff;
}
.map-runtime h3 {
  font-size: 1.8rem;
  margin: 8px 0;
}
.map-runtime p {
  margin: 0;
  color: #e4efff;
}
.map-service-label {
  text-align: center;
  color: #476487;
  font-size: .77rem;
  font-weight: 800;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 11px;
}
.map-services {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 13px;
}
.map-services>div {
  text-align: center;
  background: #fff;
  border: 1px solid #cbdff5;
  border-radius: 10px;
  padding: 21px 10px;
  font-weight: 750;
}
.map-context {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 26px;
  padding-top: 24px;
  border-top: 1px solid #d0dff0;
}
.map-context-box {
  background: #fff;
  border: 1px dashed #9bb8d9;
  border-radius: 11px;
  padding: 22px;
}
.map-context-note {
  display: block;
  color: #075fce;
  font-size: .75rem;
  font-weight: 800;
  margin-top: 16px;
}
.interruption-section {
  background: #fff;
}
.interruption-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px,5vw,85px);
  align-items: center;
}
.interruption-layout p {
  color: #536780;
  line-height: 1.75;
}
.interruption-panel {
  background: #f3f7fd;
  border: 1px solid #d5e4f5;
  border-radius: 15px;
  padding: clamp(20px,3vw,36px);
}
.interruption-panel h3 {
  font-size: 1.3rem;
  margin-bottom: 20px;
}
.interruption-item {
  display: flex;
  gap: 18px;
  padding: 17px 0;
  border-top: 1px solid #d7e4f2;
}
.interruption-item>b {
  color: #0867df;
}
.interruption-item strong {
  display: block;
  margin-bottom: 5px;
}
.interruption-item p {
  font-size: .9rem;
  margin: 0;
}
.interruption-panel .technical-note {
  font-size: .8rem;
  margin: 20px 0 0;
}
.architecture-overview .technical-note {
  margin-top: 17px;
}
.architecture-overview .container {
  max-width: 1180px;
}
.architecture-overview .page-hero h1 {
  max-width: 950px;
}
@media(max-width:760px) {
  .interruption-layout {
    grid-template-columns: 1fr;
  }
  .map-row,.map-context {
    grid-template-columns: 1fr;
  }
  .map-connectors {
    grid-template-columns: 1fr;
  }
  .map-connectors>div {
    min-height: 40px;
  }
  .map-services {
    grid-template-columns: 1fr;
  }
  .map-runtime h3 {
    font-size: 1.4rem;
  }
  .architecture-map {
    padding: 17px;
  }
}
/* v0.9.1: targeted Architecture visual refinements */
.architecture-hero .page-hero-inner {
  padding-top: clamp(52px,6vw,82px)!important;
  padding-bottom: clamp(58px,6.5vw,90px)!important;
}
.architecture-hero h1 {
  font-size: clamp(2.65rem,4.65vw,4.8rem);
  max-width: 950px!important;
}
.architecture-map .map-connectors {
  font-size: .84rem;
  gap: 24px;
  padding: 15px 0;
}
.architecture-map .map-arrow {
  font-size: 2rem;
  font-weight: 800;
  color: #075bd1;
}
.architecture-map .map-service-label {
  font-size: .86rem;
  padding: 16px 0;
}
.architecture-map .map-connectors>div {
  gap: 5px;
}
.next-inner p {
  margin: 12px 0 0;
  color: #536780;
  max-width: 650px;
}
.next-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.next-actions .button.secondary {
  background: transparent;
  color: #075bd1;
  border: 1px solid #8bb5e5;
}
.next-actions .button.secondary:hover {
  background: #e4efff;
}
@media(max-width:800px) {
  .next-actions {
    justify-content: flex-start;
  }
  .architecture-hero .page-hero-inner {
    padding-top: 58px!important;
    padding-bottom: 64px!important;
  }
}
@media(max-width:560px) {
  .next-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }
  .next-actions .button {
    text-align: center;
    white-space: normal;
  }
}
/* v0.9.2 — homepage narrative and conversation-led hero */
.interaction-visual-body {
  padding: clamp(20px,3vw,32px);
  display: grid;
  gap: 24px;
}
.visual-dialog {
  display: grid;
  gap: 12px;
}
.visual-message {
  background: #193e6a;
  border: 1px solid #4777a8;
  border-radius: 12px;
  padding: 18px 20px;
  width: 84%;
}
.visual-message.from-user {
  background: #1162c7;
  border-color: #287ee3;
  justify-self: end;
  width: 70%;
}
.visual-message small,.visual-decision small {
  display: block;
  color: #a9d5ff;
  letter-spacing: .13em;
  font-size: 10px;
  font-weight: 800;
  margin-bottom: 8px;
}
.visual-message strong {
  font-size: 16px;
  line-height: 1.5;
  font-weight: 650;
}
.visual-orchestration {
  display: flex;
  align-items: center;
  gap: 9px;
}
.visual-pill {
  flex: 1;
  border: 1px solid #426e9b;
  border-radius: 7px;
  padding: 12px 8px;
  text-align: center;
  font-size: 11px;
  color: #c3dcf7;
}
.visual-orchestration-core {
  flex: 1.3;
  text-align: center;
  background: linear-gradient(125deg,#0d70e4,#17417b);
  border-radius: 8px;
  padding: 15px 7px;
  font-weight: 800;
  font-size: 16px;
}
.visual-orchestration-core small {
  display: block;
  font-size: 10px;
  font-weight: 500;
  color: #d2e8ff;
  margin-top: 4px;
}
.visual-decision {
  display: flex;
  gap: 12px;
  align-items: start;
  border: 1px solid #396b9d;
  background: #102b4b;
  border-radius: 10px;
  padding: 17px;
}
.decision-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #6ad7c0;
  margin-top: 5px;
  flex-shrink: 0;
}
.visual-decision strong {
  font-size: 13px;
  line-height: 1.5;
}
.benefits-section {
  background: #fff;
}
.benefits-section h2 {
  max-width: 750px;
}
.benefits-lead {
  max-width: 730px;
  font-size: 17px;
  color: #576b83;
  line-height: 1.7;
}
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 25px;
  margin-top: 45px;
}
.benefits-grid article {
  padding: 28px;
  border: 1px solid #d6e4f5;
  border-radius: 12px;
  background: #f9fbff;
}
.benefit-number {
  font-size: 12px;
  color: #0867df;
  font-weight: 800;
}
.benefits-grid h3 {
  font-size: 21px;
  margin: 19px 0 12px;
}
.benefits-grid p {
  font-size: 15px;
  color: #566a82;
  line-height: 1.7;
  margin: 0;
}
.preview-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 65px;
  align-items: center;
}
.preview-grid>div:first-child>p:not(.eyebrow) {
  max-width: 500px;
}
.preview-panel {
  background: #fff;
  border: 1px solid #d6e4f5;
  border-radius: 14px;
  padding: 16px 24px;
}
.preview-panel>div {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 4px 12px;
  padding: 17px 0;
}
.preview-panel>div+div {
  border-top: 1px solid #e3eaf4;
}
.preview-panel span {
  color: #0867df;
  font-weight: 800;
  font-size: 13px;
  grid-row: span 2;
}
.preview-panel strong {
  font-size: 17px;
}
.preview-panel p {
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
.scenario-section {
  background: #fff;
}
.main-nav a[aria-current="page"],.brand.is-current-home {
  color: #005dce;
}
.brand.is-current-home {
  position: relative;
}
.brand.is-current-home:after {
  content: "";
  position: absolute;
  bottom: -19px;
  left: 0;
  right: 0;
  height: 3px;
  background: #0867ec;
}
@media(max-width:950px) {
  .preview-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}
@media(max-width:760px) {
  .benefits-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .benefits-grid article {
    padding: 22px;
  }
  .visual-message {
    width: 92%;
  }
  .visual-message.from-user {
    width: 80%;
  }
  .visual-pill {
    font-size: 9px;
    padding: 9px 5px;
  }
  .visual-orchestration-core {
    font-size: 13px;
  }
}
/* v0.9.3: distinct use-case narratives replace repetitive benefits/architecture preview */
.markets-section {
  background: #f3f7fc;
}
.markets-intro {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 55px;
  align-items: end;
  margin-bottom: 36px;
}
.markets-intro h2 {
  margin-bottom: 0;
}
.markets-intro>p {
  color: #556a83;
  font-size: 16px;
  line-height: 1.75;
  margin: 0;
}
.markets-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
}
.market-card {
  background: white;
  border: 1px solid #d8e5f4;
  border-radius: 12px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.market-tag {
  font-size: 10px;
  letter-spacing: .13em;
  font-weight: 800;
  color: #0064dc;
}
.market-card h3 {
  font-size: 21px;
  line-height: 1.3;
  letter-spacing: -.02em;
  margin: 18px 0 12px;
}
.market-card p {
  font-size: 14px;
  line-height: 1.7;
  color: #536781;
}
.market-card .market-example {
  margin: auto 0 0;
  padding-top: 16px;
  border-top: 1px solid #e6edf6;
  font-size: 13px;
  color: #365572;
}
.market-note {
  font-size: 12px;
  color: #63758a;
  margin: 18px 0 0;
}
.market-bottom {
  border-top: 1px solid #d8e4f2;
  margin-top: 32px;
  padding-top: 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.market-bottom p {
  max-width: 760px;
  font-size: 15px;
  line-height: 1.7;
  color: #536781;
  margin: 0;
}
.market-bottom strong {
  color: #10213c;
}
.market-bottom .text-link {
  margin: 0;
  white-space: nowrap;
}
/* Keep the existing sticky header: full-page browser captures may render it mid-page. */
@media(max-width:950px) {
  .markets-intro {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .markets-grid {
    grid-template-columns: 1fr;
  }
  .market-card .market-example {
    margin-top: 12px;
  }
}
@media(max-width:760px) {
  .market-bottom {
    align-items: flex-start;
    flex-direction: column;
  }
  .market-card {
    padding: 22px;
  }
  .markets-intro h2 br {
    display: none;
  }
}
/* v0.9.4 — Andamento product page: capabilities, integration, AI and visual applications */
.andamento-hero .page-hero-inner {
  padding-top: clamp(62px,7vw,100px)!important;
  padding-bottom: clamp(70px,8vw,108px)!important;
}
.andamento-hero h1 {
  max-width: 940px!important;
  font-size: clamp(2.65rem,4.6vw,4.9rem);
}
.andamento-intro {
  max-width: 740px;
  color: #536780;
  line-height: 1.7;
  font-size: 1.08rem;
}
.andamento-cap-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 17px;
  margin-top: 32px;
}
.andamento-cap {
  border: 1px solid #d7e5f4;
  border-radius: 13px;
  background: #fff;
  padding: 28px;
  min-width: 0;
}
.andamento-cap h3 {
  font-size: 1.25rem;
  line-height: 1.3;
  margin: 14px 0 10px;
}
.andamento-cap p {
  font-size: .95rem;
  line-height: 1.7;
  color: #536780;
  margin: 0;
}
.andamento-integration,.andamento-multimodal {
  background: #f2f7fd;
}
.andamento-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(35px,6vw,95px);
  align-items: center;
}
.andamento-split>div>p:not(.eyebrow):not(.technical-note) {
  color: #536780;
  line-height: 1.75;
  font-size: 1.04rem;
}
.andamento-process,.andamento-example,.andamento-visual-example {
  border: 1px solid #d6e4f4;
  border-radius: 15px;
  background: #fff;
  padding: clamp(22px,3vw,36px);
}
.andamento-process-step {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  padding: 17px 0;
}
.andamento-process-step+.andamento-process-step {
  border-top: 1px solid #e0eaf5;
}
.andamento-process-step>span,.andamento-example-line>b {
  color: #0767df;
  font-weight: 800;
}
.andamento-process-step h3 {
  font-size: 1.13rem;
  margin: 0 0 6px;
}
.andamento-process-step p,.andamento-example-line p {
  color: #536780;
  line-height: 1.65;
  margin: 0;
  font-size: .94rem;
}
.andamento-ai {
  background: #fff;
}
.andamento-example {
  background: #f7faff;
}
.andamento-example-line {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  padding: 17px 0;
}
.andamento-example-line+.andamento-example-line {
  border-top: 1px solid #dce7f4;
}
.andamento-example-line strong {
  color: #132643;
}
.andamento-ui-card {
  border: 1px solid #d7e4f3;
  border-radius: 11px;
  padding: 24px;
  background: #f9fbff;
  margin: 15px 0;
}
.andamento-ui-label,.andamento-voice-strip span {
  display: block;
  font-size: .7rem;
  letter-spacing: .13em;
  font-weight: 800;
  color: #0966d8;
  margin-bottom: 10px;
}
.andamento-ui-card>strong {
  display: block;
  font-size: 1.35rem;
  margin-bottom: 18px;
}
.andamento-ui-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid #e0e8f2;
  padding: 13px 0;
  font-size: .9rem;
  color: #52677e;
}
.andamento-ui-row b {
  color: #142a46;
  text-align: right;
}
.andamento-ui-status {
  color: #0d6e8b!important;
}
.andamento-voice-strip {
  background: #0d2b4e;
  color: #fff;
  padding: 18px;
  border-radius: 10px;
}
.andamento-voice-strip span {
  color: #8dc9ff;
}
.andamento-voice-strip strong {
  font-size: 1rem;
  line-height: 1.5;
}
.andamento-visual-example>small {
  display: block;
  color: #63758a;
  margin-top: 14px;
  line-height: 1.5;
}
.andamento-next {
  background: #eff5fc;
}
.andamento-next-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
}
.andamento-next-head p {
  color: #536780;
  line-height: 1.7;
  max-width: 650px;
}
.andamento-next-head .button {
  white-space: nowrap;
}
.andamento-next-links {
  border-top: 1px solid #d4e3f4;
  padding-top: 23px;
  margin-top: 25px;
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.andamento-next-links a {
  color: #075fce;
  font-weight: 750;
  text-decoration: none;
}
.andamento-next-links a:hover {
  text-decoration: underline;
}
@media(max-width:900px) {
  .andamento-cap-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .andamento-split {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .andamento-next-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .andamento-next-head .button {
    white-space: normal;
  }
}
@media(max-width:600px) {
  .andamento-cap-grid {
    grid-template-columns: 1fr;
  }
  .andamento-cap {
    padding: 23px;
  }
  .andamento-next-links {
    flex-direction: column;
    gap: 17px;
  }
  .andamento-hero h1 {
    font-size: clamp(2.3rem,9vw,3.2rem);
  }
}
/* v0.9.4 — Andamento product page: capabilities, integration, AI and visual applications */
.andamento-hero .page-hero-inner {
  padding-top: clamp(62px,7vw,100px)!important;
  padding-bottom: clamp(70px,8vw,108px)!important;
}
.andamento-hero h1 {
  max-width: 940px!important;
  font-size: clamp(2.65rem,4.6vw,4.9rem);
}
.andamento-intro {
  max-width: 740px;
  color: #536780;
  line-height: 1.7;
  font-size: 1.08rem;
}
.andamento-cap-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 17px;
  margin-top: 32px;
}
.andamento-cap {
  border: 1px solid #d7e5f4;
  border-radius: 13px;
  background: #fff;
  padding: 28px;
  min-width: 0;
}
.andamento-cap h3 {
  font-size: 1.25rem;
  line-height: 1.3;
  margin: 14px 0 10px;
}
.andamento-cap p {
  font-size: .95rem;
  line-height: 1.7;
  color: #536780;
  margin: 0;
}
.andamento-integration,.andamento-multimodal {
  background: #f2f7fd;
}
.andamento-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(35px,6vw,95px);
  align-items: center;
}
.andamento-split>div>p:not(.eyebrow):not(.technical-note) {
  color: #536780;
  line-height: 1.75;
  font-size: 1.04rem;
}
.andamento-process,.andamento-example,.andamento-visual-example {
  border: 1px solid #d6e4f4;
  border-radius: 15px;
  background: #fff;
  padding: clamp(22px,3vw,36px);
}
.andamento-process-step {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  padding: 17px 0;
}
.andamento-process-step+.andamento-process-step {
  border-top: 1px solid #e0eaf5;
}
.andamento-process-step>span,.andamento-example-line>b {
  color: #0767df;
  font-weight: 800;
}
.andamento-process-step h3 {
  font-size: 1.13rem;
  margin: 0 0 6px;
}
.andamento-process-step p,.andamento-example-line p {
  color: #536780;
  line-height: 1.65;
  margin: 0;
  font-size: .94rem;
}
.andamento-ai {
  background: #fff;
}
.andamento-example {
  background: #f7faff;
}
.andamento-example-line {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  padding: 17px 0;
}
.andamento-example-line+.andamento-example-line {
  border-top: 1px solid #dce7f4;
}
.andamento-example-line strong {
  color: #132643;
}
.andamento-ui-card {
  border: 1px solid #d7e4f3;
  border-radius: 11px;
  padding: 24px;
  background: #f9fbff;
  margin: 15px 0;
}
.andamento-ui-label,.andamento-voice-strip span {
  display: block;
  font-size: .7rem;
  letter-spacing: .13em;
  font-weight: 800;
  color: #0966d8;
  margin-bottom: 10px;
}
.andamento-ui-card>strong {
  display: block;
  font-size: 1.35rem;
  margin-bottom: 18px;
}
.andamento-ui-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid #e0e8f2;
  padding: 13px 0;
  font-size: .9rem;
  color: #52677e;
}
.andamento-ui-row b {
  color: #142a46;
  text-align: right;
}
.andamento-ui-status {
  color: #0d6e8b!important;
}
.andamento-voice-strip {
  background: #0d2b4e;
  color: #fff;
  padding: 18px;
  border-radius: 10px;
}
.andamento-voice-strip span {
  color: #8dc9ff;
}
.andamento-voice-strip strong {
  font-size: 1rem;
  line-height: 1.5;
}
.andamento-visual-example>small {
  display: block;
  color: #63758a;
  margin-top: 14px;
  line-height: 1.5;
}
.andamento-next {
  background: #eff5fc;
}
.andamento-next-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
}
.andamento-next-head p {
  color: #536780;
  line-height: 1.7;
  max-width: 650px;
}
.andamento-next-head .button {
  white-space: nowrap;
}
.andamento-next-links {
  border-top: 1px solid #d4e3f4;
  padding-top: 23px;
  margin-top: 25px;
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.andamento-next-links a {
  color: #075fce;
  font-weight: 750;
  text-decoration: none;
}
.andamento-next-links a:hover {
  text-decoration: underline;
}
@media(max-width:900px) {
  .andamento-cap-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .andamento-split {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .andamento-next-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .andamento-next-head .button {
    white-space: normal;
  }
}
@media(max-width:600px) {
  .andamento-cap-grid {
    grid-template-columns: 1fr;
  }
  .andamento-cap {
    padding: 23px;
  }
  .andamento-next-links {
    flex-direction: column;
    gap: 17px;
  }
  .andamento-hero h1 {
    font-size: clamp(2.3rem,9vw,3.2rem);
  }
}
/* v0.9.5: replayable visual application example */
.inspection-input-progress {
  height: 3px;
  background: rgba(255,255,255,.15);
  border-radius: 4px;
  margin-top: 14px;
  overflow: hidden;
}
.inspection-input-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: #70d6f4;
  border-radius: 4px;
}
.inspection-listening .inspection-input-progress span {
  animation: inspection-progress 1.5s ease-in-out forwards;
}
.inspection-decision {
  font-size: .82rem;
  color: #536780;
  background: #edf5ff;
  border: 1px solid #d9e7f6;
  border-radius: 8px;
  margin-top: 12px;
  padding: 11px 13px;
  min-height: 43px;
}
.inspection-demo-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 13px;
}
.inspection-replay {
  font: inherit;
  font-weight: 750;
  font-size: .85rem;
  color: #fff;
  background: #0867df;
  border: 1px solid #0867df;
  border-radius: 7px;
  padding: 10px 15px;
  cursor: pointer;
}
.inspection-replay:hover {
  background: #0756b9;
}
.inspection-replay:focus-visible {
  outline: 3px solid #62b7ff;
  outline-offset: 3px;
}
#inspection-phase {
  font-size: .79rem;
  color: #536780;
}
.inspection-updated #inspection-status {
  color: #086e4a!important;
  background: #dff7eb;
  border-radius: 5px;
  padding: 3px 8px;
  animation: inspection-highlight .7s ease-out;
}
@keyframes inspection-progress {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
@keyframes inspection-highlight {
  0% {
    box-shadow: 0 0 0 0 rgba(24,162,109,.38);
  }
  60% {
    box-shadow: 0 0 0 9px rgba(24,162,109,.08);
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}
@media(prefers-reduced-motion:reduce) {
  .inspection-listening .inspection-input-progress span,.inspection-updated #inspection-status {
    animation: none;
  }
}
/* v0.9.6: audio activity visualization replaces linear loading indicator. */
.inspection-input-progress {
  display: none;
}
.inspection-waveform {
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  margin-top: 12px;
  border-top: 1px solid rgba(255,255,255,.13);
  padding-top: 10px;
}
.inspection-waveform i {
  display: block;
  flex: 0 1 4px;
  min-width: 2px;
  height: 5px;
  border-radius: 5px;
  background: #79d5ff;
  opacity: .38;
  transform-origin: center;
}
.inspection-listening .inspection-waveform i {
  opacity: 1;
  animation: inspection-speech-wave .62s ease-in-out infinite alternate;
  animation-delay: calc(var(--wave-i,0) * -55ms);
}
.inspection-waveform i:nth-child(7n+1) {
  --wave-i: 1;
  --wave-height: 12px;
}
.inspection-waveform i:nth-child(7n+2) {
  --wave-i: 2;
  --wave-height: 22px;
}
.inspection-waveform i:nth-child(7n+3) {
  --wave-i: 3;
  --wave-height: 31px;
}
.inspection-waveform i:nth-child(7n+4) {
  --wave-i: 4;
  --wave-height: 15px;
}
.inspection-waveform i:nth-child(7n+5) {
  --wave-i: 5;
  --wave-height: 26px;
}
.inspection-waveform i:nth-child(7n+6) {
  --wave-i: 6;
  --wave-height: 19px;
}
.inspection-waveform i:nth-child(7n) {
  --wave-i: 7;
  --wave-height: 9px;
}
.inspection-recognized .inspection-waveform i {
  height: 4px;
  opacity: .24;
}
.inspection-replay:disabled {
  opacity: .68;
  cursor: wait;
}
@keyframes inspection-speech-wave {
  0% {
    height: 4px;
  }
  100% {
    height: var(--wave-height,22px);
  }
}
@media(prefers-reduced-motion:reduce) {
  .inspection-listening .inspection-waveform i {
    animation: none;
    height: var(--wave-height,16px);
  }
}
/* v1.0 — Use Cases: three differentiated application scenarios */
.cases-hero .page-hero-inner {
  padding-top: clamp(64px,7vw,105px);
  padding-bottom: clamp(76px,8vw,112px);
}
.cases-hero h1 {
  max-width: 950px;
  font-size: clamp(2.8rem,5vw,5.2rem);
  letter-spacing: -.025em;
  line-height: 1.1;
}
.cases-lead {
  max-width: 830px;
  color: #536780;
  font-size: 1.08rem;
  line-height: 1.75;
}
.cases-summary {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 17px;
  margin-top: 34px;
}
.cases-summary a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 28px;
  border: 1px solid #d6e5f5;
  border-radius: 13px;
  text-decoration: none;
  background: #fff;
  min-height: 190px;
  transition: border-color .2s,transform .2s;
}
.cases-summary a:hover {
  border-color: #3483e3;
  transform: translateY(-3px);
}
.cases-summary a:focus-visible {
  outline: 3px solid #2884ee;
  outline-offset: 3px;
}
.cases-summary span {
  font-size: .7rem;
  letter-spacing: .11em;
  font-weight: 800;
  color: #1268cf;
}
.cases-summary strong {
  font-size: 1.25rem;
  line-height: 1.35;
  color: #162c48;
}
.cases-summary em {
  font-style: normal;
  font-size: .9rem;
  font-weight: 700;
  color: #0865d4;
  margin-top: auto;
}
.cases-scenario {
  scroll-margin-top: 85px;
}
.cases-field,.cases-ai {
  background: #f2f7fd;
}
.cases-native {
  background: #fff;
}
.cases-split {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: clamp(36px,6vw,95px);
  align-items: center;
}
.cases-copy h2 {
  max-width: 610px;
}
.cases-copy>p:not(.eyebrow) {
  color: #536780;
  line-height: 1.76;
  font-size: 1.05rem;
}
.cases-boundary {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-left: 3px solid #1676e4;
  padding: 12px 0 12px 18px;
  margin: 24px 0;
  color: #536780;
  line-height: 1.6;
}
.cases-boundary strong {
  color: #18324f;
}
.cases-visual {
  background: #fff;
  border: 1px solid #d7e4f4;
  border-radius: 15px;
  box-shadow: 0 16px 38px rgba(15,45,85,.07);
  overflow: hidden;
}
.cases-screen-top {
  background: #102d50;
  color: #e9f5ff;
  padding: 17px 23px;
  font-size: .72rem;
  letter-spacing: .1em;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 10px;
}
.cases-screen-top small {
  margin-left: auto;
  color: #93b3d6;
  font-size: .64rem;
}
.cases-dot {
  width: 8px;
  height: 8px;
  background: #64c9f2;
  border-radius: 50%;
  display: inline-block;
}
.cases-screen-body {
  padding: clamp(20px,3vw,32px);
}
.cases-bubble {
  max-width: 87%;
  padding: 13px 16px;
  border-radius: 12px;
  font-size: .94rem;
  line-height: 1.55;
  margin: 0 0 13px;
}
.cases-bubble.system {
  background: #edf4fc;
  color: #173453;
  border-bottom-left-radius: 3px;
}
.cases-bubble.user {
  background: #176ed6;
  color: #fff;
  margin-left: auto;
  border-bottom-right-radius: 3px;
}
.cases-record {
  display: flex;
  flex-direction: column;
  gap: 5px;
  background: #f4faf7;
  border: 1px solid #c9e8d9;
  padding: 17px;
  border-radius: 9px;
  margin-top: 22px;
}
.cases-record>span:first-child {
  color: #267255;
  font-size: .67rem;
  letter-spacing: .1em;
  font-weight: 800;
}
.cases-record strong {
  font-size: 1.14rem;
  color: #183c2e;
}
.cases-record-note {
  font-size: .77rem;
  color: #587467;
}
.cases-native-visual {
  background: #f8fbff;
}
.cases-form {
  display: grid;
  gap: 10px;
}
.cases-form label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  background: #fff;
  border: 1px solid #dbe6f4;
  border-radius: 8px;
  padding: 15px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  color: #5c738b;
}
.cases-form strong {
  font-size: .89rem;
  letter-spacing: normal;
  color: #173250;
  text-align: right;
}
.cases-speech {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #102e51;
  color: #fff;
  border-radius: 10px;
  margin-top: 20px;
  padding: 18px;
}
.cases-mic {
  color: #7bd5ff;
  font-size: 1.4rem;
}
.cases-speech small {
  display: block;
  color: #a4ccef;
  letter-spacing: .09em;
  font-size: .67rem;
  margin-bottom: 6px;
}
.cases-speech strong {
  font-size: 1rem;
}
.cases-caption {
  font-size: .77rem;
  line-height: 1.6;
  color: #667d95;
  margin: 14px 0 0;
}
.cases-ai-step {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 12px;
  padding: 15px 0;
}
.cases-ai-step+.cases-ai-step {
  border-top: 1px solid #e0e9f5;
}
.cases-ai-step>span {
  font-weight: 800;
  color: #126edb;
}
.cases-ai-step strong {
  color: #183451;
}
.cases-ai-step p {
  margin: 5px 0 0;
  color: #536780;
  font-size: .89rem;
  line-height: 1.6;
}
.cases-cta {
  background: #eaf3fd;
}
.cases-cta-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 36px;
}
.cases-cta-inner>div:first-child {
  max-width: 680px;
}
.cases-cta-inner p:not(.eyebrow) {
  color: #536780;
  line-height: 1.7;
}
.cases-cta-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
@media(max-width:900px) {
  .cases-split {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .cases-summary {
    grid-template-columns: 1fr;
  }
  .cases-summary a {
    min-height: 0;
  }
  .cases-cta-inner {
    align-items: flex-start;
    flex-direction: column;
  }
}
@media(max-width:600px) {
  .cases-hero h1 {
    font-size: clamp(2.4rem,9vw,3.3rem);
  }
  .cases-screen-top {
    padding: 14px;
  }
  .cases-screen-body {
    padding: 18px;
  }
  .cases-form label {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }
  .cases-cta-buttons {
    width: 100%;
  }
  .cases-cta-buttons .button {
    width: 100%;
    text-align: center;
  }
}
@media(prefers-reduced-motion:reduce) {
  .cases-summary a {
    transition: none;
  }
  .cases-summary a:hover {
    transform: none;
  }
}
/* v1.0.1 — scenario-led visual refinement */
.cases-field-app {
  box-shadow: 0 18px 42px rgba(13,42,80,.1);
}
.cases-app-chrome {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 19px;
  background: #102e51;
  color: #fff;
  font-size: .83rem;
}
.cases-app-mark {
  background: #1777df;
  color: #fff;
  font-size: .65rem;
  letter-spacing: -.02em;
  padding: 7px;
  border-radius: 5px;
}
.cases-app-sync {
  margin-left: auto;
  color: #b8d7e9;
  font-size: .67rem;
  font-weight: 600;
}
.cases-app-content {
  padding: 22px;
}
.cases-app-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.cases-mini-label {
  font-size: .64rem;
  letter-spacing: .12em;
  font-weight: 800;
  color: #63809c;
}
.cases-app-head h3 {
  font-size: 1.25rem;
  line-height: 1.3;
  margin: 7px 0 0;
  color: #163451;
}
.cases-subtle {
  font-weight: 400;
  color: #7a8ea5;
  font-size: .85rem;
}
.cases-step-pill {
  border-radius: 99px;
  background: #edf4fc;
  color: #2766a6;
  font-size: .67rem;
  padding: 7px 10px;
  white-space: nowrap;
  font-weight: 700;
}
.cases-progress {
  height: 5px;
  border-radius: 10px;
  background: #e6edf5;
  margin: 18px 0 15px;
  overflow: hidden;
}
.cases-progress span {
  display: block;
  width: 60%;
  height: 100%;
  background: #1478dd;
  border-radius: 10px;
}
.cases-checklist {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #edf1f6;
  font-size: .83rem;
  color: #4a637e;
}
.cases-check-icon {
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #e3f6ec;
  color: #268653;
  width: 21px;
  height: 21px;
  font-weight: 800;
  font-size: .7rem;
}
.cases-checklist small {
  margin-left: auto;
  color: #2b8660;
  font-size: .69rem;
}
.cases-active-step {
  background: #f2f7fe;
  border: 1px solid #dbe8f8;
  border-radius: 10px;
  padding: 16px;
  margin: 16px 0;
}
.cases-prompt {
  color: #193c61;
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.5;
  margin: 10px 0;
}
.cases-response {
  background: #fff;
  color: #1e4c7b;
  padding: 11px 12px;
  border: 1px solid #dce7f4;
  border-radius: 7px;
  font-size: .83rem;
}
.cases-response-icon {
  color: #1475d5;
  margin-right: 7px;
}
.cases-confirm {
  font-size: .75rem;
  color: #627b93;
  margin: 11px 0 0;
}
.cases-confirm strong {
  color: #1b5d95;
}
.cases-saved {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f0faf4;
  border: 1px solid #cbe8d5;
  padding: 12px;
  border-radius: 9px;
}
.cases-saved-icon {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #218458;
  color: #fff;
  font-weight: 800;
  flex: none;
}
.cases-saved>div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.cases-saved strong {
  color: #20573b;
  font-size: .85rem;
}
.cases-saved div span {
  color: #587967;
  font-size: .69rem;
}
.cases-saved-tag {
  margin-left: auto;
  color: #2a8055;
  font-size: .62rem;
  letter-spacing: .08em;
  font-weight: 800;
}
.cases-app-footnote {
  color: #788da2;
  font-size: .69rem;
  line-height: 1.6;
  margin: 12px 0 0;
}
.cases-reversed .cases-copy {
  grid-column: 2;
  grid-row: 1;
}
.cases-reversed .cases-native-stage {
  grid-column: 1;
  grid-row: 1;
}
.cases-native-stage {
  position: relative;
  min-height: 480px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 20px 20px 0;
}
.cases-native-halo {
  position: absolute;
  inset: 13% 0 9% 4%;
  border-radius: 24px;
  background: radial-gradient(circle at 45% 35%,#e4f0ff,#f1f6fc 70%);
  border: 1px solid #e2ebf7;
}
.cases-phone {
  position: relative;
  z-index: 1;
  width: 252px;
  background: #fff;
  border: 7px solid #152f4e;
  border-radius: 30px;
  box-shadow: 0 18px 35px rgba(20,50,85,.19);
  overflow: hidden;
  transform: rotate(-2deg);
}
.cases-phone-status {
  display: flex;
  justify-content: space-between;
  padding: 12px 19px 5px;
  color: #1d3753;
  font-size: .65rem;
  font-weight: 800;
}
.cases-phone-header {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #e5edf6;
  padding: 13px 14px;
}
.cases-back {
  color: #1c72d5;
  font-size: 1.4rem;
}
.cases-phone-header div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cases-phone-header small {
  font-size: .55rem;
  color: #7290ac;
  letter-spacing: .1em;
  font-weight: 800;
}
.cases-phone-header strong {
  font-size: .82rem;
  color: #1a3551;
}
.cases-phone-more {
  margin-left: auto;
  color: #7190ad;
  font-size: .8rem;
}
.cases-phone-body {
  padding: 16px;
}
.cases-phone-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 11px;
}
.cases-form-count {
  color: #8fa3b7;
  font-size: .62rem;
}
.cases-phone-field {
  border: 1px solid #dce7f2;
  border-radius: 7px;
  padding: 10px;
  margin-bottom: 9px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cases-phone-field small {
  color: #6b86a1;
  font-size: .61rem;
}
.cases-phone-field strong {
  color: #183956;
  font-size: .81rem;
}
.cases-phone-updated {
  border-color: #9bdfbf;
  background: #f2fbf5;
}
.cases-phone-updated strong {
  display: flex;
  justify-content: space-between;
  color: #246747;
}
.cases-update-dot {
  color: #218557;
  font-size: .57rem;
  margin-left: 5px;
}
.cases-phone-listening {
  display: flex;
  gap: 10px;
  align-items: center;
  background: #103457;
  border-radius: 9px;
  color: #fff;
  padding: 13px 10px;
  margin: 16px 0;
}
.cases-voice-symbol {
  color: #79d5fa;
  font-size: 1.2rem;
}
.cases-phone-listening div {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cases-phone-listening small {
  color: #9bc9e9;
  font-size: .57rem;
  letter-spacing: .09em;
}
.cases-phone-listening strong {
  font-size: .74rem;
}
.cases-phone-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .72rem;
  color: #7c92a7;
  margin: 18px 0 0;
}
.cases-phone-next {
  padding: 10px 12px;
  border-radius: 6px;
  background: #1676db;
  color: #fff;
  font-weight: 700;
}
.cases-native-note {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 25px;
  width: 185px;
  background: #fff;
  border: 1px solid #d9e6f4;
  border-radius: 11px;
  padding: 15px;
  box-shadow: 0 12px 27px rgba(16,44,75,.12);
}
.cases-note-symbol {
  display: inline-grid;
  place-items: center;
  background: #e7f3ff;
  color: #176ed2;
  border-radius: 7px;
  width: 26px;
  height: 26px;
  margin-bottom: 9px;
  font-weight: 800;
}
.cases-native-note strong {
  display: block;
  color: #173957;
  font-size: .78rem;
  line-height: 1.4;
}
.cases-native-note p {
  color: #668099;
  font-size: .69rem;
  line-height: 1.5;
  margin: 7px 0 0;
}
.cases-native-disclaimer {
  position: absolute;
  bottom: 0;
  left: 20px;
  color: #8195a9;
  font-size: .65rem;
}
.cases-ai-new .cases-screen-body {
  padding: 23px;
}
.cases-ai-input {
  border: 1px solid #dce8f6;
  border-radius: 9px;
  background: #f5f9fe;
  padding: 15px;
}
.cases-ai-input p {
  margin: 9px 0 0;
  color: #234967;
  font-weight: 600;
  font-size: .9rem;
  line-height: 1.5;
}
.cases-ai-pipeline {
  margin: 17px 0 0 4px;
}
.cases-ai-pipeline-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
}
.cases-ai-node {
  display: grid;
  place-items: center;
  flex: none;
  background: #e9f2fd;
  color: #176ad0;
  border-radius: 8px;
  width: 30px;
  height: 30px;
  font-size: .68rem;
  font-weight: 800;
}
.cases-ai-pipeline-step>div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.cases-ai-pipeline-step strong {
  font-size: .79rem;
  color: #193653;
}
.cases-ai-pipeline-step small {
  font-size: .7rem;
  color: #617b94;
  line-height: 1.5;
}
.cases-ai-owner {
  margin-left: auto;
  font-size: .55rem;
  letter-spacing: .07em;
  color: #6b89a8;
  font-weight: 800;
  text-align: right;
  max-width: 72px;
}
.cases-ai-guard {
  background: #f0f8f4;
  border: 1px solid #cce7d8;
  border-radius: 9px;
  padding: 11px;
}
.cases-ai-guard .cases-ai-node {
  background: #d9f2e4;
  color: #258050;
}
.cases-ai-guard .cases-ai-owner {
  color: #258050;
}
.cases-ai-pipeline-connector {
  height: 14px;
  width: 2px;
  background: #c5d9ef;
  margin-left: 14px;
}
@media(max-width:900px) {
  .cases-reversed .cases-copy,.cases-reversed .cases-native-stage {
    grid-column: 1;
    grid-row: auto;
  }
  .cases-native-stage {
    max-width: 540px;
    width: 100%;
    margin: auto;
  }
}
@media(max-width:560px) {
  .cases-native-stage {
    padding-right: 0;
    min-height: 490px;
  }
  .cases-native-note {
    right: 0;
    width: 150px;
    padding: 11px;
  }
  .cases-phone {
    margin-right: 85px;
    width: 225px;
  }
  .cases-ai-owner {
    font-size: .5rem;
    max-width: 58px;
  }
  .cases-app-sync {
    font-size: .6rem;
  }
}
/* v1.0.2 — contain the native application illustration within its section.
   The site header remains sticky; a mid-page header in stitched screenshots
   can be a capture artifact and is not itself evidence of a page overlap. */
.cases-native-stage {
  min-height: 550px;
  isolation: isolate;
  padding: 30px 0 40px;
  overflow: hidden;
  border-radius: 18px;
}
.cases-native-halo {
  inset: 8% 2% 8% 2%;
}
.cases-phone {
  transform: rotate(-1deg);
  margin-right: 65px;
  flex-shrink: 0;
}
.cases-native-note {
  right: 12px;
  bottom: 48px;
  width: 176px;
}
.cases-native-disclaimer {
  bottom: 16px;
  left: 18px;
  margin: 0;
}
@media(max-width:900px) {
  .cases-native-stage {
    max-width: 560px;
    min-height: 540px;
  }
}
@media(max-width:560px) {
  .cases-native-stage {
    min-height: 525px;
    padding: 25px 0 45px;
  }
  .cases-phone {
    width: min(230px,62%);
    margin-right: 20%;
    transform: none;
  }
  .cases-native-note {
    right: 8px;
    bottom: 50px;
    width: 138px;
  }
  .cases-native-disclaimer {
    left: 12px;
    bottom: 15px;
  }
}
/* v1.1 — Developers: technical onboarding */
.dev-hero .page-hero-inner {
  padding-top: clamp(70px,8vw,115px);
  padding-bottom: clamp(70px,7vw,105px);
}
.dev-hero h1 {
  max-width: 920px;
  letter-spacing: -.035em;
  font-size: clamp(2.8rem,5.1vw,5.2rem);
}
.dev-hero .hero-lead {
  max-width: 760px;
}
.dev-hero-foot {
  display: flex;
  gap: 26px;
  flex-wrap: wrap;
  margin-top: 30px;
  color: #a8c4e5;
  font-size: .83rem;
}
.dev-hero-foot b {
  color: #e5f3ff;
}
.dev-lead {
  max-width: 800px;
  color: #586f88;
  font-size: 1.05rem;
  line-height: 1.75;
}
.dev-steps {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 16px;
  margin-top: 35px;
}
.dev-steps article {
  border: 1px solid #d7e5f4;
  background: #fff;
  border-radius: 13px;
  padding: 25px;
  display: flex;
  flex-direction: column;
  min-height: 325px;
}
.dev-step-index {
  font-size: .7rem;
  letter-spacing: .12em;
  font-weight: 800;
  color: #1370d8;
}
.dev-step-icon {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  background: #e9f3fe;
  border-radius: 10px;
  color: #156bd0;
  font-weight: 800;
  font-size: 1.25rem;
  margin: 19px 0;
}
.dev-steps h3 {
  color: #152f4d;
  font-size: 1.2rem;
  line-height: 1.35;
  margin: 0 0 10px;
}
.dev-steps p {
  color: #5b7189;
  font-size: .91rem;
  line-height: 1.65;
  margin: 0 0 18px;
}
.dev-steps a {
  color: #096bd5;
  text-decoration: none;
  font-weight: 700;
  font-size: .84rem;
  margin-top: auto;
}
.dev-steps a:hover {
  text-decoration: underline;
}
.dev-example {
  background: #f0f6fd;
}
.dev-example-grid {
  display: grid;
  grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
  gap: clamp(30px,5vw,80px);
  align-items: center;
}
.dev-example-copy h2 {
  max-width: 600px;
}
.dev-example-copy>p:not(.eyebrow) {
  color: #526b85;
  line-height: 1.75;
}
.dev-responsibility {
  display: grid;
  gap: 16px;
  margin: 25px 0;
}
.dev-responsibility>div {
  position: relative;
  border-left: 3px solid #1679dc;
  padding: 3px 0 3px 16px;
}
.dev-responsibility>div:nth-child(2) {
  border-color: #28936a;
}
.dev-responsibility strong {
  color: #163b5c;
}
.dev-responsibility p {
  margin: 5px 0 0;
  color: #5a7189;
  font-size: .89rem;
  line-height: 1.6;
}
.dev-resp-marker {
  display: none;
}
.dev-example-note {
  font-size: .82rem!important;
  color: #657f98!important;
}
.dev-code-panel {
  border-radius: 14px;
  overflow: hidden;
  background: #0c2038;
  box-shadow: 0 20px 45px rgba(8,30,60,.16);
  color: #eaf3ff;
}
.dev-code-top {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 19px;
  background: #132d4c;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .08em;
  color: #b6d0e9;
}
.dev-code-dots {
  display: flex;
  gap: 5px;
}
.dev-code-dots i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4c7299;
}
.dev-code-pill {
  margin-left: auto;
  border: 1px solid #54718d;
  border-radius: 99px;
  padding: 5px 8px;
  font-size: .56rem;
  color: #bfd2e4;
}
.dev-code-body {
  padding: 20px 10px 20px 0;
  overflow-x: auto;
}
.dev-code-line {
  display: flex;
  gap: 17px;
  align-items: baseline;
  min-width: 390px;
  padding: 11px 16px;
  font-size: .81rem;
  font-family: ui-monospace,SFMono-Regular,Consolas,monospace;
}
.dev-code-line:nth-child(even) {
  background: #102942;
}
.dev-line-no {
  color: #5f809f;
  font-size: .69rem;
  min-width: 20px;
  text-align: right;
}
.dev-code-line b {
  font-weight: 700;
}
.dev-code-line em {
  color: #afc9de;
  font-style: normal;
}
.dev-token-key {
  color: #7ec8ff;
}
.dev-token-flow {
  color: #a7c7ff;
}
.dev-token-app {
  color: #8fe0b6;
}
.dev-code-host {
  background: #153d3b!important;
}
.dev-code-bottom {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  padding: 13px 19px;
  border-top: 1px solid #294562;
  color: #b1c9df;
  font-size: .68rem;
}
.dev-legend {
  display: flex;
  align-items: center;
  gap: 7px;
}
.dev-legend i {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #6cb8ff;
}
.dev-legend i.app {
  background: #78d6a8;
}
.dev-resource-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 17px;
  margin-top: 28px;
}
.dev-resource-grid>a {
  display: flex;
  flex-direction: column;
  border: 1px solid #d8e5f4;
  border-radius: 12px;
  padding: 27px;
  text-decoration: none;
  min-height: 250px;
  background: #fff;
  transition: transform .2s,border-color .2s;
}
.dev-resource-grid>a:hover {
  border-color: #3187e4;
  transform: translateY(-3px);
}
.dev-resource-grid>a:focus-visible {
  outline: 3px solid #2b80dd;
  outline-offset: 3px;
}
.dev-resource-grid span {
  color: #0d6bda;
  font-size: .67rem;
  letter-spacing: .1em;
  font-weight: 800;
}
.dev-resource-grid h3 {
  color: #16304d;
  font-size: 1.23rem;
  margin: 18px 0 9px;
}
.dev-resource-grid p {
  color: #60768d;
  font-size: .91rem;
  line-height: 1.65;
  margin: 0 0 20px;
}
.dev-resource-grid strong {
  margin-top: auto;
  color: #0968d4;
  font-size: .84rem;
}
.dev-access {
  background: #eaf3fd;
}
.dev-access-grid {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr);
  align-items: center;
  gap: clamp(35px,7vw,110px);
}
.dev-access-grid p:not(.eyebrow) {
  color: #58728b;
  line-height: 1.75;
}
.dev-access-points {
  display: grid;
  gap: 12px;
  margin-top: 25px;
  color: #244b70;
  font-size: .9rem;
}
.dev-access-card {
  background: #fff;
  border: 1px solid #d2e3f4;
  border-radius: 13px;
  padding: 30px;
  box-shadow: 0 13px 33px rgba(20,50,90,.06);
}
.dev-access-card h3 {
  font-size: 1.35rem;
  color: #15304e;
  margin: 10px 0 23px;
}
.dev-access-card .button {
  display: block;
  text-align: center;
  margin: 11px 0;
}
.dev-access-card p:last-child {
  font-size: .76rem;
  line-height: 1.55;
  margin-top: 18px;
}
@media(max-width:980px) {
  .dev-steps {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .dev-steps article {
    min-height: 280px;
  }
  .dev-example-grid {
    grid-template-columns: 1fr;
  }
  .dev-access-grid {
    grid-template-columns: 1fr;
  }
}
@media(max-width:640px) {
  .dev-steps,.dev-resource-grid {
    grid-template-columns: 1fr;
  }
  .dev-steps article,.dev-resource-grid>a {
    min-height: 0;
  }
  .dev-hero-foot {
    flex-direction: column;
    gap: 10px;
  }
  .dev-code-line {
    font-size: .74rem;
    min-width: 360px;
  }
  .dev-code-top {
    gap: 7px;
    font-size: .57rem;
  }
  .dev-code-pill {
    font-size: .49rem;
  }
}
@media(prefers-reduced-motion:reduce) {
  .dev-resource-grid>a {
    transition: none;
  }
  .dev-resource-grid>a:hover {
    transform: none;
  }
}
/* v1.1.1 developer adoption policy */
.dev-access-grid .dev-access-card p {
  line-height: 1.6;
}
/* Developer account entry points — scoped to the public Developers page. */
.developer-account-bar {
  background: #f1f6fd;
  border-bottom: 1px solid #dce8f7;
}
.developer-account-inner {
  min-height: 55px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
}
.developer-account-inner>span {
  color: #526c8a;
  font-size: .81rem;
  font-weight: 700;
}
.developer-account-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.developer-account-actions a {
  font-size: .82rem;
  font-weight: 750;
  border-radius: 6px;
  padding: 9px 14px;
}
.developer-signin {
  color: #075ecb;
  border: 1px solid #b9d3f2;
  background: #fff;
}
.developer-create {
  background: #0966e6;
  color: #fff;
}
.developer-account-actions a:hover,.developer-account-actions a:focus-visible {
  outline: 2px solid #85baff;
  outline-offset: 2px;
}
.developer-doc-shortcut {
  margin-top: 17px!important;
  font-size: .88rem!important;
  color: #bfd3ea!important;
}
.developer-doc-shortcut a {
  color: #fff;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.developer-doc-shortcut span {
  white-space: nowrap;
}
.developer-card-signin {
  display: block;
  text-align: center;
  color: #075fcf;
  font-size: .88rem;
  font-weight: 750;
  padding: 10px 0;
}
.developer-card-signin:hover {
  text-decoration: underline;
}
@media(max-width:600px) {
  .developer-account-inner {
    justify-content: space-between;
    gap: 8px;
  }
  .developer-account-inner>span {
    font-size: .72rem;
  }
  .developer-account-actions {
    gap: 6px;
  }
  .developer-account-actions a {
    padding: 9px 8px;
    font-size: .73rem;
  }
  .developer-doc-shortcut span {
    white-space: normal;
  }
}
/* Developers-page authenticated controls (v1.1.6d). */
.developer-account-loading {
  color: #526c8a;
  font-size: .82rem;
}
.developer-account-actions .developer-logout-form {
  display: inline-flex;
  margin: 0;
}
.developer-account-actions .developer-logout-button {
  font: inherit;
  font-size: .82rem;
  font-weight: 750;
  border: 0;
  border-radius: 6px;
  padding: 9px 14px;
  cursor: pointer;
}
.developer-account-actions .developer-logout-button:hover,
.developer-account-actions .developer-logout-button:focus-visible {
  outline: 2px solid #85baff;
  outline-offset: 2px;
}
/* Legal links: allow footer navigation to wrap on narrow screens. */
.footer-inner>div {
  flex-wrap: wrap;
  row-gap: 10px;
}
.legal-content {
  overflow-wrap: anywhere;
}
/* Company and Contact v1 */
.company-story,.company-proof {
  background: #fff;
}
.company-values,.contact-main {
  background: #f2f7fd;
}
.company-split {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(30px,7vw,110px);
}
.company-split h2,.contact-intro h2 {
  font-size: clamp(1.9rem,3vw,3rem);
  line-height: 1.16;
}
.company-copy p,.contact-intro>p {
  color: #536780;
  line-height: 1.85;
  font-size: 1.05rem;
}
.company-copy .actions {
  margin-top: 28px;
}
.contact-hero .page-hero-inner {
  padding-bottom: 80px!important;
}
.contact-layout {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(32px,6vw,95px);
  align-items: start;
}
.contact-reasons {
  margin-top: 36px;
}
.contact-reasons>div {
  padding: 18px 0;
  border-top: 1px solid #d4e1ef;
}
.contact-reasons strong {
  color: #183653;
}
.contact-reasons p,.contact-help {
  color: #536780;
  line-height: 1.65;
}
.contact-help {
  margin-top: 32px;
}
.contact-help a,.contact-privacy a {
  color: #075fce;
}
.contact-panel {
  background: white;
  border: 1px solid #d7e4f3;
  border-radius: 17px;
  padding: clamp(24px,4vw,46px);
  box-shadow: 0 18px 55px rgba(17,45,80,.06);
}
.contact-panel h2 {
  margin: 0 0 9px;
  font-size: 1.7rem;
}
.contact-panel>p {
  color: #60758d;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 24px;
}
.contact-form label {
  font-weight: 700;
  font-size: .9rem;
  color: #183653;
  margin-top: 9px;
}
.contact-form input,.contact-form select,.contact-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 13px 14px;
  border: 1px solid #b9cde3;
  border-radius: 9px;
  background: #fff;
  color: #162b45;
  font: inherit;
}
.contact-form textarea {
  resize: vertical;
}
.contact-form :is(input,select,textarea):focus-visible {
  outline: 3px solid #b5d9ff;
  outline-offset: 1px;
  border-color: #126ee1;
}
.contact-privacy {
  font-size: .82rem;
  color: #61768d;
  line-height: 1.6;
}
.contact-form button {
  align-self: flex-start;
  cursor: pointer;
}
.contact-trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
@media(max-width:800px) {
  .company-split,.contact-layout {
    grid-template-columns: 1fr;
  }
  .contact-hero .page-hero-inner {
    padding-bottom: 64px!important;
  }
}
/* Company v2 — mission, experience and Zero UI */
.company-vision-hero h1 {
  max-width: 940px;
  font-size: clamp(2.8rem,5.2vw,5.2rem);
  line-height: 1.07;
  letter-spacing: -.045em;
}
.company-vision-hero .hero-lead {
  max-width: 760px;
}
.company-hero-belief {
  color: #d9eaff;
  font-weight: 750;
  font-size: 1.05rem;
  margin: 22px 0 0;
}
.company-mission,.company-contribution {
  background: #fff;
}
.company-experience {
  background: #eaf3fd;
}
.company-experience-grid {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: clamp(40px,7vw,115px);
  align-items: center;
}
.company-years {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.company-years strong {
  font-size: clamp(6rem,14vw,12rem);
  font-weight: 850;
  letter-spacing: -.09em;
  line-height: 1;
  color: #0d5fca;
}
.company-years strong span {
  font-size: .46em;
  vertical-align: top;
  letter-spacing: 0;
}
.company-years>span {
  font-size: 1.12rem;
  font-weight: 800;
  color: #173a61;
  margin-top: 12px;
}
.company-future {
  background: #f5f8fc;
}
.company-section-lead {
  max-width: 810px;
  color: #536780;
  font-size: 1.12rem;
  line-height: 1.8;
}
.company-future-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
  margin: 36px 0 28px;
}
.company-future-grid article {
  background: #fff;
  border: 1px solid #d9e5f2;
  border-radius: 12px;
  padding: 27px;
}
.company-future-grid h3 {
  color: #15314e;
  margin: 18px 0 10px;
}
.company-future-grid p,.company-zero-note {
  color: #536780;
  line-height: 1.75;
}
.company-zero-note {
  max-width: 900px;
  font-size: .98rem;
}
.company-zero-note strong {
  color: #173a61;
}
.company-secondary-link {
  border-color: #8db4e2;
  color: #075fce;
}
.company-closing {
  background: #eaf3fd;
}
@media(min-width:1100px) {
  .main-nav .nav-company-start {
    margin-left: 12px;
  }
}
@media(max-width:850px) {
  .company-experience-grid,.company-future-grid {
    grid-template-columns: 1fr;
  }
  .company-years strong {
    font-size: 7rem;
  }
  .company-future-grid {
    gap: 12px;
  }
}
/* Website v2 — discoverability only; existing site layout preserved. */
.education-entry-section {
  background: #f2f7fd;
}
.education-entry-layout {
  display: grid;
  grid-template-columns: 1.4fr .8fr;
  gap: clamp(25px,5vw,80px);
  align-items: center;
}
.education-entry-section h2,.education-bridge h2,.education-dev-shortcut h2 {
  max-width: 780px;
  font-size: clamp(1.9rem,3.3vw,2.85rem);
}
.education-entry-section p:not(.eyebrow),.education-bridge p:not(.eyebrow),.education-dev-shortcut p:not(.eyebrow) {
  color: #536780;
  line-height: 1.78;
  max-width: 790px;
}
.education-entry-actions {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 24px;
}
.education-entry-textlink {
  color: #075fce;
  font-size: .94rem;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.education-entry-facts {
  border: 1px solid #d5e3f1;
  background: #fff;
  border-radius: 15px;
  padding: 20px 26px;
  box-shadow: 0 16px 48px #1a3f720a;
}
.education-entry-facts>div {
  padding: 16px 0;
  display: grid;
  gap: 6px;
  border-bottom: 1px solid #e5eef7;
}
.education-entry-facts>div:last-child {
  border: 0;
}
.education-entry-facts strong {
  color: #14385d;
  font-size: 1rem;
}
.education-entry-facts span {
  color: #5b728a;
  font-size: .92rem;
}
.education-bridge-section {
  background: #eef5fe;
}
.education-bridge {
  display: grid;
  grid-template-columns: 1fr .65fr;
  gap: clamp(26px,6vw,90px);
  align-items: center;
}
.education-bridge-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.education-bridge-links a {
  background: #fff;
  padding: 20px;
  border-radius: 9px;
  border: 1px solid #d2e1f1;
  color: #075fce;
  font-weight: 750;
  font-size: .91rem;
}
.education-bridge-links a:hover {
  border-color: #91bce9;
  background: #f9fcff;
}
.education-dev-shortcut {
  background: #eff6fd;
}
@media(max-width:850px) {
  .education-entry-layout,.education-bridge {
    grid-template-columns: 1fr;
  }
}
@media(max-width:520px) {
  .education-entry-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .education-entry-actions .button {
    width: 100%;
  }
  .education-bridge-links {
    grid-template-columns: 1fr;
  }
}
/* Website v2 integration QA: show existing mobile navigation on small tablets.
   Original seven-link desktop menu overflowed between 761 and ~830px. */
@media (min-width:761px) and (max-width:960px) {
  .site-header .menu-toggle {
    display: flex;
    width: 44px;
    height: 44px;
    background: white;
    border: 1px solid #d8e3f0;
    border-radius: 6px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
  }
  .site-header .menu-toggle span {
    width: 19px;
    height: 2px;
    background: #10213c;
  }
  .site-header .main-nav {
    display: none;
    position: absolute;
    top: 76px;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 16px 24px #0002;
    padding: 18px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .site-header .main-nav.open {
    display: flex;
  }
  .site-header .main-nav a {
    padding: 13px 12px;
  }
  .site-header .main-nav .nav-contact {
    text-align: center;
    margin-top: 9px;
  }
}