/* Demo layout only. Header/footer, type tokens and buttons use unchanged site CSS. */
.bedrock-demo .demo-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'hero booking' 'agenda booking';gap:48px 60px;padding-top:148px;padding-bottom:80px;align-items:start}
.bedrock-demo .demo-hero{grid-area:hero}
.bedrock-demo .audience{margin-bottom:28px}
.bedrock-demo main .primary-btn,.bedrock-demo main .outline-btn{display:inline-block;text-align:center}
.bedrock-demo .helper{font-size:14px;margin-top:16px}
.bedrock-demo .booking{grid-area:booking;min-width:0;padding:32px;border:1px solid var(--glass-border-light);border-radius:20px;background:var(--color-navy-light)}
.bedrock-demo main h2{font-family:var(--font-heading);color:var(--color-navy-primary);font-size:28px;line-height:1.25;margin-bottom:20px}
.bedrock-demo #book-meeting{scroll-margin-top:120px}
.bedrock-demo .booking-intro{margin-bottom:24px}
.bedrock-demo .calendar-space{padding:32px 24px;background:var(--color-white);border:1px solid var(--glass-border-light);border-radius:10px;margin-bottom:24px}
.bedrock-demo .state-label{font-family:var(--font-mono);font-size:12px;letter-spacing:1px;margin-bottom:16px}
.bedrock-demo .state-heading{font-family:var(--font-heading);font-size:24px;color:var(--color-navy-primary);font-weight:700;margin-bottom:16px}
.bedrock-demo .privacy-helper,.bedrock-demo .preview-note{font-size:12px;margin:16px 0}
.bedrock-demo main a:not(.primary-btn):not(.outline-btn){color:var(--color-navy-primary)}
.bedrock-demo .agenda{grid-area:agenda}
.bedrock-demo .agenda ol{padding-left:24px}
.bedrock-demo .agenda li{padding-left:8px;margin-bottom:20px}
.bedrock-demo .agenda li p{margin-top:4px}
.bedrock-demo .skip-link{position:fixed;top:-100px;left:16px;z-index:10000;background:white;padding:12px}
.bedrock-demo .skip-link:focus{top:8px}
.bedrock-demo main :focus-visible,.bedrock-demo #book-meeting:focus{outline:3px solid var(--color-navy-primary);outline-offset:5px}
@media(max-width:1023px){.bedrock-demo .demo-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'hero' 'booking' 'agenda';gap:40px;padding-top:132px}.bedrock-demo .booking{max-width:680px}}
@media(max-width:480px){.bedrock-demo .booking{padding:24px 16px}.bedrock-demo main .primary-btn,.bedrock-demo main .outline-btn{padding:16px;max-width:100%;font-size:14px}.bedrock-demo main h2{font-size:26px}}
.bedrock-demo .demo-layout{padding-top:calc(var(--demo-header-height,100px) + 48px)}
.bedrock-demo #book-meeting{scroll-margin-top:calc(var(--demo-header-height,100px) + 24px)}

/* Compact booking panel: no placeholder calendar or internal status copy. */
.bedrock-demo .booking .primary-btn{display:block;width:100%;box-sizing:border-box}

.bedrock-demo .demo-hero-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}

/* Value-led booking card, scoped to this landing page. */
.bedrock-demo .demo-layout{grid-template-areas:'hero booking'}
.bedrock-demo .booking{background:#122448;color:#e3e8f0;padding:40px;border:1px solid #263959;border-radius:20px;box-shadow:0 16px 40px rgba(18,36,72,.12)}
.bedrock-demo .booking .section-rule{width:48px;height:4px;background:#85c54d;margin-bottom:24px}
.bedrock-demo .booking h2{color:#fff;font-size:32px;margin-bottom:16px}
.bedrock-demo .booking-intro{color:#e3e8f0;line-height:1.65;margin-bottom:28px}
.bedrock-demo .booking-agenda ol{list-style:none;padding:0;margin:0 0 32px;counter-reset:agenda}
.bedrock-demo .booking-agenda li{position:relative;padding:20px 0 20px 40px;margin:0;border-top:1px solid #40516e;counter-increment:agenda}
.bedrock-demo .booking-agenda li:before{content:'0' counter(agenda);position:absolute;left:0;top:22px;font-family:var(--font-mono);font-size:12px;color:#85c54d}
.bedrock-demo .booking-agenda strong{color:#fff;font-size:17px}
.bedrock-demo .booking-agenda p{color:#e3e8f0;font-size:15px;line-height:1.6;margin:6px 0 0}
.bedrock-demo .booking .primary-btn{background:#85c54d;color:#122448;border:1px solid #85c54d}
.bedrock-demo .booking .primary-btn:hover{background:#97d45f;color:#122448;border-color:#97d45f}
.bedrock-demo .booking :focus-visible,.bedrock-demo .booking #book-meeting:focus{outline-color:#85c54d}
@media(max-width:1023px){.bedrock-demo .demo-layout{grid-template-areas:'hero' 'booking'}}
@media(max-width:480px){.bedrock-demo .booking{padding:28px 20px}.bedrock-demo .booking h2{font-size:27px}}
