/* =========================================================
   WYRD ARCHIVE - wyrd.css (single clean stylesheet)
   Child theme: kadence-wyrd-child

   Targets:
   - Site canvas background
   - Header + nav styling
   - Home-2 hero cleanup (page-id-952)
   - Featured parchment banner (centered)
   - Browse cards row parchment (row id c7a1f2-04)
   ========================================================= */

:root{
  --wyrd-gold: #AF7E3A;
  --wyrd-gold-2: #F7C06F;
  --wyrd-ink: #1B1714;
  --wyrd-shadow: 0 18px 45px rgba(0,0,0,.35);
}

/* -------------------------
   Site canvas background
   ------------------------- */
body:not(.wp-admin){
  background-color: #0b0705;
  background-image: url("/wp-content/themes/kadence-wyrd-child/assets/img/wyrd-canvas-seamless-square-2048.webp");
  background-repeat: repeat;
  background-size: 900px auto;
  background-attachment: fixed;
  color: rgba(243,226,195,.92);
}
@media (max-width: 768px){
  body:not(.wp-admin){ background-attachment: scroll; }
}

/* Let the canvas show through Kadence wrappers */
.site, .site-content, .content-area, .site-main,
.content-bg, .entry-content, .entry-content-wrap{
  background: transparent !important;
}

/* Links */
a{ color: var(--wyrd-gold-2); }
a:hover{ color: var(--wyrd-gold); }

/* -------------------------
   Header and nav
   ------------------------- */
.site-header,
.site-header-wrap,
.site-header-row-container,
.kadence-sticky-header{
  background: rgba(22, 8, 4, 0.78) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(175,126,58,.22);
}

.main-navigation a,
.main-navigation .menu > li > a{
  color: rgba(243,226,195,.92) !important;
  letter-spacing: .02em;
}
.main-navigation a:hover,
.main-navigation .menu > li > a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a{
  color: var(--wyrd-gold-2) !important;
}

/* Bestiary menu item as button (menu item id 1190) */
@media (min-width: 768px){
  .site-header .primary-menu-container ul.menu{
    display: flex;
    align-items: center;
    gap: 18px;
  }
  .site-header .primary-menu-container ul.menu > li.menu-item-1190{
    margin-left: auto;
  }
  .site-header .primary-menu-container a[href*="/bestiary/"]{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid rgba(210, 166, 92, 0.85);
    border-radius: 10px;
    color: rgba(210, 166, 92, 0.95);
    text-decoration: none;
    background: rgba(0,0,0,0.15);
    line-height: 1;
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
  }
  .site-header .primary-menu-container a[href*="/bestiary/"]:hover,
  .site-header .primary-menu-container a[href*="/bestiary/"]:focus{
    background: rgba(210, 166, 92, 0.12);
    border-color: rgba(210, 166, 92, 1);
    color: rgba(235, 198, 130, 1);
  }
}

/* -------------------------
   Hide Kadence page title hero bar on home (if present)
   ------------------------- */
body.home:not(.wp-admin) .entry-hero.page-hero-section{
  display: none !important;
}

/* -------------------------
   Page 952: make buttons match house style
   (covers Explore + See all creatures)
   ------------------------- */
body.page-id-952 .wp-block-button__link,
body.page-id-952 .kt-button,
body.page-id-952 .kb-button{
  border-radius: 12px !important;
  border: 1px solid rgba(210, 166, 92, 0.9) !important;
  background: rgba(0,0,0,0.20) !important;
  color: rgba(235, 198, 130, 1) !important;
  text-decoration: none !important;
  letter-spacing: 0.02em;
}
body.page-id-952 .wp-block-button__link:hover,
body.page-id-952 .kt-button:hover,
body.page-id-952 .kb-button:hover{
  background: rgba(210, 166, 92, 0.12) !important;
  border-color: rgba(235, 198, 130, 1) !important;
  color: rgba(245, 220, 170, 1) !important;
}

/* -------------------------
   HOME-2: remove any hero row “panel” layers
   (hero row id from your setup)
   ------------------------- */
body.page-id-952 .kb-row-layout-id_1a41d5-ee,
body.page-id-952 .kb-row-layout-id_1a41d5-ee .kt-row-layout-inner,
body.page-id-952 .kb-row-layout-id_1a41d5-ee .kt-row-column-wrap,
body.page-id-952 .kb-row-layout-id_1a41d5-ee .kt-inside-inner-col{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
}
body.page-id-952 .kb-row-layout-id_1a41d5-ee .kt-row-layout-overlay{
  display: none !important;
}

/* Also ensure the page content wrapper is not painting a faint rectangle */
body.page-id-952 #primary,
body.page-id-952 #primary .content-container,
body.page-id-952 #primary .content-wrap,
body.page-id-952 article#post-952,
body.page-id-952 .entry-content-wrap,
body.page-id-952 .entry-content{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
}

/* Hero title centering (your custom class) */
body.page-id-952 .wyrd-hero-title{
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
  white-space: normal !important;
}

/* -------------------------
   FEATURED PARCHMENT: centered + shadow follows frayed alpha
   ------------------------- */
body.page-id-952 .wyrd-feature-banner{
  left: auto !important;
  right: auto !important;
  transform: none !important;
  float: none !important;

  display: block !important;
  position: relative !important;
  margin: 44px auto 36px !important;

  width: min(1280px, 92vw) !important;
  max-width: 1280px !important;

  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;

  overflow: visible !important;
  padding: 44px 90px 44px 54px !important;
}

body.page-id-952 .wyrd-feature-banner::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;

  background: url("/wp-content/themes/kadence-wyrd-child/assets/wyrd/parchment-fill-wide-v3.webp")
    center / 100% 100% no-repeat !important;

  filter: drop-shadow(0 18px 40px rgba(0,0,0,0.45));
}

body.page-id-952 .wyrd-feature-banner > *{
  position: relative !important;
  z-index: 1 !important;
}

/* Ensure nothing clips the frayed edges */
body.page-id-952 .wyrd-featured-hero,
body.page-id-952 .wyrd-featured-hero *{
  overflow: visible !important;
}

/* -------------------------
   Browse cards row (row id c7a1f2-04)
   This is the exact rule from your old CSS, plus a small fallback.
   ------------------------- */

/* Primary (this is the one you said works) */
body.page-id-952 .kb-row-layout-id_c7a1f2-04 .wp-block-kadence-column > .kt-inside-inner-col{
  position: relative !important;
  background: url("/wp-content/themes/kadence-wyrd-child/assets/wyrd/parchment-fill-card-v6.webp")
    center / cover no-repeat !important;
  border-radius: 6px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;
  padding: 18px 18px 20px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* Fallback if Kadence swaps the inner class name */
body.page-id-952 .kb-row-layout-id_c7a1f2-04 .wp-block-kadence-column > .kb-inside-inner-col{
  position: relative !important;
  background: url("/wp-content/themes/kadence-wyrd-child/assets/wyrd/parchment-fill-card-v6.webp")
    center / cover no-repeat !important;
  border-radius: 6px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;
  padding: 18px 18px 20px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* Make sure text is readable even if it is not a direct child */
body.page-id-952 .kb-row-layout-id_c7a1f2-04 .kt-inside-inner-col h4,
body.page-id-952 .kb-row-layout-id_c7a1f2-04 .kb-inside-inner-col h4{
  margin: 0 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-size: 20px !important;
  line-height: 1.15 !important;
  color: rgba(27,23,20,0.92) !important;
}

body.page-id-952 .kb-row-layout-id_c7a1f2-04 .kt-inside-inner-col p,
body.page-id-952 .kb-row-layout-id_c7a1f2-04 .kb-inside-inner-col p{
  margin: 0 !important;
  text-align: center !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  color: rgba(27,23,20,0.86) !important;
}

/* Home-2: hide the old extra Featured Creature card block */
body.page-id-952 .kb-row-layout-id_9ecde1-61{
  display: none !important;
}

/* =========================================
   WYRD: stable fixes for Home-2 (page-id-952)
   Paste at VERY BOTTOM of wyrd.css
   ========================================= */

/* 0) Lock Kadence palette to Wyrd colours (fixes the random Kadence blue) */
:root{
  --global-palette1:#160804;
  --global-palette2:#AF7E3A;
  --global-palette3:#F7C06F;
  --global-palette4:#1B1714;
  --global-palette5:#F3E2C3;
  --global-palette6:#E9D7B6;
  --global-palette7:#5B4638;
  --global-palette8:#26140C;
  --global-palette9:#F3E2C3;
}

/* 1) Remove the DUPLICATE featured creature block (the dark blue card) */
body.page-id-952 .kb-row-layout-id_59bf5d-02,
body.page-id-952 .kb-row-layout-id_952_59bf5d-02,
body.page-id-952 .kadence-column952_972e6b-52{
  display: none !important;
}

/* 2) Featured parchment banner: keep centered + readable + responsive */
body.page-id-952 .wyrd-feature-banner{
  box-sizing: border-box !important;
  width: min(1280px, 92vw) !important;
  max-width: 1280px !important;
  margin: 44px auto 36px !important;

  position: relative !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;

  /* responsive padding */
  padding: clamp(18px, 4vw, 44px) clamp(18px, 6vw, 90px) clamp(18px, 4vw, 44px) clamp(18px, 5vw, 54px) !important;
}

/* parchment + shadow that follows the frayed edge */
body.page-id-952 .wyrd-feature-banner::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:0 !important;

  background: url("/wp-content/themes/kadence-wyrd-child/assets/wyrd/parchment-fill-wide-v3.webp")
    center / 100% 100% no-repeat !important;

  filter: drop-shadow(0 18px 40px rgba(0,0,0,.45));
}

body.page-id-952 .wyrd-feature-banner > *{
  position: relative !important;
  z-index: 1 !important;
}

/* force ink colours inside parchment */
body.page-id-952 .wyrd-feature-banner,
body.page-id-952 .wyrd-feature-banner :is(h1,h2,h3,h4,h5,h6,p,span,a){
  color: rgba(27,23,20,.92) !important;
}

body.page-id-952 .wyrd-feature-label{
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

/* stack columns on smaller screens */
@media (max-width: 900px){
  body.page-id-952 .wyrd-feature-cols{
    flex-wrap: wrap !important;
    gap: 20px !important;
  }
  body.page-id-952 .wyrd-feature-cols > .wp-block-column{
    flex-basis: 100% !important;
  }
  body.page-id-952 .wyrd-feature-image img{
    max-width: 620px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* 3) Small cards: ALWAYS use parchment image (your own class, not Kadence IDs) */
body.page-id-952 .wyrd-parchment-card{
  background: transparent !important;
  box-shadow: none !important;
}

body.page-id-952 .wyrd-parchment-card > .kt-inside-inner-col{
  background-color: transparent !important;
  background-image: url("/wp-content/themes/kadence-wyrd-child/assets/wyrd/parchment-fill-card-v6.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;

  border-radius: 10px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;

  padding: 18px 18px 20px !important;
  overflow: hidden !important;
}

/* card text ink */
body.page-id-952 .wyrd-parchment-card :is(h1,h2,h3,h4,h5,h6,p,span){
  color: rgba(27,23,20,.90) !important;
}

/* Home-2: remove the small "Wyrd Archive" label above the main headline */
body.page-id-952 .kt-adv-heading952_1cb977-44{
  display: none !important;
}