:root {
  --ink: #10251f;
  --ink-soft: #1b3930;
  --moss: #366b57;
  --lime: #c9dd8d;
  --sand: #f2eee5;
  --paper: #fbfaf6;
  --line: #d9d7ce;
  --muted: #63726c;
  --orange: #e48655;
  --coral: #efc4a9;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-synthesis: none;
  scroll-behavior: smooth;
}

* { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: clip; }
body { min-width: 320px; margin: 0; background: var(--paper); color: var(--ink); }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; }
.container { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; transform: translateY(-150%); padding: 10px 14px; color: var(--paper); background: var(--ink); border-radius: 5px; text-decoration: none; }
.skip-link:focus { transform: translateY(0); }
.noscript { max-width: 640px; margin: 60px auto; padding: 24px; border: 1px solid var(--line); }

.site-header { position: sticky; z-index: 50; top: 0; background: rgb(251 250 246 / 88%); border-bottom: 1px solid transparent; backdrop-filter: blur(16px); transition: padding .2s ease, border-color .2s ease, background .2s ease; }
.site-header.is-scrolled { border-bottom-color: rgb(16 37 31 / 10%); background: rgb(251 250 246 / 96%); }
.header-inner { display: flex; align-items: center; min-height: 82px; gap: 24px; transition: min-height .2s ease; }
.is-scrolled .header-inner { min-height: 66px; }
.header-leading { display: flex; flex: none; align-items: center; gap: 16px; }
.landing-language-switcher { display: inline-flex; align-items: center; gap: 4px; color: #7b8982; font-size: .62rem; font-weight: 800; letter-spacing: .06em; }
.landing-language-switcher button { min-width: 25px; padding: 6px 2px; color: #78867f; border: 0; border-bottom: 1px solid transparent; background: transparent; font-size: inherit; font-weight: inherit; letter-spacing: inherit; transition: color .15s ease, border-color .15s ease; }
.landing-language-switcher button:hover { color: var(--ink); }
.landing-language-switcher button[aria-pressed='true'] { color: var(--ink); border-bottom-color: var(--moss); }
.brand { display: inline-flex; align-items: center; flex: none; gap: 10px; color: var(--ink); font-size: 1.18rem; font-weight: 820; letter-spacing: -.055em; text-decoration: none; }
.brand-mark { display: block; width: auto; height: 46px; flex: none; object-fit: contain; }
.site-navigation { display: flex; align-items: center; justify-content: center; flex: 1; gap: clamp(15px, 2.1vw, 31px); }
.site-navigation a { color: #405149; font-size: .79rem; font-weight: 680; text-decoration: none; transition: color .15s ease; white-space: nowrap; }
.site-navigation a:hover { color: var(--ink); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 47px; gap: 13px; padding: 12px 17px; border: 1px solid transparent; border-radius: 8px; font-size: .79rem; font-weight: 800; line-height: 1.1; text-align: center; text-decoration: none; transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease; }
.button:hover { transform: translateY(-2px); }.button:active { transform: translateY(0); }
.button--header { min-height: 42px; padding: 10px 14px; color: var(--paper); background: var(--ink); font-size: .74rem; }
.button--primary { color: var(--ink); background: var(--lime); box-shadow: 0 9px 18px rgb(92 122 62 / 17%); }.button--primary:hover { background: #d6eb9a; box-shadow: 0 12px 24px rgb(92 122 62 / 24%); }
.button--secondary { color: #29483c; border-color: #cfd8cf; background: #fff; }.button--secondary:hover { border-color: #91a798; background: #f8faf6; }
.button--ink { color: var(--paper); background: var(--moss); }.button--ink:hover { background: #285743; box-shadow: 0 10px 20px rgb(16 37 31 / 16%); }
.button--text { min-width: 205px; min-height: 47px; padding: 12px 18px; color: var(--ink); border-color: #aeb9af; border-radius: 8px; background: #fffdf9; box-shadow: 0 7px 16px rgb(16 37 31 / 7%); }.button--text:hover { border-color: #708579; background: #f0f5e5; box-shadow: 0 11px 22px rgb(16 37 31 / 12%); }
.ui-icon { display: inline-flex; width: 21px; height: 21px; flex: none; align-items: center; justify-content: center; line-height: 1; }
.ui-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.button--header .ui-icon, .mobile-cta .ui-icon { width: 18px; height: 18px; }
.menu-toggle { display: none; }

.hero { position: relative; overflow: clip; padding: 43px 0 39px; background: var(--paper); }
.hero::before { position: absolute; width: 780px; height: 780px; top: -390px; left: 52%; border-radius: 50%; background: #e9eadf; content: ''; filter: blur(3px); }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.07fr) minmax(430px, .93fr); align-items: center; gap: 38px; }
.eyebrow { margin: 0 0 17px; color: var(--moss); font-size: .68rem; font-weight: 850; letter-spacing: .11em; line-height: 1.2; text-transform: uppercase; }
h1, h2, h3, p { overflow-wrap: break-word; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; }
h1 { max-width: 690px; margin: 0; font-size: clamp(3.3rem, 5.15vw, 5.3rem); letter-spacing: -.075em; line-height: .91; }
.hero-title--arial { max-width: 760px; font-family: Arial, Helvetica, var(--sans); font-weight: 700; letter-spacing: -.055em; line-height: .96; }
.hero-title--english { word-spacing: .06em; }
.hero-copy__lead { max-width: 640px; margin: 27px 0 0; color: #43554d; font-size: clamp(1rem, 1.45vw, 1.17rem); line-height: 1.58; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 35px; }
.trust-list { display: flex; flex-wrap: wrap; gap: 11px 20px; padding: 0; margin: 31px 0 0; list-style: none; }.trust-list li { display: inline-flex; align-items: center; gap: 7px; color: #5d6c65; font-size: .74rem; font-weight: 650; }
.check { display: inline-flex; flex: none; width: 17px; height: 17px; align-items: center; justify-content: center; color: var(--ink); border-radius: 50%; background: var(--lime); font-family: Arial, sans-serif; font-size: .66rem; font-weight: 900; }
.check svg { display: block; width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2.35; stroke-linecap: round; stroke-linejoin: round; }
.hero-product { position: relative; display: grid; min-height: 565px; place-items: center; isolation: isolate; }
.hero-orbit { position: absolute; z-index: -1; border: 1px solid rgb(54 107 87 / 17%); border-radius: 50%; }.hero-orbit--one { width: 487px; height: 487px; }.hero-orbit--two { width: 620px; height: 620px; border-style: dashed; }
.phone { position: relative; width: 274px; padding: 9px; border: 7px solid #152821; border-radius: 38px; background: #152821; box-shadow: 0 32px 50px rgb(16 37 31 / 25%), 0 3px 0 #48655a; }
.phone__notch { position: absolute; z-index: 3; top: 9px; left: 50%; width: 89px; height: 20px; border-radius: 0 0 13px 13px; background: #152821; transform: translateX(-50%); }
.phone__screen { min-height: 518px; padding: 27px 13px 14px; overflow: hidden; border-radius: 25px; color: #132b23; background: #fcf5e9; }
.phone__screen--photo { height: 518px; min-height: 0; padding: 0; background: #fff; }.phone__screen-image { display: block; width: calc(100% - 12px); height: 100%; margin-inline: 6px; object-fit: fill; object-position: 50% 0; user-select: none; }
.phone__top { display: flex; align-items: center; justify-content: space-between; }.phone__brand { font-size: .68rem; font-weight: 900; letter-spacing: .08em; }.language-pill { padding: 5px 7px; border: 1px solid #ccd2be; border-radius: 4px; font-size: .58rem; font-weight: 800; }.language-pill b { margin-left: 4px; }
.phone__eyebrow { margin: 31px 0 7px; color: #9d7752; font-size: .55rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.phone h3 { margin: 0; font-size: 1.6rem; letter-spacing: -.064em; line-height: .93; }
.phone__tabs { display: flex; gap: 10px; margin: 21px 0 13px; padding-bottom: 8px; overflow: hidden; border-bottom: 1px solid #ded7c8; white-space: nowrap; }.phone__tabs span { color: #8e958a; font-size: .55rem; font-weight: 800; }.phone__tabs .is-active { color: #1d352b; }
.dish-card { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 9px; margin-bottom: 10px; padding: 8px; border: 1px solid #e5ddcf; border-radius: 9px; background: #fffdf7; }.dish-card__visual { display: grid; min-height: 71px; place-items: end start; padding: 7px; overflow: hidden; border-radius: 6px; color: #fff7e7; background: #6b8b56; font-size: .47rem; font-weight: 800; }.dish-card__visual--green { background: radial-gradient(circle at 75% 20%, #d3df8f 0 15%, transparent 16%), radial-gradient(circle at 38% 58%, #d0874b 0 17%, transparent 18%), #477346; }.dish-card__visual--gold { background: radial-gradient(circle at 54% 50%, #e4c05c 0 27%, transparent 28%), #9b5f32; }.dish-card div:last-child { display: grid; gap: 3px; align-content: center; }.dish-card strong { font-size: .61rem; line-height: 1.15; }.dish-card small { color: #7d877c; font-size: .5rem; line-height: 1.22; }.dish-card b { color: #2d654e; font-size: .62rem; }.dish-card--short { margin-bottom: 12px; }
.phone__actions { display: grid; grid-template-columns: 1fr 27px 27px; gap: 5px; }.phone__actions button { min-height: 30px; padding: 4px; border: 0; border-radius: 4px; color: #f5f0e6; background: #2d634e; font-size: .49rem; font-weight: 800; }.phone__actions button:not(:first-child) { color: #2d634e; border: 1px solid #2d634e; background: transparent; }
.analytics-float { position: absolute; right: max(0px, calc(50% - 274px)); bottom: 60px; z-index: 5; width: 188px; padding: 15px; color: var(--paper); border: 1px solid rgb(255 255 255 / 12%); border-radius: 10px; background: var(--ink); box-shadow: 0 18px 32px rgb(16 37 31 / 23%); }.analytics-float__head { display: flex; justify-content: space-between; color: #b5c1b8; font-size: .56rem; font-weight: 700; }.analytics-float__head i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); }.analytics-float > strong { display: block; margin-top: 13px; font-size: 1.5rem; letter-spacing: -.05em; }.analytics-float > span { color: #c8d0ca; font-size: .58rem; }.spark-bars { display: flex; height: 42px; align-items: end; gap: 4px; margin: 11px 0; }.spark-bars i { display: block; flex: 1; border-radius: 2px 2px 0 0; background: #6d927f; }.spark-bars i:nth-child(1) { height: 21%; }.spark-bars i:nth-child(2) { height: 37%; }.spark-bars i:nth-child(3) { height: 31%; }.spark-bars i:nth-child(4) { height: 63%; }.spark-bars i:nth-child(5) { height: 47%; }.spark-bars i:nth-child(6) { height: 82%; }.spark-bars i:nth-child(7) { height: 62%; }.spark-bars i:nth-child(8) { height: 100%; background: var(--lime); }.analytics-float__foot { display: flex; gap: 6px; color: #9baaa1; font-size: .51rem; }.analytics-float__foot span:first-child { color: var(--lime); }
.google-card { position: absolute; top: 74px; left: max(-4px, calc(50% - 238px)); display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid rgb(16 37 31 / 8%); border-radius: 8px; background: rgb(255 255 255 / 86%); box-shadow: 0 13px 28px rgb(16 37 31 / 10%); backdrop-filter: blur(8px); }.google-card__pin { display: grid; width: 28px; height: 28px; place-items: center; color: white; border-radius: 50% 50% 50% 0; background: var(--orange); transform: rotate(-45deg); }.google-card__pin::first-letter { transform: rotate(45deg); }.google-card small, .google-card strong { display: block; }.google-card small { color: var(--muted); font-size: .53rem; }.google-card strong { font-size: .67rem; }.google-card__rating { margin-left: 5px; color: #c67626; font-size: .61rem; font-weight: 800; }

.section { padding: 39px 0 58px; }.section--sand { background: var(--sand); }.section--ink { color: var(--paper); background: var(--ink); }.section-head { max-width: 760px; }.section-head h2 { margin: 0; font-size: clamp(2.5rem, 4.3vw, 4.5rem); letter-spacing: -.07em; line-height: .94; }.section--ink .eyebrow { color: var(--lime); }.section-intro { max-width: 640px; margin: 21px 0 0; color: var(--muted); font-size: 1.03rem; line-height: 1.58; }.section--ink .section-intro { color: #c2ccc5; }
.comparison-visual { display: grid; grid-template-columns: minmax(0, 1fr) 58px minmax(0, 1fr); gap: 17px; align-items: center; margin-top: 53px; }.legacy-menu, .modern-menu { display: grid; grid-template-columns: minmax(0, 1fr) minmax(205px, .7fr); gap: 22px; align-items: center; }.legacy-menu__paper { min-height: 381px; padding: 42px 34px 25px; color: #5b544c; background: #e8e1d4; box-shadow: 7px 8px 0 rgb(107 96 81 / 12%); transform: rotate(-2deg); }.legacy-menu__logo { display: block; text-align: center; font-family: var(--serif); font-size: 1.6rem; letter-spacing: -.07em; }.legacy-menu__logo b { font-style: italic; }.legacy-menu__rule { display: block; width: 50%; height: 1px; margin: 13px auto 22px; background: #877d70; }.legacy-menu__paper p { margin: 14px 0 6px; font-size: .51rem; font-weight: 800; letter-spacing: .14em; text-align: center; }.legacy-menu__paper div { display: flex; justify-content: space-between; gap: 8px; padding: 4px 0; font-family: var(--serif); font-size: .72rem; }.legacy-menu__paper small { display: block; margin-top: 34px; color: #8d867d; font-size: .45rem; text-align: center; }.comparison-caption h3 { margin: 10px 0 18px; font-size: 1.65rem; letter-spacing: -.06em; }.caption-state { display: inline-flex; padding: 5px 7px; color: #6a6156; background: #e0d7c8; font-size: .56rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }.caption-state--good { color: #355947; background: #d9edc6; }.comparison-caption ul { display: grid; gap: 11px; padding: 0; margin: 0; list-style: none; }.comparison-caption li { display: flex; align-items: center; gap: 8px; color: #607068; font-size: .76rem; line-height: 1.3; }.comparison-caption li > span { color: #a69f95; }.modern-menu .phone { width: 205px; margin: 0 auto; border-width: 5px; border-radius: 28px; box-shadow: 0 17px 28px rgb(16 37 31 / 19%); }.modern-menu .phone__screen { min-height: 383px; padding: 21px 9px 10px; border-radius: 20px; }.modern-menu .phone__screen--comparison-photo { height: 383px; min-height: 383px; padding: 0; background: #fff; }.modern-menu .phone__screen-image--comparison { width: 100%; height: 100%; margin: 0; object-fit: contain; object-position: center; background: #fff; }.modern-menu .phone__notch { top: 5px; width: 62px; height: 14px; }.modern-menu .phone__eyebrow { margin-top: 23px; }.modern-menu .phone h3 { font-size: 1.15rem; }.modern-menu .phone__tabs { margin-top: 15px; }.modern-menu .dish-card { grid-template-columns: 49px minmax(0, 1fr); margin-bottom: 6px; padding: 6px; }.modern-menu .dish-card__visual { min-height: 49px; }.modern-menu .dish-card--short { margin-bottom: 8px; }.modern-menu .phone__actions { grid-template-columns: 1fr 24px 24px; }.compare-divider { display: grid; gap: 9px; place-items: center; color: var(--moss); }.compare-divider span { font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.compare-divider i { display: grid; width: 44px; height: 38px; place-items: center; font-style: normal; }.compare-swap-icon { display: block; width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }

.problem { background: #e5eee0; }.problem-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); gap: 46px 75px; }.problem-grid .section-head { grid-column: 1 / -1; }.journey-card { padding: 12px; border-radius: 18px; color: #edf2e9; background: var(--ink); box-shadow: 0 22px 40px rgb(16 37 31 / 14%); }.journey-card ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0; margin: 0; list-style: none; }.journey-card li { display: flex; min-height: 154px; flex-direction: column; justify-content: space-between; padding: 20px; border: 1px solid rgb(233 244 232 / 12%); border-radius: 12px; background: #19352c; }.journey-card li:nth-child(2) { background: #1e3e33; }.journey-card li:nth-child(4) { background: #285040; }.journey-card li span { display: inline-flex; width: max-content; min-width: 42px; min-height: 30px; align-items: center; justify-content: center; padding: 6px 9px; color: var(--lime); border: 1px solid rgb(201 221 141 / 38%); border-radius: 999px; font-size: .62rem; font-weight: 850; letter-spacing: .05em; }.journey-card li strong { max-width: 230px; font-family: var(--serif); font-size: clamp(1.25rem, 2vw, 1.72rem); font-weight: 400; letter-spacing: -.045em; line-height: 1.02; }.journey-card .journey-card__menu { color: var(--ink); border-color: var(--lime); background: var(--lime); }.journey-card .journey-card__menu span { color: var(--ink); border-color: rgb(16 37 31 / 22%); background: rgb(255 255 255 / 22%); }.problem-stat { display: flex; min-height: 100%; flex-direction: column; justify-content: center; padding: clamp(30px, 5vw, 58px); border: 1px solid #b8c6b2; border-radius: 13px; background: #fbfaf6; box-shadow: 0 20px 38px rgb(16 37 31 / 9%); }.problem-stat__source { color: var(--moss); font-size: .68rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }.problem-stat strong { display: block; margin-top: 25px; color: var(--ink); font-family: var(--serif); font-size: clamp(4.8rem, 9vw, 7.8rem); font-weight: 400; letter-spacing: -.08em; line-height: .78; }.problem-stat p { max-width: 520px; margin: 28px 0 0; color: var(--ink); font-family: var(--serif); font-size: clamp(1.45rem, 2.4vw, 2.15rem); letter-spacing: -.045em; line-height: 1.06; }
.problem-stat--research { position: relative; min-height: 420px; justify-content: flex-start; overflow: hidden; padding: 30px 34px 44px; border-color: #bdc8b8; border-radius: 17px; background: #fbfaf6; box-shadow: 0 18px 38px rgb(16 37 31 / 7%); }.problem-stat__research-head { display: flex; min-height: 76px; align-items: flex-start; justify-content: space-between; gap: 16px; }.problem-stat__badge { position: relative; z-index: 2; display: inline-flex; min-height: 36px; align-items: center; gap: 9px; padding: 8px 13px; color: #304b40; border: 1px solid #d8ddd4; border-radius: 11px; background: #fbfaf6; font-size: .6rem; font-weight: 820; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }.problem-stat__badge img { width: 20px; height: 20px; object-fit: contain; }.problem-stat__chart { position: absolute; top: 32px; right: 15px; width: 195px; height: auto; opacity: .8; pointer-events: none; }.problem-stat--research > strong { position: relative; z-index: 1; margin-top: 2px; font-size: clamp(8rem, 9.6vw, 8.8rem); line-height: .72; }.problem-stat--research > p { position: relative; z-index: 1; max-width: 330px; margin: 20px 0 0; font-size: clamp(1.55rem, 2vw, 1.88rem); line-height: 1.02; }.problem-stat__citation { display: flex; gap: 5px; align-items: baseline; margin-top: auto; padding-top: 18px; border-top: 1px solid #d8ddd4; color: #405148; font-size: .73rem; }.problem-stat__citation a { display: inline-flex; align-items: center; gap: 5px; color: var(--ink); font-weight: 800; text-decoration: none; }.problem-stat__citation a img { width: 12px; height: 12px; object-fit: contain; opacity: .82; }.problem-stat__citation a:hover, .problem-stat__citation a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

.solution-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(370px, .95fr); align-items: center; gap: 70px; }.solution-tags { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 34px; }.solution-tags span { padding: 8px 11px; color: #4f6258; border: 1px solid #d4d9d0; border-radius: 999px; font-size: .68rem; font-weight: 700; }.solution-stage { position: relative; display: grid; min-height: 558px; place-items: center; border-radius: 50%; background: radial-gradient(circle, #e7edda 0 37%, transparent 37%); }.solution-tag { position: absolute; padding: 9px 11px; color: #244539; border: 1px solid #d6ded0; border-radius: 5px; background: #fbfaf6; box-shadow: 0 9px 15px rgb(16 37 31 / 7%); font-size: .64rem; font-weight: 800; }.solution-tag--a { top: 11%; right: 7%; }.solution-tag--b { top: 35%; left: 0; }.solution-tag--c { right: 0; bottom: 27%; }.solution-tag--d { bottom: 8%; left: 13%; }

.benefit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 54px; background: rgb(255 255 255 / 17%); }.benefit-card { position: relative; display: flex; flex-direction: column; min-height: 376px; padding: 25px; background: var(--ink); }.benefit-card__number { color: #829e90; font-size: .65rem; font-weight: 850; }.benefit-card__visual { display: grid; min-height: 85px; place-items: center start; margin: 40px 0 30px; padding: 13px; color: var(--lime); border: 1px solid rgb(234 247 229 / 17%); background: #1b3930; font-family: var(--serif); font-size: 1.08rem; letter-spacing: -.05em; line-height: 1.1; }.benefit-card h3 { max-width: 210px; margin: 0; font-size: 1.62rem; letter-spacing: -.06em; line-height: .94; }.benefit-card p { margin: 16px 0 0; color: #b9c7be; font-size: .76rem; line-height: 1.5; }.benefit-card__arrow { position: absolute; right: 23px; bottom: 20px; color: var(--lime); font-size: 1.25rem; }

.analytics-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(300px, .75fr); align-items: center; gap: 78px; }.analytics-dashboard { padding: 24px; border: 1px solid #dfe1d8; border-radius: 12px; background: #fff; box-shadow: 0 22px 37px rgb(16 37 31 / 8%); }.analytics-dashboard--image { padding: 0; margin: 0; overflow: hidden; }.analytics-dashboard--image img { display: block; width: 100%; height: auto; }.dashboard-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid #e4e6df; }.dashboard-head span, .dashboard-bottom span { color: #829087; font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.dashboard-head h3 { margin: 6px 0 0; font-family: var(--sans); font-size: 1rem; font-weight: 760; letter-spacing: -.035em; }.dashboard-head button { padding: 8px 10px; color: #3c564a; border: 1px solid #d6dfd4; border-radius: 5px; background: #fff; font-size: .61rem; font-weight: 750; }.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); }.metric { min-height: 113px; padding: 19px 14px 13px; border-right: 1px solid #e5e7e0; border-bottom: 1px solid #e5e7e0; }.metric:nth-child(3n) { border-right: 0; }.metric span { display: block; color: #7d8b83; font-size: .58rem; font-weight: 700; }.metric strong { display: block; margin-top: 10px; font-size: 1.38rem; letter-spacing: -.055em; }.metric-line { display: block; width: 100%; height: 20px; margin-top: 7px; border-bottom: 2px solid #90ad7b; background: linear-gradient(165deg, transparent 43%, #d6e4c6 44% 48%, transparent 49%) 0 3px / 20px 14px repeat-x; }.dashboard-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding-top: 22px; }.dashboard-bottom p { display: flex; gap: 9px; margin: 11px 0 0; color: #47594f; font-size: .65rem; }.dashboard-bottom p b { color: var(--moss); }.language-chart p { display: grid; grid-template-columns: 55px 1fr 28px; align-items: center; gap: 8px; }.language-chart p b { font-size: .59rem; }.language-chart p i { height: 5px; overflow: hidden; border-radius: 6px; background: #e6e9e1; }.language-chart p i::after { display: block; width: var(--value); height: 100%; border-radius: inherit; background: var(--moss); content: ''; }.language-chart p em { color: #6f7c74; font-size: .55rem; font-style: normal; }.check-list { display: grid; gap: 18px; padding: 0; margin: 34px 0 0; list-style: none; }.check-list li { display: flex; align-items: flex-start; gap: 10px; color: #4e6057; font-size: .9rem; line-height: 1.42; }.check-list .check { margin-top: 1px; }

.admin-grid { display: grid; grid-template-columns: minmax(0, .72fr) minmax(470px, 1.18fr); align-items: center; justify-content: space-between; gap: 64px; }.restore-note { max-width: 440px; margin: 31px 0 0; padding: 15px; color: #3e5d4e; border-left: 3px solid var(--moss); background: #e6ece0; font-size: .78rem; line-height: 1.45; }.admin-panel { width: min(100%, 390px); justify-self: end; overflow: hidden; border: 1px solid #cfd7cc; border-radius: 12px; background: #fff; box-shadow: 0 25px 43px rgb(16 37 31 / 11%); }.admin-panel--image { width: 100%; max-width: 760px; padding: 0; margin: 0; }.admin-panel--image img { display: block; width: 100%; height: auto; }.admin-panel__top { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; color: #e9f0e9; background: var(--ink); font-size: .68rem; font-weight: 750; }.admin-avatar { display: grid; width: 25px; height: 25px; place-items: center; color: var(--ink); border-radius: 50%; background: var(--lime); font-size: .65rem; }.admin-panel__body { padding: 22px; }.admin-panel__body > p { margin: 0; color: #78877e; font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.admin-panel__body h3 { margin: 7px 0 22px; font-family: var(--sans); font-size: 1.24rem; font-weight: 760; letter-spacing: -.05em; }.admin-panel__body label { display: grid; gap: 6px; margin-top: 14px; color: #718078; font-size: .58rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }.admin-panel__body label span { padding: 11px; color: #30483d; border: 1px solid #dbe0d9; border-radius: 5px; font-size: .75rem; font-weight: 700; letter-spacing: 0; text-transform: none; }.admin-panel__body .availability { color: #39724e; }.admin-panel__body button { width: 100%; min-height: 42px; margin-top: 22px; color: var(--ink); border: 0; border-radius: 5px; background: var(--lime); font-size: .68rem; font-weight: 800; }

.how { background: #f9f8f4; }.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; padding: 0; margin: 42px 0 0; list-style: none; background: var(--line); counter-reset: step; }.steps li { display: grid; grid-template-columns: 32px minmax(0, 1fr); min-height: 205px; align-content: start; column-gap: 14px; padding: 25px 28px; background: #f9f8f4; }.steps li > span { padding-top: 4px; color: var(--moss); font-size: .68rem; font-weight: 850; }.steps li > div { min-width: 0; }.steps h3 { max-width: 275px; margin: 0; font-size: 1.62rem; letter-spacing: -.06em; line-height: .94; }.steps p { margin: 17px 0 0; color: #617067; font-size: .78rem; line-height: 1.5; }

.demo-section { padding: 0 0 58px; background: #f9f8f4; }.demo-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(410px, .84fr); gap: 55px; padding: 53px; color: var(--paper); border-radius: 14px; background: var(--ink); }.demo-card .eyebrow { color: var(--lime); }.demo-card h2, .final-card h2 { max-width: 590px; margin: 0; font-size: clamp(2.35rem, 3.6vw, 3.75rem); letter-spacing: -.07em; line-height: .93; }.demo-card > div > p:not(.eyebrow), .final-card > div > p:not(.eyebrow) { max-width: 590px; margin: 21px 0 0; color: #c1cbc4; font-size: .92rem; line-height: 1.55; }
@media (min-width: 521px) { .section[id] { scroll-margin-top: 98px; } }
.demo-card h2, .pricing .section-head h2 { font-family: Arial, Helvetica, var(--sans); font-weight: 700; word-spacing: .08em; }
.demo-form { align-self: start; }.demo-form__fields { display: grid; grid-template-columns: 1fr; gap: 13px; }.demo-form label:not(.honeypot) { display: grid; gap: 7px; color: #d2dbd4; font-size: .61rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.demo-form input { width: 100%; min-height: 47px; padding: 12px; color: var(--ink); outline: 0; border: 1px solid #bdc9bf; border-radius: 5px; background: #fffdf9; font-size: .8rem; letter-spacing: 0; text-transform: none; }.demo-form input:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgb(201 221 141 / 20%); }.demo-form .button { width: 100%; margin-top: 15px; }.form-note { margin: 11px 0 0; color: #9eb0a5; font-size: .59rem; line-height: 1.4; }.form-status { min-height: 20px; margin: 12px 0 0; color: #cfdbd2; font-size: .7rem; line-height: 1.4; }.form-status.is-success { color: var(--lime); }.form-status.is-error { color: #ffc0a1; }.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

.examples { background: #f4f1ea; }.example-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 52px; }.template-card { overflow: hidden; border: 1px solid #dbdbd2; border-radius: 9px; background: #fffdf9; }.template-card__mock { position: relative; display: flex; min-height: 265px; flex-direction: column; justify-content: end; padding: 23px; overflow: hidden; color: #f8f2e7; background: #89765c; }.template-card__mock::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 20%, rgb(0 0 0 / 50%) 100%); content: ''; }.template-card__mock > * { position: relative; z-index: 1; }.template-card--1 .template-card__mock { color: #e3d8bd; background: radial-gradient(circle at 73% 32%, #e9c474 0 6%, transparent 7%), radial-gradient(circle at 65% 45%, #b45d2c 0 15%, transparent 16%), #4c5c4c; }.template-card--2 .template-card__mock { background: radial-gradient(ellipse at 50% 35%, #f0ae65 0 15%, transparent 36%), #594a3d; }.template-card--3 .template-card__mock { color: #f0daba; background: radial-gradient(circle at 33% 31%, #ae6a46 0 3%, transparent 20%), #1f2525; }.template-card__brand { align-self: flex-start; margin-bottom: auto; font-size: .6rem; font-weight: 850; letter-spacing: .16em; }.template-card__mock i { width: 48px; height: 1px; margin-bottom: 13px; background: currentColor; }.template-card__mock b { max-width: 200px; font-family: var(--serif); font-size: 2rem; font-weight: 400; letter-spacing: -.07em; line-height: .9; }.template-card__mock small { margin-top: 15px; font-size: .54rem; font-weight: 850; letter-spacing: .08em; }.template-card__copy { position: relative; padding: 21px; }.template-card__copy > span { color: #829089; font-size: .61rem; font-weight: 850; }.template-card__copy h3 { margin: 22px 0 4px; font-size: 1.75rem; letter-spacing: -.06em; }.template-card__copy strong { color: #4f6459; font-size: .67rem; }.template-card__copy p { min-height: 55px; margin: 13px 0 18px; color: #68766e; font-size: .73rem; line-height: 1.45; }.template-card__copy button { display: inline-flex; align-items: center; gap: 5px; padding: 0; color: var(--ink); border: 0; border-bottom: 1px solid var(--ink); background: transparent; font-size: .65rem; font-weight: 800; }.template-card__copy button i { font-size: .94rem; font-style: normal; }

.feature-section { background: #fbfaf6; }.feature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; padding: 0; margin: 48px 0 0; list-style: none; }.feature-list__item { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr) 30px; gap: 15px; align-items: center; min-height: 82px; padding: 15px 17px; overflow: hidden; border: 1px solid #dce2d7; border-radius: 14px; background: linear-gradient(135deg, #fff 0%, #f6f8f1 100%); box-shadow: 0 8px 22px rgb(16 37 31 / 5%); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }.feature-list__item::before { position: absolute; top: 0; bottom: 0; left: 0; width: 3px; background: var(--lime); content: ''; opacity: .9; }.feature-list__index { display: grid; width: 42px; height: 42px; place-items: center; color: var(--moss); border-radius: 12px; background: #eef3df; font-size: .62rem; font-weight: 850; letter-spacing: .04em; }.feature-list p { margin: 0; color: #1d3029; font-size: .8rem; font-weight: 700; line-height: 1.3; }.feature-list__status { display: grid; place-items: center; }.feature-list__status .check { width: 27px; height: 27px; color: var(--ink); background: var(--lime); font-size: .68rem; box-shadow: inset 0 0 0 1px rgb(16 37 31 / 5%); }@media (hover: hover) { .feature-list__item:hover { border-color: #cbd8bf; box-shadow: 0 13px 28px rgb(16 37 31 / 9%); transform: translateY(-2px); } }

.feature-showcase { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 48px; padding: 0; margin: 43px 0 0; list-style: none; }.feature-showcase__item { min-width: 0; padding: 4px 13px 8px; text-align: center; }.feature-showcase__icon { display: grid; width: 122px; height: 122px; place-items: center; margin: 0 auto 21px; border: 1px solid #cbd9ba; border-radius: 50%; background: radial-gradient(circle at 50% 42%, #fbfcf5 0 52%, #edf3df 100%); box-shadow: 0 13px 28px rgb(16 37 31 / 7%); }.feature-showcase__icon img { display: block; width: 96px; height: 96px; object-fit: contain; filter: drop-shadow(0 4px 5px rgb(16 37 31 / 8%)); }.feature-showcase h3 { max-width: 285px; margin: 0 auto; color: #193129; font-family: var(--sans); font-size: 1.02rem; font-weight: 780; letter-spacing: -.025em; line-height: 1.25; }.feature-showcase p { max-width: 300px; margin: 10px auto 0; color: #65746c; font-size: .76rem; line-height: 1.48; }

.pricing-grid { display: grid; grid-template-columns: minmax(0, .66fr) minmax(590px, 1fr); align-items: center; gap: 60px; }.pricing .section-head h2 { max-width: 580px; }.pricing-note { max-width: 420px; margin: 25px 0 0; color: #bfcac2; font-size: .84rem; line-height: 1.45; }.pricing-card { padding: 28px; border: 1px solid rgb(230 240 230 / 20%); border-radius: 11px; color: var(--ink); background: #f9f8f3; }.pricing-card__prices { display: grid; grid-template-columns: max-content 34px max-content; justify-content: center; gap: 20px; align-items: center; margin: 0 0 28px; }.pricing-card__prices div { display: flex; align-items: center; }.pricing-card__prices strong { display: inline-flex; align-items: center; font-family: Arial, Helvetica, sans-serif; font-size: 2rem; font-weight: 400; letter-spacing: -.04em; line-height: 1; white-space: nowrap; }.pricing-card__prices i { align-self: center; color: #76946e; font-family: Arial, Helvetica, sans-serif; font-size: .62rem; font-style: normal; font-weight: 850; letter-spacing: .04em; line-height: 1; text-align: center; text-transform: lowercase; }.pricing-card ul { display: grid; gap: 11px; padding: 0; margin: 0 0 25px; list-style: none; }.pricing-card li { display: flex; align-items: center; gap: 8px; color: #53665d; font-size: .72rem; line-height: 1.35; }.pricing-card .button { width: 100%; }

.comparison-section { background: #fbfaf6; }.comparison-table { max-width: 870px; margin-top: 50px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; }.comparison-table__head, .comparison-table__row { display: grid; grid-template-columns: minmax(0, 1.8fr) .55fr .7fr; }.comparison-table__head { color: #edf2e9; background: var(--ink); }.comparison-table__head > *, .comparison-table__row > * { display: flex; min-height: 51px; align-items: center; padding: 12px 18px; border-right: 1px solid rgb(215 221 213 / 14%); }.comparison-table__head strong { justify-content: center; font-size: .66rem; letter-spacing: .05em; text-transform: uppercase; }.comparison-table__row { border-top: 1px solid var(--line); }.comparison-table__row > span { color: #4f6259; font-size: .77rem; font-weight: 650; }.comparison-table__row b { justify-content: center; color: #a2aca5; font-family: var(--sans); font-size: .91rem; }.comparison-table__row .is-yes { color: #388057; font-weight: 900; }.comparison-table__row .is-no { color: #afb8b1; }

.faq-grid { display: grid; grid-template-columns: minmax(270px, .75fr) minmax(0, 1.1fr); gap: 85px; }.faq-intro { max-width: 360px; margin: 23px 0 0; color: #6a796f; font-size: .82rem; line-height: 1.55; }.accordion { border-top: 1px solid #cbd3c8; }.accordion article { border-bottom: 1px solid #cbd3c8; }.accordion h3 { margin: 0; font-family: var(--sans); }.accordion button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 0; color: #253e34; border: 0; background: transparent; font-size: .86rem; font-weight: 760; text-align: left; }.accordion button i { color: var(--moss); font-size: 1.3rem; font-style: normal; font-weight: 400; transition: transform .2s ease; }.accordion button[aria-expanded='true'] i { transform: rotate(45deg); }.accordion div p { max-width: 640px; margin: -3px 35px 21px 0; color: #62736a; font-size: .78rem; line-height: 1.55; }

.support-section { padding-top: 0; }.landing-support-card { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 27px 30px; border: 1px solid #d7ddd5; border-radius: 15px; background: #fff; box-shadow: 0 12px 30px rgb(16 37 31 / 7%); }.problem-support-card { grid-column: 1 / -1; order: 4; }.landing-support-card .eyebrow { margin-bottom: 8px; }.landing-support-card h2 { max-width: 650px; margin: 0; font-family: Arial, Helvetica, var(--sans); font-size: clamp(1.9rem, 3vw, 2.7rem); font-weight: 700; letter-spacing: -.05em; line-height: .98; word-spacing: .08em; }.landing-support-actions { display: flex; flex: none; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }.landing-support-actions .button { min-height: 47px; white-space: nowrap; }

.support-dialog { box-sizing: border-box; width: min(620px, calc(100% - 32px)); max-height: calc(100dvh - 32px); margin: auto; overflow: auto; padding: 30px; color: var(--ink); border: 1px solid #d5ddd4; border-radius: 16px; background: var(--paper); box-shadow: 0 28px 80px rgb(7 24 18 / 35%); }.support-dialog::backdrop { background: rgb(7 24 18 / 56%); backdrop-filter: blur(4px); }.support-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; }.support-dialog__head .eyebrow { margin-bottom: 9px; }.support-dialog__head h2 { margin: 0; font-family: var(--serif); font-size: clamp(2.25rem, 6vw, 3.35rem); font-weight: 400; letter-spacing: -.055em; line-height: .94; }.support-dialog__head p:not(.eyebrow) { max-width: 490px; margin: 15px 0 0; color: var(--muted); font-size: .78rem; line-height: 1.55; }.support-dialog__close { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; padding: 0; color: #446054; border: 1px solid #d2dad2; border-radius: 50%; background: #fff; font-size: 1.35rem; line-height: 1; }.support-dialog__close:hover { color: var(--ink); border-color: #9dad9f; }.support-dialog__form { display: grid; gap: 16px; margin-top: 27px; }.support-dialog__form label:not(.honeypot) { display: grid; gap: 7px; color: #344e43; font-size: .68rem; font-weight: 800; letter-spacing: .02em; }.support-dialog__form input, .support-dialog__form textarea { width: 100%; padding: 13px 14px; color: var(--ink); border: 1px solid #cfd8cf; border-radius: 9px; background: #fff; outline: 0; }.support-dialog__form textarea { min-height: 135px; resize: vertical; line-height: 1.5; }.support-dialog__form input:focus, .support-dialog__form textarea:focus { border-color: var(--moss); box-shadow: 0 0 0 3px rgb(54 107 87 / 12%); }.support-dialog__form .button { width: 100%; }.support-dialog__status { min-height: 1.2em; margin: -3px 0 0; font-size: .7rem; line-height: 1.45; }.support-dialog__status.is-success { color: #367547; }.support-dialog__status.is-error { color: #a94f33; }

.final-cta { padding-top: 0; background: #fbfaf6; }.final-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .78fr); gap: 57px; padding: 56px; color: var(--paper); border-radius: 14px; background: linear-gradient(135deg, #18382e 0%, #10251f 58%, #284837 100%); }.final-card .eyebrow { color: var(--lime); }.final-card .trust-list { max-width: 510px; }.final-card .trust-list li { color: #d1dbd3; }.demo-form--compact { align-self: center; }.demo-form--compact .demo-form__fields { grid-template-columns: 1fr; }

.site-footer { padding: 50px 0 21px; color: #d9e3dc; background: #0b1b16; }.site-footer .brand { color: #edf2ed; }.footer-grid { display: grid; grid-template-columns: 1.8fr repeat(3, 1fr); gap: 40px; }.footer-grid > div:first-child p { max-width: 260px; margin: 17px 0 0; color: #94a69c; font-size: .71rem; line-height: 1.5; }.footer-grid h3 { margin: 2px 0 15px; color: var(--lime); font-family: var(--sans); font-size: .62rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }.footer-grid a:not(.brand) { display: block; width: fit-content; margin-top: 10px; color: #c8d3cb; font-size: .71rem; text-decoration: none; }.footer-grid a:not(.brand):hover { color: var(--lime); }.footer-bottom { display: flex; justify-content: space-between; gap: 15px; margin-top: 59px; padding-top: 19px; border-top: 1px solid rgb(230 240 230 / 13%); color: #82958a; font-size: .64rem; }.mobile-cta { display: none; }
.footer-contact { display: grid; max-width: 285px; gap: 5px; margin-top: 19px; color: #c8d3cb; font-size: .68rem; font-style: normal; line-height: 1.45; }.footer-contact strong, .footer-contact b { color: #edf2ed; font-weight: 750; }.footer-contact a { display: block; width: fit-content; margin-top: 2px; color: #dbe6de; font-size: inherit; font-weight: 750; text-decoration: none; }.footer-contact--mobile { display: none; }
.footer-socials { display: flex; align-items: center; gap: 10px; margin-top: 17px; }
.footer-grid a.footer-social-link { display: grid; width: 38px; height: 38px; overflow: hidden; place-items: center; margin: 0; color: #edf2ed; border: 1px solid rgb(227 239 230 / 18%); border-radius: 50%; background: linear-gradient(145deg, rgb(255 255 255 / 10%), rgb(255 255 255 / 3%)); box-shadow: 0 8px 20px rgb(0 0 0 / 18%), inset 0 1px 0 rgb(255 255 255 / 10%); font-size: 1.08rem; transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.footer-grid a.footer-social-link:hover { color: #fff; border-color: transparent; box-shadow: 0 11px 23px rgb(0 0 0 / 25%); transform: translateY(-2px); }
.footer-grid a.footer-social-link--whatsapp { border-color: transparent; background: #25d366; }
.footer-grid a.footer-social-link--instagram { border-color: #c13584; background-color: #d62976; background-image: linear-gradient(135deg, #833ab4 0%, #c13584 30%, #e1306c 51%, #f77737 72%, #fcaf45 100%); }
.footer-grid a.footer-social-link:focus-visible { outline-color: var(--lime); }
.footer-social-link svg { display: block; width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; }
.footer-social-link .social-icon--whatsapp { width: 22px; height: 22px; fill: currentColor; stroke: none; }
.footer-social-link .social-icon-dot { fill: currentColor; stroke: none; }

button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid #78a9e5; outline-offset: 3px; }
.support-dialog__form input:focus-visible, .support-dialog__form textarea:focus-visible { outline: 0; outline-offset: 0; }
@media (max-width: 1080px) {
  .header-leading { gap: 10px; }.site-navigation { gap: 15px; }.site-navigation a { font-size: .71rem; }.hero-grid { grid-template-columns: minmax(0, 1.07fr) minmax(380px, .84fr); }.hero-product { transform: scale(.92); transform-origin: center; }.hero { padding-bottom: 41px; }.comparison-visual { grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr); }.legacy-menu, .modern-menu { grid-template-columns: 1fr; }.legacy-menu__paper { max-width: 280px; margin: 0 auto; }.modern-menu .phone { margin: 0 auto; }.comparison-caption { text-align: center; }.comparison-caption ul { justify-items: center; }.benefit-card { min-height: 410px; }.solution-grid, .analytics-grid, .admin-grid, .pricing-grid, .faq-grid { gap: 48px; }
}
@media (max-width: 1100px) {
  .container { width: min(100% - 38px, 670px); }.header-inner { min-height: 70px; }.button--header { min-height: 38px; padding: 9px 11px; font-size: .66rem; }.site-navigation { position: absolute; top: 100%; right: 0; left: 0; display: grid; gap: 0; padding: 9px 19px 18px; border-bottom: 1px solid #d4dbd4; background: #fbfaf6; box-shadow: 0 12px 17px rgb(16 37 31 / 8%); visibility: hidden; opacity: 0; transform: translateY(-8px); transition: opacity .15s ease, transform .15s ease, visibility .15s ease; }.site-navigation a { padding: 13px 0; border-bottom: 1px solid #e1e3dc; font-size: .8rem; }.site-header.is-menu-open .site-navigation { visibility: visible; opacity: 1; transform: translateY(0); }.menu-toggle { display: inline-grid; width: 35px; height: 35px; place-content: center; gap: 4px; padding: 0; margin-left: auto; color: var(--ink); border: 0; background: transparent; }.menu-toggle span { display: block; width: 19px; height: 2px; background: currentColor; }.menu-toggle b { position: absolute; overflow: hidden; width: 1px; height: 1px; clip: rect(0 0 0 0); }.hero { padding-top: 42px; }.hero-grid { grid-template-columns: 1fr; }.hero-copy { max-width: 670px; }.hero-product { min-height: 515px; margin-top: -13px; transform: scale(1); }.hero-orbit--two { width: 570px; height: 570px; }.hero-actions { margin-top: 28px; }.problem-grid, .solution-grid, .analytics-grid, .admin-grid, .pricing-grid, .faq-grid, .demo-card, .final-card { grid-template-columns: 1fr; }.problem-grid .section-head { grid-column: auto; }.problem-stat { order: 3; min-height: 360px; }.solution-stage { min-height: 490px; }.analytics-copy { order: -1; }.admin-panel { justify-self: center; }.benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.benefit-card { min-height: 350px; }.steps { grid-template-columns: 1fr; }.steps li { min-height: auto; }.steps h3 { margin-top: 0; }.demo-card, .final-card { gap: 38px; padding: 38px; }.example-grid { grid-template-columns: 1fr; }.template-card { display: grid; grid-template-columns: minmax(210px, .9fr) minmax(0, 1fr); }.template-card__mock { min-height: 100%; }.pricing-card { max-width: 510px; }.landing-support-card { align-items: flex-start; flex-direction: column; }.landing-support-actions { justify-content: flex-start; }.footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }.footer-grid > div:last-child { grid-column: 2 / 4; display: grid; grid-template-columns: repeat(2, max-content); column-gap: 24px; }.footer-grid > div:last-child h3 { grid-column: 1 / -1; }
}

.demo-card {
  padding-block: 29px;
}

@media (max-width: 1100px) {
  .demo-card {
    padding-block: 21px;
  }
}

@media (max-width: 520px) {
  :root { scroll-padding-top: 70px; }.container { width: min(100% - 28px, 500px); }.site-header { top: 0; }.header-inner { min-height: 62px; gap: 11px; }.is-scrolled .header-inner { min-height: 58px; }.header-leading { gap: 8px; }.landing-language-switcher { gap: 2px; font-size: .56rem; }.landing-language-switcher button { min-width: 21px; padding-inline: 0; }.brand { font-size: 1.08rem; }.brand-mark { width: 24px; height: 24px; }.button--header { display: none; }.hero { padding: 42px 0 50px; }.hero::before { top: 140px; left: 15%; width: 500px; height: 500px; }.eyebrow { margin-bottom: 13px; font-size: .61rem; }h1 { font-size: clamp(2.85rem, 13.3vw, 4rem); line-height: .91; }.hero-copy__lead { margin-top: 20px; font-size: .95rem; line-height: 1.54; }.hero-actions { display: grid; gap: 11px; margin-top: 26px; }.hero-actions .button { width: 100%; }.hero-actions .button--text { width: 100%; }.trust-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 25px; }.trust-list li { align-items: flex-start; font-size: .65rem; line-height: 1.25; }.hero-product { min-height: 435px; margin-top: 12px; transform: scale(.83); }.hero-orbit--one { width: 405px; height: 405px; }.hero-orbit--two { width: 492px; height: 492px; }.analytics-float { right: -17px; bottom: 16px; }.google-card { top: 22px; left: -5px; }.section { padding: 58px 0; }.section-head h2 { font-size: clamp(2.35rem, 11vw, 3.15rem); }.section-intro { font-size: .92rem; }.comparison-visual { grid-template-columns: 1fr; gap: 30px; margin-top: 36px; }.compare-divider { grid-column: 1; grid-row: 2; grid-template-columns: 1fr auto 1fr; width: 100%; }.compare-divider::before, .compare-divider::after { height: 1px; background: #cbd1c7; content: ''; }.legacy-menu { grid-row: 1; }.modern-menu { grid-row: 3; }.legacy-menu__paper { min-height: 330px; }.problem-grid { gap: 29px; }.problem-stat { min-height: 300px; padding: 30px 22px; }.problem-stat strong { font-size: clamp(5rem, 28vw, 7rem); }.problem-stat p { margin-top: 24px; }.journey-card { padding: 9px; margin-right: -14px; overflow: hidden; }.journey-card ol { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; padding: 0; scroll-snap-type: x mandatory; scrollbar-width: none; }.journey-card ol::-webkit-scrollbar { display: none; }.journey-card li { flex: 0 0 min(245px, 78vw); min-height: 168px; padding: 18px; scroll-snap-align: start; }.journey-card li strong { font-size: 1.42rem; }.solution-grid { gap: 35px; }.solution-stage { min-height: 400px; transform: scale(.9); margin: -18px -40px; }.solution-tag--a { right: -3%; }.solution-tag--c { right: -1%; }.benefit-grid { grid-template-columns: 1fr; margin-top: 35px; }.benefit-card { min-height: 307px; }.benefit-card__visual { min-height: 60px; margin: 26px 0 20px; }.analytics-dashboard { padding: 14px; margin: 0 -2px; }.dashboard-head button { display: none; }.metric-grid { grid-template-columns: repeat(2, 1fr); }.metric:nth-child(3n) { border-right: 1px solid #e5e7e0; }.metric:nth-child(2n) { border-right: 0; }.metric { min-height: 98px; padding: 14px 10px; }.dashboard-bottom { grid-template-columns: 1fr; gap: 17px; }.admin-grid { gap: 36px; }.admin-panel { width: 100%; }.steps { margin-top: 35px; }.steps li { padding: 23px; }.steps h3 { font-size: 1.55rem; }.demo-section { padding-bottom: 58px; }.demo-card, .final-card { gap: 30px; padding: 28px 19px; margin: 0 -1px; border-radius: 10px; }.demo-card h2, .final-card h2 { font-size: 2.35rem; }.template-card { grid-template-columns: 1fr; }.template-card__mock { min-height: 220px; }.feature-list { grid-template-columns: 1fr; gap: 10px; margin-top: 36px; }.feature-list__item { grid-template-columns: 38px minmax(0, 1fr) 28px; gap: 12px; min-height: 68px; padding: 12px 13px; border-radius: 12px; }.feature-list__index { width: 38px; height: 38px; border-radius: 10px; }.feature-list p { font-size: .75rem; }.feature-list__status .check { width: 25px; height: 25px; }.pricing-card { padding: 21px; }.pricing-card__prices { grid-template-columns: 1fr; gap: 17px; }.pricing-card__prices i { display: none; }.pricing-card__prices strong { font-size: 1.85rem; }.comparison-table { margin: 35px -2px 0; }.comparison-table__head, .comparison-table__row { grid-template-columns: minmax(0, 1.5fr) .56fr .75fr; }.comparison-table__head > *, .comparison-table__row > * { min-height: 47px; padding: 9px 7px; }.comparison-table__row > span { font-size: .67rem; }.comparison-table__head strong { font-size: .55rem; text-align: center; }.faq-grid { gap: 31px; }.accordion button { font-size: .78rem; }.landing-support-card { gap: 25px; padding: 24px 19px; }.landing-support-card h2 { font-size: 2.05rem; }.landing-support-actions { display: grid; width: 100%; grid-template-columns: 1fr; }.landing-support-actions .button { width: 100%; }.support-dialog { width: calc(100% - 22px); padding: 22px 18px; border-radius: 12px; }.support-dialog__head { gap: 13px; }.support-dialog__head h2 { font-size: 2.5rem; }.support-dialog__close { flex-basis: 35px; width: 35px; height: 35px; }.final-cta { padding-bottom: 58px; }.final-card .trust-list { grid-template-columns: 1fr; }.footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 20px; }.footer-grid > div:first-child { grid-column: 1 / -1; }.footer-grid > div:last-child { grid-column: 1 / -1; }.footer-bottom { flex-direction: column; gap: 6px; margin-top: 38px; }.mobile-cta { position: fixed; z-index: 49; right: 11px; bottom: max(11px, env(safe-area-inset-bottom)); left: 11px; display: flex; min-height: 49px; box-shadow: 0 13px 25px rgb(16 37 31 / 23%); }.site-footer { padding-bottom: 83px; }
}
@media (min-width: 841px) and (max-width: 1080px) { .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(380px, .84fr); } }
@media (max-width: 840px) { .feature-showcase { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 28px; } }
@media (max-width: 520px) { .hero { padding-bottom: 35px; }.section { padding: 41px 0; }.demo-section, .final-cta { padding-bottom: 41px; }.problem-stat--research { min-height: 355px; padding: 20px 20px 19px; }.problem-stat__research-head { min-height: 68px; }.problem-stat__badge { min-height: 35px; gap: 8px; padding: 7px 10px; font-size: .54rem; }.problem-stat__badge img { width: 19px; height: 19px; }.problem-stat__chart { top: 18px; right: 0; width: 145px; opacity: .72; }.problem-stat--research > strong { margin-top: 4px; font-size: 5.6rem; }.problem-stat--research > p { max-width: 295px; margin-top: 18px; font-size: 1.55rem; }.problem-stat__citation { padding-top: 16px; font-size: .68rem; }.feature-showcase { grid-template-columns: 1fr; gap: 0; margin-top: 30px; }.feature-showcase__item { display: grid; grid-template-columns: 82px minmax(0, 1fr); grid-template-rows: auto auto; gap: 6px 17px; align-items: center; padding: 18px 0; text-align: left; border-bottom: 1px solid #dce2d7; }.feature-showcase__item:first-child { padding-top: 0; }.feature-showcase__item:last-child { padding-bottom: 0; border-bottom: 0; }.feature-showcase__icon { grid-row: 1 / 3; width: 82px; height: 82px; margin: 0; }.feature-showcase__icon img { width: 66px; height: 66px; }.feature-showcase h3, .feature-showcase p { max-width: none; margin-right: 0; margin-left: 0; }.feature-showcase h3 { align-self: end; font-size: .91rem; }.feature-showcase p { align-self: start; margin-top: 0; font-size: .7rem; line-height: 1.4; } }
/* Mobile lead card: keep the self-contained container centered in the viewport. */
@media (max-width: 520px) { .demo-card { margin-inline: auto; } }
/* Guest journey v15 — four editorial cards matching the supplied horizontal reference. */
.problem { overflow: hidden; }.problem-grid .journey-card { grid-column: 1 / -1; width: min(100%, 720px); justify-self: center; }.problem-grid .problem-stat--research { grid-column: 2; width: min(100%, 525px); justify-self: end; }.journey-card { padding: 4px; border-radius: 0; color: #edf2e9; background: transparent; box-shadow: none; overflow: visible; }.journey-card ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; align-items: stretch; padding: 0; margin: 0; overflow: visible; list-style: none; }.journey-card li { position: relative; display: flex; min-height: 236px; flex-direction: column; justify-content: flex-start; padding: 14px 15px 16px; border: 1px solid rgb(201 221 141 / 21%); border-radius: 14px; background: #142c24; box-shadow: 0 7px 17px rgb(16 37 31 / 7%); }.journey-card li:nth-child(1) { background: #132b23; }.journey-card li:nth-child(2) { background: #173128; }.journey-card li:nth-child(4) { background: #19362c; }.journey-card li::after { position: absolute; right: 15px; bottom: 10px; left: 15px; height: 1px; background: rgb(237 242 233 / 21%); content: ''; }.journey-card__top { display: flex; min-height: 31px; align-items: flex-start; justify-content: space-between; gap: 5px; }.journey-card li span { display: inline-flex; width: 40px; min-width: 40px; min-height: 30px; align-items: center; justify-content: center; padding: 0; color: var(--lime); border: 1px solid rgb(201 221 141 / 63%); border-radius: 999px; font-size: .59rem; font-weight: 850; letter-spacing: .04em; }.journey-card__top b { display: inline-flex; min-height: 21px; align-items: center; gap: 3px; padding: 3px 5px; color: var(--ink); border: 1px solid rgb(16 37 31 / 10%); border-radius: 999px; background: rgb(201 221 141 / 76%); box-shadow: 0 2px 6px rgb(16 37 31 / 7%); font-size: .4rem; font-weight: 850; letter-spacing: .025em; text-transform: uppercase; white-space: nowrap; }.journey-card__top b img { width: 9px; height: 9px; object-fit: contain; }.journey-card__icon { width: 52px; height: 52px; margin: 16px 0 7px; object-fit: contain; }.journey-card li strong { max-width: 156px; margin-top: auto; margin-bottom: 14px; font-family: var(--serif); font-size: clamp(1.12rem, 1.35vw, 1.34rem); font-weight: 400; letter-spacing: -.05em; line-height: .96; }.journey-card__arrow { position: absolute; z-index: 6; top: 50%; right: -20px; width: 34px; height: 34px; object-fit: contain; transform: translateY(-50%); }.journey-card .journey-card__menu { z-index: 2; color: var(--ink); border-color: #9caf62; background: #dbea9e; box-shadow: 0 0 16px rgb(201 221 141 / 26%), 0 7px 17px rgb(16 37 31 / 7%); }.journey-card .journey-card__menu::after { background: rgb(16 37 31 / 28%); }.journey-card .journey-card__menu span { color: var(--ink); border-color: rgb(16 37 31 / 27%); background: rgb(255 255 255 / 14%); }.journey-card .journey-card__menu .journey-card__icon { width: 52px; height: 52px; }
/* Guest journey v32 — compact two-column composition beside the research card. */
@media (min-width: 841px) { .problem-grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 28px 32px; align-items: stretch; }.problem-grid .problem-stat--research { grid-column: 1; grid-row: 2; width: 100%; max-width: none; justify-self: stretch; }.problem-grid .journey-card { grid-column: 2; grid-row: 2; width: 100%; max-width: none; height: 420px; align-self: stretch; justify-self: stretch; }.journey-card ol { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); height: 100%; gap: 7px; }.journey-card li { min-height: 0; padding: 13px 16px 15px; }.journey-card li:nth-child(1) { grid-area: 1 / 1; }.journey-card li:nth-child(2) { grid-area: 1 / 2; }.journey-card li:nth-child(3) { grid-area: 2 / 1; }.journey-card li:nth-child(4) { grid-area: 2 / 2; }.journey-card__icon, .journey-card .journey-card__menu .journey-card__icon { width: 44px; height: 44px; margin: 9px 0 4px; }.journey-card li strong { max-width: 240px; margin-bottom: 12px; font-size: clamp(1.15rem, 1.55vw, 1.48rem); }.journey-card__arrow { right: -19px; width: 32px; height: 32px; }.journey-card li:nth-child(2) .journey-card__arrow { top: auto; right: auto; bottom: -20px; left: -19px; transform: rotate(90deg); } }
@media (max-width: 840px) { .problem-grid .journey-card, .problem-grid .problem-stat--research { grid-column: auto; }.problem-grid .problem-stat--research { width: 100%; justify-self: stretch; }.journey-card { width: 100%; min-width: 0; margin-right: -19px; padding: 4px 0 7px; overflow: visible; }.journey-card ol { display: flex; width: 100%; max-width: 100%; gap: 15px; padding: 7px 19px 13px 0; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }.journey-card ol::-webkit-scrollbar { display: none; }.journey-card li { flex: 0 0 min(226px, 68vw); min-height: 240px; scroll-snap-align: start; }.journey-card__arrow { right: -28px; }.journey-card li:nth-child(1), .journey-card li:nth-child(2), .journey-card li:nth-child(4), .journey-card .journey-card__menu { transform: none; } }
@media (max-width: 520px) { .journey-card { padding: 3px 0 5px; margin-right: -14px; overflow: visible; }.journey-card ol { gap: 14px; padding-right: 14px; }.journey-card li { flex-basis: min(218px, 72vw); min-height: 232px; padding: 17px 18px 18px; border-radius: 15px 15px 8px 8px; }.journey-card li span { width: 44px; min-width: 44px; min-height: 33px; }.journey-card__top b { padding: 4px 6px; font-size: .46rem; }.journey-card__top b img { width: 10px; height: 10px; }.journey-card__icon, .journey-card .journey-card__menu .journey-card__icon { width: 58px; height: 58px; margin-top: 17px; }.journey-card li strong { margin-bottom: 14px; font-size: 1.42rem; }.journey-card__arrow { right: -27px; width: 38px; height: 38px; } }

/* Comparison phone v36 — native-style status bar above the captured menu screen. */
.modern-menu .phone__screen--comparison-photo { display: flex; flex-direction: column; }
.modern-menu .phone__screen-image--comparison { height: auto; min-height: 0; flex: 1; object-fit: fill; object-position: center top; }
.phone-statusbar { display: flex; width: 100%; height: 24px; flex: 0 0 24px; align-items: center; justify-content: space-between; padding: 4px 8px 3px; color: #5f6462; background: #fff; font-family: Arial, Helvetica, sans-serif; font-size: .48rem; font-weight: 700; line-height: 1; }
.phone-statusbar time { font: inherit; }
.phone-statusbar__right { display: inline-flex; align-items: center; gap: 3px; }
.phone-statusbar__signal { display: block; width: 8px; height: 7px; fill: currentColor; }
.phone-statusbar__right b { font-size: .4rem; font-weight: 800; }
.phone-statusbar__battery { display: inline-flex; align-items: center; gap: 2px; }
.phone-statusbar__battery-icon { position: relative; display: inline-flex; width: 12px; height: 7px; padding: 1px; border: 1px solid currentColor; border-radius: 2px; }
.phone-statusbar__battery-icon::after { position: absolute; top: 1px; right: -3px; width: 2px; height: 3px; border-radius: 0 1px 1px 0; background: currentColor; content: ''; }
.phone-statusbar__battery-icon span { display: block; width: 88%; height: 100%; border-radius: 1px; background: currentColor; }
.phone-statusbar__battery b { font-size: .36rem; }
/* Tighter section starts: top padding reduced by roughly one third, bottoms preserved. */
@media (max-width: 840px) { .hero { padding-top: 42px; } }
@media (max-width: 520px) { .hero { padding-top: 28px; }.section { padding: 28px 0 41px; }.support-section { padding-top: 0; } }
.site-footer .brand-mark { box-sizing: content-box; padding: 3px; border-radius: 5px; background: #fbfaf6; }
@media (max-width: 520px) { .brand .brand-mark { width: auto; height: 36px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }

/* Landing support chat v69 — persistent two-way conversation shared with the operator inbox. */
.support-dialog {
  display: none;
  width: min(700px, calc(100% - 32px));
  height: min(760px, calc(100dvh - 32px));
  max-height: calc(100dvh - 32px);
  flex-direction: column;
  overflow: hidden;
}
.support-dialog[open] { display: flex; }
.support-dialog__head { flex: 0 0 auto; }
.support-dialog__close {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  padding: 0;
  color: #fff;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}
.support-dialog__close::before { position: absolute; width: 75%; height: 75%; border-radius: 50%; background: #ff3b30; box-shadow: 0 6px 14px rgb(174 33 27 / 24%), inset 0 1px 0 rgb(255 255 255 / 28%); content: ''; transition: background .16s ease, transform .16s ease; }
.support-dialog__close:hover { color: #fff; border: 0; background: transparent; }
.support-dialog__close:hover::before { background: #e9342b; transform: scale(1.04); }
.support-dialog__close:focus-visible { outline: 3px solid rgb(255 59 48 / 28%); outline-offset: 3px; }
.support-dialog__close svg { position: relative; z-index: 1; display: block; width: 16.5px; height: 16.5px; overflow: visible; }
.support-dialog__close path { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.landing-chat__messages {
  display: grid;
  min-height: 190px;
  flex: 1 1 auto;
  align-content: start;
  gap: 10px;
  margin-top: 20px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px;
  border: 1px solid #dbe3d9;
  border-radius: 13px;
  background: #f5f7f2;
}
.landing-chat__empty { margin: auto; padding: 26px; color: var(--muted); font-size: .76rem; line-height: 1.5; text-align: center; }
.landing-chat__message { width: min(86%, 500px); padding: 11px 13px; border: 1px solid #d7dfd5; border-radius: 14px; background: #fff; overflow-wrap: anywhere; }
.landing-chat__message--visitor { justify-self: end; color: #173127; border-color: #bfd2b7; background: #eaf2d4; }
.landing-chat__message--operator { justify-self: start; background: #fff; }
.landing-chat__message small { display: block; color: #66786e; font-size: .58rem; font-weight: 750; }
.landing-chat__message p { margin: 5px 0 0; font-size: .78rem; line-height: 1.5; }
.landing-chat__attachments { display: grid; gap: 6px; margin-top: 9px; }
.landing-chat__attachment { display: grid; grid-template-columns: 27px minmax(0, 1fr); align-items: center; gap: 8px; padding: 8px 9px; color: #244b35; border: 1px solid rgb(54 107 87 / 24%); border-radius: 9px; background: rgb(255 255 255 / 65%); text-decoration: none; }
.landing-chat__attachment > span:last-child { display: grid; min-width: 0; gap: 2px; }
.landing-chat__attachment strong { overflow: hidden; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-chat__attachment small { font-size: .55rem; }
.landing-chat__attachment-icon, .landing-chat__selected-file-icon { display: grid; width: 27px; height: 27px; place-items: center; color: #37664d; border-radius: 8px; background: #e4eedf; }
.landing-chat__attachment-icon svg, .landing-chat__selected-file-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.support-dialog__form { flex: 0 0 auto; gap: 10px; margin-top: 12px; }
.support-dialog__form [hidden] { display: none !important; }
.support-dialog__form textarea { min-height: 78px; max-height: 18dvh; resize: vertical; }
.landing-chat__file-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; }
.landing-chat__file-input { display: none; }
.landing-chat__file-button { min-height: 34px; padding: 7px 10px; color: #315f43; border: 1px solid #bdccbe; border-radius: 8px; background: linear-gradient(180deg, #fff 0%, #f3f6f1 100%); box-shadow: 0 7px 14px rgb(16 37 31 / 16%), inset 0 1px 0 rgb(255 255 255 / 82%), inset 0 -1px 0 rgb(16 37 31 / 7%); font: inherit; font-size: .62rem; font-weight: 800; cursor: pointer; transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease; }
.landing-chat__file-button:hover { border-color: #93aa98; box-shadow: 0 10px 18px rgb(16 37 31 / 20%), inset 0 1px 0 #fff; transform: translateY(-1px); }
.landing-chat__file-button:active { box-shadow: 0 3px 8px rgb(16 37 31 / 16%), inset 0 1px 2px rgb(16 37 31 / 8%); transform: translateY(1px); }
.landing-chat__file-controls > span, .landing-chat__file-list { color: var(--muted); font-size: .58rem; line-height: 1.4; }
.landing-chat__file-list { display: grid; max-height: 94px; gap: 6px; overflow-y: auto; }
.landing-chat__selected-file { display: grid; grid-template-columns: 27px minmax(0, 1fr) 27px; align-items: center; gap: 8px; padding: 7px 8px; color: #29493a; border: 1px solid #d7e1d5; border-radius: 9px; background: #f4f7f1; }
.landing-chat__selected-file-copy { display: grid; min-width: 0; gap: 1px; }
.landing-chat__selected-file-copy strong { overflow: hidden; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-chat__selected-file-copy small { color: #6e7d74; font-size: .54rem; }
.landing-chat__selected-file > button { display: grid; width: 27px; height: 27px; place-items: center; padding: 0; color: #8f3b34; border: 1px solid #ebcecb; border-radius: 50%; background: #fff; font: 800 1rem/1 Arial, sans-serif; cursor: pointer; }
.landing-chat__selected-file > button:hover { color: #fff; border-color: #d8463c; background: #d8463c; }
.landing-chat__composer-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.landing-chat__composer-footer .support-dialog__status { margin: 0; }
.support-dialog .landing-chat__composer-footer .button { width: auto; min-width: 145px; margin: 0; padding-inline: 22px; }

@media (max-width: 520px) {
  .support-dialog { width: calc(100% - 18px); height: calc(100dvh - 18px); max-height: calc(100dvh - 18px); padding: 18px 15px; }
  .support-dialog__head h2 { font-size: 2.05rem; }
  .support-dialog__head p:not(.eyebrow) { margin-top: 9px; font-size: .66rem; line-height: 1.42; }
  .landing-chat__messages { min-height: 150px; margin-top: 13px; padding: 10px; }
  .landing-chat__message { width: 92%; padding: 9px 10px; }
  .landing-chat__message p { font-size: .72rem; }
  .support-dialog__form { gap: 8px; }
  .support-dialog__form input, .support-dialog__form textarea { padding: 10px 11px; }
  .support-dialog__form textarea { min-height: 66px; max-height: 14dvh; resize: none; }
  .landing-chat__file-controls > span { flex: 1 1 160px; }
  .landing-chat__composer-footer { grid-template-columns: 1fr; gap: 7px; }
  .support-dialog .landing-chat__composer-footer .button { width: 70%; min-width: 0; margin-inline: auto; }
}

@media (max-width: 520px) and (max-height: 700px) {
  .support-dialog { padding: 12px; }
  .support-dialog__head h2 { font-size: 1.65rem; }
  .support-dialog__head p:not(.eyebrow) { margin-top: 6px; font-size: .59rem; line-height: 1.35; }
  .support-dialog__close { flex-basis: 36px; width: 36px; height: 36px; }
  .support-dialog__close svg { width: 13.5px; height: 13.5px; }
  .landing-chat__messages { min-height: 82px; margin-top: 8px; padding: 8px; }
  .landing-chat__empty { padding: 13px; font-size: .65rem; }
  .support-dialog__form { gap: 6px; margin-top: 7px; }
  .support-dialog__form label:not(.honeypot) { gap: 4px; }
  .support-dialog__form textarea { min-height: 48px; max-height: 10dvh; }
  .landing-chat__file-button { min-height: 30px; padding: 5px 8px; }
  .landing-chat__file-list { max-height: 55px; }
  .landing-chat__composer-footer { gap: 4px; }
}

/* Mobile conversion controls: compact hero and delayed sticky CTA. */
@media (max-width: 520px) {
  .hero-title--compact-mobile { font-size: clamp(1.9rem, 8.9vw, 2.67rem); }
  .mobile-cta { visibility: hidden; pointer-events: none; opacity: 0; transform: translateY(calc(100% + 24px)); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; }
  .mobile-cta.is-visible { visibility: visible; pointer-events: auto; opacity: 1; transform: translateY(0); }
}

/* Primary conversion actions v63: dimensional treatment across desktop surfaces. */
.hero-actions .button,
.landing-support-actions .button,
.demo-form .button,
.pricing-card .button,
.support-dialog__form .button {
  box-shadow:
    0 12px 24px rgb(16 37 31 / 18%),
    inset 0 1px 0 rgb(255 255 255 / 62%),
    inset 0 -1px 0 rgb(16 37 31 / 8%);
}

@media (hover: hover) and (pointer: fine) {
  .hero-actions .button:hover,
  .landing-support-actions .button:hover,
  .demo-form .button:hover,
  .pricing-card .button:hover,
  .support-dialog__form .button:hover {
    box-shadow:
      0 16px 30px rgb(16 37 31 / 22%),
      inset 0 1px 0 rgb(255 255 255 / 68%),
      inset 0 -1px 0 rgb(16 37 31 / 7%);
  }
}

@media (max-width: 840px) {
  .pricing-card__prices {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 7px;
  }

  .pricing-card__prices div {
    justify-content: center;
  }

  .pricing-card__prices i {
    display: block;
  }
}

.hero-actions .button:active,
.landing-support-actions .button:active,
.demo-form .button:active,
.pricing-card .button:active,
.support-dialog__form .button:active {
  box-shadow:
    0 6px 13px rgb(16 37 31 / 16%),
    inset 0 1px 0 rgb(255 255 255 / 48%),
    inset 0 -1px 0 rgb(16 37 31 / 10%);
  transform: translateY(1px);
}

/* Mobile conversion actions v61: keep large buttons distinct from full-width fields. */
@media (max-width: 520px) {
  .hero-actions,
  .landing-support-actions { justify-items: center; }

  .hero-actions .button,
  .hero-actions .button--text,
  .landing-support-actions .button,
  .demo-form .button,
  .pricing-card .button,
  .support-dialog__form .button {
    width: 70%;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
  }

  .hero-actions .button,
  .landing-support-actions .button,
  .demo-form .button,
  .pricing-card .button,
  .support-dialog__form .button,
  .mobile-cta {
    box-shadow: 0 10px 22px rgb(16 37 31 / 17%), inset 0 1px 0 rgb(255 255 255 / 58%);
  }

  .hero-actions .button:active,
  .landing-support-actions .button:active,
  .demo-form .button:active,
  .pricing-card .button:active,
  .support-dialog__form .button:active,
  .mobile-cta:active {
    box-shadow: 0 5px 12px rgb(16 37 31 / 15%), inset 0 1px 0 rgb(255 255 255 / 45%);
    transform: translateY(1px);
  }

  .mobile-cta {
    right: 15vw;
    left: 15vw;
    width: auto;
  }

  .demo-form .button,
  .pricing-card .button {
    display: flex;
  }
}

/* Requested heading scale: primary section titles -17%, conversion titles -12%. */
#before-after .section-head h2,
#problem .section-head h2,
#analytics .section-head h2,
#admin .section-head h2,
#how .section-head h2,
#features .section-head h2,
#faq .section-head h2 {
  font-size: clamp(2.075rem, 3.569vw, 3.735rem);
}

#demo .demo-card h2,
#demo-early .demo-card h2 {
  font-size: clamp(2.068rem, 3.168vw, 3.3rem);
}

#pricing .section-head h2 {
  font-size: clamp(2.2rem, 3.784vw, 3.96rem);
}

.landing-support-card h2 {
  font-size: clamp(1.672rem, 2.64vw, 2.376rem);
}

@media (max-width: 520px) {
  #before-after .section-head h2,
  #problem .section-head h2,
  #analytics .section-head h2,
  #admin .section-head h2,
  #how .section-head h2,
  #features .section-head h2,
  #faq .section-head h2 {
    font-size: clamp(1.9505rem, 9.13vw, 2.6145rem);
  }

  #demo .demo-card h2,
  #demo-early .demo-card h2 {
    font-size: 2.068rem;
  }

  #pricing .section-head h2 {
    font-size: clamp(2.068rem, 9.68vw, 2.772rem);
  }

  .landing-support-card h2 {
    font-size: 1.804rem;
  }
}

@media (max-width: 520px) {
  .demo-card {
    padding-block: 15px;
  }

  .footer-contact--desktop {
    display: none;
  }

  .footer-contact--mobile {
    display: grid;
    width: min(100% - 28px, 500px);
    max-width: 500px;
    margin: 26px auto 0;
  }

  .footer-contact--mobile + .footer-bottom {
    margin-top: 30px;
  }

  .footer-socials {
    margin-top: 15px;
  }

  .footer-grid a.footer-social-link {
    width: 42px;
    height: 42px;
    font-size: 1.18rem;
  }
}

/* Conversion buttons v99: pronounced raised surfaces for the primary CTAs and support actions. */
.hero-actions .button,
.demo-form .button,
.landing-support-actions .button {
  border-radius: 10px;
  box-shadow:
    inset 0 3px 0 rgb(255 255 255 / 78%),
    inset 0 -4px 0 rgb(16 37 31 / 13%),
    0 16px 28px rgb(16 37 31 / 22%),
    0 5px 9px rgb(16 37 31 / 13%);
}

.hero-actions .button--primary,
.demo-form .button--primary {
  border-color: #c6da82;
  background: linear-gradient(180deg, #edf5c4 0%, #d8e99f 15%, #c9dd8d 70%, #b6ce70 100%);
}

.hero-actions .button--text,
.landing-support-actions .button--secondary {
  border-color: #c6d0c7;
  background: linear-gradient(180deg, #fff 0%, #fff 16%, #f7f8f4 72%, #e9eee8 100%);
}

.landing-support-actions .button--ink {
  border-color: #47745f;
  background: linear-gradient(180deg, #628775 0%, #4d7663 16%, #3f705b 70%, #315947 100%);
}

@media (hover: hover) and (pointer: fine) {
  .hero-actions .button:hover,
  .demo-form .button:hover,
  .landing-support-actions .button:hover {
    box-shadow:
      inset 0 3px 0 rgb(255 255 255 / 84%),
      inset 0 -4px 0 rgb(16 37 31 / 14%),
      0 20px 34px rgb(16 37 31 / 25%),
      0 6px 11px rgb(16 37 31 / 15%);
  }

  .hero-actions .button--primary:hover,
  .demo-form .button--primary:hover {
    background: linear-gradient(180deg, #f3f8d5 0%, #e0edac 15%, #d1e598 70%, #bdd577 100%);
  }

  .hero-actions .button--text:hover,
  .landing-support-actions .button--secondary:hover {
    background: linear-gradient(180deg, #fff 0%, #fff 16%, #f8faf6 72%, #edf1eb 100%);
  }

  .landing-support-actions .button--ink:hover {
    background: linear-gradient(180deg, #6a907d 0%, #557e6a 16%, #477762 70%, #345d4a 100%);
  }
}

.hero-actions .button:active,
.demo-form .button:active,
.landing-support-actions .button:active {
  box-shadow:
    inset 0 3px 6px rgb(16 37 31 / 18%),
    inset 0 -1px 0 rgb(255 255 255 / 26%),
    0 5px 10px rgb(16 37 31 / 17%);
  transform: translateY(2px);
}

/* Desktop conversion widths v100: keep CTAs and their supporting copy on one axis. */
@media (min-width: 841px) {
  .demo-form > .button,
  .pricing-card > .button {
    display: flex;
    width: 70%;
    margin-right: auto;
    margin-left: auto;
  }

  .demo-form > .form-note,
  .demo-form > .form-status {
    width: 70%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
  }
}

/* Lead cards v103: reduce the current lower inset by another 33% at every responsive size. */
.demo-card { padding-bottom: 11.7px; }

@media (max-width: 1100px) {
  .demo-card { padding-bottom: 8.4px; }
}

@media (max-width: 520px) {
  .demo-card { padding-bottom: 6px; }
}

/* Mobile pricing v102: keep long localized price labels inside the card. */
@media (max-width: 520px) {
  .pricing-card,
  .pricing-card__prices,
  .pricing-card__prices div {
    min-width: 0;
    max-width: 100%;
  }

  .pricing-card__prices div {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .pricing-card__prices strong {
    display: block;
    max-width: 100%;
    line-height: 1.08;
    text-align: center;
    white-space: normal;
  }
}

/* On very narrow phones the conversion action stays in document flow. This
   preserves the CTA without covering prices, controls, or the next heading. */
@media (max-width: 360px) {
  :root { scroll-padding-bottom: 0; }
  .mobile-cta,
  .mobile-cta.is-visible {
    position: static;
    z-index: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: flex;
    width: 70%;
    margin: 0 auto 28px;
    visibility: visible;
    opacity: 1;
    transform: none;
  }
  .mobile-cta:not(.is-visible) { display: none; }
  .site-footer { padding-bottom: 21px; }
}