/*
Theme Name: Meridian
Author: dmarkdevin
Description: An architectural block theme for Meridian Crest Properties, a fictional Metro Manila brokerage. Paper and stone with ink text and a deep petrol accent; full-bleed photography and a property search front and centre. Self-hosted Archivo in normal and expanded widths. Pair with the Meridian Core plugin for listings, search and the viewing form.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: meridian
Tags: full-site-editing, block-patterns, block-styles, one-column, wide-blocks, custom-colors, custom-menu, editor-style, translation-ready
*/

/* Only what theme.json cannot express. Mobile first. */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px; }
.skip-link.screen-reader-text:focus { background: var(--wp--preset--color--ink); color: #fff; }
img { height: auto; }
.wp-site-blocks > main, .wp-site-blocks > footer { margin-block-start: 0; }
h1, h2, .mr-display { font-stretch: 112%; }

/* Header. */
.mr-header { position: sticky; top: 0; z-index: 50; background: var(--wp--preset--color--base); border-bottom: 1px solid var(--wp--preset--color--line); }
.admin-bar .mr-header { top: var(--wp-admin--admin-bar--height, 0); }
.mr-header .wp-block-site-logo { flex-shrink: 0; }
.mr-header .wp-block-site-logo img { display: block; }
.mr-header .wp-block-button__link, .mr-header .wp-block-site-title { white-space: nowrap; }
.mr-header .wp-block-site-title { font-stretch: 118%; }
.wp-block-navigation .wp-block-navigation-item__content { padding-block: .25rem; border-bottom: 2px solid transparent; }
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--wp--preset--color--accent); }
.wp-block-navigation__responsive-container.is-menu-open { padding: var(--wp--preset--spacing--50); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 2rem; font-weight: 700; font-stretch: 112%; }
@media (max-width: 781px) { .mr-hide-mobile { display: none !important; } .mr-header .wp-block-button__link { padding: .6rem .9rem !important; font-size: .875rem; } }
@media (max-width: 479px) { .mr-header .wp-block-site-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }
@media (min-width: 600px) and (max-width: 1023px) {
	.mr-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.mr-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* Outline button. */
.wp-block-button.is-style-outline > .wp-block-button__link { border: 1.5px solid currentColor; background: transparent; color: var(--wp--preset--color--ink); padding: calc(.95rem - 1.5px) calc(1.6rem - 1.5px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--ink); color: #fff; border-color: var(--wp--preset--color--ink); }

/* Hero: photo with a bottom-up dark wash; the search bar overlaps the bottom edge. */
.mr-hero .wp-block-cover__background { background: linear-gradient(0deg, rgba(22,25,27,.82) 0%, rgba(22,25,27,.25) 60%, rgba(22,25,27,.15) 100%) !important; opacity: 1 !important; }
.mr-search-band { margin-top: calc(-1 * var(--wp--preset--spacing--70)) !important; position: relative; z-index: 2; }

/* Image ratios. */
.mr-ratio-tall img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.mr-ratio-wide img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
.mr-agent img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; width: 100%; }

/* Figures with a number and a short label. */
.mr-figures { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem 2rem; margin: 0; padding: 0; list-style: none; }
.mr-figures li { border-top: 1px solid var(--wp--preset--color--line); padding-top: .9rem; color: var(--wp--preset--color--muted); }
.mr-figures strong { display: block; font-size: 2.25rem; line-height: 1.1; font-weight: 700; font-stretch: 118%; color: var(--wp--preset--color--ink); }

/* Agent cards. */
.mr-agent-name { margin-top: .9rem !important; }
.mr-agent-role { color: var(--wp--preset--color--muted); }

/* Post cards. */
.wp-block-post-featured-image { overflow: hidden; }

/* Forms (Fluent Forms): underline fields, square button. */
.fluentform .ff-el-input--label label { font-weight: 600; font-size: .9375rem; color: var(--wp--preset--color--ink); }
.fluentform .ff-el-form-control { border: 1px solid var(--wp--preset--color--line); border-radius: 0; background: #fff; font: inherit; padding: .75rem .9rem; color: var(--wp--preset--color--ink); }
.fluentform .ff-el-form-control:focus { border-color: var(--wp--preset--color--accent); box-shadow: none; }
.fluentform .ff-el-is-required.asterisk-right label::after { color: var(--wp--preset--color--accent); }
.fluentform .ff-btn-submit { background-color: var(--wp--preset--color--ink) !important; color: #fff !important; border-radius: 0 !important; padding: .95rem 1.75rem !important; font: 600 .9375rem/1.2 var(--wp--preset--font-family--body) !important; }
.fluentform .ff-btn-submit:hover { background-color: var(--wp--preset--color--accent) !important; opacity: 1 !important; }

/* Footer. */
.mr-footer a { color: inherit; }
.mr-footer h2, .mr-footer h3 { color: var(--wp--preset--color--soft); }
.mr-footer__small { color: var(--wp--preset--color--soft); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}