/* Version 2: readable at 2K, composed at laptop size, comfortable on mobile. */
:root {
  --copy-size: clamp(18px, calc(14px + .3125vw), 22px);
  --lead-size: clamp(21px, calc(14px + .46875vw), 26px);
  --small-size: clamp(14px, calc(9px + .35vw), 18px);
  --label-size: clamp(13px, calc(9px + .28vw), 16px);
  --h2-size: clamp(42px, calc(26px + 2.5vw), 88px);
  --h3-size: clamp(26px, calc(18px + .55vw), 32px);
  --section-space: clamp(108px, 7vw, 168px);
}

body { font-size: var(--copy-size); }
.skip-link:not(:focus) { clip-path: inset(50%); }
.wrap { width: min(calc(100% - clamp(64px, 8vw, 240px)), 1880px); }
.section { padding-block: var(--section-space); }
h2, .display, .section-heading h2, .about h2, .data-copy h2 { font-size: var(--h2-size); }
h3, .pain h3 { font-size: var(--h3-size); }
.eyebrow { font-size: var(--label-size); margin-bottom: 30px; letter-spacing: .11em; }
.lead, .section-intro { font-size: var(--lead-size); line-height: 1.65; }
.section-intro { max-width: 65ch; }

/* Product wordmark replaces the company wordmark in the navigation only. */
.header-inner { height: clamp(94px, 6.3vw, 132px); gap: clamp(25px, 2vw, 48px); }
.product-brand { font-size: clamp(24px, 1.35vw, 34px); letter-spacing: -.065em; font-weight: 800; }
.product-brand .brand-accent, .product-brand .brand-dot { color: #b19dff; }
.nav { font-size: var(--small-size); gap: clamp(28px, 2vw, 48px); }
.lang { font-size: var(--label-size); gap: 10px; }
.lang a { padding: 8px 3px; }
.lang a:hover { color: #d4caff; }

/* Procedural light sculpture; the original artwork remains as a static fallback. */
.hero { min-height: 0; padding: clamp(170px, 10vw, 240px) 0 0; }
.hero-art { inset: -3%; transform: none; will-change: auto; }
.hero-art { background: radial-gradient(ellipse at 81% 48%, #201840 0, #0c1424 34%, #080a0f 70%); }
.hero-art > img { transition: opacity 1.2s ease; }
.hero-art canvas.hero-vfx-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; transition: opacity 1.2s ease; mask-image: linear-gradient(90deg, transparent 16%, #000 60%); }
.has-orbital-vfx .hero-art > img { opacity: 0; }
.has-orbital-vfx .hero-art canvas.hero-vfx-canvas { opacity: 1; }
.hero-motion-toggle { position: absolute; right: 0; bottom: 0; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; color: #d2d6ee; background: #14182c88; border: 1px solid #a5b4dc40; border-radius: 50%; backdrop-filter: blur(10px); }
.hero-motion-toggle:hover { background: #353056; border-color: #aea0e6; }
.hero-motion-toggle svg { width: 20px; height: 20px; stroke-width: 1.6; }
.hero-motion-toggle .motion-play, .hero-motion-toggle[aria-pressed=true] .motion-pause { display: none; }
.hero-motion-toggle[aria-pressed=true] .motion-play { display: block; }
@media (max-width: 600px) { .hero-motion-toggle { bottom: -58px; } }
@media (prefers-reduced-motion: reduce) { .hero-art > img, .hero-art canvas.hero-vfx-canvas { transition: none; } }
.hero-content { padding-bottom: 0; }
.hero h1 { font-size: clamp(62px, 6.4vw, 144px); line-height: 1.035; max-width: 1500px; letter-spacing: -.06em; }
.hero-lead { font-size: var(--lead-size); max-width: 48ch; margin-top: clamp(28px, 2vw, 48px); line-height: 1.65; }
.hero-actions { margin-top: clamp(32px, 2.5vw, 54px); }
.btn { font-size: clamp(16px, 1vw, 20px); min-height: clamp(60px, 4vw, 78px); padding: 18px 30px; gap: 26px; }
.btn .icon { width: 23px; height: 23px; }
.btn--primary {
  color: #fff;
  font-weight: 700;
  background: linear-gradient(115deg, #7653df, #5941bd);
  border-color: #b69cfb;
  box-shadow: 0 0 0 4px #9570f111, 0 12px 36px #6d3fdd35, inset 0 1px 0 #d6caff55;
}
.btn--primary:hover, .btn--primary:focus-visible { background: linear-gradient(115deg, #8461ed, #6248ce); box-shadow: 0 0 0 5px #a586ff18, 0 15px 48px #7850dd66; }
.btn--primary .icon { width: 26px; height: 26px; }

/* A dedicated entry band gives the two routes a title and their own space. */
.hero-entry-band { position: relative; margin-top: clamp(76px, 5.5vw, 124px); padding: clamp(34px, 2.5vw, 54px) 0; background: #080c14d9; border-top: 1px solid #a8b8ed26; }
.hero-entry-layout { display: grid; grid-template-columns: .65fr 2fr; gap: 60px; align-items: center; }
.hero-entry-title { font-size: clamp(26px, 1.8vw, 42px); max-width: 13ch; line-height: 1.15; font-weight: 500; letter-spacing: -.045em; }
.hero-doors { width: 100%; max-width: none; margin: 0; gap: 24px; }
.hero-door { min-height: clamp(120px, 8vw, 160px); padding: clamp(23px, 1.7vw, 38px); gap: 22px; }
.hero-door strong { font-size: clamp(21px, 1.25vw, 28px); }
.hero-door small { font-size: var(--small-size); max-width: 32ch; line-height: 1.6; margin-top: 9px; }
.hero-door > .icon:first-child { display: block; width: 29px; height: 29px; }
.hero-door .door-arrow { width: 21px; height: 21px; }
.hero-or { font-size: var(--label-size); }

/* Two independent studies give context to adoption and business outcomes. */
.research { margin-top: 44px; padding: clamp(26px, 2.5vw, 48px); border: 1px solid #ded9ed; border-radius: 20px; background: #f5f3fa; }
.research-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(30px, 4vw, 76px); }
.research-stat { display: flex; align-items: flex-start; gap: clamp(20px, 2vw, 38px); min-width: 0; }
.research-number { flex: none; color: #6651cc; font-size: clamp(58px, 4.5vw, 94px); line-height: .95; letter-spacing: -.06em; font-weight: 500; }
.research-number span { font-size: .5em; letter-spacing: -.03em; }
.research-stat p { color: #525b69; font-size: var(--copy-size); line-height: 1.6; margin: 0; }
.research-stat a { display: inline-block; margin-top: 15px; color: #5842b1; font-size: var(--small-size); line-height: 1.6; text-decoration: underline; text-underline-offset: 3px; }
.research-stat a:hover { color: #33206f; }
.research-note { margin: 28px 0 0; padding-top: 18px; border-top: 1px solid #ded9ed; color: #697184; font-size: var(--small-size); line-height: 1.6; }
.pains { margin-top: 68px; gap: clamp(36px, 3vw, 72px); }
.pain { padding-left: 36px; }
.pain p { font-size: var(--copy-size); max-width: 44ch; line-height: 1.75; }
.mini-index { font-size: var(--label-size); }
.pain h3 { margin-bottom: 24px; }

/* The core product gets a typographic identity, not a small label. */
.definition { background: #f2f2f9; }
.definition-grid { grid-template-columns: 1.2fr 1fr; gap: clamp(65px, 5vw, 120px); }
.definition h2 { max-width: 850px; }
.definition-prefix { display: block; font-size: clamp(25px, 1.9vw, 42px); margin-bottom: 18px; letter-spacing: -.035em; font-weight: 500; }
.definition .product-title { display: block; color: #6651cc; font-size: clamp(56px, 4.25vw, 104px); line-height: 1.025; letter-spacing: -.055em; }
.product-period { color: #9a80e5; }
.definition .def { font-size: var(--lead-size); max-width: 56ch; margin-top: 34px; line-height: 1.7; }
.definition .def-autonomy { margin-top: 20px; }
.definition .def strong { color: #5c48b8; font-weight: 500; }
.definition-art { min-height: clamp(400px, 29vw, 660px); }
.glass-tile { width: clamp(126px, 9vw, 205px); height: clamp(145px, 10.5vw, 240px); border-radius: 28px; }
.glass-tile svg { width: clamp(50px, 3.5vw, 78px); height: clamp(50px, 3.5vw, 78px); }
.art-orbit { width: 88%; height: 55%; top: 25%; }
.orbit-two { height: 72%; top: 15%; }
.art-caption { font-size: var(--label-size); bottom: 36px; left: 36px; }
.facts { margin-top: clamp(70px, 5vw, 120px); gap: 42px; }
.facts li { font-size: var(--small-size); padding-top: 25px; }
.facts b { font-size: clamp(21px, 1.2vw, 28px); margin-bottom: 10px; }
.facts li > span { font-size: var(--label-size); margin-bottom: 25px; }

/* Context for the program, kept within the introduction rather than module cards. */
.definition-details { list-style: none; margin: 30px 0 0; padding: 0; max-width: 58ch; display: grid; gap: 14px; }
.definition-details li { position: relative; padding-left: 19px; color: #525b69; font-size: clamp(16px, 1vw, 21px); line-height: 1.6; }
.definition-details li::before { content: ""; position: absolute; left: 0; top: .65em; width: 5px; height: 5px; border-radius: 50%; background: #806acb; }
.definition-details b { color: #34334d; font-weight: 600; }
.definition-details b::after { content: " — "; font-weight: 400; color: #807790; }

/* A lavender chapter separates the dark modules from the light use cases. */
.comparison { background: #e1daf5; background-image: radial-gradient(ellipse at 100% 0%, #eee9fc 0%, transparent 65%); }
.comparison .eyebrow, .comparison .purple-text { color: #5b43ad; }
.comparison .section-heading .lead { color: #4c4862; }
.comparison .compare-scroll { max-width: 100%; border-color: #bfb2dd; background: #f6f3fc; }
.comparison .compare th, .comparison .compare td { border-bottom-color: #d9d0eb; }
.comparison .compare thead th:last-child { background: #d3c6ee; color: #3e2d71; }
.comparison .compare td:last-child { background: #eae2f7; color: #343047; }
.comparison .table-hint { color: #625975; }

.section-heading { grid-template-columns: 1.6fr 1fr; gap: 85px; margin-bottom: 66px; }
.section-heading .lead { font-size: var(--copy-size); max-width: 43ch; }
.compare { font-size: var(--copy-size); min-width: 880px; }
.compare th, .compare td { padding: clamp(24px, 1.9vw, 42px); }
.compare thead th { font-size: clamp(18px, 1.15vw, 26px); padding-block: 34px; }
.compare td:last-child { padding-left: 70px; }
.compare td:last-child .icon { left: 32px; width: 22px; height: 22px; }
.table-label { font-size: var(--label-size); }
.table-hint { font-size: 14px; }

.path-heading h2 { font-size: var(--h2-size); }
.path-heading .lead { font-size: var(--lead-size); max-width: 65ch; }
.path { margin-top: clamp(65px, 4.2vw, 105px); }
.path-label { font-size: var(--small-size); margin-bottom: 36px; }
.fork { gap: clamp(60px, 4vw, 90px); }
.entry-card { padding: clamp(36px, 2.6vw, 60px); border-radius: 26px; }
.entry-top { margin-bottom: 38px; }
.door { font-size: var(--label-size); }
.entry-symbol { width: 40px; height: 40px; }
.entry-card h3 { font-size: clamp(42px, 3.15vw, 70px); }
.chips { gap: 10px; margin: 26px 0 30px; }
.chips li { font-size: var(--small-size); padding: 8px 14px; }
.promise { font-size: var(--lead-size); max-width: 42ch; margin-bottom: 32px; }
.gets li { font-size: var(--copy-size); padding: 16px 0 16px 30px; }
.gets li::before { font-size: 18px; }
.how summary { font-size: var(--copy-size); padding-block: 21px; }
.how ol { font-size: var(--small-size); padding-left: 1.3em; }
.how li { padding-block: 9px; }
.leads-to { font-size: var(--small-size); margin-top: 17px; }
.or { font-size: var(--small-size); padding: 10px 18px; }
.connection > p { font-size: var(--small-size); top: 12px; }
.next { gap: 45px; }
.next-card { padding-top: 37px; }
.next-card h3 { font-size: clamp(34px, 2vw, 48px); }
.step-label { font-size: var(--label-size); margin-bottom: 22px; }
.next-card .kind { font-size: var(--small-size); margin-bottom: 20px; }
.next-card p:last-of-type { font-size: var(--copy-size); max-width: 43ch; }
.next-arrow { right: -35px; width: 24px; height: 24px; top: -13px; }
.path-foot { margin-top: 65px; }
.path-foot p { font-size: var(--copy-size); }

.cases { grid-template-columns: repeat(4, 1fr); gap: 28px; }
.case { display: block; }
.case-visual { height: clamp(220px, 13vw, 320px); }
.case-copy { padding: 30px; }
.case-number { font-size: var(--label-size); margin-bottom: 21px; }
.case h3 { font-size: var(--h3-size); min-height: 2.5em; margin-bottom: 20px; }
.case p { font-size: var(--copy-size); line-height: 1.75; }
.measurement { margin-top: 55px; padding-top: 42px; gap: 32px; }
.measurement h3 { font-size: var(--h3-size); }
.measurement p { font-size: var(--copy-size); max-width: 75ch; margin-top: 12px; }
.measurement-mark { width: 58px; height: 58px; font-size: 32px; }

.trust-grid { gap: clamp(75px, 5vw, 120px); }
.checks { margin-top: 45px; }
.checks li { padding: 26px 0 26px 35px; }
.checks li::before { top: 27px; font-size: 20px; }
.checks b { font-size: var(--copy-size); margin-bottom: 9px; }
.checks span { font-size: var(--copy-size); max-width: 48ch; }
.people-copy { padding: clamp(35px, 2.5vw, 58px); }
.people-copy h2 { font-size: clamp(34px, 2.4vw, 54px); }
.people-copy p { font-size: var(--copy-size); }
.people-copy .people-note { font-size: var(--small-size); padding-top: 25px; }
.team-photo figcaption { font-size: clamp(12px, .6vw, 14px); }
.about-grid { gap: 120px; }
.about-copy > p { font-size: var(--lead-size); max-width: 47ch; }
.about-copy > p:nth-child(2) { font-size: var(--copy-size); }
.about-stats { gap: 75px; margin-top: 45px; }
.about-stats strong { font-size: clamp(64px, 4vw, 92px); }
.about-stats strong > span { font-size: .65em; }
.about-stats div > span { font-size: var(--small-size); }
.clients > p { font-size: var(--small-size); }
.clients ul { font-size: clamp(24px, 1.4vw, 34px); gap: 30px; flex-wrap: wrap; }
.clients li:nth-child(7) { font-size: var(--small-size); max-width: 140px; }

.faq-grid { grid-template-columns: 1fr 1.6fr; gap: 100px; }
.faq-intro h2 { font-size: var(--h2-size); }
.faq-intro .lead { font-size: var(--copy-size); max-width: 32ch; }
.faq summary { font-size: var(--copy-size); padding: 30px 45px 30px 0; }
.faq summary::after { font-size: 26px; top: 28px; }
.faq details p { font-size: var(--copy-size); max-width: 65ch; line-height: 1.8; padding-bottom: 22px; }

.contact-grid { gap: clamp(85px, 6vw, 140px); }
.contact h2 { font-size: clamp(54px, 4.1vw, 96px); }
.contact-copy > .lead { font-size: var(--lead-size); max-width: 42ch; margin-top: 40px; }
.contact-points { margin-block: 38px; }
.contact-points li { font-size: var(--copy-size); padding: 12px 0 12px 30px; }
.contact-email { font-size: var(--copy-size); }
form { padding: clamp(36px, 2.6vw, 62px); }
.form-heading p { font-size: clamp(25px, 1.6vw, 36px); }
.form-heading > span:last-child { font-size: var(--label-size); padding: 6px 12px; }
.form-heading { margin-bottom: 38px; }
.row { grid-template-columns: 1fr 1fr; gap: 22px; }
.field { margin-bottom: 26px; }
label { font-size: var(--small-size); margin-bottom: 10px; }
.opt { font-size: var(--label-size); }
input, select, textarea { font-size: var(--copy-size); padding: 15px 16px; border-radius: 9px; }
textarea { min-height: 125px; }
textarea::placeholder { font-size: var(--small-size); }
.hint, .err { font-size: var(--label-size); margin-top: 9px; }
.consent { font-size: var(--small-size); gap: 13px; }
.consent input { width: 20px; height: 20px; margin-top: 4px; }
form .btn { min-height: 64px; font-size: clamp(17px, 1.1vw, 23px); padding: 17px 23px; }
.form-status { font-size: var(--small-size); }
.todo, .consent .todo, .form-setup .todo, .footer-bottom .todo, .social-todo .todo { font-size: 12px; }
.form-setup { margin-top: 19px; }
.site-footer { padding: 60px 0 30px; }
.site-footer .brand { font-size: clamp(26px, 1.5vw, 35px); }
.footer-top > p { font-size: var(--small-size); }
.footer-bottom { font-size: var(--label-size); }
.footer-links { font-size: var(--label-size); }
.back-top { width: 48px; height: 48px; font-size: 25px; }
.social-todo { margin-top: 20px; }

/* Original client marks: one restrained monochrome treatment, no redrawing. */
.clients .client-logos { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 18px; list-style: none; padding: 0; margin-top: 35px; }
.clients .client-logo, .clients .client-logo:nth-child(7) { height: 130px; max-width: none; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #a2b3d124; }
.client-logo img { width: 140px; height: 140px; max-width: 100%; object-fit: contain; filter: brightness(0) invert(1); opacity: .78; transition: opacity .25s; }
.client-logo:hover img { opacity: 1; }
.client-logo--bmw img, .client-logo--eni img { width: 116px; height: 116px; }
.client-logo--ferrovie-dello-stato img { width: 125px; height: auto; }
.client-logo--enea img { width: 132px; height: auto; }
.form-purpose { color: #697184; font-size: var(--small-size); line-height: 1.6; margin-bottom: 25px; }
.form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.consent a { color: #5742b4; text-decoration: underline; text-underline-offset: 3px; }
.form-status[data-kind=success] { background: #eaf5ed; border: 1px solid #87b995; color: #245a35; padding: 16px; border-radius: 10px; }
.form-status[data-kind=error] { color: #9a3036; }
form[aria-busy=true] .btn { opacity: .7; cursor: progress; }
.footer-bottom > p { line-height: 1.9; }
@media (max-width: 1500px) { .clients .client-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 45px; } }
@media (max-width: 600px) { .clients .client-logos { gap: 12px; } .clients .client-logo, .clients .client-logo:nth-child(7) { height: 98px; } .client-logo img { width: 112px; height: 112px; } .client-logo--ferrovie-dello-stato img { width: 96px; height: auto; } }

@media (max-width: 1500px) {
  .hero-entry-layout { grid-template-columns: 1fr; gap: 28px; }
  .hero-entry-title { max-width: none; }
  .hero-door { min-height: 120px; }
  .definition-grid { gap: 60px; }
  .cases { grid-template-columns: repeat(2, 1fr); }
  .case { display: grid; grid-template-columns: .8fr 1fr; }
  .case-visual { height: 100%; min-height: 280px; }
  .case h3 { min-height: 0; }
  .section-heading { gap: 65px; }
  .contact h2 { font-size: clamp(50px, 4.1vw, 68px); }
  .contact-grid { gap: 70px; }
  .contact .row { grid-template-columns: 1fr; }
  .about-grid { gap: 80px; }
}

@media (max-width: 1100px) {
  .wrap { width: calc(100% - 64px); }
  .header-inner { gap: 22px; }
  .product-brand { font-size: 25px; }
  .nav { font-size: 14px; gap: 20px; }
  .lang { font-size: 13px; }
  .hero { padding-top: 155px; }
  .hero h1 { font-size: clamp(62px, 7vw, 82px); }
  .hero-art { inset: -3% -14% -3% -15%; opacity: 1; }
  .hero-art img { object-position: center 52%; }
  .definition-grid { gap: 40px; }
  .definition .product-title { font-size: 54px; }
  .glass-tile { width: 110px; height: 135px; }
  .definition-art { min-height: 390px; }
  .facts { grid-template-columns: 1fr 1fr; gap: 35px; }
  .research-stat { flex-direction: column; gap: 18px; }
  .pains { gap: 30px; }
  .pain { padding-left: 26px; }
  .pain h3 { font-size: 24px; }
  .section-heading { grid-template-columns: 1fr; gap: 28px; }
  .section-heading .lead { max-width: 58ch; }
  .entry-card { padding: 30px; }
  .fork { gap: 45px; }
  .entry-card h3 { font-size: 39px; }
  .door { font-size: 12px; }
  .entry-top { gap: 12px; }
  .entry-symbol { width: 30px; height: 30px; }
  .chips li { font-size: 13px; }
  .promise { font-size: 20px; }
  .gets li { font-size: 17px; }
  .next { gap: 30px; }
  .next-card h3 { font-size: 30px; }
  .next-card p:last-of-type { font-size: 17px; }
  .next-arrow { right: -28px; }
  .case { display: block; }
  .case-visual { height: 240px; min-height: 0; }
  .trust-grid { gap: 40px; }
  .people-copy { padding: 30px; }
  .people-copy h2 { font-size: 32px; }
  .about-grid { gap: 50px; }
  .about-stats { gap: 40px; }
  .faq-grid { gap: 55px; }
  .contact-grid { grid-template-columns: 1fr; gap: 55px; }
  .contact-copy { max-width: 850px; }
  .contact-copy h2 br { display: none; }
  .contact-copy > .lead { max-width: 58ch; }
  .contact form { max-width: 850px; width: 100%; }
  .contact .row { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
  .header-inner { height: 86px; }
  .menu-toggle { display: flex; flex-direction: column; gap: 5px; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid #69718966; border-radius: 50%; background: #131a2780; color: white; order: 4; padding: 0; z-index: 22; flex: none; }
  .menu-toggle span { width: 14px; height: 1px; background: currentColor; transition: transform .25s; }
  .menu-toggle[aria-expanded=true] span:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .lang { margin-left: auto; }
  .nav { display: none; position: absolute; top: 86px; left: 24px; right: 24px; flex-direction: column; margin: 0; padding: 20px; border: 1px solid #59627c88; border-radius: 16px; background: #111620f5; backdrop-filter: blur(15px); box-shadow: 0 20px 60px #0008; font-size: 18px; gap: 6px; }
  .nav a { padding: 10px; }
  .nav.is-open { display: flex; }
  .definition-grid, .trust-grid, .about-grid, .faq-grid { grid-template-columns: 1fr; }
  .definition-art { min-height: 420px; }
  .glass-tile { width: 150px; height: 175px; }
  .definition .product-title { font-size: 68px; }
  .definition .def { max-width: 60ch; }
  .pains { grid-template-columns: 1fr; }
  .pain, .pain:first-child { padding: 28px 0 0 50px; border: 0; border-top: 1px solid #dfe2e9; position: relative; }
  .mini-index { position: absolute; left: 0; top: 31px; }
  .pain p { max-width: 58ch; }
  .pain h3 br { display: none; }
  .hero-entry-title { font-size: 28px; }
  .hero-doors { gap: 15px; }
  .hero-door { padding: 22px; gap: 12px; }
  .hero-door > .icon:first-child { display: none; }
  .hero-door strong { font-size: 21px; }
  .hero-door small { font-size: 15px; }
  .hero-or { font-size: 13px; }
  .fork { display: flex; flex-direction: column; gap: 24px; }
  .or { position: relative; top: auto; left: auto; transform: none; align-self: center; margin: 16px 0; box-shadow: none; }
  .entry-card { padding: 36px; width: 100%; }
  .entry-card h3 br { display: none; }
  .entry-card h3 { font-size: 44px; }
  .door { font-size: 13px; }
  .entry-symbol { width: 36px; height: 36px; }
  .chips li { font-size: 14px; }
  .gets li { font-size: 18px; }
  .merge { display: none; }
  .connection { height: 100px; }
  .connection::before { content: ""; position: absolute; left: 24px; top: 0; bottom: 0; width: 1px; background: linear-gradient(#657897,#b5c9f2); }
  .connection::after { content: ""; position: absolute; left: 21px; bottom: 0; width: 7px; height: 7px; border-radius: 50%; background: #c8d6ff; }
  .connection > p { top: 34px; left: 40px; transform: none; padding: 0 10px; font-size: 14px; background: var(--dark); }
  .next { grid-template-columns: 1fr; gap: 25px; }
  .next-card { margin-left: 24px; padding: 7px 6px 27px 28px; border-top: 0; border-left: 1px solid #67779c66; }
  .next-card::before { left: -4px; top: 8px; }
  .next-card h3 { font-size: 34px; }
  .next-card p:last-of-type { font-size: 18px; max-width: 58ch; }
  .next-arrow { top: auto; bottom: -18px; left: -12px; right: auto; transform: rotate(90deg); }
  .faq-intro { position: static; }
  .faq-intro .lead { max-width: 50ch; }
  .faq-intro h2 br { display: none; }
  .about-copy > p { max-width: 60ch; }
}

@media (max-width: 600px) {
  :root { --copy-size: 17px; --lead-size: 19px; --small-size: 15px; --label-size: 12px; --h2-size: 40px; --h3-size: 25px; --section-space: 80px; }
  .wrap { width: calc(100% - 40px); }
  .header-inner { height: 90px; gap: 12px; }
  .product-brand { white-space: normal; max-width: 205px; font-size: 22px; line-height: 1.06; }
  .product-brand .brand-accent { white-space: nowrap; }
  .lang { font-size: 12px; gap: 6px; }
  .menu-toggle { width: 35px; height: 35px; }
  .nav { top: 90px; left: 20px; right: 20px; }
  .hero { padding-top: 143px; }
  .hero h1 { font-size: clamp(44px, 10.7vw, 62px); line-height: 1.05; }
  .hero h1 br { display: none; }
  .hero-lead { font-size: 18px; line-height: 1.7; margin-top: 26px; max-width: 40ch; }
  .hero-art { inset: 0 -43% 8% -65%; opacity: .75; }
  .hero-art img { object-position: 83% center; }
  .hero-actions { margin-top: 30px; }
  .hero-actions > .btn { min-height: 60px; font-size: 15px; padding: 16px 23px; gap: 22px; }
  .btn--primary .icon { width: 22px; height: 22px; }
  .hero-entry-band { margin-top: 55px; padding: 30px 0 34px; }
  .hero-entry-layout { gap: 25px; }
  .hero-entry-title { font-size: 26px; }
  .hero-doors { grid-template-columns: 1fr; gap: 0; }
  .hero-door { padding: 23px; min-height: 126px; gap: 15px; }
  .hero-door > .icon:first-child { display: block; width: 25px; height: 25px; }
  .hero-door strong { font-size: 21px; }
  .hero-door small { font-size: 15px; margin-top: 7px; }
  .hero-or { margin: 7px 0; padding-inline: 12px; font-size: 12px; }
  .hero-door .door-arrow { width: 18px; height: 18px; }
  .research { margin-top: 32px; padding: 26px 24px; border-radius: 16px; }
  .research-grid { grid-template-columns: 1fr; gap: 28px; }
  .research-stat + .research-stat { padding-top: 28px; border-top: 1px solid #ded9ed; }
  .research-number { font-size: 64px; }
  .research-stat a, .research-note { font-size: 14px; }
  .research-note { margin-top: 24px; }
  .pains { margin-top: 40px; gap: 25px; }
  .pain, .pain:first-child { padding-left: 38px; }
  .pain h3 { font-size: 25px; margin-bottom: 14px; }
  .pain p { font-size: 17px; }
  .definition-prefix { font-size: 24px; margin-bottom: 14px; }
  .definition .product-title { font-size: clamp(45px, 11.7vw, 64px); }
  .definition .def { font-size: 19px; margin-top: 26px; }
  .definition .def-autonomy { margin-top: 18px; }
  .definition-art { min-height: 335px; }
  .glass-tile { width: 103px; height: 126px; }
  .glass-tile svg { width: 40px; height: 40px; }
  .art-caption { font-size: 12px; left: 23px; bottom: 25px; }
  .facts { gap: 28px 22px; margin-top: 40px; }
  .facts li { font-size: 15px; padding-top: 18px; }
  .facts b { font-size: 18px; margin-bottom: 8px; }
  .facts li > span { font-size: 12px; margin-bottom: 17px; }
  .section-heading { gap: 25px; margin-bottom: 36px; }
  .section-heading h2 { font-size: 39px; }
  .section-heading .lead { font-size: 18px; }
  .compare { min-width: 800px; font-size: 16px; }
  .compare td, .compare th { padding: 23px; }
  .compare thead th { font-size: 18px; }
  .compare td:last-child { padding-left: 52px; }
  .compare td:last-child .icon { width: 18px; height: 18px; left: 22px; }
  .table-label { font-size: 12px; }
  .table-hint { font-size: 12px; }
  .path-heading h2 { font-size: 42px; }
  .path-heading .lead { font-size: 18px; }
  .path { margin-top: 40px; }
  .path-label { font-size: 13px; gap: 8px; }
  .path-label span { width: 20px; }
  .entry-card { padding: 28px 25px; border-radius: 20px; }
  .entry-top { margin-bottom: 28px; }
  .entry-symbol { width: 29px; height: 29px; }
  .door { font-size: 11px; }
  .entry-card h3 { font-size: 39px; }
  .chips { gap: 7px; margin: 23px 0; }
  .chips li { font-size: 13px; padding: 7px 10px; }
  .promise { font-size: 19px; }
  .gets li { font-size: 16px; padding: 14px 0 14px 25px; }
  .how summary { font-size: 17px; }
  .how ol { font-size: 16px; }
  .leads-to { font-size: 14px; }
  .or { font-size: 14px; padding: 8px 14px; }
  .connection > p { font-size: 12px; left: 32px; }
  .next-card .step-label { font-size: 12px; }
  .next-card .kind { font-size: 15px; }
  .next-card p:last-of-type { font-size: 17px; }
  .path-foot { margin-top: 28px; padding-top: 26px; }
  .path-foot p { font-size: 17px; }
  .cases { grid-template-columns: 1fr; gap: 26px; }
  .case { display: block; }
  .case-visual { min-height: 0; height: 230px; }
  .case-copy { padding: 27px; }
  .case-number { font-size: 12px; margin-bottom: 15px; }
  .case h3 { font-size: 27px; margin-bottom: 14px; min-height: 0; }
  .case p { font-size: 17px; }
  .mini-mail { width: 155px; height: 100px; }
  .flow-node { width: 49px; height: 49px; }
  .flow-main { width: 67px; height: 67px; }
  .flow-visual { gap: 16px; }
  .flow-node svg { width: 26px; height: 26px; }
  .lock-core { width: 87px; height: 98px; }
  .lock-orbit { width: 159px; height: 159px; }
  .verified { right: calc(50% - 76px); bottom: 35px; }
  .measurement { gap: 18px; margin-top: 35px; padding-top: 28px; }
  .measurement-mark { width: 39px; height: 39px; font-size: 25px; }
  .measurement h3 { font-size: 24px; }
  .measurement p { font-size: 17px; }
  .trust-grid { gap: 35px; }
  .checks { margin-top: 32px; }
  .checks b, .checks span { font-size: 17px; }
  .checks li { padding: 23px 0 23px 29px; }
  .people-copy { padding: 27px; }
  .people-copy h2 { font-size: 32px; }
  .people-copy p { font-size: 17px; }
  .people-copy .people-note { font-size: 15px; }
  .team-photo figcaption { font-size: 10px; }
  .about-stats { gap: 37px; }
  .about-stats strong { font-size: 58px; }
  .about-stats div > span { font-size: 13px; }
  .about-copy > p { font-size: 19px; }
  .about-copy > p:nth-child(2) { font-size: 17px; }
  .clients ul { font-size: 24px; gap: 24px 28px; }
  .clients li:nth-child(7) { font-size: 15px; }
  .clients > p { font-size: 14px; }
  .faq-grid { gap: 30px; }
  .faq-intro .lead { font-size: 18px; }
  .faq summary { font-size: 17px; padding: 24px 34px 24px 0; }
  .faq summary::after { top: 23px; font-size: 23px; }
  .faq details p { font-size: 17px; padding-right: 0; }
  .contact-grid { gap: 38px; }
  .contact h2 { font-size: 45px; }
  .contact-copy > .lead { font-size: 19px; margin-top: 28px; }
  .contact-points { margin-block: 25px; }
  .contact-points li { font-size: 16px; }
  .contact-email { font-size: 18px; }
  .contact form { padding: 26px 23px; }
  .contact .row { grid-template-columns: 1fr; gap: 0; }
  .form-heading { gap: 7px; margin-bottom: 29px; }
  .form-heading p { font-size: 22px; }
  .form-heading > span:last-child { font-size: 11px; padding: 4px 8px; }
  label { font-size: 15px; }
  .opt { font-size: 12px; }
  input, select, textarea { font-size: 17px; padding: 14px 12px; }
  .field { margin-bottom: 23px; }
  textarea::placeholder { font-size: 15px; }
  .hint, .err { font-size: 13px; }
  .consent { font-size: 13px; gap: 10px; }
  .consent input { width: 19px; height: 19px; }
  form .btn { font-size: 17px; min-height: 58px; }
  .form-status { font-size: 15px; }
  .todo, .consent .todo, .form-setup .todo, .footer-bottom .todo, .social-todo .todo { font-size: 11px; }
  .footer-top > p { font-size: 14px; }
  .footer-bottom, .footer-links { font-size: 13px; }
  .footer-links { gap: 15px; }
}

@media (max-width: 370px) {
  .wrap { width: calc(100% - 32px); }
  .header-inner { gap: 9px; }
  .product-brand { font-size: 19px; max-width: 160px; }
  .lang { font-size: 11px; gap: 4px; }
  .menu-toggle { width: 32px; height: 32px; }
  .hero h1 { font-size: 41px; }
  .hero-actions > .btn { font-size: 14px; padding-inline: 18px; gap: 15px; }
  .hero-door { padding: 21px 18px; }
  .hero-door > .icon:first-child { display: none; }
  .definition .product-title { font-size: 42px; }
  .glass-tile { width: 90px; height: 116px; }
  .facts { grid-template-columns: 1fr; }
  .entry-card { padding: 25px 21px; }
  .entry-card h3 { font-size: 35px; }
  .form-heading p { font-size: 20px; }
  .form-heading > .status-dot { display: none; }
}