.portfolio-home { background: #fff; }
.portfolio-home__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.portfolio-home__head .text-link { flex: 0 0 auto; margin: 0 0 1rem; }
.portfolio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.portfolio-card { overflow: hidden; border: 1px solid rgba(0,51,102,.11); background: #fff; box-shadow: 0 16px 34px rgba(0,31,63,.08); }
.portfolio-card__media { min-height: 15.5rem; display: flex; align-items: flex-end; padding: 1rem 1.1rem; background-position: center; background-size: cover; text-decoration: none; position: relative; isolation: isolate; }
.portfolio-card__media::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 42%, rgba(0,20,44,.82)); z-index: -1; }
.portfolio-card__media--fallback { background: radial-gradient(circle at 75% 20%, rgba(214,163,71,.55), transparent 22%), linear-gradient(135deg, #003366, #001a35); }
.portfolio-card__media--fallback::after { content: 'AchEI'; position: absolute; right: 1.15rem; top: 1rem; color: rgba(255,255,255,.84); font: 600 2.1rem/1 'Cormorant Garamond', serif; letter-spacing: .04em; }
.portfolio-card__media span { color: #fff; font: 700 .7rem/1.2 Inter, sans-serif; text-transform: uppercase; letter-spacing: .12em; }
.portfolio-card__body { padding: 1.3rem 1.35rem 1.45rem; }
.portfolio-card__body > p { color: #ad7624; font: 700 .67rem/1.2 Inter, sans-serif; text-transform: uppercase; letter-spacing: .11em; margin: 0 0 .55rem; }
.portfolio-card__body h2, .portfolio-card__body h3 { color: #003366; font-family: 'Cormorant Garamond', serif; font-size: 1.75rem; line-height: 1.05; margin: 0 0 .65rem; }
.portfolio-card__body h2 a, .portfolio-card__body h3 a { color: inherit; text-decoration: none; }
.portfolio-card__body > span { display: block; color: #4b5969; font: 400 .92rem/1.55 Inter, sans-serif; }
.portfolio-card__link { display: inline-flex; margin-top: 1.05rem; color: #003366; font: 700 .78rem/1.2 Inter, sans-serif; text-decoration: none; }
.portfolio-card__link:hover, .portfolio-card__body h2 a:hover, .portfolio-card__body h3 a:hover { color: #ad7624; }
.portfolio-hero { background: radial-gradient(circle at 78% 22%, rgba(214,163,71,.28), transparent 25%), #003366; color: #fff; padding: clamp(6rem, 14vw, 10rem) 6vw 5rem; }
.portfolio-hero > div { max-width: 50rem; margin: 0 auto; }
.portfolio-hero .eyebrow { color: #e7bd71; }
.portfolio-hero h1 { max-width: 38rem; font: 600 clamp(2.7rem, 6vw, 4.5rem)/.95 'Cormorant Garamond', serif; margin: .7rem 0 1.35rem; }
.portfolio-hero p:not(.eyebrow) { max-width: 42rem; color: rgba(255,255,255,.84); font: 400 1.05rem/1.65 Inter, sans-serif; }
.portfolio-catalog { max-width: 76rem; }
.portfolio-filters { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 2rem; }
.portfolio-filters button { cursor: pointer; border: 1px solid rgba(0,51,102,.22); background: #fff; color: #003366; border-radius: 999px; padding: .65rem 1rem; font: 700 .75rem/1 Inter, sans-serif; transition: background .18s ease, color .18s ease, border-color .18s ease; }
.portfolio-filters button:hover, .portfolio-filters button.is-active { background: #003366; border-color: #003366; color: #fff; }
.portfolio-card[hidden] { display: none; }
.portfolio-empty { color: #526174; font: 400 1rem/1.6 Inter, sans-serif; }
@media (max-width: 760px) { .portfolio-home__head { display: block; } .portfolio-home__head .text-link { display: inline-flex; margin-top: 1rem; } .portfolio-grid { grid-template-columns: 1fr; } .portfolio-card__media { min-height: 14rem; } .portfolio-hero { padding-top: 7.5rem; } }