/*
Theme Name: Acaraki Rev Theme
Theme URI: https://web.acarakirevitalisasi.com/ 
Author: Rendy Setiotomo
Author URI: https://web.acarakirevitalisasi.com/
Description: Theme for Acaraki Rev
Version: 1.0
License: Commercial
License URI: http://web.acarakirevitalisasi.com/
Tags: green, white
Text Domain: acarakirevitalisasi
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');


/* Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s,
samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus { outline: 0; }
body { background: #fff; line-height: 1; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { font-weight: normal; text-align: left; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; }
del { color: #333; }
ins { background: #fff9c0; text-decoration: none; }
hr { background-color: #ccc; border: 0; height: 1px; margin: 24px; margin-bottom: 1.714285714rem; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
small { font-size: smaller; }
img { border: 0; -ms-interpolation-mode: bicubic; }
.position-relative { position: relative; }
/* =========================
   GLOBAL VIDEO WRAPPER
========================= */

/* Wrapper umum */
.wp-block-embed.is-type-video,
.wp-block-video {
  width: 100%;
  display: flex;
  justify-content: center;
}


/* =========================
   YOUTUBE / IFRAME
========================= */

.wp-block-embed__wrapper {
  width: 100%;
}

/* Default (LANDSCAPE) */
.wp-block-embed__wrapper iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  display: block;
  border-radius: 12px;
}


/* =========================
   VIDEO UPLOAD (DEFAULT = LANDSCAPE)
========================= */

.wp-block-video video {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}


/* =========================
   PORTRAIT VIDEO (AUTO DETECT)
========================= */

/* hanya video yang punya aspect-ratio inline dari WP */
.wp-block-video video[style*="aspect-ratio"] {
  width: auto;
  /*height: 80vh;*/
  max-width: 100%;
  max-height: 80vh;
  margin: 0 auto;
  display: block;
  aspect-ratio: auto !important;
}


/* =========================
   OPTIONAL: BIAR LEBIH RAPI
========================= */

.wp-block-video,
.wp-block-embed {
  margin-bottom: 24px;
}

/* Shadow halus (optional aesthetic) */
.wp-block-video video,
.wp-block-embed iframe {
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}


/* GENERAL */
body {
	font-family: "Inter", sans-serif;;
	font-size: 16px;
	color: #363636;
	background: #ffffff;
}
a { text-decoration: none; }
a:hover { text-decoration: underline; color: #000; }
sup { font-size: 60%; }
strong { font-weight: bold; }
em { font-style: italic; }
.clear { clear: both; }
small { font-size: 12px; }
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
img { border: 0; -ms-interpolation-mode: bicubic; }
.floatright { float: right; }
.floatleft { float: left; }
.floatnone { float: none; }
.none { display: none; }

/* Header */
header .mainmenu { 
    max-width: 980px !important; 
}

/* GENERAL WP */
.wrapper { position: relative; width: 100%; margin: 0 auto; }
.wrap { position: relative; width: 1200px; margin: 0 auto; }
.wrap-content { position: relative; display: block; }
.wrap-content .wrap { position: relative; padding: 10px 0px 15px; }
.wrapper-grey { background: #fff; }

.thecontent h1 { font-family: "Josefin Sans", sans-serif; font-size: 34px; line-height: 38px; font-weight: bold; color:#000000; margin-bottom: 20px;  }
.thecontent h2 { font-family: "Josefin Sans", sans-serif; font-size: 28px; line-height: 32px; font-weight: bold; color:#000000; margin-bottom: 15px; }
.thecontent h3 { font-family: "Josefin Sans", sans-serif; font-size: 20px; line-height: 24px; margin-bottom: 15px; color:#000000; font-weight: bold; }
.thecontent h4 { font-family: "Josefin Sans", sans-serif; font-size: 18px; line-height: 22px; margin-bottom: 15px; color:#000000; }
.thecontent h5 { font-family: "Josefin Sans", sans-serif; font-size: 16px; line-height: 20px; color:#333333; margin-bottom: 15px; }
.thecontent h6 { font-family: "Josefin Sans", sans-serif; font-size: 14px; line-height: 18px; color:#333333; margin-bottom: 15px; }
.thecontent p { font-family: "Inter", sans-serif; font-size: 16px; line-height: 22px; margin-bottom: 15px; color:#333333; }
.thecontent a { font-family: "Inter", sans-serif; color: #109bc5; font-size: 18px; line-height: 22px; cursor: pointer; font-style: normal; font-weight: normal; }
.thecontent a:hover { color: #88bbc8; text-decoration: none; }
.thecontent img { max-width: 100%; height: auto; }
.thecontent img, .thecontent img.alignleft {float: left; display: block; margin: 0px 30px 17px 0px; }
.thecontent img.aligncenter {float: none; margin: 0 auto 17px;  }
.thecontent img.alignright { float: right; margin: 0px 0px 17px 30px;}
.thecontent ul { list-style: disc; margin-bottom: 15px; padding-left: 40px; }
.thecontent ol { list-style: decimal; margin-bottom: 15px; padding-left: 40px; }
.thecontent ul.alpha, .thecontent ol.alpha {list-style-type: lower-alpha; }
.thecontent ul li, .thecontent ol li { font-family: "Inter", sans-serif; font-size: 18px; line-height: 22px; color:#333333; padding-left: 8px; }
.thecontent .section-quote-post { margin: 0px auto; padding: 30px 0px; max-width: 80%; }
.thecontent hr.wp-block-separator { margin: 30px auto; max-width: 300px; width: 70%;}

/* Nav Menu */
.headermobi-sosmed h3 { margin-bottom: 12px; } 
.headermobi-sosmed.none { display: none; }
.headermobi-search.none { display: none; }
.navmenu_shop a {
  align-items: center;
  gap: 6px; /* jarak antara gambar dan teks */
}
.navmenu_shop a::after {
    position: relative;
    content: '';
    display: inline-block;
    width: 20px; /* ukuran gambar */
    height: 20px;
    background-image: url('https://bglib.id/wp-content/uploads/2025/05/shopping-bag-1.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent !important;
    opacity: 1 !important;
}


.elementor-nav-menu--main .separator-none:after {
    display: none;
}
.elementor-nav-menu--main li.nav-highlight {
    background: #875828;
    border-radius: 15px 0 15px 0
}

.elementor-nav-menu--main li.nav-highlight a {
    color: #fff !important;
    padding: 20px 24px !important;
    font-weight: normal !Important;
}
.elementor-nav-menu--main li.nav-highlight:hover {
    background: #CDB369;
}
.elementor-nav-menu--main li.nav-highlight:hover a {
    color: #000 !important;
}

.elementor-nav-menu--main li.nav-highlight a .newnav,.mob-elementor-nav-menu--main li.nav-highlight a .newnav {
    border-top: 35px solid #CB5C33;
    border-left: 35px solid #fff0;
    height: 0;
    width: 0;
    position: absolute;
    top: 0;
    right: 0
}

.elementor-nav-menu--main li.nav-highlight a .newnav:before,.mob-elementor-nav-menu--main li.nav-highlight a .newnav:before {
    content: "NEW";
    color: #fff;
    font-size: 10px;
    line-height: 12px;
    position: absolute;
    bottom: 16px;
    right: 0;
    margin: auto;
    transform: rotate(45deg)
}

.mob-elementor-nav-menu--main li.nav-highlight {
    position: relative
}

.mob-elementor-nav-menu--main li.nav-highlight a .newnav {
    border-top: 35px solid #006838
}

/* Pagination */
.wp-pagenavi { font-family: "Inter", sans-serif; display: block; position: relative; margin: 40px auto 20px; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: bold; text-align: center; padding: 0px !important; }
.wp-pagenavi, .wp-pagenavi a { font-family: "Inter", sans-serif; color: #054D97; border: 0px; font-style: normal; font-weight: normal; font-size: 14px; padding: 10px 17px; }
.wp-pagenavi a:hover { background: #868686; color: #fff; text-decoration: none; }
.wp-pagenavi span.current { background: #054D97; color: #fff; border: 0px; padding: 10px 17px; }
.wp-pagenavi span.pages { background: #054D97; color: #fff; border: 0px; padding: 10px 17px; }

.elementor-pagination { margin-top: 45px !important; }
.elementor-pagination .page-numbers { width: 35px; height: 35px; text-align: center; color: #919191; background: #f8f8f8; display: inline-block;
    vertical-align: middle; border-radius: 50%; line-height: 35px; box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2); }
.elementor-pagination .page-numbers:hover { background: #875828; color: #ffffff; }
.elementor-pagination .page-numbers.current { background: #875828; color: #ffffff; }

.gallery-wrapper {
    width: 100%;
    max-width: 100%;
}
.wrapper_productloop .elementor-loop-container { display: block; }
.wrapper_productloop .slidernav img { padding: 10px 5px; cursor: pointer; }
.wrapper_productloop .slick-prev { left: 0px; }
.wrapper_productloop .slick-next { right: 0px; }
.wrapper_productloop .slick-prev, .wrapper_productloop .slick-next { z-index: 10; }
.wrapper_productloop .slick-prev:before, .wrapper_productloop .slick-next:before { color: #333333; }

/* Custom Web Acaraki Rev */
.thecontent .wp-block-group .item-image img { width: 100%; max-width: 100%; height: auto; float: none; margin: 0 auto; }
.zigzag-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.e-widget-swiper .elementor-swiper-button {
    opacity: 0;
}
.e-widget-swiper:hover .elementor-swiper-button {
    opacity: 1;
}



/* Forces all slides to stretch to the height of the tallest slide */
.swiper-slide {
  height: auto !important;
}

/* Ensure content inside the slide also fills the available height */
.swiper-slide > div, 
.swiper-slide > .card {
  height: 100%;
}
.zigzag-item {
  width: 100%;
}

.swiper-button-next,
.swiper-button-prev {
  color: #000;
}

.swiper-pagination-bullet-active {
  background: #000;
}
.swipper-wrap .swiper-button-prev, 
.swipper-wrap .swiper-button-next {
    width: 25px;
    height: 25px;
    color: #5d686f;
}
.swipper-wrap .swiper-button-prev:hover, 
.swipper-wrap .swiper-button-next:hover {
    color: #3C4449;
}
.swipper-wrap .swiper-button-prev:after, 
.swipper-wrap .swiper-button-next:after {
    font-size: 25px;
}

.swipper-wrap .swiper-button-prev, 
.swipper-wrap .swiper-rtl .swiper-button-next{
    left: -20px;
    opacity: 0;
}
.swipper-wrap .swiper-button-next, 
.swipper-wrap .swiper-rtl .swiper-button-prev {
    right: -20px;
    opacity: 0;
}
.swipper-wrap:hover .swiper-button-prev, 
.swipper-wrap:hover .swiper-button-next {
    opacity: 1;
}

.wrap-contactform .wpforms-container {
    margin: 0px auto;
}
.wrap-contactform .wpforms-container .wpforms-field, 
.wrap-contactform .wp-core-ui div.wpforms-container .wpforms-field {
	padding: 0px 0px 15px;
}
.wrap-contactform .wpforms-container input.wpforms-field-medium, 
.wrap-contactform .wpforms-container select.wpforms-field-medium, 
.wrap-contactform .wpforms-container .wpforms-field-row.wpforms-field-medium, 
.wrap-contactform .wp-core-ui div.wpforms-container input.wpforms-field-medium, 
.wrap-contactform .wp-core-ui div.wpforms-container select.wpforms-field-medium, 
.wrap-contactform .wp-core-ui div.wpforms-container .wpforms-field-row.wpforms-field-medium {
	max-width: 100%;
}
.wrap-contactform .wpforms-submit {
	width: 160px;
}


/* responsive */
@media only screen and (max-width: 450px) {
    .thecontent img { float: none; width: 100%; margin: 0 auto 17px; }
    .sectionpost-reverse {
        flex-direction: column-reverse;
    }
}