/* Short, indexable product stories. Existing companion visuals are unchanged. */
.use-case-page{--use-case-accent:var(--lime)}.use-case-pink{--use-case-accent:var(--pink)}.use-case-cyan{--use-case-accent:var(--cyan)}.use-case-violet{--use-case-accent:#c6a8ff}
.use-case-main{padding-top:30px;padding-bottom:70px}.use-case-breadcrumb{display:flex;flex-wrap:wrap;gap:10px;font-size:15px;color:var(--muted);margin-bottom:40px}.use-case-breadcrumb a{color:var(--cyan)}
.use-case-hero{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:48px;padding:25px 0 60px}.use-case-hero h1{font:700 clamp(42px,4.7vw,72px)/1.07 var(--font-display);letter-spacing:-.045em;margin:20px 0}.use-case-hero h1>span{display:block;color:var(--use-case-accent)}.use-case-hero .lead{font-size:21px;line-height:1.65;max-width:540px}.use-case-hero .actions{flex-wrap:wrap;margin-top:28px}.use-case-beta{font-size:15px;color:var(--muted);margin-top:20px}
.use-case-preview{margin:0;min-width:0}.use-case-preview>a{display:block;border:1px solid var(--use-case-accent);border-radius:12px;overflow:hidden;box-shadow:0 24px 70px #0007}.use-case-preview img{display:block;width:100%;height:auto}.use-case-preview figcaption{font-size:14px;line-height:1.6;color:var(--muted);padding:14px 0}
.use-case-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;border-top:1px solid var(--line);padding:45px 0}.use-case-benefits article{padding:24px;background:linear-gradient(145deg,#ffffff06,transparent);border:1px solid var(--line);border-top:3px solid var(--use-case-accent)}.use-case-number{font:600 28px var(--font-display);color:var(--use-case-accent)}.use-case-benefits h2{font:600 24px/1.35 var(--font-display);margin:20px 0 12px}.use-case-benefits p{color:var(--muted);font-size:18px;line-height:1.65;margin:0}
.use-case-scenario{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:55px 0;scroll-margin-top:100px}.use-case-scenario h2,.use-case-faq h2,.use-case-next h2{font:600 clamp(30px,3.5vw,48px)/1.2 var(--font-display);margin:18px 0}.use-case-scenario ol{counter-reset:step;list-style:none;padding:0;margin:0;display:grid;gap:22px}.use-case-scenario li{counter-increment:step;position:relative;padding:0 0 20px 54px;border-bottom:1px solid var(--line)}.use-case-scenario li:before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--use-case-accent);color:var(--use-case-accent);font:600 18px var(--font-display)}.use-case-scenario h3{font-size:21px;margin:0 0 10px}.use-case-scenario p{font-size:18px;line-height:1.65;color:var(--muted);margin:0}
.use-case-boundary{border-left:3px solid var(--use-case-accent);padding:18px 22px;background:#ffffff04;font-size:17px;line-height:1.7;color:var(--muted)}.use-case-faq{padding:40px 0}.use-case-faq details{border-bottom:1px solid var(--line);padding:18px 0}.use-case-faq summary{font-size:20px;cursor:pointer;min-height:44px;line-height:1.5}.use-case-faq p{font-size:18px;line-height:1.7;color:var(--muted);max-width:800px}
.use-case-next{display:flex;justify-content:space-between;gap:35px;align-items:center;padding:40px 0;margin-top:20px;border-top:1px solid var(--line)}.use-case-next p{font-size:18px;color:var(--muted)}.use-case-next .actions{display:grid;gap:18px;flex:none}.use-case-related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:35px}.use-case-related a{border:1px solid var(--line);padding:22px;display:grid;gap:12px;transition:border-color .2s}.use-case-related a:hover{border-color:var(--use-case-accent)}.use-case-related span{color:var(--muted);font-size:12px;letter-spacing:.08em}.use-case-related strong{color:var(--cyan);font:600 20px var(--font-display)}
.use-case-index{padding:35px 0 55px;border-top:1px solid var(--line)}.use-case-index h2{font:600 clamp(28px,3.5vw,44px)/1.2 var(--font-display)}.use-case-index>p{font-size:18px;line-height:1.6;color:var(--muted)}.use-case-index nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:25px}.use-case-index a{display:grid;gap:14px;border:1px solid var(--line);padding:24px}.use-case-index a:hover{border-color:var(--cyan)}.use-case-index strong{font:600 22px var(--font-display);color:var(--cyan)}.use-case-index span{font-size:16px;line-height:1.6;color:var(--muted)}
@media(max-width:900px){.use-case-hero{grid-template-columns:1fr;gap:25px}.use-case-hero .lead{max-width:700px}.use-case-benefits{grid-template-columns:1fr}.use-case-scenario{grid-template-columns:1fr;gap:30px}.use-case-next{align-items:flex-start;flex-direction:column}.use-case-related{grid-template-columns:1fr}.use-case-index nav{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.use-case-main{padding-top:18px}.use-case-breadcrumb{font-size:14px;margin-bottom:18px}.use-case-hero{padding-top:0;padding-bottom:30px}.use-case-hero h1{font-size:42px}.use-case-hero .lead{font-size:19px}.use-case-hero .actions{display:grid;grid-template-columns:1fr;gap:12px}.use-case-benefits{padding:25px 0;gap:15px}.use-case-benefits article{padding:20px}.use-case-scenario{padding:30px 0}.use-case-next .actions{width:100%}.use-case-index nav{grid-template-columns:1fr}.use-case-preview figcaption{font-size:14px}.use-case-boundary{padding:16px}.use-case-faq summary{font-size:18px}}
@media(prefers-reduced-motion:reduce){.use-case-related a{transition:none}}

/* Compact entry points on the landing page; no extra wall of copy. */
.use-case-shortcuts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:24px 0 32px;border-bottom:1px solid var(--line)}
.use-case-shortcuts p{grid-column:1/-1;margin:0 0 4px;font-size:15px;color:var(--muted)}
.use-case-shortcuts a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px;padding:16px;border:1px solid var(--line);font:600 19px/1.4 var(--font-display)}
.use-case-shortcuts a span{color:var(--lime)}
.use-case-shortcuts a:hover{border-color:var(--cyan);background:#ffffff05}
.use-case-shortcuts a:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
@media(max-width:900px){.use-case-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.use-case-shortcuts a{font-size:17px;padding:12px;min-height:64px}}
