/* ============================================================
   Product Details Page Mobile
   Source: main.css lines 6502-6638
   ============================================================ */

/* ============================================================
   Product Details Page (PDP) - UIPro mobile design
   ============================================================ */

/* Breadcrumb bar */
.pdp-breadcrumb-bar { background: var(--color-bg); border-bottom: 1px solid var(--color-border); padding: 10px 0; font-size: 13px; }

/* Main layout */
.pdp-main { padding: 24px 0 64px; }
/* .pdp-main > .container 和 .pdp-breadcrumb-bar > .container 已改为 .site-container，padding 由 base.min.css 统一管理 */

/* Hero card */
.pdp-hero-card { background: #f9fafb; border-radius: 16px; border: 1px solid var(--color-border); padding: 16px; margin-bottom: 20px; }
.pdp-hero-card__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }

/* Gallery — Figma Frame 1171276961: 720×616 column, gap 16 between main + thumbs */
.pdp-gallery { display: flex; flex-direction: column; gap: 16px; }
.pdp-gallery__main { border-radius: 16px; overflow: hidden; margin-bottom: 0; }
.pdp-gallery__main-img { width: 100%; height: 280px; object-fit: cover; display: block; }
.pdp-gallery__placeholder { height: 280px; background: #f1f5f9; border-radius: 16px; display: flex; align-items: center; justify-content: center; }
.pdp-gallery__thumbs { display: flex; gap: 12px; flex-wrap: wrap; }
.pdp-gallery__thumb { width: 72px; height: 56px; border-radius: 16px; overflow: hidden; border: 2px solid transparent; cursor: pointer; background: none; padding: 0; transition: border-color .2s; flex-shrink: 0; }
.pdp-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdp-gallery__thumb.is-active { border-color: var(--color-accent); }

/* Product info */
.pdp-info { display: flex; flex-direction: column; gap: 14px; }
.pdp-info__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.pdp-badge { font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.pdp-badge--brand { background: var(--color-accent); color: #fff; }
.pdp-badge--best  { background: rgba(249,115,22,.15); color: #f97316; }
.pdp-badge--new   { background: var(--color-accent-light); color: var(--color-primary); }

.pdp-info__title { font-size: clamp(18px,3vw,28px); font-weight: 700; color: var(--color-primary); line-height: 1.25; margin: 0; }
.pdp-info__subtitle { font-size: 13px; color: var(--color-muted); margin: 0; }

/* Quick specs 2-col grid */
.pdp-quick-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-radius: 12px; border: 1px solid var(--color-border); background: #fff; overflow: hidden; }
.pdp-quick-spec { padding: 8px 10px; border-bottom: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 2px; }
.pdp-quick-spec:nth-last-child(-n+2) { border-bottom: none; }
.pdp-quick-spec__label { font-size: 11px; color: var(--color-muted); }
.pdp-quick-spec__value { font-size: 13px; font-weight: 500; color: var(--color-text); }

/* Price box */
/* Price box — Figma: 600×96, bg #E7EFE0, border 1.1px #F3F7ED, radius 14, padding 20 */
.pdp-price-box { background: #E7EFE0; border: 1.11px solid #F3F7ED; border-radius: 14px; padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pdp-price-box__left { display: flex; flex-direction: column; gap: 2px; }
.pdp-price-box__amount { font-family: 'Montserrat', sans-serif; font-size: 22px; font-weight: 700; line-height: 32px; color: #83AE48; }
.pdp-price-box__meta { display: flex; align-items: center; gap: 6px; font-family: 'SF Pro', sans-serif; font-size: 14px; line-height: 20px; color: #717182; }
.pdp-price-box__label { color: #717182; }
.pdp-price-box__unit  { color: #717182; }
.pdp-price-box__sep { width: 1px; height: 16px; background: #B7BDCD; display: inline-block; }
.pdp-price-box__actions { display: flex; gap: 12px; }
/* Heart + Share buttons — Figma: 48×48, border 1.5px #C6DAAB, radius 10, icon stroke #83AE48 */
.pdp-icon-btn { width: 48px; height: 48px; border-radius: 10px; border: 1.53px solid #C6DAAB; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; color: #83AE48; transition: all .2s; }
.pdp-icon-btn svg { width: 24px; height: 24px; }
.pdp-icon-btn:hover { background: #C6DAAB; color: #fff; }

/* CTAs */
/* CTAs — Figma: row layout, 2 buttons × 290×56, gap 20 */
.pdp-ctas { display: flex; flex-direction: row; gap: 20px; }
.pdp-cta { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; height: 56px; padding: 0 24px; border-radius: 9999px; font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 500; text-decoration: none; transition: all .2s; }
.pdp-cta--primary { background: #83AE48; color: #fff; }
.pdp-cta--primary:hover { background: #5D7C33; color: #fff; }
.pdp-cta--whatsapp { background: linear-gradient(0deg, #1FAF38 0%, #60D669 100%); color: #fff; font-size: 16px; }
.pdp-cta--whatsapp:hover { opacity: .9; color: #fff; }

/* Trust badges */
.pdp-trust { display: flex; flex-wrap: wrap; gap: 12px; }
.pdp-trust-item { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--color-muted); }

/* Sections */
/* Outer spec section — Figma Component 51: bg #F9FAFB, 1.1px #E5E7EB border, radius 16, padding 40, gap 20 */
.pdp-section { background: #F9FAFB; border: 1.1px solid #E5E7EB; border-radius: 16px; padding: 40px; margin-bottom: 20px; display: flex; flex-direction: column; gap: 20px; }
.pdp-section__header { margin-bottom: 0; display: flex; flex-direction: column; gap: 12px; }
.pdp-section__title { font-family: 'Montserrat', sans-serif; font-size: 28px; font-weight: 700; line-height: 32px; color: #0F1115; margin: 0; }
.pdp-section__desc  { font-family: 'SF Pro', sans-serif; font-size: 16px; line-height: 20px; color: #717182; margin: 0; }

/* Spec groups */
/* 3-col grid of sub-cards — Figma Frame 1171277006: row gap 24, 3 × 437×320 */
.pdp-spec-groups-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

/* Each sub-card — Figma: padding 24, gap 14, 1px #E5E7EB border, radius 16, bg white */
.pdp-spec-group { background: #fff; border: 1px solid #E5E7EB; border-radius: 16px; padding: 24px; margin-bottom: 0; overflow: visible; display: flex; flex-direction: column; gap: 14px; }
.pdp-spec-group:last-child { margin-bottom: 0; }

/* Card header — Figma Frame 1171277007: 54 high, padding-bottom 14, border-bottom 1px, icon box + title */
.pdp-spec-group__head { display: flex; align-items: center; gap: 12px; padding: 0 0 14px; border-bottom: 1px solid #E5E7EB; background: transparent; }
.pdp-spec-group__icon { width: 40px; height: 40px; background: #E7EFE0; border-radius: 9px; display: flex; align-items: center; justify-content: center; color: #83AE48; flex-shrink: 0; }
.pdp-spec-group__icon svg { width: 20px; height: 20px; stroke: #83AE48; }
.pdp-spec-group__name { font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 700; line-height: 24px; color: #0F1115; flex: 1; }

/* Spec list — Figma: 2-col grid of vertical (label-on-top, value-below) blocks, gap 24 */
.pdp-spec-dl { margin: 0; padding: 0; background: transparent; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.pdp-spec-row { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 0; border-bottom: none; }
.pdp-spec-row:last-child { border-bottom: none; }
.pdp-spec-row__label { font-family: 'SF Pro', sans-serif; font-size: 14px; line-height: 20px; color: #717182; }
.pdp-spec-row__value { font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 500; line-height: 24px; color: #0F1115; text-align: left; max-width: 100%; }

/* Condition & Trust */
/* Condition & Documents — Figma node 282-16457 */
.pdp-condition-trust { padding: 0; background: transparent; display: flex; flex-direction: column; gap: 24px; }
.pdp-condition-row { display: flex; align-items: stretch; gap: 24px; }
.pdp-condition-card { flex: 1; background: #E7EFE0; border-radius: 12px; padding: 12px 20px; display: flex; flex-direction: column; gap: 8px; }
.pdp-condition-card__label { font-family: 'SF Pro', sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; color: #717182; }
.pdp-condition-card__grade { font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 700; line-height: 24px; color: #0F1115; }
.pdp-condition-bar { height: 10px; border-radius: 999px; background: #fff; overflow: hidden; margin-top: 4px; }
.pdp-condition-bar__fill { height: 100%; border-radius: 999px; background: #83AE48; transition: width .5s ease; }
.pdp-location { display: flex; flex-direction: column; gap: 4px; justify-content: flex-start; padding-top: 4px; }
.pdp-location__label { font-family: 'SF Pro', sans-serif; font-size: 12px; font-weight: 400; line-height: 16px; color: #717182; }
.pdp-location__value { display: inline-flex; align-items: center; gap: 4px; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 500; line-height: 20px; color: #0F1115; }
.pdp-location__value svg { width: 20px; height: 20px; flex-shrink: 0; }
.pdp-features { display: flex; flex-direction: column; gap: 8px; }
.pdp-features__label { font-family: 'SF Pro', sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; color: #717182; }
.pdp-features__list { display: flex; align-items: center; gap: 12px; }
.pdp-feature-tag { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 12px; background: #06203B; color: #fff; border-radius: 999px; font-family: 'SF Pro', sans-serif; font-size: 12px; font-weight: 400; line-height: 12px; text-align: center; }
.pdp-feature-tag svg { width: 18px; height: 18px; flex-shrink: 0; }

/* Payment section */
.pdp-payment__header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
.pdp-payment__options { display: flex; flex-direction: column; gap: 12px; }
.pdp-payment-card { background: #fff; border: 1px solid var(--color-border); border-radius: 12px; padding: 14px; position: relative; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.pdp-payment-card--featured { background: rgba(131,174,72,.06); border-color: var(--color-accent); }
.pdp-payment-card__recommended { position: absolute; top: -10px; right: 12px; background: var(--color-accent); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .06em; padding: 3px 10px; border-radius: 4px; }
.pdp-payment-card__head { display: flex; align-items: center; gap: 10px; }
.pdp-payment-card__head strong { font-size: 14px; color: var(--color-text); }
.pdp-payment-card__desc { font-size: 13px; color: var(--color-muted); line-height: 1.5; margin: 0; }
.pdp-payment-card__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.pdp-payment-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 500; padding: 4px 8px; border-radius: 6px; background: rgba(131,174,72,.1); color: var(--color-accent); }
.pdp-payment-tag--neutral { background: var(--color-border); color: var(--color-text); }

/* Certification rows */
/* Inspection Documents — Figma: 3 cards row, gap 20, each 440×82 padding 16 */
/* Inspection Documents — Figma 3 cards row, gap 20, each 1fr */
.pdp-cert-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.pdp-cert-row { display: flex; align-items: center; gap: 12px; padding: 16px; background: #fff; border: 1px solid #F1F5F9; border-radius: 14px; text-decoration: none; color: inherit; }
a.pdp-cert-row:hover { box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.pdp-cert-row__icon { flex-shrink: 0; width: 48px; height: 48px; background: #E7EFE0; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #83AE48; }
.pdp-cert-row__icon svg { width: 22px; height: 22px; stroke: #83AE48; }
.pdp-cert-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.pdp-cert-row__name { font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 700; line-height: 24px; letter-spacing: 0.4px; color: #1A1A1A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pdp-cert-row__meta { font-family: 'SF Pro', sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; color: #717182; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Video */
.pdp-video { border-radius: 12px; overflow: hidden; }
/* Product Video — Figma: 1360×480 (rendered as 100% × 480 here), radius 16, dark overlay, 80×80 green play button with shadow */
.pdp-video__placeholder { height: 480px; background-color: #111; background-size: cover; background-position: center; background-image: linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0,0,0,0.2)), linear-gradient(0deg, rgba(6,32,59,0.4), rgba(6,32,59,0.4)), var(--pdp-video-bg, none); border-radius: 16px; display: flex; align-items: center; justify-content: center; position: relative; }
.pdp-video__play { width: 80px; height: 80px; background: #83AE48; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 20px 25px -5px rgba(131,174,72,0.3), 0 8px 10px -6px rgba(131,174,72,0.3); cursor: pointer; }
.pdp-video__play svg { width: 32px; height: 32px; fill: #fff; }

/* Inquiry context — Figma: 660×72, bg #E7EFE0, radius 10, padding 12 20, gap 4 */
.pdp-inquiry-context { background: #E7EFE0; border-radius: 10px; padding: 12px 20px; margin-bottom: 0; display: flex; flex-direction: column; gap: 4px; }
.pdp-inquiry-context__label { font-family: 'SF Pro', sans-serif; font-size: 16px; line-height: 20px; color: #717182; }
.pdp-inquiry-context__product { font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 700; line-height: 24px; letter-spacing: 0.4px; color: #0F1115; }

/* Send an Inquiry form — override base.min.css .inquiry-section navy bg, match Figma light theme */
.pdp-section .inquiry-section { background: transparent; color: inherit; padding: 0; max-width: 660px; }
.pdp-section .inquiry-section .form-row { gap: 20px; }
.pdp-section .inquiry-section .form-group { margin-bottom: 0; }
.pdp-section .inquiry-section .form-group + .form-group,
.pdp-section .inquiry-section .form-row + .form-group { margin-top: 16px; }
.pdp-section .inquiry-section .form-label,
.pdp-section .inquiry-section .form-group label {
    color: #717182;
    font-family: 'SF Pro', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 4px;
    display: block;
}
.pdp-section .inquiry-section .form-control,
.pdp-section .inquiry-section .form-group input,
.pdp-section .inquiry-section .form-group textarea {
    background: #fff;
    border: 1.1px solid #E5E7EB;
    border-radius: 10px;
    padding: 12px 16px;
    color: #1A1A1A;
    font-family: 'SF Pro', sans-serif;
    font-size: 18px;
    line-height: 24px;
    width: 100%;
    min-height: auto;
}
.pdp-section .inquiry-section .form-group textarea { min-height: 96px; resize: vertical; }
.pdp-section .inquiry-section .form-control::placeholder,
.pdp-section .inquiry-section .form-group input::placeholder,
.pdp-section .inquiry-section .form-group textarea::placeholder { color: #B7BDCD; }
.pdp-section .inquiry-section .form-control:focus,
.pdp-section .inquiry-section .form-group input:focus,
.pdp-section .inquiry-section .form-group textarea:focus { border-color: #83AE48; outline: none; }
/* Submit button — Figma: 208×56 #83AE48 full pill */
.pdp-section .inquiry-section .inquiry-form__submit {
    background: #83AE48;
    border: none;
    border-radius: 9999px;
    height: 56px;
    padding: 0 24px;
    width: 208px;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    margin-top: 16px;
    transition: background .2s;
}
.pdp-section .inquiry-section .inquiry-form__submit:hover { background: #6F9A3C; }

/* Responsive */
@media (max-width: 900px) {
    .pdp-hero-card__inner { grid-template-columns: 1fr; }
    .pdp-gallery__main-img { height: 220px; }
    .pdp-ctas { flex-direction: column; }
}
@media (min-width: 1100px) {
    .pdp-hero-card__inner { grid-template-columns: 1.1fr 1fr; gap: 40px; }
    .pdp-hero-card { padding: 40px; }
    .pdp-gallery__main-img { height: 480px; }
    .pdp-gallery__thumb { width: 171px; height: 120px; }
    .pdp-payment__options { display: grid; grid-template-columns: 1.2fr 1fr 1fr; }
}

/* ────────────────────────────────────────────────────────────
   MOBILE RESPONSIVE (≤768px) - Figma 375px Design
   ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .site-main {
        background: #fff;
    }
    .pdp-breadcrumb-bar {
        border: none;
    }
    .pdp-main {
        padding: 0;
    }
    .pdp-hero-card {
        margin-bottom: 0;
        padding: 12px;
        border: none;
        background: var(--Color-Background-Primary, #F9FAFB);
    }
    .pdp-hero-card__inner {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .pdp-gallery__main {
        margin-bottom: 0;
    }
    .pdp-gallery__main-img {
        height: 240px;
    }
    .pdp-gallery__placeholder {
        height: 240px;
        border-radius: 0;
    }
    .pdp-gallery__thumbs {
        padding: 12px;
        gap: 8px;
    }
    .pdp-gallery__thumb {
        width: 64px;
        height: 50px;
        border-radius: 6px;
        border-width: 1.5px;
    }
    .pdp-info {
        padding: 12px 0 0;
        gap: 8px;
    }
    .pdp-info__badges {
        gap: 8px;
    }
    .pdp-badge {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-xs, 12px);
        font-weight: var(--Font-Weight-normal, 400);
        line-height: var(--Font-Leading-3, 12px);
        padding: 8px 10px;
    }
    .pdp-info__title {
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-lg, 18px);
        font-weight: var(--Font-Weight-bold, 700);
        line-height: var(--Font-Leading-6, 24px); /* 133.333% */
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
        color: var(--Color-Text-Primary, #0F1115);
    }
    .pdp-info__subtitle {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
        font-weight: var(--Font-Weight-normal, 400);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-quick-specs {
        grid-template-columns: repeat(1, 1fr);
        gap: 0;
        border-radius: 12px;
        overflow: hidden;
    }
    .pdp-quick-spec {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 12px;
    }
    .pdp-quick-spec:nth-last-child(-n+2) {
        border-bottom: 1px solid var(--color-border) !important;
    }
    .pdp-quick-spec__label {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
        font-weight: var(--Font-Weight-normal, 400);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-quick-spec__value {
        color: var(--Color-Text-Primary, #0F1115);
        font-family: var(--Font-Family-serif, Inter);
        font-size: var(--Font-Size-sm, 14px);
        font-weight: var(--Font-Weight-medium, 500);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-price-box {
        padding: 12px;
        gap: 16px;
        border-radius: 12px;
        border: 1.108px solid var(--Color-Primary-Primary-100, #F3F7ED);
        background: var(--Color-Background-GreenTint, #E7EFE0);
    }
    .pdp-price-box__amount {
        color: #83AE48;
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: 18px;
        font-weight: var(--Font-Weight-bold, 700);
        line-height: 24px;
    }
    .pdp-price-box__meta {
        color: #717182;
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: 12px;
        font-weight: var(--Font-Weight-normal, 400);
        line-height: 12px;
    }
    .pdp-price-box__actions {
        justify-content: center;
        gap: 12px;
    }
    .pdp-icon-btn {
        border-radius: 10px;
        border: 1.25px solid var(--Color-Primary-Primary-200, #C6DAAB);
        width: 40px;
        height: 40px;
        background: transparent;
    }
    .pdp-icon-btn svg {
        stroke: var(--Color-Primary-Primary-200, #C6DAAB);
    }
    .pdp-ctas {
        padding: 0 16px;
        margin-top: 16px;
        gap: 10px;
    }
    .pdp-cta {
        padding: 8px 12px;
        border-radius: 999px;
        font-family: var(--Font-Family-serif, Inter);
        font-size: var(--Font-Size-sm, 14px);
        font-style: normal;
        font-weight: var(--Font-Weight-medium, 500);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-trust {
        padding: 0;
        gap: 16px;
        justify-content: center;
    }
    .pdp-trust-item {
        color: var(--Color-Status-Colors-Disable, #717182);
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-2xs, 10px);
        font-weight: var(--Font-Weight-normal, 400);
        line-height: 12px;
    }
    .pdp-trust-item svg {
        stroke: #83AE48;
    }
    .pdp-section {
        margin: 20px 0;
        border-radius: 12px;
        padding: 12px;
        border: 1px solid #E5E7EB;
    }
    .pdp-section:nth-child(odd) {
        border: none;
    }
    .pdp-section:nth-child(even) {
        background: var(--Color-Background-Primary, #F9FAFB);
    }
    .pdp-section__header {
        margin-bottom: 20px;
    }
    .pdp-section__title {
        margin-bottom: 8px;
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-lg, 18px);
        font-weight: var(--Font-Weight-bold, 700);
        line-height: var(--Font-Leading-6, 24px);
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-section__desc {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
        font-weight: var(--Font-Weight-normal, 400);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-spec-groups-grid {
        gap: 8px;
        grid-template-columns: 1fr;
    }
    .pdp-spec-group {
        border-radius: 12px;
        padding: 12px;
    }
    .pdp-spec-group__head {
        padding: 0 0 12px;
        gap: 8px;
    }
    .pdp-spec-group__icon {
        padding: 8px;
        border-radius: 9px;
        background: var(--Color-Background-GreenTint, #E7EFE0);
    }
    .pdp-spec-group__icon svg {
        stroke: #83AE48;
    }
    .pdp-spec-group__name {
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-base, 16px);
        line-height: var(--Font-Leading-5, 20px); /* 125% */
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-spec-dl {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .pdp-spec-row {
        flex-direction: column;
        align-items: flex-start;
        padding: 0;
        border: none;
    }
    .pdp-spec-row__value {
        font-size: var(--Font-Size-sm, 14px);
        line-height: var(--Font-Leading-5, 20px);
        white-space: nowrap;
    }
    .pdp-condition-trust {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 24px;
        padding: 12px;
    }
    .pdp-condition-card {
        flex: 1;
        padding: 12px;
        border-radius: 12px;
        background: var(--Color-Background-GreenTint, #E7EFE0);
    }
    .pdp-condition-card__header {
        flex-direction: column;
        align-items: flex-start;
    }
    .pdp-condition-card__label {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-xs, 12px);
        line-height: 12px;
    }
    .pdp-condition-card__grade {
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-lg, 18px);
        line-height: var(--Font-Leading-6, 24px);
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-condition-bar__fill {
        background: #83AE48;
    }
    .pdp-location {
        flex: 1;
    }
    .pdp-features {
        gap: 8px;
        width: 100%;
    }
    .pdp-feature-tag {
        justify-content: center;
        padding: 10px 14px;
        font-size: 13px;
    }
    .pdp-payment__header {
        gap: 12px;
    }
    .pdp-payment__options {
        gap: 12px;
    }
    .pdp-payment-card {
        padding: 12px;
        border-radius: 12px;
    }
    .pdp-payment-card__recommended {
        border-radius: 6px;
        font-family: var(--Font-Family-serif, Inter);
        font-size: var(--Font-Size-xs, 12px);
        font-weight: var(--Font-Weight-medium, 500);
        line-height: var(--Font-Leading-4, 16px);
        background: #83AE48;
    }
    .pdp-payment-card__head strong {
        color: var(--Color-Text-Primary, #0F1115);
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-base, 16px);
        font-weight: var(--Font-Weight-bold, 700);
        line-height: var(--Font-Leading-5, 20px); /* 125% */
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-payment-card--featured {
        border: 1px solid var(--Color-Primary-Primary-500, #83AE48);
        background: rgba(131, 174, 72, 0.06);
        box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.12);
    }
    .pdp-payment-card__desc {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-payment-tag {
        padding: 4px;
        border-radius: 8px;
        color: var(--Color-Primary-Primary-500, #83AE48);
        font-family: var(--Font-Family-serif, Inter);
        font-size: 10.5px;
        font-weight: var(--Font-Weight-medium, 500);
        line-height: 16px;
        background: rgba(131, 174, 72, 0.10);
    }
    .pdp-payment-tag--neutral {
        color: var(--Color-Text-Primary, #0F1115);
        font-family: var(--Font-Family-serif, Inter);
        font-size: var(--Font-Size-xs, 12px);
        font-weight: var(--Font-Weight-medium, 500);
        line-height: var(--Font-Leading-4, 16px); /* 133.333% */
        background: var(--color-borders-separators-default, #E5E7EB);
    }
    .pdp-cert-list {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .pdp-cert-row {
        padding: 12px;
        border-radius: 14px;
        gap: 8px;
    }
    .pdp-cert-row__icon {
        width: 40px;
        height: 40px;
        border-radius: 6px;
        background: var(--Color-Background-GreenTint, #E7EFE0);
    }
    .pdp-cert-row__name {
        color: var(--Color-Text-Primary, #0F1115);
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-sm, 14px);
        line-height: 16px;
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-cert-row__meta {
        padding-left: 20px;
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: 12px;
        line-height: 16px;
    }
    .pdp-cert-row__dl {
        width: 36px;
        height: 36px;
    }
    .pdp-video__placeholder {
        border-radius: 16px;
        height: 220px;
    }
    .pdp-video__play {
        width: 52px;
        height: 52px;
    }
    .pdp-inquiry-context {
        padding: 8px 12px;
        border-radius: 10px;
        margin-bottom: 8px;
    }
    .pdp-inquiry-context__label {
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
        line-height: var(--Font-Leading-5, 20px);
    }
    .pdp-inquiry-context__product {
        font-family: var(--Font-Family-sans, Montserrat);
        font-size: var(--Font-Size-base, 16px);
        font-weight: var(--Font-Weight-bold, 700);
        line-height: var(--Font-Leading-5, 20px); /* 125% */
        letter-spacing: var(--Font-Tracking-wide, 0.4px);
    }
    .pdp-section .inquiry-section {
        background: none;
    }
    .pdp-section .inquiry-section .inquiry-form {
        padding: 0;
    }
    .pdp-section .inquiry-section .form-row {
        grid-template-columns: repeat(2, 1fr);
    }
    .pdp-section .inquiry-section .form-group {
        position: relative;
        margin: 0 0 8px !important;
    }
    .pdp-section .inquiry-section .form-label, 
    .pdp-section .inquiry-section .form-group label{
        display: none;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 12px;
        color: var(--Color-Text-Secondary, #B7BDCD);
        font-family: var(--Font-Family-sans, "SF Pro");
        font-size: var(--Font-Size-sm, 14px);
    }
    .pdp-section .inquiry-section .form-control, 
    .pdp-section .inquiry-section .form-group input, 
    .pdp-section .inquiry-section .form-group textarea {
        padding: 10px 12px;
        border-radius: 8px;
        border: 1px solid var(--color-borders-separators-default, #E5E7EB);
        font-size: var(--Font-Size-sm, 14px);
    }
    .pdp-section .inquiry-section .inquiry-form__submit {
        margin: 0;
        border-radius: var(--Radius-full, 9999px);
        width: 100%;
        height: 36px;
        font-size: var(--Font-Size-sm, 14px);
    }
}


