/* ==========================================================================
   AGENZY — Member profile template (/<slug>/) · v3 · extends site.css
   One template for all 4 members. REAL data only (live vCards): portrait, name, title, phone, email,
   socials, QR. Bio / skills / projects sections return when the client supplies that content.
   ========================================================================== */

/* ---------- Hero ---------- */
.pr-hero{position:relative;overflow:hidden;padding-block:clamp(var(--s3),4vw,var(--s6)) clamp(var(--s8),8vw,var(--s12))}
.pr-hero__grid{display:grid;gap:var(--s4)}
.crumbs{display:flex;gap:10px;align-items:center;font-size:var(--t-small);color:var(--deep)}
.crumbs a{color:var(--blue);font-weight:500;text-decoration:underline;text-underline-offset:4px}
.crumbs [aria-current]{color:var(--midnight)}
.pr-hero__fig{position:relative;isolation:isolate;order:1;margin-inline:calc(var(--gutter) * -1)}
.pr-hero__text{order:2;display:grid;gap:var(--s2);align-content:end}
.pr-hero .eyebrow{justify-self:start}
.pr-hero__name{font-size:var(--t-hero);color:var(--midnight)}
.pr-hero__name .l{display:block}
.pr-hero__name .l + .l{padding-inline-start:.5em}
.pr-hero__en{direction:ltr;text-align:right;font-size:var(--t-h3);font-weight:500;letter-spacing:.02em;color:var(--blue)}
.pr-hero__role{font-size:var(--t-body);color:var(--deep)}
.pr-hero__fig .crop-sym{--sym:var(--blue);width:clamp(110px,32%,210px);left:-11%;bottom:-6%;z-index:-1}   /* v11: whole face peeking behind the portrait corner */
.pr-hero__media{aspect-ratio:3/4;background:var(--midnight);outline:1px solid var(--mist);outline-offset:-1px}
.pr-hero__media picture{position:absolute;inset:0}
.pr-hero__media img{object-position:50% 22%}

/* contact list (mirrors the live vCard: phone · email · website, each copyable) */
.pr-contact{list-style:none;margin:var(--s2) 0 0;padding:0;display:grid;gap:8px;max-width:460px}
.pr-c{display:flex;align-items:center;gap:6px;border:1px solid var(--mist);border-radius:var(--radius);padding:6px;transition:border-color .3s var(--e-out)}
.pr-c__a{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:4px;border-radius:14px}
.pr-c__ic{flex:none;width:40px;height:40px;border-radius:50%;background:var(--mist);color:var(--blue);display:grid;place-items:center;transition:background .3s,color .3s}
.pr-c__ic svg{width:18px;height:18px}
.pr-c__tx{display:grid;line-height:1.45;min-width:0}
.pr-c__tx small{font-size:var(--t-micro);color:var(--deep)}
.pr-c__tx b{font-weight:500;font-size:var(--t-body);text-align:right;overflow-wrap:anywhere;color:var(--midnight)}
.pr-c__copy{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--deep);transition:background var(--d-fast),color var(--d-fast)}
.pr-c__copy svg{width:17px;height:17px}
.pr-c__copy.is-copied{background:var(--blue);color:var(--white)}
@media (hover:hover){
  .pr-c:hover{border-color:var(--blue)}
  .pr-c:hover .pr-c__ic{background:var(--blue);color:var(--white)}
  .pr-c__copy:hover{background:var(--mist);color:var(--midnight)}
}
@media (hover:none){.pr-c.is-live{border-color:var(--blue)}.pr-c.is-live .pr-c__ic{background:var(--blue);color:var(--white)}}
.pr-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s2)}
.pr-actions .btn svg{width:17px;height:17px}
.pr-social{display:flex;gap:8px}

/* ---------- vCard / QR ---------- */
.pr-card__grid{display:grid;gap:var(--s5);align-items:center}
.pr-card__qr{justify-self:start;width:min(220px,60vw);padding:14px;border-radius:var(--radius-lg);background:var(--white)}
.pr-card__qr img{width:100%;height:auto;border-radius:10px}
.pr-card__tx{display:grid;gap:var(--s2);max-width:44ch}
.pr-card__h{font-size:var(--t-h2);font-weight:600;line-height:1.3;color:var(--midnight)}
.pr-card__p{font-size:var(--t-body);line-height:1.8;color:var(--deep)}
.pr-card__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--s1)}

/* ---------- Next member ---------- */
.pr-next{padding-block:var(--s8) var(--s10)}
.pr-next__link{position:relative;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"k k k" "f n g" "f r g";column-gap:var(--s3);row-gap:2px;align-items:center;padding:var(--s3);border-radius:var(--radius-lg);border:1px solid var(--mist);overflow:hidden;isolation:isolate;transition:color var(--d-mid)}
.pr-next__link::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--blue);transform:scaleY(0);transform-origin:bottom;transition:transform var(--d-mid) var(--e-shift)}
.pr-next__k{grid-area:k;font-size:var(--t-small);color:var(--deep);margin-bottom:var(--s2);transition:color var(--d-mid)}
.pr-next__face{grid-area:f;width:clamp(64px,7vw,96px);aspect-ratio:1;border-radius:50%}
.pr-next__face picture,.pr-next__face img{position:absolute;inset:0;width:100%;height:100%}
.pr-next__face img{object-position:50% 25%}
.pr-next__name{grid-area:n;font-size:var(--t-h1);line-height:1.3}
.pr-next__role{grid-area:r;direction:ltr;text-align:right;font-size:var(--t-small);color:var(--deep);transition:color var(--d-mid)}
.pr-next__go{grid-area:g;width:48px;height:48px;border-radius:50%;background:var(--blue);color:var(--white);display:grid;place-items:center;transition:background var(--d-mid),color var(--d-mid),transform var(--d-mid) var(--e-shift)}
.pr-next__go svg{width:20px;height:20px}
.pr-next__link:focus-visible{color:var(--white);outline-color:var(--blue)}
.pr-next__link:focus-visible::before{transform:scaleY(1)}
.pr-next__link:focus-visible .pr-next__k,.pr-next__link:focus-visible .pr-next__role{color:var(--mist)}
@media (hover:hover){
  .pr-next__link:hover{color:var(--white)}
  .pr-next__link:hover::before{transform:scaleY(1)}
  .pr-next__link:hover .pr-next__k,.pr-next__link:hover .pr-next__role{color:var(--mist)}
  .pr-next__link:hover .pr-next__go{background:var(--white);color:var(--blue);transform:translateX(-8px)}
}
@media (hover:none){
  .pr-next__link.is-live{color:var(--white)}
  .pr-next__link.is-live::before{transform:scaleY(1)}
  .pr-next__link.is-live .pr-next__k,.pr-next__link.is-live .pr-next__role{color:var(--mist)}
  .pr-next__link.is-live .pr-next__go{background:var(--white);color:var(--blue);transform:translateX(-8px)}
}
.pr-next__all{display:inline-block;margin-top:var(--s3);font-weight:500;color:var(--blue);text-decoration:underline;text-underline-offset:5px}

/* ---------- Breakpoints ---------- */
@media (min-width:640px){
  .pr-hero__fig{margin-inline:0}
  .pr-hero__media{border-radius:var(--radius-lg)}
  .pr-card__grid{grid-template-columns:auto 1fr;column-gap:var(--s8)}
}
@media (min-width:1024px){
  .pr-hero{padding-top:var(--s4)}
  .pr-hero__grid{grid-template-columns:repeat(12,1fr);column-gap:var(--col-gap);row-gap:var(--s4)}
  .crumbs{grid-column:1/-1}
  .pr-hero__text{grid-column:1/7;grid-row:2;order:0;padding-bottom:var(--s4)}
  .pr-hero__fig{grid-column:8/-1;grid-row:2;order:0}
  .pr-hero__media{max-height:calc(100vh - var(--hdr) - 96px);width:100%;min-height:520px}
  .pr-hero__name{font-size:clamp(3rem,7vw,7.5rem)}
}
@media (forced-colors:active){.pr-next__link::before{background:Highlight}}
@media (max-width:639.98px){.pr-hero__fig .crop-sym{display:none}}
