:root {
      --forest: var(--sheltra-forest);
      --sage-brand: var(--sheltra-sage);
      --warm-white: var(--sheltra-warm-white);
      --terracotta: var(--sheltra-terracotta);
      --sand-brand: var(--sheltra-sand);
      --action: var(--sheltra-action);
      --ink: var(--forest);
      --ink-soft: var(--sheltra-muted);
      --sage: var(--forest);
      --sage-dark: var(--forest);
      --mint: var(--sage-brand);
      --mint-light: color-mix(in srgb, var(--sage-brand) 58%, var(--warm-white));
      --cream: var(--sand-brand);
      --cream-light: var(--warm-white);
      --paper: var(--warm-white);
      --white: var(--warm-white);
      --rose: var(--terracotta);
      --sun: var(--terracotta);
      --line: color-mix(in srgb, var(--sheltra-forest) 20%, transparent);
      --line-strong: color-mix(in srgb, var(--sheltra-forest) 42%, transparent);
      --shadow-sm: 0 8px 24px color-mix(in srgb, var(--sheltra-forest) 8%, transparent);
      --shadow-md: 0 14px 36px color-mix(in srgb, var(--sheltra-forest) 10%, transparent);
      --shadow-lg: 0 20px 52px color-mix(in srgb, var(--sheltra-forest) 12%, transparent);
      --radius-sm: 10px;
      --radius-md: 16px;
      --radius-lg: 20px;
      --radius-xl: 24px;
      --container: min(1240px, calc(100vw - 40px));
      --serif: var(--sheltra-font-display, "Playfair Display", Georgia, serif);
      --sans: var(--sheltra-font-ui, "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
      --af-ink: var(--ink);
      --af-sage: var(--sage);
      --af-mint: var(--mint);
      --af-cream: var(--cream);
      --af-paper: var(--paper);
      --af-white: var(--white);
      --af-ink-06: color-mix(in srgb, var(--sheltra-forest) 6%, transparent);
      --af-ink-08: color-mix(in srgb, var(--sheltra-forest) 8%, transparent);
      --af-ink-12: color-mix(in srgb, var(--sheltra-forest) 12%, transparent);
      --af-ink-18: color-mix(in srgb, var(--sheltra-forest) 18%, transparent);
      --af-ink-72: color-mix(in srgb, var(--sheltra-forest) 72%, transparent);
      --af-shadow-sm: var(--shadow-sm);
      --af-shadow-lg: var(--shadow-lg);
      --af-radius-sm: var(--radius-sm);
      --af-radius-md: var(--radius-md);
      --af-radius-lg: var(--radius-lg);
      --af-radius-xl: var(--radius-xl);
      --af-container: var(--container);
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      font-family: var(--sans);
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }
    body.menu-open { overflow: hidden; }
    body.menu-open .sheltra-action-bar--above-navigation { display: none !important; }
    a { color: inherit; text-decoration: none; }
    button, input { font: inherit; }
    button { color: inherit; }
    img, svg { display: block; max-width: 100%; }
    ::selection { color: var(--ink); background: var(--mint); }

    .skip-link {
      position: fixed;
      z-index: 1000;
      top: -80px;
      left: 18px;
      padding: 12px 18px;
      border-radius: 999px;
      color: var(--white);
      background: var(--ink);
      transition: top .2s ease;
    }
    .skip-link:focus { top: 18px; }

    .announcement {
      position: relative;
      z-index: 60;
      min-height: 36px;
      padding: 8px 50px;
      color: var(--white);
      background: var(--ink);
      text-align: center;
      font-size: .83rem;
      letter-spacing: .01em;
    }
    .announcement strong { color: var(--mint); }
    .announcement a { border-bottom: 1px solid rgba(255,255,255,.5); }

    .site-header {
      position: sticky;
      z-index: 50;
      top: 0;
      border-bottom: 1px solid transparent;
      background: color-mix(in srgb, var(--sheltra-warm-white) 91%, transparent);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      transition: box-shadow .2s ease, border-color .2s ease;
    }
    .site-header.scrolled {
      border-color: var(--line);
      box-shadow: 0 10px 32px color-mix(in srgb, var(--sheltra-forest) 5%, transparent);
    }
    .nav {
      width: var(--container);
      height: 80px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 32px;
    }
    .brand {
      display: inline-flex;
      align-items: center;
      gap: 11px;
      font-size: 1.32rem;
      font-weight: 800;
      letter-spacing: -.045em;
      white-space: nowrap;
    }
    .brand-mark {
      width: 42px;
      height: 49px;
      display: block;
      flex: 0 0 auto;
    }
    .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
    .brand-mark--lockup {
      width: 48px;
      height: 56px;
    }
    .brand-wordmark {
      display: grid;
      color: #001a37;
      font-family: var(--sheltra-font-ui, "Inter", system-ui, sans-serif);
      line-height: 1;
      letter-spacing: 0;
    }
    .brand-wordmark .brand-name { font-size: 1.5rem; font-weight: 800; }
    .brand-tagline { margin-top: 3px; color: #81a489; font-size: .49rem; font-weight: 800; }
    .brand-byline { margin-top: 3px; color: #bdbdbd; font-size: .36rem; font-weight: 700; }
    .desktop-nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }
    .nav-item { position: relative; }
    .nav-trigger,
    .nav-direct {
      min-height: 42px;
      padding: 0 12px;
      border: 0;
      border-radius: 12px;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: transparent;
      font-size: .93rem;
      font-weight: 700;
      cursor: pointer;
      list-style: none;
      transition: background .18s ease;
    }
    .nav-trigger::-webkit-details-marker { display: none; }
    .nav-trigger:hover,
    .nav-direct:hover,
    .nav-item[open] .nav-trigger { background: var(--mint-light); }
    .nav-direct.current-menu-item,
    .nav-item.current-menu-ancestor .nav-trigger {
      color: var(--sage-dark);
      background: var(--mint-light);
    }
    .chevron { width: 15px; height: 15px; transition: transform .18s ease; }
    .nav-item[open] .chevron { transform: rotate(180deg); }
    .mega-menu {
      position: absolute;
      top: calc(100% + 13px);
      left: 50%;
      z-index: 90;
      width: min(760px, calc(100vw - 44px));
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: 24px;
      display: grid;
      grid-template-columns: 1.25fr .75fr;
      gap: 12px;
      background: rgba(255,255,255,.98);
      box-shadow: var(--shadow-md);
      opacity: 1;
      pointer-events: auto;
      transform: translateX(-50%);
      visibility: visible;
      transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    }
    .mega-menu.is-full {
      grid-template-columns: 1fr;
    }
    .desktop-nav .nav-item:not([open]) > .mega-menu {
      display: none;
    }
    .desktop-nav .nav-item[open] > .mega-menu {
      display: grid;
      opacity: 1;
      pointer-events: auto;
      transform: translateX(-50%);
      visibility: visible;
    }
    .mega-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px;
      align-content: start;
    }
    .mega-list > .mega-link:only-child { grid-column: 1 / -1; }
    .mega-link {
      padding: 12px;
      border-radius: 15px;
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 10px;
      align-items: start;
      transition: background .18s ease;
    }
    .mega-link:hover { background: var(--mint-light); }
    .mega-icon {
      width: 34px;
      height: 34px;
      border-radius: 11px;
      display: grid;
      place-items: center;
      background: var(--cream);
      font-size: .95rem;
      font-weight: 800;
    }
    .mega-link strong { display: block; font-size: .9rem; line-height: 1.25; }
    .mega-link small { display: block; margin-top: 3px; color: var(--ink-soft); font-size: .73rem; line-height: 1.35; }
    .mega-feature {
      padding: 20px;
      border-radius: 18px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      background: var(--ink);
      color: var(--white);
    }
    .mega-feature span { color: var(--mint); font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
    .mega-feature strong { display: block; margin: 7px 0 8px; font-size: 1.2rem; line-height: 1.18; letter-spacing: -.03em; }
    .mega-feature p { margin: 0 0 18px; color: rgba(255,255,255,.7); font-size: .82rem; }
    .mega-feature a { font-size: .82rem; font-weight: 800; }
    .nav-actions { display: flex; align-items: center; gap: 12px; }
    .nav-actions .nav-phone {
      min-height: 44px;
      padding: 0 13px;
      border: 1px solid var(--line);
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--white);
      white-space: nowrap;
    }
    .nav-phone-icon {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: var(--mint);
      color: var(--ink);
      font-size: .8rem;
    }
    .nav-phone-copy {
      display: grid;
      line-height: 1.05;
    }
    .nav-phone-copy small {
      color: var(--ink-soft);
      font-size: .6rem;
      font-weight: 800;
    }
    .nav-phone-copy strong {
      color: var(--ink);
      font-size: .78rem;
      font-weight: 800;
    }
    .login-link { padding: 10px 4px; font-size: .92rem; font-weight: 800; }

    .button {
      min-height: 50px;
      padding: 0 22px;
      border: 1.5px solid var(--ink);
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      font-weight: 800;
      letter-spacing: -.015em;
      cursor: pointer;
      transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    }
    .button:hover { transform: translateY(-2px); }
    .button:active { transform: translateY(0); }
    .button-dark { color: var(--white); background: var(--ink); box-shadow: 0 7px 0 color-mix(in srgb, var(--sheltra-forest) 16%, transparent); }
    .button-dark:hover { box-shadow: 0 9px 0 color-mix(in srgb, var(--sheltra-forest) 12%, transparent); }
    .button-light { color: var(--ink); background: var(--white); box-shadow: 0 7px 0 color-mix(in srgb, var(--sheltra-forest) 11%, transparent); }
    .button-sage { color: var(--white); background: var(--sage); box-shadow: 0 7px 0 color-mix(in srgb, var(--sheltra-forest) 13%, transparent); }
    .button-small { min-height: 44px; padding: 0 18px; font-size: .88rem; }
    .arrow { width: 18px; height: 18px; transition: transform .18s ease; }
    .button:hover .arrow, .text-link:hover .arrow { transform: translateX(3px); }
    .text-link {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--sage-dark);
      font-size: .9rem;
      font-weight: 800;
    }
    .mobile-toggle {
      width: 46px;
      height: 46px;
      border: 1.5px solid var(--ink);
      border-radius: 50%;
      display: none;
      place-items: center;
      background: var(--paper);
      cursor: pointer;
    }
    .mobile-toggle span,
    .mobile-toggle span::before,
    .mobile-toggle span::after {
      content: "";
      width: 19px;
      height: 2px;
      display: block;
      border-radius: 4px;
      background: var(--ink);
      transition: transform .2s ease, opacity .2s ease;
    }
    .mobile-toggle span { position: relative; }
    .mobile-toggle span::before { position: absolute; top: -6px; }
    .mobile-toggle span::after { position: absolute; top: 6px; }
    .mobile-toggle.active span { background: transparent; }
    .mobile-toggle.active span::before { transform: translateY(6px) rotate(45deg); }
    .mobile-toggle.active span::after { transform: translateY(-6px) rotate(-45deg); }
    .mobile-menu {
      position: fixed;
      z-index: 49;
      inset: 0;
      padding: calc(var(--mobile-menu-content-top, 80px) + 22px) 20px 40px;
      display: none;
      overflow: auto;
      overscroll-behavior: contain;
      background: var(--paper);
    }
    .mobile-menu.open { display: block; }
    .mobile-menu details { border-bottom: 1px solid var(--line); }
    .mobile-menu summary,
    .mobile-menu > a {
      min-height: 56px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-weight: 800;
      list-style: none;
    }
    .mobile-menu .current-menu-item { color: var(--sage-dark); }
    .mobile-sub { padding: 0 0 16px 14px; display: grid; gap: 10px; }
    .mobile-sub a { color: var(--ink-soft); font-size: .92rem; }
    .mobile-actions { padding-top: 24px; display: grid; gap: 12px; }
    .mobile-actions .nav-phone {
      min-height: 54px;
      padding: 10px 14px;
      border: 1px solid var(--line);
      border-radius: 16px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: var(--white);
    }

    .hero {
      position: relative;
      min-height: 720px;
      overflow: hidden;
      border-bottom: 1.5px solid var(--ink);
      background: var(--cream);
    }
    .hero::before {
      content: "";
      position: absolute;
      width: 620px;
      height: 620px;
      top: -335px;
      left: -250px;
      border: 100px solid var(--mint);
      border-radius: 44% 56% 63% 37% / 54% 40% 60% 46%;
      opacity: .7;
      transform: rotate(24deg);
    }
    .hero::after {
      content: "";
      position: absolute;
      right: -120px;
      bottom: -210px;
      width: 410px;
      height: 410px;
      border: 58px solid color-mix(in srgb, var(--sheltra-terracotta) 62%, transparent);
      border-radius: 57% 43% 42% 58% / 46% 61% 39% 54%;
      transform: rotate(-14deg);
    }
    .hero-inner {
      position: relative;
      z-index: 2;
      width: var(--container);
      min-height: 720px;
      margin: 0 auto;
      padding: 76px 0 72px;
      display: grid;
      grid-template-columns: minmax(0, .95fr) minmax(500px, 1.05fr);
      align-items: center;
      gap: clamp(42px, 7vw, 100px);
    }
    .eyebrow,
    .section-kicker {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      color: var(--sage-dark);
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .095em;
      text-transform: uppercase;
    }
    .eyebrow-dot {
      width: 9px;
      height: 9px;
      border: 1px solid var(--ink);
      border-radius: 50%;
      background: var(--sage);
      box-shadow: 2px 2px 0 var(--mint);
    }
    h1 {
      max-width: 720px;
      margin: 22px 0 22px;
      font-size: clamp(3.2rem, 5.35vw, 5.7rem);
      line-height: .97;
      letter-spacing: -.067em;
    }
    .serif { font-family: var(--serif); font-style: italic; font-weight: 500; letter-spacing: -.055em; }
    .hero-copy {
      max-width: 680px;
      margin: 0;
      color: var(--ink-soft);
      font-size: clamp(1.08rem, 1.55vw, 1.28rem);
      line-height: 1.62;
    }
    .hero-copy strong { color: var(--ink); }
    .hero-actions { margin-top: 31px; display: flex; flex-wrap: wrap; gap: 14px; }
    .proof-list { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px 20px; }
    .proof-list span { display: inline-flex; align-items: center; gap: 7px; color: var(--ink-soft); font-size: .82rem; font-weight: 700; }
    .proof-list i {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--white);
      background: var(--sage);
      font-size: .68rem;
      font-style: normal;
      font-weight: 900;
    }
    .hero-visual { position: relative; min-height: 575px; }
    .hero-blob {
      position: absolute;
      inset: 18px 4px 8px 76px;
      border: 1.5px solid var(--ink);
      border-radius: 43% 57% 48% 52% / 48% 42% 58% 52%;
      background: var(--mint);
      transform: rotate(3deg);
    }
    .photo-frame {
      position: absolute;
      top: 26px;
      right: 13px;
      width: 61%;
      height: 500px;
      overflow: hidden;
      border: 1.5px solid var(--ink);
      border-radius: 34px 88px 35px 70px;
      background: var(--sheltra-sage);
      box-shadow: var(--shadow-lg);
      transform: rotate(2deg);
    }
    .photo-frame img { width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }
    .photo-caption {
      position: absolute;
      right: 26px;
      bottom: 17px;
      max-width: 210px;
      padding: 10px 14px;
      border: 1px solid color-mix(in srgb, var(--sheltra-forest) 20%, transparent);
      border-radius: 999px;
      background: rgba(255,255,255,.88);
      backdrop-filter: blur(10px);
      font-size: .73rem;
      font-weight: 800;
      text-align: center;
    }
    .photo-caption--top-left { top: 17px; right: auto; bottom: auto; left: 26px; }
    .photo-caption--top-right { top: 17px; right: 26px; bottom: auto; left: auto; }
    .photo-caption--bottom-left { right: auto; bottom: 17px; left: 26px; }
    .photo-caption--bottom-right { right: 26px; bottom: 17px; left: auto; }
    .product-float {
      position: absolute;
      z-index: 3;
      left: 0;
      bottom: 24px;
      width: 69%;
      border: 1.5px solid var(--ink);
      border-radius: 25px;
      overflow: hidden;
      background: var(--white);
      box-shadow: var(--shadow-lg);
      transform: rotate(-1.5deg);
    }
    .window-top {
      min-height: 39px;
      padding: 0 14px;
      border-bottom: 1px solid var(--line);
      display: flex;
      align-items: center;
      gap: 6px;
      background: var(--sheltra-warm-white);
    }
    .window-top i { width: 8px; height: 8px; border-radius: 50%; background: var(--rose); }
    .window-top i:nth-child(2) { background: var(--sun); }
    .window-top i:nth-child(3) { background: var(--sage); }
    .window-top b { margin-left: 6px; color: var(--ink-soft); font-size: .67rem; }
    .float-body { padding: 15px; }
    .animal-row {
      padding: 11px;
      border: 1px solid var(--line);
      border-radius: 14px;
      display: grid;
      grid-template-columns: 42px 1fr auto;
      gap: 10px;
      align-items: center;
      background: var(--cream-light);
    }
    .animal-avatar { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--mint); font-size: 1.3rem; }
    .animal-row strong { display: block; font-size: .82rem; }
    .animal-row small { display: block; color: var(--ink-soft); font-size: .64rem; }
    .status { padding: 5px 8px; border-radius: 999px; color: var(--sage-dark); background: var(--mint); font-size: .61rem; font-weight: 800; }
    .float-grid { margin-top: 9px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .float-card { padding: 10px; border: 1px solid var(--line); border-radius: 12px; }
    .float-card span { display: block; color: var(--ink-soft); font-size: .59rem; }
    .float-card strong { display: block; margin-top: 2px; font-size: .7rem; line-height: 1.3; }
    .hero-note {
      position: absolute;
      z-index: 4;
      top: 11px;
      left: 20px;
      padding: 12px 16px;
      border: 1.5px solid var(--ink);
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--white);
      box-shadow: 5px 6px 0 color-mix(in srgb, var(--sheltra-forest) 12%, transparent);
      font-size: .76rem;
      font-weight: 800;
      transform: rotate(-4deg);
    }
    .hero-note i { color: var(--sage); font-style: normal; }
    .hero-note--top-left { top: 11px; right: auto; bottom: auto; left: 20px; transform: rotate(-4deg); }
    .hero-note--top-right { top: 11px; right: 20px; bottom: auto; left: auto; transform: rotate(4deg); }
    .hero-note--bottom-left { top: auto; right: auto; bottom: 11px; left: 20px; transform: rotate(3deg); }
    .hero-note--bottom-right { top: auto; right: 20px; bottom: 11px; left: auto; transform: rotate(-3deg); }

    .trust-strip { border-bottom: 1px solid var(--line); background: var(--white); }
    .trust-inner {
      width: var(--container);
      min-height: 82px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      align-items: center;
      gap: 16px;
    }
    .trust-inner span { display: flex; justify-content: center; align-items: center; gap: 9px; color: var(--ink-soft); font-size: .77rem; font-weight: 800; text-align: center; }
    .trust-inner i { color: var(--sage-dark); font-size: 1rem; font-style: normal; }

    .section { padding: clamp(86px, 9vw, 132px) 0; }
    .section-inner { width: var(--container); margin: 0 auto; }
    .section-head { max-width: 800px; }
    .section-head.centered { margin: 0 auto 54px; text-align: center; }
    .section-head.centered .section-kicker { justify-content: center; }
    .section-title {
      margin: 16px 0 18px;
      font-size: clamp(2.45rem, 4.4vw, 4.5rem);
      line-height: 1.04;
      letter-spacing: -.058em;
    }
    .section-lead { margin: 0; color: var(--ink-soft); font-size: clamp(1.02rem, 1.5vw, 1.2rem); line-height: 1.7; }

    .reality { background: var(--paper); }
    .reality-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(50px, 8vw, 120px); align-items: center; }
    .reality-copy p { max-width: 570px; }
    .reality-copy .text-link { margin-top: 25px; }
    .chaos-board {
      position: relative;
      min-height: 510px;
      border: 1.5px solid var(--ink);
      border-radius: var(--radius-lg);
      background: var(--cream-light);
      box-shadow: 13px 15px 0 var(--mint);
      overflow: hidden;
    }
    .chaos-board::before {
      content: "";
      position: absolute;
      inset: 0;
      opacity: .32;
      background-image: radial-gradient(var(--ink) .8px, transparent .8px);
      background-size: 22px 22px;
    }
    .chaos-label {
      position: absolute;
      top: 28px;
      left: 30px;
      padding: 8px 12px;
      border-radius: 999px;
      color: var(--ink-soft);
      background: var(--white);
      font-size: .72rem;
      font-weight: 800;
    }
    .chaos-card {
      position: absolute;
      padding: 16px 18px;
      border: 1.5px solid var(--ink);
      border-radius: 16px;
      background: var(--white);
      box-shadow: var(--shadow-sm);
    }
    .chaos-card i { width: 34px; height: 34px; margin-bottom: 9px; border-radius: 11px; display: grid; place-items: center; background: var(--mint-light); font-style: normal; }
    .chaos-card strong { display: block; font-size: .88rem; }
    .chaos-card small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: .69rem; line-height: 1.35; }
    .chaos-card.chat { width: 210px; top: 84px; left: 46px; transform: rotate(-5deg); }
    .chaos-card.sheet { width: 220px; top: 63px; right: 37px; transform: rotate(4deg); }
    .chaos-card.folder { width: 205px; bottom: 52px; left: 54px; transform: rotate(3deg); }
    .chaos-card.person { width: 225px; right: 43px; bottom: 61px; transform: rotate(-4deg); }
    .chaos-center {
      position: absolute;
      z-index: 2;
      top: 50%;
      left: 50%;
      width: 92px;
      height: 92px;
      border: 1.5px solid var(--ink);
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--white);
      background: var(--sage);
      box-shadow: 6px 7px 0 color-mix(in srgb, var(--sheltra-forest) 17%, transparent);
      transform: translate(-50%, -50%) rotate(-4deg);
      text-align: center;
      font-size: .72rem;
      font-weight: 800;
      line-height: 1.2;
    }

    .product-section { color: var(--white); background: var(--ink); }
    .product-section .section-kicker { color: var(--mint); }
    .product-section .section-lead { color: rgba(255,255,255,.68); }
    .product-intro { display: grid; grid-template-columns: 1fr .65fr; gap: 70px; align-items: end; }
    .product-tabs { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
    .product-tab {
      min-height: 43px;
      padding: 0 16px;
      border: 1px solid rgba(255,255,255,.24);
      border-radius: 999px;
      color: rgba(255,255,255,.68);
      background: transparent;
      font-size: .8rem;
      font-weight: 800;
      cursor: pointer;
      transition: all .18s ease;
    }
    .product-tab:hover,
    .product-tab.active { border-color: var(--mint); color: var(--ink); background: var(--mint); }
    .software-shell {
      margin-top: 52px;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: 28px;
      overflow: hidden;
      display: grid;
      grid-template-columns: 185px 1fr;
      background: var(--sheltra-warm-white);
      box-shadow: 0 40px 100px rgba(0,0,0,.28);
    }
    .software-side { padding: 17px 13px; color: var(--ink); background: var(--sheltra-sage); }
    .software-logo { padding: 7px 9px 18px; display: flex; align-items: center; gap: 8px; font-size: .83rem; font-weight: 900; }
    .software-logo i { width: 23px; height: 23px; border: 1px solid var(--ink); border-radius: 8px; display: grid; place-items: center; background: var(--mint); font-style: normal; font-size: .7rem; }
    .software-nav { display: grid; gap: 4px; }
    .software-nav span { min-height: 38px; padding: 0 10px; border-radius: 10px; display: flex; align-items: center; gap: 8px; color: var(--ink-soft); font-size: .7rem; font-weight: 700; }
    .software-nav span.active { color: var(--ink); background: var(--white); box-shadow: 0 5px 15px color-mix(in srgb, var(--sheltra-forest) 7%, transparent); }
    .software-main { min-height: 570px; color: var(--ink); background: var(--paper); }
    .software-toolbar { min-height: 58px; padding: 0 24px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; background: var(--white); }
    .breadcrumbs { color: var(--ink-soft); font-size: .68rem; }
    .software-actions { display: flex; gap: 7px; }
    .software-actions span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; font-size: .64rem; font-weight: 800; }
    .software-actions span:last-child { color: var(--white); background: var(--sage); }
    .product-panel { display: none; padding: 25px; }
    .product-panel.active { display: block; animation: panelIn .32s ease both; }
    @keyframes panelIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
    .panel-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
    .panel-title h3 { margin: 0; font-size: 1.35rem; letter-spacing: -.035em; }
    .panel-title p { margin: 4px 0 0; color: var(--ink-soft); font-size: .72rem; }
    .panel-badge { padding: 7px 10px; border-radius: 999px; color: var(--sage-dark); background: var(--mint); font-size: .64rem; font-weight: 800; }
    .record-head {
      margin-top: 19px;
      padding: 15px;
      border: 1px solid var(--line);
      border-radius: 16px;
      display: grid;
      grid-template-columns: 58px 1fr repeat(3, auto);
      gap: 15px;
      align-items: center;
      background: var(--white);
    }
    .record-avatar { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; background: var(--cream); font-size: 1.8rem; }
    .record-head strong { display: block; font-size: .9rem; }
    .record-head small { display: block; color: var(--ink-soft); font-size: .64rem; }
    .record-meta { padding-left: 16px; border-left: 1px solid var(--line); }
    .record-meta span { display: block; color: var(--ink-soft); font-size: .56rem; }
    .record-meta b { display: block; font-size: .68rem; }
    .panel-grid { margin-top: 14px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; }
    .ui-card { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--white); }
    .ui-card h4 { margin: 0 0 12px; font-size: .78rem; }
    .health-row,
    .inquiry-row,
    .transport-row,
    .team-row { min-height: 54px; padding: 9px 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 30px 1fr auto; gap: 9px; align-items: center; }
    .health-row:first-of-type,
    .inquiry-row:first-of-type,
    .transport-row:first-of-type,
    .team-row:first-of-type { border-top: 0; }
    .row-icon { width: 29px; height: 29px; border-radius: 9px; display: grid; place-items: center; background: var(--mint-light); font-size: .72rem; font-style: normal; }
    .ui-card strong { display: block; font-size: .68rem; }
    .ui-card small { display: block; color: var(--ink-soft); font-size: .57rem; }
    .row-state { padding: 4px 7px; border-radius: 999px; color: var(--sage-dark); background: var(--mint-light); font-size: .55rem; font-weight: 800; }
    .task-list { display: grid; gap: 8px; }
    .task { padding: 10px; border: 1px solid var(--line); border-radius: 11px; display: grid; grid-template-columns: 18px 1fr; gap: 8px; }
    .task i { width: 16px; height: 16px; border: 1px solid var(--sage); border-radius: 5px; display: grid; place-items: center; color: var(--sage); font-size: .5rem; font-style: normal; }
    .task b { display: block; font-size: .63rem; }
    .task span { color: var(--ink-soft); font-size: .55rem; }
    .pipeline { margin-top: 16px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
    .pipe-col { padding: 10px; border-radius: 12px; background: var(--sheltra-sage); }
    .pipe-col > strong { display: block; margin-bottom: 8px; font-size: .63rem; }
    .lead-card { margin-top: 7px; padding: 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
    .lead-card b { display: block; font-size: .58rem; }
    .lead-card span { color: var(--ink-soft); font-size: .51rem; }
    .route-line { position: relative; height: 115px; margin: 20px 10px 0; }
    .route-line::before { content: ""; position: absolute; top: 49px; left: 7%; right: 7%; height: 3px; border-radius: 3px; background: var(--mint); }
    .route-stop { position: absolute; top: 29px; transform: translateX(-50%); text-align: center; }
    .route-stop:nth-child(1) { left: 8%; }
    .route-stop:nth-child(2) { left: 39%; }
    .route-stop:nth-child(3) { left: 69%; }
    .route-stop:nth-child(4) { left: 93%; }
    .route-stop i { width: 41px; height: 41px; margin: 0 auto 7px; border: 2px solid var(--white); border-radius: 50%; display: grid; place-items: center; background: var(--sage); box-shadow: 0 0 0 1px var(--sage); font-style: normal; font-size: .8rem; }
    .route-stop b { display: block; font-size: .57rem; }
    .route-stop span { display: block; color: var(--ink-soft); font-size: .49rem; white-space: nowrap; }
    .product-caption { margin: 24px auto 0; max-width: 760px; color: rgba(255,255,255,.58); font-size: .77rem; text-align: center; }

    .journey { background: var(--cream-light); }
    .journey-flow { position: relative; margin-top: 62px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
    .journey-flow::before { content: ""; position: absolute; top: 32px; left: 9%; right: 9%; height: 2px; background: var(--ink); opacity: .16; }
    .journey-step { position: relative; z-index: 1; text-align: center; }
    .journey-icon { width: 65px; height: 65px; margin: 0 auto 19px; border: 1.5px solid var(--ink); border-radius: 21px; display: grid; place-items: center; background: var(--white); box-shadow: 5px 6px 0 var(--mint); font-size: 1.25rem; transform: rotate(-2deg); }
    .journey-step:nth-child(even) .journey-icon { background: var(--mint-light); transform: rotate(2deg); }
    .journey-step h3 { margin: 0 0 7px; font-size: 1rem; letter-spacing: -.025em; }
    .journey-step p { margin: 0; color: var(--ink-soft); font-size: .78rem; line-height: 1.55; }

    .outcomes { background: var(--white); }
    .outcomes-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(50px, 8vw, 110px); align-items: start; }
    .outcome-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .outcome-list > span { min-height: 145px; padding: 23px; border: 1px solid var(--line); border-radius: 22px; display: grid; grid-template-columns: 28px 1fr; column-gap: 11px; align-content: start; background: var(--paper); }
    .outcome-list i { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; color: var(--white); background: var(--sage); font-size: .7rem; font-style: normal; font-weight: 900; }
    .outcome-list b { align-self: center; font-size: .92rem; }
    .outcome-list small { grid-column: 2; margin-top: 8px; color: var(--ink-soft); font-size: .76rem; line-height: 1.5; }

    .features { background: var(--paper); }
    .bento {
      margin-top: 54px;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-rows: minmax(230px, auto);
      gap: 18px;
    }
    .feature-card {
      position: relative;
      padding: 28px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      overflow: hidden;
      background: var(--white);
      transition: transform .22s ease, box-shadow .22s ease;
    }
    .feature-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); }
    .feature-card.large { grid-column: span 7; }
    .feature-card.medium { grid-column: span 5; }
    .feature-card.third { grid-column: span 4; }
    .feature-card.mint { background: var(--mint-light); }
    .feature-card.cream { background: var(--cream); }
    .feature-card.dark { color: var(--white); background: var(--ink); }
    .feature-icon { width: 49px; height: 49px; border: 1.5px solid currentColor; border-radius: 15px; display: grid; place-items: center; font-size: 1.1rem; }
    .feature-card h3 { max-width: 380px; margin: 21px 0 10px; font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.12; letter-spacing: -.04em; }
    .feature-card p { max-width: 480px; margin: 0 0 20px; color: var(--ink-soft); font-size: .88rem; }
    .feature-card.dark p { color: rgba(255,255,255,.68); }
    .feature-card.dark .text-link { color: var(--mint); }
    .mini-stack { position: absolute; right: 24px; bottom: 23px; width: 42%; display: grid; gap: 7px; }
    .mini-stack span { padding: 9px 12px; border: 1px solid var(--line); border-radius: 11px; display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.82); font-size: .61rem; font-weight: 800; }
    .mini-stack i { color: var(--sage-dark); font-style: normal; }
    .channel-dots { position: absolute; right: 22px; bottom: 23px; display: flex; gap: 7px; }
    .channel-dots i { width: 35px; height: 35px; border: 1px solid rgba(255,255,255,.28); border-radius: 11px; display: grid; place-items: center; font-style: normal; font-size: .73rem; }

    .solutions { background: var(--mint-light); }
    .solution-grid { margin-top: 50px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .solution-card {
      min-height: 455px;
      padding: 28px;
      border: 1.5px solid var(--ink);
      border-radius: 30px;
      display: flex;
      flex-direction: column;
      background: var(--white);
      box-shadow: 8px 9px 0 color-mix(in srgb, var(--sheltra-forest) 8%, transparent);
      transition: transform .22s ease, box-shadow .22s ease;
    }
    .solution-card:hover { transform: translateY(-5px) rotate(-.4deg); box-shadow: 12px 14px 0 color-mix(in srgb, var(--sheltra-forest) 10%, transparent); }
    .solution-card:nth-child(2) { background: var(--cream-light); }
    .solution-card:nth-child(3) { color: var(--white); background: var(--ink); }
    .solution-card:nth-child(3) p { color: rgba(255,255,255,.68); }
    .solution-card:nth-child(3) .solution-list span { border-color: rgba(255,255,255,.16); }
    .solution-card:nth-child(3) .text-link { color: var(--mint); }
    .solution-visual { height: 145px; margin-bottom: 25px; border-radius: 20px; display: grid; place-items: center; background: var(--mint-light); font-size: 3.3rem; }
    .solution-card:nth-child(2) .solution-visual { background: var(--cream); }
    .solution-card:nth-child(3) .solution-visual { background: rgba(255,255,255,.09); }
    .solution-card h3 { margin: 0 0 10px; font-size: 1.55rem; letter-spacing: -.045em; }
    .solution-card p { margin: 0 0 17px; color: var(--ink-soft); font-size: .86rem; }
    .solution-list { margin-bottom: 22px; display: grid; }
    .solution-list span { padding: 8px 0; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 7px; font-size: .76rem; font-weight: 700; }
    .solution-list i { color: var(--sage); font-style: normal; }
    .solution-card .text-link { margin-top: auto; }

    .automation { background: var(--paper); }
    .auto-box {
      padding: clamp(35px, 5vw, 68px);
      border: 1.5px solid var(--ink);
      border-radius: var(--radius-xl);
      display: grid;
      grid-template-columns: .88fr 1.12fr;
      gap: clamp(48px, 8vw, 110px);
      align-items: center;
      background: var(--cream);
      box-shadow: 14px 16px 0 var(--mint);
    }
    .auto-copy .section-title { font-size: clamp(2.5rem, 4vw, 4rem); }
    .checks { margin-top: 25px; display: grid; gap: 11px; }
    .checks span { display: flex; align-items: flex-start; gap: 10px; color: var(--ink-soft); font-size: .88rem; }
    .checks i { flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: var(--white); background: var(--sage); font-size: .65rem; font-style: normal; font-weight: 900; }
    .workflow-window { border: 1.5px solid var(--ink); border-radius: 24px; overflow: hidden; background: var(--white); box-shadow: var(--shadow-md); transform: rotate(1deg); }
    .workflow-body { padding: 20px; }
    .workflow-row { min-height: 69px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: 39px 1fr auto; gap: 11px; align-items: center; background: var(--paper); }
    .workflow-row + .workflow-row { margin-top: 10px; }
    .workflow-row > i { width: 39px; height: 39px; border-radius: 12px; display: grid; place-items: center; background: var(--mint); font-style: normal; }
    .workflow-row strong { display: block; font-size: .76rem; }
    .workflow-row small { display: block; color: var(--ink-soft); font-size: .61rem; }
    .workflow-row em { padding: 5px 8px; border-radius: 999px; color: var(--sage-dark); background: var(--mint-light); font-size: .55rem; font-style: normal; font-weight: 800; }
    .workflow-human { padding: 12px 15px; border: 1.5px dashed var(--sage); border-radius: 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }
    .workflow-human strong { font-size: .71rem; }
    .workflow-human span { color: var(--ink-soft); font-size: .59rem; }
    .workflow-human b { padding: 7px 10px; border-radius: 9px; color: var(--white); background: var(--sage); font-size: .57rem; }

    .why { color: var(--white); background: var(--ink); }
    .why-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(50px, 8vw, 120px); align-items: start; }
    .why .section-kicker { color: var(--mint); }
    .why .section-lead { color: rgba(255,255,255,.7); }
    .why-statement { margin-top: 31px; padding: 24px 25px; border-left: 3px solid var(--mint); border-radius: 0 18px 18px 0; background: rgba(255,255,255,.06); }
    .why-statement strong { display: block; font-family: var(--serif); font-size: 1.42rem; font-style: italic; font-weight: 500; line-height: 1.45; }
    .why-statement span { display: block; margin-top: 10px; color: var(--mint); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
    .people-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
    .people-card { min-height: 210px; padding: 24px; border: 1px solid rgba(255,255,255,.17); border-radius: 22px; background: rgba(255,255,255,.06); }
    .people-card:first-child { background: var(--sage); }
    .people-card:last-child { grid-column: span 2; min-height: 170px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: center; }
    .people-icon { width: 51px; height: 51px; border: 1px solid rgba(255,255,255,.35); border-radius: 16px; display: grid; place-items: center; background: rgba(255,255,255,.08); font-size: 1.15rem; }
    .people-card h3 { margin: 20px 0 8px; font-size: 1.15rem; letter-spacing: -.03em; }
    .people-card:last-child h3 { margin-top: 0; }
    .people-card p { margin: 0; color: rgba(255,255,255,.68); font-size: .8rem; }
    .people-card:first-child p { color: rgba(255,255,255,.82); }

    .security { background: var(--cream-light); }
    .security-grid { margin-top: 49px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
    .security-card { padding: 25px; border: 1px solid var(--line); border-radius: 22px; background: var(--white); }
    .security-card i { width: 45px; height: 45px; border-radius: 14px; display: grid; place-items: center; background: var(--mint-light); font-style: normal; }
    .security-card h3 { margin: 17px 0 7px; font-size: 1rem; letter-spacing: -.025em; }
    .security-card p { margin: 0; color: var(--ink-soft); font-size: .76rem; }

    .testphase { background: var(--paper); }
    .test-grid { margin-top: 50px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; counter-reset: teststep; }
    .test-step { position: relative; padding: 30px; border: 1.5px solid var(--ink); border-radius: 26px; background: var(--white); counter-increment: teststep; }
    .test-step::before { content: "0" counter(teststep); position: absolute; top: 24px; right: 25px; color: var(--mint); font-family: var(--serif); font-size: 2.25rem; font-style: italic; }
    .test-step i { width: 48px; height: 48px; border-radius: 15px; display: grid; place-items: center; background: var(--cream); font-style: normal; }
    .test-step h3 { margin: 20px 0 9px; font-size: 1.22rem; letter-spacing: -.035em; }
    .test-step p { margin: 0; color: var(--ink-soft); font-size: .82rem; }
    .test-actions { margin-top: 35px; display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; }

    .faq { background: var(--mint-light); }
    .faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(48px, 8vw, 110px); align-items: start; }
    .faq-intro { position: sticky; top: 145px; }
    .faq-intro .section-title { font-size: clamp(2.45rem, 4vw, 4rem); }
    .faq-intro p { color: var(--ink-soft); }
    .faq-list { border-top: 1.5px solid var(--ink); }
    .faq-list details { border-bottom: 1px solid var(--line-strong); }
    .faq-list summary {
      min-height: 76px;
      padding: 16px 48px 16px 0;
      position: relative;
      display: flex;
      align-items: center;
      font-weight: 800;
      list-style: none;
      cursor: pointer;
    }
    .faq-list summary::-webkit-details-marker { display: none; }
    .faq-list summary::after { content: "+"; position: absolute; right: 4px; width: 31px; height: 31px; border: 1px solid var(--ink); border-radius: 50%; display: grid; place-items: center; font-size: 1.15rem; font-weight: 500; transition: transform .2s ease, background .2s ease; }
    .faq-list details[open] summary::after { color: var(--white); background: var(--ink); transform: rotate(45deg); }
    .faq-list p { max-width: 720px; margin: -4px 50px 23px 0; color: var(--ink-soft); font-size: .89rem; }

    .final-cta { padding: 72px 0; background: var(--paper); }
    .cta-box {
      position: relative;
      width: var(--container);
      min-height: 380px;
      margin: 0 auto;
      padding: clamp(40px, 6vw, 76px);
      border: 1.5px solid var(--ink);
      border-radius: var(--radius-xl);
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 60px;
      align-items: center;
      overflow: hidden;
      background: var(--cream);
      box-shadow: 13px 15px 0 var(--mint);
    }
    .cta-box::before { content: "♥"; position: absolute; right: 70px; top: -96px; color: var(--mint); font-family: var(--serif); font-size: 15rem; opacity: .7; transform: rotate(12deg); }
    .cta-copy { position: relative; z-index: 1; max-width: 740px; }
    .cta-copy h2 { margin: 14px 0 15px; font-size: clamp(2.55rem, 4.5vw, 4.6rem); line-height: 1.02; letter-spacing: -.06em; }
    .cta-copy p { max-width: 620px; margin: 0; color: var(--ink-soft); font-size: 1.02rem; }
    .cta-actions { position: relative; z-index: 1; display: grid; gap: 13px; min-width: 230px; }
    .cta-actions small { color: var(--ink-soft); font-size: .68rem; text-align: center; }

    footer { padding: 78px 0 27px; color: var(--white); background: var(--ink); }
    .footer-inner { width: var(--container); margin: 0 auto; }
    .footer-top { padding-bottom: 54px; display: grid; grid-template-columns: .82fr 1.18fr; gap: 80px; }
    .footer-brand p { max-width: 340px; margin: 20px 0; color: rgba(255,255,255,.62); font-size: .87rem; }
    .footer-brand-widgets {
      max-width: 360px;
      margin-top: 20px;
      display: grid;
      gap: 14px;
      color: rgba(255,255,255,.68);
      font-size: .87rem;
    }
    .footer-brand-widgets .footer-widget {
      display: grid;
      gap: 10px;
    }
    .footer-brand-widgets .footer-widget-title {
      margin: 0;
      color: var(--mint);
      font-size: .77rem;
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    .footer-brand-widgets p {
      max-width: none;
      margin: 0;
      color: rgba(255,255,255,.68);
    }
    .footer-brand-widgets a {
      color: var(--mint);
      font-weight: 800;
    }
    .footer-brand-widgets ul {
      margin: 0;
      padding-left: 18px;
    }
    .footer-badge { display: inline-flex; align-items: center; gap: 8px; color: var(--mint); font-size: .74rem; font-weight: 800; }
    .footer-badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 4px color-mix(in srgb, var(--sheltra-sage) 12%, transparent); }
    .footer-links { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
    .footer-col h4 { margin: 0 0 17px; color: var(--mint); font-size: .77rem; text-transform: uppercase; letter-spacing: .08em; }
    .footer-col a { margin: 9px 0; display: block; color: rgba(255,255,255,.65); font-size: .78rem; transition: color .18s ease; }
    .footer-col a:hover { color: var(--white); }
    .footer-bottom { padding-top: 24px; border-top: 1px solid rgba(255,255,255,.13); display: flex; align-items: center; justify-content: space-between; gap: 25px; color: rgba(255,255,255,.45); font-size: .69rem; }
    .footer-legal { display: flex; flex-wrap: wrap; gap: 18px; }

    .reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }
    .reveal.visible { opacity: 1; transform: translateY(0); }
    .reveal.delay-1 { transition-delay: .08s; }
    .reveal.delay-2 { transition-delay: .16s; }

    @media (max-width: 1080px) {
      .desktop-nav { display: none; }
      .nav { grid-template-columns: auto 1fr auto; }
      .nav-actions .login-link { display: none; }
      .mobile-toggle { display: grid; }
      .hero-inner { grid-template-columns: 1fr 470px; gap: 42px; }
      .hero-visual { min-height: 540px; }
      .photo-frame { height: 465px; }
      .product-float { width: 76%; }
      .software-shell { grid-template-columns: 150px 1fr; }
      .solution-grid { gap: 14px; }
      .solution-card { padding: 23px; }
      .security-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 860px) {
      :root { --container: min(100% - 32px, 720px); }
      .announcement { padding-inline: 18px; }
      .nav { height: 70px; gap: 14px; }
      .mobile-menu { padding-top: calc(var(--mobile-menu-content-top, 70px) + 22px); }
      .nav-actions > .button { display: none; }
      .hero-inner { min-height: auto; padding-top: 60px; grid-template-columns: 1fr; }
      .hero { min-height: auto; }
      h1 { max-width: 720px; }
      .hero-copy { max-width: 650px; }
      .hero-visual { width: min(650px, 100%); min-height: 580px; margin: 5px auto 0; }
      .photo-frame { width: 62%; height: 510px; }
      .product-float { width: 68%; }
      .trust-inner { min-height: auto; padding: 22px 0; grid-template-columns: repeat(2, 1fr); gap: 14px; }
      .trust-inner span:last-child { grid-column: span 2; }
      .reality-grid,
      .product-intro,
      .auto-box,
      .why-grid,
      .faq-layout,
      .outcomes-grid { grid-template-columns: 1fr; }
      .product-tabs { justify-content: flex-start; margin-top: 10px; }
      .software-shell { grid-template-columns: 1fr; }
      .software-side { display: none; }
      .journey-flow { grid-template-columns: repeat(2, 1fr); }
      .journey-flow::before { display: none; }
      .journey-step:last-child { grid-column: span 2; width: 50%; margin: 0 auto; }
      .feature-card.large,
      .feature-card.medium { grid-column: span 12; }
      .feature-card.third { grid-column: span 6; }
      .solution-grid { grid-template-columns: 1fr; }
      .solution-card { min-height: 400px; }
      .solution-visual { height: 120px; }
      .faq-intro { position: static; }
      .test-grid { grid-template-columns: 1fr; }
      .cta-box { grid-template-columns: 1fr; gap: 34px; }
      .cta-actions { width: min(100%, 330px); }
      .footer-top { grid-template-columns: 1fr; gap: 50px; }
    }

    @media (max-width: 620px) {
      :root { --container: calc(100vw - 28px); }
      .announcement { font-size: .74rem; }
      .brand { font-size: 1.18rem; }
      .brand-mark { width: 36px; height: 42px; }
      .brand-mark--lockup { width: 42px; height: 49px; }
      .brand-wordmark .brand-name { font-size: 1.3rem; }
      .brand-tagline { font-size: .44rem; }
      .brand-byline { font-size: .33rem; }
      .section { padding: 76px 0; }
      h1 { font-size: clamp(3.05rem, 14.5vw, 4.25rem); }
      .hero-actions { display: grid; }
      .hero-actions .button { width: 100%; }
      .proof-list { display: grid; }
      .hero-visual { min-height: 525px; }
      .hero-blob { inset: 26px 4px 26px 28px; }
      .photo-frame { top: 29px; right: 2px; width: 72%; height: 440px; border-radius: 27px 55px 28px 52px; }
      .product-float { left: 0; bottom: 15px; width: 84%; }
      .hero-note { top: 8px; left: 4px; }
      .float-card:nth-child(3), .float-card:nth-child(4) { display: none; }
      .trust-inner { grid-template-columns: 1fr; }
      .trust-inner span:last-child { grid-column: auto; }
      .section-title { font-size: clamp(2.45rem, 12vw, 3.55rem); }
      .chaos-board { min-height: 550px; }
      .chaos-card.chat { left: 19px; }
      .chaos-card.sheet { right: 19px; top: 181px; }
      .chaos-card.folder { left: 19px; bottom: 139px; }
      .chaos-card.person { right: 19px; bottom: 22px; }
      .chaos-center { width: 78px; height: 78px; }
      .software-main { min-height: 620px; }
      .software-toolbar { padding-inline: 14px; }
      .product-panel { padding: 15px; }
      .record-head { grid-template-columns: 48px 1fr auto; }
      .record-meta { display: none; }
      .panel-grid { grid-template-columns: 1fr; }
      .pipeline { grid-template-columns: repeat(2, 1fr); }
      .route-stop:nth-child(2) { left: 35%; }
      .route-stop:nth-child(3) { left: 65%; }
      .route-stop span { display: none; }
      .journey-flow { grid-template-columns: 1fr; gap: 35px; }
      .journey-step:last-child { grid-column: auto; width: auto; }
      .journey-step p { max-width: 320px; margin: 0 auto; }
      .outcome-list { grid-template-columns: 1fr; }
      .bento { grid-auto-rows: auto; }
      .feature-card.third { grid-column: span 12; }
      .feature-card { min-height: 260px; }
      .mini-stack { position: static; width: 100%; margin-top: 20px; }
      .channel-dots { position: static; margin-top: 22px; }
      .auto-box { padding: 29px 21px; border-radius: 32px; box-shadow: 8px 9px 0 var(--mint); }
      .workflow-row { grid-template-columns: 35px 1fr; }
      .workflow-row em { grid-column: 2; justify-self: start; }
      .workflow-human { align-items: flex-start; flex-direction: column; }
      .people-grid { grid-template-columns: 1fr; }
      .people-card:last-child { grid-column: auto; grid-template-columns: 1fr; }
      .security-grid { grid-template-columns: 1fr; }
      .faq-list summary { min-height: 70px; font-size: .91rem; }
      .cta-box { min-height: 0; padding: 42px 24px; border-radius: 34px; box-shadow: 8px 9px 0 var(--mint); }
      .cta-box::before { display: none; }
      .footer-links { grid-template-columns: repeat(2, 1fr); }
      .footer-bottom { align-items: flex-start; flex-direction: column; }
    }

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

    /* WordPress-wide Sheltra style bridge for existing Arkflow blocks. */
    .wp-site-blocks > * {
      margin-block-start: 0;
    }

    .language-current {
      min-width: 44px;
      height: 44px;
      border: 1px solid var(--line);
      background: rgba(255, 255, 255, .72);
    }

    .language-current:hover,
    .language-current:focus-visible,
    .language-switcher[open] .language-current {
      color: var(--ink);
      background: var(--white);
      box-shadow: 0 7px 0 color-mix(in srgb, var(--sheltra-forest) 9%, transparent);
    }

    .language-menu {
      border-color: var(--line);
      border-radius: 18px;
      background: rgba(255, 255, 255, .98);
      box-shadow: var(--shadow-sm);
    }

    .mobile-language {
      display: flex;
      justify-content: center;
      padding-bottom: 4px;
    }

    @media (max-width: 1080px) {
      .mobile-language {
        min-height: 54px;
        align-items: center;
        overflow: visible;
      }

      .mobile-language .language-switcher {
        position: relative;
        width: 50px;
        height: 50px;
        display: block;
        border-bottom: 0;
        transition: width .26s cubic-bezier(.22, 1, .36, 1);
      }

      .mobile-language .language-switcher[open] {
        width: 166px;
      }

      .mobile-language .language-current {
        position: absolute;
        z-index: 2;
        top: 0;
        left: 50%;
        width: 50px;
        min-width: 50px;
        height: 50px;
        min-height: 50px;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 14px;
        background: transparent;
        box-shadow: none;
        transform: translateX(-50%);
        transition:
          left .26s cubic-bezier(.22, 1, .36, 1),
          transform .26s cubic-bezier(.22, 1, .36, 1),
          background .18s ease;
      }

      .mobile-language .language-current:hover,
      .mobile-language .language-current:focus-visible {
        background: var(--mint);
        box-shadow: none;
      }

      .mobile-language .language-switcher[open] .language-current {
        left: 50%;
        background: var(--mint);
        box-shadow: none;
        transform: translateX(-50%);
      }

      .mobile-language .language-current-flag,
      .mobile-language .language-flag {
        font-size: 1.55rem;
        line-height: 1;
      }

      .mobile-language .language-menu {
        position: absolute;
        z-index: 1;
        top: 0;
        right: auto;
        left: 0;
        width: 166px;
        min-width: 0;
        height: 50px;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(3, 50px);
        align-items: center;
        gap: 8px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(-12px) scale(.96);
        transform-origin: center;
        transition:
          opacity .18s ease,
          visibility .18s ease,
          transform .26s cubic-bezier(.22, 1, .36, 1);
      }

      .mobile-language .language-switcher[open] .language-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
      }

      .mobile-language .language-option {
        width: 50px;
        height: 50px;
        padding: 0;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 14px;
        background: var(--white);
      }

      .mobile-language .language-option:first-child {
        grid-column: 1;
      }

      .mobile-language .language-option:nth-child(2) {
        grid-column: 3;
      }

      .mobile-language .language-option:hover,
      .mobile-language .language-option:focus-visible {
        background: var(--mint);
      }

      .mobile-language .language-name {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
        border: 0;
      }
    }

    .af-page-hero {
      min-height: 0;
      border-bottom: 1.5px solid var(--ink);
      background: var(--cream);
    }

    .af-page-hero::before {
      width: 620px;
      height: 620px;
      top: -335px;
      right: auto;
      left: -250px;
      border: 100px solid var(--mint);
      opacity: .7;
    }

    .af-page-hero::after {
      content: "";
      position: absolute;
      right: -120px;
      bottom: -210px;
      width: 410px;
      height: 410px;
      border: 58px solid color-mix(in srgb, var(--sheltra-terracotta) 62%, transparent);
      border-radius: 57% 43% 42% 58% / 46% 61% 39% 54%;
      transform: rotate(-14deg);
    }

    .af-page-hero-inner {
      width: var(--container);
      min-height: 620px;
      padding: 76px 0 72px;
      gap: clamp(42px, 7vw, 100px);
    }

    .af-pricing-hero-inner {
      width: var(--container);
      min-height: 390px;
      padding: 32px 0;
      gap: clamp(28px, 4vw, 54px);
    }

    .af-page-hero h1,
    .hero-copy h1 {
      max-width: 760px;
      font-size: clamp(3.2rem, 5.35vw, 5.7rem);
      line-height: .97;
      letter-spacing: -.067em;
    }

    .highlight,
    .af-serif {
      color: var(--sage);
      font-family: var(--serif);
      font-style: italic;
      font-weight: 500;
      letter-spacing: -.055em;
    }

    .af-page-hero p,
    .hero-copy p {
      max-width: 680px;
      color: var(--ink-soft);
      font-size: clamp(1.02rem, 1.45vw, 1.22rem);
      line-height: 1.65;
    }

    .af-solution-feature-strip {
      min-height: 82px;
      padding: 0 max(20px, calc((100vw - 1240px) / 2));
      border-bottom: 0;
      display: flex;
      justify-content: center;
      gap: clamp(22px, 4vw, 58px);
      color: var(--white);
      background: var(--ink);
      font-size: .82rem;
      font-weight: 800;
    }

    .af-solution-feature-strip span {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      white-space: nowrap;
    }

    .af-solution-feature-strip i {
      font-style: normal;
    }

    .af-solution-core-section,
    .af-modular-section,
    .af-form-section,
    .af-registration-section {
      background: var(--paper);
    }

    .af-solution-core-section:nth-of-type(even),
    .af-bento-section,
    .af-form-section {
      background: var(--mint-light);
    }

    .section-inner,
    .af-page-hero-inner,
    .af-pricing-hero-inner,
    .footer-inner {
      width: var(--container);
    }

    .bento-grid,
    .feature-grid,
    .af-card-grid,
    .af-solution-check-list {
      gap: 20px;
    }

    .bento-card,
    .af-card,
    .af-price-card,
    .af-plan-card,
    .af-solution-check-list li,
    .module-panel,
    .af-form-wrap,
    .af-demo-what-card {
      border: 1.5px solid var(--ink);
      border-radius: 30px;
      background: var(--white);
      box-shadow: 8px 9px 0 color-mix(in srgb, var(--sheltra-forest) 8%, transparent);
    }

    .bento-card:nth-child(2n),
    .af-card:nth-child(2n),
    .af-demo-what-card:nth-child(2n) {
      background: var(--cream-light);
    }

    .bento-card:hover,
    .af-card:hover,
    .af-price-card:hover {
      transform: translateY(-4px);
      box-shadow: 12px 14px 0 color-mix(in srgb, var(--sheltra-forest) 10%, transparent);
    }

    .card-icon,
    .af-card-icon,
    .feature-icon {
      border: 1.5px solid var(--ink);
      border-radius: 15px;
      background: var(--mint-light);
      box-shadow: 3px 4px 0 color-mix(in srgb, var(--sheltra-forest) 9%, transparent);
    }

    .module-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
    }

    .module-tab {
      min-height: 43px;
      padding: 0 16px;
      border: 1px solid color-mix(in srgb, var(--sheltra-forest) 18%, transparent);
      border-radius: 999px;
      color: var(--ink-soft);
      background: transparent;
      font-size: .8rem;
      font-weight: 800;
      cursor: pointer;
    }

    .module-tab:hover,
    .module-tab.active,
    .module-tab[aria-selected="true"] {
      border-color: var(--mint);
      color: var(--ink);
      background: var(--mint);
    }

    .af-card-link,
    .text-link {
      color: var(--sage-dark);
      font-weight: 800;
      text-decoration: none;
    }

    .af-form input,
    .af-form textarea,
    .af-form select,
    .af-form-wrap input,
    .af-form-wrap textarea,
    .af-form-wrap select {
      border: 1.5px solid var(--line);
      border-radius: 16px;
      background: var(--white);
    }

    .arkflow-consent {
      width: min(calc(100vw - 32px), 820px);
      grid-template-columns: minmax(0, 1fr) minmax(180px, 220px);
      gap: clamp(16px, 2.4vw, 28px);
      padding: clamp(16px, 2vw, 24px);
      border-radius: 20px;
      background: rgba(255, 255, 255, .98);
      box-shadow:
        0 0 0 100vmax color-mix(in srgb, var(--sheltra-forest) 36%, transparent),
        0 16px 44px color-mix(in srgb, var(--sheltra-forest) 18%, transparent),
        0 3px 0 color-mix(in srgb, var(--sheltra-forest) 12%, transparent);
    }

    .arkflow-consent h2 {
      font-size: clamp(1.35rem, 2.2vw, 1.8rem);
      letter-spacing: 0;
    }

    .arkflow-consent p {
      font-size: .88rem;
      line-height: 1.48;
    }

    .arkflow-consent .button,
    .arkflow-consent button {
      min-height: 44px;
      padding: 0 18px;
      font-size: .88rem;
    }

    .arkflow-consent-visual {
      min-height: 210px;
    }

    .arkflow-consent-visual img {
      width: min(100%, 230px);
    }

    @media (max-width: 1080px) {
      .nav-actions .language-switcher {
        display: inline-flex;
      }

      .af-page-hero-inner,
      .af-pricing-hero-inner {
        min-height: auto;
        grid-template-columns: 1fr;
      }

      .af-solution-feature-strip {
        flex-wrap: wrap;
        padding-block: 22px;
      }
    }

    @media (max-width: 620px) {
      .nav-actions .language-switcher,
      .nav-actions .nav-phone,
      .nav-actions .login-link {
        display: none;
      }

      .af-page-hero h1,
      .hero-copy h1 {
        font-size: clamp(3.05rem, 14.5vw, 4.25rem);
      }

      .af-solution-feature-strip {
        justify-content: flex-start;
        gap: 14px;
      }

      .arkflow-consent {
        grid-template-columns: 1fr;
      }

      .arkflow-consent-visual {
        display: none;
      }
    }

    .section.product-section.af-module-tabs-centered-tabs {
      background: var(--sheltra-warm-white);
      color: var(--ink);
    }

    .section.product-section.af-module-tabs-centered-tabs::after {
      right: -110px;
      top: 30px;
      width: 260px;
      height: 260px;
      border-width: 40px;
      opacity: .46;
      pointer-events: none;
    }

    .section.product-section.af-module-tabs-centered-tabs .section-inner {
      background: var(--sheltra-warm-white);
    }

    .section.product-section.af-module-tabs-centered-tabs .section-kicker {
      color: var(--sage);
    }

    .section.product-section.af-module-tabs-centered-tabs .section-title {
      color: var(--sheltra-forest);
    }

    .section.product-section.af-module-tabs-centered-tabs .section-lead {
      color: color-mix(in srgb, var(--sheltra-forest) 72%, transparent);
    }

    .section.product-section.af-module-tabs-centered-tabs .module-tabs {
      margin-top: clamp(34px, 4vw, 52px);
    }

    .section.product-section.af-module-tabs-centered-tabs .module-tab {
      color: color-mix(in srgb, var(--sheltra-forest) 58%, transparent);
    }

    .section.product-section.af-module-tabs-centered-tabs .module-tab.active {
      color: var(--sheltra-forest);
    }

    .section.af-card-section-home-v2-inline {
      background: var(--sheltra-warm-white);
      color: var(--ink);
    }

    .section.af-card-section-home-v2-inline .section-inner {
      width: min(1540px, calc(100vw - 56px));
      display: grid;
      grid-template-columns: minmax(0, 1.06fr) minmax(360px, .78fr);
      gap: 0 clamp(46px, 6vw, 96px);
      align-items: start;
    }

    .section.af-card-section-home-v2-inline .section-kicker {
      grid-column: 1 / -1;
      color: var(--sage);
    }

    .section.af-card-section-home-v2-inline .section-title {
      max-width: 900px;
      margin: 22px 0 0;
      color: var(--sheltra-forest);
      font-size: clamp(3.1rem, 5.2vw, 5.55rem);
      line-height: 1.03;
      letter-spacing: 0;
      font-weight: 600;
    }

    .section.af-card-section-home-v2-inline .section-lead {
      max-width: 690px;
      margin: 118px 0 0;
      color: color-mix(in srgb, var(--sheltra-forest) 72%, transparent);
      font-size: clamp(1.16rem, 1.45vw, 1.36rem);
      line-height: 1.58;
    }

    .section.af-card-section-home-v2-inline .bento-grid {
      grid-column: 1 / -1;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-template-rows: none;
      gap: clamp(18px, 2vw, 26px);
      margin-top: clamp(54px, 6vw, 82px);
    }

    .section.af-card-section-home-v2-inline .bento-card {
      min-height: clamp(320px, 28vw, 410px);
      display: flex;
      flex-direction: column;
      padding: clamp(30px, 3vw, 42px);
      border: 1.5px solid var(--ink);
      border-radius: 28px;
      background: var(--sheltra-sand);
      box-shadow: 8px 9px 0 color-mix(in srgb, var(--sheltra-forest) 8%, transparent);
      color: var(--sheltra-forest);
    }

    .section.af-card-section-home-v2-inline .bento-card::before {
      color: var(--sheltra-terracotta);
      font-size: 1.05rem;
      font-weight: 900;
      line-height: 1;
    }

    .section.af-card-section-home-v2-inline .bento-card:nth-child(1)::before { content: "01"; }
    .section.af-card-section-home-v2-inline .bento-card:nth-child(2)::before { content: "02"; }
    .section.af-card-section-home-v2-inline .bento-card:nth-child(3)::before { content: "03"; }

    .section.af-card-section-home-v2-inline .bento-card .card-icon {
      display: none;
    }

    .section.af-card-section-home-v2-inline .bento-card h3 {
      margin: auto 0 18px;
      font-size: clamp(1.65rem, 2.25vw, 2.28rem);
      line-height: 1.08;
      letter-spacing: 0;
    }

    .section.af-card-section-home-v2-inline .bento-card p {
      margin: 0;
      color: color-mix(in srgb, var(--sheltra-forest) 72%, transparent);
      font-size: clamp(1.02rem, 1.18vw, 1.14rem);
      line-height: 1.55;
    }

    .section.af-card-section-home-v2-inline .bento-card.dark {
      background: var(--ink);
      color: var(--paper);
    }

    .section.af-card-section-home-v2-inline .bento-card.dark h3,
    .section.af-card-section-home-v2-inline .bento-card.dark p {
      color: var(--paper);
    }

    .section.af-card-section-home-v2-inline .bento-card.dark p {
      opacity: .78;
    }

    .section.af-card-section-home-v2-inline .bento-card.cream {
      background: var(--sheltra-sand);
    }

    .section.af-card-section-home-v2-inline .bento-card.mint {
      background: var(--sheltra-sage);
    }

    @media (max-width: 1080px) {
      .section.af-card-section-home-v2-inline .section-inner {
        grid-template-columns: 1fr;
      }

      .section.af-card-section-home-v2-inline .section-lead {
        max-width: 820px;
        margin-top: 24px;
      }

      .section.af-card-section-home-v2-inline .bento-grid {
        grid-template-columns: 1fr;
      }

      .section.af-card-section-home-v2-inline .bento-card {
        min-height: 280px;
      }
    }

    @media (max-width: 620px) {
      .section.af-card-section-home-v2-inline {
        padding: 64px 0;
      }

      .section.af-card-section-home-v2-inline .section-inner {
        width: min(100% - 28px, 720px);
      }

      .section.af-card-section-home-v2-inline .section-title {
        font-size: clamp(2.45rem, 12vw, 3.55rem);
      }

      .section.af-card-section-home-v2-inline .bento-card {
        min-height: 250px;
        padding: 28px;
        border-radius: 24px;
      }
    }

    .section.af-flow-section-home-v2-flow {
      min-height: auto;
      display: grid;
      align-items: center;
      background:
        linear-gradient(180deg, color-mix(in srgb, var(--sheltra-sage) 32%, transparent), color-mix(in srgb, var(--sheltra-warm-white) 0%, transparent) 48%),
        linear-gradient(135deg, var(--sheltra-warm-white) 0%, var(--sheltra-sand) 100%);
      color: var(--sheltra-forest);
      padding: clamp(76px, 7vw, 112px) 0;
    }

    .section.af-flow-section-home-v2-flow::before {
      display: none;
    }

    .section.af-flow-section-home-v2-flow::after {
      display: none;
    }

    .section.af-flow-section-home-v2-flow .section-inner {
      width: min(1240px, calc(100vw - 56px));
      display: grid;
      justify-items: center;
    }

    .section.af-flow-section-home-v2-flow .section-kicker,
    .section.af-flow-section-home-v2-flow .section-title,
    .section.af-flow-section-home-v2-flow .section-lead {
      max-width: 780px;
      text-align: center;
    }

    .section.af-flow-section-home-v2-flow .section-kicker {
      color: var(--sheltra-muted);
    }

    .section.af-flow-section-home-v2-flow .section-title {
      margin: 12px auto 0;
      color: var(--sheltra-forest);
      font-size: clamp(2.85rem, 4.45vw, 4.9rem);
      line-height: 1.04;
      letter-spacing: 0;
    }

    .section.af-flow-section-home-v2-flow .section-lead {
      margin-top: 16px;
      color: var(--sheltra-muted);
      font-size: clamp(1.05rem, 1.25vw, 1.2rem);
    }

    .section.af-flow-section-home-v2-flow .workflow-rail {
      width: 100%;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 16px;
      margin-top: clamp(42px, 4.8vw, 62px);
    }

    .section.af-flow-section-home-v2-flow .workflow-rail::before {
      display: none;
    }

    .section.af-flow-section-home-v2-flow .workflow-step {
      min-height: 218px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 24px 20px 22px;
      border: 1.5px solid color-mix(in srgb, var(--sheltra-forest) 16%, transparent);
      border-radius: 24px;
      background: color-mix(in srgb, var(--sheltra-warm-white) 92%, transparent);
      color: var(--sheltra-forest);
      box-shadow: 8px 8px 0 color-mix(in srgb, var(--sheltra-forest) 12%, transparent);
      text-align: left;
    }

    .section.af-flow-section-home-v2-flow .workflow-step:nth-child(2n) {
      transform: none;
    }

    .section.af-flow-section-home-v2-flow .workflow-step:nth-child(2),
    .section.af-flow-section-home-v2-flow .workflow-step:nth-child(5) {
      background: var(--sheltra-sand);
    }

    .section.af-flow-section-home-v2-flow .workflow-step:nth-child(3),
    .section.af-flow-section-home-v2-flow .workflow-step:nth-child(6) {
      background: var(--sheltra-sage);
    }

    .section.af-flow-section-home-v2-flow .workflow-step i {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      margin-bottom: 38px;
      border: 1.5px solid var(--sheltra-forest);
      border-radius: 50%;
      background: var(--sheltra-sage);
      color: var(--sheltra-forest);
      box-shadow: 4px 4px 0 color-mix(in srgb, var(--sheltra-forest) 14%, transparent);
      font-size: .95rem;
      font-weight: 900;
    }

    .section.af-flow-section-home-v2-flow .workflow-step b {
      color: var(--sheltra-forest);
      font-size: 1.16rem;
      line-height: 1.12;
    }

    .section.af-flow-section-home-v2-flow .workflow-step span {
      max-width: none;
      margin-top: 12px;
      color: var(--sheltra-muted);
      font-size: .94rem;
      line-height: 1.45;
    }

    /* The implementation note is not part of the public product presentation. */
    .product-caption {
      display: none;
    }

    @media (max-width: 620px) {
      .nav-actions {
        min-width: 0;
        justify-content: flex-end;
        justify-self: stretch;
      }

      .mobile-toggle {
        width: 46px;
        height: 46px;
        border: 0;
        border-radius: 0;
        background: transparent;
      }

      .mobile-toggle span {
        width: 34px;
        height: 3px;
      }

      .mobile-toggle span::before,
      .mobile-toggle span::after {
        left: 3px;
        width: 28px;
        height: 3px;
      }

      .hero#top > .hero-inner > .hero-visual,
      .trust-strip {
        display: none;
      }

      .hero#top .hero-inner {
        padding-top: 30px;
        padding-bottom: 42px;
      }

      .hero#top .eyebrow {
        width: 100%;
        padding: 7px 10px;
        gap: 7px;
        font-size: .62rem;
        line-height: 1.3;
        letter-spacing: .08em;
      }

      .hero#top h1 {
        margin: 14px 0;
        font-size: clamp(2.65rem, 12vw, 3.1rem);
        line-height: .94;
        letter-spacing: -.055em;
      }

      .hero#top .hero-copy {
        font-size: .94rem;
        line-height: 1.45;
      }

      .hero#top .hero-actions {
        gap: 8px;
        margin-top: 18px;
      }

      .hero#top .hero-actions .button {
        min-height: 46px;
      }

      .hero#top .proof-list {
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 6px;
        margin-top: 12px;
      }

      .hero#top .proof-list span {
        min-width: 0;
        gap: 3px;
        font-size: clamp(.49rem, 2.1vw, .58rem);
        line-height: 1.15;
        white-space: nowrap;
      }

      .hero#top .proof-list i {
        width: 14px;
        height: 14px;
        flex: 0 0 14px;
        font-size: .48rem;
      }

      .chaos-board {
        min-height: 0;
        display: grid;
        gap: 12px;
        padding: 18px;
      }

      .chaos-label,
      .chaos-card,
      .chaos-card.chat,
      .chaos-card.sheet,
      .chaos-card.folder,
      .chaos-card.person,
      .chaos-center {
        position: relative;
        inset: auto;
        z-index: 1;
        width: 100%;
        transform: none;
      }

      .chaos-label {
        justify-self: start;
        width: auto;
      }

      .chaos-card {
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr);
        column-gap: 12px;
        align-items: start;
        padding: 15px 16px;
      }

      .chaos-card i {
        grid-row: 1 / 3;
        margin: 0;
      }

      .chaos-card strong,
      .chaos-card small {
        grid-column: 2;
      }

      .chaos-center {
        min-height: 46px;
        height: auto;
        border-radius: 999px;
      }

      .journey-step:not(:last-child)::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -35px;
        width: 2px;
        height: 35px;
        background: var(--ink);
        opacity: .16;
        transform: translateX(-50%);
      }

      body.af-registration-page .af-registration-grid {
        gap: 28px;
        padding-top: 18px;
        padding-bottom: 48px;
      }

      body.af-registration-page .af-registration-card {
        order: 1;
      }

      body.af-registration-page .af-registration-copy {
        order: 2;
      }

      body.af-registration-page .af-registration-card-head {
        padding-top: 20px;
      }

      body.af-registration-page .af-registration-card-head h2 {
        font-size: 1.95rem;
      }

      body.af-registration-page .af-registration-card-head p {
        margin-top: 10px;
        font-size: .9rem;
        line-height: 1.4;
      }

      body.af-registration-page .af-registration-card-body {
        padding-top: 18px;
      }
    }