/* Base reset */
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }

/* Header (MANIANA.) */
.main-header{width:100%;background:#fff;border-bottom:1px solid #e5e5e5}
.header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;gap:20px}
.logo a{font-size:1.8rem;font-weight:800;letter-spacing:1px;color:#000}
.logo span{color:#000}
.menu-toggle{display:none;border:0;background:transparent;padding:8px;border-radius:8px}
.menu-toggle:focus{outline:2px solid #DAA520;outline-offset:2px}
.search-bar form{position:relative}
.search-bar input{padding:8px 36px 8px 14px;font-size:1rem;border:1px solid #ccc;border-radius:6px;width:220px;transition:all .2s}
.search-bar input:focus{outline:none;border-color:#888}
.search-bar button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#888;font-size:1rem;cursor:pointer}
.nav-menu ul{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.nav-menu a{font-weight:700;letter-spacing:.5px;color:#666;text-transform:uppercase;transition:color .2s}
.nav-menu a:hover{color:#DAA520}
.nav-menu .active{color:#DAA520}
.nav-menu .accordion-toggle{display:none}

/* --- Mobile Accordion Header--- */
@media (max-width:768px){
    .header-inner{flex-wrap:wrap;gap:12px}
    .menu-toggle{display:block;order:2}
    .search-bar{order:3;width:100%;text-align:center}
    .search-bar input{width:92%}
    /* stack nav full width */
    .nav-menu{order:4;width:100%;display:none;border-top:1px solid #eee}
    .nav-menu.open{display:block}
    .nav-menu ul{display:block;padding:8px 0}
    .nav-menu li{border-bottom:1px solid #f0f0f0}
    .nav-menu a{display:block;padding:12px 16px}
    /* accordion buttons for items with children */
    .nav-menu .has-children{position:relative}
    .nav-menu .accordion-toggle{display:flex;width:100%;justify-content:space-between;align-items:center;padding:12px 16px;background:none;border:0;font-weight:700;letter-spacing:.5px;color:#444;text-transform:uppercase;cursor:pointer}
    .nav-menu .accordion-toggle::after{content:'+';font-weight:900}
    .nav-menu .has-children[aria-expanded="true"] .accordion-toggle::after{content:'–'}
    .nav-menu .submenu{display:none;padding:0;margin:0;list-style:none;background:#fafafa}
    .nav-menu .submenu li a{padding:10px 22px;font-weight:600;text-transform:none;color:#555}
    .nav-menu .submenu.open{display:block}
}

/* Utility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Slider */
.slider { width:100%; overflow:hidden; position:relative; }
.slide { display:block; width:100%; height:56vw; max-height:600px; min-height:280px; background-size:cover; background-position:center; position:relative; }
.slide + .slide { display:none; } /* simple rotation via JS */
.slide-overlay { position:absolute; left:20px; bottom:20px; background:rgba(0,0,0,.45); color:#fff; padding:12px 16px; border-radius:6px; max-width:min(92%, 800px); }
.slide-overlay h2 { margin:0 0 6px; font-size:clamp(20px, 3vw, 36px); line-height:1.15; }
.slide-overlay p { margin:0; font-size:clamp(14px, 1.6vw, 18px); opacity:.95; }

/* Grid */
.post-grid { display:flex; flex-wrap:wrap; margin:0; padding-left: 15%; padding-right: 15%;}
.post-tile { width:25%; margin:0; position:relative; }
.tile-image { width:100%; padding-top:100%; background-size:cover; background-position:center; }
.tile-overlay { position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,.55); color:#fff; padding:10px 12px; opacity:0; transition:opacity .25s ease;font-family: "Open Sans Condensed", Helvetica, Arial, sans-serif; }
/* Tile overlay stack for secondary overlay */
.tile-overlay-wrap { position:absolute; left:0; bottom:0; width:100%; }
.tile-overlay-wrap .tile-overlay { position:static; bottom:auto; }
.tile-overlay-alt { position:static; left:0; bottom:auto; width:60%; background:rgba(5, 112, 168, 0.5); color:#fff; padding:10px 12px; margin-bottom:0; opacity:0; transition:opacity .25s ease; }
.post-tile:hover .tile-overlay-alt { opacity:1; }
.post-tile:hover .tile-overlay { opacity:1; }

/* Single */
.single-post .post-header { width:100%; height:48vw; max-height:520px; min-height:260px; background-size:cover; background-position:center; display:flex; align-items:flex-end; }
.single-post .post-header h1 { padding:20px 12px; background:rgba(0,0,0,.55); color:#fff;width:100%; text-align:center;height: 20%; font-size: xxx-large; margin-bottom: 0; }
.post-content { padding:20px; max-width:885px; margin:0 auto; font-family: "PT Serif", Georgia, Times, serif; font-size: 20px;font-weight: 300;color: #444444;line-height: 30px;}
.post-content .ql-video {width: 100%; !important;aspect-ratio: 16/9; !important max-width: 800px;!important display: block;!important margin: 1em auto;!important}
.post-content > p > img {width: 100%}
.site-footer { padding:24px; color:#777; border-top:1px solid #eee; text-align:center; }
.entry-meta {  padding-top: 1.75em;line-height: 2em;color: #999999;font-style: italic;margin: 0 auto 30px;width: 100%;text-align: center; font-family: "PT Serif", Georgia, Times, serif; font-size: 15px;font-weight: 300;}
.entry-meta::after { background: #cccccc;content: "";display: block;margin: 15px auto;width: 120px;height: 1px;}

/* --- Responsive --- */
@media (max-width: 1024px) {
  .post-tile { width:50%; }
  .header-nav .search-form input { width:200px; }
}

@media (max-width: 640px) {

  .post-grid {padding-left: 0; padding-right: 0;}
  .site-header { padding:12px; }
  .branding a { font-size:1.1rem; }
  .header-nav .search-form input { width:140px; padding:6px 8px; }

  .slide { height:50vh; min-height:220px; max-height:520px; }
  .slide-overlay { left:12px; right:12px; bottom:12px; padding:10px 12px; }

  .post-tile { width:100%; }
  /* make overlay visible by default on touch where :hover isn't reliable */
  .tile-overlay { opacity:1; background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,.05)); }
  .tile-overlay-alt { opacity:1; }
  .single-post .post-header h1 { height: auto}
}

/* Widget + Links area */
.widget-links-area { padding:20px; background-color: #373737; color: #ffffff}
.widgets-left, .links-right { flex: 1 1 0; padding: 2%;}
.social-widgets {display: inline-flex}
.latest-posts { list-style:none; margin:0; padding:0; }
.latest-posts li { margin:6px 0;text-decoration: underline;}
.widgets-left h3, .links-right h3 { margin:0 0 8px; font-size:1.1rem; padding-bottom: 1%}
.widget-links-area-inner { display:flex; gap:24px; align-items:flex-start; justify-content:space-between; padding-left: 15%; padding-right: 15%;}
.fa {font-size: 30px;width: 50px;}
@media (max-width: 768px) {
    .widget-links-area { flex-direction: column; gap:16px; padding:16px; margin:16px auto; }
}

/* --- Paginator --- */
.post-pager {display: flex;align-items: stretch;width: 100%;background: #109be9;color: #fff;}
.pager-arrow {width: 84px;min-height: 72px;display: grid;place-items: center;color: #fff;text-decoration: none;}
.pager-arrow:hover { background: #0f8fd6; }
.pager-arrow.is-disabled { opacity: .35; pointer-events:none; }
.pager-center {flex: 1;display: grid;grid-template-columns: 1fr 1fr;align-items: center;}
.pager-link {display: block;text-align: center;padding: 20px;font-weight: 800;text-transform: uppercase;color: #e6f5ff;}
.pager-link:hover { color:#fff; background:rgba(0,0,0,.06); }
.pager-link.is-disabled { opacity:.35; pointer-events:none; }
.pager-arrow--prev { border-right:1px solid rgba(255,255,255,.18); }
.pager-arrow--next { border-left:1px solid rgba(0,0,0,.08); }
.pager-center a:first-child { border-right:1px solid rgba(0,0,0,.08); }
@media (max-width:640px) {
    .pager-center { grid-template-columns:1fr; }
    .pager-center a:first-child { border-right:0; border-bottom:1px solid rgba(0,0,0,.08); }
    .pager-arrow { width:68px; min-height:64px; }
    .pager-link { padding:16px; }
}