/* === PAGE: nucos-jp (scope .nj) === */
.nj {
    --nj-green: #2f6b58;
    --nj-pink: #e46b85;
    --nj-ink: #2b2b2b;
    --nj-line: #2f6b58;
    font-family: 'Noto Sans JP', sans-serif;
    color: var(--nj-ink);
    letter-spacing: .06em
}

.nj h1,
.nj h2,
.nj h3,
.nj-serif,
.nj-nav a,
.nj-foot-nav a {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    color: var(--nj-ink)
}

.nj .button {
    text-transform: none;
    letter-spacing: .1em;
    font-weight: 400
}

.nj-rule {
    display: block;
    width: 40px;
    height: 1px;
    background: var(--nj-line);
    margin: 18px 0
}

.nj-center {
    text-align: center
}

.nj-center .nj-rule {
    margin: 14px auto 16px
}

.nj-h2 {
    font-size: 30px;
    letter-spacing: .14em;
    margin: 0
}

.nj-sub {
    font-size: 15px;
    color: #444;
    margin: 0
}

/* header over hero */
html,
body.page-template-page-blank-landingpage,
body.page-template-page-blank-landingpage #wrapper,
body.page-template-page-blank-landingpage #main {
    background: #f6f6f7 !important
}

.nj-header>* {
    flex-shrink: 0
}

.nj-hero {
    position: relative !important
}

.nj-hero .section-content {
    position: static !important
}

.nj-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 30px;
    padding: 16px 8%;
    background: rgba(255, 255, 255, .62);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .5)
}

.nj-header .nj-nav a {
    text-shadow: 0 0 6px rgba(255, 255, 255, .9), 0 0 2px rgba(255, 255, 255, .9)
}

.nj-header .nj-nav,
.nj-header .nj-cta-wrap {
    margin-left: auto !important
}

.nj-social-links {
    display: flex;
    gap: 18px;
    align-items: center
}

.nj-logo img {
    height: 36px;
    width: auto;
    display: block
}

.nj-nav {
    margin-left: auto;
    display: flex;
    gap: 32px
}

.nj-nav a,
.nj-foot-nav a {
    font-size: 14px;
    letter-spacing: .08em
}

.nj-nav a:hover,
.nj-foot-nav a:hover {
    color: var(--nj-pink)
}

.nj-header>*,
.nj-foot>*,
.nj-nav a,
.nj-lang summary {
    margin: 0 !important
}

.nj-nav,
.nj-nav a,
.nj-lang,
.nj-lang summary {
    display: flex;
    align-items: center;
    height: 40px;
    line-height: 1
}

.nj-cta {
    display: inline-flex;
    align-items: center;
    height: 40px;
    line-height: 1;
    background: #3d5560;
    color: #fff !important;
    border-radius: 99px;
    padding: 0 26px;
    font-size: 14px;
    font-family: 'Noto Serif JP', serif;
    white-space: nowrap
}

.nj-cta:hover {
    opacity: .9;
    background: #e46b85 !important;
}

.nj-lang {
    position: relative;
    font-size: 13px
}

.nj-lang summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px
}

.nj-lang summary::-webkit-details-marker {
    display: none
}

.nj-lang summary::after {
    content: '';
    width: 5px;
    height: 5px;
    border-right: 1px solid;
    border-bottom: 1px solid;
    transform: rotate(45deg);
    margin: -3px 0 0 4px
}

.nj-lang div {
    position: absolute;
    right: 0;
    top: 26px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
    padding: 6px 0;
    min-width: 150px;
    z-index: 30
}

.nj-lang div a {
    display: block;
    padding: 6px 14px;
    color: #333;
    white-space: nowrap
}

.nj-lang div a:hover {
    background: #f3f5f4
}

/* hero */
.nj-hero .nj-hero-row {
    padding-top: 110px
}

.nj-hero-title {
    font-size: 58px;
    line-height: 1.4;
    font-weight: 400 !important;
    letter-spacing: .1em;
    margin: 0
}

.nj-hero-title small {
    font-size: .7em
}

.nj-eyebrow {
    letter-spacing: .2em;
    color: #7b8a8e;
    font-size: 20px;
    font-weight: 300;
    margin: 16px 0 0
}

.nj-lead {
    font-size: 15px;
    line-height: 1.95;
    color: #3a3a3a;
    margin: 0
}

/* products */
.nj-products {
    background: linear-gradient(180deg, #ececf0 0%, #f6f6f8 45%, #f1f1f4 100%)
}

.nj-prod .img-inner {
    border-radius: 6px;
    overflow: hidden;
    background: transparent;
}

.nj-prod-name {
    font-size: 16px;
    letter-spacing: .14em;
    margin: 16px 0 4px
}

.nj-prod-desc {
    font-size: 13px;
    color: #444;
    margin: 0 0 14px
}

.nj .nj-more.button {
    border: 1px solid #3d5560;
    color: #3d5560;
    background: transparent;
    min-width: 140px;
    font-size: 12px;
    padding: 0 22px
}

.nj .nj-more.button:hover {
    background: var(--nj-pink);
    border-color: var(--nj-pink);
    color: #fff
}

/* stores */
.nj-store .img-inner {
    border: 1px solid #e3e3e3;
    background: #fff;
    height: 84px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    transition: box-shadow .2s
}

.nj-store .img-inner img {
    max-height: 58px;
    width: auto;
    object-fit: contain
}

.nj-store:hover .img-inner {
    box-shadow: 0 6px 18px rgba(0, 0, 0, .08)
}

.nj-store-name {
    font-size: 12px;
    text-align: center;
    margin: 8px 0 0
}

.nj-store-name a {
    color: #333
}

.nj-store-name a::after {
    content: ' →';
    margin-left: 6px
}

/* brand + footer */
.nj-brand {
    background: #f6f6f7
}

.nj-foot {
    display: flex;
    align-items: center;
    gap: 44px;
    border-top: 1px solid #dcdcdc;
    padding: 26px 0 34px
}

.nj-foot .nj-logo img {
    height: 40px
}

.nj-foot-nav {
    display: flex;
    gap: 38px;
    flex-wrap: wrap
}

.nj-foot .nj-social {
    margin-left: auto !important;
    display: flex;
    gap: 56px;
    align-items: center
}

.nj-social a {
    color: #222;
    display: flex
}

.nj-social svg {
    width: 24px;
    height: 24px
}

.nj-foot .nj-lang div {
    top: auto;
    bottom: 26px
}

@media (max-width:849px) {

    .nj-nav,
    .nj-foot-nav {
        display: none
    }

    .nj-header {
        gap: 12px;
        padding: 10px 16px
    }

    .nj-header .nj-logo img {
        height: 30px
    }

    .nj-header .nj-cta {
        margin-left: auto;
        padding: 7px 16px;
        font-size: 12px
    }

    .nj-hero .section-bg::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(255, 255, 255, .75) 0%, rgba(255, 255, 255, .35) 55%, rgba(255, 255, 255, 0) 80%)
    }

    .nj-hero .nj-hero-row {
        padding-top: 80px
    }

    .nj-hero-title {
        font-size: 34px
    }

    .nj-eyebrow {
        font-size: 14px
    }

    .nj-lead {
        font-size: 13px
    }

    .nj-h2 {
        font-size: 24px
    }

    .nj-foot {
        flex-wrap: wrap;
        gap: 16px;
        justify-content: space-between
    }

    .nj-foot .nj-social {
        margin-left: 0 !important;
        gap: 24px
    }
}

/* popup sản phẩm (.nj-products) */
.nj-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0, 0, 0, .6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: nj-fade .2s
}

@keyframes nj-fade {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

html.nj-popup-open {
    overflow: hidden
}

.nj-popup-wrap {
    position: relative;
    width: 100%;
    max-width: 880px
}

.nj-popup-close {
    position: absolute;
    top: 6px;
    right: 10px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    font-size: 30px;
    line-height: 1;
    color: #333;
    cursor: pointer;
    padding: 0
}

.nj-popup {
    position: relative;
    background: #fff;
    border-radius: 6px;
    margin: 0 auto;
    padding: 36px 40px 32px;
    max-height: 86vh;
    overflow-y: auto;
    font-family: 'Noto Sans JP', sans-serif;
    color: #2b2b2b;
    letter-spacing: .04em;
    font-size: 14px;
    line-height: 1.8
}

.nj-popup-title {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-size: 22px;
    letter-spacing: .08em;
    margin: 0 0 20px;
    color: #2b2b2b
}

.nj-popup-name {
    color: #2f6b58
}

.nj-popup-body {
    display: flex;
    gap: 32px;
    align-items: flex-start
}

.nj-popup-text {
    flex: 1 1 auto;
    min-width: 0
}

.nj-popup-img {
    flex: 0 0 260px
}

.nj-popup-img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px
}

.nj-popup-sec {
    margin: 0 0 14px
}

.nj-popup-sec h4 {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-size: 15px;
    letter-spacing: .1em;
    margin: 0 0 4px;
    padding-left: 10px;
    border-left: 3px solid #2f6b58
}

.nj-popup-sec p {
    margin: 0 0 4px;
    font-size: 13px
}

.nj-popup-sec .nj-popup-lead {
    color: #555
}

.nj-popup-sec ul {
    margin: 0 0 6px 18px;
    font-size: 13px
}

.nj-popup-sec li {
    margin: 0 0 2px
}

.nj-popup-note {
    margin: 16px 0 0;
    padding-top: 12px;
    border-top: 1px solid #e3e3e3;
    font-size: 12px;
    color: #666
}

@media (max-width:849px) {
    .nj-popup {
        padding: 28px 18px 22px
    }

    .nj-popup-title {
        font-size: 18px
    }

    .nj-popup-body {
        flex-direction: column-reverse;
        gap: 16px
    }

    .nj-popup-img {
        flex: none;
        width: 60%;
        margin: 0 auto
    }
}

/* footer: row > 3 col (logo / liên hệ / nhà phân phối) */
.nj-footer .nj-ft {
    max-width: 980px !important;
    padding: 44px 0 40px;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 1.7;
    letter-spacing: 0;
    color: #222
}

.nj-footer .nj-ft .col {
    padding-bottom: 0
}

.nj-footer .nj-ft-brand>.col-inner {
    padding: 0 32px 0 20px
}

.nj-footer .nj-ft-contact {
    border-left: 1px solid #222;
    border-right: 1px solid #222
}

.nj-footer .nj-ft-contact>.col-inner {
    padding: 0 32px
}

.nj-footer .nj-ft-legal>.col-inner {
    padding: 0 20px 0 32px
}

.nj-footer .nj-ft-logo {
    margin-bottom: 12px !important;
    margin-left: -14px;
    max-width: 200px
}

.nj-footer .nj-ft p {
    margin: 0;
    font-size: 15px
}

.nj-footer .nj-ft-addr,
.nj-footer .nj-ft-tel {
    margin-bottom: 6px !important
}

.nj-footer .nj-ft-addr p,
.nj-footer .nj-ft-tel p {
    position: relative;
    padding-left: 32px
}

.nj-footer .nj-ft-addr p::before,
.nj-footer .nj-ft-tel p::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 18px;
    height: 18px;
    background: #222;
    -webkit-mask: var(--ic) center/contain no-repeat;
    mask: var(--ic) center/contain no-repeat
}

.nj-footer .nj-ft-addr p::before {
    --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M215.7 499.2C267 435 384 279.4 384 192 384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2 12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z'/%3E%3C/svg%3E")
}

.nj-footer .nj-ft-tel p::before {
    --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M164.9 24.6c-7.7-18.6-28-28.5-47.4-23.2l-88 24C12.1 30.2 0 46 0 64c0 247.4 200.6 448 448 448 18 0 33.8-12.1 38.6-29.5l24-88c5.3-19.4-4.6-39.7-23.2-47.4l-96-40c-16.3-6.8-35.2-2.1-46.3 11.6L304.7 368C234.3 334.7 177.3 277.7 144 207.3L193.3 167c13.7-11.2 18.4-30 11.6-46.3l-40-96z'/%3E%3C/svg%3E")
}

.nj-footer .nj-ft a {
    color: inherit;
    text-decoration: none
}

.nj-footer .nj-ft a:hover {
    opacity: .7
}

@media (max-width:849px) {
    .nj-footer .nj-ft {
        padding: 32px 0
    }

    .nj-footer .nj-ft-brand>.col-inner,
    .nj-footer .nj-ft-contact>.col-inner,
    .nj-footer .nj-ft-legal>.col-inner {
        padding: 0 20px
    }

    .nj-footer .nj-ft-contact {
        border: 0
    }

    .nj-footer .nj-ft-contact {
        border-top: 1px solid #bbb;
        border-bottom: 1px solid #bbb;
        padding: 18px 0 12px !important;
        margin: 18px 0
    }
}

/* trang tiếng Việt: dùng font có hỗ trợ dấu tiếng Việt */
html[lang="vi"] .nj,
html[lang="vi"] .nj .button {
    font-family: 'Noto Sans', sans-serif
}

html[lang="vi"] .nj h1,
html[lang="vi"] .nj h2,
html[lang="vi"] .nj h3,
html[lang="vi"] .nj-serif,
html[lang="vi"] .nj-nav a,
html[lang="vi"] .nj-foot-nav a,
html[lang="vi"] .nj-cta,
html[lang="vi"] .nj-popup,
html[lang="vi"] .nj-popup-title,
html[lang="vi"] .nj-popup-sec h4 {
    font-family: 'Noto Serif', serif
}

html[lang="vi"] .nj-footer .nj-ft,
html[lang="vi"] .nj-popup {
    font-family: 'Noto Sans', sans-serif
}

html[lang="vi"] .nj-hero-title {
    font-size: 50px;
    letter-spacing: .04em
}

html[lang="vi"] .nj-h2 {
    letter-spacing: .06em
}

html[lang="vi"] .nj-prod-name {
    letter-spacing: .06em;
    font-size: 15px
}

@media (max-width:849px) {
    html[lang="vi"] .nj-hero-title {
        font-size: 30px
    }
}
/* === SECTION: Press (báo chí) === */
.nj-press{background:#fff}
.nj-press .nj-press-card>.col-inner{padding:0 14px}
.nj-press .nj-press-logo{width:150px;margin:0 auto 14px!important}
.nj-press .nj-press-logo img{height:60px;width:auto;object-fit:contain;margin:0 auto}
.nj-press .nj-press-thumb{border-radius:6px;overflow:hidden;margin-bottom:14px!important}
.nj-press .nj-press-title p{margin:0;font-size:15px;line-height:1.6;font-weight:700;letter-spacing:.02em;text-align:center}
.nj-press .nj-press-title a{color:var(--nj-ink)}
.nj-press .nj-press-title a{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nj-press .nj-press-title a:hover{color:var(--nj-pink)}
@media (max-width:849px){.nj-press .nj-press-card{margin-bottom:28px}}

/* === SECTION: Brand (hàng: col 4 thông tin + col 8 slider 3 ảnh) === */
.nj-brand .nj-brand-eyebrow{margin:0 0 6px;font-size:12px;letter-spacing:.4em;color:#8a8a8f;text-transform:uppercase}
.nj-brand .nj-brand-row{max-width:1100px;border-bottom:1px solid #dcdcdc;padding:26px 0}
.nj-brand .nj-brand-row:last-of-type{border-bottom:0}
.nj-brand .nj-brand-info>.col-inner{padding:0 24px 0 40px}
.nj-brand .nj-brand-year{margin:0 0 4px;font-family:'Noto Serif JP',serif;font-size:64px;font-weight:500;line-height:1.05;letter-spacing:.02em;background:linear-gradient(180deg,#c3a874 0%,#8a6d3b 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#a88a55}
.nj-brand .nj-brand-title{margin:0 0 6px;font-family:'Noto Serif JP',serif;font-size:24px;line-height:1.3;color:var(--nj-ink)}
.nj-brand .nj-brand-tag{margin:0 0 14px;font-size:15px;line-height:1.7;letter-spacing:.06em;color:#444}
.nj-brand .nj-brand-more{margin:0;position:relative;padding-top:12px;font-size:14px;letter-spacing:.08em;color:var(--nj-ink)}
.nj-brand .nj-brand-more::before{content:'';position:absolute;left:0;top:0;width:24px;height:1px;background:#999}
.nj-brand .nj-brand-more::after{content:' →';margin-left:8px}
.nj-brand .nj-brand-gallery .slider-wrapper{padding-bottom:6px}
.nj-brand .nj-brand-gallery .row-inner,.nj-brand .nj-brand-gallery .row{margin:0}
.nj-brand .nj-brand-gallery .col-inner{padding:0}
.nj-brand .nj-brand-gallery .col{padding:0 8px 0}
.nj-brand .nj-brand-img .img-inner{border-radius:2px;overflow:hidden;background:transparent}
.nj-brand .nj-brand-img img{object-fit:cover}
.nj-brand .nj-brand-gallery .flickity-page-dots{bottom:-22px}
@media (max-width:849px){
 .nj-brand .nj-brand-row{padding:22px 0 34px}
 .nj-brand .nj-brand-info>.col-inner{padding:0 16px 14px}
 .nj-brand .nj-brand-year{font-size:44px}
 .nj-brand .nj-brand-title{font-size:20px}
 .nj-brand .nj-brand-gallery .col{padding:0 4px}
}
.nj-brand .nj-brand-gallery .flickity-slider>.row,.nj-brand .nj-brand-gallery .slider>.row{width:100%;max-width:100%;margin:0}

/* Products slider: prev/next arrows always visible, gold gradient circle + white arrow
   (Flatsome slider-nav-light draws them white and only reveals them on hover) */
.nj-products .flickity-prev-next-button{opacity:1!important;transform:none!important;color:#fff!important}
.nj-products .flickity-prev-next-button svg{background:linear-gradient(180deg,#c3a874 0%,#8a6d3b 100%) border-box no-repeat;border:0!important;border-radius:50%;fill:#fff!important}
.nj-products .flickity-prev-next-button:hover svg{background:linear-gradient(180deg,#b39560 0%,#735a2e 100%) border-box no-repeat}
/* Products slider arrows sit outside the product cards (wide screens have room; tablets nudge less) */
.nj-products .slider-wrapper,.nj-products .slider{overflow:visible!important}
.nj-products .flickity-prev-next-button.previous{left:-24px!important}
.nj-products .flickity-prev-next-button.next{right:-24px!important}
@media (min-width:1200px){
 .nj-products .flickity-prev-next-button.previous{left:-64px!important}
 .nj-products .flickity-prev-next-button.next{right:-64px!important}
}
/* Products slider dots: gold outline, active dot filled with the gold gradient */
.nj-products .flickity-page-dots .dot{border-color:#a88a55!important;background:transparent!important;opacity:1!important}
.nj-products .flickity-page-dots .dot.is-selected{background:linear-gradient(180deg,#c3a874 0%,#8a6d3b 100%) border-box no-repeat!important;border-color:transparent!important}

/* Footer alignment (desktop): wider row, columns stretched to equal height so the dividers run full height,
   content of each column vertically centred, address kept on one line */
@media (min-width:850px){
 .nj-footer .nj-ft{max-width:1140px!important;align-items:stretch!important}
 .nj-footer .nj-ft>.nj-ft-brand{flex:0 0 38%;max-width:38%}
 .nj-footer .nj-ft>.nj-ft-contact{flex:0 0 34%;max-width:34%}
 .nj-footer .nj-ft>.nj-ft-legal{flex:0 0 28%;max-width:28%}
 .nj-footer .nj-ft>.col>.col-inner{height:100%;display:flex;flex-direction:column;justify-content:center}
 .nj-footer .nj-ft-addr p{white-space:nowrap}
}

/* Phones: the two headings share one row and the six logos another, so regroup them as
   OFFLINE + its 3 logos, then ONLINE + its 3 logos */
@media (max-width:549px){
    .nj-stores .section-content{display:flex;flex-wrap:wrap}
    .nj-stores .section-content>.row:first-child{width:100%}
    .nj-stores .section-content>.amlab_second_title,
    .nj-stores .section-content>.row-small{display:contents}
    .nj-stores .amlab_second_title>.col:nth-child(1){order:1}
    .nj-stores .row-small>.col:nth-child(-n+3){order:2}
    .nj-stores .amlab_second_title>.col:nth-child(2){order:3}
    .nj-stores .row-small>.col:nth-child(n+4){order:4}
}

/* Product names wrap to two lines on narrow screens: give every name the same height so the
   description and button of neighbouring cards line up */
@media (max-width:849px){
    .nj-prod-name{display:flex;align-items:center;justify-content:center;min-height:3em;line-height:1.5}
}

/* Tighter tracking keeps the longest names on two lines on small phones */
@media (max-width:549px){
    .nj-prod-name{letter-spacing:.06em}
}

/* Store names on phones: Japanese names stay on one line, English names get two lines of height,
   so the line below starts at the same level in every column */
@media (max-width:549px){
    .nj-stores .row-small .col-inner>p{font-size:13px;letter-spacing:.02em;line-height:1.4;margin-bottom:6px}
    html[lang="ja"] .nj-stores .row-small .col-inner>p:first-of-type{white-space:nowrap}
    html[lang="en"] .nj-stores .row-small .col-inner>p:first-of-type{display:flex;align-items:center;justify-content:center;min-height:2.8em}
}