/*
Theme Name: SY 2025
Theme URI: https://example.com
Author: Stone
Author URI: https://example.com
Description: A minimal Full Site Editing (FSE) block theme for WordPress. Built as a clean starting point for custom WordPress projects.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sy-2025
Tags: block-theme, full-site-editing, custom-colors, custom-spacing, custom-typography, editor-style, featured-images, style-variations, template-editing, wide-blocks
*/

h1,h2,h3,h4,h5,h6,p,a {
    color: #202338;
}
p,a,span {
    font-family: "Hedvig Letters Serif", serif;
}

h1 {
    font-size: 56px;
}
h2 {
    font-size: 48px;
}
h3 {
    font-size: 32px;
}

.px-default {
    padding-left: 64px;
    padding-right: 64px;
}


.home-body {
    display: flex;
    flex-direction: column;
    gap: 112px;
}

/*banner*/
.banner-text__content h1 {
    font-size: 48px;
}
.banner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 15px;
}
.banner figure,
.banner figure img {
    max-width: 1312px;
    max-height: 575px;
    width: 100%;
    object-fit: cover;
}
.banner-text {
    /*position: absolute;*/
    /*bottom: 0;*/
    margin-top: -230px;
    background: url(./assets/images/banner-text-bg.svg);
    width: 100%;
    height: 570px;
    overflow-y: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-size: cover;    
    background-position: center;
    border-radius: 15px;
    padding: 0 20px;
}
.banner-text__content {
    margin-top: 150px !important;
    max-width: 940px;
}
.banner-button a {
    display: flex !important;
    align-items: center;
    gap: 12px;
}
.banner-button a:before {
    content: url(./assets/images/phone-banner.svg);    
    position: relative;
    width: 20px;
    height: 26px;
}

.block-img-text {
    display: flex;
    flex-direction: row;
    /*padding: 0 64px;*/
    margin: auto;
}
.block-img-text__text {
    max-width: 568px;
    gap: 12px;
}
.block-img-text figure {
    flex-shrink: 0;
    max-width: 552px;
    border-radius: 15px;
}
.block-img-text figure img {
    border-radius: 15px;
}
.block-img-text__story {
    max-width: 675px;
}

/*zero-waste*/
.zero-waste {
    gap: 32px;
}
.zero-waste-title {
    max-width: 768px;
}
.zer-waste-list {
    gap: 24px;
}
.zer-waste-card {
    max-width: 516px;
    margin: 0 auto !important;
}
.zer-waste-card img {
    max-width: 516px;
    aspect-ratio: 1.16/1;
    object-fit: cover;
    border-radius: 15px;
    width: 100%;
}

/*principles*/
.principle-header-desc {
    max-width: 768px;
    text-align: center;
    padding: 0 20px;
    margin-top: -20px;    
}
@media (min-width: 1500px) {
    .principle {
        max-width: 1964px;
    }
}
.principle {
    background: url(./assets/images/principle-bg.svg);
    overflow: clip;
    background-size: cover;    
    background-position: center;
    background-repeat: no-repeat;
    /*height: 3859px;    */
    display: flex;
    flex-direction: column;
    /*align-items: center;*/
    /*justify-content: center;*/
    width: 100%;
    margin: auto !important;  
    gap: 132px;
    padding-top: 350px;
    padding-bottom: 275px;
    /*background: #1C365B;*/
}
.principle .block-img-text {
    /*margin-top: 100px;*/
}
.principle .block-img-text p {
    font-size: 24px;
}
.principle .block-img-text__text {
    max-width: 695px;
}
.principle .block-img-text figure {
    max-width: 425px;
}
.principle-list h2 {
    max-width: 786px;
    text-align: center;
    font-size: 64px;
}
.principle-list h2 span {
    font-size: 72px;
    font-family: "Holtwood One SC", serif;
}
.principle-list,
.principle-list__body {
    display: flex;
    flex-direction: column;
}
.principle-list { gap: 64px; }
.principle-list__body { gap: 112px; }

.stylized-header h3:first-child {
    font-size: 96px;
    font-family: "Holtwood One SC", serif;
    font-weight: 400;
}
.principle-outro {
    font-size: 36px;
    max-width: 868px;
}
.principle-list sup,
.principle-list sup p,
.principle-list sup a {
    color: #EAB000 !important;
}

/*video*/
.recipes {
    width: 100%;
}
.recipe-body {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}
.recipe-body iframe {
    aspect-ratio: 16/9;
    position: relative !important;
}
.recipe-body .wp-has-aspect-ratio .wp-block-embed__wrapper::before {
    padding: 0 !important;
}
.recipe-body,
.recipe-main {
    max-width: 1180px;
    width: 100%;
}
.recipe-main {
    gap: 32px;
}
.recipe-body figure {
    margin-block-start: 0 !important;
    width: 100%;
}



/*footer*/
.footer {
    margin-top: 112px;
    padding: 80px 0;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}
.footer-body {
    display: flex;
    gap: 112px;
    padding: 32px 112px;
    border-top: 2px solid #202338;
    margin: auto;
    justify-content: center;
}
.footer-body figure {
    width: fit-content;    
}
.footer-body a,
.footer-body p {
    color: #202338;
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 20px;
}
.footer-tel:before,
.footer-email:before,
.footer-addr:before,
.footer-license:before {
    width: 36px;
    height: 36px;
}
.footer-tel:before {
    content: url(./assets/images/phone.svg);
}
.footer-email:before {
    content: url(./assets/images/mail.svg);
}
.footer-addr:before {
    content: url(./assets/images/address.svg);
}
.footer-license:before {
    content: url(./assets/images/license.svg);
}

@media (max-width: 1180px) {
    .block-img-text {
        flex-direction: column-reverse;
    }
    .block-img-text__reverse {
        flex-direction: column;
    }
    .principle {
        background: url(./assets/images/principle-bg-1180.svg);
        background-size: cover;    
        background-position: center;
        background-repeat: no-repeat;        
    }
    .footer {
        padding: 80px 20px;
    }
    .recipe-body {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 1080px) {
    .banner-text {
        background: url(./assets/images/banner-text-bg-750.svg);
        background-size: cover;    
        background-position: center;
        height: 570px;
    }    
    .banner-text__content {
        margin-top: 75px !important;
    }
    .banner figure, .banner figure img {
        height: 500px !important;
    }    
}
@media (max-width: 750px) {
    h1 {
        font-size: 40px;
    }
    h2 {
        font-size: 32px;
    }
    h3 {
        font-size: 28px;
    }    
    .banner-text__content h1 {
        font-size: 32px;
    }
    .block-img-text p {
        font-size: 18px;
    }
    .principle .block-img-text p {
        font-size: 20px;
    }
    .principle-list h2 {
        max-width: 786px;
        text-align: center;
        font-size: 48px;
    }
    .principle-list h2 span {
        font-size: 64px;
        font-family: "Holtwood One SC", serif;
    }
    .principle-outro {
        font-size: 28px;
        max-width: 868px;
    }
    .px-default {
        padding-left: 20px;
        padding-right: 20px;
    }

    .footer-body {
        flex-direction: column;
        padding: 32px 20px;
        gap: 64px;
    }
}
@media (max-width: 650px) {
    .banner-text {
        height: 570px;
    }    
}
@media (max-width: 550px) {
    .principle {
        background: url(./assets/images/principle-bg-550.svg);
        background-size: cover;    
        background-position: center;
        background-repeat: no-repeat;        
    }    

    .recipe-body {
        grid-template-columns: 1fr;
    }    
}
@media (max-width: 450px) {
    .banner-text {
        height: 720px;
    }    
}