.story-page{--contact-mono: ui-monospace, "SF Mono", "JetBrains Mono", menlo, monospace;--contact-live: #1fb27a;.contact-clock{display:inline-flex;align-items:center;gap:.55rem}.contact-dot{position:relative;flex:none;width:.55rem;height:.55rem;border-radius:999px;background:var(--contact-live);box-shadow:0 0 #1fb27a73;&:after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--contact-live);opacity:.6;animation:contactPulse 2.6s var(--ease-expo) infinite}}.contact-time{color:var(--gray-600);font-variant-numeric:tabular-nums}.contact-lines{display:grid;gap:.2rem;margin-top:.75rem;.contact-line{position:relative;display:grid;grid-template-columns:3.25rem minmax(0,1fr) auto;align-items:stretch;gap:.6rem 1.4rem;padding-block:clamp(1.25rem,3vw,1.85rem);padding-inline:clamp(.25rem,1.4vw,1rem);text-decoration:none;outline:0;overflow:visible;transition:padding-inline .42s var(--ease-expo),background-color .42s var(--ease-expo);&:before{content:"";position:absolute;left:0;top:50%;width:2px;height:0;border-radius:999px;background:var(--blue);transform:translateY(-50%);transition:height .42s var(--ease-expo)}&:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(var(--blue-rgb),.07),transparent 62%);opacity:0;transition:opacity .42s var(--ease-expo)}.contact-index{align-self:stretch;display:flex;align-items:center;padding-right:1rem;border-right:1px solid rgba(var(--dark-rgb),.12);color:var(--gray-400);font-family:var(--contact-mono);font-size:.78rem;font-weight:600;line-height:1;letter-spacing:.04em;font-variant-numeric:tabular-nums;transform:none;transition:border-color .32s var(--ease-expo),color .32s var(--ease-expo),transform .42s var(--ease-expo)}.contact-body{display:flex;flex-direction:column;gap:.32rem;min-width:0;text-decoration:none;outline:0}.contact-label{color:var(--blue);font-family:var(--contact-mono);font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;transition:color .32s var(--ease-expo)}.contact-value{color:var(--dark);font-family:var(--font-display);font-size:clamp(1.3rem,3.4vw,1.95rem);font-weight:900;line-height:1.05;overflow-wrap:anywhere;transition:color .3s var(--ease-expo),transform .42s var(--ease-expo)}.contact-arrow{display:grid;place-items:center;align-self:center;color:var(--gray-400);line-height:0;transition:color .32s var(--ease-expo),transform .42s var(--ease-expo)}.contact-arrow svg{display:block}.contact-action{align-self:center;padding:.5rem .95rem;border:1px solid rgba(var(--dark-rgb),.16);border-radius:999px;background:transparent;color:var(--gray-600);font-family:var(--contact-mono);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:color .3s var(--ease-expo),border-color .3s var(--ease-expo),background-color .3s var(--ease-expo),transform .3s var(--ease-expo);&:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-1px)}}&:hover,&:focus-within{padding-inline:clamp(.75rem,2.4vw,1.5rem)}&:hover:before,&:focus-within:before{height:58%}&:hover:after,&:focus-within:after{opacity:1}&:hover .contact-index,&:focus-within .contact-index{border-color:rgba(var(--blue-rgb),.45);color:var(--blue)}&:hover .contact-value,&:focus-within .contact-value{color:var(--blue);transform:translate(.2rem)}&:hover .contact-arrow,&:focus-within .contact-arrow{color:var(--blue);transform:translate(.4rem,-.4rem)}&[data-copied=true] .contact-action{border-color:var(--blue);background:var(--blue);color:#fff}@media(max-width:560px){grid-template-columns:auto 1fr;gap:.45rem 1rem;.contact-arrow,.contact-action{grid-column:2;justify-self:start}.contact-action{margin-top:.35rem}}}}.story-signoff{margin-top:clamp(1.75rem,4vw,2.5rem);color:var(--gray-600);font-family:var(--font-hand);font-size:clamp(1.25rem,3vw,1.7rem);font-weight:700;.ink{color:var(--dark)}}}@keyframes contactPulse{0%{transform:scale(1);opacity:.55}70%,to{transform:scale(2.8);opacity:0}}@media(prefers-reduced-motion:reduce){.story-page{.contact-dot:after{animation:none}.contact-lines .contact-line{transition:background-color .2s ease;&:before,&:after,.contact-index,.contact-value,.contact-arrow,.contact-action{transition:none}&:hover,&:focus-within{padding-inline:clamp(.25rem,1.4vw,1rem)}&:hover .contact-index,&:focus-within .contact-index,&:hover .contact-value,&:focus-within .contact-value,&:hover .contact-arrow,&:focus-within .contact-arrow{transform:none}}}}