
/* Website demo showcase: shared with the WordPress shortcode. */
.zen-demos{background:#F2F3FA;color:#1C1D21;padding:80px 24px;font-family:Inter,Arial,sans-serif;}
.zen-demos *{box-sizing:border-box;}
.zen-demos-inner{max-width:1280px;margin:0 auto;}
.zen-demos-heading{text-align:center;max-width:780px;margin:0 auto 44px;}
.zen-demos .zen-demos-eyebrow{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin:0 0 20px;}
.zen-demos h2{font-family:"DM Sans",Arial,sans-serif;font-size:clamp(32px,4vw,56px);line-height:1.08;letter-spacing:-.035em;margin:0 0 22px;font-weight:500;}
.zen-demos-heading>p:last-child{font-size:17px;line-height:1.7;max-width:650px;margin:0 auto;}
.zen-demo-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;}
.zen-demo-card{min-width:0;background:#fff;border:1px solid #BFC8E8;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;}
.zen-demo-preview{display:block;background:#1C1D21;overflow:hidden;}
.zen-demo-browser{display:flex;align-items:center;gap:6px;padding:13px 18px;background:#fff;border-bottom:1px solid #e6e7ef;}
.zen-demo-browser i{width:7px;height:7px;background:#BFC8E8;border-radius:50%;}
.zen-demo-browser>span{margin-left:8px;font-size:11px;color:#545661;letter-spacing:.02em;}
.zen-demo-preview img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:filter .2s;}
.zen-demo-preview:hover img{filter:brightness(1.1);}
.zen-demo-copy{padding:28px;display:flex;flex-direction:column;align-items:flex-start;flex:1;}
.zen-demo-copy .zen-demo-label{font-size:12px;letter-spacing:.04em;color:#545661;margin:0 0 12px;}
.zen-demo-copy h3{font:500 30px/1.2 "DM Sans",Arial,sans-serif;letter-spacing:-.025em;margin:0 0 14px;}
.zen-demo-copy>p:not(.zen-demo-label){font-size:16px;line-height:1.65;margin:0 0 24px;}
.zen-demos a.zen-demo-button{display:inline-flex;align-items:center;gap:26px;margin-top:auto;padding:13px 20px;border:1px solid #1C1D21;border-radius:10px;background:#1C1D21;color:#DFF994;font-size:14px;font-weight:600;line-height:1.5;text-decoration:none;transition:background .2s,color .2s;}
.zen-demos a.zen-demo-button:hover{background:#DFF994;color:#1C1D21;text-decoration:none;}
.zen-demos a:focus-visible{outline:3px solid #6973ad;outline-offset:4px;}
.zen-demos .zen-demo-note{text-align:center;font-size:13px;color:#545661;margin:28px 0 0;}
.zen-demo-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media(max-width:767px){.zen-demos{padding:56px 20px;}.zen-demo-list{grid-template-columns:1fr;}.zen-demo-copy{padding:24px;}.zen-demos-heading{margin-bottom:30px;}.zen-demo-copy h3{font-size:26px;}}

.zen-demos{scroll-margin-top:88px;}
.zen-demos .zen-demos-heading a{color:inherit;font-weight:600;text-decoration:underline!important;text-decoration-thickness:1px;text-underline-offset:3px}
.zen-demos .zen-demos-heading a:hover,.zen-demos .zen-demos-heading a:focus-visible{text-decoration-thickness:2px}

/* Deep links from client footers (/our-work/#slug) land below the sticky header */
.zen-demo-card{scroll-margin-top:120px}
