@layer components{.as-reveal{opacity:0;transition:opacity 1s,transform 1s cubic-bezier(.2,.7,.2,1);transform:translateY(20px)}.as-reveal.as-in{opacity:1;transform:none}.as-service{border-bottom:1px solid color-mix(in srgb, var(--color-ink) 18%, transparent);cursor:default;grid-template-columns:56px 1fr 2fr 36px;align-items:center;column-gap:40px;padding:36px 0;transition:border-color .6s cubic-bezier(.7,0,.2,1);display:grid;position:relative}.as-service:first-child{border-top:1px solid color-mix(in srgb, var(--color-ink) 18%, transparent)}.as-service:hover{border-bottom-color:var(--color-ink)}.as-service:hover+.as-service,.as-service:first-child:hover{border-top-color:var(--color-ink)}.as-service:after{content:"";background:var(--color-ink);transform-origin:0;pointer-events:none;height:1px;transition:transform .9s cubic-bezier(.7,0,.2,1);position:absolute;bottom:-1px;left:0;right:0;transform:scaleX(0)}.as-service:hover:after{transform:scaleX(1)}.as-service-num{font-family:var(--font-serif);color:var(--color-ink-soft);letter-spacing:.05em;font-size:18px;font-style:italic;font-weight:300;transition:color .4s,transform .6s cubic-bezier(.7,0,.2,1)}.as-service:hover .as-service-num{color:var(--color-ink);transform:translate(4px)}.as-service-title{font-family:var(--font-serif);letter-spacing:-.01em;color:var(--color-ink);margin:0;font-size:26px;font-style:italic;font-weight:300;line-height:1.15;transition:transform .7s cubic-bezier(.7,0,.2,1),color .4s}.as-service:hover .as-service-title{transform:translate(4px)}.as-service-desc{font-family:var(--font-sans);color:var(--color-ink-soft);max-width:52ch;margin:0;font-size:15.5px;font-weight:300;line-height:1.65;transition:color .4s}.as-service:hover .as-service-desc{color:var(--color-ink)}.as-service-mark{transition:background .5s;position:relative}.as-service-mark:after{content:"";background:var(--color-ink);border-radius:50%;width:6px;height:6px;transition:transform .5s cubic-bezier(.7,0,.2,1),background .4s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.4)}.as-service:hover .as-service-mark{background:var(--color-ink)}.as-service:hover .as-service-mark:after{background:var(--color-cream);transform:translate(-50%,-50%)scale(1)}@media (width<=768px){.as-service{grid-template-columns:32px 1fr 28px;gap:10px 12px;padding:24px 0}.as-service-num{grid-area:1/1;font-size:16px}.as-service-title{grid-area:1/2;font-size:22px}.as-service-desc{grid-area:2/1/auto/-2;font-size:14.5px}.as-service-mark{grid-area:1/3}}}
