.copy-block{border:1px solid #89adb1;border-radius:10px;margin:24px 0;overflow:hidden;background:#f1f7f6}
.copy-bar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:10px 14px;background:#e1efed;border-bottom:1px solid #b5d4d5;font-size:14px;color:#164e5b}
.copy-action{min-height:44px;padding:9px 18px;background:#164e5b;color:#fff;border:0;border-radius:6px;font:inherit;font-weight:750;cursor:pointer}
.voyage-site .copy-block pre{margin:0;border:0;border-radius:0;background:#f7faf9;color:#253f49;white-space:pre-wrap;overflow-wrap:anywhere;padding:22px;line-height:1.8;font-size:15px}
.copy-success .copy-action{animation:copy-confirm .35s ease-out;background:#21666b}
@keyframes copy-confirm{50%{transform:scale(1.04)}}
.voyage-site[data-feature]{--feature-accent:#36a6ac}
.voyage-site[data-feature=blog]{--feature-accent:#164e5b}
.voyage-site[data-feature=skills]{--feature-accent:#21666b}
.voyage-site[data-feature=projects]{--feature-accent:#407d91}
.voyage-site[data-feature=about],.voyage-site[data-feature=invite],.voyage-site[data-feature=contact]{--feature-accent:#9b7944}
.voyage-site .page-header,.skill-hero{position:relative;overflow:hidden;border-bottom:3px solid var(--feature-accent)}
.page-header .wrap,.skill-hero .wrap{position:relative}
.feature-emblem{display:flex;gap:6px;width:100px;height:22px;margin-top:28px;align-items:center}
.feature-emblem span{height:5px;border-radius:50%;width:30px;background:var(--feature-accent);transform:skewX(-25deg)}
.feature-emblem span:nth-child(2){width:45px;opacity:.65}
.feature-emblem span:nth-child(3){opacity:.35}
[data-feature=knowledge] .feature-emblem span,[data-feature=courses] .feature-emblem span{height:18px;border-radius:2px;transform:rotate(-8deg);border-bottom:3px solid #d4bd8d}
[data-feature=skills] .feature-emblem span{border-radius:2px;transform:none}
[data-feature=projects] .feature-emblem span{height:18px;border-radius:4px;transform:none}
[data-feature=blog] .feature-emblem{align-items:end}
[data-feature=blog] .feature-emblem span{border-radius:1px;transform:none;height:18px}
[data-feature=blog] .feature-emblem span:nth-child(2){height:12px}
[data-feature=blog] .feature-emblem span:nth-child(3){height:7px}
.skill-tile,.project-grid .contact-block,.post-list .card{transition:box-shadow .2s,border-color .2s}
.skill-tile:hover,.project-grid .contact-block:hover,.post-list .card:hover{border-color:var(--feature-accent);box-shadow:0 5px 0 -3px #36a6ac55}
.feature-entered{animation:feature-arrive .4s ease-out both}
@keyframes feature-arrive{from{opacity:.65;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.feature-entered,.copy-success .copy-action{animation:none}.skill-tile,.project-grid .contact-block,.post-list .card{transition:none}}
@media(prefers-reduced-motion:no-preference){
.feature-emblem span{animation:feature-mark .65s ease-out both}
.feature-emblem span:nth-child(2){animation-delay:.08s}
.feature-emblem span:nth-child(3){animation-delay:.16s}
@keyframes feature-mark{from{opacity:0;translate:-8px 0}to{translate:0 0}}
}
[data-feature=newsletter]{--feature-accent:#164e5b}
[data-feature=newsletter] .feature-emblem{margin:18px auto 0}
[data-feature=newsletter] .feature-emblem span{border-radius:0;height:3px;transform:none}
[data-feature=about] .feature-emblem span{border-radius:50%;height:14px;width:14px;transform:none}
[data-feature=invite] .feature-emblem span,[data-feature=contact] .feature-emblem span{border-radius:3px;height:16px;border:2px solid var(--feature-accent);background:transparent;transform:skewY(-8deg)}
[data-feature=resources] .feature-emblem{flex-direction:column;align-items:start;height:28px;gap:4px}
[data-feature=resources] .feature-emblem span{height:3px;border-radius:0;transform:none}
[data-feature=invite] .field:focus-within label{color:#164e5b;font-weight:800}
[data-feature=invite] .field input:focus,[data-feature=invite] .field textarea:focus{border-color:#21666b;box-shadow:0 0 0 3px #36a6ac22}
.copy-block pre{white-space:pre-wrap;overflow-wrap:anywhere}
@media(prefers-reduced-motion:no-preference){[data-feature=invite] .field input,[data-feature=invite] .field textarea{transition:border-color .2s,box-shadow .2s}}
