.contact-panel {
  inset:0 0 0 auto;
  width:min(560px,100%);
  height:100%;
  height:100dvh;
  max-width:100%;
  max-height:100%;
  margin:0;
  padding:0;
  border:0;
  border-left:1px solid var(--line);
  color:var(--ink);
  background:var(--page);
  box-shadow:-18px 0 80px #19353126;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
html:has(.contact-panel[open]) { overflow:hidden; }
.contact-panel[open] { animation:contact-panel-enter 280ms cubic-bezier(.2,.8,.2,1) both; }
.contact-panel::backdrop { background:#142d2866; backdrop-filter:blur(3px); }
.contact-panel[open]::backdrop { animation:contact-backdrop-enter 280ms ease both; }
.contact-panel.is-closing { animation:contact-panel-exit 200ms ease both; }
.contact-panel.is-closing::backdrop { animation:contact-backdrop-exit 200ms ease both; }
.contact-panel-bar {
  display:flex;
  align-items:center;
  gap:14px;
  position:sticky;
  top:0;
  z-index:1;
  min-height:80px;
  padding:14px 32px;
  padding-top:max(14px,env(safe-area-inset-top));
  background:var(--page);
  border-bottom:1px solid var(--line);
}
.contact-panel-bar img { display:block; width:auto; height:40px; }
.contact-panel-bar>span { font-size:10px; font-weight:650; letter-spacing:1.5px; color:var(--muted); }
.contact-panel-close {
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  margin-left:auto;
  padding:0;
  border:1px solid var(--line);
  border-radius:50%;
  background:white;
  color:var(--green);
}
.contact-panel-close svg { width:20px; height:20px; }
.contact-panel-content { padding:30px 32px max(32px,env(safe-area-inset-bottom)); }
.contact-panel-location { color:var(--green); font-size:12px; font-weight:600; }
.contact-panel-intro h2 {
  max-width:380px;
  margin:10px 0 14px;
  font-size:36px;
  line-height:1.12;
  letter-spacing:-1.2px;
  font-weight:550;
  text-wrap:balance;
}
.contact-panel-intro>p:last-child { max-width:420px; color:var(--muted); font-size:14px; line-height:1.7; }
.contact-panel-channels { display:grid; gap:10px; margin:26px 0 22px; }
.contact-channel {
  display:flex;
  align-items:center;
  gap:14px;
  min-height:82px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:white;
  text-decoration:none;
  box-shadow:0 3px 10px #19353104;
  transition:background 160ms,border-color 160ms,transform 160ms;
}
.contact-channel-icon { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:50%; color:var(--green); background:var(--soft); }
.contact-channel-icon svg { width:22px; height:22px; }
.contact-channel>svg { width:19px; height:19px; margin-left:auto; flex:0 0 19px; color:var(--green); }
.contact-channel-copy { display:grid; gap:2px; min-width:0; }
.contact-channel-copy strong { font-size:18px; font-weight:600; line-height:1.4; }
.contact-channel-copy>span { font-size:12px; color:var(--muted); }
.contact-channel-copy .contact-channel-email { font-size:16px; overflow-wrap:anywhere; }
.contact-channel-phone { background:var(--green); border-color:var(--green); color:white; box-shadow:0 7px 16px #24594e18; }
.contact-channel-phone .contact-channel-icon { color:white; background:#ffffff1a; }
.contact-channel-phone .contact-channel-copy>span { color:#e0eae4; }
.contact-channel-phone>svg { color:white; }
.contact-panel-visit { background:#eaf0e9; padding:22px; border-radius:16px; }
.contact-visit-address,.contact-visit-hours { display:flex; align-items:flex-start; gap:12px; }
.contact-visit-address>div { flex:1; min-width:0; }
.contact-panel-visit svg { width:19px; height:19px; flex:0 0 19px; margin-top:2px; color:var(--green); }
.contact-panel-visit h3 { font-size:14px; font-weight:600; }
.contact-panel-visit address { margin-top:6px; font-style:normal; color:var(--muted); font-size:13px; line-height:1.7; }
.contact-panel-visit a,.contact-panel-company a { display:inline-flex; align-items:center; gap:6px; width:max-content; max-width:100%; min-height:44px; color:var(--green); font-size:12px; font-weight:600; text-decoration:underline; text-underline-offset:4px; }
.contact-panel-visit a { white-space:nowrap; }
.contact-panel-visit a svg,.contact-panel-company a svg { width:15px; height:15px; margin:0; }
.contact-visit-hours { border-top:1px solid #d4dfd2; padding-top:14px; margin-top:4px; }
.contact-visit-hours strong,.contact-visit-hours span { display:block; font-size:12px; font-weight:400; }
.contact-visit-hours strong { font-weight:600; }
.contact-visit-hours span { color:var(--muted); margin-top:2px; }
.contact-panel-company { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
.contact-panel-company .eyebrow { font-size:9px; letter-spacing:1.4px; color:var(--muted); }
.contact-panel-company h3 { font-size:19px; font-weight:600; margin:8px 0; letter-spacing:-.3px; }
.contact-panel-company>p:not(.eyebrow) { font-size:13px; line-height:1.75; color:var(--muted); }
.contact-panel-company>a { margin-top:4px; }
@media(hover:hover) {
  .contact-channel:hover { border-color:#9eb6a6; background:#f0f5f0; transform:translateX(-2px); }
  .contact-channel-phone:hover { background:var(--green-dark); border-color:var(--green-dark); }
  .contact-panel-close:hover { background:var(--soft); }
}
@media(max-width:560px) {
  .contact-panel { border-left:0; }
  .contact-panel-bar { padding-inline:22px; min-height:72px; }
  .contact-panel-content { padding:24px 22px max(28px,env(safe-area-inset-bottom)); }
  .contact-panel-intro h2 { font-size:33px; }
}
@media(max-width:360px) {
  .contact-panel-bar { padding-inline:16px; }
  .contact-panel-content { padding-inline:16px; }
  .contact-channel { gap:10px; padding:14px 12px; }
  .contact-channel-icon { width:34px; height:34px; flex-basis:34px; }
  .contact-channel-copy strong { font-size:16px; }
  .contact-channel-copy .contact-channel-email { font-size:14px; }
  .contact-panel-visit { padding:18px; }
}
@keyframes contact-panel-enter { from { transform:translateX(100%); } to { transform:translateX(0); } }
@keyframes contact-panel-exit { from { transform:translateX(0); } to { transform:translateX(100%); } }
@keyframes contact-backdrop-enter { from { background:#142d2800; backdrop-filter:blur(0); } to { background:#142d2866; backdrop-filter:blur(3px); } }
@keyframes contact-backdrop-exit { from { background:#142d2866; backdrop-filter:blur(3px); } to { background:#142d2800; backdrop-filter:blur(0); } }
@media(prefers-reduced-motion:reduce) {
  .contact-panel[open],.contact-panel[open]::backdrop { animation:none; }
  .contact-panel .contact-channel { transition:none; }
}
@media print { .contact-panel { display:none!important; } }