.downloads-hero { position: relative; min-height: 720px; height: 80svh; overflow: hidden; background: #171817; color: #fff; }
.downloads-hero > img { width: 100%; height: 100%; object-fit: cover; object-position: center 44%; }
.downloads-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,13,12,.88) 0%, rgba(12,13,12,.55) 45%, rgba(12,13,12,.12) 76%); }
.downloads-hero-copy { position: absolute; left: max(28px, calc((100vw - 1280px)/2)); bottom: 72px; width: min(760px, calc(100% - 56px)); }
.downloads-hero-copy h1 { margin: 16px 0 24px; font: 800 clamp(3.6rem, 7vw, 7rem)/.88 "Arial Narrow", Arial, sans-serif; letter-spacing: -.055em; text-transform: uppercase; }
.downloads-hero-copy > p:last-child { max-width: 620px; color: #e1e2df; font-size: 1.02rem; line-height: 1.7; }
.downloads-index { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; width: min(620px, calc(100% - 40px)); margin: -28px auto 0; overflow: hidden; background: #fff; border-radius: 999px; box-shadow: 0 18px 48px rgba(0,0,0,.14); }
.downloads-index a { padding: 18px 24px; text-align: center; font-size: .76rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.downloads-index a + a { border-left: 1px solid #dedcd5; }
.downloads-index a:hover { color: #fff; background: #171817; }
.downloads-intro { display: grid; grid-template-columns: 1fr .75fr; gap: 8vw; align-items: end; padding-top: 116px; }
.downloads-intro h2, .downloads-group h2, .downloads-help h2 { margin: 15px 0 0; font: 800 clamp(2.8rem, 4.8vw, 5rem)/.94 "Arial Narrow", Arial, sans-serif; letter-spacing: -.05em; text-transform: uppercase; }
.downloads-intro > p { max-width: 540px; margin: 0; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.downloads-group { border-top: 1px solid var(--line); }
.downloads-group--soft { background: #f5f4ef; border: 0; }
.downloads-group > header { display: grid; grid-template-columns: 70px 1fr; gap: 26px; align-items: start; margin-bottom: 48px; }
.downloads-group > header > span { display: grid; width: 52px; height: 52px; place-items: center; color: #171817; background: var(--yellow); border-radius: 50%; font-size: .72rem; font-weight: 900; }
.downloads-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.downloads-grid--three { grid-template-columns: repeat(3, 1fr); }
.download-card { display: flex; flex-direction: column; min-height: 330px; padding: 34px; color: #171817; background: #fff; border: 1px solid #dedcd5; border-top: 5px solid var(--yellow); border-radius: 12px; transition: transform .2s ease, box-shadow .2s ease; }
.download-card:hover { transform: translateY(-5px); box-shadow: 0 20px 42px rgba(0,0,0,.1); }
.download-card > span { color: #8e6a0d; font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.download-card h3 { margin: 26px 0 18px; font: 800 clamp(1.8rem, 2.8vw, 2.8rem)/.96 "Arial Narrow", Arial, sans-serif; text-transform: uppercase; }
.download-card p { color: #6b6e6a; font-size: .9rem; line-height: 1.65; }
.download-card b { display: flex; justify-content: space-between; margin-top: auto; padding-top: 20px; border-top: 1px solid #dedcd5; font-size: .76rem; text-transform: uppercase; }
.download-card i { color: var(--yellow); font-size: 1.2rem; font-style: normal; }
.download-card--dark { color: #fff; background: #171817; border-color: #171817; }
.download-card--dark p { color: #bdc0bc; }
.download-card--dark b { border-color: #3b3d3b; }
.download-card--yellow { background: #f4b619; border-color: #f4b619; }
.download-card--yellow > span, .download-card--yellow p { color: #4e3a07; }
.download-card--yellow b { border-color: rgba(23,24,23,.28); }
.download-card--yellow i { color: #171817; }
.download-card--cover { display: grid; grid-template-columns: minmax(200px, .72fr) 1fr; min-height: 470px; padding: 0; overflow: hidden; border: 0; }
.download-card--cover figure { display: grid; height: 100%; margin: 0; padding: 28px; place-items: center; background: #202120; }
.download-card--cover img { display: block; width: 100%; max-width: 300px; max-height: 410px; object-fit: contain; box-shadow: 0 14px 30px rgba(0,0,0,.26); }
.download-card--cover > div { display: flex; flex-direction: column; padding: 36px 34px; }
.download-card--cover > div > span { color: #8e6a0d; font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.downloads-help { display: grid; grid-template-columns: 1.1fr .7fr; gap: 8vw; align-items: end; color: #fff; background: #171817; }
.downloads-help > div:last-child { display: grid; justify-items: start; gap: 24px; }
.downloads-help p { margin: 0; color: #c2c5c1; font-size: 1rem; line-height: 1.7; }
@media (max-width: 980px) { .downloads-grid--three { grid-template-columns: 1fr 1fr; } .downloads-grid--three .download-card:last-child { grid-column: 1 / -1; } }
@media (max-width: 720px) { .downloads-hero { min-height: 650px; height: 78svh; } .downloads-hero > img { object-position: 57% center; } .downloads-hero-shade { background: linear-gradient(0deg, rgba(12,13,12,.92) 0%, rgba(12,13,12,.45) 65%, rgba(12,13,12,.18)); } .downloads-hero-copy { left: 20px; right: 20px; bottom: 42px; width: auto; } .downloads-hero-copy h1 { font-size: clamp(3.15rem, 15vw, 4.8rem); } .downloads-index { margin-top: -24px; } .downloads-index a { padding: 16px 12px; font-size: .68rem; } .downloads-intro, .downloads-help { grid-template-columns: 1fr; gap: 30px; } .downloads-group > header { grid-template-columns: 46px 1fr; gap: 16px; } .downloads-group > header > span { width: 42px; height: 42px; } .downloads-grid, .downloads-grid--three { grid-template-columns: 1fr; } .downloads-grid--three .download-card:last-child { grid-column: auto; } .download-card { min-height: 290px; padding: 28px 24px; } .download-card--cover { grid-template-columns: .8fr 1fr; min-height: 340px; padding: 0; } .download-card--cover figure { padding: 18px; } .download-card--cover img { max-height: 300px; } .download-card--cover > div { padding: 26px 22px; } }
@media (max-width: 480px) { .download-card--cover { grid-template-columns: 1fr; } .download-card--cover figure { height: 390px; } .download-card--cover img { max-height: 340px; } }
@media (prefers-reduced-motion: reduce) { .download-card { transition: none; } }