/* Profile templates (inc/profile-templates.php): /author/<login>/, profile cards, Create Profile page.
   Not a design file: uses shell.css tokens only. Light by default; dark follows the OS setting. */
.pf-hero, .pf-body, .pf-card, .pf-form {
  --pf-bg: var(--paper); --pf-surface: var(--card); --pf-ink: var(--ink); --pf-muted: var(--muted);
  --pf-line: var(--line); --pf-link: var(--sec-ink); --pf-chip: var(--sec-tint); --pf-chip-ink: var(--ink);
}
@media (prefers-color-scheme: dark) {
  .pf-hero, .pf-body, .pf-card, .pf-form {
    --pf-bg: var(--night); --pf-surface: var(--night-2); --pf-ink: var(--night-text); --pf-muted: var(--night-muted);
    --pf-line: #2C2E33; --pf-link: var(--sec-accent); --pf-chip: var(--sec-deep-2); --pf-chip-ink: var(--night-text);
  }
  body:has(.pf-hero), body:has(.pf-form) { background: var(--night); }
}
.pf-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pf-hero, .pf-body { background: var(--pf-bg); color: var(--pf-ink); font-family: var(--font-ui); }
.pf-hero a, .pf-body a, .pf-card a { color: var(--pf-link); }
.pf-hero :focus-visible, .pf-body :focus-visible, .pf-card :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; box-shadow: 0 0 0 5px #111; }

/* cover: wide image, or the home-section gradient when there is none */
.e-con.ncd-box.pf-cover { position: relative; height: clamp(160px, 26vw, 340px); overflow: hidden;
  background: radial-gradient(120% 140% at 15% 0%, var(--sec-deep-2) 0%, var(--sec-deep) 60%), var(--sec-deep); }
.pf-cover .elementor-widget, .pf-cover .elementor-widget-container { position: absolute; inset: 0; }
.pf-cover img.pf-cover__img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }

/* head: avatar overlaps the cover */
.e-con.ncd-box.pf-head { --display: grid; display: grid; grid-template-columns: auto minmax(0,1fr); gap: var(--s-5); align-items: start; position: relative; padding-bottom: var(--s-5); }
.pf-head > .elementor-widget { grid-column: 1; grid-row: 1; width: auto; margin-top: -72px; }
.pf-head > .pf-id { grid-column: 2; grid-row: 1; }
.pf-hero img.pf-avatar, .pf-avatar { width: 160px; height: 160px; border-radius: 50%; object-fit: cover; display: grid; place-items: center;
  border: 5px solid var(--pf-bg); background: var(--sec-ink); color: var(--sec-on-ink); font: 600 48px/1 var(--font-ui); flex: none; }
.e-con.ncd-box.pf-id { min-width: 0; padding-top: var(--s-5); }
.pf-name { font-family: var(--sec-display); font-weight: var(--sec-display-weight); letter-spacing: var(--sec-display-track);
  line-height: 1.02; font-size: var(--hero-size); margin: 0; color: var(--pf-ink); overflow-wrap: anywhere; }
.pf-pronouns { margin: 4px 0 0; color: var(--pf-muted); font-size: 15px; }
.pf-tagline { margin: 8px 0 0; font-size: 19px; line-height: 1.4; }
.pf-town { margin: 8px 0 0; display: flex; align-items: center; gap: 6px; font-weight: 600; }
.pf-ico { width: 18px; height: 18px; fill: currentColor; color: var(--pf-muted); flex: none; }

/* body sections */
.e-con.ncd-box.pf-body { padding-bottom: var(--block-y); }
.e-con.ncd-box.pf-sec { border-top: 1px solid var(--pf-line); padding: var(--s-6) 0; max-width: 760px; }
.pf-h { font: 600 13px/1.2 var(--font-ui); text-transform: uppercase; letter-spacing: .08em; color: var(--pf-muted); margin: 0 0 var(--s-3); }
.pf-what .elementor-widget + .elementor-widget { margin-top: var(--s-5); }
.pf-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.pf-chips .chip { background: var(--pf-chip); color: var(--pf-chip-ink); font-size: 14px; padding: 6px 13px; }
.pf-since { margin: 0; font-size: 16px; }
.pf-prose { font-size: 17px; line-height: 1.6; max-width: 65ch; }
.pf-prose p { margin: 0 0 1em; }
.e-con.ncd-box.pf-linkrow { --display: flex; display: flex; flex-wrap: wrap; gap: 10px; }
.pf-linkitem { width: auto !important; }
.pf-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: var(--r-pill);
  border: 1px solid var(--pf-line); background: var(--pf-surface); font-weight: 600; text-decoration: none; }
.pf-link:hover { border-color: var(--pf-link); }

@media (max-width: 640px) {
  .e-con.ncd-box.pf-head { grid-template-columns: minmax(0,1fr); align-items: start; gap: var(--s-3); }
  .pf-head > .elementor-widget { margin-top: -56px; }
  .e-con.ncd-box.pf-id { padding-top: 0; }
  .pf-head > .pf-id { grid-column: 1; grid-row: 2; }
  .pf-hero img.pf-avatar, .pf-avatar { width: 112px; height: 112px; font-size: 34px; border-width: 4px; }
  .pf-tagline { font-size: 17px; }
}

/* preview card */
.e-con.ncd-box.pf-card { --display: flex; display: flex; gap: var(--s-4); align-items: center; padding: var(--s-4);
  background: var(--pf-surface); color: var(--pf-ink); border: 1px solid var(--pf-line); border-radius: var(--r-card); position: relative; font-family: var(--font-ui); }
.pf-card img.pf-card__avatar, .pf-card__avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: grid; place-items: center;
  background: var(--sec-ink); color: var(--sec-on-ink); font: 600 20px/1 var(--font-ui); flex: none; }
.e-con.ncd-box.pf-card__text { min-width: 0; }
.pf-card__name { margin: 0; font: 600 18px/1.25 var(--font-ui); }
.pf-card__name a { text-decoration: none; color: inherit; }
.pf-card__name a::after { content: ""; position: absolute; inset: 0; } /* whole card is the link */
.pf-card__tagline { margin: 2px 0 0; font-size: 14px; color: var(--pf-muted); }
.pf-card__town { margin: 2px 0 0; font-size: 13px; font-weight: 600; color: var(--pf-muted); }

/* Create Profile page: clean app screen */
.e-con.ncd-box.pf-form { max-width: 760px; padding-top: var(--s-7); padding-bottom: var(--block-y); color: var(--pf-ink); font-family: var(--font-ui); }
.pf-form__title { font: 600 32px/1.15 var(--font-ui); margin: 0 0 var(--s-4); }
.pf-form .ncd-pc--inline { margin-bottom: var(--s-5); }
.pf-form__nojs { padding: var(--s-4); border: 1px solid var(--pf-line); border-radius: var(--r-card); }
