/* ============================================================
   PLUGY EV — CONTACT PAGE (SCOPED STYLES)
   When the background photo is ready, add it to the background
   of #contact.pg-contact-page; no other page will be affected.
============================================================ */
#contact.pg-contact-page {
    --pg-primary: #07832c;
    --pg-primary-dark: #066a25;
    --pg-ink: #0b1425;
    --pg-muted: #647084;
    --pg-border: #e5eaed;
    --pg-tint: #e7f8ed;
    direction: inherit;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 78px 0 86px;
    color: var(--pg-ink);
    background: radial-gradient(ellipse at 8% 5%, rgba(12,174,76,.10), transparent 33%),
                radial-gradient(ellipse at 95% 10%, rgba(12,174,76,.07), transparent 31%),
                #f6f8f9;
}
#contact.pg-contact-page *,
#contact.pg-contact-page *::before,
#contact.pg-contact-page *::after { box-sizing: border-box; }
#contact.pg-contact-page .pg-container { width: min(1240px, calc(100% - 40px)); margin-inline: auto; }
#contact.pg-contact-page .pg-heading { text-align: center; margin: 0 0 34px; }
#contact.pg-contact-page .pg-heading::before,
#contact.pg-contact-page .pg-faq-heading::before {
    content: "";
    display: block;
    width: 44px;
    height: 4px;
    border-radius: 20px;
    background: var(--pg-primary);
    margin: 0 auto 19px;
}
#contact.pg-contact-page .pg-heading h1 {
    margin: 0 0 12px;
    color: var(--pg-ink);
    font-size: clamp(30px, 3.5vw, 47px);
    line-height: 1.25;
    font-weight: 800;
}
#contact.pg-contact-page .pg-heading__text {
    margin: 0 auto;
    max-width: 820px;
    color: var(--pg-muted);
    font-size: clamp(14px, 1.3vw, 17px);
    line-height: 1.85;
}
#contact.pg-contact-page .pg-heading__text p { margin: 0; }
#contact.pg-contact-page .pg-layout {
    display: grid;
    grid-template-columns: minmax(310px, 0.92fr) minmax(0, 1.55fr);
    align-items: stretch;
    gap: 22px;
}
#contact.pg-contact-page .pg-panel,
#contact.pg-contact-page .pg-faq-card,
#contact.pg-contact-page .pg-visit {
    min-width: 0;
    background: #fff;
    border: 1px solid rgba(220,228,229,.75);
    border-radius: 18px;
    box-shadow: 0 16px 40px rgba(16,42,40,.045);
}
#contact.pg-contact-page .pg-panel { padding: 27px 25px; }
#contact.pg-contact-page .pg-panel-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
}
#contact.pg-contact-page .pg-panel-title__icon,
#contact.pg-contact-page .pg-info-icon {
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: var(--pg-primary);
    background: var(--pg-tint);
    font-size: 17px;
}
#contact.pg-contact-page .pg-panel-title h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.35;
    color: var(--pg-ink);
}
#contact.pg-contact-page .pg-info-list { display: grid; gap: 10px; }
#contact.pg-contact-page .pg-info-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 13px 14px;
    border-radius: 12px;
    background: #f7f9fa;
}
#contact.pg-contact-page .pg-info-icon { width: 35px; height: 35px; font-size: 14px; }
#contact.pg-contact-page .pg-info-item__body { min-width: 0; }
#contact.pg-contact-page .pg-info-item h3 {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 750;
    color: var(--pg-ink);
}
#contact.pg-contact-page .pg-info-item p,
#contact.pg-contact-page .pg-info-item a {
    margin: 0;
    color: #536176;
    font-size: 13px;
    line-height: 1.8;
    overflow-wrap: anywhere;
}
#contact.pg-contact-page .pg-info-item a { text-decoration: none; }
#contact.pg-contact-page .pg-info-item a:hover { color: var(--pg-primary); }
#contact.pg-contact-page .pg-map { margin-top: 13px; overflow: hidden; border-radius: 13px; border: 1px solid var(--pg-border); }
#contact.pg-contact-page .pg-map iframe {
    display: block;
    width: 100%;
    height: 206px;
    border: 0;
    background: #edf2f3;
}
#contact.pg-contact-page .pg-map-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    margin-top: 11px;
    padding: 12px 18px;
    border-radius: 9px;
    background: var(--pg-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
    transition: background .2s, transform .2s;
}
#contact.pg-contact-page .pg-map-link:hover { background: var(--pg-primary-dark); transform: translateY(-1px); color: #fff; }
#contact.pg-contact-page .pg-social { border-top: 1px solid var(--pg-border); margin-top: 19px; padding-top: 17px; }
#contact.pg-contact-page .pg-social h3 { margin: 0 0 13px; font-size: 14px; font-weight: 750; }
#contact.pg-contact-page .pg-social-icons {
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
}
#contact.pg-contact-page .pg-social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    background: #1d2939;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    transition: background .2s, transform .2s;
}
#contact.pg-contact-page .pg-social-icons a:hover,
#contact.pg-contact-page .pg-social-icons a:focus-visible {
    background: var(--pg-primary);
    transform: translateY(-2px);
    color: #fff;
}
#contact.pg-contact-page .pg-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#contact.pg-contact-page .pg-field { margin-bottom: 19px; min-width: 0; }
#contact.pg-contact-page .pg-field label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 700;
    color: #263447;
}
#contact.pg-contact-page .pg-field input,
#contact.pg-contact-page .pg-field textarea {
    display: block;
    width: 100%;
    border: 1px solid #d5dde4;
    background: #fff;
    color: var(--pg-ink);
    border-radius: 9px;
    padding: 12px 14px;
    font: inherit;
    font-size: 14px;
    outline: none;
    transition: box-shadow .2s, border-color .2s;
}
#contact.pg-contact-page .pg-field input { min-height: 46px; }
#contact.pg-contact-page .pg-field textarea { resize: vertical; min-height: 145px; }
#contact.pg-contact-page .pg-field input:focus,
#contact.pg-contact-page .pg-field textarea:focus {
    border-color: var(--pg-primary);
    box-shadow: 0 0 0 3px rgba(7,131,44,.10);
}
#contact.pg-contact-page .pg-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: var(--pg-primary);
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
    transition: background .2s;
}
#contact.pg-contact-page .pg-submit:hover { background: var(--pg-primary-dark); }
#contact.pg-contact-page .pg-captcha { margin-bottom: 18px; }
#contact.pg-contact-page .pg-faq { margin-top: 65px; }
#contact.pg-contact-page .pg-faq-heading { margin: 0 0 26px; text-align: center; }
#contact.pg-contact-page .pg-faq-heading h2 { margin: 0; font-size: clamp(25px, 2.5vw, 32px); font-weight: 800; }
#contact.pg-contact-page .pg-faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#contact.pg-contact-page .pg-faq-card { padding: 23px 24px; }
#contact.pg-contact-page .pg-faq-card h3 {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 11px;
    color: var(--pg-ink);
    font-size: 18px;
    font-weight: 750;
    line-height: 1.5;
}
#contact.pg-contact-page .pg-faq-card h3 i { color: var(--pg-primary); font-size: 19px; margin-top: 3px; }
#contact.pg-contact-page .pg-faq-answer { color: #5b687a; font-size: 14px; line-height: 1.9; }
#contact.pg-contact-page .pg-faq-answer p { margin: 0; }
#contact.pg-contact-page .pg-visit { margin-top: 25px; padding: 24px 26px; }
#contact.pg-contact-page .pg-visit h2 { font-size: 22px; font-weight: 800; margin: 0 0 12px; }
#contact.pg-contact-page .pg-visit-content { color: #566176; font-size: 14px; }
#contact.pg-contact-page :is(a,button,input,textarea):focus-visible { outline: 2px solid var(--pg-primary); outline-offset: 3px; }
@media (max-width: 950px) {
    #contact.pg-contact-page { padding: 48px 0 60px; }
    #contact.pg-contact-page .pg-layout { grid-template-columns: 1fr; }
    #contact.pg-contact-page .pg-panel { padding: 24px; }
}
@media (max-width: 650px) {
    #contact.pg-contact-page .pg-container { width: calc(100% - 28px); }
    #contact.pg-contact-page .pg-panel { padding: 20px 17px; border-radius: 15px; }
    #contact.pg-contact-page .pg-form-grid,
    #contact.pg-contact-page .pg-faq-grid { grid-template-columns: 1fr; gap: 0; }
    #contact.pg-contact-page .pg-faq-grid { gap: 13px; }
    #contact.pg-contact-page .pg-panel-title h2 { font-size: 20px; }
    #contact.pg-contact-page .pg-heading { margin-bottom: 25px; }
    #contact.pg-contact-page .pg-faq { margin-top: 47px; }
    #contact.pg-contact-page .pg-faq-card { padding: 19px; }
    #contact.pg-contact-page .pg-visit { padding: 21px 18px; }
}

/* ============================================================
   CONTACT DETAIL LINKS — entire location/phone/email card active
   Keyboard accessible, mobile-friendly and scoped to this page.
============================================================ */
#contact.pg-contact-page a.pg-info-item--link,
#contact.pg-contact-page a.pg-info-item--link:visited {
    display: flex;
    width: 100%;
    text-decoration: none;
    color: var(--pg-ink);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color .22s ease, border-color .22s ease,
                box-shadow .22s ease, transform .22s ease;
}
#contact.pg-contact-page .pg-info-item__title {
    display: block;
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 750;
    color: var(--pg-ink);
}
#contact.pg-contact-page .pg-info-item__value {
    display: block;
    color: #536176;
    font-size: 13px;
    line-height: 1.8;
    overflow-wrap: anywhere;
}
#contact.pg-contact-page .pg-info-item__value[dir="ltr"] {
    text-align: start;
    unicode-bidi: isolate;
}
#contact.pg-contact-page a.pg-info-item--link:hover,
#contact.pg-contact-page a.pg-info-item--link:focus-visible {
    background: #eaf8f0;
    border-color: #b9e6ca;
    box-shadow: 0 8px 20px rgba(7,131,44,.08);
    transform: translateY(-2px);
    color: var(--pg-ink);
}
#contact.pg-contact-page a.pg-info-item--link:hover .pg-info-icon,
#contact.pg-contact-page a.pg-info-item--link:focus-visible .pg-info-icon {
    background: #d2efdd;
}
#contact.pg-contact-page a.pg-info-item--link:focus-visible {
    outline: 2px solid var(--pg-primary);
    outline-offset: 2px;
}

/* ============================================================
   LARGE GOOGLE MAP — displayed beneath the existing visit block
============================================================ */
#contact.pg-contact-page .pg-visit-map {
    margin-top: 22px;
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid var(--pg-border);
    background: #eaf2ee;
}
#contact.pg-contact-page .pg-visit-map iframe {
    display: block;
    width: 100%;
    height: 435px;
    border: 0;
}
#contact.pg-contact-page .pg-visit-directions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 16px;
    min-height: 43px;
    padding: 10px 18px;
    color: #fff;
    background: var(--pg-primary);
    text-decoration: none;
    font-weight: 700;
    border-radius: 9px;
    transition: background .2s ease, transform .2s ease;
}
#contact.pg-contact-page .pg-visit-directions:hover,
#contact.pg-contact-page .pg-visit-directions:focus-visible {
    background: var(--pg-primary-dark);
    transform: translateY(-1px);
    color: #fff;
}
@media (max-width: 650px) {
    #contact.pg-contact-page .pg-visit-map { border-radius: 12px; }
    #contact.pg-contact-page .pg-visit-map iframe { height: 310px; }
    #contact.pg-contact-page .pg-visit-directions { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    #contact.pg-contact-page a.pg-info-item--link,
    #contact.pg-contact-page .pg-visit-directions { transition: none; transform: none !important; }
}

/* Keep Latin contact details aligned with right-to-left cards. */
#contact.pg-contact-page[dir="rtl"] .pg-info-item__value[dir="ltr"] { text-align: right; }
