/* ==========================================================================
   KidsGen — Magic Section Stylesheet
   Theme: a children's stage magic show — velvet curtains, spotlight, playbill
   ========================================================================== */

:root {
  --midnight:     #1B1033;   /* main background — the curtain at rest */
  --velvet:       #3B1F5C;   /* raised panels */
  --velvet-deep:  #2A1548;
  --gold:         #F5C243;   /* spark / wand accent */
  --gold-soft:    #F7D77A;
  --flare:        #EF6C93;   /* secondary accent */
  --paper:        #FBF4E6;   /* cream reading panels */
  --paper-dim:    #F2E9D8;
  --ink:          #221439;   /* dark text on paper */
  --ink-soft:     #4B3A66;
  --parchment: #F5EDD8;
  --parchment-mid: #d4c9ab;
  --parchment-dark:#715941;
  --parchment-light: #fffdf6;
  --sunshine:     #FFB627;
  --sunshine-d:   #E89A00;
  --line:         rgba(245, 194, 67, 0.28);
  --muted:        #6B5E50;
   --border:      #E8D5B0;
  --shadow:       rgba(20,33,61,0.16);
  --shadow-stage: 0 18px 40px rgba(10, 4, 24, 0.45);
  --radius-ticket: 10px;
  --radius-card: 18px;
  --radius-pill: 40px;
  --max-w: 1200px;
  --font-display: "Baloo 2", ui-rounded, "Segoe UI", sans-serif;
  --font-body: "Nunito", "Segoe UI", Tahoma, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

body {
  margin: 0;
  background: var(--midnight);
  color: var(--paper);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, .brand-word, .act-name {
  font-family: var(--font-display);
  color: var(--gold-soft);
  line-height: 1.15;
  margin: 0 0 0.5em;
  font-weight: 700;
}

p { margin: 0 0 1em; }
a { color: var(--gold-soft); text-decoration-color: rgba(245,194,67,0.5); }
a:hover { text-decoration-color: var(--gold-soft); }
img { max-width: 100%; height:auto; display: block; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}

.wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; }

:focus-visible {
  outline: 3px solid var(--flare);
  outline-offset: 3px;
}

/* ---------- Star field ---------- */
.stars {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none;
}
.stars span {
  position: absolute;
  width: 4px; height: 4px;
  background: var(--gold-soft);
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
  opacity: 0.65;
  animation: twinkle 3.4s ease-in-out infinite;
}
@keyframes twinkle {
  0%, 100% { opacity: 0.25; transform: scale(0.85); }
  50% { opacity: 0.9; transform: scale(1.15); }
}


/* ═══════════════════════════════════════════════
       TOP NAV
    ═══════════════════════════════════════════════ */
    .top-nav {
      background: var(--velvet-deep);
      border-bottom: 1px solid var(--line);
      padding: 0 clamp(16px, 4vw, 60px);
      top: 0;
      z-index: 100;
      box-shadow: 0 3px 18px rgba(0,0,0,0.18);
    }
    .nav-inner {
      max-width: 1200px;
      margin: 0 auto;
      align-items: center;
      justify-content: space-between;
    }
   .top-nav ul{
		list-style: none;
		font-family: var(--font-display);
		padding-left:0;
		margin:0;
	}
/* Logo */
.logo{
    display: inline-block;
    padding-top: 10px;
}
.logo img {
	max-width:180px;
}
/* Nav menu */
.nav{
    position: fixed;
	left: 10px;
    right: 10px;
    background-color: var(--midnight);
    overflow: hidden;
    z-index: 2;
}
.menu a{
    display: block;
	padding:4px 2px;
    /*padding: 12px 25px;*/
    color: var(--paper);
	border-bottom: 2px solid transparent;
	text-decoration:none
}
.menu li:last-child a {border:none}
.menu a:hover, .menu a.active{
	color: var(--gold-soft);
    background-color: var(--shadow);
}
.nav{
    max-height: 0;
    transition: max-height .5s ease-out;
}
/* Menu Icon */
.hamb{
    cursor: pointer;
    float: right;
    padding: 35px 20px;
}/* Style label tag */

.hamb-line {
    background: var(--gold-soft);
    display: block;
    height: 2px;
    position: relative;
    width: 24px;

} /* Style span tag */

.hamb-line::before,
.hamb-line::after{
    background: var(--gold-soft);
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transition: all .2s ease-out;
    width: 100%;
}
.hamb-line::before{
    top: 5px;
}
.hamb-line::after{
    top: -5px;
}

.side-menu {
    display: none;
} /* Hide checkbox */
/* Toggle menu icon */
.side-menu:checked ~ nav{
    max-height:fit-content;
}
.side-menu:checked ~ .hamb .hamb-line {
    background: transparent;
}
.side-menu:checked ~ .hamb .hamb-line::before {
    transform: rotate(-45deg);
    top:0;
}
.side-menu:checked ~ .hamb .hamb-line::after {
    transform: rotate(45deg);
    top:0;
}

body:has(.side-menu:checked) {
  overflow: hidden;
}

@media (max-width: 991px) {
	.nav{
		box-shadow: var(--shadow);
		margin-top: 1px;
		border: 1px solid var(--line);
        border-top: none;
		z-index:3
	}
	.menu a{
		padding: 8px 25px;
		border-bottom: 1px dotted var(--line);
	}
}
/* Responsiveness */
@media (min-width: 992px) {	
    .nav{
        max-height: none;
		margin-top: 18px;
        top: 0;
        position: relative;
        float: right;
        width: fit-content;
        background-color: transparent;
    }
    .menu li{
        float: left;
    }
	.menu a{
		font-size:0.98rem;
		padding: 3px 0;
		margin:0 15px;
		border-bottom: 2px solid transparent;
		transition: all 0.5s ease 0s;
    }
    .menu a:hover, .menu a.active {
        border-bottom-color: var(--gold);
		transition: all 0.5s ease 0s;
    }

    .hamb{
        display: none;
    }
}


/* ---------- Site header ---------- */
.site-header {
  background: var(--velvet-deep);
  border-bottom: 1px solid var(--line);
}
.site-header .wrap {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 16px; padding-bottom: 16px; gap: 20px; flex-wrap: wrap;
}
.brand {
  display: flex; align-items: baseline; gap: 6px;
  text-decoration: none;
}
.brand-word { font-size: 1.6rem; color: var(--paper); margin: 0; }
.brand-word em { color: var(--gold); font-style: normal; }
.site-nav ul {
  list-style: none; display: flex; gap: 22px; margin: 0; padding: 0; flex-wrap: wrap;
  font-family: var(--font-display); font-size: 0.98rem;
}
.site-nav a {
  color: var(--paper); text-decoration: none; padding: 4px 2px; border-bottom: 2px solid transparent;
}
.site-nav a:hover, .site-nav a[aria-current="page"] {
  border-bottom-color: var(--gold);
  color: var(--gold-soft);
}

.breadcrumbs {
  background: var(--midnight);
}
.breadcrumbs ol {
  list-style: none; display: flex; gap: 8px; margin: 0; padding: 12px 0;
  font-size: 0.88rem; color: var(--ink-soft); flex-wrap: wrap;
}
.breadcrumbs a { color: var(--gold-soft); text-decoration: none; }
.breadcrumbs li:not(:last-child)::after { content: "›"; margin-left: 8px; color: var(--ink-soft); }
.breadcrumbs li:last-child { color: #C9BEDB; }

/* ---------- Hero / curtain stage ---------- */
.stage {
  position: relative;
  padding: 76px 24px 90px;
  text-align: center;
  overflow: hidden;
  background:
    radial-gradient(ellipse 60% 55% at 50% 38%, rgba(245,194,67,0.16), transparent 70%),
    linear-gradient(180deg, var(--midnight) 0%, var(--velvet-deep) 100%);
}
.curtain {
  position: absolute; top: 0; bottom: 0; width: 20%;
  background: repeating-linear-gradient(90deg, var(--velvet) 0 18px, var(--velvet-deep) 18px 36px);
  box-shadow: inset 0 0 60px rgba(0,0,0,0.5);
  animation: curtain-open 1.1s ease-out both;
}
@media (max-width:749px) {
	.curtain {
	  width: 1%;
	}
}
@media (min-width:750px) and (max-width:991px) {
	.curtain {
	  width: 9%;
	}
}
.curtain::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.35), transparent 25%, transparent 75%, rgba(0,0,0,0.35));
}
.curtain-left { left: 0; border-right: 3px solid var(--gold); transform-origin: left center; }
.curtain-right { right: 0; border-left: 3px solid var(--gold); transform-origin: right center; }
@keyframes curtain-open {
  from { transform: scaleX(1); }
  to { transform: scaleX(1); }
}
.stage-content { position: relative; z-index: 2; max-width: 640px; margin: 0 auto; }
.stage-eyebrow-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--velvet); border: 1px solid var(--line);
  border-radius: 999px; padding: 6px 16px; font-family: var(--font-display);
  color: var(--gold-soft); font-size: 0.9rem; margin-bottom: 22px;
}
.stage h1 { font-size: clamp(2.3rem, 5.5vw, 3.6rem); margin-bottom: 0.35em; }
.stage .lede { font-size: 1.15rem; color: #E5DAF2; max-width: 52ch; margin: 0 auto 30px; }

.btn {
  display: inline-block; font-family: var(--font-display); font-size: 1.02rem;
  padding: 13px 30px; border-radius: 999px; text-decoration: none;
  background: var(--gold); color: var(--midnight); font-weight: 700;
  box-shadow: 0 10px 24px rgba(245,194,67,0.28);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(245,194,67,0.38); }
.btn.btn-ghost {
  background: transparent; color: var(--gold-soft); border: 2px solid var(--gold);
  box-shadow: none; margin-left: 12px;
}
.btn.btn-ghost:hover { background: rgba(245,194,67,0.12); }

/* ---------- Intro / paper panels ---------- */
.panel-paper {
  background: var(--paper); color: var(--ink);
}
.panel-paper h2 {
	color: var(--velvet);
	}
.intro-wrap {
  font-size: 1.08rem;
  padding: 50px 0;
}
.intro-wrap p:last-child {margin-bottom:0}
.intro h2 { color: var(--ink); }
.intro p { color: var(--ink); }

section, .main-content { padding: 64px 0; }
.main-content section:first-child {padding-top:0}
@media (max-width:767px) {
	section, .main-content { padding: 44px 0; }
}
.section-head { max-width: 60ch; margin: 0 0 40px; }
.section-head h2 { font-size: clamp(1.6rem, 3.4vw, 2.2rem); }
.section-head p { color: #D9CDEB; }
.panel-paper .section-head p { color: var(--ink-soft); }

/**************** CONTENT and GRID **********/

.content-grid {
	display: grid;
	grid-template-columns:1fr 300px;
	gap: 25px;
	padding: 50px 0;
	align-items: start;
}
@media (max-width:767px) {
	 .content-grid {
		 grid-template-columns:1fr;
		}
}

.box-grid-2, .box-grid-3 {
	display:grid;
	gap:20px;
}
.box-grid-2 {
	grid-template-columns: repeat(2, 1fr)
}
.box-grid-3 {
	grid-template-columns: repeat(3, 1fr)
}
@media (max-width:767px) {
	.box-grid-2, .box-grid-3 {
		grid-template-columns:1fr
	}
}

.magic-more {background: linear-gradient(120deg, var(--parchment), var(--sunshine));padding:44px 20px; border-radius:22px; margin-bottom:30px}

/* ---------- Trick grid / ticket cards ---------- */
.trick-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px;
}
@media (max-width: 760px) {
  .trick-grid { grid-template-columns: 1fr; }
}

.ticket {
  position: relative;
  background: var(--paper);
  color: var(--ink);
  border-radius: var(--radius-ticket);
  padding: 26px 26px 22px;
  box-shadow: var(--shadow-stage);
  background-image:
    radial-gradient(circle at 0 50%, var(--midnight) 9px, transparent 9.5px),
    radial-gradient(circle at 100% 50%, var(--midnight) 9px, transparent 9.5px);
  background-repeat: no-repeat;
  background-position: left 96px, right 96px;
}
.ticket::before {
  content: "";
  position: absolute; left: 20px; right: 20px; top: 108px;
  border-top: 2px dashed rgba(34,20,57,0.22);
}
.ticket-head { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; }
.ticket-num {
  flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%;
  background: var(--midnight); color: var(--gold-soft);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 1.05rem;
  border: 2px solid var(--gold);
}
.ticket-eyebrow { font-size: 0.82rem; color: var(--ink-soft); font-family: var(--font-display); }
.ticket h3 { color: var(--ink); font-size: 1.3rem; margin: 2px 0 10px; }
.ticket .teaser { color: var(--ink-soft); margin-bottom: 14px; }
.ticket .need {
  list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0 0 16px;
}
.ticket .need li {
  background: var(--paper-dim); border: 1px solid rgba(34,20,57,0.12);
  border-radius: 999px; padding: 4px 12px; font-size: 0.85rem; color: var(--ink);
}
.ticket details {
  font-size:0.95rem; margin-top: 18px; line-height: 150%; padding-top: 16px; border-top: 2px dashed rgba(34,20,57,0.22);
}
.ticket summary {
  cursor: pointer; font-family: var(--font-display); color: var(--flare);
  font-weight: 700; list-style: none; display: flex; align-items: center; gap: 8px;
}
.ticket summary::-webkit-details-marker { display: none; }
.ticket summary::before {
  content: "✦"; color: var(--gold); transition: transform 0.2s ease;
}
.ticket details[open] summary::before { transform: rotate(90deg); }
.ticket ol { margin: 14px 0 0; padding-left: 1.2em; color: var(--ink); }
.ticket ol li { margin-bottom: 8px; }
.ticket .secret-tip {
  margin-top: 12px; padding: 10px 14px; background: var(--paper-dim);
  border-left: 3px solid var(--flare); border-radius: 4px; font-size: 0.93rem;
}

/* ---------- Toolkit / tips ---------- */
.toolkit-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px;
}
@media (max-width: 820px) { .toolkit-grid { grid-template-columns: 1fr; } }
.toolkit-card {
  background: var(--velvet); border: 1px solid var(--line);
  border-radius: 14px; padding: 26px;
}
.toolkit-card .glyph {
  width: 44px; height: 44px; margin-bottom: 14px;
}
.toolkit-card h3 { color: var(--gold-soft); font-size: 1.15rem; }
.toolkit-card p { color: #E5DAF2; margin: 0; }

/* ---------- Facts / trivia list ---------- */
.trivia-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.trivia-list li {
  display: grid; grid-template-columns: 34px 1fr; gap: 14px;
  background: var(--velvet); border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px;
}
.trivia-list .mark { color: var(--gold); font-family: var(--font-display); font-size: 1.4rem; }
.trivia-list strong { color: var(--gold-soft); font-family: var(--font-display); display: block; margin-bottom: 4px; }
.trivia-list p { color: #E5DAF2; margin: 0; }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: 14px; max-width: 74ch; }
.faq details {
  background: var(--velvet); border: 1px solid var(--line); border-radius: 12px; padding: 4px 20px;
}
.faq summary {
  cursor: pointer; padding: 16px 0; font-family: var(--font-display);
  color: var(--gold-soft); font-size: 1.05rem; list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; float: right; color: var(--gold); }
.faq details[open] summary::after { content: "–"; }
.faq .faq-a { color: #E5DAF2; padding: 0 0 18px; margin: 0; }

/* ---------- Safety note ---------- */
.safety-note {
  background: var(--paper-dim); border: 1px solid rgba(239,108,147,0.4);
  border-left: 5px solid var(--flare); border-radius: 8px; padding: 18px 22px;
  color: var(--ink);
}
.safety-note strong { color: var(--flare); }

/* ---------- CTA band ---------- */
.cta-band {
  text-align: center; padding: 70px 24px;
  background:
    radial-gradient(ellipse 60% 80% at 50% 0%, rgba(239,108,147,0.18), transparent 70%),
    var(--velvet-deep);
  border-top: 1px solid var(--line);
}
.cta-band h2 { font-size: clamp(1.7rem, 4vw, 2.4rem); }
.cta-band p { color: #E5DAF2; max-width: 52ch; margin: 0 auto 26px; }

/* ---------- Category grid (hub page) ---------- */
.category-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px;
}
@media (max-width: 900px) { .category-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .category-grid { grid-template-columns: 1fr; } }

.category-card {
  display: block; text-decoration: none;
  background: var(--velvet); border: 1px solid var(--line); border-radius: 16px;
  padding: 28px 26px; position: relative; overflow: hidden;
  transition: transform 0.18s ease, border-color 0.18s ease;
}
.category-card:hover { transform: translateY(-4px); border-color: var(--gold); }
.category-card .cat-icon {
  width: 46px; height: 46px; margin-bottom: 16px;
}
.category-card h3 { color: var(--gold-soft); font-size: 1.25rem; margin-bottom: 8px; }
.category-card p { color: #E5DAF2; margin: 0 0 14px; font-size: 0.96rem; }
.category-card .cat-count {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-display); font-size: 0.85rem; color: var(--gold);
}

/* ---------- Category page hero variant (compact, non-curtain) ---------- */
.cat-hero {
  padding: 54px 24px 60px;
  text-align: center;
  background:
    radial-gradient(ellipse 55% 60% at 50% 20%, rgba(245,194,67,0.14), transparent 70%),
    var(--velvet-deep);
  border-bottom: 1px solid var(--line);
}
.cat-hero-content { max-width: 750px; margin: 0 auto; }
.cat-hero-content figure {margin:0}
.cat-crumb-link { display:inline-flex; align-items:center; gap:6px; color:#C9BEDB; text-decoration:none; font-size:0.92rem; margin-bottom:18px; }
.cat-crumb-link:hover { color: var(--gold-soft); }

/* ---------- Related categories strip ---------- */
.related-cats {
  display: flex; flex-wrap: wrap; gap: 12px;
}
.related-cats a {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--velvet); border: 1px solid var(--line); border-radius: 999px;
  padding: 9px 18px; color: var(--paper); text-decoration: none; font-family: var(--font-display); font-size: 0.92rem;
}
.related-cats a:hover { border-color: var(--gold); color: var(--gold-soft); }


/* ═══════════════════════════════════════════════
       ASIDE RIGHT CONTAINER
    ═══════════════════════════════════════════════ */
	.sidebar { position: sticky; top: 20px; display: flex; flex-direction: column; gap: 22px; }
	.panel-card {
		background: var(--parchment);
		border:1px solid var(--parchment-mid);
		border-radius: var(--radius-card);
		padding: 20px;
		box-shadow: 0 8px 20px -16px rgba(46,26,82,0.4);
	}
	.panel-card h3, .panel-card .h3, .panel-card .section-head{
		font-family: var(--font-display);
		color:var(--parchment-dark);
		display: block;
		font-size: 1.5rem;
		margin: 0 0 14px;
		font-weight: 600;
		padding-bottom: 2px;
		border-bottom:2px solid var(--border);
	}
	.panel-link { display: flex; align-items: center; gap: 12px;color: var(--midnight); padding: 8px 0; border-bottom: 1px dashed var(--muted); text-decoration:none;transition: all 0.5s ease 0s; }
	.panel-link:last-child { border-bottom: none; }
	.panel-link img { width: 48px; height: 48px; object-fit: cover; border-radius: 12px; flex-shrink: 0; }
	.panel-link span { font-weight: 700; font-size: 0.9rem; line-height: 1.3;transition: all 0.5s ease 0s;  }
	.panel-link:hover span {padding-left:5px;transition: all 0.5s ease 0s; }
	.panel-card .discover-list a { display: block; color:var(--midnight); text-decoration:none; padding: 7px 0; font-weight: 700; font-size: 0.92rem; border-bottom: 1px dashed var(--muted);transition: all 0.5s ease 0s; }
	.panel-card .discover-list a:last-child { border-bottom: none; }
	.panel-card .discover-list a:hover { color: var(--ink); padding-left:10px; transition: all 0.5s ease 0s; }
	.panel-card br {display:none}
	
	.newsletter {
	background: linear-gradient(135deg, #005457, #1f9c91);
	color: #fff; border: none;
	}
	.newsletter .h3 { color: #fff; }
	.newsletter p { font-size: 0.86rem; opacity: 0.92; margin: 0 0 14px; }
	.newsletter input[type=text], .newsletter input[type=email] {
	width: 100%; padding: 11px 14px; border-radius: 12px; border: none;
	font-family: inherit; font-size: 0.92rem; margin-bottom: 10px;
	}
	.newsletter input[type=submit] {
	width: 100%; padding: 11px; border-radius: 12px; border: none;
	background: var(--gold); color: var(--ink); font-weight: 800;
	cursor: pointer; transition: transform 0.2s ease;
	}
	.newsletter input[type=submit]:hover { transform: translateY(-2px); }
	
	
	 /* ═══════════════════════════════════════════════
       RELATED
    ═══════════════════════════════════════════════ */
	.related-wrap {
		margin-bottom:25px;
		margin-top: 30px;
		padding-top:25px;
		border-top: 2px solid var(--border);
		}
	.related-wrap h2 {border:none;}
	.related-nav { display: flex; gap: 8px; flex-wrap: wrap; justify-content:center }
    .related-nav a, .more-nav a:link {
      border: 1.5px solid var(--orange);
      background: var(--orange);
      color: var(--cream);
      font-size: 0.82rem;
      font-weight: 700;
      padding: 6px 16px;
	  text-decoration:none;
      border-radius: var(--radius);
      transition: all 0.5s ease 0s;
      font-family: var(--font-body);
    }
    .related-nav a:hover { background: var(--card-bg); border-color: var(--border); color:var(--ink);transition: all 0.5s ease 0s; }
	.related-nav a span.left {margin-right:7px;}
	.related-nav a span.right {margin-left:7px;}
	@media (max-width:490px) {.related-nav a, .more-nav a:link {font-size: 0.7rem;}}

 /* ═══════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════ */
.foot-banner {
	background:var(--parchment);
	padding:25px 0;
	}
.foot-banner .container {
	padding:15px;
	}
.site-footer {
  background: var(--ink);
  color: rgba(255,255,255,0.65);
  padding: clamp(36px, 5vw, 60px) clamp(16px, 5vw, 60px) 28px;
}

.footer-bottom {
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	font-size: 0.98rem;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
@media (max-width:767px) {
	.footer-bottom {
		display:block;
		text-align: center;
	}
	.foot-left {margin-bottom:10px;}
	.foot-mid {margin-bottom:20px;}
}
.footer-bottom a { color: rgba(255,255,255,0.5); text-transform:uppercase; font-size:0.8rem; text-decoration:none; padding-left:6px; padding-right:6px; transition: all 0.6s ease 0s; }
.footer-bottom a:hover { color: var(--gold); text-decoration:underline;transition: all 0.6s ease 0s; }
/*** SECTION FOOTER **/
.site-footer .bann-wrap {background:rgba(255,255,255,0.9); padding:10px; margin:15px 0; border-radius:15px}
.site-footer .wrap {max-width:unset;}
.foot-sections {padding:0 16px}
.foot-sections .h3, .foot-sections .foot-head { display:block;font-family: var(--font-display); color: var(--gold-soft); font-size: 1.8rem; margin: 0 0 16px; font-weight:600 }
.foot-sections ul {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 18px;
}
.foot-sections a { text-decoration:none; font-size:0.9rem; color:var(--parchment);transition: all 0.5s ease 0s; }
.foot-sections a:hover { color:var(--pink); text-decoration:underline;transition: all 0.5s ease 0s; }

@media (max-width:767px) {
	.footer-col ul {padding: 0; margin: 0;display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px 18px;}
	.foot-sections {padding:0} 
	.foot-sections ul {grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }		
}