/*
Theme Name: Mistyriouz
Theme URI: https://mistyriouz.com
Author: Mistyriouz
Description: Minimal dark block theme for Mistyriouz. Neutral canvas for the Town Pages and Route Advisor plugins. Deep forest palette, lime accent, Fraunces + Inter + JetBrains Mono.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: mistyriouz
*/

/* ===== BASE ===== */
html{scroll-behavior:smooth}
body{padding-top:64px}
body::before{content:"";position:fixed;inset:0;z-index:-1;opacity:.03;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
::selection{background:var(--wp--preset--color--accent);color:#0f1a15}
:focus-visible{outline:2px solid var(--wp--preset--color--accent);outline-offset:3px;border-radius:4px}
.hero-title em{color:var(--wp--preset--color--accent);font-style:italic}

/* ===== HEADER ===== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;height:64px;background:rgba(15,26,21,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{max-width:1240px;margin:0 auto;padding:0 1.5rem;height:64px;align-items:center}
.logo img{border-radius:50%}
.logo-text{font-family:var(--wp--preset--font-family--heading);font-weight:700;font-size:1.25rem;margin:0}
.logo-text a{color:var(--wp--preset--color--text)}
.nav-desktop{display:none}
.nav-desktop ul{gap:2rem}
.nav-desktop li a{color:var(--wp--preset--color--soft);font-weight:500;font-size:15px}
.nav-desktop li a:hover,.nav-desktop li a[aria-current]{color:var(--wp--preset--color--accent)}
@media(min-width:768px){.nav-desktop{display:flex}}

/* ===== LISTINGS PILLS ===== */
.listings-strip{margin-top:-2.25rem;position:relative;z-index:10}
.pills{background:rgba(26,51,45,.65);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.4rem;overflow-x:auto}
.pills ul{flex-wrap:nowrap;gap:.4rem}
.pills li a{border-radius:999px;padding:.55rem 1.1rem;color:var(--wp--preset--color--soft);font-weight:500;white-space:nowrap;font-size:14px}
.pills li a:hover{background:var(--wp--preset--color--accent);color:#0f1a15}

/* ===== SECTIONS & TOWNS ===== */
.section{padding:5rem 0}
.section-head{text-align:center;margin-bottom:3rem}
.eyebrow{font-family:var(--wp--preset--font-family--mono);color:var(--wp--preset--color--accent);text-transform:uppercase;letter-spacing:.12em;font-size:13px;font-weight:600}
.towns-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.town-card{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--wp--preset--color--surface);transition:transform .25s,box-shadow .25s}
.town-card:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.town-card .wp-block-image{position:absolute;inset:0;margin:0}
.town-card .wp-block-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.town-card:hover .wp-block-image img{transform:scale(1.05)}
.town-card-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem;background:linear-gradient(to top,rgba(15,26,21,.92),rgba(15,26,21,.15) 60%,transparent)}
.town-card-overlay h3{font-size:1.6rem;margin:0}
.town-card-overlay h3 a{color:var(--wp--preset--color--text)}
.town-card-overlay h3 a::after{content:"";position:absolute;inset:0}
.town-card-overlay p{margin:.25rem 0 0;font-size:.95rem;color:var(--wp--preset--color--soft)}

/* ===== BLOG CARDS ===== */
.stories-grid .wp-block-post-template{gap:1.5rem}
.blog-card{background:var(--wp--preset--color--surface);border:1px solid var(--wp--preset--color--line);border-radius:14px;overflow:hidden;height:100%}
.blog-card .wp-block-post-featured-image img{width:100%;aspect-ratio:16/10;object-fit:cover}
.blog-body{padding:1.25rem}
.blog-body .wp-block-post-title{font-size:1.25rem}
.blog-body .wp-block-post-title a{color:var(--wp--preset--color--text)}
.blog-body .wp-block-post-excerpt{font-size:.9rem;color:var(--wp--preset--color--soft)}
.blog-body .wp-block-post-date{color:var(--wp--preset--color--dim);font-size:12px}

/* ===== PAGES & POSTS ===== */
.page-main,.single-main{padding:4.5rem 0 5rem}
.single-main .wp-block-post-featured-image{margin:2.5rem 0}
.single-main .wp-block-post-featured-image img{border-radius:16px}
.post-meta{color:var(--wp--preset--color--dim);font-size:13px;font-family:var(--wp--preset--font-family--mono)}

/* ===== BUTTONS ===== */
.wp-block-button__link:hover{background:var(--wp--preset--color--accent-bright)!important}
.wp-block-button.is-style-outline .wp-block-button__link{background:transparent!important;border:2px solid var(--wp--preset--color--accent);color:var(--wp--preset--color--accent)!important}
.wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--wp--preset--color--accent)!important;color:#0f1a15!important}

/* ===== FOOTER ===== */
.site-footer{background:var(--wp--preset--color--surface);border-top:1px solid rgba(255,255,255,.08);padding:4rem 0 2rem;margin-top:4rem}
.footer-grid{gap:3rem}
.site-footer .wp-block-heading{font-size:1rem;font-family:var(--wp--preset--font-family--body);font-weight:600}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.6rem}
.site-footer li a{color:var(--wp--preset--color--soft);font-size:.95rem}
.site-footer li a:hover{color:var(--wp--preset--color--accent)}
.footer-bottom{text-align:center;color:var(--wp--preset--color--dim);font-size:.9rem;border-top:1px solid rgba(255,255,255,.08);padding-top:2rem;margin-top:2.5rem}

/* ===== BOTTOM NAV (mobile) ===== */
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:99;background:rgba(26,51,45,.98);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.08);padding:.4rem 0;box-shadow:0 -4px 12px rgba(0,0,0,.3)}
.bottom-nav ul{width:100%;justify-content:space-around}
.bottom-nav li a{flex-direction:column;gap:.2rem;font-size:11px;color:var(--wp--preset--color--dim);min-width:48px;padding:.4rem .5rem}
.bottom-nav li a::before{font-size:20px;line-height:1}
.bottom-nav li:nth-child(1) a::before{content:"🏠"}
.bottom-nav li:nth-child(2) a::before{content:"🏔️"}
.bottom-nav li:nth-child(3) a::before{content:"📍"}
.bottom-nav li:nth-child(4) a::before{content:"🗺️"}
.bottom-nav li:nth-child(5) a::before{content:"✍️"}
.bottom-nav li:nth-child(6) a::before{content:"✉️"}
.bottom-nav li a:hover,.bottom-nav li a[aria-current]{color:var(--wp--preset--color--accent)}
@media(min-width:768px){.bottom-nav{display:none}}
@media(max-width:767px){body{padding-bottom:76px}.footer-grid{gap:2rem}}

/* ===== 404 ===== */
.error-main{padding:6rem 0;text-align:center}

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