/* === assets/css/critical-home.css (Evenzy starter) === */
/* Keep this small (first viewport only). It won’t fight your main CSS. */
:root{
  --evenzy-pink:#E32786;
  --text:#202C39;
  --muted:#374151;
  --bg:#fff;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Fira Sans Condensed","Roboto Condensed","Arial Narrow",Arial,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

/* Header (generic + Evenzy) */
header,.header,.site-header{position:sticky;top:0;z-index:100;background:#fff}
.header-wrap,.header-inner,.topbar,.rts-header{
  display:flex;align-items:center;justify-content:space-between;padding:10px 16px
}
.logo,.logo-area{display:flex;align-items:center;gap:8px}
.logo img,.logo-area img{width:150px;height:auto;display:block}

/* Container */
.container,.container-fluid,.rts-container{max-width:1100px;margin:0 auto;padding:0 16px}

/* Hero (LCP area) — seen as .rts-banner-four-area.bg-four-banner.ptb--200 */
.rts-banner-four-area,.bg-four-banner{
  display:flex;align-items:center;min-height:60vh;padding:32px 0 24px;background:#fff
}
.rts-banner-four-area h1,.bg-four-banner h1{
  font-weight:700;font-size:clamp(28px,6.5vw,46px);margin:0 0 10px;letter-spacing:-.02em
}
.rts-banner-four-area p,.bg-four-banner p{
  margin:0 0 16px;color:var(--muted);font-size:clamp(16px,4vw,18px)
}

/* CTA buttons (primary/secondary) */
.btn,.evenzy-btn,.rts-btn,.hero .cta{
  display:inline-block;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:600;line-height:1
}
.btn-primary,.evenzy-btn--primary{background:var(--evenzy-pink);color:#fff;border:0}
.btn-secondary,.evenzy-btn--secondary{background:#f3f4f6;color:#111827;border:0}

/* Event card (above-the-fold on list pages) */
.evenzy-event-card{
  display:block;background:#fff;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.05);overflow:hidden
}
.evenzy-event-content{padding:12px 14px}
.evenzy-event-card h3{margin:10px 0 6px;font-weight:600;font-size:clamp(18px,4.5vw,22px)}
.evenzy-category,.evenzy-postcode{font-size:14px;color:#6b7280}

/* Safe defaults */
img{max-width:100%;height:auto;display:block}
a{color:inherit}
ul,ol{padding-left:1.2rem}

/* Mobile tweaks */
@media (max-width:768px){
  .nav,.menu{display:none}
  .ptb--200{padding-top:120px!important;padding-bottom:120px!important}
}


.header-three {
  position: absolute;
  width: 100%;
  z-index: 3;
  padding: 50px 0;
}
.header-three.header--sticky {
  position: absolute;
}
.header-three.header--sticky.sticky {
  padding: 20px 0;
}
.header-three.header--sticky.sticky .header-three-wrapper .logo-area .thumbnail {
  display: none;
}
.header-three.header--sticky.sticky .header-three-wrapper .logo-area .thumbnail-2 {
  display: block;
}
@media (max-width: 1024px) {
  .header-three.header--sticky.sticky .header-three-wrapper .nav-area {
    display: none;
  }
}
.header-three.header--sticky.sticky .header-three-wrapper .nav-area nav ul li.menu-item:hover a {
  color: var(--color-primary) !important;
}
.header-three.header--sticky.sticky .header-three-wrapper .nav-area nav ul li.menu-item a {
  color: #FFFFFF;
}
.header-three .header-three-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-three .header-three-wrapper .logo-area .thumbnail-2 {
  display: none;
}
.header-three .header-three-wrapper .logo-area .thumbnail {
  display: block;
}
.header-three .header-three-wrapper .nav-area {
  margin-right: -60px;
}
@media (max-width: 1400px) {
  .header-three .header-three-wrapper .nav-area {
    margin-right: 0;
  }
}
@media (max-width: 1024px) {
  .header-three .header-three-wrapper .nav-area {
    display: none;
  }
}
.header-three .header-three-wrapper .nav-area nav ul li {
  margin: 0 20px;
  padding: 12px 0;
}
@media (max-width: 1400px) {
  .header-three .header-three-wrapper .nav-area nav ul li {
    margin: 0 20px;
  }
}
@media (max-width: 1200px) {
  .header-three .header-three-wrapper .nav-area nav ul li {
    margin: 0 10px;
  }
}
.header-three .header-three-wrapper .nav-area nav ul li a {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
}
@media (max-width: 1200px) {
  .header-three .header-three-wrapper .nav-area nav ul li a {
    font-size: 14px;
  }
}
.header-three .header-three-wrapper .rts-button-area {
  display: flex;
  align-items: center;
}
@media (max-width: 1200px) and (min-width: 1024px) {
  .header-three .header-three-wrapper .rts-button-area .rts-btn {
    padding: 20px;
  }
}
@media (max-width: 768px) {
  .header-three .header-three-wrapper .rts-button-area .rts-btn {
    padding: 20px 25px;
  }
}
@media (max-width: 576px) {
  .header-three .header-three-wrapper .rts-button-area .rts-btn {
    display: none;
  }
}
.header-three .header-three-wrapper .rts-button-area .menu-area {
  display: none;
  margin-left: 15px;
  background: var(--color-secondary);
  padding: 13px 17px;
}
.header-three .header-three-wrapper .rts-button-area .menu-area svg rect {
  fill: #ffffff;
}
@media (max-width: 1024px) {
  .header-three .header-three-wrapper .rts-button-area .menu-area {
    display: block;
  }
}
.main-nav-desk nav ul li.menu-item {
  transition: all 0.3s;
}
.main-nav-desk nav ul li.menu-item a.nav-item {
  transition: all 0.3s;
}
.main-nav-desk nav ul li.menu-item:hover a.nav-item {
  color: #0C0A0A;
}
.header-three .header-three-wrapper ul li {
  transition: all 0.3s;
}
.header-three .header-three-wrapper .nav-area nav ul li:hover a.nav-item {
  color: var(--color-primary);
}
.header-three .header-three-wrapper .nav-area nav ul li a.nav-item {
  transition: all 0.3s;
  color: #000000;
}

.mobile-menu nav ul {
  padding: 0 20px;
}
.mobile-menu nav ul li {
  margin: 0;
  padding: 0;
}
.mobile-menu nav ul li a.main {
  padding: 12px 0 17px 0;
  border-bottom: 1px solid #f3f3f3;
  cursor: pointer;
}
.mobile-menu nav ul li a {
  display: block;
}
@media screen and (min-width: 1024px) {
   .side-bar.header-three .mobile-menu {
    display: none !important;
  }
}