/* Figma design tokens — ARPM Internal / Website (1728px artboard) */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;1,400&family=IBM+Plex+Serif:ital,wght@0,400;1,400&display=swap');

:root {
    --font-sans: 'IBM Plex Sans', sans-serif;
    --font-serif: 'IBM Plex Serif', serif;

    --color-bg: #ffffff;
    --color-text: #333333;
    --color-nav: #58524b;
    --color-nav-active: #f6633e;
    --color-heading: #4b4135;
    --color-body: #615a51;
    --color-muted: #6c6c6c;
    --color-card-title: #4e4e4e;
    --color-tagline: #a7a7a7;
    --color-label: #5a5a5a;
    --color-border: #6b6b6b;
    --color-line: #000000;
    --color-hub-band: #f7f7f7;
    --color-card-border: #e0e0e0;
    --color-placeholder: #e8e8e8;
    --color-cta-blue: #3053e3;
    --color-btn-gray: #e8e8e8;

    --tag-architecture-bg: #9aa3f0;
    --tag-architecture-text: #ffffff;
    --tag-technology-bg: #f6633e;
    --tag-technology-text: #ffffff;
    --tag-planning-bg: #d5e74c;
    --tag-planning-text: #5a6410;

    --accent-planning-bg: #d5e74c;
    --accent-planning-text: #7c8a13;
    --accent-architecture-bg: #f6633e;
    --accent-architecture-text: #7a210b;
    --accent-technology-bg: #3053e3;
    --accent-technology-text: #ffffff;
    --accent-filter-active: #fcc0b1;
    --accent-view-all-bg: #e1e1e1;

    /* Layout — from Figma metadata */
    --layout-artboard: 108rem; /* 1728px */
    --header-logo-inset: 0.625rem; /* 10px */
    --space-page-x: 5.375rem; /* 86px — Home, Projects, Careers */
    --space-page-x-alt: 7rem; /* 112px — About, Contact, Services */
    --content-band: 97.5rem; /* 1560px */
    --nav-link-gap: 5.625rem; /* 90px between nav items */
    --nav-height: 6.4375rem; /* logo 103px + y offset */
    --header-research-inset: 7.5625rem; /* ~121px right */

    --space-label-title: 2rem;
    --space-section-y: clamp(4rem, 6vw, 7rem);
    --space-block: 2.5rem;

    --text-nav: 1.25rem; /* 20px */
    --text-section-label: 2.5rem; /* 40px / 52px box */
    --text-serif-lg: clamp(2.5rem, 4.2vw, 4rem);
    --text-card-title: 3rem; /* 48px */
    --text-body-lg: 2rem; /* 32px */
    --text-body: 1.5rem; /* 24px */
    --text-project-title: 2.25rem; /* 36px */
    --text-btn: 1.25rem;
    --text-btn-accent: 1.5rem;
    --text-tag: 1rem;
    --text-hero-tagline: 2rem;

    --card-service-w: 28.25rem; /* 452px */
    --card-service-img-h: 30.6875rem; /* 491px */
    --card-project-w: 40rem; /* 640px */
    --card-project-img-h: 30rem; /* 480px */
    --grid-service-gap: 6.375rem; /* 102px */
    --grid-project-gap-x: 7.4375rem; /* 119px */
    --grid-project-gap-y: 9.875rem; /* ~158px */

    --radius-sm: 4px;
    --line-height-tight: 1.1;
    --line-height-ui: 1.2;
    --line-height-body: 1.7;
}