@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap');

/* Set all elements relative */
* {outline:none; position:relative;z-index:2;box-sizing:border-box;}

/* Outline */
html, body{padding:0;margin:0;width:100%;height:auto;background:white;}

/* Reset links */
a, a img{border:0;text-decoration:none;outline:0;}

/* Remove button styling on iPhone */
input[type="submit"], input[type="button"] {-webkit-appearance: none;-moz-appearance: none;appearance: none;background:white;}

/* Remove arrows from number field */
input[type="number"]{-moz-appearance: textfield;}
    input[type="number"]::-webkit-inner-spin-button{-webkit-appearance: none;}
    input[type="number"]::-webkit-outer-spin-button{-webkit-appearance: none;}

/* Font inheritance */
input, textarea, select{font-family:inherit;}

/* Variables */
:root {
    --colour-primary: #1e2a4d;
    --colour-secondary: #956247;
    --colour-grey: #9a9a9a;
    --colour-grey-light: #e5e5e5;
    --nav-font-size: clamp(15px, 1vw, 19px);
    --nav-item-margin: clamp(15px, 1.5625vw, 30px);
    --text-line-height: 1.4;
    --transition: 0.35s ease-in-out;
}

/* Generic layout */
body {font-size:24px;font-family:"Montserrat";font-weight:400;line-height:1;}
.color_b_mill {
    background: var(--colour-primary) !important;
    color: white !important;
}
.btn-zobacz {
    display: inline-block;
    padding: 10px 20px;
    background-color: var(--colour-primary); /* lub np. #007BFF */
    color: white !important;
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    transition: background-color 0.3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.btn-zobacz:hover {
    background-color: #0056b3; /* ciemniejszy odcień na hover */
}
.wrapper {width:94%;max-width:1376px;margin:0 auto;}

h2.section-header,  h1#page-header{color:var(--colour-primary);text-transform:uppercase;font-weight:500;margin:0;padding:30px 0;font-size:40px;}
    h2.section-header::before,  h1#page-header::before {content:" ";width:85px;height:5px;background:var(--colour-secondary);position:absolute;bottom:20px;transform:translatex(-50%);}

.button {background:var(--colour-secondary);color:white;font-size:19px;text-align:center;border-radius:10px;padding:10px 20px;text-transform:uppercase;font-weight:400;min-width:220px;display:inline-block;transition:all var(--transition);}
    .button:hover {background:var(--colour-primary);}
    .button.hover-light:hover {background:white;color:var(--colour-secondary);}

#shape_preload {display:none;}

#wrap-top {z-index:10;background:var(--colour-primary);}
    #wrap-top-in {display:grid;grid-template-columns:clamp(230px, 21.875vw, 420px) 1fr auto auto;grid-template-areas:"logo nav links langs";max-width:1806px;}

    #logo {position:absolute;width:100%;aspect-ratio:445/220;grid-area:logo;}
        #logo img {width:50%;height:auto;margin:0 auto;display:block;z-index:10;top:25px;}
        #logo svg {width:100%;position:absolute;bottom:0px;fill:var(--colour-primary);height:auto;}

    #top-right {grid-area:topright;display:grid;grid-template-columns:1fr auto auto;grid-template-areas:"nav links langs";width:100%;}
        #nav {grid-area:nav;display:flex;align-items:center;}
            #nav a {padding:30px 0px;display:block;font-size:var(--nav-font-size);color:white;text-transform:uppercase;transition:color var(--transition);}
                #nav a:hover {color:var(--colour-secondary);}
            #nav a + a {margin-left:var(--nav-item-margin);}
                #nav a + a::before {content:" ";width:3px;height:3px;border-radius:3px;background:white;position:absolute;top:calc(50% - 1.5px);left:calc(var(--nav-item-margin) / -2);}

        #top-links {grid-area:links;align-self:center;margin-right:10px;}
            #top-links a {}
                #top-links a svg {width:24px;height:24px;}
                    #top-links a svg path {fill:white;transition:fill var(--transition);}
                #top-links a:hover svg path {fill:var(--colour-secondary);}
            #top-links a + a {margin-left:5px;}

        #langs {grid-area:langs;height:100%;background:var(--colour-secondary);display:grid;align-items:center;}
            #langs:after {content:" ";position:absolute;background:var(--colour-secondary);height:12px;width:100%;top:100%;}
            #langs a {display:block;color:white;font-size:22px;font-weight:500;padding:14px;transition:color var(--transition);}
                #langs a.active {display:none;}
                #langs a:hover {color:var(--colour-primary);}

    #nav-mobile-trigger {display:none;padding:25px;grid-area:navtrigger;justify-self:end;cursor:pointer;}
        #nav-mobile-trigger svg {width:50px;height:50px;}
            #nav-mobile-trigger svg path {fill:white;transition:all var(--transition);}
            #nav-mobile-trigger:hover svg path {fill:var(--colour-secondary);}

    #nav-mobile-close {position:relative;padding:25px;justify-self:end;cursor:pointer;top:0;right:0;display:none;}
        #nav-mobile-close svg {width:50px;height:50px;}
            #nav-mobile-close svg path {fill:white;}
            #nav-mobile-close:hover svg path {fill:var(--colour-secondary);}

#wrap-top.nav-mobile-open {position:fixed;z-index:10;width:100%;height:100%;}
    #wrap-top.nav-mobile-open #wrap-top-in {grid-template-areas:"logo navtrigger" "nav nav" "links links" "langs langs";grid-template-columns:1fr auto;width:100%;}
        #wrap-top.nav-mobile-open nav {display:grid;grid-template-columns: 1fr;justify-items:center;margin-top:5vw;}
            #wrap-top.nav-mobile-open nav a {font-size:30px;text-align:center;padding:20px 0;}
            #wrap-top.nav-mobile-open nav a + a {margin-left:0;}
            #wrap-top.nav-mobile-open nav a + a::before {display:none;}
        #wrap-top.nav-mobile-open #langs {display:block;background:none;text-align:center;}
            #wrap-top.nav-mobile-open #langs::after {display:none;}
            #wrap-top.nav-mobile-open #langs a:hover {color:var(--colour-secondary);}
        #wrap-top.nav-mobile-open #top-links {display:block;text-align:center;margin:20px 0;}
            #wrap-top.nav-mobile-open #top-links a svg {width:50px;height:50px;}
            #wrap-top.nav-mobile-open #top-links a + a {margin-left:15px;}
    #wrap-top.nav-mobile-open #nav-mobile-trigger {display:none;}
    #wrap-top.nav-mobile-open #nav-mobile-close {display:block;right:calc(3vw - 1px);grid-area:navtrigger;}


#wrap-slideshow {width:100%;height:clamp(600px, 65vw, 1260px);}
    #wrap-slideshow::before {width:100%;aspect-ratio:2.5;background:url("images/slide_shape.png");content:" ";z-index:3;position:absolute;bottom:-1px;left:0;background-size:contain;overflow:hidden;}
#wrap-slideshow_in {width:100%;height:clamp(600px, 50vw, 1260px);}
#wrap-slideshow_in::before {width:100%;aspect-ratio:2.5;background:url("images/slide_shape.png");content:" ";z-index:3;position:absolute;bottom:-1px;left:0;background-size:contain;overflow:hidden;}

#slideshow {z-index:2;width:100%;height:100%;overflow:hidden;}
        #slideshow .slide {position:absolute;width:100%;height:100%;}
            #slideshow .slide img {object-fit:cover;object-position:center;width:100%;height:100%;}

    #private-cask-wrap {z-index:4;position:absolute;bottom:200px;left:0;width:100%;}
    #private-cask {width:clamp(480px, 31.25vw, 600px);}
        #private-cask-content {width:76%;z-index:5;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
            #private-cask-content img {width:100%;}
            #private-cask-link {text-align:center;margin-top:30px;}
                #private-cask-link a {min-width:160px;}
        #private-cask svg {fill:#1e2a4d;width:100%;}

#wrap-content {padding:40px 0;background:white;}
    #page-content {line-height:1.425;}

#wrap-news {margin-top:-130px;}
    #news-in {display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:30px;}
        .news-item {}
            .news-item-image {width:100%;aspect-ratio:1.5;overflow:hidden;display:block;}
                .news-item-image img {position:absolute;width:100%;}
            .news-item-date {color:var(--colour-grey);font-size:22px;}
            .news-item h3 {margin:0;}
            .news-item-title {color:var(--colour-primary);font-size:22px;font-weight:700;transition:color var(--transition);}
                .news-item-title:hover {color:var(--colour-secondary);}
            .news-all {margin-top:20px;}

    #wrap-news h2 {margin-bottom:140px;}

#wrap-aboutus {margin-top:50px;z-index:3;background:var(--colour-grey-light);}
    #wrap-aboutus-in {}
        #aboutus-left {width:60%;}
            #aboutus-text {font-size:20px;font-weight:500;color:var(--colour-primary);line-height:var(--text-line-height);}
            #aboutus-img {position:absolute;width:38%;right:0;top:0;transform:translatey(-8.5%);overflow:hidden;}
                #aboutus-img img {width:145%;}

#wrap-offer {background:var(--colour-grey-light);padding-top:350px;}
    #offer-in {display:grid;grid-template-columns:50% 1fr;align-items:center;grid-gap:60px;margin-top:100px;}
        #join-us-img {}
            #join-us-img img{width:100%;display:block;}
            #join-us-img .button {background:white;color:var(--colour-primary);left:50%;transform:translatex(-50%);bottom:20%;position:absolute;transition:all var(--transition);}
                #join-us-img .button:hover {background:var(--colour-primary);color:white;}
        #invest-text {font-size:20px;font-weight:500;color:var(--colour-primary);line-height:var(--text-line-height);}

#join-form-wrap {z-index:10;}
    #join-us-form {width:515px;position:absolute;top:-60px;left:auto;right:15%;}
        #join-us-content {position:absolute;width:420px;transform:translate(-50%, -50%);top:50%;left:50%;}
            #join-us-form-img {width:200px;display:block;margin:0 auto;}
            #join-us-title {color:white;line-height:var(--text-line-height);margin-top:20px;font-size:16px;}
            #join-us-form form {margin-top:20px;}
                #join-us-email {background:white;border-radius:10px;width:100%;padding:12px 10px 11px 10px;border:0;color:var(--colour-primary);font-size:19px;font-family:Montserrat;}
                    #join-us-email::placeholder {font-size:19px;color:#a6a6a6;}
                #join-us-gdpr {font-size:11px;color:white;margin-top:10px;line-height:13px;}
                #join-us-submit {background:var(--colour-secondary);border:0;margin:20px auto 0 auto;display:block;cursor:pointer;}
                    #join-us-submit:hover {background:white;color:var(--colour-secondary);}

            #join-us-form svg {fill:#1e2a4d;width:100%;z-index:1;}

#wrap-social {background:var(--colour-grey-light);padding-top:200px;}
    #social-header {color:var(--colour-primary);text-transform:uppercase;font-size:48px;font-weight:500;margin:0;padding:30px 0;justify-content:left;text-align: left;}
        #social-header span {border-bottom:1px solid var(--colour-primary);display:inline-block;padding-right:80px;padding-bottom:10px;}
    #wrap-social .wrapper {display:grid;grid-template-columns:auto 1fr;align-items:center;top:-180px;grid-gap:60px;}
    #wrap-social img {width:100%;height:auto;}

    #socials a svg {width:60px;}
        #socials a svg path {fill:#1e2a4d;}
        #socials a + a {margin-left:20px;}
        #socials a:hover svg path {fill:#956247;transition:var(--transition);}

#wrap-barrels {margin-bottom:0px;margin-top:0px;}
    #wrap-barrels::before {width:100%;height:700px;background:var(--colour-grey-light);position:absolute;top:0px;left:0px;content:" ";}
    #our-barrels {width:100%;}
    #barrels-cta {text-align:center;margin-top:30px;}

#wrap-contact {margin-bottom:300px;}
    #contact-in {display:flex;justify-content:space-between;align-items:center;}
        #contact-details {}
            #contact-details a {font-size:48px;display:block;color:var(--colour-primary);font-weight:500;margin:15px 0;transition:color var(--transition);}
                #contact-details a:hover {color:var(--colour-secondary);}
        #contact-logo {width:clamp(100px, 18vw, 365px);}

footer {background:var(--colour-grey-light);font-size:14px;color:var(--colour-primary);}
    footer .wrapper {display:flex;padding:20px 0;justify-content:space-between;}
    footer a {color:var(--colour-primary);font-size:14px;transition:color var(--transition);}
        footer a:hover {color:var(--colour-secondary);}

    #footer-nav {display:flex;justify-self:end;}
        #footer-nav a + a {margin-left:55px;}

#bottom-shape {position:absolute;z-index:1;width:100%;aspect-ratio:1920/1530;overflow:hidden;bottom:-120px;left:0;margin-bottom:200px;}
    #bottom-shape-main {width:3300px;fill:var(--colour-grey-light);position:absolute;bottom:0;left:0;transform:translatex(-36.5%);}
    #bottom-shape-outline {width:1920px;fill:transparent;position:absolute;bottom:-45px;left:0;z-index:1;stroke:var(--colour-grey);transform:translatex(-15.5%);}

#content-shape {position:absolute;z-index:1;width:100%;aspect-ratio:1920/1530;overflow:hidden;top:30px;left:0;margin-bottom:200px;}
    #content-shape svg {width:3300px;fill:var(--colour-grey-light);position:absolute;top:80px;left:0;transform:translatex(-36.5%);}


#page-bottom-shape {position:absolute;z-index:1;width:100%;padding-top:100px;overflow:hidden;top:auto;left:0;bottom:0;height:700px;}
    #page-bottom-shape-main {transform:translatex(-36.5%);width:3300px;fill:var(--colour-grey-light);position:absolute;top:0px;left:0; }
    #page-bottom-shape-outline {width:1920px;fill:transparent;position:absolute;bottom:auto;top:0px;left:0;z-index:1;stroke:var(--colour-grey);transform:translatex(-15.5%);}

body.page #wrap-contact {margin-bottom:100px;padding-top:250px;}
    body.page #contact-logo {top:-200px;}

@media(max-width:1500px) {
    #join-us-form {right:5%;}
    #wrap-youtube .wrapper {top:-80px;}
    #contact-logo {top:calc(250px - 10vw);}
    #wrap-social {padding-top:180px;}
    body.page #contact-logo {top:0;}
}

@media(max-width:1300px) {
    #join-us-form {width:400px;right:3%;}
         #join-us-form-img {width:130px;}
         #join-us-content {width:340px;}
         #join-us-title {margin-top:10px;}
         #join-us-form form {margin-top:10px;}
            #join-us-submit {margin-top:5px;}
    #wrap-barrels {background:var(--colour-grey-light);}

    #wrap-youtube .wrapper {top:0px;}
    #contact-logo {top:calc(300px - 10vw);}
}

/* This is the mobile trigger only for navigation as it won't fit with current navigation */
@media(max-width:1250px) {
    #wrap-top #wrap-top-in {grid-template-columns:1fr auto;grid-template-areas:"logo navtrigger";}
        #wrap-top #logo {max-width:420px;justify-self:center;transform:translatex(50px);}
    #wrap-top #langs {display:none;}
    #wrap-top #top-links {display:none;}
    #wrap-top nav {display:none;}
    #wrap-top #nav-mobile-trigger {display:block;}
}

/* The rest of items follow 1100px for mobile layout */
@media(max-width:1100px) {
    #wrap-slideshow {margin-bottom:20px;}
    #private-cask-wrap {position:relative;margin-top:-260px;}
        #private-cask-wrap #private-cask {margin:0 auto;}
    #private-cask {width:300px;}
    #wrap-content {background:#e5e5e5;}
        #wrap-content::before {display:none;}

    #wrap-news {margin-top:0;}
        #wrap-news #news-in {grid-template-columns: 1fr;}
        #wrap-news .news-all {left:50%;transform:translatex(-50%);}
        #wrap-news #content-shape {height:3000px;}
            #wrap-news #content-shape svg {width:calc(3200px - 100vh);}

    #wrap-news:after {content:" ";position:absolute;background:#e5e5e5;width:100%;height:600px;bottom:-60px;}

    h2.section-header,  h1#page-header {text-align: center;font-size:40px;}
        h2.section-header::before,  h1#page-header::before {left:50%;transform:translatex(-50%);}

    #wrap-aboutus #invest-left {width:100%;}
    #wrap-aboutus #inveaboutusst-img {position:relative;width:100%;max-width:500px;display:block;margin:30px auto 30px auto;transform:none;}
        #wrap-aboutus #aboutus-img img {width:100%;}

    #wrap-offer {padding-top:40px;}
        #offer-in {margin-top:40px;}

    #wrap-social {padding:0;}
        #wrap-social .wrapper {top:0;grid-template-columns:1fr;}

        #social-img {width:80%;margin:0 auto;}
        #socials {text-align:center;}

    #wrap-contact img{display:block;margin:0 auto;max-width:300px;}
    #wrap-contact #contact-in {display:block;text-align: center;}
        #wrap-contact #contact-in a + a {margin-top:20px;}
        #wrap-contact #contact-in img[src*="logob"] {margin-top:30px;}

    #join-form-wrap {background:#e5e5e5;overflow:hidden;}
        #join-us-form {position:relative;top:0;right:0;margin:0 auto;}

    #offer-cta {text-align:center;}

    #offer-in {grid-template-columns: 1fr;}
        #join-us-img img {max-width:600px;margin:0 auto;}

    #wrap-barrels {padding:40px 0 80px 0;margin:0;}
        #wrap-barrels::before {display:none;}
        #barrels-carousel-inner {grid-auto-columns:50%;}

    #bottom-shape {display:none;}

    #wrap-contact {background:#e5e5e5;margin-bottom:0;}
        #contact-logo {top:0px;}

    footer {background:#e5e5e5;}
        footer .wrapper {flex-flow: column-reverse;}
            #copyright {text-align:center;width:100%;}
            #footer-nav {display:block;text-align: center;}
                #footer-nav a {display:block;font-size:18px;padding:0;margin:15px 0 !important;}

    body.page #wrap-content {background:transparent;}
    body.page #wrap-contact {padding:40px 0;margin:0;}

    body.page #page-bottom-shape {height:700px;padding-top:60px;z-index:2;}
    body.page #page-bottom-shape-main {width:1700px;left:-300px;transform:rotate(-264deg);top:-60px;}
    body.page #page-bottom-shape-outline {display:none;}
    body.page #wrap-contact {padding-top:100px !important;background:transparent !important;z-index:3;}
    body.page footer {z-index:5;}
}

@media(max-width:900px) {
    #aboutus-left {width:100%;}

    #aboutus-img {position:relative;width:80%;max-width:600px;transform:none;margin:40px auto 0 auto;padding-bottom:40px;}
        #aboutus-img img {margin:0 auto;display:block;}

    h2.section-header {font-size:30px;}
}

@media(max-width:800px) {
    #barrels-carousel-inner {grid-auto-columns:100%;}
}

@media(max-width:700px) {

    #wrap-slideshow {width:100%;height:clamp(400px, 65vw, 1260px);}
    #wrap-slideshow::before {width:100%;aspect-ratio:2.5;background:url("images/slide_shape.png");content:" ";z-index:3;position:absolute;bottom:-1px;left:0;background-size:contain;overflow:hidden;}
    #wrap-slideshow_in {width:100%;height:clamp(400px, 50vw, 1260px);}
    #wrap-slideshow_in::before {width:100%;aspect-ratio:2.5;background:url("images/slide_shape.png");content:" ";z-index:3;position:absolute;bottom:-1px;left:0;background-size:contain;overflow:hidden;}


    #private-cask-wrap {position:relative;margin-top:-100px;}
    #private-cask-wrap #private-cask {margin:0 auto;}

    #wrap-content {background:#e5e5e5;}
    #wrap-content::before {display:none;}

    #wrap-top #logo {width:300px;transform:translatex(27.5px);}
    #wrap-top.nav-mobile-open nav {margin-top:50px;}
        #wrap-top.nav-mobile-open nav a {font-size:20px;padding:10px 0;}

    #wrap-top.nav-mobile-open #top-links a svg {width:30px;height:30px;}

    #nav-mobile-close, #nav-mobile-trigger {padding:10px;}
    #nav-mobile-close svg, #nav-mobile-trigger svg {width:35px;height:35px;}

    #private-cask {width:250px;}
    #wrap-slideshow {margin-bottom:20px;}
    #wrap-news #content-shape {top:30px;}

    #contact-details a {font-size:30px;}
    #wrap-contact #contact-in img[src*="logob"] {width:60%;max-width:300px;}
}

@media(max-width:500px) {
    #wrap-top #logo {width:240px;}
    #join-us-content {width:80vw;}
        #join-us-title {font-size:18px;}
    #join-us-form {width:100%;}
    #join-us-form svg {width:130%;left:-15%;}

    .barrel-item {}
        .barrel-content img {max-width:60px;}
        .barrel-content h3 {font-size:18px;}
        .barrel-content .barrel-price {font-size:30px;}

    body.page #wrap-contact {padding-top:60px !important;}
    body.page #page-bottom-shape-main {left:-400px;top:0px;}
}
img {
    max-width: 100%;
    height: auto;
}
.tinymce img {
    max-width: 100%;
    height: auto;
}