/* LlamaBox 1.1 product story. Existing site tokens keep both themes coherent. */
.static-hero h1{font-size:clamp(2.8rem,4.9vw,4.4rem);line-height:1.04;text-wrap:balance}
.static-hero .accent-text{background:none;color:var(--accent-dark);-webkit-text-fill-color:currentColor}
:root[data-theme="dark"] .static-hero .accent-text{color:var(--accent-light)}
.release-preview{display:inline-block;color:var(--text);background:var(--accent-soft);border:1px solid var(--border-accent);border-radius:999px;padding:.35rem .8rem;font:600 .75rem var(--sans);letter-spacing:.05em}
.product-story{padding:clamp(3rem,7vw,6rem) 0;scroll-margin-top:90px}
.product-story h2{font:500 clamp(2.3rem,5vw,4.8rem)/1.05 var(--serif);letter-spacing:-.03em;max-width:850px;margin:1rem 0 1.4rem;text-wrap:balance}
.product-story .story-intro{max-width:700px;color:var(--text-dim);font-size:1.1rem}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:start;margin-top:2.5rem}
.story-grid>*{min-width:0}.story-grid figure{margin:0}.story-grid img{max-width:100%;height:auto}.story-note{font-size:.85rem;color:var(--text-dim);line-height:1.6;margin-top:1rem}
.document-demo{background:var(--surface-solid);border:1px solid var(--border-accent);border-radius:24px;padding:clamp(1.25rem,3vw,2rem);box-shadow:0 24px 80px #0002}
.demo-top{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font:600 .75rem var(--sans);color:var(--text-dim);padding-bottom:1.2rem;border-bottom:1px solid var(--border)}
.demo-question{border-radius:16px 16px 4px 16px;background:var(--accent-soft);padding:1rem 1.25rem;margin:1.5rem 0 1.5rem 12%;font-size:1rem;color:var(--text)}
.demo-answer{line-height:1.7;color:var(--text)}.source-preview{margin-top:1.5rem;border:1px solid var(--border-accent);border-radius:14px;overflow:hidden}
.source-preview summary{cursor:pointer;min-height:48px;padding:.8rem 1rem;color:var(--text);font-weight:600;background:var(--accent-soft)}
.source-preview blockquote{margin:1rem;padding:0 0 0 1rem;border-left:2px solid var(--accent);color:var(--text-dim);font-size:.95rem}
.source-preview .source-label{padding:0 1rem;font-size:.8rem;color:var(--text-dim)}
.format-list{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.5rem 0}.format-list span{padding:.55rem .8rem;border:1px solid var(--border);border-radius:8px;font-size:.8rem;color:var(--text)}
.story-steps{padding-left:1.5rem;color:var(--text-dim)}.story-steps li{padding:.6rem 0 .6rem .3rem}.story-steps strong{color:var(--text)}
.capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2rem}.capability-card{display:flex;flex-direction:column;align-items:flex-start;padding:2rem;border:1px solid var(--border);background:var(--surface);border-radius:20px}
.capability-card .card-number{font:.8rem var(--sans);color:var(--text-dim);letter-spacing:.08em}.capability-card h3{font:500 1.8rem/1.2 var(--serif);margin:1.2rem 0 .8rem}.capability-card p{color:var(--text-dim);font-size:.95rem;flex:1}.capability-card a{margin-top:.75rem;min-height:44px;display:inline-flex;align-items:center;color:var(--text);text-decoration:underline;text-underline-offset:5px}
.campaign-band{position:relative;border-radius:24px;overflow:hidden;margin:2rem 0;background:#09080e;isolation:isolate}.campaign-band img{display:block;width:100%;height:auto}.campaign-band figcaption{position:absolute;left:5%;top:15%;width:43%;color:#f4f2fa}.campaign-band figcaption strong{display:block;font:500 clamp(1.4rem,4vw,3.6rem)/1.07 var(--serif);text-wrap:balance}.campaign-band figcaption span{display:block;font:.8rem var(--sans);margin-top:1rem;color:#c4b5fd}
.feature-nav{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0}.feature-nav a{border:1px solid var(--border-accent);border-radius:999px;min-height:44px;padding:.6rem 1rem;display:inline-flex;align-items:center;color:var(--text);font-size:.85rem;text-decoration:none}.feature-nav a:hover{background:var(--accent-soft)}
.preview-banner{border-left:3px solid var(--accent);background:var(--accent-soft);padding:1rem 1.25rem;color:var(--text-dim);font-size:.9rem;margin:1.5rem 0}.preview-banner strong{color:var(--text)}
.feature-page .page-hero{padding-bottom:2rem}.feature-page .prose pre{overflow:auto;max-width:100%;padding:1.25rem;border:1px solid var(--border);border-radius:12px;background:var(--surface-solid);font-size:.85rem}.feature-page .prose code{overflow-wrap:anywhere}
@media(max-width:760px){.story-grid,.capability-grid{grid-template-columns:1fr}.product-story h2{font-size:2.8rem}.campaign-band figcaption{position:static;width:auto;padding:1.5rem}.campaign-band figcaption strong{font-size:2rem}.campaign-band img{aspect-ratio:16/9;object-fit:cover}.capability-card{padding:1.5rem}}