/* Homepage base tokens/reset scoped to its embedded lightbox. Load before the
   verbatim homepage player CSS so these do not override component rules. */
@font-face{font-family:'Source Sans 3';src:url('assets/source-sans-3.woff2') format('woff2');font-weight:200 900;font-display:swap}
.demo-lightbox{--charcoal:#1A1D1E;--gray:#3D4246;--font-serif:'Libre Baskerville',Georgia,serif;--font-sans:'Source Sans 3',-apple-system,sans-serif;--touch-target:56px;color:var(--charcoal);font:20px/1.6 var(--font-sans)}
@media(max-width:767px){.demo-lightbox{font-size:18px}}
.demo-lightbox *,.demo-lightbox *::before,.demo-lightbox *::after{box-sizing:border-box;margin:0;padding:0}
:where(.demo-lightbox) p+p{margin-top:0}:where(.demo-lightbox) p{color:inherit}
:where(.demo-lightbox) button{line-height:normal}
:where(.demo-lightbox) .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--touch-target);padding:15px 36px;border-radius:50px;font:700 19px/1.2 var(--font-sans);text-decoration:none;cursor:pointer;border:none;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
:where(.demo-lightbox) .btn-primary{background:var(--coral);color:var(--white)}
:where(.demo-lightbox) .btn-primary:hover{background:var(--coral-dark);transform:scale(1.04);box-shadow:0 4px 20px rgba(198,123,92,.4)}
/* Preserve the homepage format; fix its inherited small-text contrast only. */
#demo-lightbox .demo-lightbox-close{opacity:1}
/* Keep the mobile close control clear of the phone status bar and overlays. */
@media(max-width:600px){#demo-lightbox .demo-lightbox-close{top:max(44px,calc(env(safe-area-inset-top) + 36px));z-index:40}}
#demo-lightbox .iphone-screen .phone-msg .phone-speaker,#demo-lightbox .iphone-screen .phone-btn-hangup.call-state,#demo-lightbox .iphone-screen .phone-btn-photo{color:var(--coral-dark)}
#demo-lightbox .iphone-screen .phone-cta-overlay .phone-btn-download,#demo-lightbox .phone-final-cta{background:var(--coral-dark)}
