.screen-carousel{display:grid;grid-template-columns:340px minmax(0,1fr);align-items:center;gap:65px;max-width:920px;margin:35px auto}.carousel-viewer{touch-action:pan-y;cursor:grab;outline-offset:6px}.carousel-phone{width:304px;height:654px;border:8px solid #172b3e;border-radius:39px;overflow:hidden;background:#172b3e;position:relative;margin:auto;box-shadow:0 18px 45px #172b3e22}.carousel-phone iframe{width:390px;height:850px;transform:scale(.738462);transform-origin:top left;border:0;display:block;pointer-events:none;background:white}.carousel-phone>i{position:absolute;top:7px;left:106px;width:76px;height:17px;background:#172b3e;border-radius:15px}.carousel-eyebrow{font-size:9px;font-weight:750;letter-spacing:1.8px;color:#526b82}.carousel-title{font-size:30px!important;line-height:1.2;letter-spacing:-.8px;margin:15px 0!important;color:#17324a}.carousel-count{font-size:12px;color:#607587}.carousel-controls{display:flex;align-items:center;gap:14px;margin:23px 0}.carousel-controls button{width:42px;height:42px;border:1px solid #b8c7d5;border-radius:50%;background:white;color:#17324a;font-size:20px;cursor:pointer}.carousel-controls span{font-size:11px;color:#607587}.carousel-picker{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}.carousel-picker button{font:inherit;font-size:10px;line-height:1.5;cursor:pointer;background:white;color:#536a7d;border:1px solid #c4d0dc;border-radius:6px;padding:9px 11px}.carousel-picker button[aria-pressed=true]{background:#17324a;border-color:#17324a;color:white}.carousel-explore{display:inline-block;padding:12px 0;font-size:12px;font-weight:bold;color:#204bc3}.screen-carousel button:focus-visible,.carousel-viewer:focus-visible{outline:3px solid #2863d4;outline-offset:3px}@media(max-width:700px){.screen-carousel{grid-template-columns:1fr;gap:27px;margin:25px auto}.carousel-details{text-align:center;max-width:440px;margin:auto}.carousel-controls,.carousel-picker{justify-content:center}.carousel-title{font-size:24px!important}.carousel-phone{width:288px;height:619px;border-width:8px}.carousel-phone iframe{transform:scale(.697436)}.carousel-phone>i{left:99px}.carousel-count{margin:10px 0}.carousel-picker{margin:20px 0}.carousel-picker button{font-size:9px;padding:8px}.carousel-explore{padding:0}}@media(max-width:350px){.carousel-phone{width:258px;height:554px}.carousel-phone iframe{transform:scale(.620513)}.carousel-phone>i{left:84px}}

.carousel-display{min-width:0}.carousel-display .carousel-controls{justify-content:center;margin:12px 0 0;gap:16px}.carousel-display .carousel-controls button{width:38px;height:38px}.carousel-display .carousel-controls span{white-space:nowrap}@media(max-width:700px){.screen-carousel{gap:20px}.carousel-display .carousel-controls{margin-top:10px}}@media(max-width:700px) and (max-height:750px){.carousel-phone{width:258px;height:544px}.carousel-phone iframe{transform:scale(.620513)}.carousel-phone>i{left:84px}}

.preview-site-header,.header{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 2px 10px #172b3e0d}.preview-site-header{max-width:none;padding:14px 25px}.nav-home{display:inline-flex;align-items:center;justify-content:center;background:#17324a;color:white!important;border-radius:22px;padding:10px 17px;font-size:12px;font-weight:750;text-decoration:none;white-space:nowrap}.nav-home:focus-visible{outline:3px solid #f9a825;outline-offset:3px}.builder-main,.screens-showcase{scroll-margin-top:85px}@media(max-width:700px){.preview-site-header{padding:10px 16px}.header{padding-top:12px!important;padding-bottom:12px!important}.header nav{gap:12px}.header .brand{font-size:17px}.header .brandmark{width:35px;height:35px;font-size:20px}.nav-home{padding:9px 13px;font-size:11px}}

/* The decorative notch must not cover reminder header text. */
body[data-product="reminder"] .carousel-phone>i{display:none}
body[data-product="card-vault"] .carousel-phone>i{display:none}

/* Keep the complete app header visible in every gallery preview. */
.carousel-phone>i{display:none!important}