/*
 * FileNest 2026 interface refresh
 * Presentation layer only: no tool, auth, billing, quota, OCR, upload or data-flow logic.
 * Visual direction: restrained SaaS shell, strong task hierarchy, white work surfaces,
 * compact tool discovery and mobile-first touch targets.
 */

:root {
  --ink: #14352f;
  --ink-deep: #0d2d27;
  --ink-soft: #49635e;
  --muted: #72827f;
  --paper: #f7f9f8;
  --cream: #f3f6f4;
  --white: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f5f8f6;
  --mint: #dceee7;
  --mint-soft: #eef8f4;
  --mint-dark: #246b57;
  --coral: #d95f48;
  --coral-dark: #b94b39;
  --amber: #e9aa4e;
  --blue: #e9f2f7;
  --line: #e3e9e6;
  --line-dark: #cdd8d3;
  --danger: #b33e35;
  --danger-bg: #fff3f1;
  --warning: #8a6518;
  --warning-bg: #fff8e7;
  --shadow: 0 24px 60px rgba(17, 52, 43, .09);
  --shadow-small: 0 8px 24px rgba(17, 52, 43, .07);
  --shadow-card: 0 4px 18px rgba(17, 52, 43, .055);
  --radius: 16px;
}

html {
  background: #f7f9f8;
  scroll-padding-top: 76px;
}

body {
  background: #f7f9f8;
  color: var(--ink);
  overflow-wrap: break-word;
}

::selection {
  background: #cce9df;
  color: var(--ink-deep);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(36, 107, 87, .25);
  outline-offset: 2px;
}

.saas-shell {
  background: #f7f9f8;
}

.saas-container {
  width: min(1180px, calc(100% - 40px));
}

.page-main {
  background: #f7f9f8;
}

/* Header */
.saas-header {
  height: 66px;
  gap: 22px;
  padding: 0 max(20px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid #e5ebe8;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 1px 0 rgba(13, 45, 39, .02);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.saas-brand {
  gap: 9px;
  color: var(--ink-deep);
}

.brand-mark {
  filter: none;
}

.brand-mark-header {
  width: 38px;
  height: 38px;
}

.saas-brand strong {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.035em;
}

.saas-brand small {
  color: #84928e;
  font-size: 10px;
  font-weight: 650;
}

.saas-nav {
  gap: 2px;
}

.saas-nav a {
  min-height: 38px;
  padding: 0 12px;
  border-radius: 9px;
  color: #435d57;
  font-size: 13px;
  font-weight: 700;
  transition: background .15s ease, color .15s ease;
}

.saas-nav a:hover {
  background: #f0f5f3;
  color: var(--ink-deep);
}

.language-switch,
.account-button,
.mobile-menu-toggle {
  min-height: 42px;
  border-radius: 10px;
  box-shadow: none;
}

.language-switch,
.mobile-menu-toggle {
  border-color: #dbe4e0;
  background: #fff;
}

.account-button {
  border-color: #12483b;
  background: #12483b;
  box-shadow: 0 3px 10px rgba(18, 72, 59, .12);
}

.account-button:hover {
  background: #0d3b31;
}

.saas-mobile-menu {
  top: 58px;
  right: 14px;
  width: min(290px, calc(100vw - 28px));
  padding: 8px;
  border-color: #dde6e2;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(13, 45, 39, .14);
}

.saas-mobile-menu a {
  border-radius: 10px;
}

.saas-mobile-menu a > svg {
  background: #eef7f3;
  color: #236b57;
}

/* Shared typography and actions */
.eyebrow,
.pro-kicker {
  color: #2d755f;
  letter-spacing: .055em;
  text-transform: none;
}

.primary-action,
.secondary-action {
  min-height: 46px;
  padding: 0 18px;
  border-radius: 10px;
  font-weight: 750;
  box-shadow: none;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.primary-action {
  border-color: #12483b;
  background: #12483b;
  color: #fff;
  box-shadow: 0 5px 14px rgba(18, 72, 59, .13);
}

.secondary-action {
  border-color: #cfdad5;
  background: #fff;
  color: #173e35;
}

.primary-action:hover:not(:disabled) {
  background: #0d3b31;
  box-shadow: 0 7px 18px rgba(18, 72, 59, .16);
  transform: translateY(-1px);
}

.secondary-action:hover:not(:disabled) {
  border-color: #9fb4aa;
  background: #f7faf8;
  transform: translateY(-1px);
}

.text-button {
  color: #236b57;
}

/* Home hero */
.home-hero {
  padding: 70px 0 62px;
  background:
    radial-gradient(circle at 78% 28%, rgba(206, 235, 225, .32), transparent 26%),
    linear-gradient(180deg, #ffffff 0%, #fafcfb 100%);
}

.home-hero::after {
  background: #e8edeb;
}

.hero-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: clamp(42px, 6vw, 78px);
}

.home-hero-copy h1,
.simple-hero h1,
.tool-hero-copy h1 {
  color: #0e342b;
  letter-spacing: -.045em;
}

.home-hero-copy h1 {
  max-width: 760px;
  margin: 14px 0 18px;
  font-size: clamp(44px, 5.4vw, 66px);
  line-height: 1.04;
}

.home-hero-copy h1 em {
  display: inline;
  color: #0e342b;
}

.home-hero-copy > p {
  max-width: 650px;
  color: #58706a;
  font-size: 17px;
  line-height: 1.7;
}

.hero-actions {
  margin-top: 26px;
}

.hero-trust,
.hero-assurances {
  gap: 12px 18px;
  margin-top: 20px;
}

.hero-trust span,
.hero-assurances span {
  color: #6e817c;
  font-weight: 650;
}

.rename-demo-card {
  padding: 18px;
  border: 1px solid #dce5e1;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 26px 60px rgba(19, 57, 48, .10);
  transform: none;
}

.rename-demo-card::before {
  top: -38px;
  right: -20px;
  width: 150px;
  height: 150px;
  background: #dff1ea;
  opacity: .52;
  filter: blur(1px);
}

.demo-rule {
  background: #f2f8f5;
}

.demo-rule > span,
.demo-footer .demo-button {
  background: #12483b;
}

.demo-window-bar > span:first-child { background: #d9644d; }
.demo-window-bar > span:nth-child(2) { background: #e3ad53; }
.demo-window-bar > span:nth-child(3) { background: #4ea882; }

.home-proof {
  border-bottom: 1px solid #e5ebe8;
  background: #fff;
}

.home-proof > div {
  min-height: 62px;
}

.home-proof span {
  color: #526b64;
}

.home-proof svg {
  color: #2f7963;
}

/* Sections */
.content-section {
  padding-top: 72px;
  padding-bottom: 72px;
}

.section-heading {
  margin-bottom: 28px;
}

.section-heading h2,
.calm-promise-grid h2,
.home-pricing-teaser h2,
.quota-policy h2,
.pro-feature-layout h2 {
  color: #123a31;
  font-size: clamp(28px, 3.3vw, 42px);
  letter-spacing: -.035em;
}

.section-heading p,
.calm-promise-grid p,
.home-pricing-teaser p,
.quota-policy p,
.pro-feature-layout p {
  color: #60736e;
  line-height: 1.7;
}

.quick-start-strip {
  gap: 12px;
  margin: 0 0 26px;
}

.quick-start-strip > div {
  min-height: 70px;
  border-color: #e0e7e4;
  border-radius: 13px;
  background: #fff;
  box-shadow: var(--shadow-card);
}

.quick-start-strip > div > span {
  border: 1px solid #e4ebe8;
  background: #f3f8f6;
  box-shadow: none;
}

.soft-section {
  background: #f1f5f3;
}

.calm-promise-section {
  border-top: 1px solid #e3e9e6;
  border-bottom: 1px solid #e3e9e6;
  background: #f1f5f3;
}

.calm-promise-grid,
.home-pricing-teaser,
.pro-feature-layout,
.quota-policy {
  border-color: #dce5e1;
}

/* Tool finder */
.tool-finder-controls {
  padding: 16px;
  border: 1px solid #dce5e1;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(19, 57, 48, .065);
}

.tool-search {
  min-height: 54px;
  border: 1px solid #cfdad5;
  border-radius: 12px;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(13, 45, 39, .02);
}

.tool-search:focus-within {
  border-color: #4d927e;
  box-shadow: 0 0 0 3px rgba(36, 107, 87, .10);
}

.tool-search > svg {
  color: #2d755f;
}

.tool-search input {
  color: #173b33;
}

.tool-search input::placeholder {
  color: #94a19e;
}

.tool-search button {
  border-radius: 8px;
}

.tool-filter-chips {
  gap: 8px;
  padding-top: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.tool-filter-chips button {
  min-height: 38px;
  flex: 0 0 auto;
  padding: 0 13px;
  border: 1px solid #dce4e0;
  border-radius: 999px;
  background: #fff;
  color: #4e655f;
  box-shadow: none;
  font-weight: 700;
}

.tool-filter-chips button:hover {
  border-color: #b8c8c1;
  background: #f5f8f6;
}

.tool-filter-chips button.active {
  border-color: #12483b;
  background: #12483b;
  color: #fff;
}

.tool-finder-result {
  margin: 26px 0 14px;
}

.tool-finder-result strong {
  color: #173d34;
}

.tool-finder-result span {
  color: #7a8985;
}

.tool-card-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.tool-card {
  min-height: 210px;
  padding: 20px;
  border: 1px solid #e0e7e4;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 3px 14px rgba(15, 49, 41, .045);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.tool-card::before,
.tool-card::after {
  display: none;
}

.tool-card:hover {
  border-color: #b8ccc3;
  box-shadow: 0 12px 30px rgba(15, 49, 41, .09);
  transform: translateY(-3px);
}

.tool-card-top {
  margin-bottom: 16px;
}

.tool-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 11px;
  box-shadow: none;
}

.tool-card-icon svg {
  width: 23px;
  height: 23px;
}

.tool-card[data-tone="coral"] .tool-card-icon,
.tool-card[data-tone="red"] .tool-card-icon { background: #d65d45; color: #fff; }
.tool-card[data-tone="mint"] .tool-card-icon,
.tool-card[data-tone="teal"] .tool-card-icon,
.tool-card[data-tone="cyan"] .tool-card-icon { background: #339575; color: #fff; }
.tool-card[data-tone="blue"] .tool-card-icon,
.tool-card[data-tone="indigo"] .tool-card-icon { background: #4f7fd3; color: #fff; }
.tool-card[data-tone="plum"] .tool-card-icon { background: #7b62a7; color: #fff; }
.tool-card[data-tone="sun"] .tool-card-icon { background: #d99437; color: #fff; }

.tool-category-tag {
  border: 0;
  border-radius: 999px;
  background: #f4f7f5;
  color: #63756f;
  font-size: 10px;
  font-weight: 750;
}

.tool-card h3 {
  margin-top: 0;
  color: #163b32;
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -.015em;
}

.tool-card p {
  color: #6e7f7a;
  font-size: 12px;
  line-height: 1.6;
}

.tool-card > strong {
  color: #276f5b;
  font-size: 12px;
}

.tool-finder-empty {
  border-color: #dce5e1;
  background: #fff;
}

/* Tool pages and workspaces */
.tool-hero,
.simple-hero {
  padding-top: 64px;
  padding-bottom: 46px;
}

.simple-hero {
  max-width: 1180px;
}

.simple-hero h1,
.tool-hero-copy h1 {
  max-width: 920px;
  margin-top: 12px;
  margin-bottom: 16px;
  font-size: clamp(38px, 4.5vw, 58px);
  line-height: 1.07;
}

.simple-hero > p,
.tool-hero-copy > p {
  max-width: 820px;
  color: #61746e;
  font-size: 16px;
  line-height: 1.75;
}

.tool-identity i {
  border-radius: 10px;
  box-shadow: none;
}

.tool-quick-guide {
  gap: 12px;
  margin-bottom: 20px;
}

.tool-quick-guide article {
  border: 1px solid #e0e7e4;
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--shadow-card);
}

.tool-quick-guide article > span {
  border-radius: 11px;
}

.quota-confirmation,
.integration-notice,
.account-banner,
.form-notice {
  border-radius: 13px;
  box-shadow: none;
}

.quota-confirmation {
  border: 1px solid #dce5e1;
  background: #fff;
}

.tool-stage {
  padding-top: 18px;
  padding-bottom: 72px;
}

.tool-workspace,
.image-studio,
.rename-app-grid,
.document-options-panel,
.pdf-toolkit,
.data-converter,
.duplicate-finder,
.ocr-cloud-shell {
  border-color: #dce5e1;
}

.tool-workspace,
.auth-card,
.billing-panel,
.activity-panel,
.account-summary-grid > article,
.free-plan-card,
.pro-pricing-area,
.period-grid > article {
  box-shadow: var(--shadow-card);
}

.tool-workspace input,
.tool-workspace select,
.tool-workspace textarea,
.auth-card input,
.auth-card select,
.auth-card textarea {
  border-color: #cfdad5;
  border-radius: 10px;
  background: #fff;
}

.tool-workspace input:focus,
.tool-workspace select:focus,
.tool-workspace textarea:focus,
.auth-card input:focus,
.auth-card select:focus,
.auth-card textarea:focus {
  border-color: #4d927e;
  box-shadow: 0 0 0 3px rgba(36, 107, 87, .09);
}

/* Pricing */
.pricing-grid {
  gap: 20px;
  padding-bottom: 72px;
}

.free-plan-card,
.pro-pricing-area {
  border: 1px solid #dce5e1;
  border-radius: 17px;
  background: #fff;
}

.free-plan-card {
  padding: 24px;
}

.pro-pricing-area {
  padding: 24px;
}

.plan-label,
.saving-pill,
.best-value {
  border-radius: 999px;
}

.period-grid {
  gap: 12px;
}

.period-grid > article {
  border: 1px solid #dfe7e3;
  border-radius: 14px;
  background: #fff;
}

.period-grid > article.is-best {
  border-color: #4c927d;
  box-shadow: 0 8px 24px rgba(36, 107, 87, .10);
}

.best-value {
  background: #12483b;
  color: #fff;
}

.feature-check-list li svg {
  color: #2c7a61;
}

/* Accounts */
.account-page {
  background: #f7f9f8;
}

.auth-layout {
  gap: 34px;
}

.auth-copy,
.auth-card,
.account-welcome,
.activity-panel,
.billing-panel,
.account-summary-grid > article,
.account-free-cta {
  border-color: #dce5e1;
}

.auth-card {
  border-radius: 16px;
  background: #fff;
}

.auth-tabs {
  padding: 4px;
  border-radius: 12px;
  background: #f1f4f2;
}

.auth-tabs button {
  min-height: 42px;
  border-radius: 9px;
}

.auth-tabs button.active {
  background: #fff;
  color: #153b32;
  box-shadow: 0 2px 8px rgba(15, 49, 41, .07);
}

.account-welcome,
.activity-panel,
.billing-panel,
.account-summary-grid > article {
  border-radius: 15px;
  background: #fff;
}

.account-summary-grid {
  gap: 14px;
}

.account-free-cta {
  border-radius: 15px;
  background: #eef7f3;
}

.activity-columns article,
.invoice-list article {
  border-color: #e2e8e5;
  border-radius: 11px;
  background: #fbfcfc;
}

/* Trust, legal, status, guides and long-form surfaces */
.trust-page,
.privacy-page,
.terms-page,
.status-page,
.guides-page,
.guide-page {
  background: #f7f9f8;
}

.trust-card,
.status-card,
.guide-card,
.legal-card,
.trust-grid > article,
.status-grid > article {
  border-color: #dce5e1;
  border-radius: 15px;
  background: #fff;
  box-shadow: var(--shadow-card);
}

/* Footer */
.saas-footer {
  border-top: 0;
  background: #113f34;
  color: #eaf4f0;
}

.footer-main {
  padding-top: 48px;
  padding-bottom: 34px;
}

.footer-main > div {
  min-width: 0;
}

.footer-logo,
.footer-main strong {
  color: #fff;
}

.footer-logo small,
.footer-main p,
.footer-main a,
.footer-main span,
.footer-bottom-row {
  color: #bdd0c8;
}

.footer-main a:hover {
  color: #fff;
}

.footer-brand-mark {
  filter: none;
}

.footer-bottom-row {
  border-top-color: rgba(255, 255, 255, .12);
}

.saas-footer img {
  border-radius: 8px;
}

/* Scrollbars where horizontal interaction matters */
.tool-filter-chips,
[aria-label*="横向滚动"],
[aria-label*="horizontally scrollable"] {
  scrollbar-color: #b8c9c1 transparent;
  scrollbar-width: thin;
}

.tool-filter-chips::-webkit-scrollbar,
[aria-label*="横向滚动"]::-webkit-scrollbar,
[aria-label*="horizontally scrollable"]::-webkit-scrollbar {
  height: 5px;
}

.tool-filter-chips::-webkit-scrollbar-thumb,
[aria-label*="横向滚动"]::-webkit-scrollbar-thumb,
[aria-label*="horizontally scrollable"]::-webkit-scrollbar-thumb {
  border-radius: 99px;
  background: #bccbc5;
}

/* Tablet */
@media (max-width: 1050px) {
  .saas-container {
    width: min(100% - 32px, 980px);
  }

  .saas-header {
    padding-inline: 16px;
  }

  .saas-brand small {
    display: none;
  }

  .hero-grid {
    gap: 36px;
  }

  .tool-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .saas-nav {
    display: none;
  }

  .mobile-menu-toggle {
    display: inline-flex;
  }

  .account-button {
    display: none;
  }

  .saas-header-actions {
    margin-left: auto;
  }

  .home-hero {
    padding: 54px 0 50px;
  }

  .hero-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .home-hero-copy {
    max-width: 760px;
  }

  .rename-demo-card {
    max-width: 620px;
  }

  .tool-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .quick-start-strip,
  .tool-quick-guide {
    grid-template-columns: 1fr;
  }

  .pricing-grid,
  .auth-layout,
  .calm-promise-grid,
  .pro-feature-layout {
    grid-template-columns: 1fr;
  }

  .footer-main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 640px) {
  :root {
    --radius: 14px;
  }

  html {
    scroll-padding-top: 68px;
  }

  .saas-container {
    width: calc(100% - 28px);
  }

  .saas-header {
    height: 62px;
    gap: 10px;
    padding-inline: 14px;
  }

  .brand-mark-header {
    width: 36px;
    height: 36px;
  }

  .saas-brand strong {
    font-size: 19px;
  }

  .language-switch,
  .mobile-menu-toggle {
    min-height: 42px;
  }

  .language-switch {
    padding-inline: 10px;
  }

  .home-hero {
    padding: 42px 0 38px;
  }

  .home-hero-copy {
    text-align: center;
  }

  .home-hero-copy .eyebrow {
    justify-content: center;
  }

  .home-hero-copy h1 {
    margin-top: 12px;
    font-size: clamp(35px, 10.4vw, 46px);
    line-height: 1.08;
  }

  .home-hero-copy > p {
    margin-inline: auto;
    font-size: 15px;
    line-height: 1.68;
  }

  .hero-actions,
  .hero-trust {
    justify-content: center;
  }

  .hero-actions .primary-action,
  .hero-actions .secondary-action {
    flex: 1 1 180px;
  }

  .rename-demo-card {
    display: none;
  }

  .home-proof > div {
    min-height: auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .content-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .section-heading {
    margin-bottom: 22px;
  }

  .section-heading h2,
  .calm-promise-grid h2,
  .home-pricing-teaser h2,
  .quota-policy h2,
  .pro-feature-layout h2 {
    font-size: 28px;
  }

  .quick-start-strip {
    gap: 8px;
  }

  .quick-start-strip > div {
    min-height: 62px;
  }

  .tool-finder-controls {
    margin-inline: -4px;
    padding: 11px;
    border-radius: 14px;
  }

  .tool-search {
    min-height: 50px;
  }

  .tool-filter-chips {
    margin-inline: -2px;
    padding-bottom: 3px;
  }

  .tool-filter-chips button {
    min-height: 38px;
    padding-inline: 12px;
    font-size: 12px;
  }

  .tool-finder-result {
    margin: 22px 0 12px;
  }

  .tool-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .tool-card {
    min-height: 146px;
    padding: 15px 13px;
    border-radius: 13px;
  }

  .tool-card-top {
    margin-bottom: 12px;
  }

  .tool-card-icon {
    width: 42px;
    height: 42px;
  }

  .tool-category-tag {
    max-width: 76px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .tool-card h3 {
    margin-bottom: 0;
    font-size: 14px;
  }

  .tool-card p,
  .tool-card > strong {
    display: none;
  }

  .tool-hero,
  .simple-hero {
    padding-top: 42px;
    padding-bottom: 34px;
  }

  .simple-hero h1,
  .tool-hero-copy h1 {
    font-size: clamp(34px, 9vw, 44px);
  }

  .simple-hero > p,
  .tool-hero-copy > p {
    font-size: 15px;
  }

  .tool-hero-actions {
    gap: 10px;
  }

  .tool-hero-actions > .primary-action,
  .tool-hero-actions > .secondary-action {
    width: 100%;
  }

  .hero-assurances {
    width: 100%;
    gap: 8px;
  }

  .tool-quick-guide {
    gap: 9px;
  }

  .tool-quick-guide article {
    min-height: auto;
  }

  .quota-confirmation {
    padding: 14px;
  }

  .tool-stage {
    padding-bottom: 52px;
  }

  .free-plan-card,
  .pro-pricing-area {
    padding: 18px;
  }

  .period-grid {
    grid-template-columns: 1fr;
  }

  .auth-layout {
    gap: 18px;
  }

  .auth-copy {
    padding-top: 0;
  }

  .auth-card {
    border-radius: 14px;
  }

  .account-summary-grid {
    grid-template-columns: 1fr;
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 28px;
    padding-top: 38px;
  }

  .footer-bottom-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .saas-footer > .saas-container:last-child {
    gap: 8px !important;
  }

  .saas-footer > .saas-container:last-child a {
    max-width: calc(50% - 6px);
  }
}

@media (max-width: 360px) {
  .saas-container {
    width: calc(100% - 22px);
  }

  .language-switch svg {
    display: none;
  }

  .tool-card-grid {
    grid-template-columns: 1fr;
  }

  .tool-card {
    min-height: 130px;
  }
}

@media (min-width: 1500px) {
  .saas-container {
    width: min(1240px, calc(100% - 64px));
  }

  .hero-grid {
    grid-template-columns: 1.05fr .95fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .saas-header {
    background: #fff;
  }
}