.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.masthead-inner,
.page-inner{width:min(calc(100% - 48px),var(--content));margin:0 auto}
.masthead{
      position:relative;display:flex;min-height:300px;align-items:center;overflow:hidden;color:var(--white);
      background:radial-gradient(circle at 86% 24%,rgba(47,111,159,.44),transparent 34%),
      linear-gradient(118deg,var(--navy-950),var(--navy-900) 58%,var(--navy-800))
    }
.masthead::before,
.masthead::after{position:absolute;content:"";pointer-events:none}
.masthead::before{
      inset:0;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px);background-size:56px 56px;
      -webkit-mask-image:linear-gradient(90deg,transparent 14%,#000 100%);mask-image:linear-gradient(90deg,transparent 14%,#000 100%)
    }
.masthead::after{
      right:-88px;bottom:-230px;width:430px;height:430px;border:1px solid rgba(255,255,255,.18);
      border-radius:50%;box-shadow:0 0 0 54px rgba(255,255,255,.03),0 0 0 108px rgba(255,255,255,.02)
    }
.masthead-inner{position:relative;z-index:1;padding:102px 0 36px}
.eyebrow{
      display:flex;align-items:center;gap:11px;margin:0 0 11px;color:#9dc8f2;font-size:12px;
      font-weight:750;letter-spacing:.15em;text-transform:uppercase
    }
.eyebrow::before{width:34px;height:3px;border-radius:99px;background:var(--red);content:""}
.masthead h1{margin:0;font-size:clamp(40px,6vw,64px);font-weight:850;letter-spacing:-.045em;line-height:1}
.masthead-subtitle{max-width:760px;margin:14px 0 0;color:rgba(255,255,255,.74);font-size:15px}
.page-inner{padding:72px 0 88px}
.filter-panel{
      display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 28px;align-items:end;
      margin-bottom:30px;padding:22px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--soft)
    }
.filter-group{min-width:0}
.filter-label{display:block;margin-bottom:9px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.segmented{display:flex;flex-wrap:wrap;gap:8px}
.filter-button,
.year-select{
      min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--white);
      color:var(--ink);font-weight:750
    }
.filter-button{min-width:94px;padding:10px 16px;cursor:pointer}
.filter-button:hover,
.filter-button:focus-visible,
.year-select:focus-visible{
      border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(11,65,111,.10)
    }
.filter-button[aria-pressed="true"]{border-color:var(--academic-blue);color:var(--white);background:var(--academic-blue)}
.year-select{min-width:148px;padding:9px 38px 9px 13px;cursor:pointer}
.filter-summary{grid-column:1/-1;margin:-2px 0 0;color:var(--muted);font-size:13px}
.filter-summary strong{color:var(--navy-900);font-weight:800}
.project-grid,
.state-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.project-card{
      position:relative;display:flex;min-width:0;min-height:100%;flex-direction:column;overflow:hidden;
      padding:26px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--white);
      box-shadow:0 14px 34px rgba(11,65,111,.07)
    }
.project-card::before{position:absolute;inset:0 auto 0 0;width:4px;background:var(--red);content:""}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:17px}
.status-badge{
      display:inline-flex;min-height:28px;align-items:center;padding:4px 10px;border-radius:999px;
      font-size:11px;font-weight:850;letter-spacing:.08em
    }
.status-ongoing{color:#075985;background:#e0f2fe}
.status-completed{color:#4b5563;background:#eef1f4}
.project-period{color:var(--muted);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;text-align:right}
.project-title{margin:0;color:var(--navy-900);font-size:clamp(19px,2vw,23px);font-weight:820;letter-spacing:-.025em;line-height:1.4}
.project-objective{margin:13px 0 0;color:#425468;font-size:14px;line-height:1.7}
.project-meta{display:grid;gap:9px;margin:20px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.meta-row{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px;margin:0}
.meta-row dt{color:var(--muted);font-size:12px;font-weight:750}
.meta-row dd{margin:0;color:var(--ink);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.tag-list{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0 0;padding:0;list-style:none}
.tag{padding:5px 9px;border-radius:999px;color:var(--blue);background:#edf5fc;font-size:11px;font-weight:750}
.card-actions{display:flex;margin-top:auto;padding-top:22px}
.result-link{
      display:inline-flex;min-height:44px;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;
      color:var(--white);background:var(--academic-blue);font-size:13px;font-weight:750;text-decoration:none
    }
.result-link::after{content:"↗"}
.result-link:hover,
.result-link:focus-visible{background:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(11,65,111,.12)}
.skeleton-card{
      min-height:288px;padding:26px;border:1px solid var(--line);border-radius:var(--radius-md);
      background:var(--white);box-shadow:0 14px 34px rgba(11,65,111,.05)
    }
.skeleton-line{
      height:12px;margin-bottom:14px;border-radius:999px;
      background:linear-gradient(90deg,#e9ecef 25%,#f8f9fa 50%,#e9ecef 75%);
      background-size:200% 100%;animation:shimmer 1.25s ease-in-out infinite
    }
.skeleton-line.short{width:28%}
.skeleton-line.medium{width:62%}
.skeleton-line.long{width:91%}
@keyframes shimmer{0%{background-position:200% 0}
100%{background-position:-200% 0}}
.state-message{
      display:none;padding:34px 20px;border:1px solid var(--line);border-radius:var(--radius-md);
      color:var(--muted);background:var(--soft);text-align:center
    }
.state-message[aria-hidden="false"]{display:block}
.state-message.error{border-color:#f1c8c8;color:#9b1c1c;background:#fff6f6}
@media (max-width:900px){.masthead-inner,
.page-inner{width:min(calc(100% - 24px),var(--content))}
.masthead{min-height:270px}
.masthead-inner{padding:96px 0 30px}
.masthead h1{font-size:clamp(36px,10vw,52px)}
.page-inner{padding:56px 0 64px}
.project-grid,
.state-grid{grid-template-columns:1fr}}
@media (max-width:600px){.masthead::before{background-size:44px 44px}
.masthead::after{right:-220px}
.filter-panel{grid-template-columns:1fr;padding:18px}
.filter-summary{grid-column:1}
.filter-button{min-width:0;flex:1 1 88px}
.year-select{width:100%}
.project-card{padding:22px 20px}
.card-top{align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.skeleton-line{animation:none}}