/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.3.1750328508
Updated: 2025-06-19 10:21:48

*/

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Romanesco&family=Sanchez:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

    * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        a:hover ,a {
            outline: none;
        }

        body {
            font-family: 'Georgia', serif;
            line-height: 1.6;
            color: #333;
            overflow-x: hidden;
        }

        /* Smooth scrolling */
        html {
            scroll-behavior: smooth;
        }

        /* Header */
        .header {
            position: fixed;
            top: 0;
            width: 100%;
            background: #F2EEE7;
            backdrop-filter: blur(10px);
            z-index: 1000;
            padding: 11px 0;
            transition: all 0.3s ease;
            border-bottom: 1px solid #BDC9B3;
        }

        .nav {
            display: flex;
            justify-content: space-between;
            align-items: center;
            max-width: 1310px;
            margin: 0 auto;
            padding: 0 15px;
        }
        .logo a {
            font-size: 24px;
            font-weight: bold;
            color: #4D6643;
            font-family: 'Playfair Display';
        }
        .logo a:hover, .logo a:focus{
            outline: none;
            color: #4D6643;
        } 

        .nav-links {
            display: flex;
            list-style: none;
            gap: 4rem;
            margin:auto;
        }

        .nav-links a {
            text-decoration: none;
            color: rgb(30, 30, 30);
            transition: color 0.3s ease;
            font-family: "DM Sans", sans-serif;
            font-size:14px;
            font-weight:500;
        }

        .nav-links a:hover {
            color: #2d5016;
        }

        .contact-btn {
            background: #4D6643;
            color: white;
            padding: 10px 24px;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            transition: all 0.3s ease;
            font-family: "DM Sans", sans-serif;
            font-size: 16px;
        }

        .contact-btn:hover {
            background: #3d6520;
            color: #fff;
        }

        /* Hero Section */
        .hero {
            padding: 80px 15px;
            background: linear-gradient(55deg, #F2F0EA 0%, #F1EFE8 54%);
            display: flex;
            align-items: center;
            position: relative;
            overflow: hidden;
        }

        .hero-content {
            max-width: 1310px;
            margin: 50px auto;
            padding: 0 15px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            align-items: center;
        }
        .hero-content  .heading-subtitle img, h3.hero-image-bottom-title svg{
            filter: brightness(0) saturate(100%) invert(23%) sepia(18%) saturate(682%) hue-rotate(33deg) brightness(94%) contrast(90%);
        }

        .hero-text {
            animation: slideInLeft 1s ease-out;
        }

        .hero-text h1 {
            font-size:72px ;
            line-height: 1;
            margin-bottom: 1rem;
            color: #1e1e1e;
            font-family:"Playfair Display", serif;
            
        }
        .hero-content h1 span {
          background: linear-gradient(55deg, #4B6341 0%, #354630 54%);
          background-size: cover;
          color: transparent;
          -webkit-background-clip: text;
          background-clip: text;
        }

        .hero-text p {
            font-size: 24px;
            margin-bottom: 2rem;
            color: #666;
            font-family: 'DM Sans';
            line-height: 1.2em;
            margin-top: 35px;
        }
        .menu_icon {
            width: 80%;
            display: flex;
        }

        .hero-stats {
            display: flex;
            gap: 2rem;
            margin-bottom: 2rem;
        }

        .stat {
            display: flex;
            flex-direction: column;
        }
        .stat img{
          filter:brightness(0) saturate(100%) invert(20%) sepia(27%) saturate(563%) hue-rotate(53deg) brightness(91%) contrast(93%);
          margin:auto;
        }

        .stat-number{
           font-size: 30px;
            font-weight: bold;
            color: #4D6643;
            font-family: 'Playfair Display';
        }
        .stat-label {
            font-size: 14px;
            color: #666;
            font-family: 'DM Sans';
        }

        .hero-buttons {
            display: flex;
            gap: 1rem;
        }
        .btn-primary {
            background: #4D6643;
            color: white;
            border: 1px solid #4D6643;
            border-radius: 10px;
            cursor: pointer;
            transition: all 0.3s ease;
            display: inline-block;
            font-family: 'DM Sans' !important;
            padding: 12px 24px;
            text-decoration: none;
            outline: none;
        }
        .btn-primary a{
            color: white;
        }
        .btn-primary:hover, .btn-primary:focus  {
            background: #4D6643;
            box-shadow: 0 10px 25px rgba(45, 80, 22, 0.3);
            outline: none;
            color: white !important;
            transform: scale(1.03) !important;;
        }
/*        .btn-primary:nth-child(2) {
            background: #fff;
            color: #4D6643;
            border: 1px solid #4D6643;
            border-radius: 10px;
            cursor: pointer;
            transition: all 0.3s ease;
            display: inline-block;
            font-family: 'DM Sans' !important;
            padding: 12px 24px;
            text-decoration: none;
            outline: none;
        }

        .btn-primary:nth-child(2):hover {
            background: #4D6643;
            box-shadow: 0 10px 25px rgba(45, 80, 22, 0.3);
            outline: none;
            color: white;
            transform: scale(1) !important;;
        }*/

        .btn-secondary {
            background: #fff;
            color: #2d5016;
            padding: 15px 22px;
            border: 2px solid #fff;
            border-radius: 10px;
            cursor: pointer;
            transition: all 0.3s ease;
            text-decoration: none;
            display: inline-block;
            font-family: 'DM Sans';
        }

        .btn-secondary:hover , .btn-secondary:hover a, .btn-secondary:focus{
            background: #2d5016;
            color: white;
            border: 2px solid white ;
        }

        .hero-image {
            position: relative;
            animation: slideInRight 1s ease-out;
            margin-top: 50px;
        }

        .hero-card{
            background: white;
            border-radius: 15px;
            padding: 20px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
            transform: rotate(0deg);
            transition: all 0.3s ease;            
            background-repeat: no-repeat;
            background-size: cover;
            height: 550px;
            background-position: center;
            display: flex;
            align-items: end;
        }
        h3.hero-image-bottom-title {
            font-family: 'DM Sans';
            font-size: 16px;
            display: flex;
            align-items: center;
            gap: 6px;
        }
        p.hero-image-bottom-description {
            font-size: 14px;
            color: rgb(79, 79, 79);
            font-family: 'DM Sans';
            margin-top: 10px;
            margin-bottom: 0px;
        }
        .hero-card-details{
            background:#fff;
            padding: 20px;
            border-radius: 10px;
        }

        .hero-card:hover {
            transform: rotate(-5deg) scale(1.02);
        }

        /* Floating elements */
        .floating-element {
            position: absolute;
            animation: float 6s ease-in-out infinite;
        }

        .floating-element:nth-child(2) {
            animation-delay: -2s;
        }

        .floating-element:nth-child(3) {
            animation-delay: -4s;
        }

        /* Products Section */
        .products {
            padding: 5rem 0 0 ;
            background: #fff;
        }

        .container {
            max-width: 1310px;
            margin: 0 auto;
            padding: 0 15px;
        }

        .section-title {
            text-align: center;
            font-size: 48px;
            margin-bottom: 1rem;
            color: rgb(30, 30, 30);
            font-family: 'Playfair Display';
        }

        .section-subtitle {
            text-align: center;
            color: rgb(79, 79, 79);
            margin-bottom: 3rem;
            font-family: 'DM Sans';
            font-size: 20px;
        }
        .product-categories span.tag {
            font-family: 'DM Sans';
            background: rgb(77, 102, 67);
            color: #fff;
            font-size: 14px;
            font-weight: 500;
        }
        .product-title a, .product-title a:hover, .product-title a:focus {
            font-size: 24px;
            color: #fff;
            font-family: 'Playfair Display';
            margin: 15px 0;
            z-index: 2;
            outline: none;
        }
        h3.product-title {
            margin: 10px 0;
        }
        .products-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            margin-bottom: 3rem;
        }

        .product-card {
            background: white;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

        .product-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
        }

        .product-image {
            height: 350px;
            background: linear-gradient(45deg, #8B4513, #D2691E);
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: end;
        }
        .product-image-overlay {
            position: absolute;
            width: 100%;
            height: 100%;
            background: #00000029;
        }

        .product-image.svamp {
            background: linear-gradient(45deg, #8B4513, #D2691E);
        }

        .product-image.ostronkyddling {
            background: linear-gradient(45deg, #708090, #A9A9A9);
        }

        .product-content {
            padding: 1.5rem;
            z-index: 21 !important;
        }
        .product-description
         {
            color: #fff;
            margin-bottom: 1rem;
            font-family: 'DM Sans';
            z-index: 2;
        }


        .product-tags {
            display: flex;
            gap: 0.5rem;
            flex-wrap: wrap;
            z-index: 2;
        }

        .tag {
            background: rgba(255, 255, 255, 0.5);
            color: #fff;
            padding: 0.25rem 0.75rem;
            border-radius: 15px;
            font-size: 14px;
            font-family: 'DM Sans';
            z-index: 9;
        }

        /* Features Section */
        .features {
            padding: 5rem 0;
        }

        .features-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
            margin-top: 3rem;
        }

        .feature-card {
            text-align: center;
            padding: 2rem;
            transition: all 0.3s ease;
        }

        .feature-card:hover {
            transform: translateY(-5px);
        }

        .feature-icon {
            width: 64px;
            height: 64px;
            background: #f1f0ea;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1rem;
            font-size: 1.5rem;
            color: #2d5016;
        }

        /* Vision Section */
        .vision {
            padding: 5rem 0;
            background: #F0F2EF;
        }

        .vision-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
        }

        .vision-image {
            
            border-radius: 15px;
            position: relative;
            overflow: hidden;
        }
        .vision-image img {
            border-radius: 18px;
            height: 500px;
            width: 100%;
            object-fit: cover;
        } 

        /* Values Section */
        .values {
            padding: 0 0 5rem ;
            background: #F1F1ED;
        }
        .feature-icon svg {
            height: 32px;
            width: 32px;
            color: #4D6643;
        }
        .value-card h3 {
            font-size: 20px;
            font-family: 'Playfair Display';
            color: rgb(30, 30, 30);
            margin: 20px;
        }
        .value-card p {
            margin: 0;
            color: rgb(79, 79, 79);
            font-family: 'DM Sans';
            font-size: 16px;
        }
        .values-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
            margin-top: 3rem;
        }

        .value-card {
            text-align: center;
            padding: 25px 25px;
            background: white;
            border-radius: 15px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            transition: all 0.3s ease;
        }
        .values  .section-title{
            font-size: 30px;
        }

        .value-card:hover {
            transform: translateY(-5px) !important;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        }

        /* Contact Section */
        .contact {
            padding: 5rem 0;
            background: #fff;
        }

        .contact-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            margin-top: 50px;
        }
        .contact .container p.section-subtitle {
            max-width: 800px;
            margin: 20px auto;
        }
        .contact-form h3  {
            color: rgb(30, 30, 30);
            font-size: 24px;
            font-family: 'Playfair Display';
            margin: 20px 0;
            font-weight: 700;
            text-align: left;
        }
        .contact-info .section-title {
            color: rgb(30, 30, 30);
            font-size: 24px;
            font-family: 'Playfair Display';
            font-weight: 700;
            text-align: left;

        }
        .contact-form {
            background: #F2EEE7;
            padding: 2rem;
            border-radius: 15px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        }
        .contact-form label {
            display: block;
            font-weight: 600;
            color: rgb(79, 79, 79);
            font-family: 'DM Sans';
            font-size: 16px;
        }
        .contact-form .form-group p {
            margin: 0;
        }

        .contact-form .form-row.two-columns {
          display: flex;
          gap: 20px;
          flex-wrap: wrap;
        }

        .contact-form .form-group {
          margin-bottom: 20px;
          flex: 1;
        }

        .contact-form input[type="text"],
        .contact-form input[type="email"],
        .contact-form select,
        .contact-form textarea {
          width: 100%;
          padding: 12px 16px;
          border: 1px solid #e5e2da;
          border-radius: 8px;
          font-size: 15px;
          background-color: #fff;
          font-family: inherit;
          color: #1E1E1E;
          box-shadow: none;
          transition: border-color 0.2s;
          height: 55px;
          font-family: 'DM Sans';
        }

        .contact-form input::placeholder,
        .contact-form textarea::placeholder {
          color: #aaa;
          font-family: 'DM Sans';
          font-size: 14px;

        }
        .contact-form .form-group p br {
            display: none;
        }
        .contact-form  .wpcf7 .wpcf7-form-control-wrap {
            width: 100%;
            display: block;
            margin-top: 15px;
        }

        .contact-form textarea {
          resize: none;
          min-height: 120px;
        }

        .contact-form input:focus,
        .contact-form textarea:focus,
        .contact-form select:focus {
          border-color: rgb(72, 95, 63) !important;
          outline: none;
        }

        .contact-form .submit-button {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          background-color: #4D6643;
          color: #fff;
          padding: 16px 24px;
          font-weight: 500;
          border: none;
          border-radius: 8px;
          cursor: pointer;
          width: 100%;
          transition: background-color 0.3s;
          font-family: 'DM Sans';
          font-size: 16px;
        }

        .contact-form .submit-button:hover {
          background-color: #3a4738;
        }

        .contact-form .submit-button::before {
          content: "";
          display: inline-block;
          width: 20px;
          height: 20px;
          margin-right: 8px;
          background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z'/%3E%3Cpath d='m21.854 2.147-10.94 10.939'/%3E%3C/svg%3E") no-repeat center;
          background-size: contain;
          vertical-align: middle;
        }
        
        .contact-info {
            color: Green;
           
            border-radius: 15px;
        }

        .contact-info h3 {
            margin-bottom: 1rem;
        }
        .contact-info p.section-subtitle {
            color: rgb(79, 79, 79);
            font-size: 16px;
            font-family: 'DM Sans';
            text-align: left;
        }
        .contact-item {
            display: flex;
            margin-bottom: 1rem;
            gap: 1rem;
            background: rgb(240, 242, 239);
            padding: 20px;
            border-radius: 10px;
            margin: 30px 0;
        }
        .contact-item:hover {
            background: #DDE3D8;
        }
        .contact-item svg {
            color:rgb(77, 102, 67) ;
            margin-top: 5px;
        }
        .contact-item  strong{
            font-size: 16px;
            font-family: 'Playfair Display';
            color: #1E1E1E;
        }
        .contact-item div a , .contact-item div{
            color: rgb(79, 79, 79);
            font-size: 14px;
            font-family: 'DM Sans';
        }
        .contact-inform-bottom {
            padding: 25px 30px;
            background: #465C3D;
            border-radius: 15px;
        }
        .contact-info  .contact-inform-bottom .section-title {
            color: #fff;
            font-size: 20px;
            font-family: 'Playfair Display';
            font-weight: 700;
            text-align: left;
        }
        .contact-info .contact-inform-bottom p.section-subtitle {
            text-align: left;
            color: rgb(255, 255, 255);
            font-size: 16px;
            font-family: 'DM Sans';
        }
        .footer-section.column-1 p {
            color: rgb(209, 213, 219);
            font-family: 'DM Sans';
            font-size: 16px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
         .footer-section.column-1 p a{
            color: rgb(209, 213, 219);
            font-size: 16px;
         }
         .footer_details p {
            margin: 10px 0;
        }
        .footer-section.column-2 h3 {
            justify-content: center;
            font-size: 18px;
        }



        /* Footer */
        .footer {
            background: #1E1E1E;
            color: white;
            padding: 5rem 0 1rem;
        }
        .footer-content {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            margin-bottom: 40px;
        }
        .footer-section.column-2 , .footer-section.column-3 {
            text-align: center;
        }
        .footer-section.column-1 h3 svg{
            color: rgb(122, 144, 101);
            height: 34px;
            width: 34px;
        }
        .footer-section h3 {
            margin-bottom: 1rem;
            color: #FFF;
            font-size: 24px;
            font-family: 'Playfair Display';
            display: flex;
            align-items: center;
            gap: 15px;
        }
        .footer-section.column-1 p svg {
            color: rgb(99, 115, 83);
        }

        .footer-section ul {
            list-style: none;
            margin: 30px 0;
        }

        .footer-section ul li {
            margin-bottom: 0.5rem;
        }
        .footer-section ul li a {
            color: #ccc;
            text-decoration: none;
            transition: color 0.3s ease;
            font-family: 'DM Sans';
            font-size: 16px;
        }

        .footer-section ul li a:hover {
            color: rgb(99, 115, 83);
        }
        .footer-section.column-2 h3, .footer-section.column-3 h3 {
            justify-content: center;
            font-size: 18px;
        }

        .footer-bottom {
            text-align: center;
            padding-top: 2rem;
            border-top: 1px solid #333;
            color: #666;
        }
        .heading-subtitle{
            color: #4B5A46 !important;
            font-size: 14px !important;
            margin-bottom: 1rem !important;
            background: #DDE3D8;
            padding: 8px 16px;
            width: fit-content;
            border-radius: 100px;
            font-family: 'DM Sans';
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .service-cards-section {
          padding: 60px 20px;
          background-color: #fff;
          text-align: center;
        }

        .service-cards-grid {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 85px;
        }


        .icon-circle {
          width: 60px;
          height: 60px;
          background-color: #e8ede6;
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          margin: 0 auto 20px;
        }

        .icon-circle img {
          width: 24px;
          height: 24px;
          object-fit: contain;
        }

        .service-card h3 {
            font-size: 20px;
            color: #2d2d2d;
            font-weight: 600;
            margin-bottom: 10px;
            font-family: 'Playfair Display';
        }
        .service-card p {
            font-size: 16px;
            color: rgb(79, 79, 79);
            line-height: 1.5;
            font-family: 'DM Sans';
        }
        .button {
            width: fit-content;
            margin: auto;
            background: #4d6643;
            border: 1px;
            margin-top: 50px;
            transition: all 0.3s ease;
        } 
        .button a {
            color: #fff;
            font-family: 'DM Sans';
            outline: none;
        }
        .button:hover{
            transform: scale(1.03) !important;
        }

        .vision-content h2.section-title {
            text-align: left;
        }

        .image-bottom-info-wrapper {
            display: flex;
            gap: 0;
            background: white;
            padding: 15px;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
            max-width: fit-content;
            border: 10px;
            z-index: 900;
            bottom: 50px;
            border-radius: 14px;
            position: absolute;
            right: 38%;
        }

        .info-box {
          text-align: center;
          min-width: 100px;
        }

        .info-title {
            font-size: 24px;
            font-weight: 600;
            color: rgb(77, 102, 67);
            margin-bottom: 4px;
            font-family: 'Playfair Display';
        }

        .info-description {
            font-size: 14px;
            color: rgb(93, 93, 93);
            font-family: 'DM Sans';
        }
        .vision-content p {
            font-size: 18px;
            font-family: 'DM Sans';
            color: rgb(79, 79, 79);
        }
        .hall_dig_uppdaterad {
            border-top: 1px solid rgb(55, 65, 81);
            padding-top: 50px;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            padding-bottom: 50px;
        }
        .hall_dig_uppdaterad .footer-section h3 {
            font-size: 18px;
            font-family: 'Playfair Display';
            color: #D1D5DB;
        }
        .hall_dig_uppdaterad .footer-section p{
            color: #fff;
            font-family: 'DM Sans';
            font-size: 16px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .footer-section div input {
            background: rgb(31, 41, 55);
            border: 1px solid #4B5563 !important;
            height: 50px;
            padding: 15px !important;
        }
        .subscribe-form button {
            margin-left: -20px;
            background: rgb(77, 102, 67) !important;
            color: #fff !important;
            border-radius: 0px 10px 10px 0px !important;
        }
        .footer-bottom-copyright {
            text-align: center;
            padding-top: 2rem;
            color: #666;
            max-width: 1310px;
            padding: 20px 15px 0;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: space-between;

        }
        .copyright {
            border-top: 1px solid rgb(55, 65, 81);
        }
        .footer-bottom-copyright p, .footer-bottom-copyright p a {
            color: rgb(156, 163, 175) !important;
            font-family: 'DM Sans';
            font-size: 14px;
            display: flex;
            gap: 20px;
        }



        /* Animations */
        @keyframes slideInLeft {
            from {
                opacity: 0;
                transform: translateX(-50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes slideInRight {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

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

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Scroll animations */
        .fade-in {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.6s ease;
        }

        .fade-in.visible {
            opacity: 1;
            transform: translateY(0);
        }

        /* Responsive */
        @media (max-width: 768px) {
            .hero-content {
                text-align: left;
                display: flex;
                flex-wrap: wrap-reverse;
                gap: .0;
            }
            .hero-image {
                position: relative;
                animation: slideInRight 1s ease-out;
                margin: auto;
            }

            .hero-text h1 {
                font-size: 2.5rem;
            }

            .nav-links {
                display: none;
            }

            .contact-content,
            .vision-content {
                grid-template-columns: 1fr;
            }
        }


        /*PRODUCT DESIGN */


        .funga-hero-banner {
          position: relative;
          color: #fff;
          text-align: center;
          background-repeat: no-repeat;
          background-size: cover;
          background-position: center;
        }

        .funga-hero-overlay {
          background: rgba(0, 0, 0, 0.4);
          padding: 130px 20px 100px; 
        }

        .funga-hero-container {
          max-width: 800px;
          margin: 0 auto;
        }

        .funga-hero-button {
            background-color: #E6EDE3;
            color: #2D5016;
            padding: 7px 16px;
            border-radius: 999px;
            font-weight: 600;
            text-decoration: none;
            display: flex;
            width: fit-content;
            margin: auto;
            align-items: center;
            gap: 6px;
            font-size: 12px;
            font-family: 'DM Sans';
        }
        .funga-hero-button:hover{
             color: #2D5016;
             outline: none;
        }
        .funga-hero-title {
            font-size: 60PX;
            font-weight: 700;
            margin-bottom: 15px;
            color: #fff;
            font-family: 'Playfair Display';
        }

        .funga-hero-description {
            font-size: 22px;
            line-height: 1.5;
            margin: 0 auto;
            color: rgb(229, 231, 235);
            font-family: 'DM Sans';
        }

        .funga-backlink-section {
            background-color: #F2EEE7;
            padding: 40px 20px;
        }
        .funga-backlink-container {
            max-width: 1310px;
            margin: 0 auto;
            display: flex;
            justify-content: flex-start;
            padding: 25px 15px !important;
        }
        .funga-backlink {
            color: #34442F;
            text-decoration: none;
            font-weight: 500;
            font-size: 14px;
            display: flex;
            align-items: center;
            transition: color 0.3s ease;
            font-family: 'DM Sans';
        }

        .funga-backlink:hover {
          color: #1e3a0f;
        }

        .back-arrow-icon {
          margin-right: 8px;
          stroke: #2D5016;
        }

        .funga-checklist-list {
          list-style: none;
          padding: 0;
          margin: 0 auto;
          max-width: 700px;
        }
        .funga-checklist-list li svg{
           color:  #2D5016;
        }
        .funga-checklist-list li {
          display: flex;
          align-items: center;
          font-size: 16px;
          color:rgb(79, 79, 79);
          line-height: 1.6;
          gap: 10px;
         font-family: 'DM Sans';
         font-size: 14px;
         margin: 15px 0;
        }

        .funga-checklist-list .icon {
          display: inline-block;
          min-width: 20px;
          height: 20px;
          margin-right: 10px;
          background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%232D5016" stroke-width="2" viewBox="0 0 24 24"><path d="M20 6L9 17l-5-5"/></svg>') no-repeat center center;
          background-size: 20px 20px;
          margin-top: 4px;
        }
        .kulinarisk{
            background: #fff;
        }
        .kulinarisk h2.section-title , .varfor h2.section-title{
            font-size: 30px;
        }
        .kulinarisk .vision-image img{
            height: auto;
        }
        .varfor{
            background: #F0F2EF;
        }
        .varfor p {
            font-size: 18px;
            font-family: 'DM Sans';
            color: rgb(79, 79, 79);
            max-width: 685px;
            margin: auto;
        }
        .varfor .icon-circle {
            width: 60px;
            height: 60px;
            background-color: rgb(221, 227, 216);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
        }
        .varfor .icon-circle:hover {
            background:#BDC9B3;
        }
         .varfor  .service-cards-grid{
            margin-top: 50px;
        }
        .varfor .icon-circle svg{
            color: #56694E;
        }
        .varfor .service-cards-grid p{
            font-size: 14px;
        }


        .product-specs {
          background-color: #fff;
          padding: 60px 20px;
          font-family: 'Inter', sans-serif;
        }

        .product-specs .container {
          max-width: 800px;
          margin: 0 auto;
        }

        .specs-heading {
          text-align: center;
          font-size: 26px;
          font-weight: 700;
          margin-bottom: 40px;
          font-family: 'Playfair Display', serif;
        }

        .specs-table {
          background: #fff;
          border-radius: 12px;
          overflow: hidden;
          box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
        }

        .specs-row {
          display: flex;
          justify-content: space-between;
          padding: 16px 24px;
          font-size: 16px;
          gap: 15px;
        }

        .specs-row:nth-child(even) {
          background-color: #f9f9f9;
        }

        .specs-title {
          font-weight: 600;
          color: #222;
        }

        .specs-value {
          color: #333;
          text-align: right;
        }

        .funga-cta-section {
          background-color: #f3efe8;
          padding: 60px 20px;
          text-align: center;
          font-family: 'Inter', sans-serif;
        }

        .funga-cta-container {
          max-width: 800px;
          margin: 0 auto;
        }

        .funga-cta-heading {
          font-family: 'Playfair Display', serif;
          font-size: 28px;
          font-weight: 700;
          margin-bottom: 16px;
          color: #0F0E0E;
        }

        .funga-cta-text {
          font-size: 17px;
          color: #333;
          line-height: 1.6;
          margin-bottom: 32px;
        }

        .funga-cta-buttons {
          display: flex;
          gap: 16px;
          justify-content: center;
          flex-wrap: wrap;
        }

        .funga-btn-primary,
        .funga-btn-secondary {
          font-size: 16px;
          font-weight: 600;
          padding: 10px 28px;
          border-radius: 8px;
          text-decoration: none;
          transition: all 0.3s ease;
        }

        .funga-btn-primary {
          background-color: #475e3d;
          color: #fff;
          box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }

        .funga-btn-primary:hover {
          background-color: #364a2f;
          color: #fff;
        }


        .funga-story-section {
          padding: 60px 20px;
          background-color: #fff;
          font-family: 'Inter', sans-serif;
          color: #0F0E0E;
        }

        .funga-container {
          max-width: 990px;
          margin: 0 auto;
        }

        .funga-section-title {
          font-family: 'Playfair Display', serif;
          font-size: 32px;
          font-weight: bold;
          margin-bottom: 20px;
        }

        .funga-subtitle {
          font-family: 'Playfair Display', serif;
          font-size: 22px;
          margin-top: 50px;
          margin-bottom: 10px;
        }

        .funga-lead-paragraph {
            font-size: 16px;
            margin-bottom: 30px;
            font-family: 'DM Sans';
            color: rgb(79, 79, 79);
        }

        .funga-grid {
          display: grid;
          grid-template-columns: 1fr 1fr;
          gap: 40px;
          align-items: center;
          margin-top: 40px;
        }

        .funga-image img {
          width: 100%;
          border-radius: 8px;
          box-shadow: 0 4px 8px rgba(0,0,0,0.08);
        }

        .funga-content h3 {
          font-size: 22px;
          font-weight: 700;
          font-family: 'Playfair Display', serif;
          margin-bottom: 12px;
          color: #1e1e1e;
        }

        .funga-content p {
          font-size: 16px;
          line-height: 1.6;
          font-family: 'DM Sans';
          color: rgb(79, 79, 79)
        }

        /* Responsive */
        @media (max-width: 768px) {
          .funga-grid {
            grid-template-columns: 1fr;
            text-align: center;
          }
          .menu_icon {
                display: flex;
                align-items: center;
                gap: 20px;
                width: auto;
            }

          .funga-content h3 {
            margin-top: 20px;
            text-align: left;
          }
          .funga-content p{
            text-align: left;
          }
        }


     .funga-timeline-section {
          padding: 60px 20px;
          background-color: #fff;
          font-family: 'Inter', sans-serif;
        }

        .funga-timeline-container {
          position: relative;
          margin: 0 auto;
          max-width: 900px;
          padding-left: 60px;
          border-left: 2px solid #d3d3cd;
        }

        .funga-timeline-item {
          position: relative;
          margin-bottom: 70px;
        }

        .funga-timeline-year {
          position: absolute;
          left: -90px;
          top: 0;
          background-color: #3c5536;
          color: white;
          font-weight: bold;
          font-size: 16px;
          width: 56px;
          height: 56px;
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          z-index: 2;
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        .funga-timeline-content h3 {
          margin: 0 0 8px;
          font-family: 'Playfair Display', serif;
          font-size: 20px;
          font-weight: 600;
          color: #0F0E0E;
        }

        .funga-timeline-content p {
          margin: 0;
          font-size: 16px;
          color: #3c3c3c;
          line-height: 1.6;
        }

        /* Responsive */
        @media (max-width: 768px) {
          .funga-timeline-container {
            padding-left: 30px;
          }


          .funga-timeline-year {
            left: -51px;
            width: 40px;
            height: 40px;
            font-size: 14px;
          }

          .funga-timeline-content h3 {
            font-size: 18px;
          }

          .funga-timeline-content p {
            font-size: 15px;
          }

        }
        .inner-page-title {
            text-align: center;
            font-size: 30px;
            margin-bottom: 1rem;
            color: rgb(30, 30, 30);
            font-family: 'Playfair Display';
            margin-bottom: 40px;
        }
       .story .service-cards-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 30px;
        }
       .story{
        background: #F0F2EF;
       }

        /** Header menu */

        /* Hamburger Styles */
        .hamburger {
          display: none;
          flex-direction: column;
          gap: 5px;
          width: 24px;
          height: 20px;
          cursor: pointer;
          z-index: 999;
        }
        .hamburger span {
          display: block;
          width: 100%;
          height: 3px;
          background: #415539;
          transition: 0.3s;
        }
        .hamburger.active span:nth-child(1) {
            transform: rotate(48deg) translate(6px, 5px);
        }
        .hamburger.active span:nth-child(2) {
          opacity: 0;
        }
        .hamburger.active span:nth-child(3) {
          transform: rotate(-45deg) translate(5px, -5px);
        }

        @media (max-width: 768px) {
          .hamburger {
            display: flex;
            order: 3;
          }
         .contact-btn{
            order: 2;
            padding: 6px 20px;
            font-size: 14px;
        }
          ul.nav-links.active {
                display: flex !important;
            }
          ul#menu-main-header {
            position: absolute;
            left: 0;
            top: 60px;
            width: 100%;
            background: #fff;
            padding: 35px 20px;
            text-align: center;
            display: none;
            height: 100vh;
            text-align: left;
            }
           ul#menu-main-header li {
                border-bottom: 1px solid rgb(65, 85, 57);
                padding: 10px;
            }
            ul#menu-main-header li:last-child {
                border-bottom: 0;
            }
          .menu-wrapper {
            position: absolute;
            top: 70px;
            left: 0;
            right: 0;
            background: #fff;
            flex-direction: column;
            padding: 20px;
            gap: 10px;
            transform: translateY(-200%);
            transition: 0.3s ease-in-out;
          }
          .menu-wrapper.active {
            transform: translateY(0);
          }
          .nav-links {
            display: flex;
            flex-direction: column;
            gap: 10px;
          }
        }


       /**responsive start*/
        @media (max-width: 1440px) {
           .hero-card:hover{
                 transform: rotate(0deg) scale(1.02);
           } 
        }
        @media (max-width: 1120px) {
            .image-bottom-info-wrapper {
                bottom: 90px;
                position: absolute;
                right: 30%;
            } 
        }
        @media (max-width: 1280px) {
           .hero {
                 padding: 50px 0 30px;
            }

            .vision-content{
                align-items: flex-start;
            }
            .hero-content{
                max-width: 100%;
                align-items: flex-start;
            }
            .footer{
                max-width: 100%;
            }
            .footer-bottom-copyright {
                max-width: 100%;
                flex-wrap: wrap;
            }
            .funga-hero-title{
                font-size: 55px;
            }
            .kulinarisk .vision-image img{
                height: 450px !important;
                object-fit: cover;
            }

        }

        @media (max-width: 1024px) {
           .hero-text h1 {
              font-size: 52px;
            }
            .section-title{
                font-size: 42px;
            }
            .image-bottom-info-wrapper {
                position: absolute;
                right: 25%;
                bottom: 190px;
            }
            .contact-form .form-row.two-columns{
                flex-direction: column;
            }
            .funga-hero-title{
                font-size: 50px;
            }
        }
         @media (max-width: 860px) {
            .image-bottom-info-wrapper {
                position: absolute;
                right: 19%;
                bottom: 244px;
            }

        @media (max-width: 992px) {
            .hero-text h1 {
                font-size: 42px;
            }
            .story .service-cards-grid {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 30px;
            }
            .values-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            }
            .hero-text p{
                font-size: 20px;
            }
            .section-title {
                font-size: 36px;
            }
            .image-bottom-info-wrapper {
                position: absolute;
                right: 24%;
                bottom: 150px;
            }
            .funga-hero-title{
                font-size: 45px;
            }
            .funga-timeline-container {
                position: relative;
                margin: 0 auto 0 20px;
            }
        }
         @media (max-width: 768px) {
            .kulinarisk .vision-content {
                grid-template-columns: repeat(2, 1fr) !important; 
                align-items: flex-start;               
            }
            .menu-open {
                overflow: hidden;
            }
            .image-bottom-info-wrapper {
                position: absolute;
                right: auto;
                bottom: 91px;
                left: 25px;
            }
             .footer-content {
                display: flex;
                margin-bottom: 40px;
                row-gap: 25px;
                flex-wrap: wrap;
            }
            .footer-section.column-2, .footer-section.column-3 {
                text-align: left;
                width: 50%;
            }
            .footer-section.column-2 h3, .footer-section.column-3 h3{
                justify-content: left;
                font-size: 18px;
            }
            .hall_dig_uppdaterad {
                grid-template-columns: repeat(2, 1fr);  
            }


        }
        @media (max-width: 767px) {
            .service-cards-grid {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                gap: 85px;
            }
            .hall_dig_uppdaterad {  
                grid-template-columns: repeat(2, 1fr);
            }
            ..hero-content{
                gap: 0;
            }
            .hero-text h1, .hero-text p{
                text-align: left;
            }
        }
         @media (max-width: 660px) {
            .kulinarisk .vision-content {
                grid-template-columns: repeat(1, 1fr) !important;
            }
            .hall_dig_uppdaterad{
                grid-template-columns: repeat(1, 1fr);
            }
        }

         @media (max-width: 560px) {
             .service-cards-grid {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                gap: 85px;
            }
           .story .service-cards-grid {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                gap: 30px;
            }
            .values-grid {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
            }
            .footer-section ul{
                text-align: left;
                margin: 20px 0;
              }
            .hero-text h1, .hero-text p{
                text-align: left;
            }
            .footer-content {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                margin-bottom: 40px;
            }
            .hall_dig_uppdaterad{
                grid-template-columns: repeat(1, 1fr); 
            }
            .footer-section.column-2 h3, .footer-section.column-3 h3 {
                justify-content: flex-start;
                font-size: 18px;
            }
            .footer-bottom-copyright{
                 flex-direction: column; 
                 align-items: self-start; 
            }
            .funga-hero-title {
                font-size: 32px;
            }
            .funga-hero-description{
                font-size: 18px;
            }
            .story .service-cards-grid{
                grid-template-columns: repeat(1, 1fr); 
            }
        }