/* P-148 (founder, 2026-11-06): the homepage's sample Workspace pass, on the existing Homepage V2 styles (no redesign).
   The quiet free-check link under the hero buttons, "Open the sample Workspace" under the tour, and the closing section
   ("See it before you buy") with the tour's Overview frame as a clickable preview (below the text on a phone). */

/* Under the hero buttons: a quiet text link, the hero's secondary text colour. */
.hero-free{display:inline-block;margin-top:16px;font-size:15px;font-weight:600;color:var(--d-text-2);text-decoration:none}
.hero-free:hover{color:#fff;text-decoration:underline}
.hero-free:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}

/* P-148 follow-up (founder, 2026-11-06): the hero's proof row and the closing offer line break between their parts, never inside one. */
.hero .proof > span{white-space:nowrap}
.fcx-note > span{white-space:nowrap}
/* On the narrowest phones the longest part ("Delivered within 5 business days of your intake ·") still fits on one line. */
@media (max-width:600px){.fcx-note{font-size:clamp(12.5px,4vw,15px)}}

/* The tour: its menu items are links now (same look as the buttons they replace). */
a.wsn{text-decoration:none}
.tour-sample{display:flex;width:max-content;margin:14px auto 0}

/* The closing section: text on the left, the preview on the right. */
.fcx .fcx-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:56px;align-items:center}
.fcx-t{display:flex;flex-direction:column;align-items:flex-start;gap:18px;text-align:left}
.fcx .h2{max-width:none}
.fcx-l{margin:0;max-width:560px;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.55;color:var(--d-text-2)}
.fcx .fc-ctas{justify-content:flex-start}
.fcx-free{font-size:15px;font-weight:700;color:#8fb3ff;text-decoration:none}
.fcx-free:hover{color:#fff;text-decoration:underline}
.fcx-free:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}

/* The preview: the tour's Overview frame, static, opening /sample. */
.fcx-prev{display:block;min-width:0;border-radius:24px;color:inherit;text-decoration:none;transition:transform .25s var(--slow)}
.fcx-prev:hover{transform:translateY(-4px)}
.fcx-prev:focus-visible{outline:3px solid var(--blue);outline-offset:6px}
.fcx-prev .ws{height:auto;min-height:0;pointer-events:none}
.fcx-prev .ws-body{min-height:0}
.fcx-prev .st{position:relative;inset:auto;opacity:1;transform:none;overflow:visible}
.fcx-prev .wsn{cursor:inherit}
/* The Overview headline, as the tour's .st h4 / .v2-hl h4 (it is text here, not a heading). */
.fcx-prev .fcx-h{margin:0;font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.1;font-weight:800;letter-spacing:-.025em;color:#fff}

@media (max-width:1100px){
  .fcx .fcx-in{grid-template-columns:minmax(0,1fr);gap:40px}
  .fcx-prev .ws-side{display:none}
  /* A preview, not the whole page: the top of the Overview, fading out. */
  .fcx-prev .ws-body{max-height:440px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent)}
}
@media (max-width:600px){
  .fcx-t{gap:16px}
  .fcx .fc-ctas{width:100%}
  .fcx .fc-ctas .btn{flex:1 1 100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.fcx-prev{transition:none}.fcx-prev:hover{transform:none}}

/* P-149 (decision 168): the header's primary button is Check Your Business; on a phone the links open from a menu button
   (the same structure: Product, How It Works, Pricing, Sample Workspace, Client Access, Check Your Business). */
.nav .wrap{position:relative}
.nav-menu-b{display:none}
.nav-menu[hidden]{display:none}
/* The links need about 885px; below 900px they open from the menu button (tablets included). */
@media (max-width:900px){
  .nav-links .hide-m{display:none}
  .nav-menu-b{display:inline-grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;border:1px solid rgba(238,243,249,.2);background:transparent;color:#fff;cursor:pointer}
  .nav-menu-b:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
  .nav-menu:not([hidden]){display:flex;flex-direction:column;gap:2px;position:absolute;left:12px;right:12px;top:calc(100% + 8px);padding:10px;border-radius:16px;background:#0B1C31;border:1px solid rgba(238,243,249,.14);box-shadow:0 24px 60px -20px rgba(0,0,0,.6);z-index:60}
  .nav-menu a{display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:10px;color:#E6EDF6;font-size:16px;font-weight:600;text-decoration:none}
  .nav-menu a:hover,.nav-menu a:focus-visible{background:rgba(238,243,249,.07)}
  .nav-menu .ic{width:18px;height:18px}
  .nav-menu .nav-menu-cta{margin-top:6px;justify-content:center;color:#fff}
}
@media (max-width:760px){.nav .nav-cta{padding:10px 14px;font-size:14.5px}}
