/* Hush · landing page */
:root{
  --margin:#b4c2cb; --black:#000; --card:#0c0c0d; --card-2:#121418; --navy:#202737; --navy-2:#2a3346;
  --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12); --text:#f4f5f7; --mute:#8d929a; --dim:#5d626a;
  --blue:#93b2e8; --amber:#f0b45a; --green:#62d39d;
  --f:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:22px; --wrap:1240px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--margin);color:var(--text);font:400 16px/1.55 var(--f);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
svg{flex:none}
kbd{font:500 12px/1 var(--f);display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:4px;border:1px solid rgba(255,255,255,.18);border-bottom-width:2px;color:#e8ebef;background:rgba(255,255,255,.04)}

.frame{margin:var(--gut);background:var(--black);overflow:clip}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border-radius:2px;font-weight:500;font-size:15px;letter-spacing:-.01em;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:#2b3448}
.btn-white{background:#fff;color:#0a0b0d;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.btn-white:hover{background:#e9ecf0}
.btn-lg{height:46px;padding:0 24px}
.btn-block{width:100%;height:48px}

/* ---------- hero ---------- */
.hero{position:relative;padding-bottom:0;--below:250px}
.hero-img{position:absolute;left:0;top:0;width:100%;height:calc(100% - var(--below));object-fit:cover;object-position:50% 72%}
.hero::before{content:"";position:absolute;left:0;right:0;top:0;height:calc(100% - var(--below));background:linear-gradient(180deg,rgba(28,40,56,.28) 0%,rgba(28,40,56,0) 42%,rgba(0,0,0,0) 80%,rgba(0,0,0,.25) 100%);z-index:1;pointer-events:none}
.nav{position:relative;z-index:5;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px 22px 0 28px}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:550;font-size:21px;letter-spacing:-.03em}
.mark-tile{width:32px;height:32px;border-radius:7px;display:grid;place-items:center;background:rgba(10,14,20,.28);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);color:#fff}
.mark-tile.sm{width:22px;height:22px;border-radius:5px;background:#10141c}
.mark-tile.lg{width:44px;height:44px;border-radius:9px;background:#0b0d11;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.links{display:flex;align-items:center;gap:30px;font-size:15px}
.links>a,.dd-btn{color:rgba(255,255,255,.82);transition:color .2s;display:inline-flex;align-items:center;gap:4px}
.links>a:hover,.dd-btn:hover,.links>a.on{color:#fff}
.dd{position:relative}
.dd-panel{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%);width:460px;background:#0b0e14;border:1px solid var(--line-2);border-radius:6px;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:2px;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.dd-panel[hidden]{display:none}
.dd-panel a{display:grid;padding:10px 12px;border-radius:4px}
.dd-panel a:hover{background:rgba(255,255,255,.05)}
.dd-panel b{font-weight:500;font-size:14px}
.dd-panel small{color:var(--mute);font-size:12.5px}
.nav-r{display:flex;justify-content:flex-end;align-items:center;gap:20px}
.login{font-size:15px;color:rgba(255,255,255,.85)}
.login:hover{color:#fff}
.nav .btn{height:46px;padding:0 24px}
.burger{display:none;width:42px;height:42px;place-items:center;border-radius:3px;background:rgba(10,14,20,.35);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);position:relative}
.burger span{position:absolute;left:12px;right:12px;height:1.6px;background:#fff;transition:transform .25s}
.burger span:first-child{top:16px}.burger span:last-child{top:24px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mnav{position:absolute;z-index:6;left:12px;right:12px;top:76px;background:#0b0e14;border:1px solid var(--line-2);border-radius:6px;padding:10px;display:grid;gap:2px}
.mnav[hidden]{display:none}
.mnav a{padding:13px 12px;font-size:16px;border-radius:4px}
.mnav a:not(.btn):hover{background:rgba(255,255,255,.05)}
.mnav .btn{margin-top:8px}

.hero-copy{position:relative;z-index:3;text-align:center;padding:76px 24px 0;display:grid;justify-items:center}
.chip{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:4px;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font-size:13px;color:rgba(255,255,255,.92);transition:background .2s}
.chip:hover{background:rgba(255,255,255,.22)}
.hero h1{margin:28px 0 0;font-weight:450;font-size:clamp(40px,4.15vw,60px);line-height:1.02;letter-spacing:-.048em;max-width:12em}
.hero h1 span{display:block}
.hero .sub{margin:22px 0 0;max-width:500px;font-size:17px;line-height:1.5;color:rgba(255,255,255,.86);letter-spacing:-.01em}
.ctas{display:flex;gap:10px;margin-top:30px;flex-wrap:wrap;justify-content:center}
.rating{display:flex;align-items:center;gap:10px;margin-top:28px;font-size:14.5px;color:rgba(255,255,255,.85)}
.stars{display:flex;gap:3px;color:#f6c343}

/* window */
.win-wrap{position:relative;z-index:3;padding:64px 24px 0;display:flex;justify-content:center}
.win{width:min(1060px,100%);height:640px;background:#07090d;border:1px solid rgba(255,255,255,.1);border-bottom:0;border-radius:10px 10px 0 0;display:grid;grid-template-columns:186px minmax(0,1fr);overflow:hidden;font-size:12px;line-height:1.4;color:#e9ecf1;box-shadow:0 -10px 60px rgba(4,8,14,.35);-webkit-mask-image:linear-gradient(#000 72%,transparent 100%);mask-image:linear-gradient(#000 72%,transparent 100%);text-align:left}
.wi{display:inline-block;width:14px;height:14px;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;flex:none}
.wi-inbox{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 13l2.5-7h11L20 13v5.5H4z'/%3E%3Cpath d='M4 13h4.5l1 2h5l1-2H20'/%3E%3C/svg%3E")}
.wi-bundle{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 4l8 4-8 4-8-4z'/%3E%3Cpath d='M4 12l8 4 8-4M4 16l8 4 8-4'/%3E%3C/svg%3E")}
.wi-follow{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v4.5l3 1.8'/%3E%3C/svg%3E")}
.wi-snooze{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M19.5 14.5A7.5 7.5 0 1 1 9.5 4.5a6 6 0 0 0 10 10z'/%3E%3C/svg%3E")}
.wi-sent{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 12l16-8-6 16-2.5-6.5z'/%3E%3Cpath d='M11.5 13.5L20 4'/%3E%3C/svg%3E")}
.wi-search{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M16 16l4 4'/%3E%3C/svg%3E")}
.wi-insights{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M5 20v-6M11 20V6M17 20v-9M3 20h18'/%3E%3C/svg%3E")}
.wi-news{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E")}
.wi-receipt{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6'/%3E%3C/svg%3E")}
.wi-bell{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M6 16V11a6 6 0 0 1 12 0v5l1.5 2h-15zM10 20.5h4'/%3E%3C/svg%3E")}
.wi-spark{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3.5l1.9 5.6 5.6 1.9-5.6 1.9L11 18.5l-1.9-5.6-5.6-1.9 5.6-1.9zM18.5 15l.8 2.2 2.2.8-2.2.8-.8 2.2-.8-2.2-2.2-.8 2.2-.8z'/%3E%3C/svg%3E")}
.wi-archive{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='3.5' y='4.5' width='17' height='4.5' rx='1'/%3E%3Cpath d='M5.5 9v10h13V9M10 13h4'/%3E%3C/svg%3E")}
.wi-reply{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M9 14l-5-5 5-5'/%3E%3Cpath d='M4 9h10a6 6 0 0 1 6 6v4'/%3E%3C/svg%3E")}
.wi-panel{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='3.5' y='4.5' width='17' height='15' rx='2'/%3E%3Cpath d='M15 4.5v15'/%3E%3C/svg%3E")}

.w-side{background:#0a0d13;border-right:1px solid rgba(255,255,255,.06);padding:12px 10px;display:flex;flex-direction:column;gap:8px}
.w-acct{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid rgba(255,255,255,.07);border-radius:5px}
.w-acct .mark-tile{width:26px;height:26px;border-radius:6px;background:#0f131b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.w-acct b{display:block;font-weight:560;font-size:12.5px}
.w-acct small{display:block;color:#8f97a5;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.w-nav{display:grid;gap:1px}
.w-nav span{display:flex;align-items:center;gap:9px;height:27px;padding:0 8px;border-radius:4px;color:#8f97a5}
.w-nav span.on{background:#202737;color:#eef0f3}
.w-nav em{margin-left:auto;font-style:normal;font-size:11px;font-variant-numeric:tabular-nums}
.w-nav small{color:#5f6775;font-size:10.5px;padding:12px 8px 4px}
.w-nav .dot{width:7px;height:7px;border-radius:2px;margin:0 3px}
.w-main{display:grid;grid-template-rows:42px minmax(0,1fr);min-width:0}
.w-top{display:flex;align-items:center;gap:7px;padding:0 10px 0 14px;border-bottom:1px solid rgba(255,255,255,.06);color:#8f97a5;white-space:nowrap;min-width:0}
.w-crumb{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.w-crumb b{color:#eef0f3;font-weight:550}
.w-crumb i{font-style:normal;color:#5f6775;margin:0 3px}
.live{display:inline-flex;align-items:center;gap:5px;color:#5f6775}
.live::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--amber);transition:background .3s}
.live.done::before{background:var(--green)}
.w-search{display:flex;align-items:center;gap:7px;height:26px;padding:0 6px 0 8px;width:190px;border:1px solid rgba(255,255,255,.1);border-radius:5px;color:#5f6775}
.w-search kbd{margin-left:auto;height:16px;min-width:16px;font-size:10px;padding:0 4px;border-bottom-width:1px;color:#8f97a5}
.w-ib{width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:5px;font-size:12px}
.w-quiet{display:flex;align-items:center;gap:6px;height:26px;padding:0 8px;border:1px solid rgba(255,255,255,.1);border-radius:5px;font-size:11px}
.w-quiet i{width:5px;height:5px;border-radius:50%;background:#5f6775}
.w-compose{height:26px;padding:0 10px;display:grid;place-items:center;background:#fff;color:#0a0c10;border-radius:3px;font-weight:550;font-size:11.5px}
.w-body{display:grid;grid-template-columns:340px minmax(0,1fr);min-height:0}
.w-list{border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;min-height:0;overflow:hidden}
.w-lh{position:relative;height:44px;border-bottom:1px solid rgba(255,255,255,.06);padding:8px 10px}
.w-flood,.w-tabs{position:absolute;inset:8px 10px;display:flex;align-items:center;gap:8px}
.w-flood b{font-weight:560;font-size:12.5px}
.w-flood span{margin-left:auto;color:#8f97a5;font-variant-numeric:tabular-nums}
.w-flood em{font-style:normal;color:#eef0f3;font-weight:550}
.w-tabs{gap:2px;padding:2px;border:1px solid rgba(255,255,255,.07);border-radius:6px;opacity:0;visibility:hidden}
.w-tabs span{height:24px;padding:0 9px;display:flex;align-items:center;gap:6px;border-radius:4px;color:#8f97a5;font-weight:500;font-size:11.5px}
.w-tabs span.on{background:#202737;color:#eef0f3}
.w-tabs em{font-style:normal;color:#5f6775;font-size:10.5px}
.w-tabs .on em{color:#aab6cc}
.w-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0 9px;height:0;opacity:0;overflow:hidden}
.w-tile{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1px 6px;padding:6px 8px;border:1px solid rgba(255,255,255,.07);border-radius:5px;color:#8f97a5;background:rgba(255,255,255,.015)}
.w-tile b{justify-self:end;color:#eef0f3;font-weight:550;font-variant-numeric:tabular-nums;font-size:12px}
.w-tile small{grid-column:1/-1;font-size:10.5px}
.w-tile.bump{border-color:rgba(147,178,232,.45)}
.w-rows{flex:1;overflow:hidden;padding:5px 5px 0}
.w-row{display:grid;grid-template-columns:26px minmax(0,1fr);gap:9px;padding:8px 8px 9px;border-radius:5px;position:relative;overflow:hidden}
.w-row .av,.w-row .tl{width:26px;height:26px;border-radius:6px;object-fit:cover}
.w-row .tl{display:grid;place-items:center;background:#1a2130;color:#aab6cc}
.w-row .ini{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;background:#24324a;font-size:10px;font-weight:600;color:#d7deea}
.w-row .l1{display:flex;gap:8px;align-items:baseline;min-width:0}
.w-row .who{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-row .tm{margin-left:auto;color:#5f6775;font-size:10.5px;white-space:nowrap;font-variant-numeric:tabular-nums}
.w-row .sb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e1e5eb;font-size:11.8px}
.w-row .pv{color:#5f6775;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11.5px;margin-top:2px}
.w-row .sm{display:none;gap:5px;color:#8f97a5;font-size:11.5px;margin-top:3px;line-height:1.4}
.w-row .sm .wi{width:10px;height:10px;margin-top:3px;color:var(--blue)}
.w-row .sm span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em}
.w-row.sum .pv{display:none}
.w-row.sum .sm{display:flex}
.w-row.sel{background:#171e2c}
.w-row.sel::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;background:#fff}
.w-row .tag{position:absolute;right:8px;bottom:8px;height:18px;padding:0 7px;display:flex;align-items:center;gap:5px;border-radius:4px;background:#1a2130;color:#aab6cc;font-size:10.5px;opacity:0}
.w-row .tag .wi{width:10px;height:10px}
.w-read{min-width:0;display:flex;flex-direction:column}
.w-tb{display:flex;align-items:center;gap:12px;height:40px;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.06);color:#8f97a5}
.w-tb .g{flex:1}
.w-tb .wi{width:14px;height:14px}
.w-tb .pos{font-size:10.5px;color:#5f6775}
.w-rd{padding:18px 22px;overflow:hidden}
.w-rd h4{margin:0 0 8px;font-size:16px;font-weight:550;letter-spacing:-.02em;line-height:1.25}
.w-lb{display:flex;gap:5px;align-items:center;margin-bottom:12px}
.c{display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 6px;border-radius:3px;font-size:10.5px;font-weight:500;background:rgba(255,255,255,.06);color:#8f97a5;white-space:nowrap}
.c.blue{background:rgba(120,155,220,.14);color:var(--blue)}
.c.amber{background:rgba(240,180,90,.13);color:var(--amber)}
.w-lb small{color:#5f6775;font-size:10.5px;margin-left:2px}
.w-sum{border:1px solid rgba(147,178,232,.2);background:linear-gradient(rgba(120,155,220,.08),rgba(120,155,220,.03));border-radius:6px;overflow:hidden;height:0;opacity:0;margin-bottom:0}
.w-sum-in{padding:11px 12px}
.w-sum-h{display:flex;align-items:center;gap:6px;color:var(--blue);font-weight:550;font-size:11px;margin-bottom:5px}
.w-sum-h .wi{width:11px;height:11px}
.w-sum-h span{margin-left:auto;color:#8f97a5;font-weight:450;font-size:10.5px}
.w-sum p{margin:0;font-size:12.5px;line-height:1.5;color:#e4e8ef;min-height:3em}
.w-sum ul{margin:8px 0 0;padding:0;list-style:none;display:grid;gap:4px;color:#cfd5df;font-size:11.5px}
.w-sum li{display:flex;gap:7px;align-items:center}
.w-sum li::before{content:"";width:11px;height:11px;border:1.4px solid rgba(255,255,255,.25);border-radius:3px;flex:none}
.w-msg{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:9px;padding:10px 0;border-top:1px solid rgba(255,255,255,.06)}
.w-msg .av,.w-msg .ini{width:26px;height:26px;border-radius:6px;object-fit:cover}
.w-msg .ini{display:grid;place-items:center;background:#203a3a;font-size:10px;font-weight:600}
.w-msg b{font-weight:550;display:block}
.w-msg small{color:#5f6775;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}
.w-msg time{color:#5f6775;font-size:10.5px;white-space:nowrap}
.w-msg p{margin:8px 0 0;color:#c9cfd8;font-size:12px;line-height:1.6}

/* ---------- sections ---------- */
main{position:relative;z-index:2}
.logos{padding:72px 24px 0}
.logo-row{max-width:var(--wrap);margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;color:rgba(255,255,255,.72)}
.lg{display:inline-flex;align-items:center;gap:8px;font-size:21px;white-space:nowrap}
.lg-linnet{font-weight:600;letter-spacing:-.04em}
.lg-bright{font-weight:300;letter-spacing:.24em;font-size:15.5px}
.lg-quarry{font-weight:700;letter-spacing:-.02em}
.lg-quarry i{width:15px;height:15px;background:currentColor;transform:rotate(45deg) scale(.85)}
.lg-paloma{font-weight:500;letter-spacing:-.01em;font-size:22px}
.lg-vantor{font-weight:800;font-style:italic;letter-spacing:.04em;font-size:19px}
.lg-okto{font-weight:600;font-size:22px;letter-spacing:-.03em}
.lg-sable{font-weight:400;letter-spacing:-.02em;font-size:21px}
.lg-sable i{font-style:normal;font-weight:300;opacity:.7}

.sec{padding:160px 24px 0}
.sec-h{max-width:640px;margin:0 auto 64px;text-align:center}
.sec-h h2,.quiet h2,.cta h2{margin:0;font-weight:450;font-size:clamp(32px,3.35vw,48px);line-height:1.06;letter-spacing:-.045em}
.sec-h p{margin:20px auto 0;max-width:460px;color:rgba(255,255,255,.82);font-size:16px;line-height:1.55;letter-spacing:-.005em}
.sec-h.left{text-align:left;margin:0 0 40px}
.sec-h.left p{margin-left:0}
.center{text-align:center;margin-top:56px}

/* bento */
.bento{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.bc{grid-column:span 2;background:var(--card);border-radius:6px;padding:0 0 30px;overflow:hidden;display:flex;flex-direction:column}
.bc.wide{grid-column:span 3}
.bc h3{margin:28px 30px 0;font-weight:450;font-size:22px;letter-spacing:-.03em;line-height:1.2}
.bc>p{margin:10px 30px 0;color:var(--mute);font-size:16px;line-height:1.55;max-width:420px}
.bc-ui{position:relative;height:236px;padding:26px 26px 0 26px;overflow:hidden;font-size:12.5px}
.bc-ui::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40px;background:linear-gradient(transparent,var(--card));pointer-events:none}
.c{font-size:11px}
/* summaries */
.ui-sum{display:grid;gap:10px;align-content:start}
.s-card{background:var(--card-2);border:1px solid rgba(255,255,255,.05);border-radius:6px;padding:12px 14px}
.s-card.dim{opacity:.55}
.s-h{display:flex;align-items:center;gap:9px}
.s-h img,.p-row img,.lr img,.q-vip img,.b-row img,.b-msg img,.t-h img,.ev-p img,.pp img{width:26px;height:26px;border-radius:6px;object-fit:cover}
.s-h span{display:grid;min-width:0;flex:1}
.s-h b{font-weight:550;font-size:13px}
.s-h small{color:var(--mute);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-h time{color:var(--dim);font-size:11px;align-self:flex-start}
.s-line{display:flex;gap:7px;margin:9px 0 0;color:#cdd3dc;font-size:12.5px;line-height:1.45;min-height:2.9em}
.s-line svg{color:var(--blue);margin-top:3px}
.s-chips{display:flex;gap:5px;margin-top:9px}
.type .caret{display:inline-block;width:1px;height:1.05em;background:var(--blue);vertical-align:-2px;margin-left:1px;animation:blink .9s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
/* priority */
.ui-pri{display:grid;gap:4px;align-content:start}
.p-h{display:flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:6px;width:max-content;margin-bottom:6px}
.p-h span{height:24px;padding:0 9px;display:flex;align-items:center;gap:6px;border-radius:4px;color:var(--mute);font-size:11.5px}
.p-h span.on{background:var(--navy);color:#fff}
.p-h em{font-style:normal;color:var(--dim);font-size:10.5px}
.p-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:5px;background:var(--card-2);border:1px solid rgba(255,255,255,.04)}
.p-row span:nth-child(2){display:grid;min-width:0;flex:1}
.p-row b{font-weight:550;font-size:12.5px}
.p-row small{color:var(--mute);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-row .why{display:flex;gap:4px;flex:none}
.p-row.ghost{opacity:.4;background:none;border-style:dashed}
.ini{width:26px;height:26px;border-radius:6px;display:inline-grid;place-items:center;background:#24324a;font-size:10px;font-weight:600;color:#d7deea;font-style:normal;flex:none}
/* event */
.ev{background:var(--card-2);border:1px solid rgba(255,255,255,.05);border-radius:6px;padding:14px 16px}
.ev-k{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:11.5px;margin-bottom:8px}
.ev-t{display:block;font-weight:550;font-size:14px}
.ev-w{color:var(--mute);font-size:12px;margin-top:4px}
.ev-w b{color:#fff;font-weight:500}
.ev-p{display:flex;align-items:center;margin-top:12px}
.ev-p img,.ev-p .ini{box-shadow:0 0 0 2px var(--card-2)}
.ev-p>*+*{margin-left:-5px}
.ev-p small{margin-left:10px;color:var(--mute);font-size:11.5px}
.ev-n{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);color:var(--mute);font-size:12px;line-height:1.5}
/* follow-ups */
.ui-fu{display:grid;gap:4px;align-content:start}
.fu-h,.fu-row{display:grid;grid-template-columns:26px minmax(0,1fr) 92px 130px 62px;gap:12px;align-items:center}
.fu-h{grid-template-columns:minmax(0,1fr) 92px 130px 62px;color:var(--dim);font-size:11.5px;padding:0 10px 4px}
.fu-row{padding:8px 10px;border-radius:5px;background:var(--card-2);border:1px solid rgba(255,255,255,.04);transition:background .3s}
.fu-row span:nth-child(2){display:grid;min-width:0}
.fu-row b{font-weight:550;font-size:12.5px}
.fu-row small{color:var(--mute);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fu-bar{display:flex;align-items:center;gap:7px}
.fu-bar i{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.fu-bar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--amber);border-radius:2px}
.fu-bar em{font-style:normal;color:var(--mute);font-size:11px;font-variant-numeric:tabular-nums}
.fu-btn{height:24px;display:grid;place-items:center;background:#fff;color:#0a0c10;border-radius:3px;font-size:11.5px;font-weight:550}
.fu-row.act{background:#171e2c}
.fu-row.act .fu-btn{background:#d6dbe3}
.fu-draft{position:absolute;right:26px;top:72px;width:300px;background:#141a26;border:1px solid rgba(255,255,255,.12);border-radius:7px;padding:12px 14px;box-shadow:0 20px 50px rgba(0,0,0,.5);opacity:0;transform:translateY(8px);pointer-events:none}
.fd-h{display:flex;align-items:center;gap:6px;color:var(--blue);font-size:11px;font-weight:550;margin-bottom:6px}
.fu-draft p{margin:0;color:#dfe4ea;font-size:12px;line-height:1.5;min-height:4.5em}
.fd-send{display:inline-grid;place-items:center;height:24px;padding:0 10px;margin-top:8px;background:#fff;color:#0a0c10;border-radius:3px;font-size:11.5px;font-weight:550}
/* writing assistant */
.ui-wa{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:12px;align-items:start}
.wa-ed{background:var(--card-2);border:1px solid rgba(255,255,255,.05);border-radius:6px;padding:12px 14px;min-width:0}
.wa-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.wa-h b{font-weight:550;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-score{font-size:11px;color:var(--mute);white-space:nowrap}
.wa-score b{color:#fff;font-variant-numeric:tabular-nums}
.wa-txt{margin:0;color:#d8dde5;font-size:12.5px;line-height:1.65}
.wa-txt>span:first-child{display:block;margin-bottom:6px}
.wa-txt mark{color:inherit;background:rgba(240,180,90,.14);border-bottom:2px solid rgba(240,180,90,.7);border-radius:2px;transition:background .3s}
.wa-txt mark.clar{background:rgba(147,178,232,.13);border-bottom-color:rgba(147,178,232,.75)}
.wa-txt mark.hot{background:rgba(147,178,232,.32)}
.wa-txt mark.tone.hot{background:rgba(240,180,90,.3)}
.wa-txt mark.fixed{background:none;border-bottom-color:transparent}
.wa-sug{background:#141a26;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:12px;display:grid;gap:6px;font-size:12px}
.wa-sug .k{font-size:11px;font-weight:550;color:var(--blue)}
.wa-sug .k.tone{color:var(--amber)}
.wa-sug .was{color:var(--dim);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.25)}
.wa-sug .now{color:#e4e8ef}
.wa-sug .acts{display:flex;align-items:center;gap:8px;margin-top:2px}
.wa-apply{height:24px;padding:0 10px;background:#fff;color:#0a0c10;border-radius:3px;font-size:11.5px;font-weight:550;transition:transform .15s,background .15s}
.wa-apply.press{transform:scale(.94);background:#cfd5de}
.wa-left{color:var(--dim);font-size:11px}

/* features 3 */
.feat3{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px;padding:0 30px}
.itile{width:40px;height:40px;border-radius:3px;display:grid;place-items:center;background:var(--navy);color:#fff}
.itile.w{background:#fff;color:#0a0c10}
.f h3{margin:30px 0 0;font-weight:450;font-size:21px;letter-spacing:-.035em}
.f p,.f2 p{margin:12px 0 0;color:var(--mute);font-size:16px;line-height:1.6;max-width:360px}
.feat3.tight{margin-top:56px;gap:40px}
.f2 h3{display:flex;align-items:center;gap:10px;margin:0;font-weight:450;font-size:20px;letter-spacing:-.035em}
.f2 p{margin-top:10px}

/* big app view */
.big{max-width:var(--wrap);margin:0 auto;background:#161b26;padding:10px 10px 0;border-radius:8px 8px 0 0;-webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent)}
.big-in{background:#07090d;border-radius:4px 4px 0 0;display:grid;grid-template-columns:270px minmax(0,1fr) 280px;height:560px;overflow:hidden;font-size:12.5px;color:#e9ecf1}
.b-list{border-right:1px solid var(--line);padding:10px 8px}
.b-tabs{display:flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:6px;width:max-content;margin:2px 4px 10px}
.b-tabs span{height:24px;padding:0 9px;display:flex;align-items:center;gap:6px;border-radius:4px;color:var(--mute);font-size:11.5px}
.b-tabs span.on{background:var(--navy);color:#fff}
.b-tabs em{font-style:normal;color:var(--dim);font-size:10.5px}
.b-row{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 8px;border-radius:5px;position:relative}
.b-row.on{background:#171e2c}
.b-row.on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:2px;background:#fff}
.b-row div{display:grid;min-width:0}
.b-row b{font-weight:550}
.b-row small{color:var(--mute);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-row time{color:var(--dim);font-size:10.5px;align-self:start}
.b-read{padding:22px 26px;overflow:hidden}
.b-read h4{margin:0 0 8px;font-weight:550;font-size:18px;letter-spacing:-.02em}
.b-labels{display:flex;gap:5px;align-items:center;margin-bottom:14px}
.b-labels small{color:var(--dim);font-size:11px;margin-left:3px}
.b-sum{border:1px solid rgba(147,178,232,.2);background:linear-gradient(rgba(120,155,220,.08),rgba(120,155,220,.03));border-radius:7px;padding:13px 15px;margin-bottom:14px}
.b-sum-h{display:flex;align-items:center;gap:7px;color:var(--blue);font-weight:550;font-size:11.5px;margin-bottom:6px}
.b-sum-h span{margin-left:auto;color:var(--mute);font-weight:450;font-size:11px}
.b-sum p{margin:0 0 10px;font-size:13.5px;line-height:1.5;color:#e4e8ef}
.ask{display:flex;gap:8px;align-items:center;font-size:12.5px;color:#cfd5df;padding:2px 0;cursor:pointer}
.ask input{appearance:none;width:14px;height:14px;border:1.5px solid rgba(255,255,255,.28);border-radius:3px;margin:0;display:grid;place-items:center;cursor:pointer}
.ask input:checked{background:var(--blue);border-color:var(--blue)}
.ask input:checked::after{content:"";width:6px;height:3px;border-left:2px solid #0a0c10;border-bottom:2px solid #0a0c10;transform:rotate(-45deg) translate(1px,-1px)}
.ask input:checked+span{color:var(--dim);text-decoration:line-through}
.b-due{display:flex;gap:16px;margin-top:10px;padding-top:9px;border-top:1px solid rgba(147,178,232,.12);font-size:11.5px;color:var(--mute)}
.b-due b{color:#fff;font-weight:500}
.b-msg{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:10px;padding:12px 0;border-top:1px solid var(--line)}
.b-msg b{font-weight:550;display:block}
.b-msg small{display:block;color:var(--dim);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-msg p{margin:8px 0 0;color:#cdd3dc;line-height:1.6}
.b-msg time{color:var(--dim);font-size:11px;white-space:nowrap}
.b-replies{display:flex;gap:6px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--line)}
.b-replies span{display:flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:5px;padding:6px 9px;color:#d7dde6;font-size:12px}
.b-replies kbd{height:16px;min-width:16px;font-size:10px;padding:0 4px;border-bottom-width:1px}
.b-ctx{border-left:1px solid var(--line);background:#0a0d13;padding:14px 12px;display:grid;gap:10px;align-content:start}
.b-card{border:1px solid var(--line);border-radius:7px;background:#0d1118;padding:12px 13px;display:grid;gap:4px}
.b-card>small{color:var(--dim);font-size:11px;margin-bottom:4px}
.b-card>b{font-weight:550;font-size:13px}
.b-card .w{color:var(--mute);font-size:11.5px}
.b-card .w b{color:#fff;font-weight:500}
.pp{display:grid;gap:7px;margin-top:8px}
.pp span{display:flex;align-items:center;gap:8px;font-size:12px}
.pp img,.pp .ini{width:20px;height:20px;border-radius:5px;font-size:8.5px}
.pp em{margin-left:auto;font-style:normal;color:var(--dim);font-size:11px}
.b-card .n{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);color:var(--mute);font-size:11.5px;line-height:1.5}
.b-card a{display:grid;font-size:12px;padding:7px 0;border-top:1px solid var(--line)}
.b-card a:first-of-type{border-top:0;padding-top:0}
.b-card a em{font-style:normal;color:var(--dim);font-size:11px}

/* steps */
.steps{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.step{background:var(--card);border-radius:6px;padding:26px 28px 32px}
.st-ui{height:196px;display:grid;gap:7px;align-content:start;font-size:12.5px}
.step .num{display:block;margin-top:26px;color:var(--dim);font-size:14px;font-variant-numeric:tabular-nums}
.step h3{margin:6px 0 0;font-weight:450;font-size:22px;letter-spacing:-.03em}
.step p{margin:10px 0 0;color:var(--mute);line-height:1.55}
.cn,.lr{display:flex;align-items:center;gap:10px;padding:9px 11px;background:var(--card-2);border:1px solid rgba(255,255,255,.05);border-radius:6px}
.cn.mute{opacity:.6}
.cn .g{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;background:#1c2230;font-weight:600;font-size:12px}
.cn span:nth-child(2),.lr span:nth-child(2){display:grid;flex:1;min-width:0}
.cn b,.lr b{font-weight:550}
.cn small,.lr small{color:var(--mute);font-size:11.5px}
.ok{font-size:11px;color:var(--green)}
.ok.ghost{color:#fff;border:1px solid var(--line-2);padding:3px 8px;border-radius:3px}
.prog{margin-top:6px;padding:10px 11px;border:1px dashed rgba(255,255,255,.12);border-radius:6px;display:grid;gap:8px}
.prog div{display:flex;justify-content:space-between;color:var(--mute);font-size:11.5px}
.prog div b{color:#fff;font-weight:500;font-variant-numeric:tabular-nums}
.prog>i{display:block;height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.prog>i b{display:block;height:100%;width:0;background:#e9edf3;border-radius:2px}
.tg{width:28px;height:16px;border-radius:8px;background:#2a3140;position:relative;flex:none}
.tg::after{content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#c6cdd8}
.tg.on{background:#e9edf3}
.tg.on::after{left:14px;background:#0b0e14}
.st-ui.photo{position:relative;border-radius:6px;overflow:hidden;padding:56px 14px 14px;align-content:end}
.st-ui.photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-ui.photo .mb{position:relative;background:rgba(10,13,19,.92);border-color:rgba(255,255,255,.1)}
.mb{background:var(--card-2);border:1px solid rgba(255,255,255,.05);border-radius:6px;padding:13px 14px}
.mb-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.mb-h b{font-weight:550}
.mb-h time{margin-left:auto;color:var(--dim);font-size:11px}
.mb p{margin:0;color:#cdd3dc;line-height:1.55}
.mb p b{color:#fff;font-weight:550}
.mb-b{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}
.mb-b span{border:1px solid var(--line-2);border-radius:4px;padding:4px 8px;color:var(--mute);font-size:11.5px}
.mb-b b{color:#fff;font-weight:550;margin-left:3px}

/* quiet */
.quiet{position:relative;max-width:var(--wrap);margin:0 auto;height:600px;border-radius:6px;overflow:hidden}
.quiet>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.quiet::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,9,14,.55) 0%,rgba(6,9,14,.1) 45%,rgba(6,9,14,.35) 100%);pointer-events:none}
.q-copy{position:absolute;left:48px;top:46px;z-index:2;max-width:470px}
.q-copy p{margin:18px 0 0;color:rgba(255,255,255,.86);line-height:1.55}
.q-card{position:absolute;z-index:2;right:40px;bottom:40px;width:400px;background:#0a0d13;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:16px 18px;box-shadow:0 30px 80px rgba(0,0,0,.45);font-size:12.5px}
.q-h{display:flex;align-items:center;gap:9px}
.q-h b{font-weight:550;font-size:13.5px}
.q-t{color:var(--mute);margin-left:auto;margin-right:8px;font-size:12px}
.q-line{position:relative;height:46px;margin-top:16px;border-bottom:1px solid rgba(255,255,255,.14)}
.q-line i{font-style:normal;position:absolute;bottom:0;width:2px;height:14px;background:#56617a;border-radius:1px;transform-origin:bottom}
.q-line i.v{height:30px;background:#fff;width:3px}
.q-line i.v::after{content:"VIP";position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:9.5px;color:#fff;font-weight:600;letter-spacing:.02em}
.q-axis{display:flex;justify-content:space-between;color:var(--dim);font-size:10.5px;margin-top:6px;font-variant-numeric:tabular-nums}
.q-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.q-stats div{border:1px solid var(--line);border-radius:6px;padding:10px 12px}
.q-stats b{display:block;font-weight:500;font-size:22px;letter-spacing:-.03em}
.q-stats small{color:var(--mute);font-size:11.5px}
.q-vip{display:flex;align-items:center;margin-top:12px;color:var(--mute);font-size:12px}
.q-vip img{width:22px;height:22px;border-radius:5px;box-shadow:0 0 0 2px #0a0d13}
.q-vip img+img,.q-vip .ini{margin-left:-5px}
.q-vip .ini{width:22px;height:22px;border-radius:5px;font-size:9px;box-shadow:0 0 0 2px #0a0d13;background:#3a2a33}
.q-vip span{margin-left:10px}

/* keys */
.keys{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;align-items:center}
.k-copy h2{margin:0;font-weight:450;font-size:clamp(32px,3.35vw,48px);line-height:1.06;letter-spacing:-.045em}
.k-copy p{margin:20px 0 0;color:rgba(255,255,255,.82);max-width:440px;line-height:1.75}
.k-copy p kbd{margin:0 1px}
.k-list{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;max-width:470px}
.k-list li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);color:var(--mute);font-size:15px}
.k-list li span{display:flex;gap:4px;min-width:52px}
.kd{position:relative;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px;height:392px;overflow:hidden;font-size:13px;outline:none}
.kd:focus-visible{border-color:rgba(255,255,255,.3)}
.kd-h{display:flex;align-items:center;gap:8px;padding:6px 8px 12px}
.kd-h b{font-weight:550}
.kd-h>span:nth-child(2){color:var(--dim);font-variant-numeric:tabular-nums}
.kd-hint{margin-left:auto;color:var(--dim);font-size:11.5px}
.kd-rows{position:relative}
.kd-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:11px;align-items:center;padding:10px 10px;border-radius:6px;position:relative;transition:background .2s}
.kd-row img,.kd-row .ini{width:28px;height:28px;border-radius:6px;object-fit:cover}
.kd-row div{display:grid;min-width:0}
.kd-row b{font-weight:550}
.kd-row small{color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.kd-row time{color:var(--dim);font-size:11.5px}
.kd-row.sel{background:#171e2c}
.kd-row.sel::before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:2px;border-radius:2px;background:#fff}
.kd-toast{position:absolute;left:50%;bottom:16px;transform:translate(-50%,10px);background:#e9edf3;color:#0b0e14;border-radius:5px;padding:8px 12px;font-weight:500;font-size:12.5px;display:flex;gap:10px;align-items:center;opacity:0;transition:opacity .2s,transform .2s;white-space:nowrap}
.kd-toast.on{opacity:1;transform:translate(-50%,0)}
.kd-toast kbd{color:#555d6b;border-color:rgba(0,0,0,.2);background:none;height:18px;min-width:18px;font-size:10.5px}
.kd-snooze{position:absolute;right:20px;top:96px;width:220px;background:#111622;border:1px solid var(--line-2);border-radius:7px;padding:5px;box-shadow:0 18px 50px rgba(0,0,0,.5);opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s;pointer-events:none}
.kd-snooze.on{opacity:1;transform:none}
.kd-snooze small{display:block;padding:6px 8px 4px;color:var(--dim);font-size:11px}
.kd-snooze span{display:flex;justify-content:space-between;padding:7px 8px;border-radius:4px;font-size:12.5px}
.kd-snooze span.on{background:rgba(255,255,255,.07)}
.kd-snooze em{font-style:normal;color:var(--dim);font-size:11.5px}
.kd-keys{display:flex;gap:8px;margin-top:14px;justify-content:center;flex-wrap:wrap}
.kd-keys button{width:52px;height:48px;border-radius:6px;background:#111318;border:1px solid rgba(255,255,255,.12);border-bottom:3px solid rgba(255,255,255,.16);font-weight:550;font-size:15px;color:#e9ecf1;transition:transform .08s,background .15s}
.kd-keys button:hover{background:#171a21}
.kd-keys button.down{transform:translateY(2px);border-bottom-width:1px;background:#202737}

/* numbers */
.nums{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:stretch}
.n-img{margin:0;border-radius:6px;overflow:hidden;min-height:560px;position:relative}
.n-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.n-body{display:flex;flex-direction:column;justify-content:center}
.n-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line)}
.n-stats>div{padding:24px 20px 24px 0;display:grid;gap:8px;align-content:start}
.n-stats>div+div{padding-left:20px;border-left:1px solid var(--line)}
.n-stats b{font-weight:450;font-size:clamp(32px,3vw,44px);letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.n-stats span{color:var(--mute);font-size:14.5px;line-height:1.45}
.n-chart{margin-top:22px;background:var(--card);border-radius:6px;padding:18px 20px 12px}
.nc-h{display:flex;justify-content:space-between;color:var(--mute);font-size:12.5px;margin-bottom:6px}
.nc-h b{color:#fff;font-weight:500}
.n-chart svg{width:100%;height:auto;display:block;overflow:visible}
.n-chart .grid line{stroke:rgba(255,255,255,.07)}
.n-chart .ax text{fill:#5d626a;font-size:10.5px;text-anchor:end;font-family:var(--f)}
.n-chart .pts circle{fill:#07090d;stroke:#e9edf3;stroke-width:2}
.n-chart .lb text{fill:#e9edf3;font-size:11px;font-weight:550;font-family:var(--f)}

/* testimonials */
.t-wrap{position:relative}
.t-row{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(24px,calc((100% - var(--wrap))/2));scroll-padding:0 max(24px,calc((100% - var(--wrap))/2));scrollbar-width:none;outline:none;cursor:grab}
.t-row::-webkit-scrollbar{display:none}
.t-row.drag{cursor:grabbing;scroll-snap-type:none}
.t{flex:0 0 min(560px,82vw);scroll-snap-align:start;background:var(--card);border-radius:4px;padding:34px 34px 38px;user-select:none}
.t-h{display:flex;align-items:center;gap:14px}
.t-h img{width:50px;height:50px;border-radius:7px}
.t-h span{display:grid}
.t-h b{font-weight:500;font-size:16px}
.t-h small{color:var(--mute);font-size:14.5px}
.t h3{margin:30px 0 0;font-weight:450;font-size:21px;letter-spacing:-.025em}
.t p{margin:12px 0 0;color:var(--mute);line-height:1.6}
.t-nav{max-width:var(--wrap);margin:20px auto 0;display:flex;gap:8px;justify-content:flex-end;padding:0 24px}
.t-nav button{width:44px;height:44px;border-radius:2px;display:grid;place-items:center;border:1px solid var(--line-2);color:#fff;transition:background .2s}
.t-nav button:hover{background:rgba(255,255,255,.06)}
.t-nav button:disabled{opacity:.35;cursor:default}

/* pricing */
.bill{display:inline-flex;margin-top:28px;padding:3px;border:1px solid var(--line-2);border-radius:4px}
.bill button{height:34px;padding:0 14px;border-radius:2px;color:var(--mute);font-size:14px;display:flex;align-items:center;gap:8px}
.bill button.on{background:#fff;color:#0a0c10}
.bill em{font-style:normal;font-size:12px;color:var(--green)}
.bill button.on em{color:#178a55}
.plans{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;align-items:start}
.plan{padding:34px 32px 40px}
.plan h3{margin:22px 0 0;font-weight:450;font-size:22px;letter-spacing:-.03em}
.pd{margin:10px 0 0;color:var(--mute);font-size:15px;line-height:1.55;min-height:3.1em}
.price{display:flex;align-items:baseline;gap:8px;margin:28px 0 22px}
.price b{font-weight:450;font-size:52px;letter-spacing:-.05em;line-height:1}
.price span{color:var(--mute);font-size:15px}
.plan h4{margin:30px 0 16px;font-weight:450;font-size:16px}
.plan ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.plan li{display:flex;align-items:center;gap:12px;font-size:15.5px;color:#eef0f3}
.plan li svg{color:#fff}
.pro{background:var(--navy);margin-top:-16px;padding-top:40px;padding-bottom:52px;border-radius:2px}
.pro-top{display:flex;justify-content:space-between;align-items:center}
.deal{height:28px;padding:0 12px;display:grid;place-items:center;background:#4a5366;border-radius:14px;font-size:12px;font-weight:600;letter-spacing:.02em;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.pro .pd,.pro .price span{color:#c3cad6}

/* faq */
.faq{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.faq .sec-h p a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.qa details{border-bottom:1px solid var(--line)}
.qa details:first-child{border-top:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-size:18px;letter-spacing:-.02em}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{width:14px;height:14px;position:relative;flex:none}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:0;right:0;top:6px;height:1.6px;background:#fff;transition:transform .25s}
.qa summary i::after{transform:rotate(90deg)}
.qa details[open] summary i::after{transform:rotate(0)}
.qa details p{margin:-6px 0 22px;color:var(--mute);line-height:1.65;max-width:620px}

/* cta */
.cta-sec{padding-bottom:0}
.cta{position:relative;max-width:var(--wrap);margin:0 auto;height:400px;overflow:hidden;border-radius:2px;display:grid;place-items:center;text-align:center}
.cta>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.42) 1px,transparent 1.5px) 0 0/22px 22px;opacity:.55;z-index:1;-webkit-mask-image:linear-gradient(#000 0%,rgba(0,0,0,.6) 100%);mask-image:linear-gradient(#000,rgba(0,0,0,.6))}
.cta::after{content:"";position:absolute;inset:0;background:radial-gradient(46% 62% at 50% 50%,rgba(8,12,18,.5),rgba(8,12,18,.12) 80%,transparent);z-index:1}
.cta-in{position:relative;z-index:2;padding:0 24px}
.cta p{margin:18px auto 30px;max-width:400px;color:rgba(255,255,255,.88);line-height:1.55}

/* footer */
.foot{padding:150px 56px 30px}
.foot-top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap}
.f-brand .brand{font-size:24px;gap:12px}
.f-brand p{margin:20px 0 0;max-width:400px;font-size:16px;line-height:1.55;color:#eef0f3}
.f-news{max-width:470px;width:100%}
.f-news h3{margin:0;font-weight:500;font-size:19px;letter-spacing:-.035em}
.f-news p{margin:8px 0 18px;color:#eef0f3;font-size:15px;line-height:1.5}
.f-in{display:flex;gap:8px}
.f-in input{flex:1;min-width:0;height:48px;border:0;border-radius:2px;background:#fff;color:#0a0c10;padding:0 18px;font-size:15px;outline:none}
.f-in input:focus-visible{box-shadow:0 0 0 2px #93b2e8}
.f-in .btn{height:48px}
.f-msg{display:block;margin-top:10px;color:var(--mute);font-size:13.5px;min-height:1.2em}
.foot-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:80px;padding-top:40px;border-top:1px solid var(--line)}
.foot-cols h4{margin:0 0 14px;font-weight:500;font-size:14px;color:var(--dim)}
.foot-cols a{display:block;padding:5px 0;color:#d6dae0;font-size:15px}
.foot-cols a:hover{color:#fff}
.foot-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;color:var(--dim);font-size:13.5px}

.ariadne{position:fixed;left:14px;bottom:14px;z-index:50;font:500 12.5px/1 var(--f);padding:7px 11px;border-radius:999px;background:rgba(20,22,26,.88);color:#fff;letter-spacing:.01em;box-shadow:0 0 0 1px rgba(255,255,255,.14);opacity:.92}
.ariadne b{font-weight:600;color:#ff8a3d}

/* reveal (JS only) */
.js [data-rv]{opacity:0;transform:translateY(18px)}
.js [data-in]{opacity:0;transform:translateY(12px)}
.js .win{opacity:0;transform:translateY(40px)}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .links{gap:22px}
  .login{display:none}
  .w-body{grid-template-columns:310px minmax(0,1fr)}
  .big-in{grid-template-columns:240px minmax(0,1fr)}
  .b-ctx{display:none}
  .ui-wa{grid-template-columns:minmax(0,1fr)}
  .wa-sug{position:absolute;right:26px;top:110px;width:230px;box-shadow:0 20px 50px rgba(0,0,0,.5)}
  .q-card{width:360px}
}
@media (max-width:1024px){
  :root{--gut:14px}
  .nav{grid-template-columns:1fr auto;padding:16px 16px 0 20px}
  .links{display:none}
  .nav-r .btn{display:none}
  .burger{display:grid}
  .win{grid-template-columns:minmax(0,1fr)}
  .w-side{display:none}
  .logo-row{justify-content:center;gap:22px 40px}
  .bc h3{margin:24px 24px 0}
  .bc>p{margin:10px 24px 0}
  .bc-ui{padding:22px 20px 0}
  .feat3{grid-template-columns:minmax(0,1fr);gap:40px;max-width:560px}
  .feat3.tight{grid-template-columns:repeat(3,minmax(0,1fr));max-width:var(--wrap);gap:28px}
  .steps{grid-template-columns:minmax(0,1fr);max-width:620px}
  .keys{grid-template-columns:minmax(0,1fr);gap:44px;max-width:680px}
  .nums{grid-template-columns:minmax(0,1fr);gap:40px}
  .n-img{min-height:360px}
  .faq{grid-template-columns:minmax(0,1fr);gap:20px}
  .plans{grid-template-columns:minmax(0,1fr);max-width:520px;gap:14px}
  .plan{background:var(--card);border-radius:4px}
  .pro{margin-top:0;background:var(--navy)}
  .foot{padding:110px 28px 28px}
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bc,.bc.wide{grid-column:span 1}
  .bc.wide,.bc:nth-child(3){grid-column:span 2}
  .ui-ev .ev{max-width:460px}
}
@media (max-width:760px){
  :root{--gut:8px}
  body{font-size:15.5px}
  .hero{--below:150px}
  .brand{font-size:19px}
  .hero-copy{padding-top:56px}
  .hero h1{font-size:clamp(36px,10.4vw,46px);letter-spacing:-.045em}
  .hero .sub{font-size:16px}
  .ctas{flex-direction:column;width:100%;max-width:320px}
  .ctas .btn{width:100%}
  .rating{font-size:13.5px}
  .win-wrap{padding:44px 10px 0}
  .win{height:520px}
  .w-body{grid-template-columns:minmax(0,1fr)}
  .w-read{display:none}
  .w-search,.w-quiet,.w-ib{display:none}
  .sec{padding:110px 16px 0}
  .sec-h{margin-bottom:44px}
  .logos{padding:56px 16px 0}
  .logo-row{justify-content:center;gap:18px 26px}
  .lg{font-size:18px}
  .bento{grid-template-columns:minmax(0,1fr)}
  .bc,.bc.wide,.bc:nth-child(3){grid-column:auto}
  .bc h3{margin:22px 22px 0;font-size:20px}
  .bc>p{margin:8px 22px 0;font-size:15px}
  .bc-ui{padding:20px 18px 0;height:232px}
  .fu-h{display:none}
  .fu-row{grid-template-columns:26px minmax(0,1fr) 54px}
  .fu-bar,.fu-st{display:none}
  .fu-draft{right:14px;left:14px;width:auto;top:96px}
  .ui-wa{height:auto;max-height:none;padding-bottom:6px}
  .ui-wa::after{display:none}
  .wa-sug{position:static;width:auto;box-shadow:none}
  .p-row .why .c+.c{display:none}
  .feat3{padding:0 6px}
  .feat3.tight{grid-template-columns:minmax(0,1fr);gap:28px}
  .big{padding:6px 6px 0}
  .big-in{grid-template-columns:minmax(0,1fr);height:520px}
  .b-list{display:none}
  .b-read{padding:16px}
  .b-sum-h span{display:none}
  .quiet{height:auto;min-height:640px;display:flex;flex-direction:column;justify-content:space-between}
  .q-copy{position:relative;left:auto;top:auto;padding:28px 22px 0}
  .q-card{position:relative;right:auto;bottom:auto;width:auto;margin:24px 14px 14px}
  .k-list{grid-template-columns:minmax(0,1fr)}
  .kd{height:372px}
  .kd-hint{display:none}
  .kd-keys button{width:46px;height:44px}
  .n-stats{grid-template-columns:minmax(0,1fr)}
  .n-stats>div,.n-stats>div+div{padding:18px 0;border-left:0;border-bottom:1px solid var(--line)}
  .t{padding:26px 24px 30px}
  .t h3{font-size:19px}
  .plan{padding:28px 22px 32px}
  .pro{padding-top:28px;padding-bottom:36px}
  .price b{font-size:44px}
  .qa summary{font-size:16.5px;padding:18px 0}
  .cta{height:440px}
  .foot{padding:90px 18px 24px}
  .f-in{flex-direction:column}
  .f-in .btn{width:100%}
  .foot-cols{margin-top:56px}
  .foot-bot{flex-direction:column;gap:6px;margin-top:40px}
  .ariadne{position:static;display:table;margin:28px auto 24px}
}
@media (prefers-reduced-motion:reduce){
  .js [data-rv],.js [data-in],.js .win{opacity:1!important;transform:none!important}
  .type .caret{animation:none}
}
