/* Interview body and native page cards, within the shared lower-page shell. */
.interview-layout { display: grid; width: var(--column-layout-width); grid-template-columns: 38% minmax(0,1fr); margin-inline: auto; padding-block: 70px 0; }
.interview-profile { border-right: 1px solid #c5a36d; padding: 0 10% 70px 0; }
@media (min-width:700px) {
  .interview-profile__content {
    position: sticky;
    top: calc(var(--header-clearance) + var(--header-admin-offset));
  }
}
.interview-profile .section-eyebrow { margin-bottom: 28px; }
.interview-page .interview-profile h2 { font-size: clamp(3rem,5.2vw,4.75rem); line-height: 1.15; font-weight: 400; letter-spacing: .12em; margin-bottom: 28px; }
.interview-profile .interview-subtitle { font-size: clamp(1.125rem,1.65vw,1.5rem); margin-bottom: 36px; text-wrap: balance; }
.interview-profile-company { margin: clamp(70px,9vw,130px) 0 0; padding-top: 22px; border-top: 1px solid rgb(184 144 70 / 55%); color: #9b712b; font: .75rem/1.5 Georgia,serif; letter-spacing: .24em; }
.interview-answers { padding-left: 9%; min-width: 0; }
.interview-question { margin: 0 0 65px; }
.interview-question .section-eyebrow { margin-bottom: 25px; }
.interview-page .interview-question h3 { font-size: clamp(1.25rem,1.9vw,1.75rem); line-height: 1.7; letter-spacing: .045em; margin-bottom: 28px; font-weight: 600; text-wrap: balance; }
.interview-page .interview-question p:not(.section-eyebrow) { max-width: 42em; margin-bottom: 24px; }
.interview-page .interview-question p:last-child { margin-bottom: 0; }
.interview-question--message { padding: clamp(28px,3vw,50px); color: #fff; background: #171817 url('images/black-texture.webp') repeat; background-size: 480px; margin-bottom: 0; }
.interview-question--message .section-eyebrow { color: #dbaf57; }
.interview-related { width: var(--column-layout-width); margin-inline: auto; padding-block: 80px 75px; }
.employee-list-heading { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-bottom: 35px; }
.employee-list-heading h2 { margin: 0; }
.employee-list-controls { display: flex; gap: 14px; flex-shrink: 0; }
.employee-list-controls[hidden] { display: none; }
.employee-list-controls button { border: 1px solid #b89046; border-radius: 50%; background: transparent; color: #9a6e22; width: 48px; height: 48px; font: 1.5rem/1 sans-serif; cursor: pointer; }
.employee-list-controls button:disabled { opacity: .3; cursor: default; }
.employee-cards { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 64px)/3); gap: 32px; list-style: none; padding: 0 0 18px; margin: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-color: #b5904b #d9cbb1; scrollbar-width: thin; }
.employee-card { min-width: 0; scroll-snap-align: start; }
.employee-card > a { display: block; text-decoration: none; }
.employee-card-monogram { display: grid; place-items: center; position: relative; width: min(60%,200px); aspect-ratio: 1; margin-inline: auto; overflow: hidden; border: 1px solid rgb(184 144 70 / 70%); border-radius: 50%; background: #151615 url('images/black-texture.webp') repeat; background-size: 480px; color: #d3a64f; isolation: isolate; }
.employee-card-monogram::after { content: ""; position: absolute; left: 38%; right: 38%; bottom: 21%; height: 1px; background: currentColor; transform-origin: center; transition: left .55s cubic-bezier(.2,.7,.2,1),right .55s cubic-bezier(.2,.7,.2,1); }
.employee-card-monogram-label { position: absolute; top: 22%; font: .6875rem/1.4 Georgia,serif; letter-spacing: .24em; }
.employee-card-monogram strong { position: relative; z-index: 1; font: 400 clamp(2rem,4vw,3.75rem)/1 Georgia,"Times New Roman",serif; letter-spacing: .08em; transform: translateY(5%); }
.employee-card > a:is(:hover,:focus-visible) .employee-card-monogram::after { left: 33%; right: 33%; }
.employee-card-copy { padding-top: 22px; }
.page-body .employee-card h3 { font-size: 1.5rem; letter-spacing: .07em; line-height: 1.6; margin: 0 0 15px; }
.page-body .employee-card-label { color: #a87824; font: .875rem/1.5 Georgia,serif; letter-spacing: .1em; margin-bottom: 12px; }
.employee-card-link { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid #b89046; border-radius: 50px; padding: 12px 22px; font-size: 1rem; line-height: 1.6; }
.employee-card-link > span { color: #a87824; font-family: sans-serif; }
.page-body .employee-card--waiting p { font-size: 1rem; line-height: 1.8; }
.interview-back { margin-top: 65px; display: flex; justify-content: center; }
.interview-back .pill { gap: 22px; }
.interview-back .pill > span { color: var(--gold-ink); font-family: sans-serif; }
.careers-page #interview .employee-list { width: var(--content-width); margin: 24px auto 0; }
/* Careers design: anonymous monograms on PC, monogram/copy pairs on small screens. */
.careers-page #interview .employee-cards { grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-columns: auto; grid-auto-flow: row; gap: clamp(24px,3vw,48px); padding: 0; overflow: visible; }
.careers-page #interview .employee-card { width: 100%; margin: 0; }
.careers-page #interview .employee-card > a { display: block; text-align: center; }
.careers-page #interview .employee-card-monogram { width: min(62%,220px); aspect-ratio: 1; }
.careers-page #interview .employee-card-copy { padding: 22px 0 0; }
.careers-page #interview .employee-card-number { width: max-content; margin: 0 auto 17px; padding: 0 3px 8px; border-bottom: 1px solid var(--gold); color: var(--ink); font: 400 40px/1 Georgia,serif; letter-spacing: .03em; }
.careers-page #interview .employee-card h3 { font-size: clamp(1.375rem,1.8vw,1.75rem); line-height: 1.6; margin-bottom: 24px; }
.careers-page #interview .employee-card h3.employee-card-headline { margin-bottom: 17px; letter-spacing: .04em; }
.employee-card-headline > span { display: block; }
.careers-page #interview .employee-card-role { color: var(--gold-ink); font-size: .875rem; line-height: 1.7; letter-spacing: .05em; margin: 0 0 5px; }
.careers-page #interview .employee-card-name { font-size: 1.25rem; line-height: 1.6; letter-spacing: .08em; margin: 0 0 24px; }
.careers-page #interview .employee-card-link { max-width: 280px; margin-inline: auto; min-height: 56px; padding: 12px 20px; gap: 16px; font-size: 1rem; }
.careers-page #interview .employee-list-note { max-width: 960px; margin: 28px auto 0; padding-top: 22px; border-top: 1px solid #c5a36d; }
.careers-page .contact__action .pill + .pill, .interview-page .contact__action .pill + .pill { margin-top: 12px; }
@media (min-width:700px) and (max-width:1023px) {
  .interview-layout { grid-template-columns: 32% minmax(0,1fr); }
  .interview-profile { padding-right: 12%; }
  .interview-answers { padding-left: 8%; }
  .employee-cards { grid-auto-columns: calc((100% - 24px)/2); gap: 24px; }
}
@media (max-width:1023px) {
  .careers-page #interview .employee-list { width: min(600px,calc(100% - 32px)); }
  .careers-page #interview .employee-cards { grid-template-columns: minmax(0,1fr); gap: clamp(32px,6vw,48px); }
  .careers-page #interview .employee-card > a { display: grid; grid-template-columns: clamp(104px,30vw,132px) minmax(0,1fr); gap: clamp(16px,4.5vw,28px); align-items: center; text-align: left; }
  .careers-page #interview .employee-card-monogram { width: 100%; }
  .careers-page #interview .employee-card-copy { min-width: 0; padding: 0; }
  .careers-page #interview .employee-card-number { font-size: clamp(30px,7.5vw,38px); margin: 0 0 16px; padding-bottom: 6px; }
  .careers-page #interview .employee-card h3 { font-size: clamp(1.25rem,5.5vw,1.75rem); margin-bottom: 22px; }
  .careers-page #interview .employee-card h3.employee-card-headline { font-size: clamp(1rem,4.6vw,1.375rem); line-height: 1.7; margin-bottom: 12px; }
  .careers-page #interview .employee-card-role { font-size: .8125rem; letter-spacing: .02em; margin-bottom: 3px; }
  .careers-page #interview .employee-card-name { font-size: clamp(1rem,4.4vw,1.25rem); margin-bottom: 16px; }
  .careers-page #interview .employee-card-link { min-height: 46px; padding: 10px; gap: 9px; font-size: .8125rem; }
}
@media (max-width:374px) {
  .careers-page #interview .employee-card > a { grid-template-columns: 96px minmax(0,1fr); gap: 12px; }
  .careers-page #interview .employee-card-link { font-size: .75rem; padding-inline: 8px; gap: 6px; }
}
@media (max-width:699px) {
  .interview-layout { display: block; padding-top: 42px; }
  .interview-profile { border-right: 0; border-bottom: 1px solid #c5a36d; padding: 0 0 38px; }
  .interview-profile .section-eyebrow { font-size: .8125rem; margin-bottom: 20px; }
  .interview-page .interview-profile h2 { font-size: clamp(2.75rem,14vw,4rem); margin-bottom: 20px; }
  .interview-profile .interview-subtitle { font-size: 1.125rem; margin-bottom: 0; }
  .interview-profile-company { margin-top: 34px; padding-top: 18px; }
  .interview-answers { padding: 38px 0 0; }
  .interview-question { margin-bottom: 44px; }
  .interview-question .section-eyebrow { font-size: 1rem; margin-bottom: 20px; }
  .interview-page .interview-question h3 { font-size: 1.25rem; line-height: 1.75; margin-bottom: 22px; }
  .interview-page .interview-question p:not(.section-eyebrow) { font-size: 1rem; margin-bottom: 22px; }
  .interview-question--message { padding: 30px 23px; margin-bottom: 0; }
  .interview-related { padding-block: 50px 60px; }
  .employee-list-heading { align-items: flex-end; gap: 14px; margin-bottom: 25px; }
  .page-body .employee-list-heading h2 { font-size: 1.375rem; line-height: 1.7; text-wrap: balance; }
  .employee-list-controls { gap: 8px; }
  .employee-list-controls button { width: 44px; height: 44px; font-size: 1.25rem; }
  .employee-cards { grid-auto-columns: 85%; gap: 20px; }
  .employee-card-copy { padding-top: 20px; }
  .page-body .employee-card h3 { font-size: 1.25rem; margin-bottom: 16px; }
  .page-body .employee-card--waiting p, .page-body .employee-list-note { font-size: .875rem; }
  .employee-card-link { font-size: .875rem; padding: 12px 18px; }
  .interview-back { margin-top: 45px; }
  .interview-page .contact h2 { font-size: 1.5rem; }
  .type-expanded .employee-list-heading { display: block; }
  .type-expanded .employee-list-controls { margin-top: 20px; }
  .type-expanded .employee-list-controls button { width: 2.75rem; height: 2.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .employee-card-monogram::after { transition: none; }
}
