/* © 2026 David Sommerville. All rights reserved. */
.sb-teaser{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(210px,.6fr);gap:35px;align-items:center;padding:34px;margin:0 0 40px;background:radial-gradient(ellipse at right,#346a9970,transparent 70%),linear-gradient(135deg,#24364b,#112138);border:1px solid #b4d6f64a;border-radius:24px;overflow:hidden}.sb-teaser-copy h2{font-size:clamp(30px,3vw,46px);line-height:1.08;margin:15px 0 20px}.sb-teaser-copy>p{font-size:14px;line-height:1.8;max-width:530px}.sb-teaser-copy .kicker{font-size:10px}.sb-teaser-copy label{display:grid;gap:8px;max-width:280px;color:#c2d9ef;font-size:12px;margin:20px 0}.sb-teaser select{color:#edf5ff;background:#12283e;border:1px solid #91b4d865;border-radius:12px;padding:12px;font-size:14px;width:100%}.sb-teaser-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.sb-teaser-actions .button,.sb-start{background:linear-gradient(135deg,#ffe785,#ffc536);color:#251900;border:1px solid #ffeaa0;font-weight:700;box-shadow:0 8px 20px #c9a33f25}.sb-teaser-actions .button{font-size:13px;padding:13px 19px}.sb-teaser-actions .text-link{font-size:13px}.sb-teaser-copy .sb-teaser-credit{font-size:11px;color:#a9c2d9;margin:20px 0 0}.sb-teaser-device{text-align:center}.sb-teaser-device [data-teaser-preview]{max-width:235px;margin:0 auto}.sb-teaser-device svg{display:block;width:100%;filter:drop-shadow(0 10px 15px #0004)}.sb-teaser-device img{width:100%;height:auto}.sb-start{padding:11px 30px;border-radius:30px;cursor:pointer;margin:10px auto}.sb-teaser-device small{display:block;color:#b3c9df;font-size:10px;margin-top:4px}.sb-teaser .sb-teaser-status{font-size:12px}.sb-teaser :focus-visible{outline:2px solid #ffe16b;outline-offset:4px}.sb-teaser button:disabled{opacity:.5}main#content>.sb-teaser{margin:50px auto;max-width:1180px;width:calc(100% - 10%)}@media(max-width:740px){.sb-teaser{grid-template-columns:1fr;padding:24px;gap:20px}.sb-teaser-device [data-teaser-preview]{max-width:210px}.sb-teaser-copy h2{font-size:33px}.sb-teaser-actions{gap:15px}}
main#content>.principles:has(+.sb-teaser){padding-bottom:20px}main#content>.principles+.sb-teaser{margin-top:20px}