/* Homepage palette and full-height landscape. */
.yy-home .yy-header {
    background: linear-gradient(#f7fbf8f5, #f7fbf8dc 77%, #f7fbf8a3);
    border-bottom-color: transparent;
}
.yy-home .yy-header.yy-header-scrolled {
    background: #fff;
    border-bottom-color: var(--yy-line);
}
.yy-home .yy-header-contact,
.yy-home .yy-button {
    color: #fff;
    background: var(--yy-green);
    border-radius: 50px;
}
.yy-home .yy-header-contact > span,
.yy-home .yy-contact-email > span,
.yy-home .yy-form-bottom .yy-button > span,
.yy-home .yy-header .submenu-icon { display: none; }
.yy-home .yy-header .submenu-toggle::after {
    content: "";
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    background:
        linear-gradient(currentColor, currentColor) center / 9px 1px no-repeat,
        linear-gradient(currentColor, currentColor) center / 1px 9px no-repeat;
    transition: background-size .2s ease;
}
.yy-home .yy-header .submenu-toggle[aria-expanded="true"]::after,
.yy-home .yy-header .has-submenu:focus-within > .submenu-toggle::after {
    background-size: 9px 1px, 1px 0;
}
.yy-home :is(.yy-button, .yy-header-contact) {
    position: relative;
    overflow: hidden;
    transition: background-color .2s ease, transform .2s ease;
}
.yy-home :is(.yy-button, .yy-header-contact)::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 33%, #ffffff3b 50%, transparent 67%);
    transform: translateX(-110%);
    pointer-events: none;
}
.yy-home :is(.yy-button, .yy-header-contact):is(:hover, :focus-visible, :active) {
    background-color: var(--yy-accent);
}
.yy-home.yy-scroll-effects :is(.yy-button, .yy-header-contact):focus-visible::after {
    transform: translateX(110%);
    transition: transform .55s ease-out;
}
.yy-home .yy-button:hover { transform: none; }
.yy-home.yy-scroll-effects :is(.yy-button, .yy-header-contact):active {
    transform: scale(.97);
}
@media (hover: hover) {
    .yy-home .yy-header .has-submenu:hover > .submenu-toggle::after {
        background-size: 9px 1px, 1px 0;
    }
    .yy-home.yy-scroll-effects :is(.yy-button, .yy-header-contact):hover::after {
        transform: translateX(110%);
        transition: transform .55s ease-out;
    }
}
.yy-home .yy-header .nav-menu > li > [aria-current="page"] {
    color: var(--yy-green);
    font-weight: 700;
}
.yy-nature-hero {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    align-items: center;
    background: #e8efeb;
}
.yy-nature-scene,
.yy-nature-hero::before {
    position: absolute;
    inset: 0;
}
.yy-nature-scene { z-index: -2; }
.yy-nature-scene img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 53% center;
}
.yy-nature-hero::before {
    content: "";
    z-index: -1;
    background:
        linear-gradient(0deg, #102d25a3, transparent 19%),
        radial-gradient(ellipse at 0% 30%, #f7fbf6c9 0%, #f7fbf68c 33%, transparent 66%);
}
.yy-nature-inner { padding-block: calc(var(--yy-header) + 42px) 116px; }
.yy-nature-copy { max-width: 690px; }
.yy-nature-brand {
    margin: 0 0 23px;
    color: var(--yy-green);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .1em;
}
.yy-nature-brand span {
    font-weight: 400;
    margin-left: 12px;
    padding-left: 13px;
    border-left: 1px solid #658f7a;
    letter-spacing: 0;
}
.yy-nature-hero h1 {
    margin: 0;
    color: var(--yy-ink);
    font-size: clamp(41px, 4.6vw, 76px);
    font-weight: 750;
    line-height: 1.22;
    letter-spacing: -.028em;
    text-shadow: 0 1px 16px #f8fbf59e;
}
.yy-nature-en {
    max-width: 420px;
    margin: 20px 0 21px;
    color: #365e51;
    font-size: 15px;
    line-height: 1.55;
}
.yy-nature-summary {
    margin: 0;
    color: #25473b;
    font-size: 16px;
    line-height: 1.85;
}
.yy-nature-scroll {
    position: absolute;
    bottom: 21px;
    left: 50%;
    transform: translateX(-50%);
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 8px 15px 12px;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .12em;
    text-shadow: 0 1px 5px #15382a;
}
.yy-scroll-indicator {
    display: grid;
    justify-items: center;
    width: 17px;
    height: 25px;
    padding-top: 4px;
    border: 1px solid currentColor;
    border-radius: 10px;
}
.yy-scroll-indicator::before {
    content: "";
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: currentColor;
}
.yy-scroll-effects .yy-scroll-indicator::before { animation: yy-scroll-point 1.6s ease-out 2; }
.yy-nature-scroll:is(:hover, :focus-visible, :active) .yy-scroll-indicator {
    background: #fff;
    color: #173b30;
}
@keyframes yy-scroll-point {
    75%, 100% { transform: translateY(10px); opacity: 0; }
}
.yy-nature-scroll:focus-visible { outline-color: #fff; }
.yy-home .yy-home-title {
    color: var(--yy-ink);
    font-size: clamp(29px, 3vw, 40px);
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin: 0;
}
.yy-home-title::after {
    content: "";
    width: 44px;
    height: 3px;
    background: var(--primary-dark);
}
.yy-company-intro {
    overflow: clip;
    padding-block: clamp(58px, 6.2vw, 100px);
    background: var(--brand-surface);
}
.yy-company-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    align-items: center;
    gap: clamp(30px, 5.5vw, 84px);
}
@media (prefers-reduced-motion: no-preference) {
    .yy-company-enter { animation: yy-company-slide-in 1s cubic-bezier(.22, 1, .36, 1); }
}
@keyframes yy-company-slide-in {
    from { transform: translateX(var(--yy-intro-offset)); opacity: .45; }
    to { transform: translateX(0); opacity: 1; }
}
.yy-company-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
    color: var(--yy-green);
    font-size: 15px;
    font-weight: 700;
}
.yy-company-label::before {
    content: "";
    width: 32px;
    height: 2px;
    background: currentColor;
}
.yy-company-copy h2 {
    margin: 0 0 20px;
    color: var(--yy-ink);
    font-size: clamp(26px, 2.8vw, 41px);
    line-height: 1.35;
    text-wrap: initial;
}
.yy-company-copy p:not(.yy-company-label) {
    margin: 0 0 14px;
    color: #3e554d;
    font-size: 15px;
    line-height: 1.95;
}
.yy-company-copy .yy-button {
    margin-top: 12px;
    border-radius: 4px;
}
.yy-company-photo {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.53;
    object-fit: cover;
}
.yy-company-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(10px, 1.7vw, 26px);
    list-style: none;
    margin: clamp(26px, 4vw, 55px) 0 0;
    padding: clamp(10px, 1.4vw, 22px);
}
.yy-company-facts li { container-type: inline-size; }
.yy-company-facts a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: clamp(6px, 1.1vw, 18px);
    min-height: clamp(92px, 10.4vw, 154px);
    height: 100%;
    padding: 12px clamp(8px, 2vw, 34px);
    background: #fff;
    color: #17212a;
    transition: background-color .22s ease, color .22s ease;
}
.yy-fact-icon {
    display: block;
    width: clamp(25px, 4vw, 61px);
    color: var(--yy-accent);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.yy-fact-copy { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; text-align: right; }
.yy-fact-label { color: var(--yy-muted); font-size: clamp(11px, 1.16vw, 16px); }
.yy-fact-value {
    white-space: nowrap;
    font-size: clamp(16px, 12.6cqi, 48px);
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    line-height: 1.05;
}
.yy-fact-unit { margin-inline-start: .09em; font-size: .63em; }
.yy-company-facts a:is(:hover, :focus-visible, :active) {
    background-color: var(--yy-green);
    color: #fff;
}
.yy-company-facts a:is(:hover, :focus-visible, :active) :is(.yy-fact-label, .yy-fact-icon) { color: inherit; }
.yy-fields-note { text-align: center; color: var(--yy-muted); margin: 19px 0 34px; }
.yy-fields-more { margin-top: 35px; text-align: center; }
.yy-home .yy-field-image {
    border-radius: 10px;
    transition: background-color .25s ease;
}
.yy-home .yy-field:is(:hover, :focus-visible, :active) .yy-field-image {
    background-color: #e1eee5;
}
.yy-home .yy-field:is(:hover, :focus-visible, :active) .yy-field-name h3,
.yy-home .yy-contact-email:is(:hover, :focus-visible),
.yy-home .yy-light-link:is(:hover, :focus-visible) {
    text-decoration: underline;
    text-underline-offset: .24em;
}
.yy-home:not(.yy-scroll-effects) .yy-field:hover .yy-field-image > img { transform: none; }
@media (prefers-reduced-motion: no-preference) {
    .yy-home.yy-scroll-effects .yy-field:focus-visible .yy-field-image > img { transform: scale(1.045); }
}



.yy-partners {
    isolation: isolate;
    padding-block: clamp(24px, 4vw, 58px);
    background: var(--brand-surface);
}
.yy-partners-link { display: block; cursor: zoom-in; }
.yy-partners-link img {
    display: block;
    width: 100%;
    height: auto;
    clip-path: inset(1px 0 0);
    filter: url(#yy-thumbnail-white);
    mix-blend-mode: multiply;
}
@media (prefers-reduced-motion: no-preference) {
    .yy-partners-enter img {
        animation: yy-partners-reveal 1.05s cubic-bezier(.25, .8, .3, 1);
    }
}
@keyframes yy-partners-reveal {
    from { clip-path: inset(1px 0 82%); opacity: .65; transform: translateY(12px); }
    to { clip-path: inset(1px 0 0); opacity: 1; transform: none; }
}
.yy-partners-zoom { display: none; }
@media (max-width: 700px) {
    .yy-partners-zoom {
        display: block;
        width: fit-content;
        margin: 8px auto 0;
        padding: 7px 10px;
        color: var(--yy-green);
        font-size: 13px;
        text-decoration: underline;
        text-underline-offset: 4px;
    }
}
@media (min-width: 1600px) {
    .yy-home .yy-header > .yy-wrap,
    .yy-nature-inner {
        width: calc(100% - clamp(144px, 14vw, 400px));
        max-width: none;
    }
    .yy-nature-copy { max-width: 860px; }
    .yy-nature-hero h1 { font-size: clamp(76px, 4.6vw, 96px); }
    .yy-nature-en { max-width: 490px; font-size: 17px; }
    .yy-nature-summary { font-size: 18px; }
}
@media (min-width: 1100px) and (min-aspect-ratio: 2/1) {
    .yy-nature-scene img { object-position: 53% 72%; }
}
@media (max-width: 950px) {
    .yy-nature-scene img { object-position: 45% center; }
    .yy-nature-hero::before {
        background:
            linear-gradient(0deg, #102d25a3, transparent 19%),
            radial-gradient(ellipse at 0% 34%, #f7fbf6ed, #f7fbf6a3 42%, transparent 76%);
    }
}
@media (max-width: 700px) {
    .yy-nature-hero { align-items: start; }
    .yy-nature-scene img { object-position: 50% 73%; }
    .yy-nature-hero::before {
        background: linear-gradient(180deg, #f7fbf7fa 7%, #f7fbf7ee 26%, #f7fbf7bf 46%, transparent 72%, #102d259c);
    }
    .yy-nature-inner {
        text-align: center;
        padding-block: calc(var(--yy-header) + clamp(24px, 6svh, 60px)) 92px;
    }
    .yy-nature-brand { margin-bottom: 15px; font-size: 12px; }
    .yy-nature-hero h1 { font-size: clamp(30px, 8.8vw, 52px); }
    .yy-nature-en { max-width: 290px; font-size: 13px; margin: 14px auto; }
    .yy-nature-summary { font-size: 14px; line-height: 1.7; }
    .yy-nature-scroll { bottom: 16px; }
    .yy-company-layout { grid-template-columns: 1fr; gap: 25px; }
    .yy-company-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-height: 520px) {
    .yy-nature-inner { padding-block: calc(var(--yy-header) + 8px) 74px; }
    .yy-nature-brand { margin-bottom: 10px; }
    .yy-nature-hero h1 { font-size: clamp(26px, 8vh, 40px); }
    .yy-nature-en { margin-block: 7px; }
    .yy-nature-scroll { bottom: 8px; }
}

@media (prefers-reduced-motion: reduce) {
    .yy-home :is(.yy-button, .yy-header-contact)::after { display: none; }
    .yy-home.yy-scroll-effects :is(.yy-button, .yy-header-contact):active { transform: none; }
}