/*
Theme Name: Castle Hardware
Theme URI: http://zarrtechnologies.com
Author: Zarr Technologies
Author URI: http://zarrtechnologies.com/
Description: Castle Hardware WordPress Theme
Version: 1.0
Text Domain: castle-hardware
*/

#contents p {
  margin-bottom: 20px;
}

#contents .page-enquiry p {
  margin-bottom: 0px;
}

.inner-pages {
  min-height: 200px;
  line-height: 1.6;
}

.alignright {
  float: right;
  margin-left: 20px;
  margin-bottom: 10px;
}

.alignleft {
  float: left;
  margin-right: 20px;
  margin-bottom: 10px;
}

.contact-enquiry {}

.contact-enquiry h1 {
  text-align: left;
}

.ce-details {
  float: left;
  width: 50%;
}

.ce-form {
  float: left;
  width: 50%;
}

/* .header-nav ul li.menu-item-has-children > a {
  pointer-events: none;
  cursor: pointer;
} */

/*or*/

/* .header-nav ul li.page_item_has_children > a {
  pointer-events: none;
  cursor: pointer;
} */

.inner-page-text img {
  max-width: 100%;
  height: auto;
}

.since1996 {
  text-align: right;
  margin-top: 10px;
}

.contact-page-sec {
  display: flex;
  gap: 30px;
}

.cps-col-sec {
  width: 50%;
}

@media (max-width: 768px) {
  .contact-page-sec {
    flex-direction: column;
  }

  .cps-col-sec {
    width: 100%;
  }
}

.wp-cat-id-30,
.wp-cat-id-31 {
  display: none;
}

.collapse {
  visibility: unset !important;
}

/* mega menu full width */

#header .header-inner {
  position: relative !important;
}

@media (max-width: 767px) {
  #header .header-inner {
    position: unset !important;
  }
}

#mega-menu-wrap-header-nav #mega-menu-header-nav>li.mega-menu-megamenu>ul.mega-sub-menu,
#mega-menu-wrap-header-nav #mega-menu-header-nav>li.mega-menu-flyout ul.mega-sub-menu {
  top: 36px;
}

.menu-menu2-container .menu-menu2 li {
  padding: 10px 0;
}

/* wc  */

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
  display: none;
}

.woocommerce-Tabs-panel--description {
  display: unset !important;
}

#mega-menu-wrap-header-nav #mega-menu-header-nav>li.mega-menu-item {
  margin-left: 2px !important;
}

.container::before,
.container::after {
  display: none !important;
}@import url(https://fonts.googleapis.com/css?family=Poppins:400,300,500,600,700);


/* font-family: "Poppins", sans-serif; */

/* ==============================================
    General
============================================== */
:root {
  --color-p-1: #eaae00;
  --color-p-2: #fbf5e9;

  --color-s-1: #332600;
  --color-s-2: #aa8e3e;

  --color-b-1: #000000;
  --color-b-2: #555555;

  --color-w-1: #ffffff;
}

html,
body {
  @apply md:overflow-x-hidden;
}

html {
  font-size: 14px;
  scroll-behavior: smooth;
}

body {
  font-size: 14px;
  padding: 0;
  margin: 0;
  line-height: 1.8;
  color: var(--color-b-2);
  background-color: #fffdf6;
  font-family: "Inter", sans-serif;
  font-weight: normal;
  @apply py-7 sm:py-0;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

::selection {
  background-color: #ad6f3f;
  color: var(--color-w-1);
}

/* pppppppppp  */
p {
  line-height: 1.8;
  font-size: 14px;
  color: var(--color-b-2);
}

p:last-child {
  margin-bottom: 0;
}

/* aaaaaaaaa */
a {
  outline: none !important;
  text-decoration: none;
  transition: 0.3s all ease-in-out;
  -webkit-transition: 0.3s all ease-in-out;
  -moz-transition: 0.3s all ease-in-out;
  -ms-transition: 0.3s all ease-in-out;
  -o-transition: 0.3s all ease-in-out;
}

a:hover,
a:focus,
select:focus,
button:focus {
  outline: none;
  text-decoration: none;
  color: var(--color-p-1);
}

a:hover {
  color: var(--color-p-2);
}

img {
  border: none;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}

ul,
ol {
  margin: 0;
}

li {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  line-height: 1;
  margin-bottom: 10px;
  outline: none !important;
  color: var(--color-b-2);
  font-weight: 400;
  font-size: 36px;
}

h1,
h2 {
  @apply text-2xl md:text-xl font-bold font-CormorantGaramond text-s-1;
}

h3 {
  @apply text-lg md:text-md font-bold font-CormorantGaramond text-s-1 leading-[1.2];
}

h4 {
  @apply text-md font-bold font-CormorantGaramond text-s-1;
}

h5 {
  @apply text-sm;
}

h6 {
  @apply text-xs;
}

/* basic css end  */

/* css start */

.dark-sec {
  @apply text-w-1;
}

.my-sec {
  @apply py-[80px] xl:py-[75px] md:py-[60px] sm:py-[50px];
}

span {
  @apply text-p-1;
}

.btn-p {
  @apply bg-gradient-to-r from-p-1 to-s-1 text-white text-[16px] py-[12px] px-[26px] rounded-full inline-block text-center font-medium md:py-[10px] md:px-[15px] md:text-[14px];

  transition:
    color 0.5s ease,
    box-shadow 0.5s ease,
    background-image 0.5s ease;
}

.btn-p:hover {
  @apply from-s-1 to-s-1 text-w-1 shadow-lg;
}

/* ===============================
   Slider
================================ */

.pogoSlider {
  @apply min-h-[625px] lg:min-h-[520px] sm:min-h-[800px] pb-0;
}

.pogoSlider .container {
  @apply h-full;
}

.pogoSlider-slide {
  @apply bg-center bg-cover h-full;
}

.slide-content {
  @apply relative flex justify-between items-center sm:flex-col sm:text-center sm:justify-center;
}

.slide-content .row {
  @apply flex items-center;
}

.pogoSlider-dir-btn {
  @apply border border-black/70;
}

.pogoSlider-dir-btn:hover {
  @apply border-black;
}

.pogoSlider {
  padding-bottom: 38% !important;
}

.pogoSlider-dir-btn--next {
  right: 0;
}

.pogoSlider-dir-btn--prev {
  left: 0;
}

.owl-nav {
  display: flex !important;
  justify-content: space-between;
  position: absolute;
  top: 40%;
  left: -40px;
  right: -40px;
}

.owl-nav button {
  width: 44px !important;
  height: 44px !important;
  border-radius: 9999px !important;
  background: #fff !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1) !important;
}

.owl-nav button:hover {
  background: white !important;
}



/* --- NAV LINK EFFECT --- */

.nav-link {
  @apply relative transition duration-300;
}

.nav-link::before {
  content: "";
  @apply absolute left-0 -top-[31px] w-0 h-[2px] bg-p-1 transition-all duration-300;
}

.nav-link:hover::before {
  @apply w-full;
}

.nav-link.active::before {
  @apply w-full;
}

.nav-link.active {
  @apply text-w-1;
}

.sidebar-menu {
  @apply flex items-center justify-between px-4 py-4 border-b border-p-2 hover:bg-p-1 hover:rounded-lg hover:text-white transition-all duration-300
}

/* Product Section  */
.product-slider {
  @apply relative px-6 md:px-0;
}

.product-slider .owl-stage-outer {
  @apply pb-7;
}

.product-slider .owl-item {
  padding: 10px 0 12px;
}

.owl-item active {
  @apply !mr-0
}

.product-card {
  @apply cursor-pointer bg-white rounded-[20px] overflow-hidden transition-all duration-500;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .05),
    0 10px 25px rgba(0, 0, 0, .08);
}

.product-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(80, 80, 80, 0.14),
    0 8px 20px rgba(80, 80, 80, 0.1);
}

.product-card img {
  @apply block w-full sm:h-[220px] object-cover;
  transition: transform .5s ease;
}

.product-card:hover img {
  transform: scale(1.08);
}

.product-content {
  @apply p-5;
}


/* Owl Nav Buttons */
.product-slider .owl-nav {
  @apply absolute md:left-0 md:right-0 md:top-1/2 flex justify-between items-center;
  transform: translateY(-50%);
  padding: 0 10px;
}

.product-slider .owl-nav button {
  @apply w-[40px] h-[40px] bg-white rounded-full flex items-center justify-center;
  border: 1px solid #332600 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

.product-slider .owl-prev {
  @apply left-3 lg:left-0;
}

.product-slider .owl-next {
  @apply right-3 lg:right-0;
}

.product-slider .owl-nav i {
  @apply text-[30px] text-[#444];
}

/* Castle Guarantee */
.guarantee-grid {
  @apply grid grid-cols-3 md:grid-cols-1 lg:grid-cols-2 gap-8;
}

.guarantee-card {
  @apply relative bg-white rounded-3xl p-7 shadow-sm hover:shadow-lg transition-all duration-300;
}

.icon-wrapper {
  @apply absolute -top-6 left-6 w-20 h-20 sm:w-16 sm:h-16 rounded-full bg-[#d9a31b] text-white flex items-center justify-center;
}

.icon-wrapper img {

  @apply sm:w-7;
}

.card-image {
  @apply w-full md:h-56 object-cover rounded-2xl mb-6;
}

.feature-list {
  @apply space-y-5;
}

.feature-item {
  @apply flex gap-4 items-start;
}

.number-badge {
  @apply w-9 h-9 rounded-full bg-[#f0d687] text-s-1 text-xs font-bold flex items-center justify-center shrink-0;
}

.feature-item h5,
.feature-heading {
  @apply font-semibold text-s-1 mb-0;
}

.check-list {
  @apply flex items-start gap-2 pb-4;
}

.check-list p {
  @apply !-mt-1 font-medium;
}

/* enquiry-section  */
.enquiry-wrapper {
  @apply grid grid-cols-2 md:grid-cols-1 overflow-hidden rounded-[30px] md:mx-5 bg-p-2;
}

.enquiry-image img {
  @apply w-full h-full object-cover md:rounded-tl-[30px] md:rounded-tr-[30px];
}

.enquiry-content {
  @apply flex flex-col justify-center p-16 md:py-10 md:px-6 lg:p-12;
}

.enquiry-form {
  @apply flex flex-col gap-4;
}

/* Common Input */

.input-p {
  @apply h-14 sm:h-[42px] px-6 rounded-full bg-white border border-s-2 outline-none text-xs placeholder:text-s-2 focus:border-s-2;
}

.input-p:focus {
  box-shadow: 0 4px 14px rgba(159, 121, 2, 0.18);
}

.enquiry-note {
  @apply text-center text-sm text-[#666] mt-8;
}




/* Footer Section */

.footer-top {
  @apply grid grid-cols-3 lg:grid-cols-2 sm:grid-cols-1 gap-[35px] md:gap-[40px] xl:gap-[60px];
}

.footer-logo {
  @apply mb-[30px] sm:w-64;
}

.footer-col h5 {
  @apply font-bold mb-[28px] text-w-1 font-CormorantGaramond uppercase;
}

.footer-col ul {
  @apply list-none p-0 m-0;
}

.footer-col ul li {
  @apply mb-4;
}

.footer-col ul li a {
  @apply no-underline transition-all duration-300 hover:text-p-1;
}

.contact-list li {
  @apply flex items-start gap-3 leading-[1.8];
}

.contact-list img {
  @apply w-[20px];
}