/* Shared presentation. grid.css owns geometry; theme.json owns typography. */
:root,
.editor-styles-wrapper {
    --cosma-gap: var(--wp--preset--spacing--medium, 1.5rem);
    --cosma-section-space: var(--wp--preset--spacing--large, 3rem);
    --cosma-body-font: var(--wp--preset--font-family--avenir);
    --cosma-display-font: var(--wp--preset--font-family--brown-inline);
}

*,
*::before,
*::after { box-sizing: border-box; }

body { margin: 0; }
a { text-underline-offset: 0.18em; }
:where(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}
strong, b { font-weight: 900; }
/* An explicit paragraph Appearance also governs previously bolded text.
   Unstyled paragraphs retain the established brand bold treatment. */
:is(.cosma-content, .editor-styles-wrapper) p[style*="font-weight"] :is(strong, b) {
    font-weight: inherit;
}
img, video { max-inline-size: 100%; block-size: auto; }
iframe { max-inline-size: 100%; }

.cosma-entry { padding-block: var(--cosma-section-space); }
.cosma-entry-header {
    max-inline-size: var(--cosma-content-width);
    margin-inline: auto;
    margin-block-end: var(--cosma-section-space);
}
.cosma-content { overflow-wrap: anywhere; }
.cosma-content > :first-child { margin-block-start: 0; }
.cosma-content > :last-child { margin-block-end: 0; }

/* Use the native Columns flex behavior and its 782px breakpoint.
   Stored flex-basis proportions, alignment and opt-out of stacking stay intact. */
:where(.cosma-content, .editor-styles-wrapper) .wp-block-column {
    min-inline-size: 0;
}
:where(.cosma-content, .editor-styles-wrapper) :where(.wp-block-columns) {
    gap: var(--cosma-gap);
}
:where(.cosma-content, .editor-styles-wrapper) :where(figure) {
    min-inline-size: 0;
    max-inline-size: 100%;
}
:where(.cosma-content, .editor-styles-wrapper) :where(.wp-block-image, .wp-block-video) {
    margin-inline: 0;
}
:where(.cosma-content, .editor-styles-wrapper) :where(.wp-block-image img, .wp-block-video video) {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
}
/* Captions remain children of their figures: no viewport width, floats or offset. */
:where(.cosma-content, .editor-styles-wrapper) :where(figcaption) {
    margin: var(--wp--preset--spacing--small) 0 0;
    padding: 0;
    max-inline-size: 100%;
    overflow-wrap: anywhere;
    text-align: start;
    font-family: var(--cosma-body-font);
    font-weight: 400;
    font-size: var(--wp--preset--font-size--small);
    line-height: 1.5;
}
.cosma-project-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cosma-gap);
    max-inline-size: var(--cosma-content-width);
    margin-inline: auto;
    margin-block-end: var(--cosma-section-space);
}
.cosma-project-header h1 { margin-block: 0 var(--cosma-gap); }
.cosma-project-subtitle {
    font-size: var(--wp--preset--font-size--large);
    line-height: 1.4;
    margin: 0;
}
.cosma-project-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    list-style: none;
    padding: 0;
    margin: 0 0 var(--cosma-gap);
    font-size: var(--wp--preset--font-size--small);
    font-weight: 500;
}
.cosma-logo-image { max-inline-size: 10rem; max-block-size: 6rem; object-fit: contain; }
.cosma-project-logo { align-self: center; }
.cosma-header { border-block-end: 1px solid var(--wp--preset--color--cosma-blue); }
.cosma-header-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--cosma-gap);
    padding-block: var(--cosma-gap);
}
.cosma-brand { font-weight: 900; text-decoration: none; }
.cosma-brand img { display: block; inline-size: 11.25rem; block-size: auto; }
.cosma-header-widgets { font-size: var(--wp--preset--font-size--small); }
.cosma-header-widgets p { margin: 0; }
.cosma-navigation { margin-inline-start: auto; }
.cosma-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0.5rem var(--cosma-gap);
}
.cosma-menu a { display: inline-block; padding-block: 0.375rem; }
.cosma-menu .sub-menu { list-style: none; padding-inline-start: 1rem; }
.cosma-footer {
    border-block-start: 1px solid var(--wp--preset--color--cosma-blue);
    padding-block: var(--cosma-section-space);
    margin-block-start: 0;
    font-size: var(--wp--preset--font-size--small);
}
.cosma-footer-grid { display: grid; gap: var(--cosma-section-space); }
.cosma-widget + .cosma-widget { margin-block-start: var(--cosma-gap); }
.cosma-widget-title { font-size: 1rem; }
.cosma-footer .widget_nav_menu ul { list-style: none; padding: 0; }
.cosma-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--cosma-gap);
    margin-block-start: var(--cosma-section-space);
}
.cosma-post-list { display: grid; gap: var(--cosma-section-space); }
.cosma-post-list h2 { margin-block-start: 0; }
.cosma-pagination { margin-block: var(--cosma-section-space); }
.cosma-pagination:empty { display: none; }
.cosma-skip-link {
    position: absolute;
    inset-inline-start: var(--cosma-gutter);
    inset-block-start: 0;
    transform: translateY(-150%);
    padding: 1rem;
    background: #fff;
    color: #111;
    z-index: 100000;
}
.cosma-skip-link:focus { transform: none; }

@media (min-width: 782px) {
    .cosma-project-header { grid-template-columns: minmax(0, 1fr) auto; }
    .cosma-footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
    .cosma-navigation { flex-basis: 100%; margin-inline-start: 0; }
}