/* An editorial application showcase: one photograph, four clear choices. */
.projects .section-heading { margin-bottom: 34px; padding-top: 0; border: 0; }
.projects .section-heading::before, .projects .section-heading::after { display: none; }
.projects .section-kicker { padding: 0; border: 0; background: none; }
.projects .project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.projects .project-grid.application-explorer { grid-template-columns: minmax(0,1.7fr) minmax(290px,1fr); grid-template-areas: 'stage choices'; gap: 0; overflow: hidden; border: 1px solid #dce4e0; border-radius: 4px; background: #fff; color: #23383f; }
.application-stage { grid-area: stage; min-width: 0; background: #fff; }
.application-panel { height: 100%; display: flex; flex-direction: column; }
.application-panel[hidden] { display: none!important; }
.application-visual { position: relative; margin: 0; overflow: hidden; background: #e7ece8; }
.application-visual img { display: block; width: 100%; height: 322px; object-fit: cover; }
.application-photo-note { position: absolute; top: 23px; left: 23px; display: flex; align-items: center; gap: 12px; padding: 12px 15px; border-left: 2px solid #c40013; background: #ffffffed; color: #23383f; font-size: 10px; letter-spacing: .8px; }
.application-photo-note b { color: #c40013; font-size: 13px; font-variant-numeric: tabular-nums; }
.application-copy { flex: 1; padding: 26px 30px; }
.application-copy h3 { color: #23383f; font-size: 31px; font-weight: 700; line-height: 1.2; letter-spacing: -.7px; margin: 0 0 11px; }
.application-copy p { max-width: 61ch; font-size: 13px; line-height: 1.8; color: #62757e; margin: 0; }
.application-bottom { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 24px; padding-top: 18px; border-top: 1px solid #dce4e0; }
.application-systems { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.application-systems span { color: #62757e; font-size: 11px; }
.application-systems span + span::before { content: '/'; margin-right: 14px; color: #a3b4ae; }
.application-open { display: inline-flex; align-items: center; gap: 19px; color: #23383f; font-size: 11px; font-weight: 600; white-space: nowrap; }
.application-open .icon { width: 38px; height: 38px; padding: 12px; border: 0; border-radius: 0; background: #c40013; color: #fff; }
.application-open:hover .icon { background: #9f0011; }
.application-choices { grid-area: choices; display: flex; flex-direction: column; min-width: 0; background: #f4f6f3; border-left: 1px solid #dce4e0; }
.application-choices-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 24px 27px; color: #62757e; font-size: 9px; letter-spacing: 1.2px; }
.application-choices-head span { letter-spacing: 0; font-size: 10px; color: #8a9b9e; }
.application-tabs { display: flex; flex-direction: column; flex: 1; }
.application-tab { position: relative; display: grid; grid-template-columns: 33px minmax(0,1fr) 28px; align-items: center; flex: 1; gap: 16px; width: 100%; padding: 23px 26px; border: 0; border-top: 1px solid #dce4e0; background: transparent; color: #23383f; text-align: left; cursor: pointer; transition: background .2s,color .2s; }
.application-tab::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #c40013; transform: scaleY(0); transform-origin: center; transition: transform .25s; }
.application-tab-number { font-size: 23px; font-weight: 400; color: #92a4a5; font-variant-numeric: tabular-nums; }
.application-tab-copy { display: flex; flex-direction: column; gap: 9px; }
.application-tab-copy strong { font-size: 18px; line-height: 1.3; font-weight: 600; letter-spacing: -.25px; }
.application-tab-copy small { font-size: 11px; line-height: 1.6; color: #73858c; }
.application-tab > .icon { width: 27px; height: 27px; padding: 6px; color: #899b9b; }
.application-tab:hover { background: #ffffff90; }
.application-tab[aria-selected='true'] { background: #fff; }
.application-tab[aria-selected='true']::before { transform: scaleY(1); }
.application-tab[aria-selected='true'] .application-tab-number,
.application-tab[aria-selected='true'] strong { color: #c40013; }
.application-tab[aria-selected='true'] > .icon { background: #c40013; color: #fff; }
.application-choices-foot { display: flex; gap: 11px; align-items: center; padding: 20px 27px; border-top: 1px solid #dce4e0; color: #62757e; font-size: 11px; line-height: 1.6; }
.application-choices-foot .icon { width: 19px; height: 19px; color: #c40013; flex-shrink: 0; }
.application-explorer :is(button,a,[tabindex='0']):focus-visible { outline: 2px solid #c40013; outline-offset: -4px; }
@media(max-width:1100px) {
  .projects .project-grid.application-explorer { grid-template-columns: minmax(0,1.5fr) minmax(285px,1fr); }
  .application-tab { gap: 11px; padding: 21px 20px; }
  .application-tab-copy strong { font-size: 17px; }
  .application-copy { padding: 24px; }
  .application-bottom { flex-wrap: wrap; }
}
@media(max-width:800px) {
  .projects .project-grid.application-explorer { grid-template-columns: 1fr; grid-template-areas: 'choices' 'stage'; }
  .application-choices { border-left: 0; border-bottom: 1px solid #dce4e0; }
  .application-choices-head { padding: 17px 20px; }
  .application-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
  .application-tab { display: flex; align-items: start; flex-direction: column; gap: 8px; padding: 16px; border-right: 1px solid #dce4e0; }
  .application-tab:last-child { border-right: 0; }
  .application-tab::before { top: auto; right: 0; bottom: 0; width: auto; height: 3px; transform: scaleX(0); }
  .application-tab[aria-selected='true']::before { transform: scaleX(1); }
  .application-tab-number { font-size: 12px; }
  .application-tab-copy strong { font-size: 13px; }
  .application-tab-copy small, .application-tab > .icon, .application-choices-foot { display: none; }
  .application-visual img { height: 330px; }
  .application-bottom { flex-wrap: nowrap; }
}
@media(max-width:540px) {
  .projects .section-heading { margin-bottom: 26px; }
  .application-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .application-tab { flex-direction: row; gap: 10px; align-items: center; padding: 16px 14px; min-height: 62px; }
  .application-tab:nth-child(2) { border-right: 0; }
  .application-tab-copy strong { font-size: 13px; letter-spacing: -.2px; }
  .application-tab::before { top: 0; bottom: 0; right: auto; width: 3px; height: auto; transform: scaleY(0); }
  .application-tab[aria-selected='true']::before { transform: scaleY(1); }
  .application-visual img { height: 240px; }
  .application-photo-note { top: 16px; left: 16px; padding: 10px 12px; font-size: 8px; }
  .application-copy { padding: 23px 20px; }
  .application-copy h3 { font-size: 27px; }
  .application-copy p { font-size: 13px; }
  .application-bottom { flex-direction: column; align-items: stretch; gap: 18px; margin-top: 20px; }
  .application-open { justify-content: space-between; min-height: 44px; }
  .application-open .icon { width: 40px; height: 40px; padding: 13px; }
}
@media(prefers-reduced-motion:reduce) {
  .application-explorer *, .application-explorer *::before { transition: none!important; }
}