/* Gript -- Contact */
.page-hero{padding:var(--hero-pad-top) var(--hero-pad-x) 16px;text-align:center}
.page-hero h1{font-family:var(--font);font-size:var(--hero-h1-size);font-weight:700;letter-spacing:var(--hero-h1-tracking);line-height:var(--hero-h1-leading);margin-bottom:16px}
.page-hero p{font-size:var(--hero-sub-size);color:var(--ink-2);max-width:480px;margin:0 auto;line-height:var(--hero-sub-leading)}

.contact-wrapper{box-sizing:border-box;width:100%;max-width:760px;margin:0 auto;padding:0 clamp(20px,5.6vw,48px) clamp(48px,6vw,80px)}

.contact-form{display:block;width:100%;margin-bottom:clamp(32px,5vw,56px)}
.contact-form iframe{display:block;width:100%!important;max-width:100%!important}

.contact-info{display:block;width:100%}
.contact-info h2{font-family:var(--font);font-size:18px;font-weight:700;letter-spacing:-0.3px;margin-bottom:20px}
/* auto-fit so the third block (demo booking) flows into its own column on
   desktop instead of orphaning itself under a 2-up grid */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:clamp(16px,3vw,32px)}
@media(max-width:560px){.info-grid{grid-template-columns:1fr}}
.info-block h3{font-family:var(--font);font-size:15px;font-weight:700;margin-bottom:6px}
.info-block p{font-size:14px;color:var(--ink-2);line-height:1.6}
.info-block a{color:var(--ink);font-weight:600;text-decoration:none}
.info-block a:hover{text-decoration:underline}