/*
Theme Name:     Kadence Child
Theme URI:      n/a
Template:       kadence
Author:         Kadence WP
Author URI:     n/a
Description:    This is the child theme of Kadence
Version:        1.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/
@font-face {
    font-family: 'ITC Souvenir';
    src: url('../fonts/Souvenir-Medium.woff2') format('woff2'),
        url('../fonts/Souvenir-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ITC Souvenir';
    src: url('../fonts/Souvenir-Bold.woff2') format('woff2'),
        url('../fonts/Souvenir-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ITC Souvenir';
    src: url('../fonts/Souvenir-Demi.woff2') format('woff2'),
        url('../fonts/Souvenir-Demi.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benguiat Pro ITC Book';
    src: url('../fonts/BenguiatProITC-Book.woff2') format('woff2'),
        url('../fonts/BenguiatProITC-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benguiat Pro ITC Book';
    src: url('../fonts/BenguiatProITC-Bold.woff2') format('woff2'),
        url('../fonts/BenguiatProITC-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ITC Souvenir Std';
    src: url('../fonts/SouvenirStd-Light.woff2') format('woff2'),
        url('../fonts/SouvenirStd-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

h1, h2, h3 {
    font-family: 'Benguiat Pro ITC Book' !important;
}
p{font-family: 'ITC Souvenir Std';}

.home-banner:after {
    content: "";
    background-image: url(https://chooseyourownadventure.kinsta.cloud/wp-content/uploads/2025/09/fish.png);
    position:absolute; 
    bottom:0;   
    width:29.5%; 
    height:25%; 
    right:0;  
    background-repeat: no-repeat;   
    background-position: bottom right;     
    background-size: contain;
}

.home-banner:before {
    content: "";
    background-image: url(https://chooseyourownadventure.kinsta.cloud/wp-content/uploads/2025/09/octopus.png);
    position:absolute; 
    width:22.5%; 
    height:55%; 
    right:0;    
    background-size: contain; 
    background-repeat: no-repeat; 
    animation: octopus-float 4s ease-in-out infinite;
}

@keyframes octopus-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-30px);
    }
}

.scroll-line-wrapper {
    display: block;
    position: relative;
}

#scroll-line {
    position: absolute;
    top: 0;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 30px;
    background-color: #000;
    cursor: pointer;
    --final-height: 300px; /* Default fallback */
    transition: height 0.7s ease-out;
}

#scroll-line::before {
    content: "";
    position: absolute;
    top: -9px;
    left: 50%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    border: 2px solid #000;
    border-radius: 50%;
}

#scroll-line::after {
    content: "";
    position: absolute;
    bottom: -9px;
    left: 50%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    border: 2px solid #000;
    background-color: #000;
    border-radius: 50%;
}

#scroll-line.animate-to-retro {
    animation: growToRetro 2s ease-out forwards;
}

@keyframes growToRetro {
    from {
        height: 10px;
    }
    to {
        height: var(--final-height);
    }
}

.categorySlider {
  width: 100%;
  padding: 20px 0;
}

.categorySlider .swiper-wrapper {
	display: flex;
   	align-items: stretch;
   	height: auto;
    box-sizing: border-box;
    margin-bottom: 40px;
}

.categorySlider .swiper-slide {
  height: auto !important;
}

.categorySlider .cat-card {
    position: relative;
    border: 2px solid #000;
    border-radius: 73px 73px 0px 0px;
    text-align: center;
    box-sizing: border-box;
}
.categorySlider .cat-card .cat-image {
  width: 100%;
  height: 250px;
  overflow: hidden;
  border-radius: 73px 73px 0px 0px;
}

/* Image itself */
.categorySlider .cat-card .cat-image img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  display: block;
}
.categorySlider .cat-detail {
    padding: 20px;
}
.categorySlider .cat-card::before, .categorySlider .cat-card::after {
 content: "";
    position: absolute;
    bottom: -2px;
    left: -2px;
    width: 20px;
    height: 35px;
    background: #FFFBF8;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
}
.categorySlider .cat-card::after {
    right: -2px;
    left: inherit;
    border-right: 0;
    border-left: 2px solid #000;
}
.categorySlider .cat-card h3 {
  font-size: 36px;
  text-transform: uppercase;
  margin: 10px 0;
  color: #fff;     letter-spacing: 0;
}

.categorySlider .cat-card p {
    margin-bottom: 8px;
    color: #fff; text-align: left;
    min-height: 66px;
}

.categorySlider .cat-card a.btn {
	display: inline-block;
	padding: 10px 30px;
	background: #fff;
	border: 1px solid var(--global-palette4, #2D3748);
	color: #000;     text-decoration: none;
	font-size: 14px;
    border-radius: 20px;
    padding: 7px 50px;
    box-shadow: 0px 4px 0px 0px var(--global-palette4, #2D3748);
}

.categorySlider .cat-card a.btn:hover {
  background: #edf2f7;
}
.categorySlider .swiper-pagination {
  display: flex !important;
  justify-content: center;
  align-items: center;
  position: relative;
  bottom: 0;
  z-index: 10;
}

/* Bullets (circles) */
.categorySlider .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #fff;
  border: 1px solid #000;
  opacity: 1;
  margin: 0 50px; /* space between circles */
  border-radius: 50%;
  position: relative;
  transition: background 0.3s ease, transform 0.3s ease;
  z-index: 1;
}

/* Active bullet */
.categorySlider .swiper-pagination-bullet-active {
  background: #000; /* filled */
  
}

/* Line to connect bullets */
.categorySlider .swiper-pagination-bullet::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -31px;
    width: 31px;
    height: 2px;
    background: #000;
    transform: translateY(-50%);
    z-index: -1;
}

/* Hide line after last bullet */
.categorySlider .swiper-pagination-bullet:last-child::after {
  display: none;
}

.categorySlider .swiper-button-prev,
.categorySlider .swiper-button-next {
  display: none;
}


/********** Filter *******************/
.wpc-filter-title {
font-weight: 500;
}
.type-book .entry-content-wrap {
    display: none;
}
.wp-site-blocks .post-thumbnail {
    display: block;
    padding: 0;
    height: auto;
}
.wp-site-blocks .post-thumbnail .post-thumbnail-inner {
position: relative;
height: 538px;
}
.wpc-filters-section-903 {
    border-top: 1px solid #1F1F1F;
    border-bottom: 1px solid #1F1F1F;
    padding-top: 20px;
    padding-bottom: 17px;
    margin-bottom: 25px !important;
}
.top-filters .wpc-filter-title {
    justify-content: center;
}

@media screen and (min-width: 768px){
    .top-filters .wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item label span.wpc-filter-label-wrapper{
        padding: 7px 50px;
        box-shadow: 0px 4px 0px 0px var(--global-palette4, #2D3748);
        border-radius: 20px; font-size:14px;
        border: 1px solid #000000;
    }
}

.top-filters .wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item label, .wpc-filters-main-wrap input.wpc-label-input+label:hover span.wpc-filter-label-wrapper {
    border-radius: 20px;
}
.top-filters .wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item label {
    margin-right: 24px;
}
.top-filters .widget, .top-filters .wpc-filters-section {
    margin-bottom: 0;
}
.side-filters .wpc-filter-title {
    font-size: 15px;
    line-height: 18px; text-transform: uppercase;
    margin-bottom: 17px; color:#333333;
}
.wpc-filters-main-wrap input[type=checkbox], .wpc-filters-main-wrap input[type=radio]{ 
       width: 15px;
    height: 15px;
    border: 1px solid #504C4C; margin-right: 10px;
    min-width: 15px;
}
body .wpc-filters-main-wrap .wpc-term-item-content-wrapper {
    font-size: 16px;
    color: #000;
}
.wpc-filters-section {  margin-bottom: 20px;}

.book-gallery .kb-gallery-ul img {
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  box-shadow: none;
  opacity: 0.85;
}

.book-gallery .kb-gallery-ul img.active-thumb {
  border: 2px solid #2D3748;
}
.book-gallery .kb-gal-image-radius {
    max-width: 215px !important;
}
.book-buy-btn{
    padding-top: 1.5rem;
} 
.book-buy-btn .kt-blocks-modal-link {
    width: 100%;
}

.sub-section {
    position: relative;
}

.sub-img {
    position: absolute;
    top: 0;
}

/* animate sub-img - top stays fixed, bottom undulates in an arc */
.sub-img {
    transform-origin: top center;
}


.kt-tabs-wrap .wp-block-kadence-tab {
    border: none;
}

.klaviyo-form button {
    font-family: "ITC Souvenir Std", serif !important;
    font-weight: 400 !important;
    box-shadow: 0px 4px 0px 0px #000 !important;
    padding: 0 70px !important;
}

.kt-blocks-page-nav .pagination .nav-links>a, .kt-blocks-page-nav .pagination .nav-links>span {
    color: #777;
}

.kt-blocks-page-nav .pagination .nav-links>.current {
    color: #fff;
}

.yarpp-thumbnails-horizontal .yarpp-thumbnail {
    border: none !important;
    height: auto !important;
}

.yarpp-thumbnails-horizontal .yarpp-thumbnail-title {
    display: none !important;
}

.yarpp-thumbnail > img, .yarpp-thumbnail-default {
    height: auto !important;
}

.wpc-filters-main-wrap input[type=checkbox]:checked {
    background-color: #000;
}

.wpc-filters-main-wrap input[type=checkbox]:checked:after {
    display: none;
}

.bubble-wrap {
    display: none;
}

@media (min-width: 1025px) {
    .bubble-wrap {
        display: block;
    }
}

.bubble-wrap {
    position: absolute;
    overflow: hidden;
    width: 100px;
    height: 200px;
    top: 280px;
    left: 360px; 
    /* fade zone at top + bottom */
    -webkit-mask-image: linear-gradient(to bottom,
        transparent 0%,
        #000 12%,
        #000 88%,
        transparent 100%
    );
    mask-image: linear-gradient(to bottom,
        transparent 0%,
        #000 12%,
        #000 88%,
        transparent 100%
    );
}

/* If the SVG should fill the section */
.bubble-wrap svg {
    position: absolute;
    inset: 0;
    display: block;
    width: 100px;
    height: 200px;
}

/* Animate each bubble path */
.bubble {
  fill: transparent !important;
  stroke: #000; 
  stroke-width: 1px;
  opacity: 1;
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  transform-origin: center;
  animation-name: bubbleFloat;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform, opacity;
}

/* Base animation */
@keyframes bubbleFloat {
  0%   { transform: translate(var(--x, 0%), 900px); opacity: 0; }
  10%  { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translate(calc(var(--x, 0%) + var(--drift, 0%)), calc(-1100px * var(--rise, 1))); opacity: 0; }
}

.bubble { animation: bubbleFloat linear infinite; }

/* 37 bubbles — steady coverage */
.b1  { --x: 6%;  --drift:  3%; animation-duration: 32s; animation-delay: -0s;  }
.b2  { --x: 12%; --drift: -3%; animation-duration: 33s; animation-delay: -2s;  }
.b3  { --x: 18%; --drift:  2%; animation-duration: 31s; animation-delay: -4s;  }
.b4  { --x: 24%; --drift: -4%; animation-duration: 34s; animation-delay: -6s;  }
.b5  { --x: 30%; --drift:  4%; animation-duration: 32s; animation-delay: -8s;  }
.b6  { --x: 36%; --drift: -2%; animation-duration: 35s; animation-delay: -10s; }
.b7  { --x: 42%; --drift:  5%; animation-duration: 33s; animation-delay: -12s; }
.b8  { --x: 48%; --drift: -3%; animation-duration: 32s; animation-delay: -14s; }
.b9  { --x: 54%; --drift:  3%; animation-duration: 34s; animation-delay: -16s; }
.b10 { --x: 60%; --drift: -4%; animation-duration: 31s; animation-delay: -18s; }
.b11 { --x: 66%; --drift:  2%; animation-duration: 35s; animation-delay: -20s; }
.b12 { --x: 72%; --drift: -5%; animation-duration: 33s; animation-delay: -22s; }
.b13 { --x: 78%; --drift:  4%; animation-duration: 32s; animation-delay: -24s; }
.b14 { --x: 84%; --drift: -2%; animation-duration: 34s; animation-delay: -26s; }
.b15 { --x: 90%; --drift:  3%; animation-duration: 31s; animation-delay: -28s; }
.b16 { --x: 10%; --drift: -4%; animation-duration: 36s; animation-delay: -30s; }
.b17 { --x: 20%; --drift:  2%; animation-duration: 33s; animation-delay: -32s; }
.b18 { --x: 28%; --drift: -3%; animation-duration: 32s; animation-delay: -34s; }
.b19 { --x: 38%; --drift:  4%; animation-duration: 35s; animation-delay: -36s; }
.b20 { --x: 46%; --drift: -2%; animation-duration: 31s; animation-delay: -38s; }
.b21 { --x: 56%; --drift:  5%; animation-duration: 34s; animation-delay: -40s; }
.b22 { --x: 64%; --drift: -3%; animation-duration: 33s; animation-delay: -42s; }
.b23 { --x: 74%; --drift:  3%; animation-duration: 32s; animation-delay: -44s; }
.b24 { --x: 82%; --drift: -4%; animation-duration: 35s; animation-delay: -46s; }
.b25 { --x: 92%; --drift:  2%; animation-duration: 33s; animation-delay: -48s; }
.b26 { --x: 14%; --drift: -5%; animation-duration: 34s; animation-delay: -50s; }
.b27 { --x: 26%; --drift:  4%; animation-duration: 31s; animation-delay: -52s; }
.b28 { --x: 34%; --drift: -2%; animation-duration: 36s; animation-delay: -54s; }
.b29 { --x: 44%; --drift:  3%; animation-duration: 33s; animation-delay: -56s; }
.b30 { --x: 52%; --drift: -4%; animation-duration: 32s; animation-delay: -58s; }
.b31 { --x: 62%; --drift:  2%; animation-duration: 35s; animation-delay: -60s; }
.b32 { --x: 70%; --drift: -3%; animation-duration: 34s; animation-delay: -62s; }
.b33 { --x: 80%; --drift:  5%; animation-duration: 33s; animation-delay: -64s; }
.b34 { --x: 88%; --drift: -2%; animation-duration: 32s; animation-delay: -66s; }
.b35 { --x: 16%; --drift:  4%; animation-duration: 35s; animation-delay: -68s; }
.b36 { --x: 58%; --drift: -3%; animation-duration: 34s; animation-delay: -70s; }
.b37 { --x: 96%; --drift:  2%; animation-duration: 33s; animation-delay: -72s; }

/* Vertical rise multipliers (buoyancy variation) */

.b1  { --rise: 1.15; }
.b2  { --rise: 0.95; }
.b3  { --rise: 1.25; }
.b4  { --rise: 0.85; }
.b5  { --rise: 1.10; }
.b6  { --rise: 1.30; }
.b7  { --rise: 0.90; }
.b8  { --rise: 1.20; }
.b9  { --rise: 0.88; }
.b10 { --rise: 1.05; }

.b11 { --rise: 1.35; }
.b12 { --rise: 0.92; }
.b13 { --rise: 1.18; }
.b14 { --rise: 0.80; }
.b15 { --rise: 1.28; }
.b16 { --rise: 0.97; }
.b17 { --rise: 1.12; }
.b18 { --rise: 0.87; }
.b19 { --rise: 1.32; }
.b20 { --rise: 0.90; }

.b21 { --rise: 1.22; }
.b22 { --rise: 0.95; }
.b23 { --rise: 1.08; }
.b24 { --rise: 0.82; }
.b25 { --rise: 1.30; }
.b26 { --rise: 0.92; }
.b27 { --rise: 1.18; }
.b28 { --rise: 0.88; }
.b29 { --rise: 1.26; }
.b30 { --rise: 0.96; }

.b31 { --rise: 1.10; }
.b32 { --rise: 0.84; }
.b33 { --rise: 1.34; }
.b34 { --rise: 0.91; }
.b35 { --rise: 1.16; }
.b36 { --rise: 0.86; }
.b37 { --rise: 1.24; }

/* Optional: drift side-to-side while rising */
@keyframes bubbleDrift{
  0%   { transform: translate(0, 25%); }
  50%  { transform: translate(2%, -50%); }
  100% { transform: translate(-2%, -125%); }
}

/* If you want drift instead of straight rise, swap animation-name:
   .bubble { animation-name: bubbleDrift; }
*/

.home .mobile-site-branding.site-branding a.brand {
    display: none;
}

.home .mobile-site-branding.site-branding a.brand.is-visible {
    display: block;
    display: flex;
}