/* Project cards: layered light, readable hierarchy and composed image movement. */
main.home #work{background:radial-gradient(ellipse at 10% 30%,#eaf8ef80,transparent 60%),#fff}
main.home #work .cs6-card{isolation:isolate;border:1px solid #d8e7df;background:#fff;box-shadow:0 14px 35px -26px #023a5150;transition:top .35s ease,border-color .25s,box-shadow .35s}
main.home #work .cs6-card:hover,main.home #work .cs6-card:focus-visible{top:-5px;border-color:#49d884;box-shadow:0 25px 55px -28px #066c4280,0 0 26px -12px #47e68b99}
main.home #work .cs6-card::after{content:"";position:absolute;z-index:3;inset:0;border-radius:inherit;padding:2px;pointer-events:none;background:radial-gradient(260px circle at var(--glow-x,50%) var(--glow-y,50%),#ddffe9,#31dd7c 35%,#47d78433 80%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;transition:opacity .25s}
main.home #work .cs6-card:hover::after,main.home #work .cs6-card:focus-visible::after{opacity:1}
main.home #work .cs6-body{position:relative;isolation:isolate;padding:clamp(22px,2.4vw,32px);gap:0}
main.home #work .cs6-body::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse at var(--glow-x,50%) 120%,#65e99d70,transparent 75%);opacity:0;transition:opacity .4s}
main.home #work .cs6-card:hover .cs6-body::before,main.home #work .cs6-card:focus-visible .cs6-body::before{opacity:1}
main.home #work .cs6-body .case-client{font-size:clamp(1.35rem,2vw,1.85rem);line-height:1.2;letter-spacing:-.03em;font-weight:800;margin:0 0 18px;color:#023a51}
main.home #work .cs6-body p:not(.case-client){font-size:.95rem;line-height:1.65;margin:0 0 14px;color:#536c76}
main.home #work .cs6-body p b{display:inline-block;margin-right:4px;color:#117940;font-weight:800}
main.home #work .cs6-body .txt-link{display:inline-flex;align-items:center;gap:12px;width:100%;margin-top:10px;padding-top:16px;border-top:1px solid #cce5d6;font-size:.88rem;line-height:1.5;font-weight:750}
main.home #work .cs6-body .txt-link .arr{margin-left:auto;display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border:1px solid #b9dfc8;border-radius:50%;background:#eef9f2;transition:transform .3s,background .3s,color .3s}
main.home #work .cs6-card:hover .txt-link .arr,main.home #work .cs6-card:focus-visible .txt-link .arr{transform:rotate(45deg);background:#0c7840;color:#fff}
main.home #work .cs6-pic{transition:transform 1s cubic-bezier(.2,.7,.2,1)}
main.home #work .cs6-card:hover .cs6-pic,main.home #work .cs6-card:focus-visible .cs6-pic{transform:scale(1.055)}
main.home #work .cs6-img::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#012736aa);pointer-events:none}
main.home #work .case-tag{z-index:2;background:#ffffffed;border:1px solid #ffffffa0;box-shadow:0 3px 18px #001f3020;font-size:.7rem;line-height:1.5;max-width:calc(100% - 82px)}
main.home #work .cs9-number{position:absolute;z-index:2;top:16px;right:16px;display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff65;border-radius:12px;background:#01364ccc;color:#dcffe9;font-size:.72rem;font-weight:750;letter-spacing:.08em}
@media(min-width:1001px){main.home #work .cs6-card:first-child .cs6-img{aspect-ratio:auto;flex:1;min-height:270px}main.home #work .cs6-card:first-child .cs6-body{flex:0}main.home #work .cs6-card:not(:first-child) .cs6-body{padding:24px}}
@media(max-width:1000px){main.home #work .cs6-list{gap:24px}main.home #work .cs6-card .cs6-img,main.home #work .cs6-card:first-child .cs6-img{aspect-ratio:16/9;min-height:0}main.home #work .cs6-body{padding:24px}}
@media(prefers-reduced-motion:reduce){main.home #work .cs6-card,main.home #work .cs6-card::after,main.home #work .cs6-body::before,main.home #work .cs6-pic,main.home #work .arr{transition:none!important}main.home #work .cs6-card:hover{top:0}main.home #work .cs6-card:hover .cs6-pic{transform:none}}

/* Close the gap between projects and the guide library. */
main.home #work{padding-bottom:clamp(28px,4vw,48px)}
main.home #work .h-note{margin-bottom:0}
main.home #work + #library{padding-top:clamp(32px,4vw,52px)}