/* Figma Contact 109:3644. */
.contact-view { --home-heading:#19093e; }
.contact-view .page-hero>div:after { background-size:100% 100%; }
.contact-dashboard { width:100%; max-width:none; padding:32px max(40px,calc((100% - 1360px)/2)) 80px; margin:0; display:grid; grid-template-columns:minmax(0,898.66fr) minmax(0,437.34fr); gap:24px; align-items:start; }
.contact-primary,.contact-secondary { display:flex; flex-direction:column; gap:24px; min-width:0; }
.contact-request,.contact-map-card,.reach-card,.hours-card,.payment-options,.contact-social { border:1px solid #ebecff; border-radius:32px; background:#fff; overflow:hidden; }
.contact-request { padding:40px; }
.contact-request h2 { font-size:48px; line-height:48px; color:#19093e; margin:28px 0 32px; }
.contact-request form { display:flex; flex-direction:column; gap:24px; }
.contact-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.contact-request label { display:flex; flex-direction:column; gap:12px; min-width:0; color:#19093e; font-size:14px; line-height:20px; font-weight:500; }
.contact-request input,.contact-request select,.contact-request textarea { width:100%; border:1px solid #e5e7eb; border-radius:12px; background:#f9fafb; padding:12px 16px; min-height:52px; font:400 16px/24px Inter,sans-serif; color:#19093e; }
.contact-request input::placeholder,.contact-request textarea::placeholder { color:#9ca3af; opacity:1; }
.contact-request textarea { height:176px; resize:vertical; }
.contact-request button { min-height:56px; border:0; border-radius:12px; background:#0e1792; color:white; font:700 16px/24px 'Cormorant Garamond',serif; display:flex; align-items:center; justify-content:center; gap:12px; cursor:pointer; }
.contact-request button img { width:20px; height:20px; }
.reach-card { padding:40px; background:#0e1792; border-color:#0e1792; color:white; }
.contact-label { height:48px; display:flex; gap:12px; align-items:center; }
.contact-label i { width:48px; height:48px; flex-shrink:0; border-radius:12px; display:grid; place-items:center; }
.reach-card .contact-label i { background:#ffffff33; }
.contact-label span { font:600 14px/20px 'Cormorant Garamond',serif; letter-spacing:.7px; }
.reach-card .contact-label span { color:#fffc; }
.reach-card>h2,.hours-card>h2 { font-size:36px; line-height:40px; margin:20px 0; color:inherit; }
.reach-list { display:flex; flex-direction:column; gap:24px; }
.reach-list>div { display:flex; gap:16px; align-items:flex-start; }
.reach-list>div>i { width:40px; height:40px; flex-shrink:0; border-radius:50%; background:#ffffff1a; display:grid; place-items:center; }
.reach-list p { margin:0; }
.reach-list p span { display:block; color:#fff9; font-size:14px; line-height:20px; }
.reach-list a,.reach-list b { display:block; color:white; font:700 18px/28px 'Cormorant Garamond',serif; }
.hours-card { padding:40px; background:#fbf8ef; border-color:#f3eacc; color:#19093e; }
.hours-card .contact-label i { background:white; }
.hours-card>div:last-child { display:flex; flex-direction:column; gap:16px; }
.hours-card p { min-height:33px; display:flex; align-items:flex-start; justify-content:space-between; gap:24px; border-bottom:1px solid #e5e7eb; margin:0; font-size:16px; line-height:24px; }
.hours-card p b { font-weight:500; }
.payment-options { padding:32px 40px; background:#fbf8ef; border-color:#f3eacc; }
.payment-options h2 { margin:0 0 20px; font-size:30px; line-height:1.2; color:#19093e; }
.payment-options>div { display:flex; gap:12px; flex-wrap:wrap; }
.payment-options span { min-width:112px; padding:13px 22px; border:1px solid #e7dcae; border-radius:999px; background:white; text-align:center; font-weight:700; color:#0e1792; }
.contact-map-card { padding:40px; height:301px; position:relative; }
.contact-map-card>img { width:100%; height:100%; object-fit:cover; }

.contact-map-card>a { position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%,-50%); min-width:244px; padding:12px 24px; border-radius:999px; background:white; box-shadow:0 8px 5px #0000001a,0 20px 13px #0000001a; color:#19093e; display:flex; justify-content:center; align-items:center; gap:8px; font:700 16px/24px 'Cormorant Garamond',serif; }
.contact-social { height:301px; padding:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.contact-social h2 { font-size:24px; line-height:32px; color:#19093e; margin:0 0 24px; }
.contact-social>div { display:flex; gap:16px; }
.contact-social a { width:56px; height:56px; border-radius:50%; background:#f9fafb; box-shadow:0 1px 1px #0000000d; display:grid; place-items:center; transition:transform .2s,background .2s; }
@media(hover:hover) { .contact-request button:hover { background:#070d70; } .contact-social a:hover { transform:translateY(-3px); background:#f3eacc; } }
@media(max-width:1000px) { .contact-dashboard { padding:32px 28px 64px; grid-template-columns:1fr; } .contact-secondary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .reach-card { grid-row:span 2; } .contact-social>div { display:grid; grid-template-columns:repeat(2,56px); } }
@media(max-width:700px) { .contact-secondary { display:flex; } .contact-fields { grid-template-columns:1fr; } }
@media(max-width:600px) { .contact-dashboard { padding:32px 20px 48px; } .contact-request,.contact-map-card,.reach-card,.hours-card,.payment-options,.contact-social { border-radius:24px; padding:24px; } .contact-request h2 { font-size:40px; line-height:42px; margin:12px 0 28px; } .contact-request textarea { height:150px; } .contact-map-card { height:260px; }  .contact-map-card>a { min-width:220px; } .contact-social { height:240px; } .contact-social>div { display:flex; gap:8px; } .contact-social a { width:52px; height:52px; } }

/* The contact page uses the same appointment fields as the homepage. */
.contact-request .appointment-form { display:flex; flex-direction:column; gap:20px; padding:0; border:0; box-shadow:none; }
.contact-request .appointment-form .field-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.contact-request .appointment-form label { min-width:0; }
.contact-request .appointment-form select:disabled { background:#f7f7fa; color:#777; }
.contact-request .appointment-form small { text-align:center; color:#777; }
@media(max-width:600px) { .contact-request .appointment-form .field-row { grid-template-columns:1fr; } }

.payment-options span { display:inline-flex; align-items:center; justify-content:center; }
.payment-options span img { display:block; width:90px; height:30px; object-fit:contain; }

.contact-map-card { padding:0; }
.contact-map-card iframe { display:block; width:100%; height:100%; border:0; }
@media(max-width:600px) { .contact-map-card { padding:0; } }
