/* Resume Revolution: reference implementation for the v3 editorial system. */
:root {
  --v3-content: 74rem;
  --v3-reading: 49rem;
  --v3-gutter: clamp(1rem, 4vw, 2rem);
  --v3-section-space: clamp(3.5rem, 7vw, 6.5rem);
  --v3-surface: color-mix(in srgb, var(--color-bg-secondary) 92%, transparent);
  --v3-surface-subtle: color-mix(in srgb, var(--color-bg-tertiary) 56%, transparent);
  --v3-border: var(--color-border);
  --v3-radius: 0.65rem;
  --v3-shadow: 0 10px 28px rgba(2, 8, 23, 0.12);
  --v3-motion-fast: 140ms;
  --v3-motion-base: 220ms;
}

.resume-page {
  background-image: none;
  background-color: var(--color-bg-primary);
}

.resume-page::before { display: none; }
.resume-page .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; }
.resume-page .header-logo-accent,
.resume-page .footer-logo-accent { background: transparent; box-shadow: none; border-radius: var(--radius-sm); }

.resume-shell {
  width: min(100%, var(--v3-content));
  margin-inline: auto;
  padding-inline: var(--v3-gutter);
}

.resume-hero {
  padding-block: clamp(4.5rem, 9vw, 8rem) clamp(3.5rem, 7vw, 6rem);
  border-bottom: 1px solid var(--v3-border);
}

.resume-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(17rem, 0.65fr);
  gap: clamp(2.5rem, 7vw, 6rem);
  align-items: end;
}

.resume-kicker,
.resume-section-label,
.resume-identity-label,
.resume-project-context {
  margin: 0 0 0.8rem;
  color: var(--color-accent);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.resume-hero h1 {
  max-width: 13ch;
  margin: 0;
  font-size: clamp(3.15rem, 8vw, 6.6rem);
  line-height: 0.94;
  letter-spacing: -0.065em;
}

.resume-headline {
  max-width: 45rem;
  margin: 1.8rem 0 0;
  color: var(--color-text-primary);
  font-size: clamp(1.1rem, 2.2vw, 1.45rem);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.resume-intro { max-width: 42rem; margin: 1rem 0 0; font-size: 1.08rem; }
.resume-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; margin-top: 2rem; }
.resume-text-link { padding: 0.65rem 0.25rem; font-weight: 600; text-underline-offset: 0.25em; }
.resume-text-link:hover { text-decoration: underline; }

.resume-identity { border-top: 2px solid var(--color-accent); padding-top: 1.2rem; }
.resume-identity p { margin-bottom: 1.15rem; }
.resume-identity strong, .resume-identity span { display: block; }
.resume-identity strong { color: var(--color-text-primary); }
.resume-identity span { margin-top: 0.2rem; font-size: 0.92rem; }
.resume-identity .resume-identity-secondary { margin: 1.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--v3-border); font-size: 0.88rem; }

.resume-scan { padding-block: 0; background: var(--v3-surface); border-bottom: 1px solid var(--v3-border); }
.resume-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); margin: 0; }
.resume-metrics div { min-width: 0; padding: 1.4rem 1.25rem 1.35rem 0; }
.resume-metrics div + div { padding-left: 1.25rem; border-left: 1px solid var(--v3-border); }
.resume-metrics dt { color: var(--color-text-secondary); font-size: 0.78rem; line-height: 1.35; }
.resume-metrics dd { margin-top: 0.3rem; color: var(--color-text-primary); font-size: 1.05rem; font-weight: 700; }

.resume-layout { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.resume-section-nav { position: sticky; top: 6.5rem; display: grid; gap: 0.4rem; margin-top: 4.5rem; padding-left: 0.8rem; border-left: 1px solid var(--v3-border); }
.resume-section-nav strong { margin-bottom: 0.35rem; color: var(--color-text-primary); font-size: 0.76rem; text-transform: uppercase; letter-spacing: 0.08em; }
.resume-section-nav a { padding-block: 0.25rem; color: var(--color-text-secondary); font-size: 0.84rem; }
.resume-section-nav a:hover { color: var(--color-accent); }

.resume-content { min-width: 0; }
.resume-lenses { margin-block: 4.5rem 0; padding-bottom: 2.5rem; border-bottom: 1px solid var(--v3-border); }
.resume-lenses > p:first-child { margin-bottom: 0.8rem; color: var(--color-text-primary); font-weight: 700; }
.resume-lens-links { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.resume-lens-links a { padding: 0.55rem 0.8rem; border: 1px solid var(--v3-border); border-radius: var(--radius-full); color: var(--color-text-secondary); font-size: 0.84rem; font-weight: 600; transition: color var(--v3-motion-fast), border-color var(--v3-motion-fast), background-color var(--v3-motion-fast); }
.resume-lens-links a:hover { color: var(--color-text-primary); border-color: var(--color-border-hover); }
.resume-lens-links a[aria-current="page"] { color: var(--color-accent); border-color: var(--color-accent); background: var(--color-accent-muted); }
.resume-lens-note { max-width: 44rem; margin: 0.85rem 0 0; font-size: 0.85rem; }

.resume-section { margin: 0; padding-block: var(--v3-section-space); scroll-margin-top: 6.5rem; }
.resume-section + .resume-section { border-top: 1px solid var(--v3-border); }
.resume-section h2 { max-width: 18ch; margin: 0 0 2.25rem; font-size: clamp(1.8rem, 4vw, 2.6rem); letter-spacing: -0.035em; }
.resume-summary-text { max-width: var(--v3-reading); margin: 0; color: var(--color-text-primary); font-size: clamp(1.2rem, 2.4vw, 1.55rem); line-height: 1.55; }

.resume-timeline { position: relative; }
.resume-timeline::before { content: ""; position: absolute; inset-block: 0 1rem; left: 0.25rem; width: 1px; background: var(--v3-border); }
.resume-role { position: relative; padding: 0 0 3.5rem 2.25rem; }
.resume-role:last-child { padding-bottom: 0; }
.resume-role::before { content: ""; position: absolute; top: 0.4rem; left: 0; width: 0.55rem; height: 0.55rem; border: 2px solid var(--color-accent); border-radius: 50%; background: var(--color-bg-primary); }
.resume-role header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.25rem; align-items: start; }
.resume-role h3 { margin: 0; font-size: 1.25rem; }
.resume-role-org { margin: 0.25rem 0 0; color: var(--color-text-primary); font-weight: 600; }
.resume-role-meta { display: grid; justify-items: end; gap: 0.15rem; margin: 0; color: var(--color-text-secondary); font-family: var(--font-mono); font-size: 0.76rem; }
.resume-role-meta span { font-family: var(--font-sans); }
.resume-role-summary { max-width: 44rem; margin: 1rem 0; }
.resume-role > ul:not(.resume-tags) { max-width: 46rem; margin: 0; }
.resume-role > ul:not(.resume-tags) li { margin-bottom: 0.55rem; }

.resume-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.resume-tags li { margin: 0; padding: 0.25rem 0.5rem; border: 1px solid var(--v3-border); border-radius: var(--radius-full); color: var(--color-text-secondary); font-family: var(--font-mono); font-size: 0.7rem; }

.resume-project-list { border-top: 1px solid var(--v3-border); }
.resume-project { display: grid; grid-template-columns: minmax(0, 1fr) minmax(13rem, 0.45fr); gap: 2rem; padding-block: 1.6rem; border-bottom: 1px solid var(--v3-border); transition: background-color var(--v3-motion-base), padding-inline var(--v3-motion-base); }
.resume-project:hover { padding-inline: 0.75rem; background: var(--v3-surface-subtle); }
.resume-project h3 { margin: 0; font-size: 1.15rem; }
.resume-project h3 a { text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
.resume-project h3 a:hover { text-decoration: underline; }
.resume-project p:not(.resume-project-context) { max-width: 42rem; margin: 0.5rem 0 0; font-size: 0.92rem; }
.resume-project .resume-tags { align-content: start; justify-content: end; margin: 0; }

.resume-competencies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--v3-border); border-left: 1px solid var(--v3-border); }
.resume-competencies > article { padding: 1.5rem; border-right: 1px solid var(--v3-border); border-bottom: 1px solid var(--v3-border); }
.resume-competencies h3 { margin-bottom: 0.65rem; font-size: 1.05rem; }
.resume-competencies p { font-size: 0.9rem; }
.resume-evidence { display: flex; gap: 0.8rem; padding-top: 0.85rem; border-top: 1px solid var(--v3-border); font-size: 0.78rem; }
.resume-evidence strong { color: var(--color-text-primary); }
.resume-evidence ul { display: flex; flex-wrap: wrap; gap: 0.3rem 0.8rem; margin: 0; padding: 0; list-style: none; }
.resume-evidence li { margin: 0; font-size: inherit; }

.resume-education-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--v3-border); border: 1px solid var(--v3-border); }
.resume-education-list article { padding: 1.5rem; background: var(--color-bg-primary); }
.resume-education-list h3 { margin-bottom: 1rem; font-size: 1.05rem; }
.resume-education-list p { margin-bottom: 0.35rem; font-size: 0.9rem; }
.resume-credential-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid var(--v3-border); list-style: none; }
.resume-credential-list li { display: flex; justify-content: space-between; gap: 1rem; margin: 0; padding: 1rem 0; border-bottom: 1px solid var(--v3-border); }
.resume-credential-list li:nth-child(odd) { padding-right: 1.5rem; }
.resume-credential-list li:nth-child(even) { padding-left: 1.5rem; border-left: 1px solid var(--v3-border); }
.resume-credential-list span { color: var(--color-text-secondary); font-size: 0.8rem; text-align: right; }
.resume-honors-list { margin: 0; padding-left: 1.2rem; }
.resume-honors-list li { margin-bottom: 0.65rem; color: var(--color-text-primary); }

.resume-contact { padding-block: var(--v3-section-space); border-top: 1px solid var(--v3-border); background: var(--v3-surface); }
.resume-contact h2 { margin-bottom: 0.75rem; font-size: clamp(2rem, 5vw, 3.5rem); }
.resume-contact p:not(.resume-section-label) { max-width: 38rem; }
.resume-contact .btn { margin: 0.8rem 0.5rem 0 0; }

.resume-is-changing .resume-content { opacity: 0.58; transition: opacity var(--v3-motion-fast); }

@media (max-width: 899px) {
  .resume-hero-grid { grid-template-columns: 1fr; align-items: start; }
  .resume-identity { max-width: 34rem; }
  .resume-layout { grid-template-columns: 1fr; }
  .resume-section-nav { display: none; }
  .resume-lenses { margin-top: 3rem; }
}

@media (max-width: 639px) {
  .resume-hero { padding-top: 3.5rem; }
  .resume-hero h1 { font-size: clamp(3rem, 17vw, 4.6rem); }
  .resume-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resume-metrics div + div { padding-left: 0; border-left: 0; }
  .resume-metrics div:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--v3-border); }
  .resume-metrics div:nth-child(n+3) { border-top: 1px solid var(--v3-border); }
  .resume-role { padding-left: 1.5rem; }
  .resume-role header { grid-template-columns: 1fr; gap: 0.6rem; }
  .resume-role-meta { justify-items: start; }
  .resume-project { grid-template-columns: 1fr; gap: 0.75rem; }
  .resume-project:hover { padding-inline: 0; background: transparent; }
  .resume-project .resume-tags { justify-content: start; }
  .resume-competencies, .resume-education-list, .resume-credential-list { grid-template-columns: 1fr; }
  .resume-credential-list li:nth-child(odd), .resume-credential-list li:nth-child(even) { padding-inline: 0; border-left: 0; }
}

@media (forced-colors: active) {
  .resume-lens-links a[aria-current="page"], .resume-tags li { border: 2px solid ButtonText; }
  .resume-role::before { background: Canvas; border-color: Highlight; }
}

@media (prefers-reduced-motion: reduce) {
  .resume-page *, .resume-page *::before, .resume-page *::after { scroll-behavior: auto !important; transition: none !important; transform: none !important; }
  .resume-is-changing .resume-content { opacity: 1; }
}

@media print {
  @page { size: letter; margin: 0.55in; }
  html { font-size: 9.5pt; }
  body.resume-page { color: #000; background: #fff; }
  .resume-page .site-header,
  .resume-page .site-footer,
  .resume-actions,
  .resume-scan,
  .resume-section-nav,
  .resume-lenses,
  .resume-contact,
  .resume-tags { display: none !important; }
  .resume-shell, .resume-layout { display: block; width: 100%; max-width: none; padding: 0; }
  .resume-hero { padding: 0 0 1rem; border-bottom: 1px solid #000; }
  .resume-hero-grid { display: block; }
  .resume-hero h1 { max-width: none; color: #000; font-size: 25pt; letter-spacing: -0.03em; }
  .resume-kicker { color: #000; }
  .resume-headline { margin-top: 0.35rem; color: #000; font-size: 11pt; }
  .resume-intro { margin-top: 0.35rem; color: #222; font-size: 9.5pt; }
  .resume-identity { display: none; }
  .resume-section { padding: 1rem 0; border-color: #777; break-inside: auto; }
  .resume-section h2 { margin-bottom: 0.65rem; color: #000; font-size: 14pt; break-after: avoid; }
  .resume-section-label { margin-bottom: 0.2rem; color: #000; font-size: 7.5pt; }
  .resume-summary-text { color: #000; font-size: 10pt; line-height: 1.4; }
  .resume-timeline::before, .resume-role::before { display: none; }
  .resume-role { padding: 0 0 1rem; break-inside: avoid; }
  .resume-role header { display: flex; justify-content: space-between; }
  .resume-role h3, .resume-role-org, .resume-role-meta, .resume-role-summary, .resume-role li { color: #000; }
  .resume-role-meta { display: block; text-align: right; }
  .resume-role > ul:not(.resume-tags) { padding-left: 1.2rem; }
  .resume-project-list, .resume-education-list, .resume-competencies, .resume-credential-list { display: block; border: 0; background: transparent; }
  .resume-project, .resume-education-list article, .resume-competencies > article, .resume-credential-list li, .resume-honors-list li { display: block; padding: 0.5rem 0; border: 0; border-bottom: 1px solid #aaa; background: #fff; break-inside: avoid; }
  .resume-project h3, .resume-project p, .resume-education-list h3, .resume-education-list p, .resume-competencies h3, .resume-competencies p, .resume-credential-list strong, .resume-credential-list span { color: #000; }
  .resume-project a, .resume-evidence a { color: #000; text-decoration: none; }
  .resume-evidence { border-color: #aaa; }
  .resume-project h3, .resume-competencies h3, .resume-education-list h3 { break-after: avoid; }
  a { overflow-wrap: anywhere; }
}
