/* Generated 390px mobile baseline; rebuild with build-mobile-rem.py. */
.interviews-page .course-thumb{aspect-ratio: 4 / 3; background: rgb(238, 240, 243);}
.interviews-page .course-thumb img{object-fit: contain; object-position: center bottom;}
.interviews-page .course-copy{padding: 1.3125rem 1.1875rem 1.1875rem;}
.interview-category{font-size: max(10px,0.6875rem); font-weight: 600; color: rgb(110, 129, 148); margin-bottom: 0.5625rem; letter-spacing: 0.03em;}
.interviews-page .course-copy h3{font-size: max(13px,1.125rem); line-height: 1.55; min-height: 3.1em;}
.interviews-page .course-meta{margin-top: 0.875rem; font-size: max(13px,0.9375rem); padding-bottom: 1.1875rem;}
.interview-more{margin-left: auto; font-size: max(10px,0.6875rem); color: rgb(109, 128, 147);}
.interviews-page .course-open{font-size: max(10px,0.8125rem);}
.interview-detail-section{padding: 2.875rem 0 4.5rem; background: rgb(245, 247, 250); color: rgb(32, 55, 77);}
.interview-detail-wrap{max-width: 66.25rem; margin: auto; padding: 0 1.875rem;}
.interview-back{display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.75rem 0; font-size: max(13px,0.875rem); font-weight: 600; color: rgb(69, 98, 125); margin-bottom: 1.375rem;}
.interview-profile{display: grid; grid-template-columns: 18.75rem 1fr; gap: 3rem; align-items: center; background: rgb(255, 255, 255); padding: 2.375rem; border: 1px solid rgb(224, 231, 239); border-radius: 1.125rem;}
.interview-portrait{aspect-ratio: 1 / 1; display: grid; place-items: center; overflow: hidden; background: rgb(238, 240, 243); border-radius: 0.75rem; color: rgb(88, 116, 141);}
.interview-portrait img{width: 100%; height: 100%; object-fit: contain;}
.interview-profile h2{font-size: 1.875rem; line-height: 1.5; letter-spacing: -0.035em;}
.interview-name{font-size: 1.375rem; font-weight: 650; margin-top: 1.0625rem;}
.interview-schools{margin-top: 1.5625rem; padding-top: 1.3125rem; border-top: 1px solid rgb(224, 231, 239);}
.interview-schools h3{font-size: max(10px,0.75rem); color: rgb(104, 128, 150); margin-bottom: 0.5625rem;}
.interview-schools p{font-size: max(13px,0.875rem); line-height: 1.9; color: rgb(87, 112, 135);}
.interview-questions{margin-top: 1.875rem; padding: 0.5rem 2.625rem; background: rgb(255, 255, 255); border: 1px solid rgb(224, 231, 239); border-radius: 1.125rem;}
.interview-question{padding: 2rem 0; border-bottom: 1px solid rgb(230, 235, 241);}
.interview-question:last-child{border-bottom: 0;}
.interview-question h3{display: flex; align-items: baseline; gap: 0.9375rem; font-size: max(13px,1.25rem); line-height: 1.65; letter-spacing: -0.02em;}
.question-number{color: rgb(121, 148, 175); font-size: max(13px,0.9375rem); flex: 0 0 auto; font-weight: 500; font-variant-numeric: tabular-nums;}
.interview-answer{white-space: pre-line; font-size: max(13px,1rem); line-height: 1.95; color: rgb(82, 102, 121); margin-top: 1.125rem; padding-left: 2.1875rem;}
.interview-plain{background: rgb(255, 255, 255); border-radius: 1.125rem; padding: 2.375rem;}
.interview-original{margin: 1.875rem 0; background: rgb(255, 255, 255); border: 1px solid rgb(224, 231, 239); border-radius: 1rem; padding: 1.5rem; text-align: center;}
.interview-original img{display: block; width: auto; max-width: 100%; height: auto; margin: auto;}
.interview-original figcaption{margin-top: 1.125rem; font-size: max(10px,0.75rem); color: rgb(113, 132, 151);}
.interview-adjacent{display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin: 1.875rem 0;}
.interview-adjacent a{display: flex; flex-direction: column; align-items: flex-start; gap: 0.625rem; padding: 1.4375rem 1.5625rem; border: 1px solid rgb(221, 229, 237); border-radius: 0.75rem; background: rgb(255, 255, 255); transition: border-color 0.2s;}
.interview-adjacent a:hover{border-color: rgb(123, 158, 190);}
.interview-adjacent small{font-size: max(10px,0.75rem); color: rgb(113, 135, 155);}
.interview-adjacent strong{font-size: max(13px,0.9375rem); line-height: 1.6;}
.interview-adjacent span{font-size: max(10px,0.8125rem); color: rgb(106, 126, 144);}

.interviews-page .course-thumb{aspect-ratio: 4 / 3;}
.interviews-page .course-copy h3{min-height: 0; font-size: max(13px,1.25rem);}
.interview-detail-section{padding-top: 1.5rem;}
.interview-detail-wrap{padding: 0 1.25rem;}
.interview-profile{grid-template-columns: 1fr; gap: 1.625rem; padding: 1.5rem;}
.interview-portrait{width: 100%; max-width: 18.75rem; justify-self: center;}
.interview-profile h2{font-size: 1.5rem;}
.interview-questions{padding: 0 1.375rem; margin-top: 1.375rem;}
.interview-question{padding: 1.5625rem 0;}
.interview-question h3{font-size: max(13px,1.125rem); gap: 0.625rem;}
.interview-answer{padding-left: 0; font-size: max(13px,0.9375rem); line-height: 1.9;}
.interview-adjacent{grid-template-columns: 1fr; gap: 0.75rem;}
.interview-adjacent a{padding: 1.25rem;}
.interview-schools p{font-size: max(10px,0.8125rem);}
@media (prefers-reduced-motion: reduce){.interview-adjacent a{transition: none;}}
.interviews-page .course-card{position: relative; border: 0; box-shadow: rgba(189, 150, 48, 0.07) 0 0.3125rem 1.25rem;}
.interviews-page .course-card::after{content: ""; position: absolute; inset: 0; padding: 0.09375rem; border-radius: 0.9375rem; background: linear-gradient(115deg, rgb(194, 153, 60) 0%, rgb(231, 202, 121) 18%, rgb(255, 247, 225) 29%, rgb(214, 178, 83) 40%, rgb(242, 223, 162) 59%, rgb(255, 250, 233) 70%, rgb(207, 169, 75) 83%, rgb(237, 207, 131) 100%) 0% 50% / 300% 300%; mask: linear-gradient(rgb(255, 255, 255) 0, rgb(255, 255, 255) 0) content-box exclude, linear-gradient(rgb(255, 255, 255) 0, rgb(255, 255, 255) 0); pointer-events: none; z-index: 2;}
.interviews-page .course-open{background: linear-gradient(115deg, rgb(221, 180, 75) 0%, rgb(237, 209, 132) 22%, rgb(248, 230, 178) 42%, rgb(252, 240, 207) 49%, rgb(245, 223, 165) 57%, rgb(228, 192, 106) 78%, rgb(220, 180, 74) 100%); color: rgb(73, 55, 19); box-shadow: rgba(193, 156, 70, 0.376) 0 0 0 1px inset, rgb(252, 240, 207) 0 1px 0 inset, rgba(203, 165, 75, 0.13) 0 0.1875rem 0.625rem; transition: filter 0.25s, box-shadow 0.25s, color 0.25s;}
.interviews-page .course-card:focus-within{box-shadow: rgb(240, 225, 182) 0 0 0 0.125rem, rgba(197, 160, 77, 0.125) 0 0.625rem 1.625rem;}
.interviews-page .course-card:focus-within .course-open{color: rgb(57, 42, 13); filter: brightness(1.05); box-shadow: rgba(193, 156, 70, 0.44) 0 0 0 1px inset, rgb(255, 247, 225) 0 1px 0 inset, rgba(208, 171, 84, 0.196) 0 0.25rem 0.875rem;}
@media (hover: hover) and (pointer: fine){.interviews-page .course-card:hover{box-shadow: rgba(187, 150, 71, 0.16) 0 0.875rem 1.875rem;}
.interviews-page .course-card:hover .course-open{background: linear-gradient(115deg, rgb(230, 189, 91) 0%, rgb(245, 219, 153) 22%, rgb(252, 236, 196) 42%, rgb(255, 247, 225) 49%, rgb(250, 230, 180) 57%, rgb(237, 203, 129) 78%, rgb(228, 189, 89) 100%); color: rgb(57, 42, 13); box-shadow: rgba(193, 156, 70, 0.44) 0 0 0 1px inset, rgb(255, 247, 225) 0 1px 0 inset, rgba(208, 171, 84, 0.196) 0 0.25rem 0.875rem;}}
@media (prefers-reduced-motion: no-preference){.interviews-page .course-card::after{animation: 7s ease-in-out 0s infinite alternate none running interviewGoldShimmer;}
.interviews-page .course-card:nth-child(4n+2)::after{animation-delay: -1.6s;}
.interviews-page .course-card:nth-child(4n+3)::after{animation-delay: -3.2s;}
.interviews-page .course-card:nth-child(4n)::after{animation-delay: -4.8s;}}
@keyframes interviewGoldShimmer { 
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce){.interviews-page .course-card::after{animation: auto ease 0s 1 normal none running none;}
.interviews-page .course-open{transition: none;}}
