/* Personal link page — shared styles for the English and Italian versions. */

:root{
  --paper:#F4F5F2;
  --ink:#16191A;
  --muted:#6B7370;
  --rule:#DDE0DA;
  --accent:#8C2F39;
  --accent-soft:#EFE3E4;
  --lift:#FFFFFF;

  --mono: ui-monospace, "Cascadia Mono", "SF Mono", Menlo, Consolas, monospace;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#121513; --ink:#E9EBE5; --muted:#8E968F; --rule:#2A2F2B;
    --accent:#E1727C; --accent-soft:#2A1D1F; --lift:#191D1A;
  }
}
:root[data-theme="light"]{
  --paper:#F4F5F2; --ink:#16191A; --muted:#6B7370; --rule:#DDE0DA;
  --accent:#8C2F39; --accent-soft:#EFE3E4; --lift:#FFFFFF;
}
:root[data-theme="dark"]{
  --paper:#121513; --ink:#E9EBE5; --muted:#8E968F; --rule:#2A2F2B;
  --accent:#E1727C; --accent-soft:#2A1D1F; --lift:#191D1A;
}

*{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.page{
  max-width:44rem;
  margin:0 auto;
  padding:clamp(2.5rem,7vw,5rem) clamp(1.25rem,5vw,2rem) 5rem;
  display:flex;
  flex-direction:column;
  gap:3.25rem;
}

/* ── shared label ─────────────────────────────── */
.label{
  font-family:var(--mono);
  font-size:.6875rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ── language switch ──────────────────────────── */
.langs{display:flex;gap:1rem;align-items:baseline;margin-bottom:.25rem}
.langs a{color:var(--muted);text-decoration:none;border-bottom:1px solid transparent;
  padding-bottom:2px;transition:color .15s ease,border-color .15s ease}
.langs a:hover,.langs a:focus-visible{color:var(--accent);border-bottom-color:var(--accent);outline:none}
.langs .current{color:var(--ink);font-weight:700}

/* ── masthead ─────────────────────────────────── */
.masthead{display:flex;flex-direction:column;gap:1.25rem}

.name{
  margin:0;
  font-size:clamp(2.75rem,10vw,4.25rem);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:.95;
  text-wrap:balance;
}
.name::after{
  content:".";
  color:var(--accent);
}

.role{
  font-family:var(--mono);
  font-size:.875rem;
  letter-spacing:.02em;
  color:var(--accent);
  margin:0;
}

.intro{
  margin:0;
  max-width:34rem;
  color:var(--muted);
  font-size:1.0625rem;
}
.intro strong{color:var(--ink);font-weight:600}

/* ── fact table ───────────────────────────────── */
.facts{
  display:grid;
  grid-template-columns:8.5rem 1fr;
  gap:.55rem 1.5rem;
  border-top:1px solid var(--rule);
  padding-top:1.25rem;
}
.facts dt{margin:0}
.facts dd{margin:0;font-size:.9375rem}

/* ── sections ─────────────────────────────────── */
section{display:flex;flex-direction:column;gap:1rem}

.head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1rem;
  border-bottom:1px solid var(--rule);
  padding-bottom:.6rem;
}
.head h2{
  margin:0;
  font-size:1.0625rem;
  font-weight:650;
  letter-spacing:-.015em;
}

/* ── link rows ────────────────────────────────── */
.rows{display:flex;flex-direction:column}

.row{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:start;
  gap:.35rem 1rem;
  padding:1.0625rem .25rem 1.0625rem 0;
  border-bottom:1px solid var(--rule);
  text-decoration:none;
  color:inherit;
  transition:padding-left .18s ease, background-color .18s ease;
}
a.row:hover,
a.row:focus-visible{
  background:var(--lift);
  padding-left:.85rem;
  outline:none;
}
a.row:focus-visible{box-shadow:inset 3px 0 0 var(--accent)}
a.row:hover .rtitle,
a.row:focus-visible .rtitle{color:var(--accent)}

.rtitle{
  font-weight:650;
  font-size:1.0625rem;
  letter-spacing:-.01em;
  transition:color .18s ease;
}
.rdesc{
  grid-column:1;
  margin:0;
  color:var(--muted);
  font-size:.9375rem;
  max-width:32rem;
}
.rmeta{
  grid-column:2;
  grid-row:1;
  font-family:var(--mono);
  font-size:.6875rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  white-space:nowrap;
  padding-top:.3rem;
}
a.row .rmeta::after{
  content:" →";
  color:var(--accent);
}

/* rows that are not live yet */
.row.pending{opacity:.62}
.row.pending .rmeta{color:var(--accent)}

/* ── jobs ─────────────────────────────────────── */
.jobs{display:flex;flex-direction:column}
.job{padding:1.0625rem 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:.3rem}
.job:last-child{border-bottom:none}
.jobhead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1rem}
.jobrole{font-weight:650;font-size:1.0625rem;letter-spacing:-.01em}
.jobdate{font-family:var(--mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap;padding-top:.3rem}
.jobplace{color:var(--accent);font-size:.8125rem;font-weight:600}
.jobdesc{margin:0;color:var(--muted);font-size:.9375rem;max-width:34rem}

/* ── stack ────────────────────────────────────── */
.stack{display:flex;flex-direction:column;gap:.85rem}
.strand{
  display:grid;
  grid-template-columns:8.5rem 1fr;
  gap:.35rem 1.5rem;
}
.strand p{margin:0;font-size:.9375rem}

/* ── prose block ──────────────────────────────── */
.prose{display:flex;flex-direction:column;gap:.85rem;max-width:34rem}
.prose p{margin:0;font-size:.9375rem;color:var(--muted)}
.prose b{color:var(--ink);font-weight:600}

/* ── footer ───────────────────────────────────── */
footer{
  border-top:1px solid var(--rule);
  padding-top:1.25rem;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.25rem;
  justify-content:space-between;
}

@media (max-width:34rem){
  .facts,.strand{grid-template-columns:1fr;gap:.15rem}
  .facts dd,.strand p{margin-bottom:.55rem}
  .row{grid-template-columns:1fr}
  .rmeta{grid-column:1;grid-row:auto;padding-top:.15rem}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important}
}