/* Site Mascot product page and homepage feature. Uses the theme tokens from site.css. */
.mp-page [hidden],.mp-demo [hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mp-hero{padding:72px 0 60px}
.mp-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.mp-hero h1{font-size:clamp(38px,4.6vw,64px);line-height:1.08;margin:0 0 22px}
.mp-hero .actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.mp-hero-points{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:10px;color:#c9d7e6;font-size:15px}
.mp-hero-points li{position:relative;padding-left:26px}
.mp-hero-points li:before{content:"";position:absolute;left:0;top:.5em;width:12px;height:12px;border-radius:50%;background:var(--cyan)}
.mp-hero-art{margin:0}
.mp-hero-art img{width:100%;height:auto;border-radius:20px;display:block;box-shadow:0 24px 60px #0008;border:1px solid #29435f}
.mp-hero-art figcaption{font-size:12px;color:#9fb4c9;margin-top:12px}

.mp-head{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:end;margin-bottom:38px}
.mp-head h2{margin:0}.mp-head p{color:var(--muted);margin:0}

.mp-demo{background:#edf4f5}
.mp-demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}
.mp-stage-card,.mp-chat{background:#fff;border:1px solid #cfdee3;border-radius:20px;box-shadow:0 18px 45px #081b3012;overflow:hidden;display:flex;flex-direction:column}
.mp-stage{position:relative;flex:1;min-height:490px;display:flex;align-items:flex-end;justify-content:center;padding:64px 0 28px;overflow:hidden;background:radial-gradient(ellipse at 50% 85%,#d8ecef 0,#eef6f7 55%,#fff 100%)}
.mp-mascot{position:relative;width:min(280px,64vw)}
.mp-figure{position:relative;width:100%;height:340px}
.mp-figure:not(.is-ready):after{content:"Loading the mascot…";position:absolute;inset:0;display:grid;place-items:center;font-size:13px;color:var(--muted)}
.mp-figure .sm-canvas{position:absolute;left:50%;bottom:0;transform:translateX(-50%);pointer-events:none;display:block}
.mp-speech{position:absolute;left:50%;top:-46px;transform:translate(-50%,6px);z-index:2;max-width:250px;width:max-content;background:#fff;border:2px solid var(--navy);color:var(--ink);padding:9px 14px;border-radius:14px;font-size:14px;font-weight:600;line-height:1.35;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.mp-speech.is-on{opacity:1;transform:translate(-50%,0)}
.mp-stage-note{max-width:320px;text-align:center;color:var(--muted);font-size:14px;padding:0 20px}
.mp-controls{padding:18px 22px 22px;border-top:1px solid #e1ebee;display:grid;gap:14px}
.mp-group-label{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.mp-chips{display:flex;flex-wrap:wrap;gap:8px}
.mp-chip{font:inherit;font-size:13px;font-weight:600;line-height:1.2;padding:9px 14px;min-height:40px;border-radius:30px;border:1px solid #bcd0d6;background:#fff;color:var(--ink);cursor:pointer}
.mp-chip:hover{border-color:var(--teal);color:var(--teal)}
.mp-chip[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.mp-chip:focus-visible,.mp-switch input:focus-visible,.mp-form input:focus-visible,.mp-form select:focus-visible,.mp-ask input:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}

.mp-chat-bar{background:var(--navy);color:#fff;padding:16px 22px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:15px}
.mp-chat-bar span{font-size:10px;letter-spacing:.12em;color:#8ae3e0}
.mp-switch{display:flex;align-items:center;gap:10px;padding:14px 22px;border-bottom:1px solid #e1ebee;font-size:14px;font-weight:600;cursor:pointer}
.mp-switch input{width:18px;height:18px;accent-color:var(--teal)}
.mp-thread{flex:1;min-height:250px;max-height:360px;overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:10px;background:#f7fafb}
.mp-msg{max-width:88%;padding:11px 15px;border-radius:16px;font-size:14.5px;line-height:1.5}
.mp-msg p{margin:0}
.mp-msg.bot{background:#fff;border:1px solid #d6e3e7;align-self:flex-start;border-bottom-left-radius:4px}
.mp-msg.user{background:var(--teal);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.mp-msg-link{display:inline-block;margin-top:9px;padding:8px 14px;border-radius:30px;background:var(--navy);color:#fff;font-size:13px;font-weight:650;text-decoration:none}
.mp-msg-link:hover{background:var(--teal);color:#fff}
.mp-suggest{display:flex;flex-wrap:wrap;gap:8px;padding:12px 22px;border-top:1px solid #e1ebee}
.mp-ask{display:flex;gap:10px;padding:14px 22px 18px;border-top:1px solid #e1ebee}
.mp-ask input{flex:1;min-width:0;font:inherit;font-size:15px;padding:12px 16px;border-radius:30px;border:1px solid #bcd0d6}
.mp-ask .button{padding:10px 22px;min-height:44px;width:auto}
.mp-form{padding:20px 22px 24px;display:grid;gap:14px;background:#f7fafb;flex:1;align-content:start}
.mp-form-title{font-size:20px;font-weight:750;margin:0;color:var(--ink)}
.mp-form-intro{margin:-6px 0 0;color:var(--muted);font-size:14px}
.mp-form label{display:grid;gap:6px;font-size:13px;font-weight:650;color:var(--ink)}
.mp-form input:not([type=checkbox]),.mp-form select{font:inherit;font-size:15px;font-weight:400;padding:11px 14px;border:1px solid #bcd0d6;border-radius:10px;background:#fff;min-height:44px}
.mp-form .mp-check{display:flex;align-items:center;gap:10px;font-weight:500}
.mp-form .mp-check input{width:18px;height:18px;accent-color:var(--teal)}
.mp-form-error{margin:0;color:#a3261c;font-size:13.5px;font-weight:600}
.mp-form .button{justify-self:start;width:auto}
.mp-noscript{padding:14px 22px;margin:0;font-size:14px}

.mp-features{background:#fff}
.mp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mp-cards article{border:1px solid var(--line);border-radius:16px;padding:28px;background:#fff}
.mp-cards article span{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--teal);margin-bottom:18px}
.mp-cards h3{font-size:21px;margin:0 0 10px}.mp-cards p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.6}

.mp-intake{background:var(--navy);color:#fff}
.mp-intake-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:start}
.mp-intake h2{color:#fff;margin:0 0 18px}
.mp-intake .eyebrow{color:var(--cyan)}
.mp-intake .lead{color:#d6dfec;font-size:19px}
.mp-ticks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.mp-ticks li{position:relative;padding-left:30px;color:#dbe6f1;font-size:15.5px;line-height:1.55}
.mp-ticks li:before{content:"";position:absolute;left:0;top:.35em;width:16px;height:16px;border-radius:50%;background:var(--cyan)}
.mp-ticks li:after{content:"";position:absolute;left:5px;top:.58em;width:5px;height:8px;border:solid var(--navy);border-width:0 2px 2px 0;transform:rotate(45deg)}
.mp-privacy{background:#10283f;border:1px solid #39516a;border-radius:18px;padding:28px}
.mp-privacy h3{color:#fff;margin:0 0 14px;font-size:21px}
.mp-privacy ul{margin:0;padding-left:20px;display:grid;gap:10px;color:#d6dfec;font-size:15px;line-height:1.55}

.mp-steps{background:#f4f6f8}
.mp-step-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.mp-step-list span{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--teal);margin-bottom:16px}
.mp-step-list h3{font-size:20px;margin:0 0 8px}.mp-step-list p{margin:0;color:var(--muted);font-size:15px}

.mp-licence .actions{display:flex;gap:18px 24px;flex-wrap:wrap;align-items:center}
.mp-lead-dark{font-size:18px;color:var(--ink)}
.mp-legal{font-size:12.5px;color:var(--muted);margin-top:30px}
.mp-faq h2{margin-bottom:10px}

/* Homepage feature */
.co-mascot{background:#fff}
.co-mascot-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.co-mascot-art{margin:0}.co-mascot-art img{width:100%;height:auto;display:block;border-radius:20px;border:1px solid #cfdee3;box-shadow:0 18px 45px #081b3014}
.co-mascot .co-product-benefits{padding-left:20px;font-size:16px}
.co-mascot .actions{display:flex;gap:18px;flex-wrap:wrap;align-items:center}

@media(max-width:1000px){
 .mp-hero-grid,.mp-demo-grid,.mp-intake-grid,.co-mascot-grid{grid-template-columns:1fr;gap:34px}
 .mp-head{grid-template-columns:1fr;gap:16px;margin-bottom:26px}
 .mp-cards{grid-template-columns:1fr 1fr}.mp-step-list{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
 .mp-hero{padding:44px 0 40px}
 .mp-cards,.mp-step-list{grid-template-columns:1fr}
 .mp-stage{min-height:420px}.mp-figure{height:290px}
 .mp-controls,.mp-thread,.mp-suggest,.mp-ask,.mp-form,.mp-switch,.mp-chat-bar{padding-left:16px;padding-right:16px}
 .mp-hero .actions .button{width:100%}
}
@media(prefers-reduced-motion:reduce){.mp-speech{transition:none}}
.co-mascot .lead{color:var(--ink)}
.mp-licence .actions{margin:26px 0 22px}
