/**
 * Pargas Platform — Static Pages
 * RFQ quote page, industry landing, documents hub, knowledge center,
 * contact, about, 404. All built from the same component vocabulary.
 */

/* v1.3.1 — راهنمای داخلی‌ها (صفحه تماس) */
.pg-exts-card { margin-top: 24px; }
.pg-exts-card__title { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 18px; font-weight: 800; color: var(--pg-ink, #0F172A); }
.pg-exts-card__title svg { color: var(--pg-primary, #0E7490); }
.pg-exts-card__desc { margin: 0; color: var(--pg-muted, #475569); font-size: 14px; }
.pg-exts-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.pg-exts-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px; background: rgba(14, 116, 144, .04); border: 1px solid rgba(15, 23, 42, .08); border-radius: 12px; font-size: 14.5px; }
.pg-exts-list a { font-weight: 700; }

/* ===== Inner page hero (shared) ===== */
.pg-inner-hero {
        background: linear-gradient(135deg, var(--pg-ink) 0%, var(--pg-ink-2) 100%);
        color: #fff;
        position: relative;
        overflow: hidden;
        padding-block: var(--pg-space-8);
}
.pg-inner-hero .pg-breadcrumb { margin-bottom: var(--pg-space-3); }
.pg-inner-hero .pg-breadcrumb a, .pg-inner-hero .pg-breadcrumb li { color: var(--pg-on-ink-soft); }
.pg-inner-hero h1 { color: #fff; font-size: clamp(1.25rem, 1.05rem + 1.4vw, 1.9rem); position: relative; z-index: 1; }
.pg-inner-hero p { color: var(--pg-on-ink-muted); font-size: 0.875rem; line-height: 2; max-width: 640px; margin-top: 8px; position: relative; z-index: 1; }
.pg-inner-hero__content { position: relative; z-index: 1; }

/* ============ RFQ / Quote page ============ */
.pg-quote-layout { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-6); align-items: start; }
@media (min-width: 1024px) { .pg-quote-layout { grid-template-columns: 1.5fr 1fr; } }

.pg-qlist { display: flex; flex-direction: column; gap: 10px; }
.pg-qlist__item {
        display: flex;
        align-items: center;
        gap: var(--pg-space-4);
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-lg);
        padding: var(--pg-space-4);
}
.pg-qlist__item img { width: 64px; height: 64px; object-fit: contain; background: var(--pg-surface-2); border-radius: var(--pg-radius); padding: 4px; flex: none; }
.pg-qlist__info { flex: 1; min-width: 0; }
.pg-qlist__info h3 { font-size: 0.875rem; font-weight: 900; line-height: 1.7; }
.pg-qlist__info h3 a { color: var(--pg-fg); }
.pg-qlist__info h3 a:hover { color: var(--pg-primary); }
.pg-qlist__meta { font-size: 0.71875rem; color: var(--pg-fg-soft); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.pg-qlist__controls { display: flex; align-items: center; gap: var(--pg-space-3); flex: none; }
.pg-qlist__remove { width: 34px; height: 34px; border-radius: var(--pg-round); display: inline-flex; align-items: center; justify-content: center; color: var(--pg-fg-soft); transition: all var(--pg-dur) var(--pg-ease); flex: none; }
.pg-qlist__remove:hover { background: var(--pg-danger-soft); color: var(--pg-danger); }
.pg-qlist__note { margin-top: 8px; }
.pg-qlist__note input { height: 38px; font-size: 0.75rem; background: var(--pg-surface-2); border-color: transparent; }
.pg-qlist__note input:focus { background: var(--pg-surface); }

.pg-quote-form-card {
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-lg);
        padding: var(--pg-space-6);
        position: sticky;
        top: calc(var(--pg-header-sticky-top) + 16px);
}
.pg-quote-form-card h2 { font-size: 1rem; font-weight: 900; margin-bottom: 4px; }
.pg-quote-form-card > p { font-size: 0.75rem; color: var(--pg-fg-soft); margin-bottom: var(--pg-space-4); }
.pg-quote-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pg-space-3); }
.pg-quote-form__grid .pg-field--full { grid-column: 1 / -1; }
.pg-quote-form__footer { margin-top: var(--pg-space-4); display: flex; flex-direction: column; gap: 10px; }
.pg-quote-form__privacy { font-size: 0.6875rem; color: var(--pg-fg-soft); text-align: center; display: flex; align-items: center; justify-content: center; gap: 6px; }
.pg-quote-form__privacy .pg-ico { width: 13px; height: 13px; color: var(--pg-success); }

/* Quote success */
.pg-quote-success { text-align: center; padding: var(--pg-space-9) var(--pg-space-5); }
.pg-quote-success__tile {
        width: 88px;
        height: 88px;
        border-radius: 50%;
        background: var(--pg-success-soft);
        color: var(--pg-success);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-bottom: var(--pg-space-4);
}
.pg-quote-success__tile .pg-ico { width: 40px; height: 40px; }

/* ============ Industry landing ============ */
.pg-industry-hero { color: #fff; position: relative; overflow: hidden; padding-block: var(--pg-space-10); }
.pg-industry-hero h1 { color: #fff; font-size: clamp(1.3rem, 1.1rem + 1.6vw, 2rem); }
.pg-industry-hero p { color: var(--pg-on-ink-muted); font-size: 0.875rem; line-height: 2.1; max-width: 560px; margin-top: 10px; }
.pg-industry-hero__ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--pg-space-5); }
.pg-industry-hero__back {
        position: absolute;
        width: 420px;
        height: 420px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(23, 96, 153, 0.4), transparent 65%);
        top: -160px;
        inset-inline-end: -120px;
        pointer-events: none;
}

.pg-ind-section { margin-top: var(--pg-section-gap); }
.pg-problem-solution { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-4); }
@media (min-width: 768px) { .pg-problem-solution { grid-template-columns: 1fr 1fr; } }
.pg-ps-card { padding: var(--pg-space-6); height: 100%; }
.pg-ps-card--problem { border-inline-start: 3px solid var(--pg-danger); }
.pg-ps-card--solution { border-inline-start: 3px solid var(--pg-success); }
.pg-ps-card__head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--pg-space-3); }
.pg-ps-card__head h2 { font-size: 1rem; }
.pg-ps-card ul { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.pg-ps-card ul li { display: flex; gap: 10px; font-size: 0.8125rem; color: var(--pg-fg-muted); line-height: 1.9; align-items: flex-start; }
.pg-ps-card ul li .pg-ico { flex: none; width: 16px; height: 16px; margin-top: 6px; }
.pg-ps-card--problem li .pg-ico { color: var(--pg-danger); }
.pg-ps-card--solution li .pg-ico { color: var(--pg-success); }

.pg-process { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--pg-space-4); }
@media (min-width: 768px) { .pg-process { grid-template-columns: repeat(4, 1fr); } }
.pg-process__step { background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-lg); padding: var(--pg-space-5); position: relative; }
.pg-process__num {
        width: 32px;
        height: 32px;
        border-radius: var(--pg-round);
        background: var(--pg-primary-soft);
        color: var(--pg-primary);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 900;
        font-size: 0.8125rem;
        margin-bottom: var(--pg-space-3);
}
.pg-process__step h3 { font-size: 0.875rem; margin-bottom: 4px; }
.pg-process__step p { font-size: 0.71875rem; color: var(--pg-fg-muted); line-height: 1.9; }

/* ============ Documents hub ============ */
.pg-docs-layout { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-5); align-items: start; }
@media (min-width: 768px) { .pg-docs-layout { grid-template-columns: 220px 1fr; } }
.pg-docs-side { display: flex; flex-direction: column; gap: 6px; position: sticky; top: calc(var(--pg-header-sticky-top) + 16px); }
@media (max-width: 767px) { .pg-docs-side { flex-direction: row; overflow-x: auto; padding-bottom: 4px; position: static; } .pg-docs-side .pg-chip { white-space: nowrap; flex: none; } }
.pg-docs-list { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 640px) { .pg-docs-list { grid-template-columns: 1fr 1fr; } }

/* ============ Knowledge center ============ */
.pg-knowledge-grid { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-4); }
@media (min-width: 640px) { .pg-knowledge-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pg-knowledge-grid { grid-template-columns: repeat(3, 1fr); } }
.pg-knowledge-hero {
        display: grid;
        grid-template-columns: 1fr;
        border-radius: var(--pg-radius-xl);
        overflow: hidden;
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        margin-bottom: var(--pg-space-6);
}
@media (min-width: 768px) { .pg-knowledge-hero { grid-template-columns: 1.2fr 1fr; } }
.pg-knowledge-hero__media { min-height: 220px; background: linear-gradient(135deg, var(--pg-primary-strong), #06B6D4); position: relative; }
.pg-knowledge-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pg-knowledge-hero__body { padding: var(--pg-space-6); display: flex; flex-direction: column; gap: 8px; justify-content: center; }
.pg-knowledge-hero__body h2 { font-size: 1.125rem; line-height: 1.8; }
.pg-knowledge-hero__body h2 a { color: var(--pg-fg); }
.pg-knowledge-hero__body h2 a:hover { color: var(--pg-primary); }
.pg-knowledge-hero__body p { font-size: 0.8125rem; color: var(--pg-fg-muted); line-height: 2; }

/* Single article */
.pg-article { max-width: 780px; margin-inline: auto; }
.pg-article__head { margin-bottom: var(--pg-space-5); }
.pg-article__head h1 { font-size: clamp(1.25rem, 1.05rem + 1.4vw, 1.8rem); line-height: 1.7; margin-top: 10px; }
.pg-article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: 0.75rem; color: var(--pg-fg-soft); margin-top: var(--pg-space-3); }
.pg-article__meta span { display: inline-flex; align-items: center; gap: 5px; }
.pg-article__meta .pg-ico { width: 14px; height: 14px; }
.pg-article__body {
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-xl);
        padding: var(--pg-space-6);
        font-size: 0.9375rem;
        line-height: 2.2;
        color: var(--pg-fg-muted);
}
.pg-article__body > * + * { margin-top: var(--pg-space-4); }
.pg-article__body h2, .pg-article__body h3 { color: var(--pg-fg); margin-top: var(--pg-space-6); font-size: 1.0625rem; }
.pg-article__body a { text-decoration: underline; text-underline-offset: 3px; }
.pg-article__body img { border-radius: var(--pg-radius-lg); }
.pg-article__body blockquote {
        border-inline-start: 3px solid var(--pg-primary);
        background: var(--pg-primary-softer);
        border-radius: var(--pg-radius);
        padding: var(--pg-space-3) var(--pg-space-4);
        color: var(--pg-fg);
}
.pg-article__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--pg-space-5); }

/* ============ Contact ============ */
.pg-contact-layout { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-5); align-items: start; }
@media (min-width: 768px) { .pg-contact-layout { grid-template-columns: 1fr 1.4fr; } }
.pg-contact-cards { display: flex; flex-direction: column; gap: 10px; }
.pg-contact-card { display: flex; align-items: flex-start; gap: 12px; padding: var(--pg-space-4) var(--pg-space-5); }
.pg-contact-card b { font-size: 0.8125rem; font-weight: 900; display: block; line-height: 1.8; }
.pg-contact-card p, .pg-contact-card a { font-size: 0.75rem; color: var(--pg-fg-muted); line-height: 1.9; }
.pg-contact-card a:hover { color: var(--pg-primary); }
.pg-hours { width: 100%; }
.pg-hours td { padding: 9px var(--pg-space-4); font-size: 0.75rem; }
.pg-contact-map {
        border-radius: var(--pg-radius-lg);
        overflow: hidden;
        border: 1px solid var(--pg-border);
        min-height: 320px;
        background: var(--pg-surface-2);
}
.pg-contact-map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
.pg-departments { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: var(--pg-space-4); }
.pg-dept {
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius);
        padding: 12px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 0.75rem;
}
.pg-dept b { font-weight: 700; color: var(--pg-fg); }
.pg-dept span { color: var(--pg-fg-muted); direction: ltr; unicode-bidi: isolate; }

/* ============ About ============ */
.pg-about-grid { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-4); }
@media (min-width: 768px) { .pg-about-grid { grid-template-columns: repeat(2, 1fr); } }
.pg-value-card { padding: var(--pg-space-6); display: flex; flex-direction: column; gap: 10px; }
.pg-value-card h3 { font-size: 0.9375rem; }
.pg-value-card p { font-size: 0.8125rem; color: var(--pg-fg-muted); line-height: 2; }
.pg-about-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--pg-space-4); }
@media (min-width: 768px) { .pg-about-stats { grid-template-columns: repeat(4, 1fr); } }
.pg-about-stat {
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-lg);
        padding: var(--pg-space-5);
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 4px;
}
.pg-about-stat b { font-size: 1.5rem; font-weight: 900; color: var(--pg-primary); }
.pg-about-stat span { font-size: 0.75rem; color: var(--pg-fg-soft); }

/* ============ 404 ============ */
.pg-404 { text-align: center; padding-block: var(--pg-space-11); display: flex; flex-direction: column; align-items: center; gap: var(--pg-space-3); }
.pg-404__code {
        font-size: clamp(4rem, 3rem + 6vw, 7rem);
        font-weight: 900;
        line-height: 1.2;
        color: var(--pg-primary);
        opacity: 0.14;
        letter-spacing: 4px;
}

/* ============ Search results ============ */
.pg-search-layout { display: grid; grid-template-columns: 1fr; gap: var(--pg-space-6); align-items: start; }
@media (min-width: 1024px) { .pg-search-layout { grid-template-columns: 1.6fr 1fr; } }
.pg-search-side { display: flex; flex-direction: column; gap: var(--pg-space-4); }

/* ============================================================
   v3 pages — documents / knowledge / blog / post / about /
   training / contact extras / auth / checkout steps
   ============================================================ */

/* checkout steps */
.pg-steps { display: flex; align-items: center; gap: 10px; margin-bottom: var(--pg-space-5); }
.pg-steps__dot {
        width: 34px; height: 34px; border-radius: var(--pg-round);
        display: inline-flex; align-items: center; justify-content: center;
        background: var(--pg-surface-2); color: var(--pg-fg-soft);
        font-weight: 900; font-size: 0.8125rem;
        border: 1.5px solid var(--pg-border);
        transition: all var(--pg-dur) var(--pg-ease);
}
.pg-steps__dot.is-active { background: var(--pg-primary); border-color: var(--pg-primary); color: #fff; box-shadow: var(--pg-shadow-btn); }
.pg-steps__dot.is-done { background: var(--pg-success-soft); border-color: #A7F3D0; color: var(--pg-success); }
.pg-steps i { flex: 1; height: 2px; background: var(--pg-border); border-radius: var(--pg-round); }
.pg-steps__nav { display: flex; justify-content: space-between; gap: 10px; margin-top: var(--pg-space-5); padding-top: var(--pg-space-4); border-top: 1px solid var(--pg-border); }
.pg-step { background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-lg); padding: var(--pg-space-6); }
.pg-step h2 { font-size: 1rem; font-weight: 900; margin-bottom: var(--pg-space-4); }
.pg-step h3 { font-size: 0.875rem; font-weight: 900; margin: var(--pg-space-4) 0 var(--pg-space-2); }

/* cart rows */
.pg-cart-head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--pg-space-3); }
.pg-cart-head h2 { font-size: 1rem; font-weight: 900; }
.pg-cart-rows { display: flex; flex-direction: column; gap: 10px; }
.pg-cart-row {
        display: flex; align-items: center; gap: var(--pg-space-4);
        background: var(--pg-surface); border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-lg); padding: var(--pg-space-4);
        flex-wrap: wrap;
}
.pg-cart-row__img img { width: 72px; height: 72px; object-fit: contain; background: var(--pg-surface-2); border-radius: var(--pg-radius); padding: 5px; }
.pg-cart-row__info { flex: 1; min-width: 200px; }
.pg-cart-row__info h3 { font-size: 0.875rem; font-weight: 900; line-height: 1.7; }
.pg-cart-row__info h3 a { color: var(--pg-fg); }
.pg-cart-row__info h3 a:hover { color: var(--pg-primary); }
.pg-cart-row__meta { display: flex; gap: 10px; flex-wrap: wrap; font-size: 0.71875rem; color: var(--pg-fg-soft); margin-top: 2px; align-items: center; }
.pg-cart-row__vol { display: inline-block; margin-top: 6px; font-size: 0.6875rem; background: var(--pg-primary-soft); color: var(--pg-primary-strong); border-radius: var(--pg-round); padding: 3px 10px; font-weight: 700; }
.pg-cart-row__controls { display: flex; align-items: center; gap: var(--pg-space-4); flex-wrap: wrap; }
.pg-cart-row__price { font-size: 0.75rem; color: var(--pg-fg-muted); font-weight: 700; }
.pg-cart-sum__row { display: flex; align-items: center; justify-content: space-between; padding: 9px 0; font-size: 0.8125rem; border-bottom: 1px dashed var(--pg-border); }
.pg-cart-sum__row span { color: var(--pg-fg-muted); }
.pg-cart-sum__row b { font-weight: 800; }
.pg-cart-sum__actions { display: flex; flex-direction: column; gap: 8px; margin-top: var(--pg-space-4); }
.pg-cart-sum__note { font-size: 0.71875rem; color: var(--pg-fg-soft); line-height: 1.9; margin-top: var(--pg-space-3); }

/* contact form card + map placeholder */
.pg-form-card {
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-lg);
        padding: var(--pg-space-6);
}
.pg-form-card__kicker {
        display: inline-flex; align-items: center; gap: 6px;
        background: var(--pg-accent-soft); color: var(--pg-accent-strong);
        font-size: 0.6875rem; font-weight: 900;
        border-radius: var(--pg-round); padding: 4px 12px; margin-bottom: 10px;
}
.pg-form-card__kicker .pg-ico { width: 13px; height: 13px; }
.pg-form-card h2 { font-size: 1rem; font-weight: 900; }
.pg-form-card__desc { font-size: 0.75rem; color: var(--pg-fg-soft); margin: 4px 0 var(--pg-space-4); }
.pg-form-card__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: var(--pg-space-4); }
.pg-form-card__ok {
        margin-top: var(--pg-space-4);
        background: var(--pg-success-soft);
        border: 1px solid #A7F3D0;
        border-radius: var(--pg-radius);
        padding: 14px 18px;
        display: flex; align-items: center; gap: 12px;
        color: #047857;
}
.pg-form-card__ok b { display: block; font-size: 0.875rem; }
.pg-form-card__ok span { font-size: 0.75rem; }
.pg-quote-success__tile--sm { width: 46px; height: 46px; margin: 0; flex: none; }
.pg-quote-success__tile--sm .pg-ico { width: 22px; height: 22px; }
.pg-map-ph {
        height: 100%; min-height: 320px;
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
        color: var(--pg-fg-soft); font-size: 0.75rem; text-align: center; padding: 20px;
}
.pg-map-pin { width: 22px; height: 22px; border-radius: 50% 50% 50% 0; background: var(--pg-accent); rotate: -45deg; position: relative; animation: pg-pin 2s ease-in-out infinite; }
.pg-map-pin::after { content: ""; position: absolute; inset: 6px; background: #fff; border-radius: 50%; }
@keyframes pg-pin { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@media (prefers-reduced-motion: reduce) { .pg-map-pin { animation: none; } }

/* documents hub v3 */
.pg-docs-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: var(--pg-space-5); }
.pg-docs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pg-search--compact { max-width: 320px; width: 100%; }
.pg-docs-list--3 { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 640px) { .pg-docs-list--3 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .pg-docs-list--3 { grid-template-columns: repeat(3, 1fr); } }
.pg-doc-item { padding: var(--pg-space-5); display: flex; flex-direction: column; gap: 8px; }
.pg-doc-item__top { display: flex; align-items: center; justify-content: space-between; }
.pg-doc-item h3 { font-size: 0.8125rem; font-weight: 900; line-height: 1.8; }
.pg-doc-item__ref { font-size: 0.71875rem; color: var(--pg-fg-soft); }
.pg-doc-item__foot { margin-top: auto; padding-top: var(--pg-space-3); border-top: 1px solid var(--pg-border); display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 0.6875rem; color: var(--pg-fg-soft); }

/* knowledge categories */
.pg-know-cat { display: flex; flex-direction: column; gap: 8px; padding: var(--pg-space-5); }
.pg-know-cat h3 { font-size: 0.875rem; font-weight: 900; }
.pg-know-cat p { font-size: 0.75rem; color: var(--pg-fg-soft); line-height: 1.9; flex: 1; }
.pg-know-search { max-width: 560px; margin-bottom: var(--pg-space-6); }

/* blog */
.pg-blog-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--pg-space-5); }

/* article extras */
.pg-article__cover { border-radius: var(--pg-radius-xl); overflow: hidden; border: 1px solid var(--pg-border); margin-bottom: var(--pg-space-5); }
.pg-article__cover img { width: 100%; display: block; aspect-ratio: 16 / 7; object-fit: cover; }
.pg-article__body table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; }
.pg-article__body th, .pg-article__body td { border: 1px solid var(--pg-border); padding: 10px 14px; text-align: start; }
.pg-article__body th { background: var(--pg-surface-2); font-weight: 800; color: var(--pg-fg); }
.pg-article__body ul { padding-inline-start: 22px; display: flex; flex-direction: column; gap: 6px; }
.pg-article__share { display: flex; align-items: center; gap: 10px; margin-top: var(--pg-space-4); font-size: 0.75rem; color: var(--pg-fg-soft); }
.pg-article__share a { width: 38px; height: 38px; border-radius: var(--pg-round); border: 1px solid var(--pg-border); display: inline-flex; align-items: center; justify-content: center; color: var(--pg-fg-muted); transition: all var(--pg-dur) var(--pg-ease); }
.pg-article__share a:hover { background: var(--pg-primary); border-color: var(--pg-primary); color: #fff; }
.pg-article__share .pg-ico { width: 16px; height: 16px; }

/* about intro */
.pg-about-intro { max-width: 820px; margin-bottom: var(--pg-space-6); }
.pg-about-intro h2 { font-size: 1.25rem; font-weight: 900; margin-bottom: var(--pg-space-3); }
.pg-about-intro p { font-size: 0.9375rem; color: var(--pg-fg-muted); line-height: 2.2; margin-bottom: var(--pg-space-3); }

/* training */
.pg-course { display: flex; flex-direction: column; overflow: hidden; }
.pg-course__thumb { position: relative; aspect-ratio: 16 / 9; display: block; overflow: hidden; background: linear-gradient(135deg, var(--pg-primary-strong), #06B6D4); }
.pg-course__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s var(--pg-ease); }
.pg-course:hover .pg-course__thumb img { transform: scale(1.05); }
.pg-course__play {
        position: absolute; top: 50%; right: 50%;
        translate: 50% -50%;
        width: 52px; height: 52px; border-radius: 50%;
        background: rgba(255, 255, 255, 0.92); color: var(--pg-primary-strong);
        display: inline-flex; align-items: center; justify-content: center;
        box-shadow: var(--pg-shadow-pop);
        transition: scale var(--pg-dur) var(--pg-ease);
}
.pg-course__play .pg-ico { width: 20px; height: 20px; margin-right: 2px; }
.pg-course:hover .pg-course__play { scale: 1.1; }
.pg-course__thumb .pg-badge { position: absolute; top: 12px; inset-inline-start: 12px; }
.pg-course__body { padding: var(--pg-space-4) var(--pg-space-5) var(--pg-space-5); display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pg-course__body h3 { font-size: 0.875rem; font-weight: 900; line-height: 1.8; }
.pg-course__body p { font-size: 0.75rem; color: var(--pg-fg-muted); line-height: 1.9; flex: 1; }
.pg-course__meta { display: flex; gap: 14px; font-size: 0.71875rem; color: var(--pg-fg-soft); padding-top: var(--pg-space-2); border-top: 1px solid var(--pg-border); }
.pg-course__meta span { display: inline-flex; align-items: center; gap: 5px; }

/* auth split */
.pg-auth { display: grid; grid-template-columns: 1fr; min-height: calc(100vh - 260px); }
@media (min-width: 1024px) { .pg-auth { grid-template-columns: 1fr 1.1fr; } }
.pg-auth__side {
        background: linear-gradient(135deg, var(--pg-ink) 0%, var(--pg-ink-2) 100%);
        color: #fff; position: relative; overflow: hidden;
        display: flex; align-items: center;
}
.pg-auth__side .pg-dot-pattern { opacity: 0.1; }
.pg-auth__side-in { padding: var(--pg-space-9) var(--pg-space-7); position: relative; z-index: 1; width: 100%; }
.pg-auth__side h1 { color: #fff; font-size: clamp(1.2rem, 1rem + 1.2vw, 1.7rem); margin-top: var(--pg-space-6); }
.pg-auth__side > .pg-auth__side-in p { color: var(--pg-on-ink-muted); font-size: 0.875rem; line-height: 2.1; margin-top: 8px; max-width: 420px; }
.pg-auth__feats { display: flex; flex-direction: column; gap: 10px; margin-top: var(--pg-space-5); }
.pg-auth__feats .pg-feat { color: var(--pg-on-ink-muted); }
.pg-auth__feats .pg-feat__ico { background: rgba(6, 182, 212, 0.16); color: #67E8F9; }
.pg-auth__contact { margin-top: var(--pg-space-6); display: flex; align-items: center; gap: 8px; font-size: 0.8125rem; color: var(--pg-on-ink-muted); }
.pg-auth__contact .pg-ico { width: 18px; height: 18px; color: var(--pg-accent-bright); }
.pg-auth__contact a { color: #fff; font-weight: 700; }
.pg-auth__main { display: flex; align-items: center; justify-content: center; padding: var(--pg-space-9) var(--pg-space-5); }
.pg-auth__card {
        width: 100%; max-width: 460px;
        background: var(--pg-surface);
        border: 1px solid var(--pg-border);
        border-radius: var(--pg-radius-xl);
        padding: var(--pg-space-7);
        box-shadow: var(--pg-shadow-soft);
}
.pg-auth__form { display: flex; flex-direction: column; gap: var(--pg-space-4); margin-top: var(--pg-space-5); }
.pg-auth__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pg-auth__hint { font-size: 0.71875rem; color: var(--pg-fg-soft); text-align: center; }
.pg-auth__hint a { color: var(--pg-primary); }

/* ================================================================
   v4 additions — contact / about / training redesign
   ================================================================ */

/* ---- extra tile tones ---- */
.pg-tile--blue { background: #EFF6FF; color: #2563EB; }
.pg-tile--rose { background: #FFF1F2; color: #E11D48; }
.pg-tile--cyan { background: var(--pg-primary-soft); color: var(--pg-primary); }

/* ---- section kicker (about) ---- */
.pg-sec-kicker { display: inline-flex; align-items: center; gap: 7px; font-size: var(--pg-fs-meta); font-weight: 800; color: var(--pg-primary); background: var(--pg-primary-soft); border-radius: var(--pg-round); padding: 5px 14px; margin-bottom: 10px; }

/* ============================ CONTACT v2 ============================ */
.pg-contact-hero { position: relative; text-align: center; padding-block: var(--pg-space-9) var(--pg-space-2); background: linear-gradient(180deg, var(--pg-primary-softer) 0%, var(--pg-bg) 100%); }
.pg-contact-hero .pg-container { position: relative; z-index: 1; max-width: 780px; }
.pg-contact-hero__badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 18px; border-radius: var(--pg-round); background: #fff; border: 1px solid var(--pg-border); box-shadow: var(--pg-shadow-soft); font-size: var(--pg-fs-meta); font-weight: 800; color: var(--pg-primary); }
.pg-contact-hero__badge .pg-ico { width: 15px; height: 15px; }
.pg-contact-hero h1 { margin-top: 14px; font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.2rem); font-weight: 900; }
.pg-contact-hero p { margin-top: 10px; color: var(--pg-fg-muted); font-size: var(--pg-fs-small); line-height: 2; }
.pg-contact2-cards { margin-top: var(--pg-space-7); display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pg-contact2-card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 22px 16px 18px; }
.pg-contact2-card .pg-tile { width: 48px; height: 48px; margin-bottom: 4px; }
.pg-contact2-card h3 { font-size: .9375rem; font-weight: 900; }
.pg-contact2-card > a:not(.pg-contact2-card__alt) { font-size: .875rem; font-weight: 800; color: var(--pg-primary); }
.pg-contact2-card__alt { font-size: .78125rem; color: var(--pg-fg-muted); font-weight: 600; }
.pg-contact2-card p { font-size: .75rem; color: var(--pg-fg-soft); }
.pg-contact2-card .pg-linkbtn { font-size: .78125rem; font-weight: 800; color: var(--pg-primary); }
.pg-contact2-layout { margin-top: var(--pg-space-6); display: grid; grid-template-columns: 1.25fr .9fr; gap: 18px; align-items: start; }
.pg-form-card--contact h2 { font-size: 1.2rem; font-weight: 900; }
.pg-form-card--contact .pg-subchips { margin-top: 8px; }
.pg-contact-map--v2 { position: relative; border-radius: var(--pg-radius-lg); border: 1px solid var(--pg-border); background: linear-gradient(140deg, #EAF6FA 0%, #E4F2F7 55%, #DDEFF6 100%); min-height: 250px; display: grid; place-items: center; overflow: hidden; }
.pg-contact-map--v2 .pg-map-ph { position: relative; z-index: 1; text-align: center; padding: 26px 18px; }
.pg-contact-map--v2 .pg-map-ph p { font-size: .8125rem; font-weight: 700; color: var(--pg-ink); margin-top: 12px; }
.pg-contact-map__nv { display: inline-block; margin-top: 8px; font-size: .6875rem; color: var(--pg-warning); background: var(--pg-warning-soft); border: 1px dashed var(--pg-warning); border-radius: var(--pg-round); padding: 3px 12px; }
.pg-map-pin { position: relative; width: 18px; height: 18px; border-radius: 50% 50% 50% 0; rotate: -45deg; background: var(--pg-accent); display: inline-block; animation: pgPinBounce 2.2s var(--pg-ease) infinite; }
.pg-map-pin::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: #fff; }
@keyframes pgPinBounce { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
.pg-hours-card h3 { display: flex; align-items: center; gap: 8px; font-size: .9375rem; font-weight: 900; margin-bottom: 12px; }
.pg-hours-card h3 .pg-ico { color: var(--pg-primary); }
.pg-contact2-depts { margin-top: var(--pg-space-6); display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pg-dept-card { display: flex; flex-direction: column; gap: 10px; padding: 18px 16px; }
.pg-dept-card .pg-tile { width: 42px; height: 42px; }
.pg-dept-card__meta b { display: block; font-size: .84375rem; font-weight: 800; }
.pg-dept-card__meta span { font-size: .71875rem; color: var(--pg-fg-muted); }
.pg-dept-card__ext { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; font-size: .71875rem; font-weight: 800; color: var(--pg-primary); background: var(--pg-primary-soft); padding: 4px 12px; border-radius: var(--pg-round); }
@media (max-width: 1023.98px) {
        .pg-contact2-cards { grid-template-columns: repeat(2, 1fr); }
        .pg-contact2-layout { grid-template-columns: 1fr; }
        .pg-contact2-depts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
        .pg-contact2-cards, .pg-contact2-depts { grid-template-columns: 1fr; }
}

/* ============================ ABOUT v2 ============================ */
.pg-ahero { position: relative; overflow: hidden; border-radius: var(--pg-radius-xl); background: linear-gradient(135deg, #0B3A47 0%, #0E7490 62%, #0A5C74 100%); color: var(--pg-on-ink); text-align: center; padding: var(--pg-space-9) var(--pg-space-6) var(--pg-space-8); box-shadow: var(--pg-shadow-pop); }
.pg-ahero .pg-dot-pattern { position: absolute; inset: 0; opacity: .5; }
.pg-ahero > * { position: relative; z-index: 1; }
.pg-ahero__badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 18px; border-radius: var(--pg-round); background: rgba(255,255,255,.1); border: 1px solid var(--pg-on-ink-line); font-size: var(--pg-fs-meta); font-weight: 800; }
.pg-ahero__badge .pg-ico { width: 15px; height: 15px; color: var(--pg-accent-bright); }
.pg-ahero h1 { margin-top: 16px; font-size: clamp(1.5rem, 1.1rem + 1.9vw, 2.3rem); font-weight: 900; max-width: 720px; margin-inline: auto; }
.pg-ahero p { margin-top: 12px; max-width: 640px; margin-inline: auto; font-size: var(--pg-fs-small); color: var(--pg-on-ink-muted); line-height: 2.1; }
.pg-ahero__stats { margin-top: var(--pg-space-7); display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; max-width: 760px; margin-inline: auto; }
.pg-ahero__stat { background: rgba(255,255,255,.07); border: 1px solid var(--pg-on-ink-line); border-radius: 14px; padding: 16px 8px; display: flex; flex-direction: column; gap: 4px; transition: all var(--pg-dur) var(--pg-ease); }
.pg-ahero__stat:hover { background: rgba(255,255,255,.12); translate: 0 -3px; }
.pg-ahero__stat b { font-size: 1.5rem; font-weight: 900; color: var(--pg-accent-bright); }
.pg-ahero__stat span { font-size: .71875rem; color: var(--pg-on-ink-muted); }
.pg-ahero--academy { background: linear-gradient(135deg, #12324B 0%, #0E7490 65%, #0891B2 120%); }
.pg-story { margin-top: var(--pg-section-gap); display: grid; grid-template-columns: .95fr 1.05fr; gap: var(--pg-space-8); align-items: center; }
.pg-story__visual { position: relative; border-radius: var(--pg-radius-xl); min-height: 300px; background: linear-gradient(140deg, #134E5E 0%, #0E7490 55%, #06B6D4 130%); display: grid; place-items: center; overflow: hidden; box-shadow: var(--pg-shadow-pop); }
.pg-story__art { width: min(340px, 82%); }
.pg-story__dot { animation: pgFloat 3.4s ease-in-out infinite; }
.pg-story__dot--2 { animation-delay: .6s; }
.pg-story__dot--3 { animation-delay: 1.2s; }
.pg-story__chip { position: absolute; bottom: 18px; inset-inline-start: 18px; display: inline-flex; align-items: center; gap: 8px; background: #fff; color: var(--pg-fg); border-radius: var(--pg-round); padding: 9px 16px; font-size: .75rem; font-weight: 800; box-shadow: var(--pg-shadow-pop); animation: pgFloat 4.2s ease-in-out infinite; }
.pg-story__chip .pg-ico { color: var(--pg-success); }
.pg-story__copy .pg-sec-kicker { margin-bottom: 12px; }
.pg-story__copy h2 { font-size: clamp(1.25rem, 1rem + 1.2vw, 1.7rem); font-weight: 900; line-height: 1.6; }
.pg-story__copy p { margin-top: 12px; color: var(--pg-fg-muted); font-size: var(--pg-fs-body); line-height: 2.1; }
.pg-story__copy .pg-btn { margin-top: 18px; }
.pg-phil { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: var(--pg-section-gap); }
.pg-phil-card { border-radius: var(--pg-radius-lg); padding: var(--pg-space-7) var(--pg-space-6); color: #fff; position: relative; overflow: hidden; }
.pg-phil-card::after { content: ""; position: absolute; inset-inline-end: -40px; top: -40px; width: 150px; height: 150px; border-radius: 50%; background: rgba(255,255,255,.09); }
.pg-phil-card--blue { background: linear-gradient(135deg, #1D4ED8 0%, #2563EB 60%, #3B82F6 120%); }
.pg-phil-card--green { background: linear-gradient(135deg, #047857 0%, #059669 60%, #10B981 120%); }
.pg-phil-card h3 { display: flex; align-items: center; gap: 8px; font-size: 1rem; font-weight: 900; margin-bottom: 10px; position: relative; z-index: 1; }
.pg-phil-card h3 .pg-ico { color: rgba(255,255,255,.85); }
.pg-phil-card p { font-size: .84375rem; line-height: 2.1; color: rgba(255,255,255,.92); position: relative; z-index: 1; }
.pg-tline { position: relative; display: flex; flex-direction: column; gap: var(--pg-space-5); padding-inline-start: 26px; }
.pg-tline::before { content: ""; position: absolute; inset-inline-start: 9px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(180deg, var(--pg-primary-bright), var(--pg-primary-soft)); border-radius: 2px; }
.pg-tline__item { position: relative; display: flex; gap: 14px; align-items: flex-start; }
.pg-tline__dot { flex: none; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid var(--pg-primary); display: grid; place-items: center; margin-inline-start: -26px; box-shadow: 0 0 0 4px var(--pg-primary-soft); }
.pg-tline__dot i { font-style: normal; font-size: .625rem; font-weight: 900; color: var(--pg-primary); }
.pg-tline__item h3 { font-size: .90625rem; font-weight: 900; }
.pg-tline__item p { font-size: .78125rem; color: var(--pg-fg-muted); margin-top: 3px; line-height: 1.95; }
.pg-value2-card { display: flex; flex-direction: column; gap: 10px; padding: 22px 18px; }
.pg-value2-card .pg-tile { width: 46px; height: 46px; }
.pg-value2-card h3 { font-size: .9375rem; font-weight: 900; }
.pg-value2-card p { font-size: .78125rem; color: var(--pg-fg-muted); line-height: 2; }
.pg-team2-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pg-team2-card { display: flex; flex-direction: column; gap: 8px; padding: 20px 16px; text-align: center; align-items: center; }
.pg-team2-card .pg-tile { width: 46px; height: 46px; }
.pg-team2-card b { font-size: .84375rem; font-weight: 900; }
.pg-team2-card span { font-size: .71875rem; color: var(--pg-fg-muted); line-height: 1.9; }
.pg-about-cta { border-radius: var(--pg-radius-xl); background: linear-gradient(135deg, #047857 0%, #059669 55%, #10B981 125%); color: #fff; text-align: center; padding: var(--pg-space-9) var(--pg-space-6); position: relative; overflow: hidden; }
.pg-about-cta::after { content: ""; position: absolute; inset-inline-start: -60px; bottom: -60px; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,.08); }
.pg-about-cta h2 { font-size: clamp(1.3rem, 1rem + 1.4vw, 1.9rem); font-weight: 900; position: relative; z-index: 1; }
.pg-about-cta p { margin-top: 10px; color: rgba(255,255,255,.9); font-size: var(--pg-fs-small); position: relative; z-index: 1; }
.pg-about-cta__actions { margin-top: var(--pg-space-6); display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; position: relative; z-index: 1; }
@media (max-width: 1023.98px) {
        .pg-story { grid-template-columns: 1fr; }
        .pg-ahero__stats { grid-template-columns: repeat(2, 1fr); }
        .pg-team2-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
        .pg-phil { grid-template-columns: 1fr; }
}

/* ============================ TRAINING v2 ============================ */
.pg-acad-toolbar { display: flex; justify-content: center; margin-bottom: var(--pg-space-6); }
.pg-acad-chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.pg-acad-chips .pg-chip { cursor: pointer; }
.pg-lpath { display: flex; flex-direction: column; gap: 10px; }
.pg-lpath__item { display: flex; align-items: center; gap: 14px; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-lg); padding: 16px 18px; transition: all var(--pg-dur) var(--pg-ease); }
.pg-lpath__item:hover { border-color: var(--pg-primary); box-shadow: var(--pg-shadow-pop); translate: 0 -2px; }
.pg-lpath__num { flex: none; width: 34px; height: 34px; border-radius: var(--pg-round); background: var(--pg-grad-cool); color: #fff; font-weight: 900; font-size: .875rem; display: grid; place-items: center; box-shadow: var(--pg-shadow-btn); }
.pg-lpath__item h3 { font-size: .875rem; font-weight: 800; }
.pg-lpath__item span { font-size: .71875rem; color: var(--pg-fg-soft); }
.pg-lpath__item .pg-ico { margin-inline-start: auto; color: var(--pg-fg-soft); }
.pg-certbanner { margin-top: var(--pg-section-gap); display: flex; align-items: center; gap: 18px; border-radius: var(--pg-radius-lg); background: linear-gradient(120deg, #047857 0%, #059669 60%, #10B981 125%); color: #fff; padding: var(--pg-space-6) var(--pg-space-7); position: relative; overflow: hidden; }
.pg-certbanner::after { content: ""; position: absolute; inset-inline-end: -50px; top: -50px; width: 170px; height: 170px; border-radius: 50%; background: rgba(255,255,255,.09); }
.pg-certbanner__tile { flex: none; width: 52px; height: 52px; border-radius: 16px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.2); display: grid; place-items: center; }
.pg-certbanner__tile .pg-ico { width: 24px; height: 24px; color: #fff; animation: pgFloat 3.6s ease-in-out infinite; }
.pg-certbanner h3 { font-size: 1.05rem; font-weight: 900; position: relative; z-index: 1; }
.pg-certbanner p { margin-top: 6px; font-size: .78125rem; color: rgba(255,255,255,.9); line-height: 1.95; position: relative; z-index: 1; }
.pg-certbanner .pg-btn { flex: none; margin-inline-start: auto; position: relative; z-index: 1; }
@keyframes pgFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@media (max-width: 900px) {
        .pg-certbanner { flex-direction: column; text-align: center; }
        .pg-certbanner .pg-btn { margin-inline-start: 0; }
}
@media (prefers-reduced-motion: reduce) {
        .pg-map-pin, .pg-certbanner__tile .pg-ico, .pg-story__dot, .pg-story__chip { animation: none; }
}
