.name-story-page{min-height:100svh;background:radial-gradient(ellipse at 85% 18%,#ede0f880,transparent 60%),radial-gradient(ellipse at 10% 75%,#f3e6dc80,transparent 55%),var(--paper)}
.name-story{padding-top:clamp(55px,9vh,100px);padding-bottom:110px;max-width:760px}
.name-story .eyebrow{display:flex;gap:12px;align-items:center;color:var(--plum)}
.name-story h1{font-size:clamp(52px,7vw,84px);line-height:1.04;text-wrap:balance}
.name-story h1 em{color:#8e5ca0}
.name-story-lead{margin-top:34px;max-width:28ch;font-family:var(--serif);font-size:clamp(26px,3vw,32px);line-height:1.3;letter-spacing:-.015em;color:var(--plum)}
.name-story-lead:before{content:"";display:block;width:48px;height:1px;margin-bottom:28px;background:#a786ad}
.name-story-lead em{color:#8e5ca0}
.name-story-body{margin-top:30px}
.name-story-body>p:not(.name-story-ornament){margin-bottom:20px;max-width:60ch;color:#5f4f67;font-size:17px;line-height:1.85}
.name-story-first::first-letter{float:left;margin:9px 9px 0 0;font-family:var(--serif);font-size:68px;line-height:.8;color:#8e5ca0}
.name-story-ornament{display:flex;align-items:center;gap:20px;margin:40px 0 36px;max-width:none;color:#805295;font-family:var(--serif);font-size:24px}
.name-story-ornament:before,.name-story-ornament:after{content:"";flex:1;height:1px;background:var(--line)}
.name-story-quote{position:relative;margin:42px -40px 44px;padding:62px 64px 48px;background:#4a3257;color:#faf2fd;border-radius:8px;overflow:hidden;box-shadow:12px 14px 0 var(--lilac)}
.name-story-quote:before{content:"";position:absolute;width:420px;height:420px;right:-170px;top:-190px;border:1px solid #ffffff14;border-radius:50%;pointer-events:none}
.name-story-quote:after{content:"“";position:absolute;left:44px;top:6px;font-family:var(--serif);font-size:130px;line-height:1;color:#d7b7ed66;pointer-events:none}
.name-story-quote blockquote{position:relative;margin:0}
.name-story-quote blockquote p{max-width:none;font-family:var(--serif);font-size:clamp(32px,4vw,44px);line-height:1.18;letter-spacing:-.02em}
.name-story-quote blockquote em{color:#f4e7dc}
.name-story-quote figcaption{position:relative;display:flex;align-items:center;gap:12px;margin-top:26px;color:#d8c4e5;font-size:12px;font-weight:650;letter-spacing:.16em;text-transform:uppercase}
.name-story-quote figcaption:before{content:"";width:36px;height:1px;background:#d8c4e5}
.name-story-closing{margin-top:44px;padding-top:40px;border-top:1px solid var(--line);text-align:center}
.name-story-dedication{margin:0 auto;max-width:24ch;font-family:var(--serif);font-style:italic;font-size:clamp(27px,3.2vw,34px);line-height:1.3;color:#886296;text-wrap:balance}
.name-story-signoff{margin:22px auto 34px;font-family:var(--serif);font-style:italic;font-size:24px;color:var(--plum)}
.name-story-signoff span{color:var(--coral);font-style:normal}
.name-story-page nav>a[aria-current]{text-decoration:underline;text-underline-offset:7px}
@media(max-width:860px){.name-story-quote{margin-left:0;margin-right:0}}
@media(max-width:580px){.name-story{padding-top:50px;padding-bottom:80px}.name-story .eyebrow{gap:8px}.name-story-lead{margin-top:26px}.name-story-lead:before{margin-bottom:22px}.name-story-body>p:not(.name-story-ornament){font-size:16px;line-height:1.8}.name-story-first::first-letter{font-size:58px;margin-top:8px}.name-story-ornament{margin:32px 0 28px}.name-story-quote{margin:34px 0 36px;padding:54px 26px 34px;box-shadow:8px 10px 0 var(--lilac)}.name-story-quote:after{left:20px;font-size:110px}.name-story-quote figcaption{font-size:11px}.name-story-closing{margin-top:36px;padding-top:34px}.name-story-signoff{font-size:22px}}