/*
Theme Name: Geopark
Description: Block theme for the Khanbogd–Shar Tsav Geopark site (MN/EN). Colours, fonts and sizes live in theme.json and can be changed in Appearance → Editor → Styles; this file only holds what theme.json cannot express: the header behaviour, the phone menu, the language switcher and the cards.
Version: 1.3.0
Requires at least: 6.7
Requires PHP: 7.4
Author: DEM
Text Domain: geopark
*/

/* Base (from Twenty Twenty-Five) */
a{text-decoration-thickness:1px;text-underline-offset:.1em}
:where(.wp-site-blocks *:focus){outline-width:2px;outline-style:solid}
h1,h2,h3,h4,h5,h6,blockquote,caption,figcaption,p{text-wrap:pretty}
.more-link{display:block}
:where(pre){overflow-x:auto}

/* Detail pages and pills (pill colours come from the Geopark Core plugin) */
.geosite-meta{gap:.75rem 1.25rem;align-items:center;margin-bottom:var(--wp--preset--spacing--40)}
.geosite-soum{font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--muted)}
.geosite-categories a{display:inline-block;padding:.15em .75em;border-radius:999px;border:1px solid transparent;text-decoration:none;font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--contrast);background:color-mix(in srgb,currentColor 10%,transparent)}
.geosite-categories a:hover{border-color:currentColor}
.geopark-sites-link,.geopark-map__link{font-size:var(--wp--preset--font-size--small)}
.geopark-sites-link{margin-bottom:var(--wp--preset--spacing--30)}
.geopark-sites-link a{text-decoration:none}
.geopark-map__link{margin-top:.5rem}
.geopark-map__coords{opacity:.6;margin-left:.5rem}
.wp-block-term-description{max-width:60ch;opacity:.85}

/* Cards */
.geosite-card{height:100%}
.geosite-card .wp-block-post-featured-image img{border-radius:12px}
.geosite-card .wp-block-post-title{margin-top:var(--wp--preset--spacing--20)}
.geosite-card .wp-block-post-title a{text-decoration:none}
.geosite-card .wp-block-post-excerpt__excerpt,.geosite-card .wp-block-post-date{font-size:var(--wp--preset--font-size--small)}
.geosite-card .wp-block-post-date{opacity:.7}
/* A news section with a single post shows it as one wide card. */
@media (min-width:782px){
	.home-section .wp-block-post-template:has(> li:only-child){display:block}
	.home-section .wp-block-post-template > li:only-child .geosite-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:1fr auto auto auto 1fr;column-gap:3rem;row-gap:.5rem}
	.home-section .wp-block-post-template > li:only-child .geosite-card > *{grid-column:2}
	.home-section .wp-block-post-template > li:only-child .geosite-card > .wp-block-post-featured-image{grid-column:1;grid-row:1 / -1;align-self:center;margin:0}
	.home-section .wp-block-post-template > li:only-child .geosite-card > .wp-block-post-date{grid-row:2}
	.home-section .wp-block-post-template > li:only-child .geosite-card > .wp-block-post-title{grid-row:3;margin:0}
	.home-section .wp-block-post-template > li:only-child .geosite-card > .wp-block-post-excerpt{grid-row:4}
	.home-section .wp-block-post-template > li:only-child .wp-block-post-featured-image img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto}
}

/* Home sections */
.home-section{padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)}
.home-section.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width:var(--wp--style--global--wide-size)}
.wp-block-cover.home-hero{min-height:70vh}
.has-overlay-header .home-hero .wp-block-cover__inner-container{padding-top:5rem}
.home-hero .wp-block-cover__inner-container > *{max-width:var(--wp--style--global--wide-size)}
.home-hero .wp-block-button__link{border-radius:999px;padding:.9rem 1.8rem;font-weight:600}
.home-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link{background:var(--wp--preset--color--accent);border-color:var(--wp--preset--color--accent);color:var(--wp--preset--color--base)}
.home-hero .is-style-outline .wp-block-button__link{background:color-mix(in srgb,var(--wp--preset--color--base) 12%,transparent);border:1px solid color-mix(in srgb,var(--wp--preset--color--base) 70%,transparent);color:var(--wp--preset--color--base);backdrop-filter:blur(4px)}
.home-hero .wp-block-button__link:hover{filter:brightness(1.08)}

/* Footer */
.site-footer a{color:inherit}
.site-footer a:where(:not(.wp-element-button)){text-decoration:none}
.site-footer a:where(:not(.wp-element-button)):hover{text-decoration:underline}
.wp-block-list.is-style-plain{list-style:none;padding-left:0}
.site-footer .wp-block-site-logo img{max-height:64px;width:auto}

/* Page hero (templates/page.html): featured image under a dark shade, kicker + title at the bottom left */
.wp-block-cover.page-hero{align-items:flex-end;padding-left:var(--wp--style--root--padding-left);padding-right:var(--wp--style--root--padding-right)}
.page-hero:not(:has(.wp-block-cover__image-background)){background-color:var(--wp--preset--color--forest)}
.page-hero .wp-block-cover__inner-container{padding-bottom:clamp(1.5rem,3vw,2.5rem)}
.page-hero .page-hero__kicker{margin:0 0 .75rem;font-family:var(--wp--preset--font-family--manrope);font-size:.6875rem;font-weight:700;letter-spacing:.22em;line-height:1.4;text-transform:uppercase;color:var(--wp--preset--color--sand)}
.page-hero .wp-block-post-title{margin:0}
/* Page without a featured image (functions.php adds .page-hero--band): compact dark band like the original site */
.wp-block-cover.page-hero--band{min-height:0;padding-top:1rem;padding-bottom:1rem;background:linear-gradient(to bottom,var(--wp--preset--color--contrast),color-mix(in srgb,var(--wp--preset--color--contrast) 88%,var(--wp--preset--color--accent)));--wp--preset--font-size--xx-large:1.25rem}
.page-hero--band .wp-block-cover__background{display:none}
.page-hero--band .wp-block-cover__inner-container{padding-bottom:0}
.page-hero--band .page-hero__kicker{margin-bottom:.125rem;font-size:.625rem;font-weight:600;letter-spacing:.2em}
.page-hero--band .wp-block-post-title{line-height:1.25}
@media (min-width:782px){
	.wp-block-cover.page-hero--band{padding-top:2rem;padding-bottom:2rem;--wp--preset--font-size--xx-large:1.875rem}
	.page-hero--band .page-hero__kicker{margin-bottom:.25rem;font-size:.6875rem}
}

/* Block styles (functions.php): Card, Kicker, Raised image */
.wp-block-group.is-style-card{position:relative;overflow:hidden;box-sizing:border-box;height:100%;padding:clamp(1.75rem,3vw,2.5rem);border:1px solid color-mix(in srgb,var(--wp--preset--color--accent) 20%,transparent);border-radius:24px;background:linear-gradient(to bottom right,var(--wp--preset--color--cream),var(--wp--preset--color--base))}
.wp-block-group.is-style-card::before{content:"";position:absolute;top:0;right:0;width:8rem;height:8rem;border-radius:50%;background:color-mix(in srgb,var(--wp--preset--color--accent) 10%,transparent);transform:translate(50%,-50%);pointer-events:none}
.wp-block-column + .wp-block-column > .wp-block-group.is-style-card::before{top:auto;right:auto;bottom:0;left:0;transform:translate(-50%,50%)}
.wp-block-group.is-style-card > *{position:relative}
.wp-block-group.is-style-card > p{font-size:var(--wp--preset--font-size--medium);line-height:1.75}
.is-style-kicker{display:flex;align-items:center;gap:.75rem;margin:0 0 1.25rem;font-family:var(--wp--preset--font-family--manrope);font-size:.75rem;font-weight:700;letter-spacing:.18em;line-height:1.3;text-transform:uppercase;color:var(--wp--preset--color--accent)}
.is-style-kicker::before{content:"";flex:0 0 1.5rem;height:2px;border-radius:2px;background:currentColor}
.wp-block-image.is-style-raised{max-width:28rem;margin-inline:auto}
.wp-block-image.is-style-raised img{border-radius:20px;background:var(--wp--preset--color--base);box-shadow:0 20px 25px -5px color-mix(in srgb,var(--wp--preset--color--contrast) 6%,transparent),0 8px 10px -6px color-mix(in srgb,var(--wp--preset--color--contrast) 5%,transparent)}

/* Language switcher: compact "MN | EN" */
.header-language-switcher{width:auto!important;flex:0 0 auto!important;min-width:0}
.header-language-switcher ul,ul.header-language-switcher{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:0}
.header-language-switcher li{margin:0;padding:0;display:flex;align-items:center}
.header-language-switcher li+li::before{content:"";width:1px;height:1em;background:currentColor;opacity:.25;margin:0 .35rem}
.header-language-switcher a{text-decoration:none;text-transform:uppercase;font-size:.8rem;letter-spacing:.08em;padding:.3rem .45rem;border-radius:6px;opacity:.55;line-height:1;white-space:nowrap}
.header-language-switcher a:hover{opacity:1}
.header-language-switcher li.current-lang a{opacity:1;font-weight:600;background:color-mix(in srgb,currentColor var(--geopark-chip,6%),transparent)}

/* Header: solid bar that stays on top while scrolling */
.site-header{background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast);border-bottom:1px solid color-mix(in srgb,var(--wp--preset--color--contrast) 8%,transparent)}
.wp-site-blocks > header.wp-block-template-part{position:sticky;top:0;z-index:50}
.admin-bar .wp-site-blocks > header.wp-block-template-part{top:var(--wp-admin--admin-bar--height,32px)}
.site-header .wp-block-site-logo img{max-height:56px;width:auto}
.site-header .wp-block-navigation-item__content{text-decoration:none}
.site-header .wp-block-navigation__submenu-container{min-width:16rem}
.site-header .wp-block-navigation__responsive-container-open{padding:.4rem;margin-right:.25rem}
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child){margin-bottom:3px}
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content{outline-offset:4px}
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content{outline-offset:0}
.wp-block-navigation .wp-block-navigation-submenu__toggle:focus{outline:none}
.wp-block-navigation .wp-block-navigation-submenu__toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:4px}

/* Front page: transparent header over the hero, solid after scrolling (body.is-scrolled from functions.php) */
.has-overlay-header .site-header{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;border-bottom:0;color:var(--wp--preset--color--base);--geopark-chip:18%;transition:background-color .25s ease,box-shadow .25s ease,color .25s ease}
.has-overlay-header.is-scrolled .site-header{background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast);--geopark-chip:8%;box-shadow:0 1px 0 color-mix(in srgb,var(--wp--preset--color--contrast) 8%,transparent),0 6px 24px color-mix(in srgb,var(--wp--preset--color--contrast) 6%,transparent)}
.admin-bar.has-overlay-header .site-header{top:var(--wp-admin--admin-bar--height,32px)}
.has-overlay-header .site-header .wp-block-navigation__responsive-container.is-menu-open{background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast)}
.logo-swap .logo-swap__dark,.has-overlay-header.is-scrolled .logo-swap .logo-swap__light{display:none}
.has-overlay-header.is-scrolled .logo-swap .logo-swap__dark{display:inline-block}

/* Desktop: one-line menu, dropdowns as cards */
@media (min-width:1024px){
	.site-header .wp-block-navigation{flex-shrink:0}
	.site-header .wp-block-navigation__container{flex-wrap:nowrap}
	.site-header .wp-block-navigation__submenu-container{border:0;border-radius:14px;box-shadow:0 14px 40px color-mix(in srgb,var(--wp--preset--color--contrast) 14%,transparent);padding:.5rem;min-width:18rem;margin-top:.5rem;background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast)}
	.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content{padding:.65rem .9rem;border-radius:9px;white-space:nowrap;line-height:1.25}
	.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{background:color-mix(in srgb,currentColor 5%,transparent)}
}

/* Phones and tablets: hamburger + full-screen menu with grouped sections */
@media (max-width:1023px){
	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}
	.site-header .wp-block-navigation__responsive-container-open{display:flex}
	.site-header .wp-block-navigation{order:2}
	.header-language-switcher{order:1}
	.header-language-switcher,.header-language-switcher ul{width:auto}
	.site-header .is-menu-open{padding:1.25rem 1.5rem 2.5rem}
	.site-header .is-menu-open :is(.items-justified-right,.wp-block-navigation__container,.wp-block-navigation__submenu-container){--navigation-layout-justification-setting:flex-start;--navigation-layout-justify:flex-start;align-items:stretch;gap:0}
	.site-header .is-menu-open .wp-block-navigation-item{align-items:stretch;width:100%;text-align:left}
	.site-header .is-menu-open .wp-block-navigation-item__content{text-align:left}
	.site-header .is-menu-open .wp-block-navigation__container > .has-child{margin-top:1.25rem}
	.site-header .is-menu-open .wp-block-navigation__container > .has-child > :is(.wp-block-navigation-item__content,button){font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.55;padding:0 0 .35rem;pointer-events:none;font-weight:600}
	.site-header .is-menu-open .has-child > .wp-block-navigation__submenu-icon{display:none}
	.site-header .is-menu-open .wp-block-navigation__submenu-container{padding-left:.9rem;margin:0;border-left:2px solid color-mix(in srgb,currentColor 15%,transparent)}
	.site-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{display:block;padding:.6rem 0;font-size:1.05rem;line-height:1.3}
	.site-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.has-child) > .wp-block-navigation-item__content{display:block;padding:.75rem 0;margin-top:1rem;font-size:1.05rem;font-weight:600;border-top:1px solid color-mix(in srgb,currentColor 8%,transparent)}
	.site-header .is-menu-open .wp-block-navigation-item__content:focus{outline:none}
	.site-header .is-menu-open .wp-block-navigation-item__content:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:4px}
	.site-header .is-menu-open .wp-block-navigation__responsive-container-close{padding:.5rem}
}
@media (max-width:600px){
	.admin-bar .wp-site-blocks > header.wp-block-template-part,.admin-bar.has-overlay-header.is-scrolled .site-header{top:0}
}
@media (max-width:599px){
	.site-header .wp-block-site-logo img{max-width:140px;max-height:40px}
	.site-header .wp-block-group.alignwide,.site-header .wp-block-group.alignwide > .wp-block-group{gap:.5rem}
}
