/* LEGACY PvP internal-page production shell — reference implementation */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+Thai:wght@300;400;500;600&display=swap");

.legacy-page-production {
    --legacy-page-obsidian: #07090c;
    --legacy-page-ruby: #a51f32;
    --legacy-page-ruby-deep: #861829;
    --legacy-page-gold: #caaa69;
    --legacy-page-gold-muted: #b99a62;
    --legacy-page-ivory: #f2e9dc;
    --legacy-page-parchment: #e9dece;
    --legacy-page-ink: #29241f;
    --legacy-page-body: #403a34;
    --legacy-page-muted: #6b6258;
    --legacy-page-ease: cubic-bezier(.2,.75,.2,1);
    background: var(--legacy-page-obsidian);
    color: var(--legacy-page-ink);
    font-family: "Noto Sans Thai", Inter, "Segoe UI", sans-serif;
}

.legacy-page-production .legacy-page-page-shell::before {
    background-image:
        linear-gradient(180deg,rgba(5,8,11,.08),rgba(13,12,11,.18) 48%,rgba(7,9,12,.6)),
        url("/assets/legacy/images/hero/hero-home-main-v1.webp");
    background-position: center, center top;
    background-size: auto, cover;
}

/* Shared dark navigation, aligned with Home. */
.legacy-page-production .legacy-page-nav {
    min-height: 92px;
    padding: 0;
    border-bottom: 1px solid rgba(202,170,105,.2);
    background: rgba(5,8,11,.78);
    color: #f2eee7;
    box-shadow: 0 12px 34px rgba(0,0,0,.18);
    -webkit-backdrop-filter: blur(18px) saturate(.88);
    backdrop-filter: blur(18px) saturate(.88);
}

.legacy-page-production .legacy-page-nav__inner {
    width: min(1480px,calc(100% - 52px));
    min-height: 92px;
    gap: 24px;
}

.legacy-page-production .legacy-page-nav__logo {
    width: 62px;
    height: 70px;
    display: grid;
    place-items: center;
}

.legacy-page-production .legacy-page-nav__logo img {
    width: 58px;
    height: 58px;
    object-fit: contain;
    filter: drop-shadow(0 8px 10px rgba(0,0,0,.45));
}

.legacy-page-production .legacy-page-nav__menu { gap: 25px; }
.legacy-page-production .legacy-page-nav__links { gap: 22px; }

.legacy-page-production .legacy-page-nav__link,
.legacy-page-production .legacy-page-nav__action,
.legacy-page-production .legacy-page-nav__trigger {
    position: relative;
    min-height: 66px;
    padding: 9px 2px;
    justify-content: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #eee9e1;
    transform: none;
}

.legacy-page-production .legacy-page-nav__link::after,
.legacy-page-production .legacy-page-nav__trigger::after {
    position: absolute;
    right: 50%;
    bottom: 4px;
    left: 50%;
    height: 2px;
    content: "";
    background: linear-gradient(90deg,var(--legacy-page-ruby),var(--legacy-page-gold));
    transition: right .2s ease,left .2s ease;
}

.legacy-page-production .legacy-page-nav__link:hover,
.legacy-page-production .legacy-page-nav__action:hover,
.legacy-page-production .legacy-page-nav__trigger:hover,
.legacy-page-production .legacy-page-nav__link.is-active,
.legacy-page-production .legacy-page-nav__link--guide.is-submenu-open > .legacy-page-nav__trigger {
    border: 0;
    background: transparent;
    color: #fffaf0;
    transform: none;
}

.legacy-page-production .legacy-page-nav__link:hover::after,
.legacy-page-production .legacy-page-nav__link.is-active::after,
.legacy-page-production .legacy-page-nav__trigger:hover::after,
.legacy-page-production .legacy-page-nav__link--guide.is-submenu-open > .legacy-page-nav__trigger::after {
    right: 0;
    left: 0;
}

.legacy-page-production .legacy-page-nav__label {
    font-family: "Noto Sans Thai",sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
}

.legacy-page-production .legacy-page-nav__meta {
    color: var(--legacy-page-gold-muted);
    font: 600 9px/1.25 Inter,sans-serif;
    letter-spacing: .12em;
}

.legacy-page-production .legacy-page-nav__action {
    min-width: 142px;
    padding-inline: 17px;
    border: 1px solid rgba(202,170,105,.32);
    border-radius: 4px;
}

.legacy-page-production .legacy-page-nav__link--guide .legacy-page-nav__dropdown {
    min-width: 260px;
    padding: 9px;
    border: 1px solid rgba(202,170,105,.2);
    border-radius: 5px;
    background: rgba(8,11,15,.97);
    box-shadow: 0 22px 48px rgba(0,0,0,.42);
}

.legacy-page-production .legacy-page-nav__dropdown a {
    min-height: 44px;
    padding: 10px 12px;
    border-left: 2px solid transparent;
    border-radius: 3px;
    color: #c9c3ba;
    font-family: "Noto Sans Thai",sans-serif;
    font-size: 14px;
}

.legacy-page-production .legacy-page-nav__dropdown a:hover,
.legacy-page-production .legacy-page-nav__dropdown a:focus-visible,
.legacy-page-production .legacy-page-nav__dropdown a[aria-current="page"] {
    border-left-color: var(--legacy-page-ruby);
    background: linear-gradient(90deg,rgba(165,31,50,.2),rgba(202,170,105,.03));
    color: #fff8eb;
}

/* Editorial page masthead. */
.legacy-page-production .legacy-page-page-hero {
    padding: 44px 0 20px;
}

.legacy-page-production .legacy-page-page-hero__inner,
.legacy-page-production .legacy-page-page-content__inner {
    width: min(1440px,calc(100% - 48px));
}

.legacy-page-production .legacy-page-page-hero__card {
    min-height: 214px;
    padding: 38px 46px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(202,170,105,.24);
    border-radius: 8px;
    background:
        linear-gradient(105deg,rgba(7,10,14,.91),rgba(11,14,18,.77) 58%,rgba(46,26,23,.6)),
        radial-gradient(circle at 82% 20%,rgba(165,31,50,.2),transparent 36%);
    box-shadow: 0 26px 56px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.03);
}

.legacy-page-production .legacy-page-page-hero__card::before {
    border-radius: 0;
    background: linear-gradient(90deg,rgba(165,31,50,.82) 0 3px,transparent 3px),linear-gradient(135deg,rgba(255,255,255,.025),transparent 52%);
}

.legacy-page-production .legacy-page-page-kicker {
    margin-bottom: 10px;
    color: var(--legacy-page-gold);
    font: 600 10px/1.2 Inter,sans-serif;
    letter-spacing: .16em;
}

.legacy-page-production .legacy-page-page-kicker::before {
    width: 18px;
    height: 1px;
    border-radius: 0;
    background: var(--legacy-page-ruby);
    box-shadow: none;
    transform: none;
}

.legacy-page-production .legacy-page-page-title {
    color: #fff8eb;
    font: 500 clamp(44px,5vw,68px)/1 Georgia,serif;
    letter-spacing: .035em;
    text-shadow: 0 3px 18px rgba(0,0,0,.24);
}

.legacy-page-production .legacy-page-page-subtitle {
    max-width: 850px;
    margin-top: 14px;
    color: #cbc3b9;
    font-size: 17px;
}

/* Production content surface. */
.legacy-page-production .legacy-page-page-content { padding-bottom: 54px; }

.legacy-page-production .legacy-page-page-content__inner {
    padding: 28px;
    border: 1px solid rgba(151,109,52,.3);
    border-radius: 8px;
    background: linear-gradient(180deg,rgba(242,233,220,.97),rgba(231,220,203,.97));
    box-shadow: 0 30px 62px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.58);
}

.legacy-page-production .legacy-page-quicknav {
    position: sticky;
    top: 104px;
    z-index: 20;
    margin: 0 0 24px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    border: 1px solid rgba(202,170,105,.2);
    border-radius: 5px;
    background: rgba(8,11,15,.92);
    box-shadow: 0 12px 28px rgba(0,0,0,.16);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}

.legacy-page-production .legacy-page-quicknav > span {
    margin-right: 5px;
    padding: 7px 11px;
    color: var(--legacy-page-gold);
    font: 650 9px Inter,sans-serif;
    letter-spacing: .14em;
}

.legacy-page-production .legacy-page-quicknav a {
    padding: 8px 11px;
    border-left: 1px solid rgba(255,255,255,.07);
    color: #c8c1b8;
    font-size: 12px;
    transition: color .18s ease,background .18s ease;
}

.legacy-page-production .legacy-page-quicknav a:hover,
.legacy-page-production .legacy-page-quicknav a:focus-visible {
    outline: 0;
    background: rgba(165,31,50,.15);
    color: #fff8eb;
}

.legacy-page-production .legacy-page-legacy-content .main-header {
    margin-bottom: 20px;
    padding: 4px 2px 18px;
    border-bottom-color: rgba(134,24,41,.2);
}

.legacy-page-production .legacy-page-legacy-content .main-header span {
    color: var(--legacy-page-ink);
    font: 500 clamp(28px,3vw,40px)/1.1 Georgia,serif;
    letter-spacing: .035em;
}

.legacy-page-production .legacy-page-legacy-content .main-header p { font-size: 14px !important; }

.legacy-page-production .legacy-page-legacy-content .row { gap: 16px; }

.legacy-page-production .legacy-page-legacy-content .box-sv {
    scroll-margin-top: 176px;
    border: 1px solid rgba(127,86,45,.2);
    border-radius: 6px;
    background: linear-gradient(180deg,rgba(255,253,248,.96),rgba(246,237,224,.93));
    box-shadow: 0 12px 26px rgba(65,45,29,.075),inset 0 1px rgba(255,255,255,.72);
}

.legacy-page-production .legacy-page-legacy-content [id] { scroll-margin-top: 176px; }
.legacy-page-production .legacy-page-legacy-content .box-sv-body { padding: 20px 21px; }

.legacy-page-production .legacy-page-legacy-content .box-text-haeder {
    min-height: 46px;
    margin: -20px -21px 15px;
    padding: 12px 17px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    border-bottom: 1px solid rgba(134,24,41,.16);
    background: linear-gradient(90deg,rgba(134,24,41,.1),rgba(202,170,105,.05) 68%,transparent);
    color: var(--legacy-page-ruby-deep);
    font: 650 15px/1.3 Inter,sans-serif;
    letter-spacing: .04em;
}

.legacy-page-production .legacy-page-legacy-content .box-text-haeder i {
    width: 25px;
    color: #a47e37;
    font-size: 17px;
    text-align: center;
}

.legacy-page-production .legacy-page-legacy-content .box-text-haeder small {
    flex-basis: 100%;
    margin: -2px 0 0 32px;
    color: #766b60;
    font-family: "Noto Sans Thai",sans-serif;
    font-size: 12px;
    font-weight: 400;
}

.legacy-page-production .legacy-page-legacy-content .line-box { display: none; }
.legacy-page-production .legacy-page-legacy-content .list-haeder { color: #3a322b; font-size: 15px; font-weight: 650; }

.legacy-page-production .legacy-page-legacy-content .list-text {
    position: relative;
    margin: 7px 0;
    padding-left: 14px;
    color: #443d37;
    font-size: 15px;
    line-height: 1.72;
}

.legacy-page-production .legacy-page-legacy-content .list-text::before {
    position: absolute;
    top: .78em;
    left: 0;
    width: 4px;
    height: 4px;
    content: "";
    background: var(--legacy-page-gold-muted);
    transform: rotate(45deg);
}

.legacy-page-production .legacy-page-legacy-content .list-text img[src$="arrow_small.png"] { display: none; }
.legacy-page-production .legacy-page-legacy-content .list-text img:not([src$="arrow_small.png"]) { margin-left: 1px; }
.legacy-page-production .legacy-page-legacy-content .font-org { color: var(--legacy-page-ruby-deep); font-weight: 650; }
.legacy-page-production .legacy-page-obsolete-tags { display: none; }

@media (max-width: 1180px) {
    .legacy-page-production .legacy-page-nav__links { gap: 11px; }
    .legacy-page-production .legacy-page-nav__label { font-size: 13px; }
    .legacy-page-production .legacy-page-nav__action { min-width: 126px; }
}

@media (max-width: 767px) {
    .legacy-page-production .legacy-page-nav { min-height: 74px; }
    .legacy-page-production .legacy-page-nav__inner { width: calc(100% - 28px); min-height: 74px; }
    .legacy-page-production .legacy-page-nav__logo { width: 54px; height: 60px; }
    .legacy-page-production .legacy-page-nav__logo img { width: 50px; height: 50px; }
    .legacy-page-production .legacy-page-nav__toggle { border-color: rgba(202,170,105,.25); border-radius: 4px; background: rgba(7,10,14,.7); color: #eee9e1; box-shadow: none; }
    .legacy-page-production .legacy-page-nav__menu { top: calc(100% + 1px); right: -14px; left: -14px; padding: 14px; border: 1px solid rgba(202,170,105,.18); border-radius: 0 0 5px 5px; background: rgba(7,10,14,.985); }
    .legacy-page-production .legacy-page-nav__link,.legacy-page-production .legacy-page-nav__action,.legacy-page-production .legacy-page-nav__trigger { min-height: 58px; padding: 9px 12px; align-items: flex-start; border-bottom: 1px solid rgba(255,255,255,.055); }
    .legacy-page-production .legacy-page-nav__action { margin-top: 8px; align-items: center; border: 1px solid rgba(202,170,105,.25); }
    .legacy-page-production .legacy-page-page-hero { padding: 24px 0 14px; }
    .legacy-page-production .legacy-page-page-hero__inner,.legacy-page-production .legacy-page-page-content__inner { width: calc(100% - 28px); }
    .legacy-page-production .legacy-page-page-hero__card { min-height: 190px; padding: 28px 23px; }
    .legacy-page-production .legacy-page-page-title { font-size: 42px; }
    .legacy-page-production .legacy-page-page-subtitle { font-size: 15px; }
    .legacy-page-production .legacy-page-page-content__inner { padding: 14px; }
    .legacy-page-production .legacy-page-quicknav { position: static; margin-bottom: 18px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
    .legacy-page-production .legacy-page-quicknav::-webkit-scrollbar { display: none; }
    .legacy-page-production .legacy-page-quicknav > span,.legacy-page-production .legacy-page-quicknav a { flex: none; }
    .legacy-page-production .legacy-page-legacy-content .box-sv-body { padding: 18px 16px; }
    .legacy-page-production .legacy-page-legacy-content .box-text-haeder { margin: -18px -16px 14px; padding-inline: 14px; }
    .legacy-page-production .legacy-page-legacy-content .box-text-haeder small { margin-left: 32px; }
    .legacy-page-production .legacy-page-legacy-content .list-text { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .legacy-page-production * { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}