/* ps-contact.css: Contact page cards and call band.
   Big soft-tinted cards, no outline, prominent coloured icon top-left,
   label and value stacked below. Loads after the site sheets. */

.contact-page .actions{display:none}

.contact-cards{
  --c-pad:24px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;
  margin:40px 0 0;
}

.c-card{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:20px;
  box-sizing:border-box;
  padding:var(--c-pad);
  border:0;
  border-radius:20px;
  background:var(--c-tint,#f4f5f7);
  color:#202020;
  text-decoration:none;
  transition:transform 200ms ease,box-shadow 200ms ease;
}

a.c-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px -12px rgba(0,0,0,.22);
}

a.c-card:focus-visible{outline:2px solid #202020;outline-offset:3px}

.c-card__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  flex:none;
  border-radius:16px;
  background:var(--c-chip,#fff);
  color:var(--c-ink,#202020);
}
.c-card__icon svg{width:28px;height:28px;display:block}

.c-card__body{display:flex;flex-direction:column;gap:4px;min-width:0;width:100%}

.c-card__label{
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(32,32,32,.55);
}

.c-card__value{
  font-size:1.0625rem;
  font-weight:600;
  line-height:1.35;
  color:#202020;
  overflow-wrap:anywhere;
}

.c-card__note{
  margin-top:2px;
  font-size:.875rem;
  line-height:1.45;
  color:rgba(32,32,32,.6);
}

.c-card__go{
  position:absolute;
  top:var(--c-pad);
  inset-inline-end:var(--c-pad);
  color:rgba(32,32,32,.4);
  transition:color 200ms ease;
}
a.c-card:hover .c-card__go{color:#202020}

/* Per-card colour. Icons carry the colour, the card keeps a soft tint of it. */
.c-card--mail{--c-tint:#eef3ff;--c-chip:#fff;--c-ink:#2f5fd4}
.c-card--phone{--c-tint:#ecf8f0;--c-chip:#fff;--c-ink:#2c8a52}
.c-card--place{--c-tint:#fff4e8;--c-chip:#fff;--c-ink:#bf7018}
.c-card--network{--c-tint:#f0efff;--c-chip:#fff;--c-ink:#5148cc}
.c-card--cv{--c-tint:#f6eeff;--c-chip:#fff;--c-ink:#7a3fbd}
.c-card--mentor{--c-tint:#eaf7f5;--c-chip:#fff;--c-ink:#0f7f74}

/* The CV card carries the split download control, so it spans wider where
   there is room and gives the button its own row. */
.c-card--cv .ps-cv{margin-top:14px}

/* ── Call band ──────────────────────────────────────────────────── */

.call-band{
  padding-block:56px 88px;   /* keeps the card clear of the footer */
}

.call-card{
  box-sizing:border-box;
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  padding:32px;
  border:0;
  border-radius:24px;
  background:#f1f2f5;
}

.call-card__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  margin-bottom:4px;
  border-radius:16px;
  background:#fff;
  color:#b0692a;
}
.call-card__icon svg{width:28px;height:28px;display:block}

.call-card__title{margin:0;font-size:1.5rem;line-height:1.25;font-weight:600;color:#202020}
.call-card__text{margin:0;max-width:56ch;font-size:1rem;line-height:1.55;color:rgba(32,32,32,.68)}
.call-card__cta{margin-top:10px}

@media (max-width:560px){
  .contact-cards{grid-template-columns:1fr;gap:12px;margin-top:32px}
  .call-band{padding-block:40px 64px}
  .call-card{padding:24px}
  .call-card__title{font-size:1.3125rem}
}

@media (prefers-reduced-motion:reduce){
  .c-card,.c-card__go{transition:none}
  a.c-card:hover{transform:none}
}