/* Clear hierarchy, restrained motion and accessible controls in our own visual language. */
:root { --bronze: #87663d; --light-gray: #6f6860; }
body { font-weight: 400; }
section[id] { scroll-margin-top: 100px; }
:where(a,button,[role="button"]):focus-visible { outline: 2px solid var(--bronze); outline-offset: 5px; border-radius: 4px; }
.skip-link { position: fixed; top: 12px; left: 24px; z-index: 10000; padding: 12px 18px; background: var(--charcoal); color: white; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.nav-link { min-height: 44px; display: inline-flex; align-items: center; opacity: 1; }
.draw-underline { position: relative; }
.draw-underline::after { content: ''; position: absolute; bottom: 4px; left: 0; width: 0; height: 1px; background: currentColor; transition: width .2s ease; }
.draw-underline:hover::after, .draw-underline:focus-visible::after { width: 100%; }
.label-sm, .hero-tag { font-size: 12px; letter-spacing: .16em; }
.hero-heading, .hero-tag, .hero-cta, .contact-heading, .about-heading, .services-heading, .portfolio-heading { opacity: 1; animation: none; filter: none; }
.reveal, .clip-reveal, .service-card { opacity: 1; transform: none; clip-path: none; will-change: auto; }
.hero-cta, .cta-whatsapp { min-height: 48px; transition: background .2s ease, color .2s ease; }
.hero-cta svg { width: 18px; height: 18px; }
.hero-cta::before { display: none; }
.hero-cta:hover { background: var(--charcoal); }
.service-card { transition: opacity .3s ease, transform .3s ease; }
.service-card:hover { transform: none; }
.about-body { max-width: 62ch; }
.about-body p, .service-desc { font-weight: 400; }
.about-heading em { color: #cbb08b; }
.about-left .label-sm { color: #c4bdb2 !important; }
.about-numbers { gap: 20px; }
.about-num-label { color: #c4bdb2; letter-spacing: .1em; }
.portfolio-filters { gap: 8px; margin-bottom: 32px; }
.filter-pill { min-height: 44px; padding: 10px 16px; border: 1px solid var(--border); border-radius: 999px; text-transform: none; letter-spacing: 0; font-size: 14px; }
.filter-pill::after { display: none; }
.filter-pill.active { background: var(--charcoal); border-color: var(--charcoal); color: white; }
.filter-pill:hover:not(.active) { background: #eae5de; }
.project-grid { perspective: none; }
.project-item, .project-item img, .project-overlay { transform: none; transform-style: flat; will-change: auto; }
.project-item::after { display: none; }
.project-item img { transition: transform .25s ease; }
.project-item:hover img { transform: scale(1.02); }
.project-overlay { background: linear-gradient(to top, rgba(0,0,0,.75), transparent 60%); }
.project-name { font-size: 22px; font-weight: 500; }
.project-cat { background: #725432; }
.project-item:focus-visible { outline-offset: -4px; outline-color: white; }
.project-item:focus-visible .project-cat { opacity: 1; transform: none; }
.cta-whatsapp { background: #166534; border-radius: 999px; }
.cta-whatsapp:hover { background: #14532d; transform: none; box-shadow: none; }
.contact-link { min-height: 44px; font-size: 16px; font-weight: 400; overflow-wrap: anywhere; }
.contact-links { gap: 8px; }
.contact-left .label-sm { color: #d2c7b9 !important; }
.contact-heading em { color: #cbb08b; }
.site-footer { gap: 20px; flex-wrap: wrap; }
.site-footer span { font-weight: 400; }
.site-footer a { font-size: 12px; color: var(--light-gray); min-height: 44px; display: inline-flex; align-items: center; }
dialog.lightbox { margin: 0; padding: 0; border: 0; max-width: none; max-height: none; width: 100%; height: 100%; color: white; }
dialog.lightbox:not([open]) { display: none; }
dialog.lightbox::backdrop { background: rgba(0,0,0,.8); }
.lightbox-inner img { opacity: 1; animation: none; transform: none; }
.lightbox-close, .lightbox-nav { width: 48px; height: 48px; padding: 0; display: flex; align-items: center; justify-content: center; color: white; background: rgba(255,255,255,.1); border-radius: 50%; }
.lightbox-close svg, .lightbox-nav svg { flex-shrink: 0; }
.lightbox-footer { display: flex; justify-content: space-between; gap: 20px; color: #e3e0db; font-size: 14px; }
.lightbox-nav { top: 50%; }
.lightbox-inner { max-width: calc(100vw - 160px); }
.lightbox-inner img { max-width: 100%; max-height: calc(100svh - 160px); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
    .about { grid-template-columns: 1fr; }
    .about-left { padding: 80px 40px; gap: 64px; }
    .about-right { min-height: 0; }
    .founder-frame { height: min(100vw, 680px); }
    .founder-portrait { min-height: 0; height: 100%; }
}
@media (max-width: 600px) {
    .nav { padding: 12px 24px; background: rgba(245,243,239,.96); }
    .nav-links { gap: 20px; }
    .nav-link { font-size: 11px; letter-spacing: .07em; }
    .hero-sub { font-size: 16px; }
    .services, .portfolio { padding-block: 80px; }
    .about-left, .contact-left { padding: 64px 24px; }
    .about-left { gap: 48px; }
    .portfolio-filters { gap: 8px; }
    .filter-pill { font-size: 13px; padding-inline: 12px; }
    .project-grid { grid-template-columns: 1fr; grid-auto-rows: 280px; }
    .project-item.size-large, .project-item.size-wide { grid-column: auto; }
    .project-cat { opacity: 1; transform: none; top: 16px; left: 16px; font-size: 11px; letter-spacing: .08em; }
    .contact-right { padding: 48px 24px; }
    .contact-link { font-size: 14px; }
    .lightbox-inner { max-width: calc(100vw - 32px); }
    .lightbox-prev { left: 16px; top: auto; bottom: 24px; transform: none; }
    .lightbox-next { right: 16px; top: auto; bottom: 24px; transform: none; }
    .lightbox-close { top: 16px; right: 16px; }
    .lightbox-footer { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .reveal, .clip-reveal, .service-card, .project-item { opacity: 1; transform: none; clip-path: none; } .project-item:hover img { transform: none; } }