/*
Theme Name: Hossein Farmani — One Page
Theme URI: https://farmani.com
Author: Farmani
Description: A single-page editorial block theme for farmani.com. The whole homepage is ordinary blocks on one page, so every heading, paragraph, photo and section can be edited, reordered or duplicated in the WordPress visual editor.
Version: 5.2.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: farmani
*/

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(.wp-site-blocks) [id] { scroll-margin-top: 84px; }
::selection { background: var(--wp--preset--color--brass-light); color: var(--wp--preset--color--ink); }
:focus-visible { outline: 2px solid var(--wp--preset--color--brass); outline-offset: 3px; }

/* Header */
.farmani-header { z-index: 50; }
.farmani-header .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem clamp(1rem, 5vw, 4rem); }
.farmani-header .is-menu-open .wp-block-navigation__container { gap: 1.1rem; font-size: 0.9rem; }
.farmani-header .farmani-wordmark { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; margin: 0; white-space: nowrap; }
.farmani-header .farmani-wordmark a { text-decoration: none; }
.farmani-header .wp-block-navigation a { text-decoration: none; }
.farmani-header .wp-block-navigation a:hover { color: var(--wp--preset--color--brass); }

/* Block style: Eyebrow (paragraph) */
.is-style-eyebrow { font-size: var(--wp--preset--font-size--x-small) !important; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; line-height: 1.6; color: var(--wp--preset--color--brass); }
.has-charcoal-background-color .is-style-eyebrow,
.has-ink-background-color .is-style-eyebrow { color: var(--wp--preset--color--brass-light); }

/* Block style: Lede (paragraph) */
.is-style-lede { font-family: var(--wp--preset--font-family--serif); font-style: italic; font-size: var(--wp--preset--font-size--large); line-height: 1.3; }

/* Block style: Ruled list */
.wp-block-list.is-style-ruled { list-style: none; padding-left: 0; border-top: 1px solid currentColor; border-top-color: color-mix(in srgb, currentColor 22%, transparent); }
.wp-block-list.is-style-ruled > li { padding: 0.9em 0; border-bottom: 1px solid color-mix(in srgb, currentColor 22%, transparent); margin: 0; }
.wp-block-list.is-style-ruled > li strong { font-weight: 500; }

/* Block style: Timeline (table) */
.wp-block-table.is-style-timeline table { border-collapse: collapse; width: 100%; }
.wp-block-table.is-style-timeline td { border: 0; border-top: 1px solid var(--wp--preset--color--line); padding: 1.1em 0; vertical-align: baseline; }
.wp-block-table.is-style-timeline tr:last-child td { border-bottom: 1px solid var(--wp--preset--color--line); }
.wp-block-table.is-style-timeline td:first-child { width: 7.5rem; font-family: var(--wp--preset--font-family--serif); font-size: 2rem; line-height: 1; color: var(--wp--preset--color--brass); padding-right: 1.5rem; }
@media (max-width: 600px) { .wp-block-table.is-style-timeline td:first-child { width: 4.5rem; font-size: 1.5rem; } }

/* Block style: Clipping (image) — press scans */
.wp-block-image.is-style-clipping img { background: #fff; padding: 10px; box-shadow: 0 1px 2px rgba(22,21,20,.08), 0 14px 34px -12px rgba(22,21,20,.28); }

/* Facts strip */
.farmani-facts .wp-block-heading { font-size: clamp(2.75rem, 5vw, 4.25rem); line-height: 1; color: var(--wp--preset--color--brass); }
.farmani-facts p { margin-top: 0.6rem; }

/* Pull quote */
.wp-block-quote.is-style-pull { margin: 0; }
.wp-block-quote.is-style-pull p::before { content: "\201C"; }
.wp-block-quote.is-style-pull p::after { content: "\201D"; }
.wp-block-quote cite { display: block; margin-top: 1.25rem; font-family: var(--wp--preset--font-family--sans); font-style: normal; font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.2em; text-transform: uppercase; opacity: .75; }

/* Section numbering rule */
.farmani-section-head { border-top: 1px solid color-mix(in srgb, currentColor 22%, transparent); padding-top: 1.25rem; }

/* Images */
.wp-block-image img { display: block; }
.wp-block-image.is-style-portrait img { filter: grayscale(0.15) contrast(1.02); }

/* Outline button on dark */
.has-charcoal-background-color .wp-block-button.is-style-outline .wp-block-button__link,
.has-ink-background-color .wp-block-button.is-style-outline .wp-block-button__link { color: var(--wp--preset--color--paper); border-color: color-mix(in srgb, var(--wp--preset--color--paper) 55%, transparent); background: transparent; }
.has-charcoal-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.has-ink-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--paper); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--brass); border-color: var(--wp--preset--color--brass); color: var(--wp--preset--color--paper); }

/* Dark sections: soften link underlines */
.has-charcoal-background-color a, .has-ink-background-color a { text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); text-underline-offset: 0.2em; }

/* Hero */
.farmani-hero .wp-block-image img { width: 100%; height: 100%; max-height: 88vh; object-fit: cover; object-position: center top; }
@media (max-width: 781px) {
	.farmani-hero .wp-block-image img { max-height: 70vh; }
	.farmani-hero .wp-block-columns { flex-direction: column-reverse; }
}

/* Footer */
.farmani-footer a { text-decoration: none; }

/* Sections butt together; no gap before the footer */
.wp-site-blocks > footer, .wp-site-blocks > main { margin-block-start: 0; }
.wp-site-blocks > main + * { margin-block-start: 0; }
.wp-block-quote.is-style-pull { margin-top: var(--wp--preset--spacing--50); }

/* Historical archive */
.farmani-archive-list .wp-block-post-template { list-style: none; padding: 0; margin-top: var(--wp--preset--spacing--50); border-top: 1px solid var(--wp--preset--color--line); }
.farmani-archive-list .wp-block-post-template > li { margin: 0; padding: .7em 0; border-bottom: 1px solid var(--wp--preset--color--line); }
.farmani-archive-list .wp-block-post-title { font-family: var(--wp--preset--font-family--sans); line-height: 1.4; letter-spacing: 0; }
.farmani-archive-list .wp-block-post-title a { text-decoration: none; }
.farmani-archive-list .wp-block-post-title a:hover { color: var(--wp--preset--color--brass); }
.farmani-legacy { background: #fff; padding: clamp(1rem, 3vw, 2rem); border: 1px solid var(--wp--preset--color--line); overflow-x: auto; font-size: var(--wp--preset--font-size--small); }
.farmani-legacy * { color: var(--wp--preset--color--ink) !important; font-family: inherit !important; }
.farmani-legacy a { color: var(--wp--preset--color--brass) !important; }
.farmani-legacy img { max-width: 100%; height: auto; }
.farmani-legacy table { max-width: 100%; }

/* Catalogues */
.wp-block-file { padding: 1rem 0 1.25rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.wp-block-file .wp-block-file__embed { margin-bottom: 1rem; border: 1px solid var(--wp--preset--color--line); background: #fff; }
.wp-block-file > a:not(.wp-block-file__button) { font-family: var(--wp--preset--font-family--serif); font-size: 1.5rem; text-decoration: none; margin-right: 1rem; }
.wp-block-file .wp-block-file__button { font-size: var(--wp--preset--font-size--x-small); padding: .8em 1.5em; }

/* Never split words inside headings; size the hero name to its column */
h1, h2, h3, .wp-block-heading { overflow-wrap: normal; word-break: normal; hyphens: manual; }
.farmani-hero h1.wp-block-heading { font-size: clamp(3.25rem, 7.4vw, 7.25rem); line-height: 0.92; }
@media (max-width: 781px) { .farmani-hero h1.wp-block-heading { font-size: clamp(3.25rem, 17vw, 6rem); } }

/* Medium screens: use the menu button instead of a wrapping two-row menu */
@media (min-width: 600px) and (max-width: 1099px) {
	.farmani-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.farmani-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}