.home{display:flex;align-items:center}
.hero{width:100%;display:flex;align-items:center;padding:clamp(60px,6vw,84px) clamp(18px,3vw,40px) 120px}
.hero-card{--lg-blur:26px;width:min(42%,590px);min-width:300px;display:flex;flex-direction:column;gap:18px;padding:26px 34px 24px;border-radius:34px;position:relative;z-index:2}
[data-theme="light"] .hero-card{--lg-fill:rgba(255,255,255,.58)}
[data-theme="dark"] .hero-card{--lg-fill:rgba(12,16,24,.46)}
.hero-stats{display:flex;gap:0;border-top:1px solid var(--line-2);padding-top:16px;margin-top:2px}
.hero-stats div{flex:1;padding-right:12px}.hero-stats div+div{padding-left:20px;border-left:1px solid var(--line)}
.hero-stats b{display:block;font:600 30px/1 'Inter Tight','Inter',sans-serif;letter-spacing:-.02em}
.hero-stats span{display:block;margin-top:6px;font-size:12.5px;color:var(--text-2)}
.home-right{position:absolute;right:28px;top:96px;z-index:25;display:flex;flex-direction:column;align-items:flex-end;gap:16px}
.home-svc{position:relative;z-index:25;display:flex;flex-direction:column;gap:2px;width:288px;padding:12px;border-radius:26px}
.svc-row{display:flex;align-items:center;gap:14px;min-height:44px;padding:0 14px;border-radius:14px;color:var(--text);text-decoration:none;font-size:15.5px;font-weight:500;transition:background-color .2s}
.svc-row:hover{background:var(--hover);color:var(--text)}
.home-badge{position:absolute;left:20px;bottom:20px;z-index:25;display:flex;align-items:center;gap:14px;width:440px;padding:12px 14px 12px 12px;border-radius:24px}
.msg-ic{flex:none;width:46px;height:46px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(180deg,#6BE87F,#1FC046);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 3px 8px -2px rgba(20,120,50,.5)}
.msg-ic svg{fill:#fff}
.msg-reply{flex:none;align-self:center;display:inline-flex;align-items:center;min-height:34px;padding:0 16px;border-radius:999px;background:var(--btn-grad);color:var(--btn-text);font-size:13.5px;font-weight:600;text-decoration:none;box-shadow:var(--btn-shadow)}
.msg-reply:hover{color:var(--btn-text);filter:brightness(1.08)}
.home-socials .icon-btn:hover,.home-socials .icon-btn:focus-visible{transform:translateY(-4px) scale(1.12);background:var(--accent);color:#fff;box-shadow:0 12px 24px -8px var(--accent)}.home-socials .icon-btn:active{transform:translateY(-1px) scale(1.04)}
.home-socials{position:absolute;right:20px;bottom:20px;z-index:25;display:flex;gap:10px}
.home-sticky{position:absolute;right:344px;bottom:60px;z-index:24;width:286px;padding:20px 22px 22px;color:#3A2E00;background:linear-gradient(165deg,#FFF0A0 0%,#FFE06A 60%,#FFD54A 100%);border-radius:4px 4px 4px 26px;transform:rotate(-3deg);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 18px 34px -12px rgba(40,25,0,.55),0 4px 10px -4px rgba(40,25,0,.35);font-size:15px;line-height:1.35}
.home-sticky::before{content:"";position:absolute;top:-9px;left:50%;width:74px;height:20px;transform:translateX(-50%) rotate(2deg);background:rgba(255,255,255,.45);box-shadow:0 1px 3px rgba(0,0,0,.12);border-radius:2px}
.home-sticky .st-h{font-family:'Caveat',cursive;font-weight:600;font-size:34px;line-height:1;margin:0 0 6px;color:#5A4300}
.home-sticky .st-code{font:500 12.5px/1.35 ui-monospace,"SF Mono",Menlo,Consolas,monospace;gap:7px}.home-sticky .st-code li{display:flex;gap:8px;word-break:break-all}.home-sticky .st-code i{font-style:normal;flex:none}
.home-sticky ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px;font-weight:500}
.home-clock{--lg-blur:22px;position:relative;z-index:25;width:auto;display:flex;align-items:center;gap:18px;padding:14px 24px;border-radius:26px}
[data-theme="light"] .home-clock{--lg-fill:rgba(255,255,255,.6)}
[data-theme="dark"] .home-clock{--lg-fill:rgba(12,16,24,.5)}
.home-clock b{font:600 48px/1 'Inter Tight','Inter',sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.home-clock > span{display:block;white-space:nowrap;font-size:13px;line-height:1.4;color:var(--text-2)}
.home-clock b .sc-interp{font:inherit;display:inline}
.home-clock strong{font-size:15px}
@media (max-width:1180px){.home-sticky{right:300px}.home-right{right:16px;top:84px}.home-svc{width:240px}.home-clock{gap:14px;padding:12px 18px}.home-clock b{font-size:42px}.home-sticky{right:270px;width:250px;font-size:13px}.home-sticky .st-code{font-size:11.5px}.home-sticky .st-code li{word-break:normal;overflow-wrap:anywhere}.hero-card{width:min(40%,590px)}}
@media (max-width:900px){.hero{padding:24px 14px}.hero-card{width:100%;min-width:0}.home-sticky,.home-clock{display:none}.home-right{position:static;display:block}.home-svc{width:auto;margin:0 14px 14px;flex-direction:row;flex-wrap:wrap}.home-badge,.home-socials{position:relative;left:auto;right:auto;bottom:auto;margin:0 14px 14px}.home-socials{justify-content:center;flex-wrap:wrap}.home-badge{width:auto;max-width:100%}.home-badge span{white-space:normal !important}.hero-card{padding:26px 22px}}
.hero-card{animation:slide-l .8s .25s cubic-bezier(.2,.8,.2,1) backwards}
.home-right > *:nth-child(1){animation:slide-r .8s .4s cubic-bezier(.2,.8,.2,1) backwards}.home-right > *:nth-child(2){animation:slide-r .8s .52s cubic-bezier(.2,.8,.2,1) backwards}
.svc-row{transition:transform .25s cubic-bezier(.2,.8,.2,1),background-color .2s}.svc-row:hover{transform:translateX(4px)}
.home-sticky{animation:drop 1s .9s cubic-bezier(.3,1.3,.4,1) backwards;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.home-sticky:hover{transform:rotate(-1deg) translateY(-4px) scale(1.03)}
.home-badge{animation:slide-l .8s 1.3s cubic-bezier(.2,.8,.2,1) backwards}
.home-socials .icon-btn{animation:pop .5s cubic-bezier(.2,.8,.2,1) backwards}.home-socials .icon-btn:nth-child(1){animation-delay:1.5s}.home-socials .icon-btn:nth-child(2){animation-delay:1.58s}.home-socials .icon-btn:nth-child(3){animation-delay:1.66s}.home-socials .icon-btn:nth-child(4){animation-delay:1.74s}
html[data-page="home"][data-theme="light"]{--win:rgba(246,248,251,.12)}
html[data-page="home"][data-theme="dark"]{--win:rgba(16,19,25,.22)}
html[data-page="home"] .window::before{-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-page="home"] .lg-flat::before{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--lg-flat)}
html[data-page="home"] .navlink{font:inherit;font-size:14.5px;font-weight:500;line-height:normal}

/* short desktop windows: tighten the right column so the widgets never collide */
@media (min-width:901px) and (max-height:860px){.home-right{top:84px;gap:12px}.home-clock{padding:10px 20px}.home-clock b{font-size:40px}.svc-row{min-height:38px}.home-svc{padding:10px}.home-sticky{bottom:78px}}
@media (min-width:901px) and (max-height:720px){.svc-row{min-height:32px;font-size:14.5px}.home-sticky{display:none}.hero{padding-bottom:96px}}
@media (min-width:901px) and (max-width:1100px){.home-badge{width:320px}.home-sticky{width:220px;right:330px;bottom:92px}}
@media (min-width:901px) and (max-width:1000px){.home-sticky{display:none}}
@media (min-width:901px) and (max-height:640px){.hero{padding-top:64px;padding-bottom:104px}.hero-card{gap:12px;padding:20px 28px}.hero-card h1{font-size:clamp(34px,3.6vw,46px) !important}.hero-card p{font-size:15px !important}}