/* Natural — product page */

/* ── Layout ── */
.nt-pdp-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    gap: clamp(28px, 4.5vw, 72px);
    align-items: start;
    padding-bottom: clamp(28px, 4vw, 48px);
}
@media (max-width: 899px) {
    .nt-pdp-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ── Gallery ── */
.nt-gallery { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.nt-gallery-main { position: relative; }
.nt-gallery-stage {
    position: relative; display: block; width: 100%;
    aspect-ratio: 1;
    padding: 0; border: 1px solid var(--nt-line);
    border-radius: var(--nt-r-panel); overflow: hidden;
    background: var(--nt-surface);
    cursor: zoom-in;
}
div.nt-gallery-stage { cursor: default; }
.nt-gallery-slide {
    position: absolute; inset: 0;
    opacity: 0; transition: opacity 320ms ease;
}
.nt-gallery-slide.active { opacity: 1; }
.nt-gallery-slide img { width: 100%; height: 100%; object-fit: cover; }
.nt-gallery-badge { position: absolute; top: 16px; left: 16px; pointer-events: none; }
.nt-gallery-nav {
    position: absolute; right: 16px; bottom: 16px;
    display: flex; align-items: center; gap: 8px;
    background: rgba(251, 249, 244, 0.7);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: var(--nt-r-pill); padding: 6px;
}
.nt-gallery-count { font-size: 13px; color: var(--nt-ink-2); min-width: 40px; text-align: center; }

.nt-thumbs {
    display: flex; gap: 10px;
    overflow-x: auto; scrollbar-width: none;
    padding-bottom: 2px;
}
.nt-thumbs::-webkit-scrollbar { display: none; }
.nt-thumb {
    flex: none; width: 76px; height: 76px; padding: 0;
    border: 1px solid var(--nt-line); border-radius: 12px; overflow: hidden;
    background: var(--nt-surface);
    opacity: .7; transition: opacity 160ms ease, border-color 160ms ease;
}
.nt-thumb:hover { opacity: 1; }
.nt-thumb.active { opacity: 1; border-color: var(--nt-ink); }
.nt-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* ── Info column ── */
.nt-info {
    display: flex; flex-direction: column; align-items: stretch; gap: 16px;
    min-width: 0;
}
@media (min-width: 900px) {
    .nt-info { position: sticky; top: 128px; }
}
.nt-info > .nt-eyebrow { align-self: flex-start; }
.nt-info-cat:hover { color: var(--nt-ink) !important; }
.nt-info-title {
    font-family: var(--nt-font-display); font-weight: 400;
    font-size: clamp(32px, 3.6vw, 48px); line-height: 1.04; letter-spacing: -0.02em;
    margin: -6px 0 0; text-wrap: pretty; overflow-wrap: anywhere;
}
.nt-price-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.nt-price { font-size: 22px; font-weight: 500; }
.nt-price-was { font-size: 16px; color: var(--nt-ink-3); }
.nt-tax-line { margin: -10px 0 0; }

.nt-stock { font-size: 14px; color: var(--nt-ink-2); }
.nt-stock, .nt-stock-line { display: inline-flex; align-items: center; gap: 8px; }
.nt-stock-dot { width: 8px; height: 8px; border-radius: 50%; background: #3F8A5F; flex: none; }
.nt-stock-dot.low { background: var(--nt-gold-deep-2); }
.nt-stock-dot.out { background: var(--nt-ink-muted); }
.nt-info .sc-fulfilment-note { margin: 0 !important; color: var(--nt-ink-2); }
.nt-info-lead { max-width: none; font-size: 16px; }

/* Options */
.nt-options { display: flex; flex-direction: column; gap: 18px; padding-top: 16px; border-top: 1px solid var(--nt-line); }
.nt-option { border: 0; margin: 0; padding: 0; min-width: 0; }
.nt-option legend { display: flex; align-items: baseline; gap: 10px; padding: 0; margin-bottom: 10px; }
.nt-option-val { font-size: 14px; }
.nt-option-values { display: flex; flex-wrap: wrap; gap: 8px; }
.nt-option-values .nt-chip.is-unavailable:not(:disabled) { text-decoration: none; opacity: .55; border-style: dashed; }

/* Buy */
.nt-buy { display: flex; flex-direction: column; gap: 10px; padding-top: 4px; }
.nt-buy-row { display: flex; gap: 10px; }
.nt-buy-row .nt-stepper { height: auto; min-height: 50px; }
.nt-buy-add { flex: 1; min-width: 0; }
.nt-buy-add span { overflow: hidden; text-overflow: ellipsis; }

/* Pincode */
.nt-pincode {
    background: var(--nt-surface);
    border: 1px solid var(--nt-line); border-radius: var(--nt-r-card);
    padding: 16px 18px;
    display: flex; flex-direction: column; gap: 10px;
}
.nt-pincode-label { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.nt-pincode-label svg { color: var(--nt-ink-3); }
.nt-pincode-row { display: flex; gap: 8px; }
.nt-pincode-row input {
    flex: 1; min-width: 0;
    background: var(--nt-surface-alt);
    border: 1px solid var(--nt-line); border-radius: var(--nt-r-pill);
    padding: 11px 16px; font-size: 14.5px; outline: none;
    letter-spacing: 0.08em;
}
.nt-pincode-row input:focus { border-color: var(--nt-line-2); background: var(--nt-surface); }
.nt-pincode-res { margin: 0; font-size: 13.5px; line-height: 1.5; }
.nt-pincode-res.ok { color: #2F6B48; }
.nt-pincode-res.err { color: #9A3B1E; }

/* Share */
.nt-share { display: flex; align-items: center; gap: 16px; font-size: 14px; flex-wrap: wrap; }
.nt-share button { background: none; border: 0; padding: 0; font-size: 14px; }
.nt-share a, .nt-share button { border-bottom: 1px solid var(--nt-line-2); padding-bottom: 1px; }
.nt-share button:hover { color: var(--nt-gold-deep); }

/* ── Details ── */
.nt-pdp-details {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    gap: clamp(20px, 4vw, 56px);
}
@media (max-width: 899px) {
    .nt-pdp-details { grid-template-columns: minmax(0, 1fr); }
}
.nt-specs { margin: 0; display: grid; gap: 0; }
.nt-specs > div {
    display: grid; grid-template-columns: minmax(110px, 1fr) 2fr; gap: 16px;
    padding: 10px 0; border-bottom: 1px dashed var(--nt-line);
}
.nt-specs > div:last-child { border-bottom: 0; }
.nt-specs dt { color: var(--nt-ink-3); font-size: 14px; }
.nt-specs dd { margin: 0; color: var(--nt-ink); font-size: 14.5px; overflow-wrap: anywhere; }
.nt-specs a { border-bottom: 1px solid var(--nt-line-2); }

/* ── Mobile sticky buy bar ── */
.nt-sticky-buy { display: none; }
@media (max-width: 899px) {
    .nt-sticky-buy {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
        display: flex; align-items: center; gap: 12px;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        background: rgba(251, 249, 244, 0.95);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
        border-top: 1px solid var(--nt-line);
        transform: translateY(110%);
        transition: transform 260ms var(--nt-ease-out);
    }
    .nt-sticky-buy.show { transform: none; }
    .nt-sticky-info { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 15px; }
    .nt-sticky-name { font-size: 13px; color: var(--nt-ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ── Zoom ── */
.nt-zoom {
    position: fixed; inset: 0; z-index: 120;
    background: var(--nt-paper);
    display: grid; place-items: center;
    padding: clamp(16px, 4vw, 48px);
}
.nt-zoom img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 12px; }
.nt-zoom-close { position: absolute; top: 16px; right: 16px; }
.nt-zoom-nav { right: 50%; transform: translateX(50%); bottom: 24px; }
