@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');
:root{--ink:#11192a;--muted:#61708a;--line:#e7eaf1;--paper:#f7f8fb;--navy:#121d33;--coral:#ec654f;--gold:#f3c660}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}a{text-decoration:none;color:inherit}.topbar{height:82px;max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;align-items:center;gap:9px;font-size:24px;font-weight:700;letter-spacing:-1px}.brand img{border-radius:11px}.nav-links{display:flex;gap:30px;color:#59657a;font-size:14px}.button,.ghost{border:0;border-radius:9px;background:var(--navy);color:#fff;padding:13px 19px;font-size:14px;font-weight:600;display:inline-block;cursor:pointer}.button.small{padding:10px 16px}.ghost{background:transparent;border:1px solid #d9dee7;color:var(--ink);margin-left:auto;margin-right:12px}.hero{text-align:center;padding:87px 24px 0;background:radial-gradient(ellipse at 50% 32%,#fff 0,#f7f8fb 58%)}.eyebrow{color:#6b7282;font:500 11px 'DM Mono';letter-spacing:.11em;text-transform:uppercase;display:flex;gap:9px;align-items:center}.hero .eyebrow{justify-content:center}.eyebrow span{height:7px;width:7px;border-radius:50%;background:var(--coral);display:inline-block}.hero h1{font:700 clamp(46px,6.5vw,82px)/1.05 'Playfair Display';letter-spacing:-.055em;margin:21px 0}.hero h1 em{color:var(--coral);font-weight:600}.hero>p:not(.status){font-size:18px;line-height:1.6;color:var(--muted);max-width:590px;margin:0 auto}.hero-actions{display:flex;justify-content:center;align-items:center;gap:23px;margin:29px 0 5px}.text-button{border:0;background:transparent;color:#39465c;font-weight:600;cursor:pointer;font-size:14px}.text-button span{color:var(--coral);margin-left:5px}.status{min-height:18px;color:#35755c;font-size:13px;margin:0}.product-window{max-width:1170px;margin:56px auto 0;border:1px solid #dbe1ea;border-radius:13px 13px 0 0;box-shadow:0 22px 50px #1720401c;background:#fff;text-align:left;overflow:hidden}.window-bar{height:52px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 16px;gap:18px}.dots{display:flex;gap:5px}.dots i{height:7px;width:7px;border-radius:50%;background:#e6e8ed}.dots i:first-child{background:#f08c7b}.search{margin:auto;width:43%;border:1px solid var(--line);color:#8a94a5;background:#fafbfc;border-radius:6px;padding:6px 12px;font-size:11px}.avatar{background:#f4c85e;border-radius:50%;width:24px;height:24px;text-align:center;padding-top:4px;font-size:11px}.workspace{height:477px;display:grid;grid-template-columns:190px 42% 1fr}.workspace aside{border-right:1px solid var(--line);padding:18px 11px;display:flex;flex-direction:column;font-size:12px;color:#59667d}.workspace-name{font-weight:600;color:#242f42;padding:0 7px 15px}.workspace-name span{float:right}.compose{border:0;background:#f9e9e6;color:#c95442;padding:9px;border-radius:6px;text-align:left;font:600 12px 'DM Sans';cursor:pointer}.workspace ul{list-style:none;padding:12px 0;margin:0;line-height:2.7}.workspace li{padding:0 7px;border-radius:5px}.workspace li.active{background:#f4f6f9;color:#121d33}.workspace li strong{float:right;font-size:10px}.aside-bottom{margin-top:auto;line-height:2;color:#8b94a4;padding-left:7px}.message-list{border-right:1px solid var(--line)}.message-list header,.reader-top{height:65px;padding:19px 18px 0;display:flex;justify-content:space-between}.message-list h2,.reader h2{font-size:16px;margin:0}.icon-button{border:0;background:transparent;color:#6f7b8d;cursor:pointer}.filters{height:37px;border-bottom:1px solid var(--line);font-size:11px;display:flex;gap:21px;padding:4px 18px;color:#8490a1}.filters b{color:var(--coral);border-bottom:2px solid var(--coral);padding-bottom:11px}.email{padding:14px 14px;display:flex;gap:10px;border-bottom:1px solid #edf0f5;font-size:11px;color:#728096}.email.unread{background:#fffdfc}.sender-icon{height:28px;width:28px;border-radius:50%;color:#fff;text-align:center;padding-top:8px;font-size:10px;font-weight:700}.coral{background:#e87e6c}.blue{background:#7594c7}.yellow{background:#d6a63c}.email h3{margin:0 0 3px;font-size:12px;color:#303c50}.email.unread h3,.email.unread p{color:#172035}.email time{float:right;font-size:9px;font-weight:400;color:#8995a6}.email p{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}.tag{font-size:8px;display:inline-block;padding:2px 5px;border-radius:3px;margin-top:5px}.coral-text{background:#fff0ed;color:#d66552}.blue-text{background:#edf3ff;color:#6686bc}.yellow-text{background:#fff6dd;color:#ac8327}.reader{padding:0 23px;font-size:12px;line-height:1.6;color:#59677c}.reader-top{padding:19px 0 0;height:61px;color:#dd6b59;font-size:11px;font-weight:600}.reader h2{font-size:18px;color:#202b3d;margin:2px 0 9px}.from{font-size:11px;margin-bottom:17px}.from span{color:#96a0af}.summary{display:flex;gap:11px;background:#f8f2ef;border-left:3px solid var(--coral);padding:10px;margin:0 0 20px}.summary>span{color:var(--coral)}.summary p{margin:2px 0}.summary a{font-size:10px;color:#d66351;font-weight:600}.reply-actions{position:absolute;bottom:20px}.reply-actions button{background:#fff;border:1px solid #dce1e9;border-radius:5px;padding:6px 12px;color:#536177;font-size:11px}.metrics{max-width:1050px;margin:0 auto;padding:50px 25px 78px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:center}.metrics div{border-right:1px solid #dde2ea}.metrics div:last-child{border:0}.metrics b,.metrics span{display:block}.metrics b{font-size:15px}.metrics span{font-size:12px;color:#718097;margin-top:5px}.features{padding:86px max(7%,24px);background:#111c31;color:#fff;display:grid;grid-template-columns:1fr 1.4fr;gap:80px}.features h2,.notification-card h2,.pricing h2{font:600 clamp(36px,4vw,58px)/1.08 'Playfair Display';letter-spacing:-.04em;margin:21px 0}.features .eyebrow{color:#aeb8ca}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:37px 56px}.feature-grid article>span{font-size:21px;color:#f17a67}.feature-grid h3{font-size:16px;margin:11px 0 7px}.feature-grid p{font-size:13px;line-height:1.6;color:#abb5c5;margin:0}.notification-card{max-width:1050px;margin:0 auto;padding:95px 25px;display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:100px}.notification-card h2{font-size:48px}.notification-card p{font-size:15px;line-height:1.65;color:var(--muted);max-width:540px}.phone{height:330px;width:180px;margin:auto;background:#172238;border:7px solid #172238;border-radius:25px;color:white;padding:11px;box-shadow:0 14px 35px #19243c35}.phone-top{text-align:center;font-size:9px}.notification{background:#f6f7fb;color:#182238;border-radius:10px;margin-top:47px;padding:8px;display:flex;gap:7px;font-size:9px}.notification img{height:24px;width:24px;border-radius:7px}.notification p{color:#263349;font-size:8px;line-height:1.3;margin:1px 0}.notification small{font-size:7px;color:#7d8796}.phone-lock{text-align:center;margin-top:180px}.pricing{text-align:center;padding:70px 24px 85px;background:#f2eee9}.pricing .eyebrow{justify-content:center}.pricing h2{margin:18px 0 29px}footer{height:90px;max-width:1190px;margin:auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#768297}footer .brand{font-size:20px;color:var(--ink)}
@media(max-width:760px){.topbar{height:68px}.nav-links,.topbar .button.small{display:none}.ghost{margin-left:auto}.hero{padding-top:55px}.hero h1{font-size:48px}.hero>p:not(.status){font-size:16px}.product-window{margin-top:40px}.workspace{grid-template-columns:1fr;height:430px}.workspace aside,.reader{display:none}.message-list{border:0}.email p{max-width:75vw}.metrics{grid-template-columns:1fr;padding:38px 24px;gap:22px}.metrics div{border:0}.features{grid-template-columns:1fr;padding:62px 28px;gap:38px}.feature-grid{gap:30px 20px}.notification-card{grid-template-columns:1fr;padding:65px 28px;gap:35px}.notification-card h2{font-size:39px}.phone{margin-left:0}.pricing{padding:55px 24px}footer{height:auto;padding:25px;gap:15px;flex-wrap:wrap}.window-bar .search{width:60%}}
/* Header and account-panel refinements */
.topbar{gap:28px}.brand{flex:0 0 auto}.nav-links{margin-left:auto;align-items:center}.nav-links a{white-space:nowrap}.auth-links{display:flex;align-items:center;gap:18px;font-size:14px;color:#526077;white-space:nowrap}.mobile-menu{display:none}.signup-dialog{width:min(440px,calc(100% - 28px));border:0;border-radius:16px;padding:0;box-shadow:0 30px 80px #11192a55}.signup-dialog::backdrop{background:#10192bb8}.signup-dialog form{position:relative;padding:34px}.signup-dialog h2{font:600 34px/1.1 'Playfair Display';margin:15px 0 8px}.signup-dialog p{color:var(--muted);font-size:14px;line-height:1.5}.signup-dialog label{display:block;color:#344157;font-size:12px;font-weight:600;margin-top:14px}.signup-dialog label small{font-weight:400;color:#7d899a}.signup-dialog input{display:block;width:100%;margin-top:5px;padding:11px;border:1px solid #d9dfe8;border-radius:7px;font:14px 'DM Sans';outline-color:var(--coral)}.signup-dialog .button{width:100%;margin-top:20px}.dialog-close{position:absolute;right:16px;top:14px;background:none;border:0;color:#6c778a;font-size:25px;cursor:pointer}.form-status{min-height:20px;margin:10px 0 0!important}.form-status.error{color:#bd3e38}.form-status.success{color:#277354}.login-note{text-align:center;margin-bottom:0}.login-note button{border:0;background:none;color:#d75b4a;font-weight:600;cursor:pointer}
@media(max-width:900px){.topbar{gap:16px}.nav-links{gap:18px}.mobile-menu{display:none}}@media(max-width:680px){.topbar{height:70px;padding:0 18px}.nav-links,.auth-links{display:none}.mobile-menu{display:block;margin-left:auto;position:relative}.mobile-menu summary{list-style:none;cursor:pointer;font-size:22px;color:var(--navy)}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu>div{position:absolute;z-index:5;right:0;top:34px;width:180px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 35px #17204024}.mobile-menu a,.mobile-menu button{display:block;width:100%;padding:10px;border:0;background:transparent;text-align:left;color:var(--ink);font:14px 'DM Sans'}.mobile-menu button{color:var(--coral);font-weight:700}.ghost{margin-left:auto;margin-right:0}.hero-actions{flex-direction:column;gap:12px}}
.summary-action{border:0;background:transparent;color:#d66351;font:600 10px 'DM Sans';padding:0;cursor:pointer}
.preview-note{margin:34px auto -20px;font-size:12px;color:#61708a}
