html,body{margin:0}
  :root{
    color-scheme: light;
    /* Luis's pinned 60/30/10 system */
    --cloud:#f8fafd;      /* 60%: main bg, nav, footer */
    --ice:#eaf4ff;        /* 30%: hero/alternating sections, cards, panels */
    --ice-line:#d8e8fb;
    --cloud-line:#e5e9f1;
    --card:#ffffff;
    --navy:#14213d;       /* headings, body text, nav text: never pure black */
    --navy-mut:#56628a;
    --navy-faint:#5c6788;
    --brand-blue:#3578e5;
    --soft-violet:#7667e8;
    --violet-text:#5341b8; /* soft-violet is too light for small text; this is the text-safe shade */
    --gradient: linear-gradient(135deg, #3170d5, #6e60d8); /* 7% darker than the brand blue and violet so white text on it is at least 4.5 to 1 */
    --gradient-soft: linear-gradient(135deg, rgba(53,120,229,.12), rgba(118,103,232,.12));
    --on-gradient:#ffffff;
    /* semantic status (separate from the brand accent) */
    --danger:#e0394c;
    --warn:#d98f2b;
    --ok:#0c6b4e;
    --ok-bg: rgba(23,151,111,.1);
    /* shape */
    --radius-sm:8px;
    --radius:14px;
    --radius-lg:20px;
    --shadow-card: 0 1px 2px rgba(20,33,61,.04), 0 10px 26px -14px rgba(20,33,61,.16);
    --shadow-pop: 0 28px 64px -22px rgba(20,33,61,.28);
    --max: 1200px;
    --font-display:'Sora','Segoe UI',sans-serif;
    --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-mono:'JetBrains Mono','SF Mono',monospace;
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

  body{
    background: var(--cloud);
    color: var(--navy);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    margin:0;
    overflow-x: clip;
  }

  img{ max-width:100%; }
  [hidden]{ display:none !important; }
  a{ color: inherit; }
  :focus-visible{ outline: 2.5px solid var(--brand-blue); outline-offset: 3px; border-radius: 3px; }
  ::selection{ background: var(--soft-violet); color:#ffffff; }
  *{ scrollbar-color: #9eb8e6 var(--ice); scrollbar-width:thin; }

  h1,h2,h3,h4{ font-family: var(--font-display); font-weight:700; letter-spacing:-.01em; text-wrap: balance; margin:0; color: var(--navy); }
  p{ margin:0; }

  .wrap{ max-width: var(--max); margin-inline:auto; padding-inline: clamp(18px, 4.5vw, 44px); }
  .section{ padding-block: clamp(60px, 9vw, 112px); position:relative; background: var(--cloud); }
  .section--tint{ background: var(--ice); }

  .eyebrow-ban{ /* intentionally absent: the heading carries its own weight, per craft-floor */ }

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex; align-items:center; gap:.5em;
    font-family: var(--font-display); font-weight:600; font-size:.96rem;
    padding: .82em 1.35em; border-radius: var(--radius-sm);
    text-decoration:none; cursor:pointer; border: 1.5px solid transparent;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
  }
  .btn:hover{ transform: translateY(-1px); }
  .btn:active{ transform: translateY(0); }
  .btn-primary{ background: var(--gradient); color: var(--on-gradient); box-shadow: 0 10px 22px -10px rgba(53,120,229,.45); }
  .btn-primary:hover{ box-shadow: 0 14px 26px -10px rgba(118,103,232,.5); }
  .btn-ghost{ background: var(--card); color: var(--navy); border-color:#d7deea; }
  .btn-ghost:hover{ border-color: var(--brand-blue); color: #215bc7; }
  .btn svg{ width:16px; height:16px; flex:none; }

  .link{ font-family: var(--font-display); font-weight:600; font-size:.92rem; color: var(--navy-mut); text-decoration:none; display:inline-flex; align-items:center; gap:.4em; }
  .link:hover{ color: #215bc7; }

  /* ---------- badges / pills ---------- */
  .pill{ display:inline-flex; align-items:center; gap:.45em; font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.02em; padding:.38em .8em; border-radius:999px; }
  .pill-dot{ width:7px; height:7px; border-radius:50%; flex:none; }
  .pill--beta{ background: var(--gradient-soft); color: var(--violet-text); border:1px solid rgba(118,103,232,.28); }
  .pill--live{ background: var(--ok-bg); color: var(--ok); }
  .pill--live .pill-dot{ background: var(--ok); box-shadow:0 0 0 3px rgba(23,151,111,.16); }
  .pill--building{ background: rgba(217,143,43,.12); color: var(--warn); }
  .pill--building .pill-dot{ background: var(--warn); box-shadow:0 0 0 3px rgba(217,143,43,.16); }
  .pill--soon{ background:#eef1f6; color: var(--navy-faint); }

  /* ---------- icon ---------- */
  .ic{ width:22px; height:22px; flex:none; }
  .ic path, .ic circle, .ic line, .ic polyline, .ic rect{ fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .ic-chip{ width:44px; height:44px; border-radius:12px; background: var(--ice); display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
  .ic-chip .ic{ color: var(--brand-blue); }

  /* ---------- nav ---------- */
  .nav{
    position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
    background: rgba(248,250,253,.88); backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--cloud-line);
  }
  .nav .wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:12px; }
  .brand{ display:flex; align-items:center; text-decoration:none; }
  .brand img{ height:32px; width:auto; display:block; }
  .nav .brand{ flex:none; padding-block:2px; }
  .nav .brand img{ height:52.8px; }

  .navlinks{ display:flex; align-items:center; gap: clamp(16px,2.4vw,30px); }
  .navlinks a:not(.btn){ text-decoration:none; color: var(--navy-mut); font-size:.92rem; font-weight:500; }
  .navlinks a:not(.btn):hover{ color: var(--navy); }
  @media (max-width: 720px){
    .nav .wrap{ padding-block:9px; }
    .nav .brand img{ height:46.2px; }
    .navlinks > a:not(.btn-primary){ display:none; }
  }

  /* ---------- hero ---------- */
  .hero{ padding-block: clamp(56px,9vw,104px) clamp(64px,8vw,96px); position:relative; overflow:clip; background: var(--ice); }
  .hero::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:
      radial-gradient(640px 420px at 86% 4%, rgba(118,103,232,.14), transparent 60%),
      radial-gradient(520px 360px at 4% 100%, rgba(53,120,229,.08), transparent 65%);
  }
  .hero-grid{ position:relative; display:grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px,5vw,64px); align-items:center; }
  @media (max-width: 980px){ .hero-grid{ grid-template-columns:1fr; } }

  .hero h1{ font-size: clamp(2.1rem, 4.3vw, 3.4rem); line-height:1.07; }
  .hero h1 em{ font-style:normal; background: var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .hero .dek{ margin-top:18px; font-size:1.08rem; line-height:1.6; color: var(--navy-mut); max-width: 50ch; }
  .hero-cta{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:30px; }
  .hero-proof{ display:flex; gap: clamp(20px,3vw,34px); margin-top:36px; flex-wrap:wrap; }
  .hero-proof .stat{ display:flex; flex-direction:column; gap:2px; }
  .hero-proof .stat b{ font-family:var(--font-display); font-size:1.3rem; color: var(--navy); }
  .hero-proof .stat span{ font-size:.8rem; color: var(--navy-faint); }

  /* ---------- focused utility pages ---------- */
  .utility-shell{ min-height:100svh; display:grid; grid-template-rows:auto 1fr auto; background:var(--cloud); }
  .utility-main{ display:grid; place-items:center; padding:clamp(48px,9vw,108px) 18px; background:linear-gradient(145deg,var(--ice),var(--cloud) 62%); }
  .utility-card{ width:min(760px,100%); background:var(--card); border:1px solid var(--cloud-line); border-radius:var(--radius-lg); box-shadow:var(--shadow-pop); padding:clamp(28px,5vw,56px); }
  .utility-card h1{ font-size:clamp(2rem,5vw,3.4rem); line-height:1.06; max-width:14ch; }
  .utility-card .lede{ margin-top:18px; color:var(--navy-mut); font-size:1.05rem; max-width:62ch; }
  .utility-card h2{ margin-top:34px; font-size:1.18rem; }
  .utility-card p + p, .utility-card h2 + p{ margin-top:10px; }
  .utility-card ul{ margin:12px 0 0; padding-left:1.2rem; color:var(--navy-mut); }
  .utility-card li + li{ margin-top:8px; }
  .utility-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
  .utility-meta{ margin-top:28px; padding-top:20px; border-top:1px solid var(--cloud-line); color:var(--navy-faint); font-size:.86rem; }
  .utility-footer{ border-top:1px solid var(--cloud-line); padding:22px 0; color:var(--navy-faint); font-size:.82rem; }
  .utility-footer .wrap{ display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between; }
  .utility-footer nav{ display:flex; flex-wrap:wrap; gap:10px 16px; }
  .utility-footer a{ text-underline-offset:3px; }

  /* ---------- product panel (hero visual) ---------- */
  .panel{
    background: var(--card); border:1px solid var(--cloud-line);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-pop);
    overflow:hidden; position:relative;
  }
  .panel-chrome{ display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:1px solid var(--cloud-line); background: var(--cloud); }
  .panel-dot{ width:9px; height:9px; border-radius:50%; background:#d7deea; }
  .panel-url{ margin-left:10px; font-family:var(--font-mono); font-size:.75rem; color: var(--navy-faint); background: var(--ice); border-radius:6px; padding:3px 10px; display:inline-flex; align-items:center; gap:6px; }
  .panel-url img{ width:13px; height:13px; object-fit:contain; }
  .panel-body{ padding: clamp(16px,2.6vw,24px); display:flex; flex-direction:column; gap:16px; }

  .panel-top{ display:flex; gap:14px; flex-wrap:wrap; }
  .panel-card{ background: var(--ice); border:1px solid var(--ice-line); border-radius: var(--radius); padding:14px 16px; flex:1 1 150px; }
  .panel-card .lbl{ font-size:.75rem; color: var(--navy-mut); font-weight:600; letter-spacing:.02em; }
  .panel-card .big{ font-family:var(--font-display); font-size:1.5rem; color: var(--navy); margin-top:6px; display:flex; align-items:baseline; gap:6px; }
  .panel-card .big small{ font-family:var(--font-body); font-size:.76rem; color: var(--ok); font-weight:600; }

  .panel-queue{ background: var(--cloud); border:1px solid var(--cloud-line); border-radius: var(--radius); padding:6px; }
  .panel-queue .row{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; }
  .panel-queue .row + .row{ margin-top:2px; }
  .panel-queue .row:hover{ background: var(--ice); }
  .panel-queue .dot{ width:8px; height:8px; border-radius:50%; flex:none; }
  .panel-queue .dot--r{ background: var(--danger); box-shadow:0 0 0 3px rgba(224,57,76,.14); }
  .panel-queue .dot--a{ background: var(--warn); box-shadow:0 0 0 3px rgba(217,143,43,.14); }
  .panel-queue .dot--g{ background: var(--ok); box-shadow:0 0 0 3px rgba(23,151,111,.14); }
  .panel-queue .txt{ font-size:.84rem; color: var(--navy); flex:1; }
  .panel-queue .tag{ font-family:var(--font-mono); font-size:.75rem; color: var(--navy-faint); }

  .panel-flow{ display:flex; align-items:center; gap:10px; background: var(--ice); border:1px solid var(--ice-line); border-radius: var(--radius); padding:14px 16px; }
  .flow-node{ flex:1; min-width:0; }
  .flow-node .lbl{ font-size:.75rem; color: var(--navy-mut); font-weight:600; letter-spacing:.03em; text-transform:uppercase; }
  .flow-node .val{ font-size:.82rem; color: var(--navy); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .flow-line{ flex:none; width:34px; height:1.5px; background: var(--gradient); position:relative; }
  .flow-line::after{ content:""; position:absolute; right:-3px; top:50%; translate:0 -50%; width:6px; height:6px; border-radius:50%; background: var(--soft-violet); box-shadow:0 0 8px rgba(118,103,232,.6); }

  /* ---------- platform strip: a quiet proof band directly under the hero ---------- */
  .platform-bar{ border-top:1px solid var(--ice-line); border-bottom:1px solid var(--ice-line); background: var(--card); padding-block:22px; }
  .platform-bar .wrap{ display:flex; flex-wrap:wrap; align-items:center; gap: clamp(14px,3vw,28px); justify-content:center; }
  .platform-bar__label{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.04em; color: var(--navy-faint); text-transform:uppercase; flex:none; }
  .platform-chip{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-display); font-weight:600; font-size:.92rem; color: var(--navy-mut); }
  .platform-chip .ic-dot{ width:26px; height:26px; border-radius:50%; background: var(--ice); display:flex; align-items:center; justify-content:center; flex:none; }
  .platform-chip .ic-dot .ic{ width:14px; height:14px; color: var(--brand-blue); }
  @media (max-width: 640px){ .platform-bar .wrap{ justify-content:flex-start; } .platform-bar__label{ width:100%; } }

  /* ---------- section head ---------- */
  .section-head{ max-width: 640px; }
  .section-head h2{ font-size: clamp(1.6rem, 3.4vw, 2.2rem); }
  .section-head .dek{ font-size:1rem; color: var(--navy-mut); margin-top:12px; max-width: 58ch; }

  /* ---------- problem grid ---------- */
  .problem-grid{ margin-top: clamp(32px,4.5vw,48px); display:grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
  @media (max-width: 860px){ .problem-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 560px){ .problem-grid{ grid-template-columns: 1fr; } }
  .problem-card{ background: var(--card); border-radius: var(--radius); padding: 20px 20px 22px; box-shadow: var(--shadow-card); }
  .problem-card p{ font-size:.95rem; color: var(--navy); line-height:1.55; }
  .problem-card:nth-child(2){ margin-top: 16px; }
  .problem-card:nth-child(5){ margin-top: 16px; }
  @media (max-width: 860px){ .problem-card:nth-child(n){ margin-top:0; } }

  /* ---------- product family ---------- */
  .fam-grid{ margin-top: clamp(30px,4.5vw,46px); display:grid; grid-template-columns: repeat(5,1fr); gap:14px; }
  @media (max-width: 980px){ .fam-grid{ grid-template-columns: repeat(3,1fr); } }
  @media (max-width: 620px){ .fam-grid{ grid-template-columns: repeat(2,1fr); } }
  .fam-card{ background: var(--card); border-radius: var(--radius); padding:18px 16px; box-shadow: var(--shadow-card); display:block; text-decoration:none; color:inherit; transition: transform .15s ease, box-shadow .15s ease; }
  .fam-card:hover{ transform: translateY(-2px); box-shadow: 0 14px 28px -14px rgba(20,33,61,.18); }
  .fam-card h3{ font-size:1rem; }
  .fam-card p{ font-size:.82rem; color: var(--navy-mut); margin-top:8px; line-height:1.5; }
  .fam-card .pill{ margin-top:14px; }
  .fam-card.active{ background: var(--card); border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient); background-origin: border-box; background-clip: padding-box, border-box; box-shadow: var(--shadow-card); }
  .fam-card img{ width:36px; height:36px; display:block; margin-bottom:12px; }
  .fam-card:not(.active) img{ opacity:.55; filter: grayscale(.35); }

  /* ---------- company ---------- */
  .company{ margin-top: clamp(28px,4.5vw,44px); display:grid; grid-template-columns: auto 1fr; gap: clamp(20px,3.6vw,34px); align-items:start; background: var(--card); border-radius: var(--radius-lg); padding: clamp(22px,3.6vw,36px); box-shadow: var(--shadow-card); }
  @media (max-width: 640px){ .company{ grid-template-columns:1fr; } }
  .company .mark-lg{ width:52px; height:52px; border-radius:12px; background: var(--ice); display:flex; align-items:center; justify-content:center; padding:8px; }
  .company .mark-lg img{ width:100%; height:100%; object-fit:contain; }
  .company p{ color: var(--navy-mut); max-width: 62ch; font-size:.97rem; }
  .company p + p{ margin-top:.85em; }
  .company strong{ color: var(--navy); }

  /* ---------- break: the one deliberate gradient-background moment ---------- */
  .break{ text-align:center; padding-block: clamp(64px,10vw,110px); background: var(--gradient); position:relative; overflow:clip; }
  .break::before{ content:""; position:absolute; inset:0; background: none; pointer-events:none; }  /* the white glow lowered the text contrast */
  .break h2{ position:relative; font-size: clamp(1.7rem,4.4vw,2.7rem); color:#ffffff; max-width: 18ch; margin-inline:auto; }
  .break h2 em{ font-style:normal; color:#eaf4ff; }
  .break .dek{ position:relative; margin-top:14px; color:#ffffff; }
  .break .pill{ position:relative; background: rgba(20,33,61,.28); color:#ffffff; border:1px solid rgba(255,255,255,.35); }
  .break .pill .pill-dot{ background:#ffffff; }

  /* ---------- capability grid ---------- */
  .cap-grid{ margin-top: clamp(32px,4.5vw,48px); display:grid; grid-template-columns: repeat(3,1fr); gap:18px; }
  @media (max-width: 860px){ .cap-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 560px){ .cap-grid{ grid-template-columns: 1fr; } }
  .cap-card{ background: var(--card); border-radius: var(--radius); padding:20px; box-shadow: var(--shadow-card); }
  .cap-card h3{ font-size:1.02rem; margin-bottom:8px; }
  .cap-card p{ font-size:.88rem; color: var(--navy-mut); line-height:1.55; }
  .cap-card .pill{ margin-top:14px; }
  .cap-card.featured{
    grid-column: span 2; display:flex; align-items:center; gap:18px;
    border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient);
    background-origin: border-box; background-clip: padding-box, border-box;
  }
  .cap-card.featured .ic-chip{ margin-bottom:0; background: var(--gradient); flex:none; }
  .cap-card.featured .ic-chip .ic{ color:#ffffff; }
  @media (max-width: 560px){ .cap-card.featured{ grid-column: span 1; flex-direction:column; align-items:flex-start; text-align:left; } }

  .action-panel{ grid-column: 1/-1; background: var(--card); border-radius: var(--radius-lg); padding: clamp(20px,3.2vw,30px); box-shadow: var(--shadow-card); }
  .action-panel h3{ font-size:1.12rem; }
  .action-panel .dek{ font-size:.86rem; color: var(--navy-mut); margin-top:6px; }
  .action-panel .panel-queue{ margin-top:18px; background:transparent; border:none; padding:0; }
  .action-panel .panel-queue .row{ background: var(--ice); border:1px solid var(--ice-line); }
  .action-panel .panel-queue .row + .row{ margin-top:8px; }
  .note{ margin-top:14px; font-size:.76rem; color: var(--navy-faint); }

  .attr-panel{ grid-column:1/-1; background: var(--card); border:1px solid rgba(118,103,232,.3); border-radius: var(--radius-lg); padding: clamp(22px,3.4vw,34px); box-shadow: var(--shadow-card); position:relative; overflow:clip; }
  .attr-panel::before{ content:""; position:absolute; inset:0; background: linear-gradient(160deg, rgba(53,120,229,.06), rgba(118,103,232,.05) 60%, transparent); pointer-events:none; }
  .attr-panel h3{ position:relative; font-size: clamp(1.1rem,2.2vw,1.4rem); max-width: 28ch; }
  .attr-panel .dek{ position:relative; margin-top:10px; color: var(--navy-mut); font-size:.92rem; max-width: 58ch; }
  .attr-panel .panel-flow{ position:relative; margin-top:24px; background: var(--ice); }

  /* ---------- pricing ---------- */
  .beta-block{ background: var(--card); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); padding: clamp(26px,4.2vw,46px); margin-top: clamp(32px,4.5vw,48px); display:grid; grid-template-columns:1.1fr .9fr; gap: clamp(24px,4vw,44px); align-items:center; }
  @media (max-width:760px){ .beta-block{ grid-template-columns:1fr; } }
  .beta-block h3{ font-size: clamp(1.35rem,2.8vw,1.9rem); max-width: 18ch; }
  .beta-block .dek{ margin-top:12px; color: var(--navy-mut); font-size:.96rem; max-width: 46ch; }

  .intake{ background: var(--ice); border:1px solid var(--ice-line); border-radius: var(--radius); padding:22px; }
  .intake label{ display:block; font-size:.8rem; font-weight:600; color: var(--navy); margin-bottom:8px; }
  .intake .row{ display:flex; gap:10px; flex-wrap:wrap; }
  .intake input[type=email]{ flex:1 1 180px; min-width:0; padding:.78em .9em; border:1.5px solid #c9d8ef; background:#fff; color: var(--navy); font-family: var(--font-body); font-size:.95rem; border-radius: var(--radius-sm); }
  .intake input[type=email]:focus-visible{ outline:2.5px solid var(--brand-blue); outline-offset:1px; }
  .intake .fine{ font-size:.78rem; color: var(--navy-mut); margin-top:10px; }
  .intake .received{ display:flex; align-items:center; gap:8px; font-family: var(--font-display); font-weight:600; color: var(--ok); }

  .future-pricing{ margin-top: clamp(28px,4vw,42px); }
  .future-pricing .flag{ font-size:.82rem; color: var(--navy-faint); margin-bottom:16px; }
  .plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  @media (max-width:760px){ .plans{ grid-template-columns:1fr; } }
  .plan{ background: var(--card); border-radius: var(--radius); padding:20px; box-shadow: var(--shadow-card); }
  .plan.featured{ border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient); background-origin: border-box; background-clip: padding-box, border-box; }
  .plan h4{ font-size:1rem; display:flex; justify-content:space-between; align-items:center; }
  .plan .price{ font-family: var(--font-display); font-variant-numeric: tabular-nums; font-size:1.7rem; color: var(--navy); margin-block:12px 2px; }
  .plan .price span{ font-family: var(--font-body); font-size:.82rem; color: var(--navy-faint); font-weight:400; }
  .plan ul{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.85rem; color: var(--navy-mut); }
  .plan li{ display:flex; gap:8px; align-items:flex-start; }
  .plan li .ic{ width:15px; height:15px; color: var(--brand-blue); margin-top:3px; }

  footer{ background: var(--cloud); border-top:1px solid var(--cloud-line); padding-block:40px; }
  footer .wrap{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px; align-items:center; font-size:.84rem; color: var(--navy-faint); }
  footer .brand img{ height:24px; }
  footer .legal{ max-width:46ch; }
  footer nav{ display:flex; gap:18px; flex-wrap:wrap; }
  footer a{ text-decoration:none; color: var(--navy-faint); }
  footer a:hover{ color: var(--navy); }

  .motif{ background: var(--card); border:1px solid var(--cloud-line); border-radius: var(--radius-lg); box-shadow: var(--shadow-pop); padding: clamp(36px,6vw,60px); display:flex; align-items:center; justify-content:center; aspect-ratio: 1.1/1; }
  .motif svg{ width:100%; height:100%; max-width:300px; }
  .focus-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top: clamp(30px,4.5vw,46px); }
  @media (max-width:860px){ .focus-grid{ grid-template-columns:1fr; } }
  .focus-card{ background: var(--card); border-radius: var(--radius); padding: clamp(20px,3vw,28px); box-shadow: var(--shadow-card); }
  .focus-card p{ font-size:.95rem; color: var(--navy-mut); line-height:1.6; }
  .focus-card .tag-future{ display:inline-block; margin-top:14px; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.03em; color: var(--navy-faint); text-transform:uppercase; }
  /* ---------- page router ---------- */
  .page[hidden]{ display:none !important; }

  /* ---------- home hero: the platform constellation ---------- */
  .hero--home .hero-grid{ grid-template-columns: 1fr 1.05fr; }
  @media (max-width: 980px){ .hero--home .hero-grid{ grid-template-columns:1fr; } }
  .hero--home h1{ margin-top:18px; }
  .hero-copy{ min-width:0; }
  .stage{ position:relative; width:100%; max-width:560px; aspect-ratio:1/1; margin-inline:auto; }
  .stage-lines{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
  .stage-lines line{ stroke-width:1.5; vector-effect:non-scaling-stroke; opacity:.55; }
  .stage-lines .ring{ fill:none; stroke:#c9d8ef; stroke-width:1; stroke-dasharray:3 5; vector-effect:non-scaling-stroke; }
  .stage-lines .ring--outer{ stroke:#dbe5f3; }
  .core{ position:absolute; left:50%; top:50%; width:27%; aspect-ratio:1; translate:-50% -50%; border-radius:50%;
    background: radial-gradient(circle at 35% 30%, #ffffff, #eef4ff 70%); box-shadow: 0 0 0 10px rgba(118,103,232,.08), 0 0 0 22px rgba(53,120,229,.05), var(--shadow-pop);
    display:flex; align-items:center; justify-content:center; }
  .core img{ width:64%; height:auto; }
  .tile{ position:absolute; translate:-50% -50%; display:flex; flex-direction:column; align-items:center; gap:6px;
    background: var(--card); border:1px solid var(--cloud-line); border-radius:16px; padding:8px 10px 7px; min-width:19%;
    text-decoration:none; color: var(--navy); font-family: var(--font-display); font-weight:600; font-size:clamp(.75rem,1.5vw,.88rem);
    box-shadow: var(--shadow-card); transition: transform .18s ease, box-shadow .18s ease; }
  .tile img{ width:clamp(28px,4.6vw,44px); height:auto; }
  .tile:hover{ transform: translateY(-3px); box-shadow: 0 16px 30px -14px rgba(20,33,61,.3); }
  .tile--open{ border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient); background-origin:border-box; background-clip:padding-box,border-box; }
  .tile--open::after{ content:"BETA"; position:absolute; top:-9px; right:-8px; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.03em; background: var(--violet-text); color:#fff; padding:1px 7px; border-radius:999px; }
  .live-ic{ display:inline-flex; align-items:center; gap:5px; height:clamp(28px,4.6vw,44px); padding:0 9px; border-radius:10px; background:#e0394c; color:#fff; font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.06em; }
  .live-ic span{ width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.3); }
  .bubble{ position:absolute; translate:-50% -50%; width:11.5%; aspect-ratio:1; border-radius:50%; background:#fff; border:1px solid var(--cloud-line);
    box-shadow: 0 8px 20px -10px rgba(20,33,61,.28); display:flex; align-items:center; justify-content:center; animation: bob 6s ease-in-out infinite; }
  .bubble .si{ width:52%; height:52%; }
  @keyframes bob{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-6px); } }
  @media (prefers-reduced-motion: reduce){ .bubble{ animation:none; } .marquee__track{ animation:none !important; } }

  .core--photo{ width:60%; border-radius:28px; overflow:visible; background:none; box-shadow: 0 0 0 10px rgba(255,255,255,.7), var(--shadow-pop); }
  .core--photo > img{ width:100%; height:100%; object-fit:cover; border-radius:28px; display:block; }
  .core-mark{ position:absolute; left:50%; bottom:-20px; translate:-50% 0; width:44px; height:44px; border-radius:50%; background:#fff; box-shadow: var(--shadow-card); display:flex; align-items:center; justify-content:center; }
  .core-mark img{ width:30px; height:30px; }
  .tile, .bubble{ z-index:2; }
  .cap-grid > *, .hero-grid > *{ min-width:0; }
  .panel-url{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* ---------- photos on app pages ---------- */
  .motif--photo{ padding:0; overflow:hidden; aspect-ratio:1/1; }
  .motif--photo img{ width:100%; height:100%; object-fit:cover; display:block; }
  .hero-visual{ position:relative; min-width:0; }
  .hero-visual > img{ display:block; width:78%; margin-left:auto; height:auto; aspect-ratio:1/1; object-fit:cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-pop); }
  .hero-visual > .panel{ position:relative; width:88%; margin-top:-38%; }
  @media (max-width:560px){ .hero-visual > img{ width:100%; } .hero-visual > .panel{ width:100%; margin-top:-18%; } }

  /* ---------- logo marquee ---------- */
  .marquee{ background: var(--card); border-block:1px solid var(--ice-line); padding-block:18px; display:flex; align-items:center; gap:24px; padding-inline: clamp(18px,4.5vw,44px); }
  .marquee__label{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.04em; text-transform:uppercase; color: var(--navy-faint); flex:none; max-width:14ch; line-height:1.4; }
  .marquee__viewport{ flex:1; min-width:0; overflow:hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
  .marquee__track{ display:flex; width:max-content; animation: slide 38s linear infinite; }
  .mq-dup{ display:flex; }
  .mq-item{ display:inline-flex; align-items:center; gap:10px; margin-right:42px; font-family:var(--font-display); font-weight:600; font-size:1rem; color: var(--navy-mut); white-space:nowrap; }
  .mq-item .si{ width:24px; height:24px; }
  @keyframes slide{ to{ transform: translateX(-50%); } }
  @media (max-width:640px){ .marquee{ flex-direction:column; align-items:flex-start; gap:10px; } .marquee__label{ max-width:none; } .marquee__viewport{ width:100%; } }

  /* ---------- app grid ---------- */
  .app-grid{ margin-top: clamp(30px,4.5vw,46px); display:grid; grid-template-columns: repeat(3,1fr); gap:18px; }
  @media (max-width: 920px){ .app-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 600px){ .app-grid{ grid-template-columns: 1fr; } }
  .app-card{ min-width:0; background: var(--card); border-radius: var(--radius-lg); padding: clamp(20px,2.6vw,26px); box-shadow: var(--shadow-card);
    display:flex; flex-direction:column; gap:10px; text-decoration:none; color:inherit; transition: transform .18s ease, box-shadow .18s ease; }
  a.app-card:hover{ transform: translateY(-3px); box-shadow: 0 18px 34px -16px rgba(20,33,61,.24); }
  .app-card--open{ border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient); background-origin:border-box; background-clip:padding-box,border-box; }
  .app-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px; }
  .app-ic img{ width:44px; height:44px; display:block; object-fit:contain; }
  .app-ic .live-ic{ height:44px; }
  .app-card h3{ font-size:1.12rem; }
  .app-head{ font-family: var(--font-display); font-weight:600; color: var(--navy); font-size:.98rem; line-height:1.4; }
  .app-who{ font-size:.86rem; color: var(--navy-mut); }
  .app-card ul{ list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.88rem; color: var(--navy); }
  .app-card li{ display:flex; gap:8px; align-items:flex-start; }
  .app-card li .ic{ width:16px; height:16px; color: var(--brand-blue); margin-top:3px; }
  .app-link{ margin-top:auto; padding-top:10px; display:inline-flex; align-items:center; gap:6px; font-family: var(--font-display); font-weight:600; font-size:.9rem; color:#215bc7; }
  .app-link .ic{ width:16px; height:16px; }
  .app-card--ask{ background: var(--gradient-soft); box-shadow:none; border:1px dashed rgba(118,103,232,.4); }
  .app-card--ask .btn{ margin-top:auto; align-self:flex-start; }

  /* ---------- channels grid ---------- */
  .ch-grid{ margin-top: clamp(30px,4.5vw,46px); display:grid; grid-template-columns: repeat(3,1fr); gap:18px; }
  @media (max-width: 920px){ .ch-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 600px){ .ch-grid{ grid-template-columns: 1fr; } }
  .ch-card{ min-width:0; background: var(--card); border:1px solid var(--cloud-line); border-radius: var(--radius-lg); padding: clamp(18px,2.4vw,24px); display:flex; flex-direction:column; gap:10px; text-decoration:none; color:inherit; transition: transform .18s ease, box-shadow .18s ease; }
  .ch-card:hover{ transform: translateY(-3px); box-shadow: 0 18px 34px -16px rgba(20,33,61,.22); }
  .ch-logos{ display:flex; gap:8px; margin-bottom:4px; }
  .ch-logo{ width:40px; height:40px; border-radius:12px; background: var(--ice); display:flex; align-items:center; justify-content:center; }
  .ch-logo .si{ width:22px; height:22px; }
  .ch-logos{ flex-wrap:wrap; }
  .ch-logo--more{ font-family: var(--font-display); font-weight:700; font-size:.85rem; color: var(--violet-text); }
  .ch-logo--wide{ width:auto; padding:0 10px; }
  .ch-logo--shop{ width:auto; padding:0 9px; gap:4px; }
  .ch-logo--shop .si{ width:18px; height:18px; }
  .ch-logo--shop b{ font-family: var(--font-display); font-size:.75rem; font-weight:700; color: var(--navy); }
  .ch-card h3{ font-size:1.05rem; }
  .ch-card p{ font-size:.9rem; color: var(--navy-mut); line-height:1.55; }
  .ch-foot{ margin-top:auto; padding-top:10px; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; border-top:1px solid var(--cloud-line); }
  .ch-app{ font-family: var(--font-display); font-weight:600; font-size:.88rem; color:#215bc7; }

  .pill--beta .pill-dot{ background: var(--soft-violet); }
  .qb-badge{ display:inline-flex; align-items:center; gap:8px; align-self:flex-start; font-family:var(--font-display); font-weight:600; font-size:.85rem; color: var(--navy); background:#fff; border:1px solid var(--cloud-line); border-radius:999px; padding:5px 12px 5px 6px; }
  .qb-badge .si{ width:22px; height:22px; }
  .icon-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
  .ic-chip--logos{ display:inline-flex; width:auto; padding:0 12px; gap:8px; }
  .ic-chip--logos .si{ width:20px; height:20px; }
  .adch-grid{ margin-top: clamp(28px,4vw,40px); display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  @media (max-width:860px){ .adch-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:520px){ .adch-grid{ grid-template-columns:1fr; } }
  .adch{ min-width:0; display:flex; gap:14px; align-items:flex-start; background: var(--card); border-radius: var(--radius); padding:18px; box-shadow: var(--shadow-card); }
  .adch-logo{ flex:none; width:44px; height:44px; border-radius:12px; background: var(--ice); display:flex; align-items:center; justify-content:center; }
  .adch-logo .si{ width:24px; height:24px; }
  .adch-logo .si--wide{ width:38px; }
  .adch h3{ font-size:1rem; }
  .adch p{ font-size:.88rem; color: var(--navy-mut); margin-top:4px; }
  .adch .tag-future{ display:inline-block; margin-top:10px; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.03em; color: var(--navy-faint); text-transform:uppercase; }
  .rollout{ margin-top:12px; font-size:.88rem; color: var(--navy-faint); }
  .tag-now{ color: var(--ok) !important; }

  /* ---------- why grid ---------- */
  .why-grid{ margin-top: clamp(30px,4.5vw,46px); display:grid; grid-template-columns: repeat(4,1fr); gap: clamp(18px,2.6vw,28px); }
  @media (max-width: 920px){ .why-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 520px){ .why-grid{ grid-template-columns: 1fr; } }
  .why-item h3{ font-size:1.02rem; margin-bottom:8px; }
  .why-item p{ font-size:.92rem; color: var(--navy-mut); line-height:1.6; }
  .btn-onbrand{ color:#fff; border-color: rgba(255,255,255,.55); background: transparent; }
  .btn-onbrand:hover{ border-color:#fff; }

  .pv{ max-width: 760px; }
  .pv h1{ font-size: clamp(2rem,4vw,2.8rem); }
  .pv-date{ margin-top:10px; font-family:var(--font-mono); font-size:.8rem; color: var(--navy-faint); }
  .pv-lede{ margin-top:18px; font-size:1.05rem; color: var(--navy-mut); }
  .pv-sec{ margin-top: 34px; }
  .pv-sec h2{ font-size:1.2rem; margin-bottom:10px; }
  .pv-sec p{ color: var(--navy-mut); }
  .pv-sec p + p{ margin-top:.8em; }
  .legal-center{ max-width:900px; }
  .legal-index{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:28px; }
  .legal-index a{ display:flex; align-items:center; min-height:44px; padding:10px 12px; border:1px solid var(--cloud-line); border-radius:var(--radius-sm); background:var(--card); color:var(--navy); font-weight:600; text-decoration:none; }
  .legal-index a:hover{ border-color:var(--brand-blue); color:var(--brand-blue); }
  .legal-index a:focus-visible{ outline:2.5px solid var(--brand-blue); outline-offset:2px; }
  .pv-list{ margin:12px 0 0; padding-left:1.25rem; display:grid; gap:10px; color:var(--navy-mut); line-height:1.65; }
  .legal-callout{ margin-top:24px; max-width:900px; border:1px solid var(--ice-line); border-radius:var(--radius); background:var(--ice); padding:clamp(18px,3vw,28px); }
  .legal-callout h3{ font-size:1.08rem; }
  .legal-callout ul{ margin:12px 0 0; padding-left:1.25rem; display:grid; gap:8px; color:var(--navy-mut); line-height:1.6; }
  .legal-callout p{ margin-top:14px; color:var(--navy-mut); font-size:.92rem; line-height:1.65; }
  @media (max-width:720px){ .legal-index{ grid-template-columns:1fr; } }
  .hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }
  .form-error{ margin-top:10px; font-size:.85rem; color: var(--danger); }
  .fine a{ color: inherit; }

  .pr-hero{ padding-block: clamp(40px,6vw,72px) clamp(48px,6vw,80px); }
  .pr-head{ max-width: 760px; }
  .pr-head h1{ font-size: clamp(2rem,4vw,2.8rem); margin-top:10px; }
  .pr-back{ font-family: var(--font-display); font-weight:600; font-size:.9rem; color:#215bc7; text-decoration:none; }
  .pr-draft{ margin-top:16px; font-size:.88rem; color: var(--navy); background: rgba(217,143,43,.12); border:1px solid rgba(217,143,43,.35); border-radius: var(--radius-sm); padding:10px 14px; }
  .pr-plans{ margin-top: clamp(28px,4vw,44px); display:grid; grid-template-columns: repeat(3,1fr); gap:18px; align-items:start; }
  @media (max-width: 900px){ .pr-plans{ grid-template-columns:1fr; max-width:520px; } }
  .pr-plan{ position:relative; min-width:0; background: var(--card); border-radius: var(--radius-lg); padding: clamp(20px,2.6vw,28px); box-shadow: var(--shadow-card); display:flex; flex-direction:column; gap:10px; }
  .pr-plan--pop{ border:1.5px solid transparent; background-image: linear-gradient(var(--card),var(--card)), var(--gradient); background-origin:border-box; background-clip:padding-box,border-box; box-shadow: var(--shadow-pop); }
  .pr-pop{ position:absolute; top:-12px; left:24px; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.03em; text-transform:uppercase; background: var(--violet-text); color:#fff; padding:3px 10px; border-radius:999px; }
  .pr-plan h3{ font-size:1.2rem; }
  .pr-who{ font-size:.9rem; color: var(--navy-mut); }
  .pr-price{ font-family: var(--font-display); font-weight:700; font-size:2.6rem; line-height:1; color: var(--navy); font-variant-numeric: tabular-nums; margin-block:6px 4px; display:flex; align-items:baseline; gap:2px; flex-wrap:wrap; }
  .pr-cur{ font-size:1.3rem; align-self:flex-start; margin-top:6px; }
  .pr-price--tbd{ font-size:1.25rem; color: var(--navy-mut); margin-block:10px 6px; }
  .pr-unit{ font-family: var(--font-body); font-weight:400; font-size:.85rem; color: var(--navy-faint); margin-left:8px; }
  .pr-plan .btn{ justify-content:center; }
  .pr-inc{ margin-top:8px; font-size:.82rem; font-weight:600; color: var(--navy); }
  .pr-plan ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; font-size:.9rem; color: var(--navy); }
  .pr-plan li{ display:flex; gap:9px; align-items:flex-start; }
  .pr-ok{ width:17px; height:17px; color: var(--brand-blue); flex:none; margin-top:2px; }
  .pr-soon{ width:17px; height:17px; color: var(--navy-faint); flex:none; margin-top:2px; }
  .pr-next{ display:inline-block; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.02em; color: var(--warn); background: rgba(217,143,43,.12); border-radius:999px; padding:1px 8px; white-space:nowrap; vertical-align:1px; }
  .pr-no{ color: var(--navy-faint); }
  .pr-tablewrap{ margin-top: clamp(20px,3vw,32px); overflow-x:auto; border-radius: var(--radius-lg); box-shadow: var(--shadow-card); background: var(--card); }
  .pr-table{ width:100%; border-collapse:collapse; font-size:.9rem; min-width: 640px; }
  .pr-compare{ min-width: 900px; }
  .pr-table th, .pr-table td{ padding:12px 16px; border-bottom:1px solid var(--cloud-line); text-align:left; vertical-align:top; }
  .pr-table td{ text-align:center; }
  .pr-table thead th{ position:sticky; top:0; background: var(--cloud); font-family: var(--font-display); font-weight:600; font-size:.95rem; color: var(--navy); text-align:center; }
  .pr-table thead th:first-child, .pr-table tbody th{ text-align:left; }
  .pr-table thead th span{ display:block; font-family: var(--font-body); font-weight:400; font-size:.8rem; color: var(--navy-faint); }
  .pr-table thead th a{ color: var(--navy); text-decoration:none; }
  .pr-table tbody th{ font-weight:500; color: var(--navy); position:sticky; left:0; background: var(--card); min-width:200px; }
  .pr-table td .pr-ok{ display:inline-block; margin:0; }
  .pr-txt{ font-size:.84rem; color: var(--navy-mut); }
  .pr-group th{ background: var(--ice) !important; font-family: var(--font-display); font-weight:600; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color: var(--navy-mut); position:static !important; }
  .pr-more{ margin-top:22px; }
  .pr-legend{ margin-top:16px; font-size:.85rem; color: var(--navy-mut); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
  .pr-legend .pr-ok{ margin:0; }
  .pr-chips{ margin-top:22px; display:flex; flex-wrap:wrap; gap:10px; }
  .pr-chip{ font-family: var(--font-display); font-weight:600; font-size:.88rem; color: var(--navy); text-decoration:none; background: var(--card); border:1px solid var(--cloud-line); border-radius:999px; padding:7px 14px; }
  .pr-chip:hover{ border-color: var(--brand-blue); color:#215bc7; }

  .pr-cta{ margin-top: clamp(28px,4vw,42px); display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; background: var(--card); border-radius: var(--radius-lg); padding: clamp(20px,3vw,28px); box-shadow: var(--shadow-card); }
  .pr-cta h3{ font-size:1.1rem; }
  .pr-cta p{ font-size:.9rem; color: var(--navy-mut); margin-top:4px; }

/* ---------- fuller app pages (draft v26): shared by the Commerce, Studio, Books and LiveAd pages ---------- */
:root { --warn-text:#8a5a12; }

/* feature rows: copy on one side, a product-shaped panel or photo on the other */
.section-head + .fx { margin-top: clamp(36px,5vw,60px); }
.fx { display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); gap: clamp(28px,5vw,72px); align-items:center; }
.fx + .fx { margin-top: clamp(56px,8vw,104px); }
.fx--flip .fx-media { order:-1; }
.fx-copy { min-width:0; }
.fx-copy h2 { font-size: clamp(1.6rem,3.4vw,2.2rem); }
.fx-copy h3 { font-size: clamp(1.4rem,2.8vw,1.9rem); line-height:1.14; }
.fx-copy p { margin-top:14px; font-size:1.02rem; line-height:1.68; color: var(--navy-mut); max-width:58ch; }
.fx-copy .fx-note { margin-top:12px; font-size:.88rem; color: var(--navy-faint); }
.fx-media { min-width:0; background: var(--ice); border-radius: var(--radius-lg); padding: clamp(14px,2.6vw,32px); }
.section--tint .fx-media { background: var(--card); }
.fx-photo { border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-pop); aspect-ratio: 4/3; background: var(--ice); }
.fx-photo img { width:100%; height:100%; object-fit:cover; display:block; }

/* checklist inside copy */
.fx-list { list-style:none; margin:20px 0 0; padding:0; display:grid; gap:14px; }
.fx-list li { display:grid; grid-template-columns:22px 1fr; gap:12px; align-items:start; font-size:.98rem; line-height:1.6; color: var(--navy-mut); }
.fx-list li b { color: var(--navy); font-weight:600; }
.fx-list .ic { width:20px; height:20px; margin-top:2px; color: var(--brand-blue); }

/* rows inside a panel */
.ledger { list-style:none; margin:0; padding:0; }
.ledger li { display:flex; align-items:center; gap:14px; padding:14px clamp(16px,2.6vw,24px); border-top:1px solid var(--cloud-line); }
.ledger li:first-child { border-top:0; }
.ledger .nm { font-weight:600; color: var(--navy); min-width:0; }
.ledger .how { margin-left:auto; font-size:.86rem; color: var(--navy-mut); text-align:right; }
.ledger .sub { display:block; font-weight:400; font-size:.84rem; color: var(--navy-mut); margin-top:2px; }
.ledger li.total { background: var(--ice); }
.ledger li.total .nm { font-family: var(--font-display); }
.panel-foot { padding:12px clamp(16px,2.6vw,24px); border-top:1px solid var(--cloud-line); background: var(--cloud); font-size:.8rem; color: var(--navy-faint); }

/* status labels */
.st { display:inline-flex; align-items:center; gap:.5em; font-family: var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color: var(--navy-faint); white-space:nowrap; }
.st::before { content:""; width:7px; height:7px; border-radius:50%; background: currentColor; flex:none; }
.st--live { color: var(--ok); }
.st--test { color: var(--warn-text); }
.st--soon { color: var(--violet-text); }
.st--air { color:#b02a3c; }
.adch .st { margin-top:10px; }

/* vertical pipeline: a sequence where order matters */
.pipe { list-style:none; margin:0; padding:clamp(18px,3vw,28px); }
.pipe li { display:grid; grid-template-columns:44px 1fr; gap:16px; align-items:start; position:relative; padding-bottom:24px; }
.pipe li:last-child { padding-bottom:0; }
.pipe li::before { content:""; position:absolute; left:21.25px; top:50px; bottom:6px; width:1.5px; background: var(--gradient); opacity:.55; }
.pipe li:last-child::before { display:none; }
.pipe .ic-chip { margin-bottom:0; }
.pipe h3, .pipe h4 { font-size:1.02rem; line-height:1.3; margin-top:2px; }
.pipe p { font-size:.92rem; color: var(--navy-mut); line-height:1.58; margin-top:4px; }

/* approval queue (example) */
.queue { list-style:none; margin:0; padding:0; }
.queue li { display:flex; align-items:center; gap:14px; padding:16px clamp(16px,2.6vw,24px); border-top:1px solid var(--cloud-line); }
.queue li:first-child { border-top:0; }
.queue b { display:block; font-weight:600; color: var(--navy); line-height:1.35; }
.queue span.src { display:block; font-size:.84rem; color: var(--navy-mut); margin-top:2px; }
.queue .st { margin-left:auto; }

/* scheduled post (example) */
.post { padding: clamp(16px,2.6vw,24px); display:grid; gap:14px; }
.post-head { display:flex; align-items:center; gap:12px; }
.post-head b { display:block; font-weight:600; color: var(--navy); }
.post-head span.src { display:block; font-size:.84rem; color: var(--navy-mut); }
.post-img { width:100%; height:auto; aspect-ratio: 16/10; object-fit:cover; object-position: 50% 62%; border-radius: var(--radius); display:block; }
.post-cap { font-size:.95rem; line-height:1.55; color: var(--navy); }
.post-checks { display:flex; flex-wrap:wrap; gap:8px 18px; }

/* status label under a capability card, and beside a ledger row */
.cap-card .st { margin-top:14px; }
.ledger li .st { margin-left:auto; }

/* hero: the app's own logo on a white card, and the app name set in bold */
.app-logo-card { display:flex; align-items:center; width:fit-content; max-width:100%; background: var(--card); border:1px solid var(--cloud-line); border-radius: var(--radius); padding: 14px 28px; box-shadow: var(--shadow-card); margin-bottom: 22px; }
.app-logo-card img { display:block; height: clamp(52px, 6.4vw, 76px); width:auto; max-width:none; }
.app-logo-card--tall img { height: clamp(66px, 8.2vw, 96px); }
.icon-row .app-logo-card { margin-bottom:0; }
strong.app-name { font-weight:700; color: var(--navy); }

/* where each part stands: one object, three columns */
.stat-cols { margin-top: clamp(30px,4.5vw,46px); display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); background: var(--card); border:1px solid var(--cloud-line); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); overflow:hidden; }
.stat-col { padding: clamp(20px,3vw,30px); }
.stat-col + .stat-col { border-left:1px solid var(--cloud-line); }
.stat-col h3 { font-size:1.08rem; margin-top:12px; }
.stat-col .lede { margin-top:6px; font-size:.88rem; color: var(--navy-faint); line-height:1.5; }
.stat-col ul { list-style:none; margin:16px 0 0; padding:0; display:grid; gap:11px; }
.stat-col li { font-size:.94rem; line-height:1.5; color: var(--navy-mut); padding-left:16px; position:relative; }
.stat-col li::before { content:""; position:absolute; left:0; top:.62em; width:5px; height:5px; border-radius:50%; background:#b8c6df; }

/* questions */
.faq { margin-top: clamp(28px,4vw,40px); max-width:780px; border-top:1px solid var(--cloud-line); }
.faq details { border-bottom:1px solid var(--cloud-line); padding:18px 4px; }
.faq summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; font-family: var(--font-display); font-weight:600; font-size:1.05rem; color: var(--navy); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:""; flex:none; width:9px; height:9px; border-right:2px solid var(--navy-mut); border-bottom:2px solid var(--navy-mut); rotate:45deg; margin-top:-4px; transition: rotate .2s ease; }
.faq details[open] summary::after { rotate:-135deg; margin-top:4px; }
.faq details p { margin-top:12px; color: var(--navy-mut); line-height:1.68; max-width:62ch; }
.faq a { color: var(--brand-blue); }

@media (max-width: 860px) {
  .fx { grid-template-columns:1fr; }
  .fx--flip .fx-media { order:0; }
  .stat-cols { grid-template-columns:1fr; }
  .stat-col + .stat-col { border-left:0; border-top:1px solid var(--cloud-line); }
}
@media (prefers-reduced-motion: reduce) {
  .faq summary::after { transition:none; }
}

/* Invitation request form. */
.intake .intake-label{ display:block; font-size:.8rem; font-weight:600; color: var(--navy); margin-bottom:8px; }
.intake .row .btn{ text-decoration:none; }
.invite-form{ margin-top:clamp(32px,5vw,56px); padding:clamp(22px,4vw,40px); background:var(--card); border:1px solid var(--cloud-line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); scroll-margin-top:24px; }
.invite-form h2{ margin-bottom:8px; }
.invite-fields{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:24px; }
.invite-form label,.invite-form legend{ color:var(--navy); font-family:var(--font-display); font-size:.92rem; font-weight:600; }
.invite-form input[type="email"],.invite-form input[type="text"],.invite-form textarea{ display:block; width:100%; margin-top:7px; padding:11px 12px; border:1px solid #aab8cf; border-radius:var(--radius-sm); background:#fff; color:var(--navy); font:inherit; }
.invite-form input:focus,.invite-form textarea:focus{ outline:3px solid rgba(37,99,201,.22); border-color:var(--brand-blue); }
.invite-form fieldset{ margin:22px 0; padding:0; border:0; }
.invite-products{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:10px; }
.invite-products label,.invite-consent{ display:flex; gap:9px; align-items:flex-start; font-family:var(--font-body); font-weight:400; color:var(--navy-mut); }
.invite-products input,.invite-consent input{ flex:none; width:18px; height:18px; margin-top:1px; accent-color:var(--brand-blue); }
.invite-consent{ margin:18px 0; max-width:70ch; }
.invite-form textarea{ resize:vertical; min-height:110px; }
.invite-form button[disabled]{ opacity:.65; cursor:wait; }
.invite-status{ min-height:1.5em; margin-top:12px; color:var(--navy); font-weight:600; }
.invite-trap{ position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
@media (max-width:700px){ .invite-fields,.invite-products{ grid-template-columns:1fr; } }

/* Utility classes generated from the former inline style="" attributes, so the page needs no
   'unsafe-inline' in its Content-Security-Policy. !important keeps the original inline precedence. */
.u1{position:absolute !important}
.u2{background:var(--soft-violet) !important}
.u3{stroke:currentColor !important}
.u4{left:31.0% !important;top:17.1% !important}
.u5{left:69.0% !important;top:17.1% !important}
.u6{left:88.0% !important;top:50.0% !important}
.u7{left:69.0% !important;top:82.9% !important}
.u8{left:31.0% !important;top:82.9% !important}
.u31{left:12.0% !important;top:50.0% !important}
.u9{left:50% !important;top:6.5% !important;animation-delay:0.0s !important}
.u10{left:88% !important;top:6.5% !important;animation-delay:0.7s !important}
.u11{left:91% !important;top:24% !important;animation-delay:1.4s !important}
.u12{left:91% !important;top:76% !important;animation-delay:2.1s !important}
.u13{left:50% !important;top:93.5% !important;animation-delay:2.8s !important}
.u14{left:9% !important;top:76% !important;animation-delay:3.5s !important}
.u15{left:9% !important;top:24% !important;animation-delay:4.2s !important}
.u18{width:52px !important;height:13px !important}
.u19{width:52px !important;height:21px !important}
.u20{justify-content:center !important;margin-top:28px !important}
.u21{margin-top:18px !important;font-size:clamp(2.1rem,4.4vw,3.3rem) !important;line-height:1.06 !important}
.u22{margin-left:auto !important;color:var(--violet-text) !important}
.u23{flex-wrap:wrap !important}
.u24{width:48px !important}
.u25{text-align:right !important}
.u26{margin-top:14px !important}
.u27{margin-top:18px !important;font-size:clamp(2rem,4.2vw,3rem) !important;line-height:1.1 !important}
.u28{margin-top:28px !important;max-width:480px !important}
.u29{width:16px !important;height:16px !important}
.u30{margin-bottom:18px !important}

/* 404 page (public/404.html). It reuses the site's header, hero and footer; only the pieces below are new. */
.skip-link{ position:absolute; left:12px; top:-72px; z-index:100; background: var(--card); color: var(--navy); padding:.7em 1.1em; border:1.5px solid var(--brand-blue); border-radius: var(--radius-sm); font-family: var(--font-display); font-weight:600; text-decoration:none; }
.skip-link:focus{ top:12px; }
.nf-page{ min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; }
.nf-page main{ flex:1; display:flex; flex-direction:column; }
.nf-page .hero{ flex:1; display:flex; align-items:center; }
.nf-page .hero > .wrap{ width:100%; }
.nf-grid{ position:relative; display:grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px,5vw,64px); align-items:center; }
.nf-grid > *{ min-width:0; }
.nf-code{ margin:0; font-family: var(--font-mono); font-size:.8rem; font-weight:600; letter-spacing:.12em; color: var(--violet-text); }
.nf h1{ margin-top:14px; font-size: clamp(2.2rem, 4.8vw, 3.4rem); line-height:1.08; }
.nf .hero-cta{ margin-top:28px; }
.nf-apps-card{ background: var(--card); border:1px solid var(--cloud-line); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: clamp(20px,3vw,30px); }
.nf-h2{ font-size:1.05rem; margin-bottom:16px; }
.nf-apps{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.nf-app{ display:flex; align-items:center; gap:12px; min-height:64px; padding:10px 14px; border:1px solid var(--cloud-line); border-radius: var(--radius-sm); background: var(--cloud); color: var(--navy); text-decoration:none; font-family: var(--font-display); font-weight:600; font-size:.95rem; transition: border-color .15s ease, box-shadow .15s ease; }
.nf-app:hover{ border-color: var(--brand-blue); box-shadow: var(--shadow-card); }
.nf-app img{ width:44px; height:44px; flex:none; display:block; object-fit:contain; }
@media (max-width: 900px){ .nf-grid{ grid-template-columns: 1fr; } }
.nf-go{ margin-left:auto; flex:none; width:18px; height:18px; stroke: currentColor; color: var(--navy-faint); }
.nf-app:hover .nf-go{ color: var(--brand-blue); }

/* ===== six-app update: BEGIN (generated block, replaced as a whole by the build) ===== */

/* ---------- per-app accents: a marker colour for each app, never the only signal (every status also has words and a shape) ---------- */
:root{
  --app-local:#2563c9; --app-commerce:#0f766e; --app-studio:#6d3fc9; --app-liveads:#be2a5b; --app-books:#8a5a00;
  --app-agents:linear-gradient(90deg,#00a6d6,#7a3cff);
}
[data-app="local"]{ --app:var(--app-local); }
[data-app="commerce"]{ --app:var(--app-commerce); }
[data-app="studio"]{ --app:var(--app-studio); }
[data-app="liveads"]{ --app:var(--app-liveads); }
[data-app="books"]{ --app:var(--app-books); }
[data-app="agents"]{ --app:#0a7fb0; --app-bar:var(--app-agents); }
.app-card[data-app]{ border-top:4px solid var(--app); }
.app-card[data-app="agents"]{ border-top:0; position:relative; }
.app-card[data-app="agents"]::before{ content:""; position:absolute; left:0; right:0; top:0; height:4px; border-radius:var(--radius-lg) var(--radius-lg) 0 0; background:var(--app-agents); }

/* ---------- skip link ---------- */
.skip-link{ z-index:120; }

/* ---------- Apps menu (a native disclosure: works without script, and on the 404 page) ---------- */
.apps-menu{ position:relative; }
.apps-menu > summary{ list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:7px; font-size:.92rem; font-weight:500; color:var(--navy-mut); padding:6px 4px; border-radius:6px; }
.apps-menu > summary::-webkit-details-marker{ display:none; }
.apps-menu > summary::after{ content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; rotate:45deg; margin-top:-3px; transition:rotate .15s ease, margin .15s ease; }
.apps-menu[open] > summary::after{ rotate:-135deg; margin-top:3px; }
.apps-menu > summary:hover, .apps-menu[open] > summary{ color:var(--navy); }
.apps-menu__panel{ position:absolute; top:calc(100% + 12px); left:-16px; width:min(392px, calc(100vw - 24px)); background:var(--card); border:1px solid var(--cloud-line); border-radius:var(--radius); box-shadow:var(--shadow-pop); padding:8px; z-index:70; }
.apps-menu__list{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.navlinks .apps-menu__list a:not(.btn){ display:flex; align-items:center; gap:12px; padding:9px 10px; border-radius:10px; color:var(--navy); text-decoration:none; font-size:.92rem; }
.navlinks .apps-menu__list a:not(.btn):hover{ background:var(--ice); color:var(--navy); }
.navlinks .apps-menu__list a[aria-current="page"]{ background:var(--ice); box-shadow:inset 3px 0 0 var(--brand-blue); }
.apps-menu__list img{ width:28px; height:28px; flex:none; object-fit:contain; }
.apps-menu__text{ display:flex; flex-direction:column; min-width:0; }
.apps-menu__name{ font-family:var(--font-display); font-weight:600; font-size:.95rem; line-height:1.25; }
.apps-menu__status{ font-size:.78rem; color:var(--navy-faint); line-height:1.3; }
.navlinks a.apps-menu__all:not(.btn){ display:block; margin:6px 4px 2px; padding:10px 8px 6px; border-top:1px solid var(--cloud-line); font-size:.86rem; font-weight:600; color:#215bc7; text-align:center; }
@media (max-width:720px){
  .apps-menu{ position:static; }
  .apps-menu__panel{ left:12px; right:12px; width:auto; top:100%; margin-top:0; }
  .nav .wrap{ gap:10px; }
  .navlinks{ gap:12px; }
  .navlinks .btn{ padding:.62em 1em; font-size:.84rem; }
}
@media (max-width:380px){ .navlinks .btn{ padding:.58em .8em; font-size:.8rem; } .brand img{ height:26px; } }
@media (prefers-reduced-motion: reduce){ .apps-menu > summary::after{ transition:none; } }

/* ---------- status badges: text label + shape + colour ---------- */
.badge{ display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.02em; line-height:1.2; padding:.4em .8em; border-radius:999px; border:1px solid transparent; white-space:normal; }
.badge-dot{ width:9px; height:9px; flex:none; box-sizing:border-box; display:inline-block; }
.badge--internal{ color:#0b5e45; background:#e6f5ef; border-color:#bfe3d3; }
.badge--internal .badge-dot{ background:currentColor; border-radius:50%; }
.badge--beta{ color:#4b3aa8; background:#efeafd; border-color:#cfc3f5; }
.badge--beta .badge-dot{ background:currentColor; border-radius:50%; box-shadow:0 0 0 2px #efeafd, 0 0 0 3.5px currentColor; margin-right:2px; }
.badge--proto{ color:#1f4fb0; background:#e6eefc; border-color:#c3d5f6; }
.badge--proto .badge-dot{ background:currentColor; rotate:45deg; border-radius:2px; width:8px; height:8px; }
.badge--testing{ color:#7a4b00; background:#fdf1dc; border-color:#f0d39f; }
.badge--testing .badge-dot{ border:1.8px solid currentColor; border-radius:50%; background:linear-gradient(90deg,currentColor 50%,transparent 50%); }
.badge--dev{ color:#17566f; background:#e4f2f8; border-color:#b9dcea; }
.badge--dev .badge-dot{ background:currentColor; clip-path:polygon(50% 0,100% 100%,0 100%); }
.badge--planned{ color:#47506f; background:#eef1f6; border-color:#d3d9e6; }
.badge--planned .badge-dot{ border:1.8px solid currentColor; border-radius:50%; background:transparent; }
.badge--none{ color:#47506f; background:var(--card); border:1px dashed #aab5cc; }
.badge--none .badge-dot{ border:1.8px dashed currentColor; border-radius:50%; background:transparent; }
.tag-cond{ display:inline-block; font-family:var(--font-mono); font-size:.7rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:#7a4b00; background:#fdf1dc; border:1px solid #f0d39f; border-radius:6px; padding:1px 6px; margin-left:4px; vertical-align:1px; white-space:nowrap; }

/* ---------- home: app cards ---------- */
.app-card .app-state{ margin-top:12px; font-size:.84rem; line-height:1.5; color:var(--navy); background:var(--cloud); border:1px solid var(--cloud-line); border-radius:var(--radius-sm); padding:8px 10px; }
.app-card .app-top{ gap:10px; flex-wrap:wrap; }
.app-card .app-head{ font-weight:500; font-size:.95rem; line-height:1.5; }
.app-card .app-link{ margin-top:auto; padding-top:14px; }
.home-note{ margin-top:22px; max-width:70ch; font-size:.9rem; color:var(--navy-mut); }

/* ---------- product pages: shared blocks ---------- */
.page-status{ margin-top:18px; display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.who-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:start; }
.who-grid h2, .who-grid h3{ font-size:clamp(1.4rem,2.8vw,1.9rem); }
.who-grid p{ margin-top:14px; font-size:1rem; line-height:1.68; color:var(--navy-mut); max-width:58ch; }
.who-list{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px; }
.who-list li{ display:grid; grid-template-columns:22px 1fr; gap:12px; font-size:.98rem; line-height:1.6; color:var(--navy-mut); }
.who-list .ic{ width:20px; height:20px; margin-top:2px; color:var(--brand-blue); }
.cap-card .badge{ margin-top:14px; }
.cap-card h3{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.cap-grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.stat-cols--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.stat-col .st-note{ margin-top:8px; font-size:.84rem; color:var(--navy-faint); line-height:1.5; }
.stat-col--empty li{ color:var(--navy-faint); }
.limits{ list-style:none; margin:clamp(20px,3vw,32px) 0 0; padding:0; display:grid; gap:12px; max-width:860px; }
.limits li{ display:grid; grid-template-columns:24px 1fr; gap:12px; align-items:start; background:var(--card); border:1px solid var(--cloud-line); border-radius:var(--radius); padding:14px 16px; font-size:.96rem; line-height:1.6; color:var(--navy); }
.limits .ic{ width:20px; height:20px; margin-top:2px; color:var(--navy-faint); }
.rel-grid{ margin-top:clamp(24px,4vw,40px); display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:18px; }
.rel-card{ background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow-card); padding:18px 20px; display:flex; flex-direction:column; gap:8px; border-top:4px solid var(--app, var(--brand-blue)); }
.rel-card h3{ font-size:1.02rem; }
.rel-card p{ font-size:.9rem; color:var(--navy-mut); line-height:1.55; }
.rel-card .app-link{ margin-top:auto; padding-top:6px; }
.rel-card[data-app="agents"]{ border-top-color:#0a7fb0; }
.pr-plans--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.pr-banner{ margin-top:16px; font-size:.92rem; color:var(--navy); background:rgba(53,120,229,.08); border:1px solid rgba(53,120,229,.28); border-radius:var(--radius-sm); padding:10px 14px; max-width:78ch; }
.pr-banner strong{ font-weight:700; }
.pr-plan .pr-sub{ font-size:.84rem; color:var(--navy-faint); margin-top:-2px; }
.pr-plan .pr-limits{ display:grid; gap:6px; font-size:.9rem; color:var(--navy); margin:2px 0 0; padding:12px 0 0; border-top:1px solid var(--cloud-line); }
.pr-plan .pr-limits div{ display:flex; justify-content:space-between; gap:10px; }
.pr-plan .pr-limits dt, .pr-plan .pr-limits dd{ margin:0; }
.pr-plan .pr-limits dd{ font-weight:600; font-variant-numeric:tabular-nums; }
.pr-plan .pr-best{ font-size:.88rem; color:var(--navy-mut); line-height:1.5; }
.pr-plan .pr-value{ font-size:.88rem; font-weight:600; color:var(--navy); line-height:1.5; }
.pr-plan .pr-ok{ margin-top:2px; }
.pr-founding{ margin-top:clamp(24px,3.5vw,36px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(20px,3vw,40px); background:var(--card); border:1.5px solid transparent; background-image:linear-gradient(var(--card),var(--card)), var(--gradient); background-origin:border-box; background-clip:padding-box,border-box; border-radius:var(--radius-lg); padding:clamp(22px,3.4vw,38px); box-shadow:var(--shadow-card); }
.pr-founding h3{ font-size:clamp(1.3rem,2.6vw,1.7rem); margin-top:10px; }
.pr-founding ul{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:9px; font-size:.92rem; color:var(--navy); }
.pr-founding li{ display:flex; gap:9px; align-items:flex-start; }
.pr-founding .pr-price{ margin-block:10px 4px; }
.defs{ margin-top:clamp(20px,3vw,32px); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 40px; max-width:1040px; }
.defs h3{ font-size:1.02rem; margin-bottom:8px; }
.defs ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:.92rem; color:var(--navy); line-height:1.55; }
.defs li{ display:flex; gap:9px; align-items:flex-start; }
.defs li::before{ content:""; flex:none; width:6px; height:6px; border-radius:50%; background:#9fb2d6; margin-top:.6em; }
.defs table{ border-collapse:collapse; margin-top:10px; font-size:.92rem; }
.defs th, .defs td{ text-align:left; padding:8px 14px 8px 0; border-bottom:1px solid var(--cloud-line); }
.defs td:last-child{ font-weight:700; font-variant-numeric:tabular-nums; }
.addon-grid{ margin-top:clamp(20px,3vw,32px); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.addon-card{ background:var(--card); border:1.5px dashed rgba(118,103,232,.45); border-radius:var(--radius-lg); padding:clamp(20px,2.8vw,30px); display:flex; flex-direction:column; gap:10px; }
.addon-card h3{ font-size:1.18rem; }
.addon-card p{ font-size:.92rem; color:var(--navy-mut); line-height:1.6; }
.addon-card ul{ list-style:none; margin:4px 0 0; padding:0; display:grid; gap:8px; font-size:.9rem; color:var(--navy); }
.addon-card li{ display:flex; gap:9px; align-items:flex-start; }
.addon-card li::before{ content:""; flex:none; width:6px; height:6px; border-radius:50%; background:#9fb2d6; margin-top:.6em; }

/* ---------- six-app comparison ---------- */
.cmp-hint{ display:none; margin-top:14px; font-size:.86rem; color:var(--navy-mut); }
.cmp-hint::before{ content:""; display:inline-block; width:9px; height:9px; border-right:2px solid currentColor; border-top:2px solid currentColor; rotate:45deg; margin-right:8px; vertical-align:1px; }
.pr-tablewrap--cmp{ position:relative; }
.pr-tablewrap--cmp:focus-visible{ outline:2.5px solid var(--brand-blue); outline-offset:2px; }
.pr-table.cmp{ min-width:1104px; font-size:.86rem; }
.pr-table.cmp th, .pr-table.cmp td{ padding:12px 12px; }
.pr-table.cmp td{ text-align:left; min-width:150px; }
.pr-table.cmp thead th{ text-align:left; }
.pr-table.cmp thead th a{ display:flex; align-items:center; gap:8px; }
.pr-table.cmp thead th img{ width:22px; height:22px; flex:none; object-fit:contain; }
.pr-table.cmp tbody th{ min-width:150px; }
.pr-table.cmp .badge{ margin-bottom:6px; }
.pr-table.cmp .cmp-sub{ display:block; font-size:.82rem; color:var(--navy-mut); line-height:1.5; }
@media (max-width:1240px){ .cmp-hint{ display:block; } }

/* ---------- responsive ---------- */
@media (max-width:1100px){ .pr-plans--4{ grid-template-columns:repeat(2,minmax(0,1fr)); } .stat-cols--4{ grid-template-columns:repeat(2,minmax(0,1fr)); } .stat-cols--4 .stat-col:nth-child(3){ border-left:0; } .stat-cols--4 .stat-col:nth-child(n+3){ border-top:1px solid var(--cloud-line); } }
@media (max-width:920px){ .who-grid, .pr-founding, .defs, .addon-grid, .cap-grid--2{ grid-template-columns:1fr; } }
@media (max-width:760px){ .stat-cols--4{ grid-template-columns:1fr; } .stat-cols--4 .stat-col{ border-left:0 !important; } .stat-cols--4 .stat-col + .stat-col{ border-top:1px solid var(--cloud-line); } }
@media (max-width:640px){ .pr-plans--4{ grid-template-columns:1fr; } }

/* ---------- small helpers added with the six-app update ---------- */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.pr-cta h2{ font-size:1.1rem; }
.cmp-no{ color:var(--navy-faint); font-size:.84rem; }
.say{ background:var(--ice); border:1px solid var(--ice-line); border-radius:var(--radius); padding:14px 16px; }
.say + .say{ margin-top:2px; }
.say-lang{ font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--navy-faint); }
.say-text{ margin-top:6px; font-size:.92rem; line-height:1.6; color:var(--navy); }
.hero-visual--panel > .panel{ width:100%; margin-top:0; }
.fx-wrap{ margin-top:clamp(40px,6vw,72px); }
.pipe .pipe-badge{ margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; }
.pipe .pipe-badge .badge{ margin:0; }
.st--none{ color:var(--navy-faint); }
.st--internal{ color:#0b5e45; }
.st--proto{ color:#1f4fb0; }
.pr-tablewrap--small .pr-table{ min-width:560px; }
.pr-tablewrap--small .pr-table th, .pr-tablewrap--small .pr-table td{ text-align:left; }
.ch-logo--agents img{ width:28px; height:28px; object-fit:contain; }

/* ---------- home stage: six tiles on small screens ---------- */
@media (max-width:480px){
  .stage .tile{ min-width:0; padding:6px 7px 5px; gap:3px; font-size:.7rem; border-radius:12px; }
  .stage .tile img{ width:26px; }
  .stage .bubble{ width:10.5%; }
  .stage .tile--open::after{ font-size:.62rem; top:-8px; right:-6px; padding:0 5px; }
  .stage .core-mark{ width:36px; height:36px; bottom:-16px; }
  .stage .core-mark img{ width:24px; height:24px; }
}

/* ---------- pricing polish ---------- */
.pr-plans--4 .pr-price{ font-size:2.2rem; }
.pr-plans--4 .pr-unit{ margin-left:6px; }
.badge-row{ display:flex; flex-wrap:wrap; gap:8px; }
.addon-card .badge-row{ margin-bottom:2px; }
.pr-founding .btn{ margin-top:18px; }
.defs table + ul{ margin-top:18px; }

/* ===== six-app update: END ===== */

/* package cards: line up each row (title, price, button, limits, list, value) across the four cards where the browser supports subgrid */
@supports (grid-template-rows: subgrid){
  @media (min-width:1101px){
    .pr-plans--4{ align-items:stretch; }
    .pr-plans--4 .pr-plan{ display:grid; grid-row:span 10; grid-template-rows:subgrid; row-gap:10px; }
    .pr-plans--4 .pr-plan > .btn{ justify-self:start; }
  }
}

/* two package columns on tablets may use the full width (the base single-column rule caps the grid at 520px) */
@media (min-width:641px) and (max-width:900px){ .pr-plans--4{ max-width:none; } }

/* annual price under the monthly price on each package card */
.pr-plan .pr-annual{ font-size:.9rem; color:var(--navy); line-height:1.45; margin-top:-4px; }
.pr-plan .pr-annual strong{ font-weight:700; font-variant-numeric:tabular-nums; }
.pr-plan .pr-save{ display:inline-block; margin-left:4px; padding:2px 9px; border-radius:999px; font-size:.7rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; color:#0a5c3f; background:rgba(16,122,87,.1); border:1px solid rgba(16,122,87,.3); }

/* Local page package table: monthly and yearly price share one column so the table fits a phone */
.pr-table .tbl-m, .pr-table .tbl-y{ display:block; white-space:nowrap; font-variant-numeric:tabular-nums; }
.pr-table .tbl-y{ font-size:.86em; color:var(--navy-mut); }
.pr-table .tbl-m strong, .pr-table .tbl-y strong{ font-weight:700; color:var(--navy); }

/* the Local page package table can scroll sideways on a phone: a labelled, focusable region with a cue, like the comparison */
.pr-hint-small{ display:none; margin-top:14px; font-size:.86rem; color:var(--navy-mut); }
.pr-hint-small::before{ content:""; display:inline-block; width:9px; height:9px; border-right:2px solid currentColor; border-top:2px solid currentColor; rotate:45deg; margin-right:8px; vertical-align:1px; }
@media (max-width:620px){ .pr-hint-small{ display:block; } }
.pr-tablewrap--small:focus-visible{ outline:2.5px solid var(--brand-blue); outline-offset:2px; }