/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.5.1762799095
Updated: 2025-11-10 18:24:55

*/

/* KASSELHOOP CHEESE - STYLESHEET */

/*
    * TYPOGRAPHY
    * BUTTONS
    * GLOBAL STYLES
    * FORMS
    * MEDIA QUEIRES
*/

:root {

    /* COLOURS */
    --color-orange-brown: #D4A373;
    --color-sage-green: #7C8C6C;
    --color-primary-black: #2F2A26;
    --color-black: #000000;
    --color-primary-white: #F5F2EB;
    --color-white: #ffffff;
    --color-alt-white: ##FBFAF7;

    /* EFFECTS */
    --vfx: all 0.3s ease-in-out;
}

/* TYPOGRAPHY */

h1 {
    font-size: clamp(2.8125rem, 2.625rem + 0.9375vw, 3.75rem);
}

h2 {
    font-size: clamp(2.375rem, 2.225rem + 0.75vw, 3.125rem);
}

.h2-large h2 {
	font-size: clamp(2.8125rem, 2.625rem + 0.9375vw, 3.75rem);
}

h3 {
    font-size: clamp(1.5625rem, 1.5rem + 0.3125vw, 1.875rem);
}

.h3-small h3 {
	font-size: clamp(1.125rem, 1.0375rem + 0.43750000000000006vw, 1.5625rem) !important;
}

h4 {
    font-size: clamp(1.125rem, 1.0625rem + 0.3125vw, 1.4375rem);
}

/* BUTTONS */

.orange-brown-btn a {
    padding: 0.8rem 1.25rem;
    background-color: var(--color-orange-brown);
    color: var(--color-primary-white);

    transition: var(--vfx) !important;

    &:hover {
        background-color: var(--color-sage-green) !important;
    }
}

.white-btn a {
    padding: 0.8rem 1.25rem;
    background-color: var(--color-white);
    color: var(--color-primary-black) !important;

    transition: var(--vfx) !important;

    &:hover {
        background-color: var(--color-orange-brown) !important;
    }
}

.black-txt-btn a {
    padding: 0 !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    background-color: transparent;
    color: var(--color-primary-black) !important;

    transition: var(--vfx) !important;

    &:hover {
        color: var(--color-orange-brown) !important;
    }
}

.black-txt-btn a .elementor-button-icon {
	transition: var(--vfx) !important;
    padding-top: 1px;
    width: 15px;
}

.black-txt-btn a:hover .elementor-button-icon {
	transform: translateX(5px);
}

.black-txt-btn a:hover .elementor-button-icon svg path {
	stroke: var(--color-orange-brown);
}

/* GLOBAL STYLES */

html,
body {
    overflow-x: hidden;
    width: 100%;
    scroll-behavior: smooth;
}

.main-header {
  transition: background-color var(--vfx), color var(--vfx);
  background-color: transparent !important; /* starting state */
}

.main-header.scrolled {
  background-color: var(--color-white) !important;
}

/* Line under the header */
.main-header .main-header-child {
  position: relative;
}

.main-header .main-header-child::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%; /* 4rem inset on each side */
  height: 1px;
  background-color: #2F2A2620;
  transition: all 0.6s ease;
}

/* When scrolled, line extends to 100vw (full viewport width) */
.main-header.scrolled .main-header-child::after {
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
}

.menu-items ul a {
  position: relative;
}

.menu-items ul a::after {
  content: "";
  position: absolute;
  bottom: -0.5rem;
  left: 0;
  height: 1px;
  width: 0;
  background: var(--color-orange-brown);
  transition: width 0.3s ease-in-out;
}

.menu-items ul a:hover::after {
  width: 100%;
}

.down-arrow svg {
  border: 1px solid var(--color-primary-black);
  border-radius: 50%;
  transition: var(--vfx);
}

.down-arrow:hover svg {
  border-color: var(--color-sage-green);
  background-color: var(--color-sage-green);
}

.down-arrow:hover svg path {
  fill: var(--color-primary-white) !important;
}

.footer-links a {
    color: var(--color-primary-black) !important;
    transition: var(--vfx) !important;

    &:hover {
        color: var(--color-orange-brown) !important
    }
}

.footer-links span {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.5rem !important;
}

.about-farm-gallery img {
	height: 800px !important;
    width: 100% !important;
	object-fit: cover !important;
}

.about-farm-gallery .elementor-swiper-button-next {
	transform: translateY(-550px) translateX(-50px) !important;
    border: solid 1px var(--color-primary-black) !important;
    border-radius: 50px !important;
    transition: var(--vfx) !important;
}

.about-farm-gallery .elementor-swiper-button-prev {
	transform: translateY(-550px) translateX(calc(100vw - 200px)) !important;
    border: solid 1px var(--color-primary-black) !important;
    border-radius: 50px !important;
    transition: var(--vfx) !important;
}

.about-farm-gallery .elementor-swiper-button-next:hover {
    background-color: var(--color-sage-green) !important;
    border-color: var(--color-sage-green) !important;
}

.about-farm-gallery .elementor-swiper-button-prev:hover {
    background-color: var(--color-sage-green) !important;
    border-color: var(--color-sage-green) !important;
}

.about-farm-gallery .elementor-swiper-button-prev:hover svg path,
.about-farm-gallery .elementor-swiper-button-next:hover svg path {
    fill: var(--color-primary-white) !important;
}

.team-member-card img,
.product-card img {
    transition: var(--vfx) !important;
}

.team-member-card:hover img,
.product-card:hover img {
    transform: scale(1.1) !important;
}

.description-txt p {
    font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem) !important;
}

.product-card .product-arrow svg {
	transform: translateX(-10px) !important;
	transition: var(--vfx) !important;
}

.product-card:hover .product-arrow svg {
	transform: translateX(0) !important;
	transition: var(--vfx) !important;
}

/* PRODUCT CAROUSEL */

.kh-thumb-gallery img {
    border: 2px solid transparent;
    transition: 0.2s ease;
    border-radius: 0 !important;
}

.kh-thumb-gallery img:hover {
    border-color: #ccc;
}

.kh-thumb-gallery img.active-thumb {
    border-color: #000;
}

/* Thumbnail wrapper container */
.kh-thumb-gallery {
    display: flex;
    gap: 0.75rem;     /* spacing between thumbs */
    margin-top: 1rem;
    flex-wrap: wrap;
}

/* Thumbnail item */
.kh-thumb-item {
    width: 6.0625rem !important;      /* requested width */
    height: 6.0625rem !important;     /* requested height */
    flex-shrink: 0;        /* prevents shrinking in flexbox */
    display: block;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 0 !important;
    overflow: hidden;
    cursor: pointer;
    background: transparent;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

/* Thumbnail image */
.kh-thumb-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Hover State */
.kh-thumb-item:hover {
    border-color: #BFBFBF;
}

/* Active Slide Thumbnail */
.kh-thumb-item.active-thumb {
    border-color: #000;
}

.single-product-gallery .big-img img {
    aspect-ratio: 1 / 1 !important;
}

.single-product-gallery .swiper-slide {
	position: relative !important;
}

.single-product-gallery .elementor-swiper-button-next {
	content: url("/wp-content/uploads/2025/12/white-next-btn-single-product.svg") !important;
	display: inline-block !important;
	position: absolute !important;
	right: 2rem !important;
	bottom: 2rem !important;
}

.single-product-gallery .elementor-swiper-button-prev {
	content: url("/wp-content/uploads/2025/12/white-prev-btn-single-product.svg") !important;
	display: inline-block !important;
	position: absolute !important;
	left: 2rem !important;
	bottom: 2rem !important;
}

/* .single-product-gallery .swiper {
	position: relative !important;
}

.single-product-gallery .elementor-swiper-button-prev {
	position: absolute !important;
    bottom: 0;
    right: 0 !important;
}

.single-product-gallery .elementor-swiper-button-next {
	position: absolute !important;
    bottom: 0;
    right: 0 !important;
} */

/* FORM STYLING */

.booking-form label,
.contact-form label {
	display: none !important;
}

.booking-form .forminator-input,
.contact-form .forminator-input {
	padding: 0.8rem 1.06rem !important;
    background: #FDFCFB !important;
    border: 1px solid #ABA8A6 !important;
}

.booking-form .forminator-row,
.contact-form .forminator-row {
    margin-bottom: 1.37rem !important;
}

.booking-form .first-name-field,
.contact-form .first-name-field,
.booking-form .phone-field,
.contact-form .phone-number,
.booking-form .number-of-guests-field {
    padding-right: 0.5rem !important;
}

.booking-form .last-name-field,
.booking-form .email-field,
.contact-form .email-field,
.booking-form .date-field {
    padding-left: 0.5rem !important;
}

.booking-form .first-name-field::placeholder,
.booking-form .phone-field::placeholder,
.booking-form .number-of-guests-field::placeholder,
.booking-form .last-name-field::placeholder,
.booking-form .email-field::placeholder,
.booking-form .date-field::placeholder,
.contact-form .first-name-field::placeholder,
.contact-form .last-name-field::placeholder,
.contact-form .phone-number::placeholder,
.contact-form .email-field::placeholder,
.contact-form .email-field::placeholder {
    font-family: "Lato", sans-serif !important;
    font-size: 1rem !important;
}

.booking-form .forminator-button-submit,
.contact-form .forminator-button-submit {
    padding: 0.5rem 1.25rem !important;
    background: var(--color-orange-brown) !important;
    color: var(--color-primary-white) !important;
    font-size: 1.125rem !important;
    box-shadow: none !important;
    transition: var(--vfx) !important;
    border-radius: 0 !important;
}

.booking-form .forminator-button-submit:hover,
.contact-form .forminator-button-submit:hover {
    background: var(--color-sage-green) !important;
}

.booking-form .forminator-row-last .forminator-field,
.contact-form .forminator-row-last .forminator-field {
    display: flex !important;
    flex-direction: row !important;
    justify-content: end !important;
    align-items: end !important;
}

.booking-form .forminator-textarea,
.contact-form .forminator-textarea {
    background: #FDFCFB !important;
    font-family: "Lato", sans-serif !important;
    font-size: 1.125rem !important;
    min-height: 13rem !important;
    border: 1px solid #ABA8A6 !important;
    padding: 0.8rem 1.06rem !important;
}

.booking-form .forminator-textarea::placeholder,
.contact-form .forminator-textarea::placeholder {
    font-family: "Lato", sans-serif !important;
    font-size: 1rem !important;
}

.booking-form .forminator-icon-calendar {
    display: none !important;
}

.legal-info h4 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem
}

.legal-info a {
    color: var(--color-orange-brown);
}

.legal-info ul {
    padding-bottom: 1rem;
}

/* MEDIA QUERIES */

/* TABLET - 1024px */
@media (width <= 64em) {

}

/* MOBILE - 767px */
@media (width <= 47.938em) {

	.orange-brown-btn a {
        width: 100% !important;
    }

    .about-farm-gallery img {
	    height: 450px !important;
        width: 100% !important;
	    object-fit: cover !important;
        aspect-ratio: 1 / 1 !important;
    }

    .about-farm-gallery .elementor-swiper-button-next {
	   display: none !important;
    }

    .about-farm-gallery .elementor-swiper-button-prev {
        display: none !important;
    }

    .booking-form .first-name-field,
    .contact-form .first-name-field,
    .booking-form .phone-field,
    .contact-form .phone-number,
    .booking-form .number-of-guests-field {
        padding-right: 0 !important;
        margin-bottom: 8px !important;
    }

    .booking-form .last-name-field,
    .booking-form .email-field,
    .contact-form .email-field,
    .booking-form .date-field {
        padding-left: 0 !important;
        margin-bottom: 8px !important;
    }

    .booking-form .forminator-row,
    .contact-form .forminator-row {
        margin-bottom: 8px !important;
    }

    .booking-form .forminator-textarea,
    .contact-form .forminator-textarea {
        min-height: 10rem !important; 
    }

    .single-product-gallery .big-img img {
        aspect-ratio: 1 / 1 !important;
        height: 250px !important;
    }

    .kh-thumb-gallery {
        display: none !important;
    }
}