/* Real product screens, in their native proportions and original colours. */
.seed-demo { --screen-green:#17634f; border:1px solid #c8dcd2; border-radius:14px; background:#fff; overflow:hidden; box-shadow:0 20px 60px #15382a0a; }
.seed-demo__tabs { display:flex; flex-wrap:wrap; align-items:center; gap:4px; padding:12px 16px; border-bottom:1px solid #d2e1d9; background:#f6faf8; }
.seed-demo__tabs a { display:flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1px solid transparent; border-radius:7px; color:#345749; font-size:14px; font-weight:500; line-height:1.4; text-decoration:none; }
.seed-demo__tabs a:hover { background:#e8f2ec; color:#124834; }
.seed-demo__tabs a[aria-selected="true"] { background:#17634f; color:#fff; border-color:#17634f; }
.seed-demo__panel { display:grid; grid-template-columns:minmax(0,1fr) 248px; align-items:center; margin:0; scroll-margin-top:110px; }
.seed-demo__panel+.seed-demo__panel { border-top:1px solid #c8dcd2; }
.seed-demo.is-ready .seed-demo__panel { border-top:0; }
.seed-demo__screen { position:relative; display:block; min-width:0; padding:20px; background:#eaf1ed; cursor:zoom-in; }
.seed-demo__screen img { display:block; width:100%; height:auto; aspect-ratio:1440/1119; object-fit:contain; object-position:center; filter:none; border:1px solid #d6e2db; border-radius:6px; background:#f5f8f6; }
.seed-demo__enlarge { display:flex; align-items:center; justify-content:flex-end; gap:10px; min-height:40px; margin-top:5px; color:#215542; font-size:13px; font-weight:500; }
.seed-demo__enlarge>span { font-size:18px; }
.seed-demo__screen:hover .seed-demo__enlarge { text-decoration:underline; text-underline-offset:4px; }
.seed-demo__panel figcaption { padding:28px; }
.seed-demo__panel figcaption h3 { font-size:clamp(24px,2.2vw,32px); line-height:1.16; color:#153c2e; letter-spacing:-.035em; }
.seed-demo__panel figcaption p { margin:18px 0 0; color:#486055; font-size:16px; line-height:1.65; }
.seed-demo__note { margin:0; padding:14px 20px; border-top:1px solid #d2e1d9; color:#486055; font-size:13px; line-height:1.6; }
.seed-demo-scope { margin-top:24px; }
.seed-demo-scope .product-workspace__guide { padding:24px 0 0; border:0; background:transparent; }
.seed-demo-scope .product-workspace__guide>h3 { font-size:20px; }
.seed-demo-scope .product-workspace__guide dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; }
.seed-demo-scope .product-workspace__guide dl>div { border:0; padding:18px 0 0; }
.seed-screen-viewer { position:fixed; inset:0; width:calc(100vw - 48px); height:calc(100dvh - 48px); max-width:1760px; max-height:none; margin:auto; padding:0; border:1px solid #bacfc3; border-radius:12px; background:#eef4f0; color:#173c2e; box-shadow:0 30px 100px #061b2166; overflow:hidden; }
.seed-screen-viewer::backdrop { background:#0a1f24c9; backdrop-filter:blur(5px); }
.seed-screen-viewer[open] { display:flex; flex-direction:column; }
.seed-screen-viewer__bar { display:flex; flex:none; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 24px; padding:12px 20px; background:#fff; border-bottom:1px solid #c8dcd2; }
.seed-screen-viewer__bar h2 { margin:0; color:#173c2e; font:500 17px/1.4 "Inter",sans-serif; letter-spacing:-.02em; }
.seed-screen-viewer__bar>div { display:flex; gap:8px; }
.seed-screen-viewer__bar button { min-height:44px; padding:10px 16px; border:1px solid #b9cec2; border-radius:6px; background:#fff; color:#1a533c; font:500 14px/1.4 "Inter",sans-serif; cursor:pointer; }
.seed-screen-viewer__bar button:hover { background:#e6f1ea; }
.seed-screen-viewer__bar [data-seed-close] { background:#17634f; color:#fff; border-color:#17634f; }
.seed-screen-viewer__bar [data-seed-close]:hover { background:#114735; }
.seed-screen-viewer__bar [data-seed-close] span { margin-left:10px; font-size:19px; line-height:1; }
.seed-screen-viewer__viewport { flex:1; min-height:0; width:100%; overflow:auto; overscroll-behavior:contain; padding:16px; }
.seed-screen-viewer__viewport img { display:block; width:100%; height:100%; object-fit:contain; filter:none; }
.seed-screen-viewer.is-zoomed .seed-screen-viewer__viewport img { width:1440px; height:auto; max-width:none; }
.seed-demo a:focus-visible,.seed-screen-viewer :focus-visible { outline:3px solid #17634f; outline-offset:-3px; }
.seed-demo__panel[hidden] { display:none; }
@media(max-width:1000px) {
 .seed-demo__panel { grid-template-columns:minmax(0,1fr); }
 .seed-demo__panel figcaption { display:grid; grid-template-columns:1fr 1.2fr; gap:24px; padding:24px; }
 .seed-demo__panel figcaption p { margin:0; }
 .seed-demo__screen img { max-height:640px; }
}
@media(max-width:720px) {
 .seed-demo__tabs { gap:4px; padding:8px; }
 .seed-demo__tabs a { flex:1 1 auto; padding:9px 12px; }
 .seed-demo__screen { padding:12px; }
 .seed-demo__panel figcaption { display:block; padding:20px; }
 .seed-demo__panel figcaption h3 { font-size:26px; }
 .seed-demo__panel figcaption p { margin-top:12px; }
 .seed-demo__note { padding:14px 20px; }
 .seed-demo-scope .product-workspace__guide dl { grid-template-columns:1fr; gap:4px; }
 .seed-screen-viewer { width:100vw; height:100dvh; border:0; border-radius:0; }
 .seed-screen-viewer__bar { padding:10px 14px; }
 .seed-screen-viewer__bar h2 { width:100%; font-size:16px; }
 .seed-screen-viewer__bar>div { margin-left:auto; }
 .seed-screen-viewer__viewport { padding:8px; }
}
@media print {
 .seed-demo__tabs,.seed-demo__enlarge,.seed-screen-viewer { display:none!important; }
 .seed-demo { box-shadow:none; }
 .seed-demo__panel,.seed-demo__panel[hidden] { display:block!important; break-inside:avoid; }
 .seed-demo__screen { padding:12px; }
 .seed-demo__screen img { width:100%; height:auto; aspect-ratio:auto; max-height:none; }
 .seed-demo__panel figcaption { padding:16px; }
}
