:root {
    --paper: #FFFFFF;
    --paper-2: #FFFFFF;
    --paper-soft: #F7F6F3;
    --ink: #2A2A2A;
    --ink-soft: #6E6C66;
    --line: rgba(42,42,42,0.15);
    --charcoal: #232323;
    --charcoal-2: #2B2B2B;
    --line-dark: rgba(244,242,237,0.16);
    --on-dark: #F4F2ED;
    --on-dark-soft: #B4B2AA;
    --pink: #E84274;
    --orange: #F59700;
    --coral: #EC625F;
    --violet: #6C5CFF;
    --acid: #FFE44D;
    --grad: linear-gradient(135deg, #FF9D00, #FF5C35, #F22F83);
    --maxw: 1180px;
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --paper: #FFFFFF; --paper-2: #FFFFFF; --ink: #17171B; --ink-soft: #5E5B62;
      --charcoal: #232323; --charcoal-2: #2B2B2B; --on-dark: #F4F2ED; --on-dark-soft: #B4B2AA;
    }
  }
  :root[data-theme="dark"] {
    --paper: #FFFFFF; --paper-2: #FFFFFF; --ink: #17171B; --ink-soft: #5E5B62;
    --charcoal: #232323; --charcoal-2: #2B2B2B; --on-dark: #F4F2ED; --on-dark-soft: #B4B2AA;
  }

  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }
  ::selection { background: rgba(232, 66, 116, 0.22); }
  :focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }
  img, svg { max-width: 100%; display: block; }
  a { color: inherit; }
  .wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 40px; }
  @media (max-width: 720px) { .wrap { padding: 0 22px; } }

  h1, h2, h3 {
    font-family: 'Outfit', sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0 0 18px;
    line-height: 1.1;
  }
  h1 { font-weight: 800; font-size: clamp(2.2rem, 4.4vw, 3.6rem); }
  h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); }
  h3 { font-size: 1.15rem; font-weight: 600; }
  p { color: var(--ink-soft); font-size: 1.04rem; max-width: 58ch; margin: 0 0 14px; }
  .editorial {
    font-family: 'Instrument Serif', serif;
    font-style: italic;
    font-weight: 400;
    color: var(--ink);
  }

  .btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
    flex: 0 0 auto;
    padding: 15px 28px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 0.96rem;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    transition: transform .2s ease, filter .2s ease;
    isolation: isolate; overflow: hidden; min-height: 52px;
  }
  .btn-primary { color: #fff; background: #17171B !important; box-shadow: none; }
  nav .btn-primary, .final-cta .btn-primary, footer .btn-primary { color: #17171B; background: #FFFFFF !important; }
  .btn-primary:hover { filter: brightness(1.06); transform: translateY(-2px); }
  .btn-ghost { color: #17171B; background: #FFE44D !important; }
  .btn-ghost-dark { color: #17171B; background: #FFFFFF !important; }
  .btn::after { content:""; display:inline-block; width:var(--icon-sm); height:var(--icon-sm); background:currentColor; -webkit-mask:var(--icon-arrow-up-right) center/contain no-repeat; mask:var(--icon-arrow-up-right) center/contain no-repeat; position: relative; z-index: 2; font-size: 1.05em; line-height: 1; transition: transform .25s ease; }
  .btn:hover::after { transform: translate(3px,-3px); }
  .liquid-label { position: relative; z-index: 2; pointer-events: none; }
  .liquid-carve-layer {
    position: absolute; z-index: 1; width: 58px; height: 58px; left: 0; top: 50%;
    border-radius: 50%; pointer-events: none; opacity: 0;
    background: linear-gradient(135deg, #FF9D00, #F22F83 62%, #6C5CFF);
    transform: translate(-50%, -50%) scale(.12);
    transition: opacity .18s ease, transform .28s cubic-bezier(.2,.8,.2,1);
  }
  .btn.is-liquid-active .liquid-carve-layer { opacity: .92; transform: translate(-50%, -50%) scale(1); }
  .btn-ghost .liquid-carve-layer { background: linear-gradient(135deg, #F22F83, #6C5CFF); }
  nav .btn-primary .liquid-carve-layer, .final-cta .btn-primary .liquid-carve-layer, footer .btn-primary .liquid-carve-layer { background: linear-gradient(135deg, #FF9D00, #F22F83); }
  @media (prefers-reduced-motion: reduce) { .liquid-carve-layer { display: none; } }
  .btn-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 34px; }
  .btn-row .btn { flex: 0 0 auto; }

  section { padding: 108px 0; position: relative; }
  @media (max-width: 720px) { section { padding: 68px 0; } }
  .rule-top { border-top: 0; }
  .home-skip { position:fixed; left:16px; top:12px; z-index:10000; padding:12px 20px; background:#fff; color:#17171b; transform:translateY(-180%); }
  .home-skip:focus { transform:none; }
  #main-content:focus { outline:none; }
  #how-we-work { scroll-margin-top:130px; }
  .rule-top-dark { border-top: 1px solid var(--line-dark); }

  .kicker {
    font-size: 0.98rem;
    font-weight: 600;
    color: var(--pink);
    margin: 0 0 20px;
  }
  .on-dark .kicker { color: var(--orange); }

  /* Homepage editorial introduction; visual layout lives in home-growth-visual.css. */
  .hero { padding:64px 0 60px; background:#fff; }
  .hero-canvas { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:56px; align-items:end; margin-bottom:44px; }
  .hero p.lede { font-size:1.08rem; line-height:1.65; margin:0; max-width:48ch; }
  .hero-support { padding-bottom:24px; }
  .hero-support .btn-row { align-items:flex-start; }
  .hero-context { display:grid; grid-template-columns:1fr 1fr; gap:64px; padding-top:36px; align-items:center; }
  .hero-research .label { font-size:.72rem; letter-spacing:.07em; color:var(--ink-soft); margin-bottom:12px; }
  .hero-research blockquote { margin:0 0 12px; font-size:1.55rem; line-height:1.25; max-width:34ch; }
  .hero-research .attribution { font-size:.78rem; margin:0; }
  .hero-decision-label { font-size:.7rem; letter-spacing:.1em; color:var(--ink-soft); }
  .hero-decision ol { list-style:none; padding:0; margin:14px 0; display:flex; gap:12px; flex-wrap:wrap; font-size:.88rem; }
  .hero-decision li:not(:last-child)::after { content:""; display:inline-block; width:var(--icon-sm); height:var(--icon-sm); background:currentColor; -webkit-mask:var(--icon-arrow-right) center/contain no-repeat; mask:var(--icon-arrow-right) center/contain no-repeat; margin-left:12px; color:var(--pink); }
  .hero-decision-note { font-size:.68rem; color:var(--ink-soft); }
  .hero-panel { background:var(--paper-soft); padding:32px; }
  .hero-panel .label { font-size:.82rem; font-weight:600; color:var(--ink-soft); margin-bottom:14px; }
  @media(max-width:1000px) {
    .hero-canvas { grid-template-columns:1fr; gap:12px; }
    .hero-support { padding:0; max-width:640px; }
    .hero-context { gap:36px; }
  }
  @media(max-width:720px) {
    .hero { padding:42px 0 44px; }
    .hero-canvas { margin-bottom:30px; }
    .hero-context { grid-template-columns:1fr; gap:28px; padding-top:28px; }
  }

  /* ---------- Client logo marquee ---------- */
  .roster { padding: 62px 0 68px; background: var(--paper-soft); overflow: hidden; }
  .roster-head {
    display: flex; align-items: end; justify-content: space-between; gap: 32px;
    margin-bottom: 28px;
  }
  .roster-head h2 { margin: 0; max-width: 16ch; font-size: clamp(2rem, 4vw, 4.35rem); }
  .roster-head p { max-width: 36ch; margin: 0 0 8px; }
  .client-marquee {
    position: relative; width: 100%; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  }
  .client-marquee-track {
    display: flex; width: max-content; animation: client-marquee 78s linear infinite;
    will-change: transform;
  }
  .client-marquee:hover .client-marquee-track,
  .client-marquee:focus-within .client-marquee-track { animation-play-state: paused; }
  .client-logo-group { display: flex; gap: 14px; padding-right: 14px; }
  .client-logo-card {
    width: 236px; height: 118px; flex: 0 0 auto;
    display: grid; place-items: center; padding: 17px 20px;
    border: 1px solid rgba(23,23,27,.12); border-radius: 24px;
    background: #fff; box-shadow: 0 10px 34px rgba(23,23,27,.045);
  }
  .client-logo-card img {
    display: block; width: 100%; height: 100%; object-fit: contain;
    filter: saturate(.94); transition: filter .25s ease, transform .25s ease;
  }
  .client-logo-card:hover img { filter: saturate(1.08); transform: scale(1.035); }
  @keyframes client-marquee { to { transform: translateX(-50%); } }
  @media (max-width: 780px) {
    .roster { padding: 48px 0 54px; }
    .roster-head { display: block; margin-bottom: 22px; }
    .roster-head p { margin-top: 12px; }
    .client-logo-card { width: 192px; height: 98px; border-radius: 20px; padding: 14px 16px; }
    .client-marquee-track { animation-duration: 64s; }
  }
  @media (prefers-reduced-motion: reduce) {
    .client-marquee { overflow-x: auto; mask-image: none; -webkit-mask-image: none; scrollbar-width: thin; }
    .client-marquee-track { animation: none; }
    .client-logo-group[aria-hidden="true"] { display: none; }
  }

  /* ---------- Interactive method explorer ---------- */
  .method-section { background: #fff; }
  .method-section .method-intro { max-width: 62ch; }
  .method-tabs {
    display: flex; justify-content: flex-start; gap: 12px; margin: 32px 0 36px;
  }
  .method-tab {
    appearance: none; border: 1px solid #17171B; border-radius: 12px; background: #fff;
    color: #17171B; padding: 15px 24px; font: inherit; font-weight: 650; cursor: pointer;
    transition: background .2s ease, color .2s ease, transform .2s ease;
  }
  .method-tab:hover { transform: translateY(-2px); }
  .method-tab[aria-selected="true"] { background: #17171B; color: #fff; }
  .method-explorer {
    display: grid; grid-template-columns: minmax(190px,.8fr) minmax(310px,1.12fr) minmax(260px,.92fr);
    gap: clamp(28px,4vw,72px); align-items: stretch;
  }
  .method-menu { border:0; }
  .method-option {
    width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px;
    padding: 24px 0; border: 0; background: transparent;
    color: var(--ink-soft); font: inherit; font-size: 1.06rem; font-weight: 700; text-align: left;
    cursor: pointer; transition: color .2s ease;
  }
  .method-option::after { content: "•"; opacity: 0; color: var(--pink); transition: opacity .2s ease; }
  .method-option:hover { color: #17171B; }
  .method-option[aria-selected="true"] { color: #17171B; }
  .method-option[aria-selected="true"]::after { opacity: 1; }
  .method-visual { position:relative; min-height:360px; background:var(--paper-soft); padding-bottom:42px; }
  .method-visual[hidden] { display:none; }
  .method-visual-image { display:block; width:100%; height:340px; object-fit:contain; }
  .method-visual-label { position:absolute; bottom:8px; left:12px; right:12px; margin:0; font-size:.75rem; line-height:1.4; }
  .method-explorer { min-height:390px; }
  .method-explorer.is-text-method { grid-template-columns:minmax(190px,.8fr) minmax(0,2.04fr); }
  .is-text-method .method-detail { max-width:620px; }
  .method-detail { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
  .method-step { margin-bottom: 16px; color: var(--pink); font-size: .78rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
  .method-detail h3 { margin: 0 0 18px; font-size: clamp(1.75rem,3vw,3rem); line-height: 1.02; }
  .method-detail p { margin: 0 0 26px; font-size: 1rem; }
  .method-detail-link { color: #17171B; font-weight: 750; text-decoration: none; }
  .method-detail-link:hover { color: var(--pink); }
  @media (max-width: 900px) {
    .method-tabs { justify-content: flex-start; overflow-x: auto; margin: 32px 0 38px; padding-bottom: 5px; }
    .method-tab { flex: 0 0 auto; }
    .method-explorer { grid-template-columns: 1fr 1.25fr; }
    .method-menu { grid-column: 1; }
    .method-visual { grid-column: 2; grid-row: 1 / span 2; min-height:360px; }
    .method-explorer.is-text-method { grid-template-columns:1fr 1.25fr; }
    .is-text-method .method-detail { grid-column:2; grid-row:1 / span 2; }
    .method-detail { grid-column: 1; }
  }
  @media (max-width: 680px) {
    .method-tabs { flex-wrap:wrap; gap:8px; margin-bottom:22px; overflow:visible; }
    .method-tab { padding:12px 14px; font-size:.9rem; }
    .method-explorer.is-text-method { grid-template-columns:1fr; }
    .is-text-method .method-detail { grid-column:1; grid-row:auto; }
    .method-explorer { grid-template-columns: 1fr; gap: 28px; align-content:start; }
    .method-menu, .method-visual, .method-detail { grid-column: 1; grid-row: auto; }
    .method-menu { display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px; }
    .method-option { flex: 0 0 auto; width: auto; border: 1px solid var(--line); border-radius: 999px; padding: 11px 16px; font-size: .9rem; }
    .method-option::after { display: none; }
    .method-option[aria-selected="true"] { border-color: var(--pink); color: var(--pink); }
    .method-visual { min-height:260px; }
    .method-visual-image { height:240px; }
    .method-detail { grid-row:2; }
    .method-visual { grid-row:3; }
  }

  /* Three distinct symptoms, not three long explanations. */
  .visibility-section { background:var(--paper-soft); padding:72px 0; }
  .gap-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:36px; }
  .gap-row { display:grid; align-content:start; gap:12px; }
  .gap-num { font-size:.82rem; color:var(--ink-soft); }
  .gap-row h3 { margin:0; font-size:1.25rem; }
  .gap-row p { margin:0; }
  @media(max-width:720px) {
    .visibility-section { padding:52px 0; }
    .gap-list { grid-template-columns:1fr; gap:26px; }
    .gap-row { grid-template-columns:26px 1fr; gap:6px 12px; }
    .gap-row p { grid-column:2; }
  }

  /* ---------- System (dark, connected band) ---------- */
  .system { position: relative; overflow: hidden; isolation: isolate; background: var(--charcoal); color: var(--on-dark); }
  .system > .wrap { position: relative; z-index: 1; }
  .system h2 { color: var(--on-dark); max-width: 20ch; }
  .system > .wrap > p { color: var(--on-dark-soft); max-width: 60ch; }
  .system-band { margin-top:48px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:38px 64px; }
  .system-fn { display:grid; align-content:start; gap:10px; transition:transform 180ms ease; }
  .system-fn .fn-tag { font-size:.78rem; letter-spacing:.06em; font-weight:600; color:var(--pink); }
  .system-fn .fn-name { font-size:1.35rem; font-weight:700; line-height:1.25; }
  .system-fn .fn-desc { color:var(--on-dark-soft); font-size:1rem; max-width:43ch; }
  .fn-name a, .grow-primary h3 a, .grow-secondary-item h3 a { text-decoration:none; }
  .fn-name a:is(:hover,:focus-visible) { color:var(--acid,#FFE44D); }
  .grow-primary h3 a:is(:hover,:focus-visible), .grow-secondary-item h3 a:is(:hover,:focus-visible) { color:var(--pink); }
  .system-fn:focus-within { transform:translateX(3px); }
  @media(hover:hover) and (pointer:fine) { .system-fn:hover { transform:translateX(3px); } }
  @media(max-width:680px) { .system-band { grid-template-columns:1fr; gap:30px; } }
  .system-cta { margin-top: 44px; }

  /* ---------- Restaurant insider ---------- */
  .restaurant-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
  }
  .restaurant-section { background: #fff; color: #17171B; }
  .restaurant-section h2 { color: #17171B; }
  .restaurant-section .kicker { color: var(--pink); }
  .restaurant-section p { color: var(--ink-soft); }
  @media (max-width: 900px) { .restaurant-inner { grid-template-columns: 1fr; gap: 40px; } }
  .scenario-list { display:grid; gap:24px; }
  .scenario-label { margin:0; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; }
  .scenario-line {
    display: block;
    max-width:38ch;
    font-weight: 500;
    font-size: 1.05rem;
  }

  /* ---------- Why one team ---------- */
  .team-section { background:var(--paper-soft); padding:72px 0; }
  .team-model { display:grid; grid-template-columns:1fr 1.25fr 1fr; align-items:start; gap:40px; margin-top:40px; }
  .team-context h3 { font-size:1.15rem; }
  .team-context p { font-size:.95rem; }
  .team-specialists { list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:1.05rem; }
  @media(max-width:720px) {
    .team-section { padding:52px 0; }
    .team-model { grid-template-columns:1fr; gap:24px; margin-top:28px; }
    .team-specialists { grid-template-columns:1fr 1fr; gap:10px 20px; }
  }

  /* ---------- Who we grow with ---------- */
  .grow-primary {
    padding: 40px;
    background: var(--charcoal);
    color: var(--on-dark);
    margin-top: 48px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 24px;
    align-items: center;
  }
  .industry-icon {
    width: 54px; height: 54px; display: grid; place-items: center; flex: 0 0 auto;
    color: var(--pink);
  }
  .industry-icon svg { width: 27px; height: 27px; fill: currentColor; stroke:none; }
  .grow-primary .industry-icon {
    width:60px; height:60px; color:var(--pink);
  }
  .grow-primary .industry-icon svg { width: 37px; height: 37px; }
  .grow-primary-action { justify-self: end; }
  @media (max-width: 780px) {
    .grow-primary { grid-template-columns: auto 1fr; }
    .grow-primary-action { grid-column: 1 / -1; justify-self: stretch; }
    .grow-primary-action .btn { width: 100%; }
  }
  .grow-primary h3 { color: var(--on-dark); font-size: 1.5rem; }
  .grow-primary p { color: var(--on-dark-soft); margin: 0; }
  .grow-secondary { margin-top:36px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
  .grow-secondary-item { display:grid; align-content:start; gap:12px; }
  .grow-secondary-item h3 { font-size:1.1rem; margin:0; }
  .grow-secondary-item p { font-size:1rem; margin:0; }
  @media(max-width:780px) {
    .grow-primary { padding:26px; }
    .grow-secondary { grid-template-columns:1fr; gap:28px; }
    .grow-secondary-item { grid-template-columns:40px 1fr; gap:6px 16px; }
    .grow-secondary-item .industry-icon { grid-row:1 / span 2; width:40px; height:40px; }
    .grow-secondary-item p { grid-column:2; }
  }

  /* ---------- Assessment banner ---------- */
  .assessment {
    background: #FFFFFF;
    border-top: 0;
  }
  .assessment .kicker { color: var(--pink); }
  .assessment .hero-panel { border:0; box-shadow:none; background:var(--paper-soft); }
  .assessment-inclusions { list-style:none; padding:0; margin:0; display:grid; gap:14px; font-size:1rem; }
  .assessment p, .assessment .assessment-foot { color: var(--ink-soft); }
  .assessment-inner {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr;
    gap: 48px;
    align-items: center;
  }
  @media (max-width: 900px) { .assessment-inner { grid-template-columns: 1fr; } }
  .assessment h2 { max-width: 18ch; }
  .assessment-foot { margin-top: 16px; font-size: 0.86rem; color: var(--ink-soft); }

  /* ---------- Final CTA ---------- */
  .final-cta {
    background: var(--charcoal);
    color: var(--on-dark);
    text-align: left;
    padding: 120px 0;
  }
  .final-cta-inner { max-width: 620px; }
  .final-cta h2 { color: var(--on-dark); }
  .final-cta p { color: var(--on-dark-soft); max-width: 50ch; }

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