:root {
    /* davidazofeifa - LAYOUT (canonical structural variable contract). */

    --REF--layout-content-width: 1180px;
    --REF--layout-content-width-narrow: 760px;
    --REF--layout-nav-height: 4.25rem;
    --REF--layout-topbar-height: 4.25rem;
    --REF--layout-sidebar-width: 260px;
    --REF--layout-hero-home-height: 100svh;
    --REF--layout-hero-inner-min: 24rem;
    --REF--layout-hero-inner-max: 34rem;
    --REF--layout-section-gap: clamp(3.5rem, 7vw, 6rem);
    --REF--layout-card-cols: 3;
    --layout-content-width: min(var(--REF--layout-content-width), calc(100vw - 2rem));
    --layout-content-width-narrow: min(var(--REF--layout-content-width-narrow), calc(100vw - 2rem));
    --layout-content-inset: 1rem;
    --layout-nav-height: var(--REF--layout-nav-height);
    --layout-nav-padding: calc(var(--REF--layout-nav-height) * 0.24) 0;
    --layout-topbar-height: var(--REF--layout-topbar-height);
    --layout-sidebar-width: var(--REF--layout-sidebar-width);
    --layout-hero-home-height: var(--REF--layout-hero-home-height);
    --layout-hero-home-padding: calc(var(--REF--layout-nav-height) * 1.2) 1rem 3rem;
    --layout-hero-home-align-block: center;
    --layout-hero-home-align-inline: center;
    --layout-hero-home-text-align: center;
    --layout-hero-inner-height: clamp(var(--REF--layout-hero-inner-min), 54vw, var(--REF--layout-hero-inner-max));
    --layout-hero-inner-padding: calc(var(--REF--layout-nav-height) * 1.1) 1rem 2.25rem;
    --layout-hero-inner-align-block: center;
    --layout-hero-inner-align-inline: flex-start;
    --layout-hero-inner-text-align: start;
    --layout-section-gap: var(--REF--layout-section-gap);
    --layout-footer-padding: clamp(2.5rem, 5vw, 4rem) 0 2rem;
    --layout-footer-gap: clamp(1.25rem, 3vw, 2.5rem);
    --layout-card-cols: 1;
    --layout-card-grid-template: repeat(var(--layout-card-cols), minmax(0, 1fr));
    --layout-control-min-height: 2.75rem;
    --layout-card-cols-wide: 1;
    --layout-essence-cols: 1;
    --layout-pillars-cols: 1;
    --layout-services-cols: 1;
    --layout-metrics-cols: 1;
    --layout-audience-cols: 1;
    --layout-founder-template: 1fr;
    --layout-box-padding: 1.75rem 1.5rem;
    --layout-control-padding: 1rem 1.75rem;
    --REF--layout-essence-cols: 2;
    --REF--layout-pillars-cols: 3;
    --REF--layout-services-cols: 2;
    --REF--layout-metrics-cols: 4;
    --REF--layout-audience-cols: 2;
    --REF--layout-box-padding-block: 2.5rem;
    --REF--layout-box-padding-inline: 2.5rem;
    --REF--layout-control-padding-block: 1.15rem;
    --REF--layout-control-padding-inline: 2.4rem;
    --REF--layout-control-min-height: 3rem;
    --layout-hero-home-media-fit: cover;
    --layout-hero-home-media-position: center;
    --layout-hero-inner-media-fit: cover;
    --layout-hero-inner-media-position: center;
}

@media (min-width: 641px) and (max-width: 960px) {
    :root {
        --layout-card-cols: min(2, var(--REF--layout-card-cols));
        --layout-card-cols-wide: min(3, var(--REF--layout-card-cols));
        --layout-essence-cols: 1;
        --layout-pillars-cols: 1;
        --layout-services-cols: 1;
        --layout-metrics-cols: 2;
        --layout-audience-cols: 1;
        --layout-founder-template: 1fr;
    }
}

@media (max-width: 640px) {
    :root {
        --layout-card-cols: 1;
        --layout-card-cols-wide: 1;
        --layout-content-inset: 1rem;
        --layout-hero-home-padding: calc(var(--REF--layout-nav-height) * 1.2) 1rem 3rem;
        --layout-hero-inner-padding: calc(var(--REF--layout-nav-height) * 1.1) 1rem 2.25rem;
        --layout-essence-cols: 1;
        --layout-pillars-cols: 1;
        --layout-services-cols: 1;
        --layout-metrics-cols: 1;
        --layout-audience-cols: 1;
        --layout-founder-template: 1fr;
        --layout-box-padding: 1.75rem 1.5rem;
        --layout-control-padding: 1rem 1.75rem;
    }
}
