/* SwiftMigrate plugin page + plugin author page.
   Loaded after pages.css; uses the shared Organic Reach design tokens. */

/* ── Hero transfer illustration ─────────────────────────────── */
.xfer{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);padding:22px 22px 18px;position:relative;overflow:hidden}
.xfer svg{display:block;width:100%;height:auto}
.xfer .node{fill:var(--bg);stroke:var(--line-strong);stroke-width:1.2}
.xfer .node-dest{stroke:var(--accent)}
.xfer .rack{stroke:var(--line-strong);stroke-width:1.2;stroke-linecap:round}
.xfer .led{fill:var(--faint)}
.xfer .led-on{fill:var(--accent)}
.xfer .track{stroke:var(--line-strong);stroke-width:1.4;stroke-dasharray:4 6;fill:none}
.xfer .lbl{font:600 11px "DM Mono",ui-monospace,monospace;fill:var(--muted)}
.xfer .lbl-strong{font:700 13px Manrope,system-ui,sans-serif;fill:var(--text)}
.xfer .pkt{fill:var(--accent);offset-path:path('M150 120 C 220 60, 300 60, 370 120');offset-rotate:0deg;animation:xferMove 3.6s var(--ease) infinite}
.xfer .pkt-2{animation-delay:1.2s}
.xfer .pkt-3{animation-delay:2.4s}
.xfer .tick{stroke:var(--accent);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.xfer .tick-ring{fill:none;stroke:var(--accent);stroke-width:1.4}
@keyframes xferMove{0%{offset-distance:0%;opacity:0}12%{opacity:1}82%{opacity:1}100%{offset-distance:100%;opacity:0}}
.xfer-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.xfer-legend div{font-size:11.5px;line-height:1.45;color:var(--muted)}
.xfer-legend strong{display:block;color:var(--text);font-size:12.5px;margin-bottom:2px}
@media (prefers-reduced-motion:reduce){.xfer .pkt{animation:none;offset-distance:50%}.xfer .pkt-2,.xfer .pkt-3{display:none}}

/* ── Facts row under the hero copy ──────────────────────────── */
.plugin-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.hero-btns .btn--outline{color:var(--text)}

/* ── Download card ──────────────────────────────────────────── */
.dl-card{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);padding:30px}
.sec--alt .dl-card{background:var(--bg)}
.dl-card h3{font-size:22px;font-weight:800;line-height:1.2}
.dl-card>p{color:var(--muted);font-size:13px;line-height:1.65;margin-top:8px}
.dl-form{display:grid;gap:14px;margin-top:22px}
.dl-form label>span{display:block;font-size:12px;font-weight:600;color:var(--text);margin-bottom:7px}
.dl-form input[type="text"],.dl-form input[type="email"]{width:100%;height:48px;border:1px solid var(--line-strong);border-radius:12px;background:var(--surface);color:var(--text);padding:0 14px;font-size:14px;outline:0;transition:border-color .2s,box-shadow .2s}
.sec--alt .dl-form input[type="text"],.sec--alt .dl-form input[type="email"]{background:var(--surface)}
.dl-form input:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.dl-form input[aria-invalid="true"]{border-color:var(--coral)}
.dl-check{display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.55;color:var(--muted)}
.dl-check input{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);flex-shrink:0}
.dl-check a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.dl-form .btn{justify-self:start;margin-top:4px}
.dl-form .btn[disabled]{opacity:.6;cursor:progress}
.dl-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.dl-status{min-height:20px;font-size:13px;line-height:1.55;color:var(--muted)}
.dl-status.is-error{color:var(--coral)}
.dl-status.is-ok{color:var(--text)}
.dl-status a{color:var(--accent);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.dl-meta{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:26px;border-top:1px solid var(--line)}
.dl-meta div{padding:12px 0;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.dl-meta div:nth-child(odd){padding-right:12px}
.dl-meta strong{display:block;color:var(--text);font-size:14px}

/* ── Author block & author page ─────────────────────────────── */
.author-card{display:flex;gap:18px;align-items:center;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:22px}
.monogram{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;border:1.5px solid var(--accent);color:var(--accent);font:800 22px Manrope,system-ui,sans-serif;letter-spacing:-.02em}
.monogram--lg{width:180px;height:180px;font-size:62px;border-width:2px}
.author-card p{color:var(--muted);font-size:13px;line-height:1.6;margin-top:4px}
.author-card a{color:var(--accent);font-weight:700}
.author-hero-visual{display:grid;place-items:center;min-height:260px}
.plugin-row{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);padding:28px}
.plugin-row h3{font-size:22px;font-weight:800}
.plugin-row p{color:var(--muted);font-size:14px;line-height:1.7;margin-top:8px;max-width:62ch}
.plugin-row .plugin-facts{margin-top:14px}

@media (max-width:900px){
  .xfer-legend{grid-template-columns:1fr}
  .plugin-row{grid-template-columns:1fr}
  .monogram--lg{width:140px;height:140px;font-size:48px}
  .author-hero-visual{min-height:0;justify-items:start}
}
@media (max-width:520px){
  .dl-card{padding:22px}
  .dl-meta{grid-template-columns:1fr}
  .dl-meta div:nth-child(odd){padding-right:0}
}

/* ── Author page: profile panel, highlights, career ─────────── */
.profile-panel{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);padding:28px}
.profile-panel-head{display:flex;gap:18px;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--line)}
.profile-panel-head strong{display:block;font-size:18px;font-weight:800;line-height:1.25}
.profile-panel-head span{display:block;color:var(--muted);font-size:13px;margin-top:3px}
.profile-panel dl{display:grid;gap:14px;margin-top:20px}
.profile-panel dt{font-size:11.5px;color:var(--faint);margin-bottom:3px}
.profile-panel dd{font-size:14px;line-height:1.5;color:var(--text)}
.profile-panel dd span{color:var(--muted)}
.profile-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.profile-links a{font-size:12.5px;font-weight:700;color:var(--text);border:1px solid var(--line-strong);border-radius:999px;padding:8px 14px;transition:border-color .2s,color .2s}
.profile-links a:hover,.profile-links a:focus-visible{border-color:var(--accent);color:var(--accent)}

.highlight-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.highlight{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);padding:30px 28px;display:flex;flex-direction:column}
.highlight-meta{font-size:12px;color:var(--accent);font-weight:700;margin-bottom:12px}
.highlight h3{font-size:20px;font-weight:800;line-height:1.25;margin-bottom:12px}
.highlight p{color:var(--muted);font-size:14px;line-height:1.75}
.highlight .highlight-result{margin-top:auto;padding-top:18px;color:var(--text);font-size:13.5px;line-height:1.6;border-top:1px solid var(--line);margin-top:18px}
.highlight a{color:var(--accent);font-weight:700}

.career{list-style:none;border-top:1px solid var(--line)}
.career li{display:grid;grid-template-columns:170px 1fr;gap:28px;padding:22px 0;border-bottom:1px solid var(--line)}
.career-when{font-size:13px;color:var(--muted);padding-top:2px}
.career-when b{display:block;color:var(--accent);font-size:12px;font-weight:700;margin-top:4px}
.career h3{font-size:17px;font-weight:700;line-height:1.35}
.career h3 span{color:var(--muted);font-weight:500}
.career p{color:var(--muted);font-size:14px;line-height:1.7;margin-top:6px;max-width:74ch}

@media (max-width:900px){
  .highlight-grid{grid-template-columns:1fr}
  .career li{grid-template-columns:1fr;gap:6px}
}