/* ============================================================
   PRIVATE LABEL PAGE  (loaded only on /private-label/)
   Light, on-theme: white / paper / sand surfaces, forest ink,
   leaf-green accents, turmeric-gold details.
============================================================ */

/* ---------- Hero ---------- */
.pl-hero { position: relative; overflow: hidden; }
.pl-hero::after {
    content: "";
    position: absolute;
    right: -4%;
    bottom: -22%;
    width: 560px;
    height: 560px;
    background: url("../images/illustrations/leaf-fan-sage.svg") no-repeat center / contain;
    opacity: 0.22;
    pointer-events: none;
}
.pl-hero .container { position: relative; z-index: 1; }
.pl-hero .tag-label { margin-bottom: 1.2rem; }
.pl-hero-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 2.2rem; }
.pl-hero-actions .btn svg { width: 16px; height: 16px; }

/* ---------- Shared bits ---------- */
.pl-lead { font-size: 1.02rem; line-height: 1.85; color: var(--gray); max-width: 54ch; }
.pl-check {
    flex-shrink: 0;
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    border-radius: 50%;
    background: rgba(92, 168, 60, 0.14);
    color: var(--leaf-ink);
}
.pl-check svg { width: 12px; height: 12px; }

/* ---------- Intro ---------- */
.pl-intro { background: var(--paper); }
.pl-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 5.5rem;
    align-items: center;
}
.pl-intro-media { position: relative; }
.pl-intro-img { width: 100%; aspect-ratio: 4 / 4.6; object-fit: cover; object-position: center 45%; border-radius: var(--radius); }
.pl-badge {
    position: absolute;
    right: -1.6rem;
    bottom: 2.4rem;
    display: flex;
    flex-direction: column-reverse;
    gap: 0.35rem;
    padding: 1.2rem 1.4rem;
    background: var(--white);
    border: 1px solid var(--nude);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
}
.pl-badge-num { font-family: var(--font-display); font-weight: 600; font-size: 2.2rem; line-height: 1; color: var(--leaf-ink); }
.pl-badge-txt {
    font-family: var(--font-head);
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    line-height: 1.5;
    color: var(--tan);
}
.pl-intro-content .sec-title { margin-bottom: 1.4rem; }
.pl-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1.6rem;
    margin-top: 2.2rem;
    padding-top: 2rem;
    border-top: 1px solid var(--line);
}
.pl-checks li, .pl-assure-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--ink);
}

/* ---------- What we manufacture (editorial list) ---------- */
.pl-range { background: var(--white); }
.pl-range-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 5rem;
    align-items: start;
}
.pl-range-head { position: sticky; top: calc(var(--header-h) + 2.5rem); }
.pl-range-head .sec-sub { max-width: 40ch; }
.pl-range-link { margin-top: 2rem; }
.pl-range-list { border-top: 1px solid var(--line); }
.pl-range-row {
    position: relative;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.6rem;
    padding: 1.6rem 1.2rem 1.6rem 0.4rem;
    border-bottom: 1px solid var(--line);
    transition: background 0.35s ease, padding 0.45s var(--ease);
}
.pl-range-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    bottom: -1px;
    width: 3px;
    background: var(--red);
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.45s var(--ease);
}
.pl-range-row:hover { background: var(--paper); padding-left: 1.4rem; }
.pl-range-row:hover::before { transform: scaleY(1); }
.pl-range-ico {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--paper);
    border: 1px solid var(--nude);
    color: var(--leaf-ink);
    transition: background 0.35s ease, border-color 0.35s ease;
}
.pl-range-ico svg { width: 32px; height: 32px; }
.pl-range-row:hover .pl-range-ico { background: var(--white); border-color: rgba(92, 168, 60, 0.45); }
.pl-range-name {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.55rem;
    line-height: 1.15;
    color: var(--ink);
    margin-bottom: 0.3rem;
}
.pl-range-desc { font-size: 0.92rem; line-height: 1.65; color: var(--gray); max-width: 48ch; }
.pl-range-idx {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 500;
    font-style: italic;
    color: var(--tan);
}

/* ---------- Facility ---------- */
.pl-facility { background: var(--white); border-top: 1px solid var(--nude); }
.pl-facility-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 5rem;
    align-items: center;
}
.pl-facility-content .sec-title { margin-bottom: 1.4rem; }
.pl-assure {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 2.2rem;
}
.pl-assure-item {
    padding: 1.05rem 1.1rem;
    background: var(--paper);
    border: 1px solid var(--nude);
    border-radius: var(--radius-sm);
}
.pl-facility-media { position: relative; }
.pl-facility-media .img-frame::after { left: auto; right: -1.1rem; }
.pl-facility-img {
    width: 100%;
    aspect-ratio: 5 / 5.4;
    object-fit: cover;
    object-position: 58% center;
    border-radius: var(--radius);
}
.pl-media-chip {
    position: absolute;
    left: 2rem;
    bottom: 2rem;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1.1rem;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 999px;
    font-family: var(--font-head);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--brick);
    box-shadow: var(--shadow-sm);
}
.pl-media-chip .logo-sub-hex { width: 9px; height: 10px; margin: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
    .pl-intro-grid, .pl-facility-grid, .pl-range-grid { grid-template-columns: 1fr; gap: 3.5rem; }
    .pl-range-head { position: static; }
    .pl-intro-media { max-width: 560px; }
    .pl-badge { right: 1.2rem; }
    .pl-facility-media { order: -1; max-width: 640px; }
}
@media (max-width: 640px) {
    .pl-hero::after { width: 320px; height: 320px; right: -30%; bottom: -12%; }
    .pl-hero-actions .btn { flex: 1 1 100%; }
    .pl-checks, .pl-assure { grid-template-columns: 1fr; }
    .pl-badge { padding: 1rem 1.2rem; bottom: 1.6rem; }
    .pl-badge-num { font-size: 1.8rem; }
    .pl-range-row { grid-template-columns: 52px minmax(0, 1fr); gap: 1.1rem; padding: 1.3rem 0.2rem; }
    .pl-range-row:hover { padding-left: 0.9rem; }
    .pl-range-ico { width: 52px; height: 52px; }
    .pl-range-ico svg { width: 26px; height: 26px; }
    .pl-range-name { font-size: 1.3rem; }
    .pl-range-idx { display: none; }
    .pl-media-chip { left: 1.5rem; bottom: 1.5rem; }
}
