/* Kindorse visual system
   Yellow is an object color (cards, pills, kits), not a page wash.
   Black is for type and controls. Gray carries the space between. */
:root{
  --yellow:#FFE500;--yellow-press:#F5DB00;--yellow-tint:#FFF7B8;
  --black:#0E0E0E;--ink:#111111;--ink-2:#6E6E6E;--ink-3:#9A9A9A;
  --bg:#F3F3F1;--bg-2:#EAEAE7;--surface:#FFFFFF;--line:#E2E2DE;
  --alert:#E2452B;--good:#1F9D55;
  --font:'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r-sm:10px;--r-md:18px;--r-lg:28px;--r-pill:999px;
  --sh-obj:0 1px 0 rgba(0,0,0,.06),0 12px 24px -8px rgba(0,0,0,.18),0 28px 56px -24px rgba(0,0,0,.22);
  --sh-soft:0 8px 30px rgba(0,0,0,.06);
  --w:1160px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:300 18px/1.6 var(--font);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit;text-underline-offset:3px}
strong,b{font-weight:600}
h1,h2,h3{line-height:1.05;letter-spacing:-.025em;margin:0 0 .5em;font-weight:700;color:var(--black)}
h1{font-size:clamp(42px,6.2vw,80px)}
h2{font-size:clamp(28px,3.4vw,42px)}
h3{font-size:22px;font-weight:600;letter-spacing:-.01em}
p{margin:0 0 1em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 24px}
.narrow{max-width:800px}
.small{font-size:14px}
.muted{color:var(--ink-2)}
.mono{font-variant-numeric:tabular-nums}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--yellow);padding:8px 12px;z-index:20}
:focus-visible{outline:3px solid var(--black);outline-offset:3px}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:10;background:rgba(243,243,241,.86);backdrop-filter:saturate(1.4) blur(12px)}
.top-in{display:flex;align-items:center;gap:28px;height:72px}
.logo{font-weight:700;font-size:26px;letter-spacing:-.03em;text-decoration:none;display:inline-flex;align-items:center;gap:6px;color:var(--black)}
.logo span{width:12px;height:12px;border-radius:50%;background:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--black);font-size:0;display:inline-block;transform:translateY(5px)}
.nav{display:flex;gap:4px;margin-left:8px}
.nav a{text-decoration:none;color:var(--ink-2);font-weight:500;font-size:16px;padding:8px 14px;border-radius:var(--r-pill)}
.nav a:hover{color:var(--black);background:var(--bg-2)}
.nav a[aria-current]{color:var(--black);background:var(--surface);box-shadow:var(--sh-soft)}
.top-cta{margin-left:auto;display:flex;gap:10px;align-items:center}
.link-quiet{text-decoration:none;font-weight:500;color:var(--ink-2);padding:8px 12px}
@media (max-width:900px){
  .top-in{flex-wrap:wrap;height:auto;padding-top:12px;gap:8px 16px}
  .nav{order:3;width:100%;margin:0 0 0 -14px;padding-bottom:8px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
  .link-quiet{display:none}
}

/* ---------- buttons (pills) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--black);color:#fff;font:600 17px/1 var(--font);text-decoration:none;padding:18px 28px;border-radius:var(--r-pill);border:0;transition:transform .15s,box-shadow .15s,background .15s;box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(0,0,0,.5)}
.btn-sm{padding:12px 20px;font-size:15px}
.btn-yellow{background:var(--yellow);color:var(--black);box-shadow:0 10px 24px -12px rgba(160,140,0,.7)}
.btn-yellow:hover{background:var(--yellow-press)}
.btn-ghost{background:var(--surface);color:var(--black);box-shadow:var(--sh-soft)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

.crumbs{font-size:14px;color:var(--ink-3);padding-top:24px}
.crumbs a{color:var(--ink-2);text-decoration:none}
.crumbs a:hover{color:var(--black)}

/* ---------- sections ---------- */
section{padding:96px 0}
.band{background:var(--surface)}
.eyebrow{display:block;font-weight:600;font-size:15px;color:var(--black);margin-bottom:18px;letter-spacing:0}
.eyebrow::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--black);margin-right:10px;transform:translateY(-1px)}
.lede{font-size:clamp(18px,1.8vw,21px);color:var(--ink-2);max-width:620px;font-weight:300}
mark{background:var(--yellow);color:var(--black);padding:0 .15em;border-radius:4px}

/* yellow feature section: the "object" color at full size */
.dark{background:var(--yellow);color:var(--black)}
.dark .eyebrow::before{background:var(--black);box-shadow:none}
.dark .lede,.dark .muted,.dark .stat-label{color:#3D3A1E}
.dark .card{background:var(--surface);color:var(--ink)}
.dark .card .muted,.dark .card .stat-label{color:var(--ink-2)}
.dark .step-n{background:var(--black);color:var(--yellow)}
.dark .btn{background:var(--black);color:#fff}
.dark blockquote footer{color:#3D3A1E !important}

/* label-left / text-right, as in the reference "Considerations" row */
.split{display:grid;grid-template-columns:minmax(220px,1fr) 2.2fr;gap:24px 64px;align-items:start}
.split > :first-child h2{font-size:clamp(24px,2.4vw,30px)}
@media (max-width:820px){.split{grid-template-columns:1fr}}

/* ---------- hero ---------- */
.hero{padding:72px 0 80px;position:relative;isolation:isolate;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(60% 80% at 85% 10%,rgba(255,255,255,.95),transparent 60%),
    radial-gradient(40% 60% at 15% 90%,rgba(0,0,0,.05),transparent 70%),
    linear-gradient(115deg,transparent 40%,rgba(0,0,0,.035) 41%,transparent 55%),
    linear-gradient(115deg,transparent 58%,rgba(0,0,0,.03) 59%,transparent 72%),
    var(--bg)}
.hero h1{max-width:820px}
.hero .lede{margin-top:8px}
.hero .price-note{margin-top:32px;display:flex;gap:6px 14px;flex-wrap:wrap;align-items:baseline}
.price-big{font-weight:700;font-size:40px;line-height:1;letter-spacing:-.03em}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:56px;align-items:center}
@media (max-width:980px){.hero-grid{grid-template-columns:minmax(0,1fr)}.hero-grid .tablet-stage{margin-top:16px}}

.answer{background:var(--surface);border-radius:var(--r-md);padding:22px 26px 22px 58px;margin:36px 0 0;max-width:860px;font-size:17px;color:var(--ink-2);box-shadow:var(--sh-soft);position:relative}
.answer::before{content:"";position:absolute;left:24px;top:27px;width:16px;height:16px;border-radius:50%;background:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--black)}
.answer strong{color:var(--black)}
@media (max-width:620px){.answer{padding:20px 20px 20px 46px}.answer::before{left:18px;top:25px;width:14px;height:14px}}

/* ---------- tablet survey demo (the product's signature screen) ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tablet-stage{position:relative;margin:0 auto;padding:0 0 24px;width:100%;max-width:410px}
.tablet{position:relative;background:#1B1B1B;border-radius:30px;padding:16px;box-shadow:var(--sh-obj),inset 0 0 0 2px #333;transform:rotate(-1.5deg)}
.screen{container-type:inline-size;background:#fff;border-radius:clamp(8px,1.4vw,14px);aspect-ratio:3/4;display:flex;flex-direction:column;padding:7% 8% 6%;border-radius:14px !important;overflow:hidden;color:#46525F}
.s-top{display:flex;justify-content:space-between;align-items:flex-start}
.s-back{border:1.5px solid #6B7682;border-radius:1.6cqw;padding:3.4cqw 5.4cqw;font-size:4cqw;color:#5C6773;align-self:center}
.s-logo{background:#111;color:#fff;font-weight:800;font-size:3.4cqw;line-height:1.05;letter-spacing:.04em;width:15cqw;height:15cqw;display:grid;place-items:center;text-align:center;outline:1px dashed #9A9A9A;outline-offset:3px}
.s-body{flex:1;display:flex;flex-direction:column;justify-content:center;position:relative}
.s-qs{position:relative;height:18cqw}
.s-q{position:absolute;inset:0;margin:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:5.4cqw;line-height:1.6;font-weight:400;color:#46525F;padding:0;opacity:0;transform:translateX(6%);transition:opacity .45s,transform .45s}
.s-q.is-on{opacity:1;transform:none}
.s-q.is-out{opacity:0;transform:translateX(-6%)}
.s-faces{display:flex;justify-content:space-between;gap:1cqw;margin-top:5cqw;transition:opacity .4s}
.face{width:15cqw;flex:none;position:relative;transition:transform .25s,filter .25s}
.face svg{width:100%;height:auto;display:block}
.face.is-picked{transform:scale(1.14)}
.s-faces.has-pick .face:not(.is-picked){filter:grayscale(.9) opacity(.45)}
.face.is-tap::after{content:"";position:absolute;left:50%;top:55%;width:8cqw;height:8cqw;margin:-4cqw 0 0 -4cqw;border-radius:50%;background:rgba(0,0,0,.28);animation:tap .55s ease-out forwards}
@keyframes tap{0%{transform:scale(.4);opacity:1}100%{transform:scale(2.6);opacity:0}}
.s-thanks{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5cqw;opacity:0;pointer-events:none;transition:opacity .5s}
.s-thanks strong{font-size:10cqw;font-weight:700;color:#2C3640}
.s-thanks span{font-size:5cqw}
.screen.is-done .s-qs,.screen.is-done .s-faces{opacity:0}
.screen.is-done .s-thanks{opacity:1}
.s-foot{display:flex;align-items:center;justify-content:center;gap:2.4cqw;font-size:3.9cqw;color:#5C6773}
.s-foot .plane{width:7.4cqw;height:auto;display:inline-block}
.s-foot b{font-weight:400;font-size:6.6cqw;color:#1B1B1B;letter-spacing:.01em}
.s-foot sup{font-size:2cqw;margin-left:-1.4cqw}
.obj{position:absolute;background:var(--yellow);border-radius:var(--r-md);box-shadow:var(--sh-obj);color:var(--black)}
.obj-alert{background:var(--surface);padding:16px 18px;width:min(250px,55%)}
.obj-alert .t{font-size:12px;color:var(--ink-3);font-weight:500}
.obj-alert strong{display:block;font-size:17px;line-height:1.25;margin:4px 0}
.obj-alert .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--alert);margin-right:6px}
.stage-alert{right:-56px;bottom:0;transform:translateY(12px) rotate(2deg);opacity:0;transition:opacity .45s,transform .45s}
.stage-alert.is-on{opacity:1;transform:rotate(2deg)}
@media (prefers-reduced-motion:reduce){.s-q,.face,.stage-alert,.s-thanks{transition:none}.face.is-tap::after{animation:none}}
@media (max-width:1100px){.stage-alert{right:-16px}}
@media (max-width:520px){.tablet-stage{max-width:330px}.stage-alert{right:-8px;width:70%}.obj-alert strong{font-size:15px}}

/* ---------- grids & cards ---------- */
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:var(--surface);border-radius:var(--r-lg);padding:30px;box-shadow:var(--sh-soft)}
.band .card{background:var(--bg);box-shadow:none}
.card h3{margin-bottom:8px}
.card p:last-child{margin-bottom:0}
a.card{transition:transform .15s,box-shadow .15s}
a.card:hover{transform:translateY(-3px);box-shadow:var(--sh-obj)}
.card-yellow,.band .card-yellow{background:var(--yellow);box-shadow:var(--sh-obj)}
.card-yellow .muted,.card-yellow .stat-label{color:#3D3A1E}
.step-n{display:inline-block;font-weight:600;font-size:13px;background:var(--yellow);color:var(--black);border-radius:var(--r-pill);padding:5px 12px;margin-bottom:16px}
.stat{font-weight:700;font-size:clamp(40px,4.6vw,58px);line-height:1;letter-spacing:-.04em;margin-bottom:10px;color:var(--black)}
.stat-label{color:var(--ink-2);font-size:16px}

ul.check{list-style:none;padding:0;margin:0}
ul.check li{padding:12px 0 12px 36px;position:relative;border-bottom:1px solid var(--line)}
ul.check li:last-child{border-bottom:0}
ul.check li::before{content:"";position:absolute;left:0;top:15px;width:22px;height:22px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.5l3 3L15.5 8' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px no-repeat}

/* client names as pills */
.logos{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.logos span{background:var(--bg);border-radius:var(--r-pill);padding:10px 18px;font-weight:500;font-size:16px;color:var(--ink)}

/* ---------- tables ---------- */
.table-wrap{overflow-x:auto;background:var(--surface);border-radius:var(--r-md);box-shadow:var(--sh-soft)}
.band .table-wrap{box-shadow:0 0 0 1px var(--line)}
table{width:100%;border-collapse:collapse;font-size:16px;min-width:560px}
th,td{text-align:left;padding:16px 20px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-weight:600;color:var(--black);background:var(--yellow);border-bottom:0}
tbody th{font-weight:600}
tr:last-child td,tr:last-child th{border-bottom:0}
td.num,th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.yes{color:var(--good);font-weight:600}.no{color:var(--alert);font-weight:600}

/* quotes */
blockquote{margin:0;font-size:21px;line-height:1.4;font-weight:400;color:var(--black);letter-spacing:-.01em}
blockquote footer{font-size:15px;font-weight:300;color:var(--ink-2);margin-top:16px}

/* ---------- FAQ ---------- */
.faqs{display:grid;gap:10px}
details.faq{background:var(--surface);border-radius:var(--r-md);padding:0 24px;box-shadow:var(--sh-soft)}
.band details.faq{background:var(--bg);box-shadow:none}
details.faq summary{cursor:pointer;list-style:none;padding:20px 48px 20px 0;font-weight:600;font-size:19px;position:relative;color:var(--black)}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;background:var(--black);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:400;line-height:1}
details.faq[open] summary::after{content:"−";background:var(--yellow);color:var(--black)}
details.faq > div{padding:0 0 22px;color:var(--ink-2);max-width:760px}
details.faq > div p:last-child{margin:0}

/* ---------- article ---------- */
.prose{max-width:780px}
.prose h2{font-size:clamp(26px,2.8vw,34px);margin-top:1.8em}
.prose h3{margin-top:1.4em}
.prose p,.prose li{color:#3F3F3F}
.prose ul,.prose ol{padding-left:1.2em}
.prose li{margin-bottom:.5em}
.prose .table-wrap{margin:1.4em 0 1.8em}
.meta-line{font-size:14px;color:var(--ink-3);font-weight:400}
.toc{background:var(--surface);border-radius:var(--r-md);padding:20px 26px;margin:28px 0;box-shadow:var(--sh-soft)}
.toc ol{margin:8px 0 0;padding-left:1.2em}
.toc a{text-decoration:none}.toc a:hover{text-decoration:underline}

/* ---------- calculator ---------- */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:36px}
@media (max-width:760px){.calc{grid-template-columns:1fr}}
.field{margin-bottom:22px}
.field label{display:flex;justify-content:space-between;font-weight:500;margin-bottom:8px}
.field output{font-weight:600}
input[type=range]{width:100%;accent-color:var(--black)}
.bill{background:var(--yellow);border-radius:var(--r-md);padding:24px;box-shadow:var(--sh-obj)}
.bill div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.12);font-variant-numeric:tabular-nums}
.bill .total{font-weight:700;font-size:24px;border-bottom:0;letter-spacing:-.02em}
.bill .muted{color:#3D3A1E}

/* ---------- closing CTA ---------- */
.cta-band{background:var(--black);color:#fff;border-radius:var(--r-lg);margin:0 24px 24px;padding:80px 0}
.cta-band h2{color:#fff}
.cta-band .lede{color:#BDBDBD !important}
.cta-band .btn{background:var(--yellow);color:var(--black);box-shadow:none}
.cta-band .btn-ghost{background:#262626;color:#fff}
@media (max-width:620px){.cta-band{margin:0 12px 12px;padding:56px 0}}


/* ---------- footer ---------- */
.foot{padding:72px 0 28px;font-size:15px;color:var(--ink-2)}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:36px}
@media (max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}}
.foot h2{font-size:15px;font-weight:600;color:var(--black);letter-spacing:0;margin-bottom:14px}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin-bottom:8px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--black)}
.foot .logo{color:var(--black)}
.foot-legal{border-top:1px solid var(--line);margin-top:48px;padding-top:22px;font-size:13px;color:var(--ink-3)}

/* ---------- sample report ---------- */
.sample-note{margin-top:16px;max-width:860px;font-size:15px;color:var(--ink-2);background:var(--yellow-tint);border-radius:var(--r-sm);padding:12px 16px}
.sample-note b{color:var(--black)}
.report-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:24px}
.report-nav a{flex:none;text-decoration:none;background:var(--surface);border-radius:var(--r-pill);padding:8px 16px;font-weight:500;font-size:15px;box-shadow:var(--sh-soft)}
.report-nav a:hover{background:var(--yellow)}
.kpis .stat{font-size:clamp(34px,3.6vw,46px)}
.bars{display:grid;gap:10px;margin-top:14px}
.bar{display:grid;grid-template-columns:120px 1fr 48px;align-items:center;gap:12px;font-size:15px}
.bar i{display:block;height:14px;border-radius:7px;background:var(--bg-2);position:relative;overflow:hidden}
.bar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--black);border-radius:7px}
.card-yellow .bar i{background:rgba(0,0,0,.12)}
.bar b{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.heat td.hi{background:#E3F4E8;color:#14532D;font-weight:600}
.heat td.lo{background:#FCE5E0;color:#8A2414;font-weight:600}
.hi-key{background:#E3F4E8;color:#14532D;padding:0 6px;border-radius:4px;font-weight:500}
.lo-key{background:#FCE5E0;color:#8A2414;padding:0 6px;border-radius:4px;font-weight:500}
.themes td{text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.themes td small{display:block;font-size:12px;color:var(--ink-3);font-weight:400}
.t-up{background:#E3F4E8;color:#14532D}.t-mid{background:#FFF7D1;color:#5C4B00}.t-down{background:#FCE5E0;color:#8A2414}
.dot{color:var(--ink-3)}
.tag-k{display:inline-block;font-size:13px;font-weight:600;border-radius:var(--r-pill);padding:4px 12px;margin-bottom:12px;background:var(--black);color:#fff}
.tag-k.up{background:#E3F4E8;color:#14532D}.tag-k.down{background:#FCE5E0;color:#8A2414}
.scatter{width:100%;height:auto;margin:8px 0 16px;font:400 11px var(--font)}
.scatter line{stroke:var(--line);stroke-width:1.5}
.scatter circle{fill:var(--yellow);stroke:var(--black);stroke-width:1.5}
.scatter text{fill:var(--ink)}
.scatter .ax{fill:var(--ink-3);font-size:11px}
.quote{margin:0}
.quote blockquote{font-size:18px}
.quote figcaption{margin-top:12px;font-size:13px;font-weight:600}
.quote.up figcaption{color:var(--good)}.quote.down figcaption{color:var(--alert)}
.journey{list-style:none;padding:0;margin:32px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:j}
@media (max-width:900px){.journey{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.journey{grid-template-columns:1fr}}
.journey li{background:var(--surface);border-radius:var(--r-md);padding:20px;box-shadow:var(--sh-soft);border-top:6px solid var(--line)}
.journey li.j-up{border-top-color:var(--good)}.journey li.j-mid{border-top-color:#F0B400}.journey li.j-down{border-top-color:var(--alert)}
.journey .j-n{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--black);color:#fff;font-size:13px;font-weight:600;margin-right:8px}
.journey strong{font-size:18px}
.journey .j-m{display:block;font-size:13px;color:var(--ink-3);margin:6px 0 10px}
.journey p{font-size:15px;color:var(--ink-2);margin:0 0 8px}
.journey .j-o{color:var(--ink)}
@media (max-width:520px){.bar{grid-template-columns:96px 1fr 44px;font-size:14px}}
@media (max-width:620px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.kpis .card{padding:18px}.kpis .stat{font-size:30px}.kpis .stat-label{font-size:14px}}

/* ---------- client marquee ---------- */
.clients{padding:48px 0 52px;overflow:hidden}
.clients-title{font-size:15px;font-weight:600;letter-spacing:0;color:var(--ink-2);margin-bottom:22px;text-align:center}
.marquee{position:relative;-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:marquee 45s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee ul{display:flex;gap:14px;list-style:none;margin:0;padding:0 7px}
.marquee li{flex:none;background:var(--bg);border-radius:var(--r-pill);padding:14px 26px;font-weight:600;font-size:clamp(17px,1.8vw,22px);letter-spacing:-.01em;color:var(--black);white-space:nowrap}
.marquee li:nth-child(4n+1){background:var(--yellow)}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .marquee{-webkit-mask-image:none;mask-image:none}
  .marquee-track{animation:none;width:auto;justify-content:center}
  .marquee ul{flex-wrap:wrap;justify-content:center}
  .marquee ul[aria-hidden]{display:none}
}

/* ---------- trial report sheets (paper pages) ---------- */
.sheets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px;align-items:start}
@media (max-width:980px){.sheets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.sheets{grid-template-columns:1fr}}
.sheet{position:relative;background:#fff;border-radius:6px;padding:28px 26px 56px;box-shadow:0 1px 2px rgba(0,0,0,.06),0 14px 34px -14px rgba(0,0,0,.22);min-height:360px;font-size:15px;color:#2A2A2A}
.sheet:nth-child(odd){transform:rotate(-.4deg)}.sheet:nth-child(even){transform:rotate(.4deg)}
.sheet-wide{grid-column:span 2}
@media (max-width:620px){.sheet-wide{grid-column:auto}.sheet{transform:none!important}}
.sh-title{font-size:26px;font-weight:600;text-align:center;margin:8px 0 18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.sh-h{font-size:20px;font-weight:600;color:var(--black);margin:0 0 4px}
.sh-sub{font-size:14px;color:var(--ink-2);margin:0 0 16px}
.sh-p{font-size:15px;color:#3F3F3F;line-height:1.55}
.sh-sign{font-weight:600;color:var(--black)}.sh-sign span{font-weight:300;color:var(--ink-2)}
.sh-note{font-size:13px;color:var(--ink-2);margin:14px 0 0}
.sh-meta{display:grid;grid-template-columns:auto auto;gap:6px 16px;font-size:14px;margin:0 auto 18px;width:max-content}
.sh-meta dt{color:var(--ink-2)}.sh-meta dd{margin:0;text-align:right;font-weight:500}
.sh-tablet{width:120px;aspect-ratio:3/4;margin:0 auto;border:9px solid #111;border-radius:12px;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:4px;padding:6px}
.sh-tablet span{width:100%;font-size:7px;text-align:center;margin-bottom:4px}
.sh-tablet i{width:13px;height:13px;border-radius:50%;border:2px solid}
.sh-tablet i:nth-of-type(1){border-color:#E8452C}.sh-tablet i:nth-of-type(2){border-color:#EE7B30}.sh-tablet i:nth-of-type(3){border-color:#C2C03A}.sh-tablet i:nth-of-type(4){border-color:#8CC152}.sh-tablet i:nth-of-type(5){border-color:#4FA84A}
.sh-foot{position:absolute;left:26px;right:26px;bottom:16px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--ink-3);border-top:2px solid var(--yellow);padding-top:8px}
.sh-foot b{font-weight:400;font-size:15px;color:var(--black);display:flex;align-items:center;gap:5px}
.sh-foot b::before{content:"";width:14px;height:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M3 15L37 3 27 29 18 19z M18 19L37 3' fill='none' stroke='%23E9C400' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.sh-table{width:100%;min-width:0;font-size:14px;border-collapse:collapse}
.sh-table th,.sh-table td{padding:8px 6px;border-bottom:1px solid var(--line)}
.sh-table thead th{background:none;color:var(--ink-2);font-weight:500;font-size:12px}
.sh-table .below{color:var(--alert);font-weight:600}.sh-table .above{color:var(--good);font-weight:600}
.sh-bars{display:grid;gap:8px}
.sh-bars div{display:grid;grid-template-columns:90px 1fr 50px;gap:8px;align-items:center;font-size:13px}
.sh-bars i{height:10px;background:var(--bg-2);border-radius:5px;position:relative;overflow:hidden}
.sh-bars i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--yellow);border-right:2px solid #000}
.sh-bars b{text-align:right;font-weight:600}
.sh-big{font-size:42px;font-weight:700;letter-spacing:-.03em;margin:14px 0 0;color:var(--black)}
.sh-big small{font-size:16px;font-weight:400;color:var(--ink-2)}
.sh-nps{display:flex;height:28px;border-radius:6px;overflow:hidden;font-size:12px}
.sh-nps span{width:var(--w);display:flex;align-items:center;padding-left:8px;white-space:nowrap}
.sh-nps .p,.sh-legend .p{background:#1F9D55;color:#fff}.sh-nps .n,.sh-legend .n{background:#D7D7D2}.sh-nps .d,.sh-legend .d{background:var(--alert)}
.sh-legend{font-size:12px;color:var(--ink-2);display:flex;gap:6px 12px;flex-wrap:wrap;align-items:center;margin:8px 0 0}
.sh-legend i{width:10px;height:10px;border-radius:2px;display:inline-block;margin-right:-6px}
.sh-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sh-money div{background:var(--bg);border-radius:10px;padding:12px}
.sh-money .big{grid-column:span 3;background:var(--yellow)}
.sh-money b{display:block;font-size:22px;font-weight:700;letter-spacing:-.02em}
.sh-money span{font-size:13px;color:var(--ink-2)}
.sh-money .big span{color:#3D3A1E}
.sh-roi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:620px){.sh-roi,.sh-money{grid-template-columns:1fr}.sh-money .big{grid-column:auto}}
.sh-roi div{background:var(--bg);border-radius:10px;padding:14px}
.sh-roi span{font-size:12px;color:var(--ink-2);font-weight:500}
.sh-roi b{display:block;font-size:34px;font-weight:700;letter-spacing:-.03em;color:var(--black)}
.sh-roi p{font-size:13px;color:var(--ink-2);margin:4px 0 0}

/* ---------- live demo ---------- */
.demo-form{margin-top:28px;display:grid;gap:14px;max-width:520px}
.field-row label{display:block;font-weight:500;font-size:15px;margin-bottom:6px;color:var(--black)}
.demo-form input,.calc-send input{width:100%;font:400 17px var(--font);padding:14px 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink)}
.demo-form input:focus,.calc-send input:focus{outline:none;border-color:var(--black);background:#fff}
.demo-form .btn{justify-self:start}
.form-error{color:var(--alert);font-size:14px;font-weight:500;margin:0}
.form-ok{color:var(--good);font-size:15px;font-weight:500;margin:0}
.consent{margin:0}
.demo-stage{width:100%;max-width:410px;margin:0 auto}
.demo-stage .tablet{transform:none}
.demo-caption{text-align:center;font-weight:500;color:var(--black);min-height:3em;margin:18px 0 0}
.s-chips,.s-comment,.s-nps{display:none}
.screen[data-mode=chips] .s-faces,.screen[data-mode=comment] .s-faces,.screen[data-mode=nps] .s-faces{display:none}
.screen[data-mode=chips] .s-chips{display:flex}
.screen[data-mode=comment] .s-comment{display:block}
.screen[data-mode=nps] .s-nps{display:grid}
.s-chips{flex-wrap:wrap;justify-content:center;gap:3cqw;margin-top:8cqw}
.s-chips span,.s-chips button{font-family:inherit;background:#fff;cursor:pointer;border:1.5px solid #9AA3AD;border-radius:2cqw;padding:3cqw 5cqw;font-size:4.4cqw;color:#46525F;transition:background .2s,border-color .2s,transform .2s}
.s-chips .is-picked{background:#46525F;border-color:#46525F;color:#fff;transform:scale(1.06)}
.s-comment{margin-top:8cqw;border:1.5px solid #9AA3AD;border-radius:2cqw;min-height:26cqw;padding:4cqw;font-size:4.6cqw;line-height:1.4;color:#2C3640;text-align:left}
.caret{display:inline-block;width:2px;height:1.1em;background:#2C3640;vertical-align:-.2em;margin-left:1px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.screen.is-done .s-chips,.screen.is-done .s-comment,.screen.is-done .s-nps{opacity:0}

/* email preview */
.mail{position:relative;max-width:720px;margin:32px auto 0;background:#fff;border-radius:16px;box-shadow:var(--sh-obj);overflow:hidden;transition:filter .5s,opacity .5s,transform .5s}
.mail.is-waiting{pointer-events:none}
.mail.is-waiting > *{filter:blur(5px) grayscale(1);opacity:.45}
.mail.is-waiting::after{content:"Aquí aparecerá tu alerta";position:absolute;inset:0;display:grid;place-items:center;font-weight:600;font-size:20px;color:var(--black);padding:24px;text-align:center}
.mail.is-live{animation:mailIn .6s ease-out}
@keyframes mailIn{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.mail-bar{display:flex;align-items:center;gap:6px;padding:12px 16px;background:var(--bg-2);font-size:13px;color:var(--ink-2)}
.mail-bar i{width:11px;height:11px;border-radius:50%;background:#D0D0CB}
.mail-bar span{margin-left:10px}
.mail-head{padding:18px 24px;border-bottom:1px solid var(--line)}
.mail-from{display:flex;align-items:center;gap:12px;font-size:14px}
.mail-from div{flex:1;display:flex;flex-direction:column;line-height:1.3}
.mail-from span{color:var(--ink-2)}.mail-from em{font-style:normal;color:var(--ink)}
.mail-from time{color:var(--ink-3);font-size:13px}
.mail-avatar{width:38px;height:38px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M3 15L37 3 27 29 18 19z M18 19L37 3' fill='none' stroke='%23000' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.mail-subject{font-weight:600;font-size:18px;margin:14px 0 0;color:var(--black)}
.mail-body{padding:24px;font-size:15px;color:#3F3F3F}
.mail-brand{display:flex;align-items:center;gap:6px;font-size:20px;color:var(--black);margin-bottom:6px}
.mail-brand .plane{width:24px;height:auto}
.mail-title{font-size:22px;font-weight:700;color:var(--black);margin-bottom:8px}
.mail-table{width:100%;min-width:0;font-size:15px;margin:14px 0}
.mail-table th{background:none;width:34%;color:var(--ink-2);font-weight:500;padding:10px 0}
.mail-table td{padding:10px 0}
.score{display:inline-block;border-radius:6px;padding:1px 8px;font-weight:600}
.score.bad{background:#FCE5E0;color:#8A2414}
.mail-ai{background:var(--yellow-tint);border-radius:12px;padding:14px 16px}
.mail-ai b{font-size:13px;color:var(--black)}
.mail-ai p{margin:4px 0 0}
.mail-cta{margin:18px 0 0}
.mail-cta span{display:inline-block;background:var(--black);color:#fff;border-radius:999px;padding:12px 22px;font-weight:600}

/* calculator extras */
.calc-ratio{margin:16px 0 0;font-size:16px}
.calc-send{margin-top:20px;display:grid;grid-template-columns:1fr 1.3fr;gap:10px 28px;align-items:center}
.calc-send h3{margin:0 0 4px}
.calc-send-row{display:flex;gap:10px}
.calc-send-row .btn{flex:none}
.calc-send .form-error,.calc-send .form-ok{grid-column:2}
@media (max-width:760px){.calc-send{grid-template-columns:1fr}.calc-send .form-error,.calc-send .form-ok{grid-column:auto}.calc-send-row{flex-direction:column}}

/* email body matching Kindorse's real service alert */
.mail-body.ka{padding:0;color:#111;font-family:'Lato','Outfit',system-ui,sans-serif}
.ka-bar{background:#F7E14C;text-align:center;padding:22px 0;margin:0;font-size:18px;letter-spacing:.02em}
.ka-main{padding:24px 24px 32px;text-align:center}
.ka-aviso{font-size:20px;margin:0 0 12px}
.ka-title{font-size:clamp(26px,4vw,36px);font-weight:700;line-height:1.15;margin:0 0 18px;color:#000}
.ka-sub{font-size:16px;margin:0 0 6px}
.ka-rest{font-size:clamp(22px,3vw,28px);font-weight:700;margin:0 0 22px;color:#000}
.ka-table{width:100%;max-width:560px;min-width:0;margin:0 auto;border-collapse:collapse;font-size:16px}
.ka-table td{border:1.5px solid #D6D6D6;padding:10px 12px;text-align:center;vertical-align:middle;width:50%}
.ka-foot{background:#EBEBEB;text-align:center;padding:20px;font-size:15px}
.ka-foot p{margin:0 0 6px}
.ka-foot span{color:#5B2A86;text-decoration:underline}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* retention thesis */
.src{font-size:13px;color:var(--ink-3)}
a.src{color:var(--ink-2)}
.card-yellow .src{color:#5C5420}
.formula{margin-top:28px;background:var(--surface);border-radius:var(--r-lg);padding:28px 30px;box-shadow:var(--sh-soft)}
.formula-eq{font-size:clamp(20px,2.6vw,30px);font-weight:600;letter-spacing:-.02em;color:var(--black);margin-bottom:12px}
.formula-eq span{white-space:nowrap}
.formula-eq .hl{background:var(--yellow);padding:0 .25em;border-radius:6px}

/* interactive survey (visitor answers it) */
.s-nps{grid-template-columns:repeat(6,1fr);gap:1.6cqw;margin-top:6cqw}
.s-nps button{font:500 4.4cqw var(--font);aspect-ratio:1;border-radius:50%;border:1.5px solid #9AA3AD;background:#fff;color:#46525F;cursor:pointer;padding:0}
.s-nps button.is-picked{background:#46525F;border-color:#46525F;color:#fff}
.s-comment textarea,.s-send{display:none}
.screen.is-self .s-comment{padding:0;border:0;min-height:0}
.screen.is-self .s-comment [data-demo-typed],.screen.is-self .s-comment .caret{display:none}
.screen.is-self .s-comment textarea{display:block;width:100%;font:400 4.2cqw/1.4 var(--font);border:1.5px solid #9AA3AD;border-radius:2cqw;padding:3cqw;resize:none;color:#2C3640}
.screen.is-self .s-send{display:block;margin:3cqw auto 0;font:600 4.2cqw var(--font);background:#46525F;color:#fff;border:0;border-radius:2cqw;padding:2.6cqw 8cqw;cursor:pointer}
.screen.is-self .face{cursor:pointer}
.screen.is-self .face:hover{transform:scale(1.08)}
.screen.is-self .face:focus-visible{outline:3px solid #46525F;outline-offset:2px;border-radius:50%}
.demo-stage.is-self .tablet{box-shadow:0 0 0 4px var(--yellow),var(--sh-obj)}
.mail.is-waiting[data-empty]::after{content:"Esta vez no hubo alerta: el comensal quedó contento"}

/* phones: finger-sized targets in the survey tablet, full-width demo buttons */
@media (max-width:520px){
  .tablet{padding:10px;border-radius:24px}
  .screen{padding:7% 5% 6%}
  .face{width:16.5cqw}
  .s-faces{gap:.5cqw}
  .s-nps{gap:1.2cqw}
  .s-nps button{font-size:5cqw}
  .s-chips span,.s-chips button{font-size:4.8cqw;padding:4.4cqw 5cqw}
  .screen.is-self .s-send{font-size:5cqw;padding:4.6cqw 12cqw}
  .demo-form .ctas{flex-direction:column;align-items:stretch}
  .demo-form .ctas .btn{width:100%}
}

/* keep auto-scrolled sections clear of the sticky header */
section[id]{scroll-margin-top:84px}
@media (max-width:900px){section[id]{scroll-margin-top:118px}}