/* Scribe's four concerns are paired with their own images in document flow. */
.reference-product #voices{padding:clamp(80px,8vw,128px) 0 48px;background:#f3f7fd;color:#202124}
.reference-product #voices .voices-intro{max-width:790px;margin-bottom:clamp(24px,4vw,56px)}
.reference-product #voices .voices-kicker{margin-bottom:18px;color:#2563eb;font-size:15px;font-weight:800;letter-spacing:.02em}
.reference-product #voices h2{font-size:clamp(44px,4.8vw,72px)!important;font-weight:800!important;line-height:1.13!important;letter-spacing:-.05em!important}
.reference-product #voices .lead{max-width:650px;margin-top:24px;color:#4b5c72}
.reference-product #voices .voice-cards{list-style:none;padding:0;margin:0}
.reference-product #voices .voice-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center;min-height:clamp(500px,68svh,720px);padding:clamp(40px,5vw,72px) 0;border-top:1px solid #d9e3f0}
.reference-product #voices .voice-copy{max-width:560px;transition:opacity .55s ease,transform .65s cubic-bezier(.16,1,.3,1)}
.reference-product #voices blockquote{margin:0;font-family:var(--product-font);font-size:clamp(30px,3.25vw,48px);font-weight:800;letter-spacing:-.045em;line-height:1.27;word-break:keep-all;text-wrap:balance}
.reference-product #voices .voice-copy p{max-width:34em;margin-top:24px;color:#4b5c72;font-size:clamp(17px,1.35vw,19px);line-height:1.75;word-break:keep-all}
.reference-product #voices .voice-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;border-radius:28px;background:#fff;box-shadow:0 24px 64px -42px #19375a55;transition:opacity .55s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.js .reference-product #voices .voice-card:not(.is-in) .voice-copy,.js .reference-product #voices .voice-card:not(.is-in) img{opacity:.4;transform:translateY(24px)}
@media(max-width:800px){.reference-product #voices .voice-card{grid-template-columns:1fr;min-height:0;gap:32px;padding-block:56px}.reference-product #voices .voice-card img{max-width:690px}}
@media(max-width:650px){.reference-product #voices{padding:72px 0 20px}.reference-product #voices h2{font-size:clamp(38px,9vw,52px)!important}.reference-product #voices .voice-card{padding-block:48px}.reference-product #voices blockquote{font-size:clamp(28px,7.3vw,36px)}.reference-product #voices .voice-copy p{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.reference-product #voices .voice-copy,.reference-product #voices .voice-card img{transition:none!important;opacity:1!important;transform:none!important}}

/* A headline runway bridges the pale story section and the pinned product screen. */
.reference-product #solve{padding:0;background:#fff}
.reference-product #solve .solve-intro-run{background:#fff;padding-block:clamp(88px,12vw,156px)}
.reference-product #solve .solve-intro-stage>.frame{width:100%}
.reference-product #solve .solve-h{max-width:1220px;margin:0 auto;text-align:center;font-size:clamp(52px,6.3vw,104px)!important;font-weight:800!important;line-height:1.08!important;letter-spacing:-.055em!important;word-break:keep-all;text-wrap:balance}
.reference-product #solve .solve-h em{color:#2563eb;font-weight:800}
.reference-product #solve .solve-type-line{position:relative;display:block;width:max-content;max-width:100%;margin-inline:auto;text-align:left}
.reference-product #solve .solve-type-ghost{visibility:hidden}
.reference-product #solve .solve-type-live{position:absolute;inset:0}
.reference-product #solve.is-typing-scroll .solve-type-line.is-current .solve-type-live::after{content:"";display:inline-block;width:.065em;height:.78em;margin-left:.08em;background:#202124;vertical-align:-.04em;animation:solve-type-caret .75s steps(1,end) infinite}
@keyframes solve-type-caret{50%{opacity:0}}
.reference-product #solve.is-pinned .solve-intro-run{height:155svh;padding:0}
.reference-product #solve.is-pinned .solve-intro-stage{position:sticky;top:var(--bar-h);height:calc(100svh - var(--bar-h));display:flex;align-items:center;justify-content:center;overflow:hidden}
.reference-product #solve.is-typing-scroll .solve-intro-run{height:calc(330svh - var(--bar-h));padding:0}
.reference-product #solve.is-typing-scroll .solve-intro-stage{position:sticky;top:var(--bar-h);height:calc(100svh - var(--bar-h));display:flex;align-items:center;justify-content:center;overflow:hidden}
.reference-product #solve.has-handed-off .solve-stage{visibility:hidden}
.reference-product #solve:not(.is-pinned){padding:0}
.reference-product #solve:not(.is-pinned) .solve-run{padding-block:clamp(64px,8vw,112px)}
.reference-product #solve:not(.is-pinned) .solve-grid{grid-template-areas:"s" "p"}
@media(max-width:650px){.reference-product #solve .solve-intro-run{padding-block:88px}.reference-product #solve .solve-h{font-size:clamp(38px,9vw,52px)!important;text-align:left;line-height:1.16!important}.reference-product #solve .solve-type-line{margin-inline:0}}
@media(prefers-reduced-motion:reduce){.reference-product #solve .solve-h{opacity:1!important;transform:none!important}}

/* Shared product presentation, based on the existing CRM page. */
.reference-product #voices .v-item blockquote{font-family:var(--product-font);font-weight:500;letter-spacing:-.02em;line-height:1.4}
.reference-product #voices .v-sub{font-family:var(--product-font);font-weight:400;line-height:1.8}
.reference-product .learn-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}
.reference-product .learn-copy,.reference-product .fb{grid-column:auto;min-width:0;max-width:100%}
.reference-product .fig-n{display:flex;align-items:baseline;flex-wrap:nowrap;font-family:var(--product-font);line-height:.9;white-space:nowrap;letter-spacing:-.03em}
.reference-product .fig-n .roll__digits{display:inline-flex;align-items:flex-start;line-height:.9;white-space:nowrap}
.reference-product .roll__separator{display:block;height:1.1em;line-height:1.1;flex:none}
.reference-product .roll__col{height:1.1em;line-height:1.1;overflow:hidden}
.reference-product .roll__strip{transform:translateY(calc(var(--d) * -1.1em))}
.reference-product .roll__strip>span{height:1.1em;line-height:1.1;flex:none}
.reference-product .fb-col p{overflow-wrap:anywhere;word-break:normal}
.reference-product .fb-top{flex-wrap:wrap}
@media(max-width:1000px){.reference-product .learn-grid{grid-template-columns:minmax(0,1fr);gap:36px}.reference-product .fb{margin-top:0;width:100%}}
@media(max-width:650px){.reference-product .fb-top,.reference-product .fb-col{padding:20px}.reference-product .fb-meta{padding:16px 20px 0}.reference-product .fb .rule{margin:0 20px 20px}.reference-product .fig-n{font-size:72px}}
.reference-product #voices .voice-scenes{position:relative;aspect-ratio:4/3;width:100%;height:auto;min-height:0;flex:none;margin-top:28px;border-radius:28px;overflow:hidden;background:white}
.reference-product #voices .voice-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:none;transition:opacity .45s ease}
.reference-product #voices .voice-scene.is-active{opacity:1}
.reference-product #voices .voice-inline{display:none}
@media(min-width:1001px){.reference-product #voices:not(.is-staged) .v-left{position:sticky;top:calc(var(--bar-h) + 24px);height:auto;align-self:start}.reference-product #voices .v-item blockquote{font-weight:500}}
@media(max-width:1000px){
 .reference-product #voices .v-grid{grid-template-columns:1fr;gap:32px}
 .reference-product #voices .v-left{position:static;height:auto}
 .reference-product #voices .voice-scenes{display:none}
 .reference-product #voices .v-list{padding:0}
 .reference-product #voices .v-item{opacity:1;min-height:0;padding:28px 0 40px}
 .reference-product #voices .voice-inline{display:block;width:100%;max-width:620px;height:auto;margin:0 auto 28px;border-radius:28px}
}
@media(prefers-reduced-motion:reduce){.reference-product #voices .voice-scene{transition:none}}
.product-hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:40px;max-width:1400px;margin-inline:auto;padding:72px 48px}
.product-hero-layout .product-page-hero.container{padding:0!important;min-width:0}
.product-hero-layout .product-page-hero h1{font-size:clamp(36px,4vw,64px)}
.product-hero-layout .product-introduction-media{min-width:0;width:100%;padding:0;margin:0}
.product-report-preview{display:flex;justify-content:center;align-items:center}
.product-report-device{width:min(100%,300px);height:530px;overflow:hidden}
.product-report-device img{display:block;width:100%;height:auto}

/* One light, metal-edged iPhone treatment for every Report screen mockup. */
.reference-product[data-page="report"] :is(.product-report-device,.report-phone,.rp-dev){
 position:relative;
 background:linear-gradient(110deg,#f7f8f9 0%,#c8cdd2 12%,#fff 27%,#e4e7e9 72%,#aeb5bc 95%,#f8f9fa 100%);
 border:2px solid #b8bec5;
 border-radius:clamp(32px,3.5vw,48px);
 padding:8px;
 box-shadow:inset 0 0 0 1px #fff,0 26px 48px -24px rgba(35,49,64,.36),0 5px 12px rgba(35,49,64,.08);
 overflow:visible;
}
.reference-product[data-page="report"] :is(.product-report-device,.report-phone,.rp-dev)::before{
 content:"";
 position:absolute;
 z-index:3;
 top:16px;
 left:50%;
 transform:translateX(-50%);
 width:27%;
 height:13px;
 border-radius:999px;
 background:#171a1f;
 box-shadow:inset 0 1px 2px #000,0 1px 1px #ffffff80;
 pointer-events:none;
}
.reference-product[data-page="report"] :is(.product-report-device,.report-phone,.rp-dev)::after{
 content:"";
 position:absolute;
 z-index:3;
 top:auto;
 bottom:11px;
 left:50%;
 transform:translateX(-50%);
 width:31%;
 height:4px;
 border-radius:999px;
 background:#272b31;
 opacity:.55;
 pointer-events:none;
}
.reference-product[data-page="report"] .product-report-device{height:530px}
.reference-product[data-page="report"] .product-report-device img{height:100%;object-fit:cover;object-position:top;border-radius:38px;clip-path:inset(0 round 38px)}
.reference-product[data-page="report"] .report-phone{padding:9px 9px 15px;border-radius:46px}
.reference-product[data-page="report"] .report-phone::after{display:none}
.reference-product[data-page="report"] .report-phone .phone-hardware,.reference-product[data-page="report"] .report-phone .phone-home{display:none}
.reference-product[data-page="report"] .report-phone .phone-screen{border-radius:36px;aspect-ratio:1500/3248}
.reference-product[data-page="report"] .rp-dev{padding:9px 9px 15px}
.reference-product[data-page="report"] .rp-dev .rp-scr{border-radius:36px}
.reference-product[data-page="report"] :is(h1,h2,h3,h4) em{color:#202124;font-weight:800}
.reference-product[data-page="report"] .report-slide-select.is-active strong{color:#202124;font-weight:800}
.reference-product[data-page="report"] .rp-end{background:#fff;color:#202124}
.reference-product[data-page="report"] .rp-end .lead{color:#60666b}
.reference-product[data-page="report"] .rp-end .acts .link{color:#202124}
@media(max-width:1000px){
 .product-hero-layout{grid-template-columns:minmax(0,1fr);gap:36px;padding:56px 32px 48px}
 .product-hero-layout .product-introduction-media{max-width:680px;justify-self:center}
 .product-hero-layout .product-page-hero h1{font-size:var(--product-title)}
}
@media(max-width:650px){.product-hero-layout{padding:56px 22px 40px;gap:32px}}
:root{--product-font:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--product-title:clamp(36px,4.8vw,72px);--product-heading:clamp(30px,3.5vw,48px);--product-gutter:48px}
body{font-family:var(--product-font);font-size:16px;font-weight:400;line-height:1.75}
.reference-product{--ink:#202124;--ink-2:#60666b;--step-head:var(--product-heading);--step-display:var(--product-title);--step-body:16px;--step-lead:19px;--max:1440px;--margin:var(--product-gutter);color:var(--ink)}
.reference-product h2,.reference-product h3,.reference-product h4{font-family:var(--product-font);font-weight:500;letter-spacing:-.02em;line-height:1.35;text-wrap:balance}
.reference-product h2{font-size:var(--product-heading)!important;font-weight:500!important;line-height:1.35!important;letter-spacing:-.02em!important}
.reference-product h3{font-size:clamp(22px,2.4vw,30px);line-height:1.4}
.reference-product p{line-height:1.8}
.reference-product .frame{max-width:1440px;padding-inline:var(--product-gutter)}
.product-page-hero.container,.reference-product>.product-page-hero.container{max-width:1400px;width:100%;margin-inline:auto;padding:90px var(--product-gutter) 72px!important}
.product-page-hero .product-name{font-size:20px;font-weight:400;color:#2563eb;line-height:1.75;margin:0 0 28px}
.product-page-hero h1{font-family:var(--product-font);font-size:var(--product-title);font-weight:500;line-height:1.22;letter-spacing:-.035em;text-wrap:balance;color:#202124}
.product-page-hero>p:not(.product-name){max-width:680px;font-size:19px;line-height:1.8;color:#60666b;margin:28px 0}
.product-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:28px;margin-top:8px}
.product-page-hero .button{margin:0}
.reference-product .button,.product-page .product-page-hero .button{display:inline-flex;align-items:center;justify-content:center;height:auto;min-height:50px;border:1px solid #202124;border-radius:0;background:#202124;color:white;padding:12px 21px;font-size:14px;font-weight:500;line-height:1.5}
.reference-product .button:hover,.product-page .product-page-hero .button:hover{background:#30383c;color:white}
.product-hero-actions .text-link{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:500;color:#202124}
.product-hero-actions .text-link:hover{color:#2563eb}
.reference-product>.product-introduction-media.container{padding:20px var(--product-gutter) 72px!important;max-width:1400px;margin-inline:auto}
.product-introduction-media img{display:block;width:100%;max-width:1000px;height:auto;object-fit:contain;margin-inline:auto}
.reference-product>section:not(.product-page-hero):not(.product-introduction-media):not(.solve):not(.how):not(.voices):not(.scribe-workflow):not(.restored-content){padding-block:120px}
.reference-product .sec-head{margin-bottom:60px}
.reference-product .rp-chat .grid,.reference-product .learn-grid{gap:64px}
.reference-product .lead2,.reference-product .lead{font-size:19px;line-height:1.8}
.reference-product .footer{font-family:var(--product-font)}
.reference-product #scribe-close{background:#fff;color:var(--ink);font-family:var(--product-font)}
.reference-product #scribe-close .lead{color:var(--ink-2)}
.reference-product #scribe-close .link{color:var(--ink);font-size:14px;font-weight:500}
.reference-product #scribe-close .closing-monitor{font-family:var(--product-font)}
.reference-product #scribe-close .closing-opinion p{font-size:1.85cqw;line-height:1.45;word-break:normal;overflow-wrap:anywhere}
.reference-product #scribe-close .closing-opinion{margin-top:1cqw;padding:.9cqw 1.2cqw;min-height:0}
.reference-product #scribe-close .closing-result{height:13%}
.reference-product #scribe-close .closing-group-label{margin-top:1.5cqw;padding-bottom:.9cqw}
@media(max-width:900px){:root{--product-gutter:32px}.reference-product .rp-chat .grid,.reference-product .learn-grid{gap:40px}}
@media(max-width:650px){
 :root{--product-gutter:22px;--product-heading:clamp(28px,7.5vw,32px)}
 .reference-product .frame{padding-inline:var(--product-gutter)}
 .reference-product h3{font-size:24px}
 .product-page-hero.container,.reference-product>.product-page-hero.container{padding:56px var(--product-gutter) 40px!important}
 .product-page-hero>p:not(.product-name){font-size:17px}
 .reference-product>.product-introduction-media.container{padding:0 var(--product-gutter) 48px!important}
 .reference-product>section:not(.product-page-hero):not(.product-introduction-media):not(.solve):not(.how):not(.voices):not(.scribe-workflow):not(.restored-content){padding-block:64px}
 .reference-product .sec-head{margin-bottom:32px}
 .reference-product .lead2,.reference-product .lead{font-size:17px}
 .product-hero-actions{gap:24px}
}
