/* KadaAI — pages/contact.css: the /contact page only (contact.html). Load after site.css. Classes are .pg-… */

.pg-contact-hero .hero__content{max-width:720px}

/* Three ways in */
.pg-way{gap:.85rem}
.pg-way__links{display:grid;gap:.25rem;margin-top:.25rem;list-style:none;padding:0}
.pg-way__link{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;max-width:100%;font-weight:700;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.pg-way__link .icon{flex:none;width:1.15rem;height:1.15rem;color:var(--blue-ink)}
.pg-way__link:hover{color:var(--blue-ink)}
.pg-way__link:hover span{text-decoration:underline;text-underline-offset:.2em}
.pg-way .card__foot{padding-top:.75rem;border-top:1px solid var(--border);margin-top:auto}
.pg-way .card__foot .btn--link{min-height:44px}

/* Message form: text and quick links on the left, the form card on the right */
/* Phones: text, form, then the quick links. From 960 px: text and quick links on the left, the form on the right. */
.pg-message{display:grid;gap:2rem;align-items:start;grid-template-columns:minmax(0, 1fr);grid-template-areas:"text" "form" "quick"}
.pg-message__text{grid-area:text}
.pg-message > .pg-form-card{grid-area:form}
.pg-message__quick{grid-area:quick}
@media (min-width: 960px) {.pg-message {grid-template-columns:minmax(0, 4fr) minmax(0, 7fr);grid-template-areas:"text form" "quick form";grid-template-rows:auto 1fr;column-gap:clamp(2rem, 1rem + 3vw, 4rem);row-gap:2rem} }
.pg-message__text{display:grid;gap:1rem;justify-items:start;grid-template-columns:minmax(0, 1fr)}
.pg-message__text > p:not(.eyebrow){font-size:var(--fs-lead);line-height:1.55}
.pg-message__quick{width:100%}
.pg-message__quick h3{margin-bottom:.5rem;font-size:.8125rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted)}
.pg-quick{list-style:none;padding:0;border-top:1px solid var(--border)}
.pg-quick li{border-bottom:1px solid var(--border)}
.pg-quick a{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:48px;font-weight:600;color:var(--ink);text-decoration:none}
.pg-quick a .icon{width:1.1rem;height:1.1rem;color:var(--muted);transition:transform .2s var(--ease)}
.pg-quick a:hover{color:var(--blue-ink)}
.pg-quick a:hover .icon{transform:translateX(3px);color:var(--blue-ink)}

.pg-form-card{padding:clamp(1.25rem, .6rem + 2.8vw, 2.5rem);background:#fff;border:1px solid var(--border);border-radius:var(--r-2xl);box-shadow:var(--shadow-md)}
.pg-form-card .form-actions .note{flex-basis:100%}
@media (max-width: 479.98px) {.pg-form-card .form-actions .btn {width:100%;white-space:normal}}
.pg-form-card .form-success{border-radius:var(--r-xl)}

/* The one place the address is printed, under the hero lead */
.pg-contact-mail{display:inline-flex;align-items:flex-start;gap:.55rem;font-size:1.0625rem;color:var(--ink-2)}
.pg-contact-mail .icon{flex:none;width:1.2rem;height:1.2rem;margin-top:.2em;color:var(--blue-ink)}
.pg-contact-mail a{font-weight:700;overflow-wrap:anywhere}