/* Solution sites (rice.profezzo.com, lims.profezzo.com) — templates/includes/solution_page.html.
   Profezzo's own tokens (profezzo-brand.css): deep teal ink leads, red is a small accent.
   Split-tone headings, a product screen in the hero, quiet motion that stops for reduced-motion users. */

body.sol{ background:#fff; }
.sol{ --s-ink:#001f1f; --s-ink2:#0b3533; --s-mute:#5b6e6d; --s-faint:#8a9a99; --s-line:rgba(0,31,31,.09);
  --s-tint:#f6f8f7; --s-deep:#062b29; --s-red:#ce1117; --s-soft:#e9efed; --s-ok:#0f7a43; --s-warn:#b35c00; }

.draft-bar{ background:#fff4d6; color:#5c4300; border-bottom:1px solid #ecd59a; font-size:13px; text-align:center; padding:8px 16px; }
.s-wrap{ max-width:1180px; margin:0 auto; padding-inline:24px; }
.s-sec{ padding-block:104px; position:relative; }
.s-tint{ background:var(--s-tint); }
.s-eye{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--s-faint); margin:0 0 16px; font-weight:500; }
.s-eye a{ color:inherit; text-decoration:underline; text-underline-offset:3px; }
.sol h1, .sol h2{ font-family:Poppins, sans-serif; color:var(--s-ink); letter-spacing:-.025em; text-wrap:balance; margin:0; }
.sol h2{ font-size:clamp(30px,3.6vw,44px); line-height:1.12; font-weight:600; }
.sol h2.big{ font-size:clamp(34px,4.2vw,52px); line-height:1.06; font-weight:300; }
.sol h2.big b{ font-weight:600; }
.sol .lite{ font-weight:300; color:var(--s-faint); }
.sol h2.big .lite{ color:var(--s-mute); }
.sol .acc{ color:var(--s-ink2); font-weight:600; background:linear-gradient(transparent 70%, rgba(206,17,23,.16) 70%); }
.sol h3{ font-family:Poppins, sans-serif; color:var(--s-ink); margin:0; }
.s-lead{ font-size:17.5px; line-height:1.7; color:var(--s-mute); font-weight:300; max-width:56ch; margin:22px 0 0; }
.s-lead.sm{ font-size:16px; margin:18px 0 26px; }
.s-note{ font-size:12px; color:var(--s-faint); margin:12px 0 0; }
.s-note.c{ text-align:center; margin-top:28px; }

/* buttons */
.s-btn{ display:inline-flex; align-items:center; gap:10px; padding:14px 22px; border-radius:10px; font-weight:500; font-size:15px; text-decoration:none; transition:transform .2s, box-shadow .2s, background .2s; }
.s-btn-dark{ background:var(--s-ink); color:#fff !important; box-shadow:0 10px 28px -12px rgba(0,31,31,.55); }
.s-btn-dark:hover{ transform:translateY(-2px); background:var(--s-ink2); }
.s-btn-ghost{ color:var(--s-ink) !important; padding-inline:6px; }
.s-btn-ghost:hover{ text-decoration:underline; text-underline-offset:4px; }
.s-btn-line{ border:1px solid var(--s-line); color:var(--s-ink) !important; background:#fff; justify-content:center; }
.s-btn-line:hover{ border-color:var(--s-ink); }
.s-btn-light{ background:#fff; color:var(--s-ink) !important; margin-top:40px; }
.s-play{ display:inline-grid; place-items:center; width:30px; height:30px; border-radius:50%; border:1px solid var(--s-line); font-size:10px; }

.pill{ display:inline-block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--s-ink2); background:var(--s-soft); border-radius:999px; padding:4px 10px; }
.pill.lg{ font-size:12px; text-transform:none; letter-spacing:0; padding:6px 12px; margin-bottom:22px; border:1px solid var(--s-line); background:#fff; }
.pill.red{ background:var(--s-red); color:#fff; }
.pill.dk{ background:rgba(255,255,255,.08); color:#cfe0de; border:1px solid rgba(255,255,255,.14); text-transform:none; letter-spacing:0; font-size:12px; margin-bottom:22px; }
.ic{ display:inline-grid; place-items:center; width:36px; height:36px; border-radius:10px; border:1px solid var(--s-line); color:var(--s-ink2); background:#fff; flex:none; }
.ic.sq{ background:var(--s-ink); color:#fff; border:0; }

/* hero */
.s-hero{ padding:72px 0 96px; background:#fff; position:relative; overflow:hidden; }
.s-hero::before{ content:""; position:absolute; inset:0; background:var(--tex-grid); opacity:.55;
  -webkit-mask:linear-gradient(180deg,#000,transparent 85%); mask:linear-gradient(180deg,#000,transparent 85%); pointer-events:none; }
.s-hero-grid{ position:relative; display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:56px; align-items:center; }
.s-hero h1{ font-size:clamp(36px,4.6vw,58px); line-height:1.04; font-weight:600; }
.s-hero h1 .lite{ font-weight:300; color:var(--s-mute); }
.s-ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; margin-top:32px; }
.s-trust{ list-style:none; margin:30px 0 0; padding:22px 0 0; border-top:1px solid var(--s-line); display:flex; flex-wrap:wrap; gap:8px 22px; font-size:13px; color:var(--s-mute); }
.s-trust li::before{ content:"✓"; color:var(--s-red); font-weight:700; margin-right:6px; }
.s-hero-shot{ margin-right:-140px; min-width:0; position:relative; }

/* the product screen */
.app{ position:relative; display:grid; grid-template-columns:150px minmax(0,1fr); background:#fff; border:1px solid var(--s-line); border-radius:16px;
  box-shadow:0 40px 90px -40px rgba(0,31,31,.45); overflow:hidden; font-size:12.5px; }
.app-side{ background:var(--s-tint); border-right:1px solid var(--s-line); padding:14px 10px; display:grid; align-content:start; gap:2px; }
.app-brand{ display:flex; align-items:center; gap:7px; font-weight:600; color:var(--s-ink); padding:4px 8px 12px; font-size:13px; }
.app-brand .dot{ width:10px; height:10px; border-radius:3px; background:var(--s-red); }
.app-nav{ padding:7px 8px; border-radius:7px; color:var(--s-mute); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-nav.on{ background:#fff; color:var(--s-ink); font-weight:600; box-shadow:0 1px 2px rgba(0,31,31,.08); }
.app-main{ padding:16px; display:grid; gap:12px; min-width:0; }
.app-top{ display:flex; justify-content:space-between; align-items:center; }
.app-top b{ font-size:14px; color:var(--s-ink); }
.live{ display:inline-flex; align-items:center; gap:6px; font-size:11px; color:var(--s-ok); font-weight:600; }
.live i{ width:7px; height:7px; border-radius:50%; background:var(--s-ok); position:relative; }
.live i::after{ content:""; position:absolute; inset:0; border-radius:50%; background:var(--s-ok); animation:s-ping 1.8s infinite; }
.app-kpis{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.kpi{ border:1px solid var(--s-line); border-radius:10px; padding:10px; display:grid; gap:2px; min-width:0; }
.kpi-l{ font-size:10.5px; color:var(--s-faint); text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpi-v{ font-size:19px; color:var(--s-ink); font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.kpi-v.ok{ color:var(--s-ok); } .kpi-v.warn{ color:var(--s-warn); } .kpi-v.bad{ color:var(--s-red); }
.kpi-n{ font-size:10.5px; color:var(--s-mute); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-card{ border:1px solid var(--s-line); border-radius:10px; overflow:hidden; }
.app-card-h{ padding:9px 12px; font-weight:600; color:var(--s-ink); border-bottom:1px solid var(--s-line); background:var(--s-tint); }
.t{ width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.t th{ text-align:left; font-weight:500; color:var(--s-faint); font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; padding:8px 10px; white-space:nowrap; }
.t td{ padding:8px 10px; border-top:1px solid var(--s-line); color:var(--s-ink); white-space:nowrap; }
.t .n{ text-align:right; }
.t .ok{ color:var(--s-ok); font-weight:600; } .t .warn{ color:var(--s-warn); font-weight:600; } .t .bad{ color:var(--s-red); font-weight:600; }
.t tr.cyc td{ transition:background .5s; }
.t tr.cyc.now td{ background:rgba(206,17,23,.05); }
.toast{ position:absolute; left:-34px; bottom:6px; z-index:2; display:flex; gap:10px; align-items:flex-start; background:var(--s-ink); color:#e8f1f0; border-radius:12px; padding:11px 14px;
  box-shadow:0 18px 40px -16px rgba(0,0,0,.5); max-width:250px; opacity:0; transform:translateY(12px); transition:opacity .5s, transform .5s; }
.toast.show{ opacity:1; transform:none; }
.toast i{ width:8px; height:8px; border-radius:50%; background:#ff6b6f; margin-top:5px; flex:none; animation:s-pulse 1.6s infinite; }
.toast b{ display:block; font-size:12.5px; } .toast span{ font-size:11.5px; color:#b3c6c4; }

/* two columns */
.s-two{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:start; }
.s-pains{ list-style:none; margin:0; padding:0; border-top:1px solid var(--s-line); }
.s-pains li{ padding:18px 0 18px 34px; border-bottom:1px solid var(--s-line); color:var(--s-mute); line-height:1.6; position:relative; }
.s-pains li::before{ content:"×"; position:absolute; left:4px; top:15px; color:var(--s-red); font-size:20px; }

/* centred and split heads */
.s-head-c{ text-align:center; max-width:760px; margin:0 auto 56px; }
.s-head-c p:not(.s-eye){ color:var(--s-mute); font-weight:300; font-size:17px; line-height:1.65; margin:18px auto 0; max-width:60ch; }
.s-head-split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:end; margin-bottom:40px; }
.s-head-split > p{ color:var(--s-mute); font-weight:300; font-size:16.5px; line-height:1.7; margin:0; }
.s-head-l{ max-width:720px; margin-bottom:48px; }
.s-head-l p:not(.s-eye){ color:var(--s-mute); font-weight:300; font-size:16.5px; line-height:1.7; margin:18px 0 0; }

/* work cards with an animated sample */
.s-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.s-card{ background:#fff; border:1px solid var(--s-line); border-radius:16px; overflow:hidden; }
.s-card-art{ position:relative; height:240px; background:var(--s-tint); background-image:var(--tex-grid); padding:26px 0 0 26px; overflow:hidden; border-bottom:1px solid var(--s-line); }
.mini{ background:#fff; border:1px solid var(--s-line); border-radius:12px 0 0 0; box-shadow:0 20px 40px -24px rgba(0,31,31,.4); font-size:12px; height:100%; overflow:hidden; }
.mini .t tr.hl td{ font-weight:600; box-shadow:inset 0 0 0 9999px rgba(206,17,23,.04); }
.mini .t tr.hl td:first-child{ box-shadow:inset 3px 0 0 var(--s-red), inset 0 0 0 9999px rgba(206,17,23,.04); }
.s-card-body{ padding:22px 24px 26px; }
.s-card-body h3{ font-size:19px; margin:12px 0 8px; font-weight:600; }
.s-card-body p{ margin:0; color:var(--s-mute); font-weight:300; line-height:1.65; font-size:15px; }
.badge{ position:absolute; left:44%; top:50%; background:var(--s-ink); color:#fff; border-radius:12px; padding:10px 16px; text-align:center;
  box-shadow:0 16px 32px -14px rgba(0,0,0,.55); opacity:0; transform:scale(.85) translateY(8px); }
.badge b{ display:block; font-size:22px; line-height:1.1; letter-spacing:-.02em; } .badge span{ font-size:11.5px; color:#b3c6c4; }
.cursor{ position:absolute; width:18px; height:18px; left:78%; top:88%; opacity:0;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3l14 7-6 2-2 6z' fill='%23001f1f' stroke='%23fff' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.s-card.in .cursor{ animation:s-cursor 5.5s ease-in-out infinite; }
.s-card.in .badge{ animation:s-badge 5.5s ease-in-out infinite; }
.s-card:nth-child(2).in .cursor, .s-card:nth-child(2).in .badge{ animation-delay:.7s; }
.s-card:nth-child(3).in .cursor, .s-card:nth-child(3).in .badge{ animation-delay:1.4s; }
.s-card:nth-child(4).in .cursor, .s-card:nth-child(4).in .badge{ animation-delay:2.1s; }

/* one flow */
.flowbox{ border:1px solid var(--s-line); border-radius:18px; padding:22px; background:#fff; }
.flow-label{ margin:0 0 14px 4px; font-size:13.5px; color:var(--s-faint); } .flow-label b{ color:var(--s-ink); margin-right:6px; }
.flow2{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.flow2 li{ display:flex; gap:12px; align-items:flex-start; padding:16px; border-radius:12px; background:var(--s-tint); border:1px solid var(--s-line); min-width:0;
  transition:background .5s, border-color .5s, box-shadow .3s; position:relative; }
.flow2 .fi{ display:grid; place-items:center; width:34px; height:34px; border-radius:9px; background:#fff; color:var(--s-ink2); flex:none; transition:background .5s, color .5s; }
.flow2 .fk{ display:block; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--s-faint); margin-bottom:3px; }
.flow2 .fk em{ font-style:normal; text-transform:none; letter-spacing:0; background:var(--s-soft); color:var(--s-ink2); border-radius:999px; padding:1px 7px; margin-left:4px; }
.flow2 b{ display:block; font-size:14.5px; color:var(--s-ink); }
.flow2 .fs{ display:block; font-size:12.5px; color:var(--s-mute); line-height:1.45; margin-top:2px; }
.flow2 li.on{ background:var(--s-deep); border-color:var(--s-deep); }
.flow2 li.on .fi{ background:rgba(255,255,255,.1); color:#fff; }
.flow2 li.on b{ color:#fff; } .flow2 li.on .fk{ color:#9fb8b5; } .flow2 li.on .fs{ color:#c5d6d4; }
.flow2 li.on .fk em{ background:rgba(255,255,255,.12); color:#e3eeec; }
.flow2 li.cur{ box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--s-red); }
.s-box{ margin-top:56px; padding-top:36px; border-top:1px solid var(--s-line); }
.s-box-cols{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.s-box-cols h3{ font-size:15px; font-weight:600; display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.s-box-cols h3 i{ width:7px; height:7px; border-radius:50%; background:var(--s-red); }
.s-box-cols ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; color:var(--s-mute); font-weight:300; font-size:15px; }
.s-box-also{ margin:26px 0 0; font-size:14px; color:var(--s-mute); font-weight:300; } .s-box-also b{ font-weight:600; color:var(--s-ink); }

/* dark band: where to start */
.s-dark{ background:#0a1312; color:#d9e4e2; overflow:hidden; }
.s-dark::before{ content:""; position:absolute; inset:0; background:var(--tex-hex-light); opacity:.6; pointer-events:none; }
.s-dark .s-wrap{ position:relative; }
.s-dark h2{ color:#f1f6f5; } .s-dark .lite{ color:#7f9896; } .s-dark .s-eye{ color:#7f9896; } .s-dark .s-head-l p:not(.s-eye){ color:#a9bdbb; }
.s-steps{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.s-step{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:26px; transition:transform .3s, background .3s; }
.s-step:hover{ transform:translateY(-4px); background:rgba(255,255,255,.07); }
.s-step-tag{ display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#cfe0de; border:1px solid rgba(255,255,255,.16); border-radius:999px; padding:4px 10px 4px 4px; }
.s-step-tag i{ font-style:normal; width:20px; height:20px; border-radius:50%; background:#fff; color:#0a1312; display:grid; place-items:center; font-size:10.5px; font-weight:700; letter-spacing:0; }
.s-step h3{ color:#fff; font-size:20px; font-weight:600; margin:18px 0 10px; }
.s-step p{ color:#a9bdbb; font-weight:300; line-height:1.65; margin:0; }

/* assistant */
.s-assist{ align-items:center; }
.s-modes{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 26px; }
.s-modes > div{ display:flex; gap:14px; }
.s-modes b{ display:block; font-size:15px; color:var(--s-ink); margin-bottom:3px; }
.s-modes span:not(.ic){ font-size:14px; color:var(--s-mute); font-weight:300; line-height:1.55; }
.s-safe{ display:flex; align-items:center; gap:8px; color:var(--s-mute); font-size:13.5px; margin:26px 0 0; }
.chat2{ border:1px solid var(--s-line); border-radius:18px; background:#fff; box-shadow:0 40px 80px -44px rgba(0,31,31,.5); overflow:hidden; }
.chat2-h{ display:flex; align-items:center; gap:12px; padding:14px 16px; border-bottom:1px solid var(--s-line); background:var(--s-tint); }
.chat2-h b{ display:block; font-size:14px; color:var(--s-ink); }
.chat2-h span:not(.ic){ font-size:11.5px; color:var(--s-ok); display:flex; align-items:center; gap:5px; }
.chat2-h span i{ width:6px; height:6px; border-radius:50%; background:var(--s-ok); }
.chat2-h em{ margin-left:auto; font-style:normal; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--s-ink2); background:var(--s-soft); border-radius:999px; padding:3px 9px; }
.chat2-b{ padding:20px 16px; display:grid; gap:12px; min-height:300px; align-content:start; }
.chat2 .m{ max-width:86%; padding:11px 14px; border-radius:14px; font-size:14px; line-height:1.5; }
.chat2 .m.me{ justify-self:end; background:var(--s-ink); color:#eef5f4; border-bottom-right-radius:4px; min-height:20px; }
.chat2 .m.it{ background:var(--s-tint); color:var(--s-ink); border:1px solid var(--s-line); border-bottom-left-radius:4px; transition:opacity .5s, transform .5s; }
.chat2 dl{ display:grid; grid-template-columns:auto 1fr; gap:4px 14px; margin:10px 0; font-size:13px; }
.chat2 dt{ color:var(--s-faint); } .chat2 dd{ margin:0; font-weight:600; }
.chat2 .acts{ display:flex; gap:8px; }
.chat2 .acts span{ font-size:12px; padding:5px 12px; border-radius:999px; border:1px solid var(--s-line); background:#fff; }
.chat2 .acts span:first-child{ background:var(--s-ink); color:#fff; border-color:var(--s-ink); }
.chat2-in{ margin:0 14px 14px; display:flex; align-items:center; justify-content:space-between; border:1px solid var(--s-line); border-radius:12px; padding:10px 10px 10px 14px; color:var(--s-faint); font-size:13.5px; }
.chat2-in i{ font-style:normal; width:26px; height:26px; border-radius:50%; background:var(--s-ink); color:#fff; display:grid; place-items:center; font-size:13px; }
.pz-js .chat2:not(.played) .m.it{ opacity:0; transform:translateY(8px); }
.chat2 .m.me.typing::after{ content:"▍"; animation:s-blink 1s steps(1) infinite; margin-left:1px; }

/* numbers */
.s-nums{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.s-num{ background:#fff; border:1px solid var(--s-line); border-radius:16px; padding:26px; }
.s-num h3{ font-size:19px; font-weight:600; margin:18px 0 8px; }
.s-num p{ color:var(--s-mute); font-weight:300; line-height:1.65; margin:0 0 18px; padding-bottom:18px; border-bottom:1px solid var(--s-line); font-size:15px; }
.s-num ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:14px; color:var(--s-ink); }
.s-num li::before{ content:"✓"; color:var(--s-ink2); margin-right:10px; font-size:12px; }
.s-notes{ margin-top:20px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--s-line); border-radius:16px; background:#fff; }
.s-notes > div{ display:flex; gap:14px; padding:20px 22px; }
.s-notes > div + div{ border-left:1px solid var(--s-line); }
.s-notes b{ display:block; font-size:14.5px; color:var(--s-ink); margin-bottom:3px; }
.s-notes span:not(.ic){ font-size:13.5px; color:var(--s-mute); font-weight:300; line-height:1.55; }

/* built around you */
.s-fit{ list-style:none; margin:0; padding:0; border-top:1px solid var(--s-line); }
.s-fit li{ display:flex; gap:18px; padding:24px 0; border-bottom:1px solid var(--s-line); }
.s-fit .no{ font-size:12px; color:var(--s-faint); margin-right:8px; }
.s-fit b{ font-size:17px; color:var(--s-ink); font-weight:600; }
.s-fit p{ margin:6px 0 0; color:var(--s-mute); font-weight:300; line-height:1.65; }

/* proof */
.s-proof{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:20px; max-width:1000px; margin:0 auto; }
.s-proof article{ background:#fff; border:1px solid var(--s-line); border-radius:16px; padding:26px; }
.s-proof h3{ font-size:19px; font-weight:600; margin:16px 0 8px; }
.s-proof p{ margin:0; color:var(--s-mute); font-weight:300; line-height:1.6; }
.s-proof a{ color:var(--s-ink2); }

/* customer logos from the Customer master */
.s-client .s-logo{ height:64px; display:flex; align-items:center; margin-bottom:18px; }
.s-client .s-logo img{ max-height:56px; max-width:190px; width:auto; object-fit:contain; }
.s-client .s-logo b{ font-size:18px; color:var(--s-ink); }
.pill.ok{ background:#e3f3ea; color:var(--s-ok); }
.pill.ghost{ visibility:hidden; }

/* your data */
.s-deep{ background:var(--s-deep); }
.s-deep h2{ color:#f1f6f5; } .s-deep h2 .acc2{ color:#8fb3ae; } .s-deep .s-lead{ color:#a9bdbb; }
.s-data{ list-style:none; margin:0; padding:0; border-top:1px solid rgba(255,255,255,.1); }
.s-data li{ display:flex; gap:18px; padding:22px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.s-data .ic{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.14); color:#cfe0de; }
.s-data b{ display:block; color:#f1f6f5; font-size:16.5px; font-weight:600; margin-bottom:4px; }
.s-data span:not(.ic){ color:#a9bdbb; font-weight:300; line-height:1.6; }

/* plans */
.s-plans{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.s-plan{ background:#fff; border:1px solid var(--s-line); border-radius:18px; padding:28px; display:flex; flex-direction:column; gap:14px; }
.s-plan.main{ border:1.5px solid var(--s-ink); box-shadow:0 30px 70px -40px rgba(0,31,31,.5); }
.s-plan .pill{ align-self:flex-start; }
.s-plan h3{ font-size:22px; font-weight:600; }
.s-plan .price{ font-size:32px; font-weight:600; color:var(--s-ink); letter-spacing:-.02em; }
.s-plan .price small{ font-size:14px; font-weight:400; color:var(--s-mute); letter-spacing:0; }
.s-plan p{ margin:0; color:var(--s-mute); font-weight:300; line-height:1.6; }
.s-plan ul{ list-style:none; margin:0 0 6px; padding:14px 0 0; border-top:1px solid var(--s-line); display:grid; gap:9px; font-size:14.5px; color:var(--s-ink); }
.s-plan li::before{ content:"✓"; color:var(--s-ink2); margin-right:10px; font-size:12px; }
.s-plan .s-btn{ margin-top:auto; justify-content:center; }
.tbd{ background:#fff4d6; color:#5c4300; border-radius:6px; padding:0 6px; font-size:.8em; }
.s-care{ text-align:center; color:var(--s-mute); font-weight:300; margin:28px 0 0; } .s-care b{ color:var(--s-ink); font-weight:600; }

/* the AI layer inside a plan */
.s-ai{ background:var(--s-tint); border:1px solid var(--s-line); border-radius:12px; padding:14px 16px; margin-bottom:6px; }
.s-ai-tag{ display:inline-flex; align-items:center; gap:6px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--s-red); margin-bottom:10px; }
.s-ai-tag svg{ width:14px; height:14px; }
.s-ai ul{ list-style:none; margin:0; padding:0; border:0; display:grid; gap:7px; font-size:13.5px; color:var(--s-mute); }
.s-plan .s-ai li::before{ content:"✦"; color:var(--s-red); margin-right:8px; font-size:10px; }
.s-plan.main .s-ai{ background:#fbf3f3; border-color:rgba(206,17,23,.15); }

/* questions */
.s-faq{ max-width:820px; margin:0 auto; }
.s-faq details{ border-bottom:1px solid var(--s-line); }
.s-faq details:first-child{ border-top:1px solid var(--s-line); }
.s-faq summary{ cursor:pointer; list-style:none; padding:22px 40px 22px 0; font-size:17px; font-weight:500; color:var(--s-ink); position:relative; }
.s-faq summary::-webkit-details-marker{ display:none; }
.s-faq summary::after{ content:"+"; position:absolute; right:6px; top:18px; font-size:24px; font-weight:300; color:var(--s-ink2); transition:transform .3s; }
.s-faq details[open] summary::after{ transform:rotate(45deg); }
.s-faq details p{ margin:0 0 22px; color:var(--s-mute); font-weight:300; line-height:1.7; max-width:70ch; }

/* last step */
.s-end{ text-align:center; }
.s-end p{ color:var(--s-mute); font-weight:300; font-size:17px; margin:20px auto 30px; max-width:52ch; line-height:1.65; }

/* reveal on scroll (only when the script runs) */
.pz-js .rv{ opacity:0; transform:translateY(22px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.pz-js .rv.in{ opacity:1; transform:none; }

@keyframes s-ping{ 0%{ transform:scale(1); opacity:.7; } 80%,100%{ transform:scale(2.6); opacity:0; } }
@keyframes s-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
@keyframes s-blink{ 50%{ opacity:0; } }
@keyframes s-cursor{ 0%{ opacity:0; left:78%; top:88%; transform:none; } 12%{ opacity:1; } 40%{ left:40%; top:34%; transform:none; } 46%{ transform:scale(.8); } 52%{ transform:none; } 85%{ opacity:1; left:40%; top:34%; } 100%{ opacity:0; left:40%; top:34%; } }
@keyframes s-badge{ 0%,44%{ opacity:0; transform:scale(.85) translateY(8px); } 52%,88%{ opacity:1; transform:none; } 100%{ opacity:0; transform:scale(.95); } }

@media (prefers-reduced-motion: reduce){
  .pz-js .rv{ opacity:1; transform:none; transition:none; }
  .s-card .cursor{ display:none; } .s-card .badge{ opacity:1; transform:none; animation:none !important; }
  .live i::after, .toast i{ animation:none; }
  .pz-js .chat2:not(.played) .m.it{ opacity:1; transform:none; }
}

@media (max-width:1180px){ .s-hero-shot{ margin-right:-24px; } }
@media (max-width:980px){
  .s-sec{ padding-block:76px; }
  .s-hero-grid, .s-two, .s-head-split{ grid-template-columns:minmax(0,1fr); gap:40px; }
  .s-hero-shot{ margin-right:0; }
  .s-cards, .s-steps, .s-nums, .s-proof, .s-plans, .s-box-cols, .s-notes{ grid-template-columns:minmax(0,1fr); }
  .s-notes > div + div{ border-left:0; border-top:1px solid var(--s-line); }
  .flow2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .toast{ left:12px; bottom:-18px; }
}
@media (max-width:600px){
  .s-wrap{ padding-inline:16px; }
  .s-hero{ padding:44px 0 64px; }
  .app{ grid-template-columns:minmax(0,1fr); }
  .app-side{ display:none; }
  .app-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .flow2, .s-modes{ grid-template-columns:minmax(0,1fr); }
  .s-card-art{ height:200px; }
  .toast{ display:none; }
}