.projects-institution { overflow: hidden; }

.projects-fresco {
  padding: clamp(42px, 7vw, 80px);
  color: #f8f1dc;
  background:
    repeating-linear-gradient(90deg, transparent 0 43px, rgba(255,255,255,.035) 44px 45px),
    linear-gradient(128deg, #182540, #274f5d 58%, #8b5948);
  border-bottom: 3px solid #263550;
}
.projects-fresco > a { color: #ffd27a; font-size: 12px; }
.projects-fresco > p:first-of-type { margin: 62px 0 10px; color: #ffd27a; font-size: 11px; font-weight: 800; letter-spacing: 2px; }
.projects-fresco h1 { max-width: 900px; font-size: clamp(50px, 8vw, 92px); line-height: .92; }
.projects-fresco > p:last-child { max-width: 720px; margin: 24px 0 0; font: 20px/1.5 Georgia, serif; }

.projects-floor { padding: clamp(22px, 5vw, 56px); background: #e8edf0; }
.projects-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.project-card { height: 100%; }
.project-card > a { display: flex; min-height: 270px; height: 100%; flex-direction: column; padding: clamp(24px, 4vw, 38px); color: #172039; background: #fffefa; border: 1px solid #36455f; border-top: 8px solid #b7654b; box-shadow: 7px 7px 0 rgba(24,35,62,.16); text-decoration: none; }
.project-card > a:hover, .project-card > a:focus-visible { outline: 4px solid #ffd27a; outline-offset: -4px; transform: translate(-2px, -2px); }
.project-card-meta { display: flex; justify-content: space-between; gap: 12px; color: #6b4a3d; font-size: 10px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; }
.project-card h2 { margin: 22px 0 12px; font-size: clamp(34px, 5vw, 52px); line-height: .96; }
.project-card p { margin: 0; font-size: 17px; line-height: 1.55; }
.project-card strong { margin-top: auto; padding-top: 24px; color: #286a64; }

.projects-home { padding: clamp(28px, 5vw, 56px); background: #dce8e6; border-top: 1px solid #425b63; border-bottom: 1px solid #425b63; }
.projects-home > header { display: grid; grid-template-columns: .75fr 1.25fr; gap: 24px; margin-bottom: 24px; }
.projects-home > header p { max-width: 650px; margin: 0; }
.projects-home-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 22px; padding: 0; list-style: none; }
.projects-home-list a { display: block; min-height: 128px; padding: 20px; color: #172039; background: #fffefa; border: 1px solid #425b63; text-decoration: none; }
.projects-home-list a:hover, .projects-home-list a:focus-visible { background: #fff4cf; outline: 3px solid #a65342; }
.projects-home-list span { display: block; margin-bottom: 8px; color: #8a4b3d; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }
.projects-home-list strong { display: block; font-size: 25px; line-height: 1.05; }
.projects-home-list small { display: block; margin-top: 9px; font-size: 14px; line-height: 1.45; }

.project-page { min-height: 100vh; color: #172039; background: #e8edf0; }
.project-page header { padding: clamp(28px, 6vw, 72px); color: #f8f1dc; background: linear-gradient(128deg, #182540, #315965 66%, #8b5948); }
.project-page header > a { color: #ffd27a; }
.project-page .project-status { margin: 62px 0 10px; color: #ffd27a; font-size: 11px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; }
.project-page h1 { max-width: 980px; font-size: clamp(50px, 9vw, 102px); line-height: .92; }
.project-page .project-lede { max-width: 820px; margin: 24px 0 0; font: 21px/1.5 Georgia, serif; }
.project-body { width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 34px 0 70px; }
.project-question { display: grid; grid-template-columns: .55fr 1.45fr; gap: 24px; padding: clamp(24px, 5vw, 46px); background: #fffefa; border: 1px solid #36455f; border-top: 8px solid #b7654b; }
.project-question p { margin: 0; font: clamp(24px, 3vw, 38px)/1.2 Georgia, serif; }
.project-section { margin-top: 18px; padding: clamp(24px, 4vw, 42px); background: #fffefa; border: 1px solid #6d7789; }
.project-section h2 { margin-bottom: 18px; font-size: clamp(31px, 5vw, 54px); line-height: 1; }
.project-section p, .project-section li { max-width: 820px; font-size: 17px; line-height: 1.58; }
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.project-branch { padding: 22px; background: #eef2ef; border-left: 5px solid #286a64; }
.project-branch[data-state="planned"] { border-left-color: #a65342; }
.project-branch h3 { margin: 5px 0 10px; font-size: 24px; }
.project-branch small { color: #6b4a3d; font-weight: 800; letter-spacing: 1.1px; text-transform: uppercase; }
.project-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.project-links a { padding: 11px 15px; color: #fff; background: #263550; font-weight: 700; text-decoration: none; }

@media (max-width: 700px) {
  .projects-institution { width: 100%; margin: 0; border-right: 0; border-left: 0; }
  .projects-fresco { padding: 42px 22px; }
  .projects-fresco > p:first-of-type { margin-top: 42px; }
  .projects-list, .projects-home-list, .project-grid { grid-template-columns: 1fr; }
  .projects-floor { padding: 18px 10px 28px; }
  .projects-home > header, .project-question { grid-template-columns: 1fr; }
  .project-body { width: calc(100% - 20px); }
}