/* Review v4: five chapters, Roden red/white surfaces, readable content panels.
   This stylesheet only changes presentation; product facts and media stay intact. */
:root { --story-red:#c90825; --story-pale:#fff1f2; --story-line:#edcbd0; }
.section { padding-block:60px; }
.section-head { max-width:none; margin-bottom:28px; }
.section-head h2 { font-size:30px; line-height:1.6; }
.section-head .eyebrow { display:inline-block; padding:5px 10px; background:var(--story-pale); color:#ae0922; border-radius:3px; margin-bottom:13px; }
.hero { background:linear-gradient(90deg,#fff 0 52%,#fff0f2 52%); border:0; }
.hero-layout { padding-block:36px 32px; gap:52px; }
.hero-copy { align-self:start; padding-top:64px; }
.hero h1 { font-size:43px; }
.hero-copy .eyebrow { display:inline-block; background:var(--story-pale); padding:7px 12px; border-left:3px solid var(--story-red); }
.recording-card { border-color:#e7c8cd; box-shadow:0 18px 42px #9a142618; }
.recording-header { border-top:5px solid var(--story-red); background:#fff; }
.recording-controls button { background:var(--story-red); }
.recording-more { color:#9f0d24; }
.hero-values { background:var(--story-red); color:#fff; }
.value-strip { padding-block:24px; border:0; gap:30px; }
.value-strip div { display:grid; grid-template-columns:42px 1fr; gap:1px 15px; padding-left:25px; border-left:1px solid #ffffff55; }
.value-strip div:first-child { border-left:0; padding-left:0; }
.value-strip .draw-icon { grid-row:1/3; width:39px; height:39px; stroke:#fff; align-self:center; }
.value-strip b { font-size:15px; }
.value-strip span { color:#fff; font-size:11px; }
.page-guide { grid-template-columns:repeat(5,minmax(0,1fr)); padding-block:25px; gap:0; border-bottom:1px solid var(--story-line); }
.page-guide a { display:flex; align-items:center; justify-content:center; text-align:left; gap:11px; padding:9px; border-right:1px solid var(--story-line); }
.page-guide span { display:grid; place-items:center; margin:0; flex-shrink:0; width:29px; height:29px; background:var(--story-red); color:#fff; border-radius:50%; font-size:11px; }
.page-guide b { font-size:12px; line-height:1.7; }
.page-guide small { display:block; font-weight:400; font-size:9px; color:#67717b; }
.chapter-label { display:flex; align-items:center; gap:17px; border-bottom:1px solid var(--story-line); padding-bottom:17px; margin-bottom:28px; color:var(--story-red); }
.chapter-label > span { font-size:42px; line-height:1; letter-spacing:-.04em; font-weight:700; }
.chapter-label > b { font-size:18px; }
.chapter-label > small { margin-left:auto; color:#636b73; font-size:12px; }
#about { background:#fff; }
.journey-comparison { gap:24px; }
.journey,.journey.after { border-radius:12px; padding:22px; }
.journey.before { background:#f4f5f6; border-color:#dce1e4; }
.journey.after { border:2px solid var(--story-red); background:#fff; }
.journey-art { aspect-ratio:1.5; }
.after .journey-heading>span { color:var(--story-red); }
.after .journey-path { background:var(--story-red); color:#fff; }
.after .journey-path i { color:#fff; }
.section-takeaway { background:var(--story-pale); border-left:4px solid var(--story-red); padding:19px 24px; margin-top:22px; }
#comparison { background:#fff1f2; border-block:1px solid #f1d9dd; }
#comparison .section-head { border-left:5px solid var(--story-red); padding-left:22px; }
#comparison .section-head .eyebrow { padding:0; background:none; }
.type-cards article { border-color:#e6cfd3; box-shadow:0 5px 16px #911e2c06; }
.type-cards .selected { border-color:var(--story-red); background:#fff; box-shadow:0 10px 24px #9e233316; }
.type-cards .selected h3 { color:var(--story-red); }
.type-cards .selected .service-tag { background:var(--story-red); }
.comparison-conclusion { background:var(--story-red); color:white; border:0; border-radius:10px; padding:25px 28px; }
.comparison-conclusion .tag { background:#fff; color:#b10b24; }
.comparison-conclusion p { color:#fff; }
#benefits { background:#fff; }
.benefit-grid { gap:18px; }
.benefit-grid article,.benefit-grid article:nth-child(2),.benefit-grid article:nth-child(3) { background:#fff6f6; border:1px solid #eed3d7; }
.benefit-grid article:nth-child(2),.benefit-grid article:nth-child(3) { background:#fff; }
.benefit-icon:before,.benefit-grid article:nth-child(2) .benefit-icon:before,.benefit-grid article:nth-child(3) .benefit-icon:before { background:#fbe2e5; border-radius:50%; }
.benefit-icon .draw-icon { stroke:#ae1530; }
.benefit-grid small { color:#a11c30; }
.limits { background:#f6f7f8; border:0; border-top:4px solid var(--story-red); }
.fit-note { background:#fff0f2; border-color:var(--story-red); }
#use-cases { background:#fff1f2; padding-top:48px; }
#use-cases .section-head { border-left:5px solid var(--story-red); padding-left:22px; }
#use-cases .section-head .eyebrow { padding:0; }
.use-card { border-color:#e9cfd3; background:#fff; box-shadow:0 8px 24px #891a2b08; }
.use-body > .eyebrow { display:inline-block; padding:3px 9px; color:white; background:var(--story-red); border-radius:3px; }
/* Try: red surround, white working area. No white-on-red long body copy. */
#examples { background:var(--story-red); }
#examples .chapter-label,#support .chapter-label { border-color:#ffffff60; color:#fff; }
#examples .chapter-label small,#support .chapter-label small { color:#fff; }
#examples > .wrap > .section-head h2,#examples > .wrap > .section-head > p { color:#fff; }
#examples > .wrap > .section-head .eyebrow { background:#fff; color:#ae0922; }
.demo-workbench { border:0; box-shadow:0 16px 35px #6f001d28; }
.demo-guide { background:#fff2f3; border-right-color:#efd3d8; }
.demo-steps li>span { background:var(--story-red); color:#fff; border:0; }
.demo-question { border-color:#ecd0d5; border-left:3px solid var(--story-red); }
.demo-question-label { color:#ad1730; }
.demo-question button { color:#a50924; background:#fff2f3; border-color:#e6bdc5; }
.demo-question button:hover { background:#ffe2e7; }
#examples > .wrap > .fine-print { color:#fff; }
.demo-next { padding:22px 0; color:#fff; border-color:#ffffff66; }
.demo-next p,.demo-next a,.demo-next a:hover { color:#fff; }
.demo-examples { border:0; }
#answer-rules { background:#fff; border-bottom:1px solid #efd9dc; }
#answer-rules .section-head { border-left:5px solid var(--story-red); padding-left:22px; }
.answer-rule-steps li>span { background:var(--story-red); border-radius:5px; color:#fff; height:30px; width:30px; display:grid; place-items:center; padding:0; flex-shrink:0; }
.refusal-example { border-color:#e9c6cc; }
.refusal-example-heading { background:#fff1f2; border-bottom-color:#e9c6cc; }
/* Support: the red frame unites the illustration, roles and practical examples. */
#support { background:var(--story-red); }
.support-intro { gap:48px; }
.support-intro h2,.support-intro .section-head>p:not(.eyebrow),.support-foundation { color:#fff; }
.support-intro .section-head .eyebrow { background:#fff; color:#ad0922; }
.support-foundation { border-color:#ffffff66; }
.support-intro img { mix-blend-mode:normal; background:#fcfaf7; border-radius:18px 18px 0 18px; padding:8px; }
.support-columns { border:0; box-shadow:0 12px 30px #78001720; }
.support-step span { color:#b2132b; }
.support-step .draw-icon { stroke:#ae1530; }
.rule-example { background:#fff; border-radius:10px; padding:28px; gap:30px; margin-top:22px; }
.rule-example blockquote { box-shadow:none; background:#fff4f5; border-color:#f0cbd2; }
.responsibilities { border:0; }
#operation { background:#fff; }
.update-steps { background:#fff1f2; border:1px solid #efcdd3; }
.update-steps .draw-icon { stroke:#ab1530; }
.update-steps span { background:var(--story-red); color:#fff; border-color:var(--story-red); }
#security { background:#fff1f2; border-top:1px solid #f0d1d6; }
.safety-grid { gap:20px; }
.safety-grid article { border:0; border-top:3px solid var(--story-red); box-shadow:0 7px 20px #79182b08; }
.safety-grid .mini-icon { background:var(--story-red); color:#fff; }
#schedule { background:#fff; }
.timeline:before { background:#e8b2be; }
.timeline-time span { border-color:var(--story-red); color:var(--story-red); }
.timeline>li:last-child .timeline-time span { background:var(--story-red); }
#price { background:#fff0f2; border-top:7px solid var(--story-red); }
.setup-price { border:1px solid #e4bac3; box-shadow:0 6px 20px #98223907; }
.plans { gap:20px; }
.plan { border:1px solid #e6bdc7; border-top:5px solid var(--story-red); background:#fff; }
.plan h3 { color:#b70b28; }
.monthly strong { color:#b70b28; }
#faq { background:#fff; }
.faq-layout { align-items:start; }
.faq-layout .section-head { background:var(--story-red); color:#fff; border-radius:12px 12px 0 12px; padding:30px; }
.faq-layout .section-head .eyebrow { color:#ad0922; background:#fff; }
.faq-layout .section-head>p:not(.eyebrow) { color:#fff; }
.faq-list details { border-color:#e7c5cd; }
#contact { background:var(--story-red); border:0; padding-block:60px; }
.contact-layout>div:first-child { color:#fff; }
.contact-layout>div:first-child .eyebrow,.contact-layout>div>p:not(.eyebrow) { color:#fff; }
.contact-action { border:0; box-shadow:0 12px 30px #6e001c20; }
.site-footer { border-top:0; }
@media(max-width:1100px) {
 .hero h1 { font-size:36px; }
 .hero-layout { gap:35px; }
 .page-guide a { gap:7px; padding:6px; }
 .page-guide b { font-size:11px; }
 .page-guide small { font-size:8px; }
 .value-strip b { font-size:13px; }
 .value-strip div { gap:3px 10px; padding-left:15px; }
 .faq-layout .section-head { padding:24px; }
}
@media(max-width:900px) {
 .hero { background:linear-gradient(#fff 0 40%,#fff0f2 40%); }
 .hero-layout { gap:30px; }
 .hero-copy { padding-top:0; }
 .hero h1 { font-size:40px; }
 .value-strip { gap:18px; }
 .value-strip div { grid-template-columns:32px 1fr; }
 .value-strip .draw-icon { width:30px; height:30px; }
 .value-strip span { font-size:10px; margin:0; }
 .page-guide { gap:8px; }
 .page-guide a { display:block; text-align:center; border:0; }
 .page-guide span { margin:0 auto 7px; }
 .section-head h2 { font-size:27px; }
 .support-intro { gap:24px; }
 .faq-layout .section-head br { display:initial; }
}
@media(max-width:600px) {
 .section { padding-block:40px; }
 .hero-layout { padding-top:30px; }
 .hero h1 { font-size:clamp(28px,7.8vw,40px); }
 .hero-copy .eyebrow { font-size:10px; padding:6px 8px; }
 .value-strip { grid-template-columns:1fr; gap:0; padding-block:5px; }
 .value-strip div,.value-strip div:first-child { padding:16px 6px; grid-template-columns:36px 1fr; gap:1px 14px; border:0; }
 .value-strip div+div { border-top:1px solid #ffffff50; }
 .value-strip b { font-size:14px; }
 .value-strip span { font-size:11px; }
 .page-guide { grid-template-columns:1fr 1fr; padding-block:17px; gap:8px; }
 .page-guide a { display:flex; text-align:left; justify-content:flex-start; gap:10px; padding:11px 8px; background:#fff3f4; border-radius:5px; }
 .page-guide span { margin:0; width:25px; height:25px; font-size:10px; }
 .page-guide a:last-child { grid-column:1/-1; }
 .page-guide b { font-size:11px; }
 .page-guide small { font-size:9px; }
 .chapter-label { gap:12px; flex-wrap:wrap; margin-bottom:24px; padding-bottom:14px; }
 .chapter-label>span { font-size:34px; }
 .chapter-label>b { font-size:16px; }
 .chapter-label>small { width:100%; margin:0; font-size:11px; }
 .section-head h2 { font-size:24px; }
 #comparison .section-head,#use-cases .section-head,#answer-rules .section-head { padding-left:15px; border-width:4px; }
 .journey,.journey.after { padding:20px; }
 .journey-art { aspect-ratio:1.5; }
 .section-takeaway { padding:17px 18px; }
 .comparison-conclusion { padding:22px; }
 #use-cases { padding-top:40px; }
 .support-intro { gap:24px; }
 .support-intro img { max-width:330px; }
 .rule-example { padding:22px 18px; gap:22px; }
 .refusal-example-heading { gap:7px; }
 .faq-layout .section-head { padding:24px; }
 #contact { padding-block:42px; }
}
@media print {
 .hero,#examples,#support,#contact,.hero-values { background:#fff; color:#111; }
 #examples > .wrap > .section-head h2,#examples > .wrap > .section-head > p,
 .support-intro h2,.support-intro .section-head>p:not(.eyebrow),.support-foundation,
 .contact-layout>div:first-child,.contact-layout>div>p:not(.eyebrow),.chapter-label,
 #examples .chapter-label,#support .chapter-label,.demo-next,.demo-next p,
 #examples > .wrap > .fine-print,.value-strip span { color:#111; }
}