@font-face {
  font-family: 'Taberna Friz';
  src: url('/fonts/friz-quadrata-medium.otf') format('opentype');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

.home-page { --accent-coffee: #dfa866; --accent-invocador: #64f4b3; --accent-paddock: #ff835d; }
.home-page h1, .home-page h2, .home-page h3, .home-page .wordmark {
  font-family: 'Taberna Friz', Georgia, serif;
  font-weight: 500;
  font-synthesis: none;
}
.home-page .wordmark { letter-spacing: .12em; }
.home-page h1 { max-width: 1000px; font-size: clamp(2.6rem, 6.3vw, 5.75rem); line-height: 1.1; letter-spacing: -.035em; text-wrap: balance; }
.home-page .hero { padding-block: clamp(70px, 9vw, 120px) 70px; }
.home-page .lead { max-width: 760px; }
.home-page .project-card { position: relative; isolation: isolate; overflow: hidden; padding: 32px; min-height: 390px; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.home-page .project-card > :not(.card-photo) { position: relative; z-index: 2; }
.home-page .project-card h3 { font-size: 1.85rem; line-height: 1.18; letter-spacing: -.025em; margin-top: 60px; }
.home-page .project-card p { color: #f0ebe3; }
.home-page .project-card a { padding-block: 10px; min-height: 44px; border-color: var(--card-accent); }
.home-page .project-card a span, .home-page .card-index { color: var(--card-accent); }
.home-page .coffee { --card-accent: var(--accent-coffee); background: #2e221a; }
.home-page .invocador { --card-accent: var(--accent-invocador); background: radial-gradient(ellipse at 100% 0%, #263b33, transparent 70%), linear-gradient(145deg, #231b2e, #141217); }
.home-page .paddock { --card-accent: var(--accent-paddock); background: repeating-linear-gradient(125deg, transparent 0 22px, #ffffff03 22px 23px), linear-gradient(145deg, #351c1c, #171212); }
.home-page .card-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 58%; z-index: 0; }
.home-page .coffee::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, #17120e30 0%, #17120eaa 38%, #17120ef5 78%); }
.home-page .invocador .card-photo, .home-page .paddock .card-photo { object-position: center top; }
.home-page .invocador::after, .home-page .paddock::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.home-page .invocador::after { background: linear-gradient(180deg, #14121710 0%, #14121765 35%, #141217e6 75%); }
.home-page .paddock::after { background: linear-gradient(180deg, #17121210 0%, #17121255 35%, #171212cc 85%); }
.home-page .coffee .card-index { background: #17120ee6; padding: 7px 10px; border-radius: 5px; align-self: flex-start; }
.home-page .project-card:focus-within { border-color: var(--card-accent); box-shadow: 0 8px 24px #0005; }
.home-page .skip-link { position: absolute; z-index: 10; top: 10px; left: 15px; padding: 12px 18px; background: #f4f0e7; color: #101114; transform: translateY(-160%); }
.home-page .skip-link:focus { transform: translateY(0); }
@media (hover: hover) { .home-page .project-card:hover { transform: translateY(-5px); border-color: var(--card-accent); box-shadow: 0 8px 24px #0005; } }
@media (max-width: 850px) {
  .home-page .project-card { min-height: 340px; }
  .home-page .card-photo { object-position: 50% 55%; }
  .home-page .project-card h3 { margin-top: 42px; }
}
@media (max-width: 400px) { .home-page .project-card { padding: 24px; } .home-page h1 { font-size: 2.35rem; } }
@media (prefers-reduced-motion: reduce) { .home-page .project-card { transition: none; } .home-page .project-card:hover { transform: none; } }