/* About / Resume / Contact — simple content pages on the light (.ee-hp) system. */

.page-hero{padding:clamp(40px,6vw,92px) 0 clamp(26px,3.2vw,44px);border-bottom:1px solid var(--rule-soft)}
.page-h1{font-size:clamp(34px,5vw,62px);line-height:1.04;letter-spacing:-.02em;font-weight:500;
  margin:clamp(14px,1.8vw,22px) 0 0;text-wrap:balance}
.page-lede{color:var(--muted);font-size:clamp(18px,1.6vw,22px);line-height:1.55;
  margin-top:clamp(16px,2vw,26px);max-width:60ch}

/* generic prose */
.prose{max-width:68ch;margin-top:clamp(30px,4vw,52px)}
.prose p{color:var(--muted);font-size:clamp(17px,1.2vw,19px);line-height:1.72;margin-top:1.15em}
.prose p:first-child{margin-top:0}
.prose strong{color:var(--ink);font-weight:600}

/* two-column content layout (about) */
.split{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(30px,5vw,80px);
  margin-top:clamp(34px,4.5vw,64px);align-items:start}
.split__side{position:sticky;top:32px;align-self:start}
.portrait{width:100%;max-width:340px;height:auto;display:block;margin:0 0 clamp(24px,3vw,34px);border:1px solid var(--rule-soft)}
@media(max-width:820px){.split{grid-template-columns:1fr;gap:clamp(28px,5vw,40px)}.split__side{position:static}}

.facts{list-style:none;padding:0;margin:0;display:grid;gap:18px}
.facts li{border-top:1px solid var(--rule-soft);padding-top:14px}
.facts .k{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.facts .v{font-size:17px;margin-top:5px}
.facts .v a{border-bottom:1px solid var(--rule);transition:color .2s,border-color .2s}
.facts .v a:hover{color:var(--brick);border-color:var(--brick)}

.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(28px,3.4vw,42px)}
.btn{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:12.5px;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;padding:15px 26px;border:1.5px solid var(--brick);
  transition:background .22s,color .22s;cursor:pointer;display:inline-flex;align-items:center;gap:9px}
.btn--fill{background:var(--brick);color:#fff}
.btn--fill:hover{background:var(--brick-ink);border-color:var(--brick-ink)}
.btn--out{background:transparent;color:var(--brick)}
.btn--out:hover{background:var(--brick);color:#fff}

/* ── resume / CV ─────────────────────────────────────────────────────────────── */
.cv{margin-top:clamp(34px,4.5vw,60px);padding-bottom:clamp(56px,8vw,104px)}
.cv__sec{margin-top:clamp(38px,5vw,64px)}
.cv__sec:first-child{margin-top:0}
.cv__label{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:12px;font-weight:800;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink);padding-bottom:14px;border-bottom:2px solid var(--ink)}
.role{display:grid;grid-template-columns:1fr auto;gap:6px 24px;padding:clamp(20px,2.4vw,30px) 0;
  border-bottom:1px solid var(--rule-soft)}
.role__co{font-size:clamp(21px,2vw,27px);font-weight:600;letter-spacing:-.01em}
.role__when{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap;text-align:right;padding-top:8px}
.role__title{grid-column:1/-1;font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:13px;
  font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brick);margin-top:-2px}
.role__list{grid-column:1/-1;list-style:none;padding:0;margin:12px 0 0;display:grid;gap:9px}
.role__list li{position:relative;padding-left:20px;color:var(--muted);font-size:16px;line-height:1.6}
.role__list li::before{content:"";position:absolute;left:0;top:.66em;width:6px;height:6px;background:var(--brick);border-radius:50%}
.role__list b{color:var(--ink);font-weight:600}

.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 40px;margin-top:22px}
.chips div{border-top:1px solid var(--rule-soft);padding-top:12px;font-size:16px}
@media(max-width:600px){.chips{grid-template-columns:1fr}}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin-top:22px;font-size:16px}
.kv .k{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint);padding-top:3px}

/* ── contact ─────────────────────────────────────────────────────────────────── */
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule-soft);
  border:1px solid var(--rule-soft);margin-top:clamp(34px,4.5vw,58px)}
.contact-card{background:var(--paper);padding:clamp(26px,3vw,40px);display:block;transition:background .2s}
a.contact-card:hover{background:var(--panel)}
.contact-card .k{font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.contact-card .v{font-size:clamp(19px,1.7vw,24px);font-weight:500;letter-spacing:-.01em;margin-top:10px;
  display:flex;align-items:center;gap:10px}
a.contact-card .v::after{content:"↗";font-size:.7em;color:var(--brick)}
.contact-card--plain .v::after{content:none}
@media(max-width:620px){.contact-grid{grid-template-columns:1fr}}
.foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 0;margin-top:clamp(40px,6vw,80px);
  border-top:1px solid var(--rule-soft);font-family:ui-sans-serif,system-ui,Arial,sans-serif;font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
