/*
Theme Name: gothic
Theme URI: https://opencollective.com/blankslate
Author: Web Guy
Author URI: https://opencollective.com/blankslate#section-contributors
Description: Donate: https://opencollective.com/blankslate. Learn: https://blankslate.me/. BlankSlate is the definitive WordPress boilerplate starter theme. I've carefully constructed the most clean and minimalist theme possible for designers and developers to use as a base to build websites for clients or to build completely custom themes from scratch. Clean, simple, unstyled, semi-minified, unformatted, and valid code, SEO-friendly, jQuery-enabled, no programmer comments, standardized and as white label as possible, and most importantly, the CSS is reset for cross-browser-compatability, with no intrusive visual CSS styles added whatsoever. A perfect skeleton theme. For support and suggestions, go to: https://github.com/webguyio/blankslate/issues. Thank you.
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 1.0.25
Requires at least: 5.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: gothic

BlankSlate WordPress Theme 2011-2026
BlankSlate is distributed under the terms of the GNU GPL
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{appearance:none;border-radius:0}input[type="search"]{appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}
/* =============================
   gothic theme styles
   ============================= */
:root{
  --bg:#0b0b0f;
  --bg2:#0f0f16;
  --card:#121220;
  --text:#e9e9ef;
  --muted:#a8a8b7;
  --border:rgba(255,255,255,.10);
  --accent:#de1f3c;
  --accent2:#ff4d66;
  --shadow: 0 18px 50px rgba(0,0,0,.55);
  --radius: 18px;
  --serif: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Garamond, Georgia, serif;
  --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --max: 1100px;
}

/* Hint UA (incl. iOS Safari) that this site is dark-themed */
html{background:var(--bg);color-scheme:dark}
body{
  background: radial-gradient(1200px 600px at 20% -10%, rgba(222,31,60,.22), transparent 60%),
              radial-gradient(900px 500px at 90% 0%, rgba(255,77,102,.10), transparent 55%),
              linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
  color:var(--text);
  font-family: var(--sans);
  line-height:1.6;
}

/* Dramatic gothic atmosphere (pure CSS, no external assets) */
#wrapper{position:relative;isolation:isolate}
#wrapper:before{
  content:"";
  position:fixed;
  inset:-20vh -20vw;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(900px 500px at 70% 10%, rgba(222,31,60,.22), transparent 60%),
    radial-gradient(800px 520px at 10% 20%, rgba(255,77,102,.12), transparent 62%),
    radial-gradient(900px 700px at 50% 110%, rgba(0,0,0,.75), transparent 55%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0, rgba(255,255,255,.03) 1px, transparent 1px, transparent 6px);
  opacity:.9;
  filter:contrast(115%) saturate(120%);
}

h1,h2,h3,h4,h5,h6{
  font-family:var(--serif);
  letter-spacing:.04em;
}
h1,h2{ text-transform:uppercase }
.site-title a,
.entry-title a{
  text-shadow: 0 0 18px rgba(222,31,60,.18);
}

#wrapper{min-height:100vh;display:flex;flex-direction:column}
#container{flex:1;width:100%}

a{color:var(--text);text-decoration:none}
a:hover{color:var(--accent)}

/* Layout */
#container{padding:28px 18px 60px}
#content{width:100%}
/* Match the content width to the header/nav content width */
#container{
  display:flex;
  max-width:var(--max);
  margin:0 auto;
}
#container > main{
  flex:1;
  min-width:0;
}
#sidebar{
  width:280px;
  margin-left:22px;
}

@media (max-width: 1024px){
  #container{flex-direction:column;align-items:stretch}
  #sidebar{width:100%;margin:22px 0 0}
}

/* Header / Nav */
#header{
  position:sticky;
  top:0;
  z-index:999;
  border-bottom:1px solid var(--border);
  background: rgba(11,11,15,.78);
  backdrop-filter: blur(16px);
}

#branding{max-width:var(--max);margin:0 auto;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px}

#site-title h1,#site-title{font-size:0;line-height:0}
.site-brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.site-brand .custom-logo{height:44px;width:auto;display:block}
.site-brand .site-name{font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--text);opacity:.9}
.site-brand .site-name:hover{color:var(--accent)}

#site-description{display:none}

#menu{max-width:none;margin:0;padding:0;display:flex;align-items:center;justify-content:flex-start;gap:14px}

#menu .menu{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin:0;
  padding:0;
}

#menu .menu a{
  display:inline-flex;
  align-items:center;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid transparent;
  color:var(--text);
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
#menu .menu a:hover{border-color:rgba(222,31,60,.45);background:rgba(222,31,60,.12);color:var(--text)}
#menu .current-menu-item > a,
#menu .current_page_item > a{border-color:rgba(222,31,60,.65);background:rgba(222,31,60,.16)}

#search{min-width:220px}

/* Hamburger (shown on smaller screens when the menu collapses)
   NOTE: bars must stack vertically (flex-direction:column) to avoid a “squashed” icon. */
.nav-toggle{
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  background:transparent;
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px;
  cursor:pointer;
}
.nav-toggle__bar{display:block;width:22px;height:2px;background:rgba(233,233,239,.85);border-radius:999px}

/* WP search forms often wrap the input in a <label>. Make the label stretch
   so the search input can truly take the full available width. */
#search form{display:flex;align-items:center;gap:8px;width:100%}
#search form label{flex:1 1 auto;width:100%;min-width:0}
#search input[type="search"]{
  display:block;
  width:100%;
  min-width:0;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
}
#search input[type="search"]::placeholder{color:rgba(233,233,239,.55)}
/* Bring back the button (keeps the nice hover effect). */
#search input[type="submit"]{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:999px;border:1px solid rgba(222,31,60,.35);background:rgba(222,31,60,.12);color:var(--text);cursor:pointer;line-height:1;transition:transform .12s ease, background .12s ease, border-color .12s ease}
#search input[type="submit"]:hover{border-color:rgba(222,31,60,.6);background:rgba(222,31,60,.18);transform:translateY(-1px)}
#search input[type="submit"]:active{transform:translateY(0)}

/* Collapse the menu sooner to prevent overflow on wider-but-not-wide-enough screens.
   IMPORTANT: Keep the *same layout/behavior as mobile*, just triggered earlier.
   Layout (collapsed):
     Row 1: logo (left) + hamburger (right)
     Row 2: search (full width)
     Row 3: menu (full width, toggled by hamburger)
*/
@media (max-width: 1400px){
  .header-inner{flex-wrap:wrap;height:auto;padding:10px 18px}

  /* When collapsed, stop being sticky so the expanded menu pushes content down */
  #header{position:static;top:auto}

  /* Row 1 */
  .site-brand{order:1}
  .nav-toggle{display:inline-flex;order:2;margin-left:auto}

  /* Row 2 (toggle) */
  #menu{width:100%;order:3;display:none}
  #header.is-nav-open #menu{display:flex}

  /* Row 3 */
  .header-tools{order:4;width:100%;flex:1 1 100%;margin-left:0;min-width:unset}

  /* Collapsed menu styling (same as mobile) */
  #menu .menu{flex-direction:column;align-items:center;width:100%}
  #menu .menu a{justify-content:center;text-align:center;width:100%}

  /* Full-width search (label wrapper must stretch) */
  #search{width:100%;min-width:unset}
  #search form{width:100%}
  #search form label{flex:1 1 100%;width:100%;min-width:0}
  #search input[type="search"]{flex:1 1 100%;width:100%;min-width:0}
}

/* Keep nav/search stacked from tablet down */
@media (max-width: 1024px){
  /* Stop the top navbar from being sticky once it wraps (prevents it from
     covering too much viewport height on small screens). */
  #header{position:static;top:auto}
  #search{min-width:unset;width:100%}
  #search form{width:100%}
  #search form label{flex:1 1 100%;width:100%}
  #search input[type="search"]{flex:1 1 100%;width:100%}
}

/* Tablet and below: when the search bar becomes its own row, let the header
   scroll with the page (avoid the header occupying too much viewport height). */
@media (max-width: 1024px){
  #header{position:static;top:auto}
}

/* Comments: keep the submit button from sticking to the textarea */
.comment-respond .comment-form{display:flex;flex-direction:column;gap:10px}
.comment-respond .comment-form-comment textarea{display:block;width:100%}
.comment-respond p.form-submit{margin-top:10px;clear:both}

/* Slider (front page only) */
.gothic-hero{max-width:var(--max);margin:18px auto 0;padding:0 18px}
.gothic-slider{
  position:relative;
  border-radius: calc(var(--radius) + 6px);
  overflow:hidden;
  box-shadow: var(--shadow);
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.gothic-slide{
  display:none;
  display:block;
  width:100%;
  min-width:100%;
}
.gothic-slide.is-active{display:block}
.gothic-slide img{width:100%;height:auto;display:block;aspect-ratio: 2428 / 885;object-fit:cover}

.gothic-slider .gothic-dots{
  position:absolute;
  left:16px;
  bottom:14px;
  display:flex;
  gap:8px;
}
.gothic-slider .gothic-dot{
  width:10px;height:10px;border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.12);
  cursor:pointer;
}
.gothic-slider .gothic-dot.is-active{background:var(--accent);border-color:rgba(222,31,60,.95)}

.gothic-slider .gothic-overlay{
  position:absolute;inset:0;
  background: radial-gradient(700px 260px at 10% 100%, rgba(222,31,60,.20), transparent 65%),
              linear-gradient(90deg, rgba(0,0,0,.35), transparent 60%);
  pointer-events:none;
}

/* Content */
article{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);box-shadow:0 10px 30px rgba(0,0,0,.35);padding:22px}
article + article{margin-top:18px}

.entry-title{font-size:28px;line-height:1.15;letter-spacing:.02em;margin-bottom:10px}
.entry-title a{color:var(--text)}
.entry-title a:hover{color:var(--accent)}

.entry-content{color:rgba(233,233,239,.92)}
.entry-content p{margin:12px 0}
.entry-content h2{font-size:22px;margin:20px 0 10px}
.entry-content h3{font-size:18px;margin:18px 0 10px}
.entry-content ul{list-style:disc;margin:10px 0 10px 22px}
.entry-content ol{list-style:decimal;margin:10px 0 10px 22px}
.entry-content blockquote{border-left:3px solid rgba(222,31,60,.65);padding:10px 14px;margin:14px 0;background:rgba(222,31,60,.08);border-radius:12px}

.entry-content img{max-width:100%;height:auto;border-radius:14px;border:1px solid rgba(255,255,255,.10)}

/* Responsive embeds (videos) */
.entry-content iframe,
.entry-content video,
.entry-content embed,
.entry-content object{max-width:100%}
.wp-block-embed__wrapper,
.wp-block-video,
.wp-block-embed{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.10)}

/* Sidebar */
#sidebar .widget-area{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:18px;position:sticky;top:96px}
#sidebar .widget{margin-bottom:18px}
#sidebar .widget:last-child{margin-bottom:0}
#sidebar h2{font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px;color:rgba(233,233,239,.86)}
#sidebar a{color:rgba(233,233,239,.88)}
#sidebar a:hover{color:var(--accent)}

/* Footer */
#footer{margin-top:auto;border-top:1px solid var(--border);background:rgba(11,11,15,.85)}
#footer .footer-inner{max-width:var(--max);margin:0 auto;padding:34px 18px;min-height:140px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
#footer .footer-nav .menu{display:flex;flex-wrap:wrap;gap:10px}
#footer .footer-nav .menu a{padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03)}
#footer .footer-nav .menu a:hover{border-color:rgba(222,31,60,.45);background:rgba(222,31,60,.10)}
#copyright{color:rgba(233,233,239,.65);font-size:13px}

/* Forms */
input,textarea,select{color:var(--text)}
input[type="text"],input[type="email"],input[type="url"],input[type="password"],textarea{
  display:block;
  width:100%;
  min-width:100%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}
button,input[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(222,31,60,.55);
  background:rgba(222,31,60,.14);
  color:var(--text);
  cursor:pointer;
  box-shadow: 0 0 0 1px rgba(222,31,60,.10), 0 14px 34px rgba(0,0,0,.45);
}
button:hover,input[type="submit"]:hover{background:rgba(222,31,60,.22);box-shadow:0 0 0 1px rgba(222,31,60,.18), 0 18px 46px rgba(222,31,60,.18)}


/* Header layout */
.header-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:0 18px;
  display:flex;
  align-items:center;
  gap:16px;
  height:100px;
}
#header{
  top:0;
  z-index:40;
  background:rgba(11,11,15,.72);
  backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid var(--border);
}
.site-brand{display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;min-width:0;height:100%;gap:16px}
/* Logo should run from the first pixel to the last pixel of the 100px navbar */
.logo-link{display:block;height:100%;margin:0;padding:0;line-height:0;flex:0 0 auto}
/* WordPress outputs the custom logo inside an <a class="custom-logo-link"> */
.custom-logo-link{display:block;height:100%;margin:0;padding:0;line-height:0}
.custom-logo{display:block;height:100%;width:auto;max-width:none;margin:0;padding:0}
/* Override any earlier starter-theme sizing rules */
.site-brand .custom-logo{height:100%;width:auto;max-width:none;margin:0;padding:0}
.site-brand .custom-logo-link{height:100%;margin:0;padding:0;line-height:0}
.logo-link img{display:block;height:100%;width:auto;max-width:none;margin:0;padding:0}

/* Only tagline is shown (no site title) */
.brand-tagline{display:inline-flex;align-items:center;align-self:center;color:rgba(233,233,239,.75);font-size:12px;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55vw}

.top-nav{margin-left:0;display:flex;align-items:center;flex:1 1 auto;justify-content:center}
.top-nav ul{display:flex;align-items:center;gap:18px}
.top-nav a{display:inline-flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;color:var(--text);font-weight:700;letter-spacing:.08em;text-transform:uppercase;border:1px solid transparent}
.top-nav a:hover{background:rgba(222,31,60,.10);border-color:rgba(222,31,60,.45);box-shadow:0 0 0 1px rgba(222,31,60,.12), 0 12px 30px rgba(222,31,60,.12);color:var(--text)}
.top-nav .current-menu-item > a,
.top-nav .current_page_item > a{background:rgba(222,31,60,.18);border:1px solid rgba(222,31,60,.35)}

.header-tools{margin-left:auto;min-width:220px;display:flex;align-items:center}
.header-tools form{display:flex;align-items:center;gap:8px}
.header-tools form label{flex:1 1 auto;width:100%;min-width:0}
.header-tools input[type="search"]{padding:10px 12px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);line-height:1}
.header-tools input[type="submit"]{padding:10px 12px;border-radius:999px;line-height:1;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(222,31,60,.35);background:rgba(222,31,60,.12);color:var(--text);cursor:pointer;transition:transform .12s ease, background .12s ease, border-color .12s ease}
.header-tools input[type="submit"]:hover{border-color:rgba(222,31,60,.6);background:rgba(222,31,60,.18);transform:translateY(-1px)}
.header-tools input[type="submit"]:active{transform:translateY(0)}

/* Align menu links + search controls on the same vertical rhythm */
.top-nav a,
.header-tools input[type="search"],
.header-tools input[type="submit"]{min-height:44px}

/* NOTE: Responsive header behavior is handled by the consolidated
   @media (max-width: 1400px) rules earlier in the file.
   We intentionally avoid a separate “tablet layout” so tablet simply
   uses the same collapsed/mobile layout (just at an earlier breakpoint). */

/* Hero slider */
.hero-slider{max-width:var(--max);margin:16px auto 0;padding:0 18px;position:relative;display:block;width:100%}
.hero-slider__track{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow), 0 0 0 1px rgba(222,31,60,.10), 0 22px 60px rgba(222,31,60,.10);
  display:block;
  width:100%;
  /* Keep it simple: full content width with responsive height */
  height:clamp(240px, 30vw, 560px);
  background:rgba(255,255,255,.03);
}
.hero-slider__track > *{position:absolute;inset:0;width:100%;height:100%}
.hero-slider__track:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 420px at 50% 0%, rgba(222,31,60,.20), transparent 55%),
    radial-gradient(900px 520px at 50% 100%, rgba(0,0,0,.75), transparent 55%),
    linear-gradient(90deg, rgba(0,0,0,.55), transparent 20%, transparent 80%, rgba(0,0,0,.55));
}
.hero-slider__slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.hero-slider__slide:first-child{opacity:1}
.hero-slider__slide.is-active{opacity:1}
.hero-slider__slide img{width:100%;height:100%;object-fit:cover;display:block}
.hero-slider__btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:46px;height:46px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(10px);
}
.hero-slider__btn:before{
  content:"";
  display:block;
  width:10px;height:10px;
  border-top:2px solid var(--text);
  border-right:2px solid var(--text);
  margin:0 auto;
}
.hero-slider__btn--prev{left:32px}
.hero-slider__btn--prev:before{transform:rotate(-135deg)}
.hero-slider__btn--next{right:32px}
.hero-slider__btn--next:before{transform:rotate(45deg)}
.hero-slider__dots{
  position:absolute;
  left:0;right:0;bottom:12px;
  display:flex;
  justify-content:center;
  gap:10px;
}
.hero-slider__dots button{
  width:10px;height:10px;border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.14);
}
.hero-slider__dots button[aria-selected="true"]{background:var(--accent);border-color:rgba(222,31,60,.7)}

/* Content + cards */
article{background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 40px rgba(0,0,0,.35);padding:22px}

/* Two-column post grid on listing pages */
.posts-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width: 900px){
  .posts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.posts-grid .entry-title{font-size:14px;line-height:1.3;font-weight:800;letter-spacing:.02em;margin-bottom:8px}
.posts-grid .entry-title a{display:inline-block}
.entry-title{font-size:30px;font-weight:850;letter-spacing:.4px}
.header .entry-title{margin-bottom:6px}
.entry-content{margin-top:14px}
.entry-content p{margin:0 0 14px}
.entry-content h2{font-size:22px;font-weight:800;margin:22px 0 10px}
.entry-content h3{font-size:18px;font-weight:800;margin:18px 0 10px}
.entry-content img, .entry-content video, .entry-content iframe{max-width:100%;height:auto;border-radius:16px}
.entry-content iframe{width:100%;aspect-ratio:16/9}

/* Post lists (featured image as thumbnail) */
#content .post, #content .page{margin:0 0 20px}
.entry-summary{color:var(--muted)}
.post-thumbnail{display:block;margin:0 0 14px;position:relative;overflow:hidden;border-radius:18px}
.post-thumbnail__link{display:block}
.post-thumbnail__link img{width:100%;height:auto;display:block}

/* Tag pills overlay on archive cards */
.thumb-tags{list-style:none;margin:0;padding:10px;display:flex;flex-wrap:wrap;gap:8px;position:absolute;left:0;right:0;bottom:0;z-index:2;background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0))}
.thumb-tags li{margin:0;padding:0}
.thumb-tag{display:inline-block;padding:6px 10px;border-radius:999px;font-size:12px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;color:rgba(255,255,255,.92);background:rgba(222,31,60,.24);border:1px solid rgba(222,31,60,.38);backdrop-filter:blur(6px)}
.thumb-tag:hover,.thumb-tag:focus{background:rgba(222,31,60,.34);border-color:rgba(222,31,60,.55);color:#fff}

/* Sidebar */
#sidebar .widget-area{position:sticky;top:92px}
#sidebar .widget{background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px}
#sidebar .widget-title{font-weight:800;margin-bottom:10px}

/* Footer */
#footer{
  margin-top:40px;
  border-top:1px solid var(--border);
  background:rgba(11,11,15,.65);
  backdrop-filter:blur(14px);
}
#footer .footer-inner{max-width:var(--max);margin:0 auto;padding:40px 18px;display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start;justify-content:space-between}
#copyright{color:var(--muted);padding:0}
.footer-menu ul{display:flex;flex-wrap:wrap;gap:14px}
.footer-menu a{color:var(--muted)}
.footer-menu a:hover{color:var(--accent)}

/* Comments: keep the submit button from gluing onto the textarea */
.comment-respond .comment-form{display:flex;flex-direction:column;gap:12px}
.comment-respond .comment-form-comment textarea{width:100%;display:block}
.comment-respond p.form-submit{margin-top:10px;padding-top:10px}

/* (No fixed custom logo sizing here; logo follows navbar height.) */

/* ------------------------------------------------------------
   Fixes for responsive navbar/menu + focus styles
   ------------------------------------------------------------ */

/* Remove the default white focus highlight on inputs and use a subtle accent ring */
input:focus, textarea:focus, select:focus,
input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(222,31,60,.35);
}
button:focus, button:focus-visible,
input[type="submit"]:focus, input[type="submit"]:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(222,31,60,.35);
}

/* IMPORTANT: the file has multiple header blocks. These overrides are placed
   at the end so they win in the cascade.
   Goal: when the menu collapses (tablet/smaller desktops), opening it should
   expand the header and push the page content down (not overlay it). */
@media (max-width: 1400px){
  /* Ensure the header can grow (later rules set a fixed 100px height) */
  .header-inner{flex-wrap:wrap;height:auto;padding:10px 18px}

  /* When collapsed, keep the header in-flow so the expanded nav pushes content down */
  #header{position:static;top:auto}

  /* Match the mobile layout, just earlier */
  .site-brand{order:1}
  /* Make the logo smaller so it doesn't crowd the hamburger */
  .custom-logo-link,.logo-link{height:52px}
  .custom-logo{height:52px;width:auto}
  .site-brand .custom-logo{height:52px}
  .nav-toggle{display:inline-flex;order:2;margin-left:auto}

  /* Toggleable menu row (opens inside the header) */
  #menu{width:100%;order:3;display:none}
  #header.is-nav-open #menu{display:flex}
  #menu .menu{flex-direction:column;align-items:center;width:100%}
  #menu .menu a{justify-content:center;text-align:center;width:100%}

  /* Search row (full width).
     WordPress default markup is:
       <form class="search-form"> <label> <input class="search-field"> ... </label> <input class="search-submit"> </form>
     The <label> must be allowed to stretch, otherwise the input cannot fill the row.
  */
  .header-tools{order:4;width:100%;margin-left:0;min-width:unset;display:block}
  .header-tools .search-form{width:100%;display:flex;align-items:center;gap:8px}
  .header-tools .search-form label{flex:1 1 auto;width:100%;min-width:0;display:block}
  .header-tools .search-form .search-field,
  .header-tools .search-form input[type="search"]{width:100%;min-width:0;flex:1 1 auto}
}

/* Extra-small phones: keep logo + hamburger on one row, and prevent iOS focus-zoom */
@media (max-width: 480px){
  .custom-logo-link,.logo-link{height:40px}
  .custom-logo{height:40px;width:auto}
  .site-brand .custom-logo{height:40px}
  .brand-tagline{font-size:10px;letter-spacing:.14em;max-width:60vw}
  /* iOS Safari zooms on focus when inputs are < 16px */
  .header-tools .search-form input[type="search"],
  .header-tools .search-form .search-field{font-size:16px}
}


/* --------------------------------------------------------------
   Theme fixes (Jan 2026)
-------------------------------------------------------------- */

/* 2) Make excerpt clickable without changing text color */
.excerpt-link{display:block;color:inherit;text-decoration:none}
.excerpt-link:hover,.excerpt-link:focus{color:inherit;text-decoration:none}

/* 3) Tag pills overlay sizing (smaller pills) */
.thumb-tag{font-size:8px;padding:3px 5px}

/* 5,7) Thumbnail above title + bleed to edge + consistent 16:9 crop */
.post-thumbnail--bleed{margin:-22px -22px 12px; border-radius:var(--radius); overflow:hidden}
.post-thumbnail--bleed .post-thumbnail__link{display:block;aspect-ratio:16/9;overflow:hidden}
.post-thumbnail__link img{width:100%;height:100%;object-fit:cover;display:block}

/* 6) Ensure bold text is actually bold */
strong,b{font-weight:700}

/* 8) Sidebar should scroll with content (disable sticky) */
#sidebar .widget-area{position:static;top:auto}

/* 9) Add vertical spacing between widget blocks in classic widget lists */
ul.xoxo > li.widget-container{margin:0 0 18px}
ul.xoxo > li.widget-container:last-child{margin-bottom:0}

/* 10) Pagination: make numeric pagination fit theme (basic) */
.navigation.pagination{margin-top:24px}
.navigation.pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center}
.navigation.pagination .page-numbers{display:inline-block;padding:8px 12px;border-radius:999px;text-decoration:none}
.navigation.pagination .page-numbers.current{font-weight:800}
