/* Home cuisine infographic. */
.nh-cuisine {
    --nh-cuisine-navy: #0d4a76;
    --nh-cuisine-orange: #f8992b;
    --nh-cuisine-green: #5d9829;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    scroll-margin-top: 88px;
    padding: 0 !important;
    background-color: #fffdf8;
    color: #2f2e2b;
}

.nh-cuisine::before,
.nh-cuisine::after {
    position: absolute;
    z-index: -1;
    content: "";
    pointer-events: none;
}

.nh-cuisine::before {
    top: -95px;
    left: -100px;
    width: 470px;
    height: 220px;
    opacity: .18;
    background: #f5b75d;
    clip-path: polygon(0 14%, 86% 0, 63% 23%, 100% 19%, 38% 51%, 72% 54%, 0 100%);
    transform: rotate(-9deg);
}

.nh-cuisine::after {
    right: -150px;
    bottom: -125px;
    width: 470px;
    height: 280px;
    opacity: .12;
    background: #f8992b;
    clip-path: polygon(35% 0, 100% 5%, 100% 100%, 0 100%, 20% 62%, 4% 61%, 56% 37%);
    transform: rotate(-6deg);
}

.nh-cuisine-corner {
    position: absolute;
    z-index: 0;
    display: block;
    pointer-events: none;
}

.nh-cuisine-corner-top {
    top: -40px;
    right: -35px;
    width: 250px;
    height: 145px;
    border: 18px solid rgba(93, 152, 41, .15);
    border-left: 0;
    border-bottom: 0;
    border-radius: 0 0 0 100%;
    transform: rotate(10deg);
}

.nh-cuisine-corner-bottom {
    bottom: 42px;
    left: -100px;
    width: 240px;
    height: 190px;
    border: 22px solid rgba(93, 152, 41, .18);
    border-right: 0;
    border-top: 0;
    border-radius: 0 100% 0 0;
    transform: rotate(-8deg);
}

.nh-cuisine-shell {
    position: relative;
    z-index: 1;
    width: min(100%, 1240px);
    margin: 0 auto;
    padding: 96px 20px 36px;
}

.nh-cuisine-header {
    position: relative;
    z-index: 5;
    max-width: 950px;
    margin: 0 auto;
    text-align: center;
}

.nh-cuisine-kicker {
    display: block;
    margin: 0 0 4px !important;
    padding: 0;
    color: var(--nh-cuisine-orange) !important;
    background: transparent;
    clip-path: none;
    font-family: "Dancing Script", cursive, serif !important;
    font-size: 21px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none;
}

.nh-cuisine-kicker span {
    color: inherit !important;
}

.nh-cuisine-title {
    margin: 10px 0 14px !important;
    color: var(--nh-cuisine-navy) !important;
    font-family: "Phudu", sans-serif !important;
    font-size: 66px !important;
    font-weight: 900 !important;
    line-height: .98 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
}

.nh-cuisine-title-line {
    display: block;
    color: inherit !important;
}

.nh-cuisine-title em {
    display: inline-block;
    margin-left: 7px;
    color: var(--nh-cuisine-orange) !important;
    font-style: normal;
    font-size: 1.12em;
    transform: rotate(-2deg);
}

.nh-cuisine-title-leaves {
    position: relative;
    display: inline-block;
    width: 112px;
    height: 47px;
    margin-left: 4px;
    vertical-align: middle;
}

.nh-cuisine-title-leaves i {
    position: absolute;
    display: block;
    width: 41px;
    height: 15px;
    background: var(--nh-cuisine-green);
    border-radius: 100% 0 100% 0;
    transform-origin: left center;
}

.nh-cuisine-title-leaves i:nth-child(1) { left: 6px; top: -2px; transform: rotate(-20deg); }
.nh-cuisine-title-leaves i:nth-child(2) { left: 12px; top: 20px; transform: rotate(15deg); }
.nh-cuisine-title-leaves i:nth-child(3) { left: 20px; top: 7px; width: 38px; transform: rotate(0deg); }

.nh-cuisine-intro {
    max-width: 750px;
    margin: 0 auto !important;
    color: #3e3934 !important;
    font-family: "Dosis", sans-serif !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
}

.nh-cuisine-stage {
    position: relative;
    display: grid;
    grid-template-areas:
        "one visual three"
        "two visual four";
    grid-template-columns: 285px minmax(0, 1fr) 285px;
    grid-template-rows: repeat(2, minmax(365px, auto));
    gap: 20px 18px;
    align-items: stretch;
    margin-top: 28px;
}

.nh-cuisine-card {
    --card-tone: var(--nh-cuisine-navy);
    position: relative;
    z-index: 4;
    display: flex;
    min-width: 0;
    min-height: 365px;
    padding: 29px 28px 24px;
    overflow: visible;
    flex-direction: column;
    background: rgba(255, 255, 255, .97);
    border: 1px solid rgba(13, 74, 118, .28);
    border: 1px solid color-mix(in srgb, var(--card-tone) 52%, white);
    box-shadow: 0 14px 26px rgba(82, 57, 24, .08);
}

.nh-cuisine-card::after {
    position: absolute;
    z-index: -1;
    content: "";
    inset: 10px -10px -10px 10px;
    border: 6px solid var(--card-tone);
    opacity: .95;
    pointer-events: none;
}

.nh-cuisine-card-one {
    grid-area: one;
    border-radius: 8px 112px 102px 84px / 8px 120px 95px 90px;
}

.nh-cuisine-card-one::after {
    border-width: 3px 0 0 3px;
    border-radius: 8px 118px 105px 88px / 8px 125px 99px 92px;
}

.nh-cuisine-card-two {
    --card-tone: var(--nh-cuisine-green);
    grid-area: two;
    border-radius: 108px 85px 8px 108px / 102px 88px 8px 110px;
}

.nh-cuisine-card-two::after {
    inset: 9px 10px -10px -10px;
    border-width: 0 0 6px 7px;
    border-radius: 114px 90px 8px 116px / 108px 94px 8px 118px;
}

.nh-cuisine-card-three {
    --card-tone: var(--nh-cuisine-orange);
    grid-area: three;
    border-radius: 112px 8px 108px 92px / 118px 8px 104px 96px;
}

.nh-cuisine-card-three::after {
    inset: 10px -10px -10px 10px;
    border-width: 4px 8px 8px 0;
    border-radius: 118px 8px 114px 98px / 124px 8px 110px 102px;
}

.nh-cuisine-card-four {
    grid-area: four;
    border-radius: 94px 112px 112px 8px / 96px 110px 116px 8px;
}

.nh-cuisine-card-four::after {
    inset: 8px -10px -10px 10px;
    border-width: 0 7px 7px 0;
    border-radius: 100px 118px 118px 8px / 102px 116px 122px 8px;
}

.nh-cuisine-card-top {
    display: flex;
    min-height: 104px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}

.nh-cuisine-card-three .nh-cuisine-number,
.nh-cuisine-card-four .nh-cuisine-number {
    order: 2;
}

.nh-cuisine-number {
    display: inline-flex;
    flex: 0 0 68px;
    width: 68px;
    height: 68px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--card-tone);
    border: 3px solid #fff;
    border-radius: 48% 52% 46% 54%;
    box-shadow: 0 0 0 4px var(--card-tone), inset 0 0 0 2px rgba(255, 255, 255, .35);
    font-family: "Phudu", sans-serif;
    font-size: 31px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
    transform: rotate(-5deg);
}

.nh-cuisine-card-three .nh-cuisine-number,
.nh-cuisine-card-four .nh-cuisine-number {
    transform: rotate(5deg);
}

.nh-cuisine-card-illustration {
    display: block;
    flex: 0 0 auto;
    width: 88px;
    height: 88px;
    margin: 0;
    object-fit: contain;
}

.nh-cuisine-card h3 {
    margin: 0 0 10px !important;
    color: var(--nh-cuisine-navy) !important;
    font-family: "Phudu", sans-serif !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
}

.nh-cuisine-card p {
    margin: 0 0 16px !important;
    color: #37332f !important;
    font-family: "Dosis", sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.52 !important;
    letter-spacing: 0 !important;
}

.nh-cuisine-more {
    display: inline-flex;
    width: max-content;
    margin-top: auto;
    align-items: center;
    gap: 6px;
    color: var(--nh-cuisine-navy) !important;
    border-bottom: 2px solid var(--card-tone);
    font-family: "Phudu", sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.6;
    letter-spacing: 0;
    text-decoration: none !important;
    text-transform: uppercase;
}

.nh-cuisine-more svg {
    display: block;
    width: 22px;
    height: 22px;
    overflow: visible;
    fill: none;
    stroke: var(--card-tone);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .2s ease;
}

.nh-cuisine-more:hover svg,
.nh-cuisine-more:focus-visible svg {
    transform: translateX(4px);
}

.nh-cuisine-visual {
    position: relative;
    z-index: 2;
    display: flex;
    grid-area: visual;
    min-width: 0;
    min-height: 750px;
    margin: 0 !important;
    align-items: center;
    justify-content: center;
}

.nh-cuisine-center-image {
    position: relative;
    z-index: 3;
    display: block;
    width: 650px;
    max-width: none;
    height: auto;
    margin: 0;
    object-fit: contain;
}

.nh-cuisine-route {
    position: absolute;
    z-index: 4;
    display: block;
    width: 94px;
    height: 72px;
    border-top: 2px dashed currentColor;
    border-radius: 50%;
    color: var(--nh-cuisine-navy);
}

.nh-cuisine-route::after {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
}

.nh-cuisine-route-left {
    top: 42%;
    left: -10px;
    transform: rotate(28deg);
}

.nh-cuisine-route-left::after {
    display: none;
    top: -6px;
    right: 2px;
    transform: rotate(36deg);
}

.nh-cuisine-route-right {
    top: 27%;
    right: -10px;
    color: var(--nh-cuisine-orange);
    transform: rotate(-30deg);
}

.nh-cuisine-route-right::after {
    display: none;
    top: -6px;
    right: 2px;
    transform: rotate(36deg);
}

.nh-cuisine-benefits {
    position: relative;
    z-index: 6;
    display: grid;
    max-width: 1000px;
    margin: 24px auto 0 !important;
    padding: 15px 22px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    list-style: none;
    background: rgba(255, 247, 232, .94);
    border: 1px solid rgba(248, 153, 43, .16);
    border-radius: 6px;
    box-shadow: 0 10px 30px rgba(91, 59, 23, .07);
}

.nh-cuisine-benefits li {
    position: relative;
    display: flex;
    min-width: 0;
    margin: 0 !important;
    padding: 0 18px;
    align-items: center;
    gap: 12px;
}

.nh-cuisine-benefits li:not(:last-child)::after {
    position: absolute;
    top: 9px;
    right: 0;
    width: 1px;
    height: calc(100% - 18px);
    content: "";
    background: rgba(206, 139, 57, .55);
}

.nh-cuisine-benefit-icon {
    display: inline-flex;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--nh-cuisine-orange);
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(248, 153, 43, .45);
}

.nh-cuisine-benefit-icon svg {
    display: block;
    width: 29px;
    height: 29px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nh-cuisine-benefits li > span:last-child {
    display: block;
    min-width: 0;
    color: #49413a;
    font-family: "Phudu", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: 0;
    text-transform: uppercase;
}

.nh-cuisine-benefits strong,
.nh-cuisine-benefits b {
    display: block;
    color: inherit;
    font: inherit;
}

.nh-cuisine-benefits b {
    margin-top: 3px;
    color: var(--nh-cuisine-navy);
}

@media (max-width: 1099px) {
    .nh-cuisine-title { font-size: 56px !important; }
    .nh-cuisine-stage {
        grid-template-areas:
            "visual visual"
            "one three"
            "two four";
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: 610px auto auto;
        max-width: 800px;
        margin-right: auto;
        margin-left: auto;
    }
    .nh-cuisine-visual { min-height: 610px; }
    .nh-cuisine-center-image { width: 690px; }
    .nh-cuisine-card { min-height: 330px; }
    .nh-cuisine-route { display: none; }
    .nh-cuisine-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; row-gap: 18px; }
    .nh-cuisine-benefits li:nth-child(2)::after { display: none; }
}

@media (max-width: 849px) {
    .nh-cuisine-shell { padding: 82px 18px 34px; }
    .nh-cuisine-kicker { padding: 8px 28px; font-size: 18px !important; }
    .nh-cuisine-title { margin-top: 12px !important; font-size: 44px !important; }
    .nh-cuisine-title-leaves { width: 76px; height: 36px; }
    .nh-cuisine-title-leaves i { width: 38px; height: 11px; }
    .nh-cuisine-title-leaves i:nth-child(1) { left: 4px; top: 18px; }
    .nh-cuisine-title-leaves i:nth-child(2) { left: 29px; top: 14px; }
    .nh-cuisine-title-leaves i:nth-child(3) { left: 57px; top: 20px; width: 23px; }
    .nh-cuisine-intro { font-size: 16px !important; }
}

@media (max-width: 549px) {
    .nh-cuisine-shell { padding: 76px 15px 28px; }
    .nh-cuisine-kicker { width: min(100%, 340px); padding: 8px 18px; font-size: 15px !important; }
    .nh-cuisine-title { font-size: 36px !important; line-height: 1.02 !important; }
    .nh-cuisine-title em { margin-left: 2px; }
    .nh-cuisine-title-leaves { display: none; }
    .nh-cuisine-intro { font-size: 15px !important; }
    .nh-cuisine-stage {
        grid-template-areas: "visual" "one" "two" "three" "four";
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 365px repeat(4, auto);
        gap: 18px;
        margin-top: 20px;
    }
    .nh-cuisine-visual { min-height: 365px; overflow: hidden; }
    .nh-cuisine-center-image { width: 430px; }
    .nh-cuisine-card {
        min-height: 0;
        padding: 24px 24px 22px;
        border-radius: 8px 70px 70px 56px / 8px 74px 64px 58px;
    }
    .nh-cuisine-card::after { border-radius: inherit; }
    .nh-cuisine-card-top { min-height: 86px; margin-bottom: 8px; }
    .nh-cuisine-number { flex-basis: 58px; width: 58px; height: 58px; font-size: 26px; }
    .nh-cuisine-card-illustration { width: 76px; height: 76px; }
    .nh-cuisine-card h3 { font-size: 19px !important; }
    .nh-cuisine-card p { font-size: 15px !important; }
    .nh-cuisine-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 15px 8px !important; gap: 16px 0; }
    .nh-cuisine-benefits li { padding: 0 9px; flex-direction: column; gap: 8px; text-align: center; }
    .nh-cuisine-benefits li::after { display: none !important; }
    .nh-cuisine-benefit-icon { flex-basis: 48px; width: 48px; height: 48px; }
    .nh-cuisine-benefit-icon svg { width: 25px; height: 25px; }
    .nh-cuisine-benefits li > span:last-child { font-size: 12px; }
}
